@nimbus-ds/patterns 1.36.0 → 1.38.1

package/CHANGELOG.md

@@ -2,6 +2,26 @@
 
 Nimbus is an open-source Design System created by Tiendanube / Nuvesmhop's team to empower and enhance more stories every day, with simplicity, accessibility, consistency and performance.
 
+## 2026-09-02 `1.38.1`
+
+### 💡 Others
+
+- Test release para verificar el pipeline de publicación end-to-end tras la
+  unificación de workflows de GitHub Actions (ONB-1164). Sin cambios funcionales —
+  solo un comentario en el código. ([#194](https://github.com/TiendaNube/nimbus-patterns/pull/194) by [@EzeNube](https://github.com/EzeNube))
+
+## 2026-07-24 `1.38.0`
+
+#### 🎉 New features
+
+- Added `BottomSheet` component: a mobile-first modal sheet with configurable snap points, a drag gesture to resize or dismiss, focus trapping, background scroll locking, on-screen keyboard handling, and `BottomSheet.Header`/`BottomSheet.Body`/`BottomSheet.Footer` subcomponents. ([#177](https://github.com/TiendaNube/nimbus-patterns/pull/177) by [@jffs](https://github.com/jffs))
+
+## 2026-07-15 `1.37.0`
+
+#### 🎉 New features
+
+- `NavTabs`: Added an `appearance` prop to `NavTabs.Item`, with an `"ai-generative"` variant that renders a gradient border and a fixed AI icon for AI entry points such as an assistant button. ([#176](https://github.com/TiendaNube/nimbus-patterns/pull/176) by [@jffs](https://github.com/jffs))
+
 ## 2026-06-25 `1.36.0`
 
 #### 🎉 New features

package/dist/BottomSheet/index.d.ts

@@ -0,0 +1,196 @@
+// Generated by dts-bundle-generator v8.1.2
+
+import React from 'react';
+import { FC, HTMLAttributes, ReactNode } from 'react';
+
+export type BottomSheetPadding = "none" | "base";
+/**
+ * A snap point expressed as a viewport-height percentage (e.g. "60%") or the
+ * keyword "full" (edge-to-edge, covering the full viewport height).
+ */
+export type BottomSheetSnapPoint = `${number}%` | "full";
+/**
+ * Predicate variant of `closeOnOutsidePress`: receives the DOM event and
+ * returns `true` to allow closing, `false` to ignore the press.
+ */
+export type CloseOnOutsidePress = (event: PointerEvent | MouseEvent) => boolean;
+export interface BottomSheetProperties {
+	/**
+	 * Determines if the bottom sheet is shown or not.
+	 * @default false
+	 */
+	open?: boolean;
+	/**
+	 * Callback fired when the component requests to be closed (overlay press,
+	 * close control, Escape, or a downward dismiss gesture).
+	 * () => void;
+	 */
+	onRemove?: () => void;
+	/**
+	 * Ordered list of heights the sheet can snap to. Each entry is a
+	 * viewport-height percentage (e.g. "60%") or the keyword "full".
+	 * @default ["60%", "90%", "full"]
+	 */
+	snapPoints?: BottomSheetSnapPoint[];
+	/**
+	 * Index within `snapPoints` used as the initial snap point.
+	 * @default 0
+	 */
+	defaultSnap?: number;
+	/**
+	 * Content of the sheet. Compose with BottomSheet.Header, BottomSheet.Body
+	 * and BottomSheet.Footer.
+	 * @TJS-type React.ReactNode
+	 */
+	children?: ReactNode;
+	/**
+	 * Controls whether pressing outside should close the sheet.
+	 * - boolean: enable/disable dismissal on outside press
+	 * - function: receive the DOM event and return true to allow closing
+	 * @default true
+	 */
+	closeOnOutsidePress?: boolean | CloseOnOutsidePress;
+	/**
+	 * The attribute name to ignore when checking for outside presses, so
+	 * portaled Popover/Modal content does not close the sheet.
+	 * @default "data-nimbus-outside-press-ignore"
+	 */
+	ignoreAttributeName?: string;
+	/**
+	 * Determines if background scroll is locked while the sheet is open.
+	 * @default true
+	 */
+	needRemoveScroll?: boolean;
+	/**
+	 * Accessible name (`aria-label`) for the drag grabber. Override for
+	 * non-English locales, since the built-in default is English-only.
+	 * @default "Drag to resize or dismiss"
+	 */
+	grabberLabel?: string;
+	/**
+	 * Explicit z-index for the sheet layer. Omitted by default: like Nimbus's
+	 * own Sidebar/Modal/Popover, the sheet relies on DOM mount order rather
+	 * than a z-index. Its portal mounts into the nearest Nimbus
+	 * <ThemeProvider>'s own wrapper element (the same container
+	 * Sidebar/Modal/Popover portal into), falling back to document.body only
+	 * when no ThemeProvider is present. In both cases, later-mounted siblings
+	 * paint on top of earlier ones as long as neither sets a z-index, so this
+	 * keeps the sheet correctly stacked against Popover and other BottomSheet
+	 * instances. Only set this to force a specific stacking order against
+	 * something outside that convention.
+	 */
+	zIndex?: number;
+}
+/**
+ * Public props for `BottomSheet`. Combines `BottomSheetProperties` (the
+ * sheet's own behavior — visibility, snap points, dismissal, stacking) with
+ * `root` and every native `div` attribute except `color`.
+ */
+export type BottomSheetProps = BottomSheetProperties & {
+	/**
+	 * Root element where the portal should be mounted. When provided and not
+	 * null, the portal renders inside this element. Otherwise it renders into
+	 * the nearest Nimbus <ThemeProvider>'s own wrapper element (same as
+	 * Sidebar/Modal/Popover), so it inherits the active theme's CSS custom
+	 * properties and stacks correctly against them; it falls back to
+	 * document.body only when no ThemeProvider is present. Useful to scope the
+	 * sheet within a container (e.g., AppShell.Chat).
+	 */
+	root?: HTMLElement | null;
+} & Omit<HTMLAttributes<HTMLDivElement>, "color">;
+export interface BottomSheetHeaderProperties {
+	/**
+	 * The content of the sheet header. Accepts any node (title, actions, icons).
+	 * @TJS-type React.ReactNode
+	 */
+	children?: ReactNode;
+	/**
+	 * The padding around the header content area.
+	 * @default base
+	 */
+	padding?: BottomSheetPadding;
+}
+/**
+ * Public props for `BottomSheet.Header`. Combines `BottomSheetHeaderProperties`
+ * with every native element attribute except `color` (same reason as
+ * `BottomSheetProps`: it conflicts with Box's own color-token sprinkle).
+ */
+export type BottomSheetHeaderProps = BottomSheetHeaderProperties & Omit<HTMLAttributes<HTMLElement>, "color">;
+export interface BottomSheetBodyProperties {
+	/**
+	 * The scrollable content of the sheet.
+	 * @TJS-type React.ReactNode
+	 */
+	children: ReactNode;
+	/**
+	 * The padding around the body content area.
+	 * @default base
+	 */
+	padding?: BottomSheetPadding;
+}
+/**
+ * Public props for `BottomSheet.Body`. Combines `BottomSheetBodyProperties`
+ * (`children` is required, unlike `Header`'s) with every native element
+ * attribute except `color`.
+ */
+export type BottomSheetBodyProps = BottomSheetBodyProperties & Omit<HTMLAttributes<HTMLElement>, "color">;
+export interface BottomSheetFooterProperties {
+	/**
+	 * The content of the sheet footer.
+	 * @TJS-type React.ReactNode
+	 */
+	children: ReactNode;
+	/**
+	 * The padding around the footer content area.
+	 * @default base
+	 */
+	padding?: BottomSheetPadding;
+}
+/**
+ * Public props for `BottomSheet.Footer`. Combines `BottomSheetFooterProperties`
+ * (`children` is required, same as `Body`) with every native element
+ * attribute except `color`. `BottomSheet.Footer` itself is optional to
+ * render at all — omitting it entirely is how a sheet renders without a
+ * footer region.
+ */
+export type BottomSheetFooterProps = BottomSheetFooterProperties & Omit<HTMLAttributes<HTMLElement>, "color">;
+/**
+ * The composable subcomponents attached to `BottomSheet`
+ * (`BottomSheet.Header`, `BottomSheet.Body`, `BottomSheet.Footer`), used to
+ * compose the sheet's `children`.
+ */
+export interface BottomSheetComponents {
+	/** Chrome region above the body; the drag grabber is pinned above it. */
+	Header: FC<BottomSheetHeaderProps>;
+	/** The scrollable content region. */
+	Body: FC<BottomSheetBodyProps>;
+	/** Optional chrome region below the body (e.g. action buttons). */
+	Footer: FC<BottomSheetFooterProps>;
+}
+declare const BottomSheetBase: React.FC<BottomSheetProps>;
+/**
+ * A mobile-first modal sheet that slides up from the bottom edge, with
+ * configurable snap points and a pointer-driven drag gesture to resize
+ * between them or dismiss by dragging down.
+ *
+ * Controlled via `open`/`onRemove`, the same contract as `Sidebar`: the
+ * component never changes its own visibility, it only requests to close (via
+ * overlay press, Escape, or a downward dismiss gesture) — the consumer sets
+ * `open` to `false` in response.
+ *
+ * Compose with `BottomSheet.Header` (optional), `BottomSheet.Body`
+ * (required), and `BottomSheet.Footer` (optional) as `children`.
+ *
+ * Behaves as a modal: renders as `role="dialog"`/`aria-modal="true"`, dims
+ * and blocks the background, traps focus while open, and restores it to the
+ * previously focused element on close. Automatically labels the dialog via
+ * `aria-labelledby` pointing at `BottomSheet.Header` when one is present;
+ * pass an explicit `aria-label`/`aria-labelledby` to override that.
+ */
+export declare const BottomSheet: typeof BottomSheetBase & BottomSheetComponents;
+
+export {
+	BottomSheet as default,
+};
+
+export {};

package/dist/BottomSheet/index.js

@@ -0,0 +1,2 @@
+"use client";
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react"),require("react-dom"),require("@nimbus-ds/components"),require("@nimbus-ds/styles")):"function"==typeof define&&define.amd?define(["react","react-dom","@nimbus-ds/components","@nimbus-ds/styles"],t):"object"==typeof exports?exports["@nimbus-ds/patterns"]=t(require("react"),require("react-dom"),require("@nimbus-ds/components"),require("@nimbus-ds/styles")):e["@nimbus-ds/patterns"]=t(e.react,e["react-dom"],e["@nimbus-ds/components"],e["@nimbus-ds/styles"])}(global,((e,t,n,r)=>(()=>{"use strict";var o={8446:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.BottomSheet=void 0;const r=n(5163).__importStar(n(8156)),o=n(7111),i=n(5280),a=n(7990),s=n(9096),l=n(2893),u=n(3687),c=n(8555),d=n(3040),f=n(7370),p=n(3636),m=n(749),b=n(9628),y=n(8002),h=n(1051),v=n(9773);let _=0;t.BottomSheet=({open:e=!1,onRemove:t,snapPoints:n=[...s.DEFAULT_SNAP_POINTS],defaultSnap:b=s.DEFAULT_SNAP_INDEX,children:y,closeOnOutsidePress:E=!0,ignoreAttributeName:S=s.DEFAULT_IGNORE_ATTRIBUTE_NAME,needRemoveScroll:w=!0,grabberLabel:g=s.DEFAULT_GRABBER_LABEL,zIndex:O,root:T,...x})=>{const I=(0,l.isValidAttributeName)(S)?S:s.DEFAULT_IGNORE_ATTRIBUTE_NAME,[L,P]=(0,r.useState)((()=>(0,l.clampIndex)(b,n.length))),D=(0,r.useRef)(null),A=(0,r.useRef)(null),R=(0,r.useRef)(null),B=(0,r.useRef)(null);B.current=T??null;const N=(0,r.useRef)(void 0);N.current||(_+=1,N.current=`bottom-sheet-header-${_}`);const j=(0,r.useRef)(!1);(0,r.useEffect)((()=>{e?(j.current?P((e=>(0,l.clampIndex)(e,n.length))):P((0,l.clampIndex)(b,n.length)),j.current=!0):j.current=!1}),[e,n.length]);const{snaps:M,containerHeight:H}=(0,m.useSnapPoints)(n,B),C=(0,f.useKeyboardInset)(e),{refThemeProvider:F}=(0,a.useTheme)(),k=(0,r.useCallback)((()=>t?.()),[t]),{offset:G,isDragging:z,grabberHandlers:U}=(0,c.useDragGesture)({snaps:M,snapIndex:L,containerHeight:H,onSnapChange:P,onDismiss:k});if((0,p.useScrollLock)(e&&w,A),(0,d.useFocusTrap)(A,e),(0,u.useDismissHandlers)({enabled:e,panelRef:A,overlayRef:D,closeOnOutsidePress:E,ignoreAttributeName:I,onRequestClose:k}),!e)return null;const Y=Math.max(0,H-G),V=H>0&&G<=0,K="undefined"!=typeof document?T??F?.current??document.body:null;if(!K)return null;const{style:q,...X}=x,$="aria-label"in X||"aria-labelledby"in X;let W;const Z=$?y:r.default.Children.map(y,(e=>{if(r.default.isValidElement(e)&&e.type===h.BottomSheetHeader){const t=e;return W=t.props.id??N.current,r.default.cloneElement(t,{id:W})}return e})),J={[I]:""};return(0,o.createPortal)(r.default.createElement(r.default.Fragment,null,r.default.createElement("div",{ref:D,...J,style:{position:"fixed",top:0,left:0,right:0,bottom:0,backgroundColor:"var(--nimbus-colors-neutral-textHigh)",opacity:.4,zIndex:O}}),r.default.createElement("div",{ref:A,role:"dialog","aria-modal":"true","aria-labelledby":$?void 0:W,tabIndex:-1,...J,...X,style:{...q,position:"fixed",left:0,right:0,display:"flex",flexDirection:"column",backgroundColor:"var(--nimbus-colors-neutral-background)",boxSizing:"border-box",bottom:0,height:Y,paddingBottom:C,zIndex:O,borderTopLeftRadius:V?0:"var(--nimbus-shape-border-radius-6)",borderTopRightRadius:V?0:"var(--nimbus-shape-border-radius-6)",transition:z?"none":s.SETTLE_TRANSITION}},r.default.createElement(v.Grabber,{ref:R,onPointerDown:U.onPointerDown,snapIndex:L,snapCount:M.length,onSnapChange:P,pillHidden:V,label:g}),r.default.createElement(i.Box,{display:"flex",flexDirection:"column",flex:"1",minHeight:"0"},Z))),K)},t.BottomSheet.Header=h.BottomSheetHeader,t.BottomSheet.Body=b.BottomSheetBody,t.BottomSheet.Footer=y.BottomSheetFooter,t.BottomSheet.displayName="BottomSheet",t.BottomSheet.Header.displayName="BottomSheet.Header",t.BottomSheet.Body.displayName="BottomSheet.Body",t.BottomSheet.Footer.displayName="BottomSheet.Footer"},9096:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.DEFAULT_GRABBER_LABEL=t.FLOATING_UI_PORTAL_SELECTOR=t.DEFAULT_IGNORE_ATTRIBUTE_NAME=t.PADDING_TOKEN_MAP=t.SETTLE_TRANSITION=t.VELOCITY_IDLE_RESET_MS=t.DISMISS_VELOCITY_THRESHOLD=t.DISMISS_DISTANCE_THRESHOLD=t.DEFAULT_SNAP_INDEX=t.DEFAULT_SNAP_POINTS=void 0,t.DEFAULT_SNAP_POINTS=["60%","90%","full"],t.DEFAULT_SNAP_INDEX=0,t.DISMISS_DISTANCE_THRESHOLD=96,t.DISMISS_VELOCITY_THRESHOLD=.5,t.VELOCITY_IDLE_RESET_MS=100,t.SETTLE_TRANSITION="height 300ms cubic-bezier(0.32, 0.72, 0, 1), bottom 300ms cubic-bezier(0.32, 0.72, 0, 1), border-radius 300ms cubic-bezier(0.32, 0.72, 0, 1)",t.PADDING_TOKEN_MAP={none:"none",base:"4"},t.DEFAULT_IGNORE_ATTRIBUTE_NAME="data-nimbus-outside-press-ignore",t.FLOATING_UI_PORTAL_SELECTOR="[data-floating-ui-portal]",t.DEFAULT_GRABBER_LABEL="Drag to resize or dismiss"},2893:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.isValidAttributeName=t.clampIndex=void 0;t.clampIndex=(e,t)=>Math.min(Math.max(e,0),Math.max(t-1,0));t.isValidAttributeName=e=>/^-?[a-zA-Z_][a-zA-Z0-9_-]*$/.test(e)},3687:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useDismissHandlers=void 0;const r=n(8156),o=n(9096),i=[];t.useDismissHandlers=({enabled:e,panelRef:t,overlayRef:n,closeOnOutsidePress:a=!0,ignoreAttributeName:s,onRequestClose:l})=>{(0,r.useEffect)((()=>{if(!e||"undefined"==typeof document)return;const r={};i.push(r);const u=e=>{const r=e.target;if(!r)return;if(t.current?.contains(r))return;!(n.current?.contains(r)??!1)&&r instanceof Element&&r.closest(`[${s}], ${o.FLOATING_UI_PORTAL_SELECTOR}`)||(e=>"function"==typeof a?a(e):a)(e)&&l()},c=e=>{"Escape"===e.key&&i.at(-1)===r&&l()};return document.addEventListener("pointerdown",u,!0),document.addEventListener("keydown",c),()=>{document.removeEventListener("pointerdown",u,!0),document.removeEventListener("keydown",c);const e=i.indexOf(r);-1!==e&&i.splice(e,1)}}),[e,t,n,a,s,l])}},8555:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useDragGesture=void 0;const r=n(8156),o=n(9096);t.useDragGesture=({snaps:e,snapIndex:t,containerHeight:n,onSnapChange:i,onDismiss:a})=>{const s=e[t],[l,u]=(0,r.useState)(null),[c,d]=(0,r.useState)(!1),f=(0,r.useMemo)((()=>(e=>e.map(((e,t)=>({...e,index:t}))).sort(((e,t)=>e.height-t.height)))(e)),[e]),p=(0,r.useRef)({ascendingSnaps:f,containerHeight:n});p.current={ascendingSnaps:f,containerHeight:n};const m=(0,r.useRef)(null),b=(0,r.useRef)(null),y=()=>{const e=b.current;e&&(document.removeEventListener("pointermove",e.move),document.removeEventListener("pointerup",e.up),document.removeEventListener("pointercancel",e.cancel),b.current=null)},h=(0,r.useCallback)((e=>{const{ascendingSnaps:t,containerHeight:n}=p.current,r=t.at(-1)?.offset??0,i=(t[0]?.offset??n)+2*o.DISMISS_DISTANCE_THRESHOLD;return Math.min(Math.max(e,r),i)}),[]),v=(0,r.useCallback)((e=>{if(!m.current)return;const t=e.timeStamp,n=t-m.current.lastTime||1,r=e.clientY-m.current.lastClientY;m.current.velocity=r/n,m.current.lastClientY=e.clientY,m.current.lastTime=t;const o=m.current.startOffset+(e.clientY-m.current.startClientY),i=h(o);m.current.currentOffset=i,u(i)}),[h]),_=(0,r.useCallback)((e=>{const n=m.current;if(m.current=null,d(!1),u(null),!n)return;const r=e.timeStamp-n.lastTime>o.VELOCITY_IDLE_RESET_MS?0:n.velocity,s=((e,t,n)=>{const r=n[0],i=e>r.offset+o.DISMISS_DISTANCE_THRESHOLD,a=t>o.DISMISS_VELOCITY_THRESHOLD&&e>=r.offset;if(i||a)return{dismiss:!0};let s=n.reduce(((t,n)=>Math.abs(e-n.offset)<Math.abs(e-t.offset)?n:t),n[0]);if(Math.abs(t)>o.DISMISS_VELOCITY_THRESHOLD){const e=n.findIndex((e=>e.index===s.index));if(t>0&&e>0){const t=n[e-1];t.height<s.height&&(s=t)}else if(t<0&&e<n.length-1){const t=n[e+1];t.height>s.height&&(s=t)}}return{dismiss:!1,index:s.index}})(n.currentOffset,r,p.current.ascendingSnaps);s.dismiss?a():s.index!==t&&i(s.index),y()}),[t,i,a]),E=(0,r.useCallback)((()=>{m.current=null,d(!1),u(null),y()}),[]),S=(0,r.useCallback)((e=>{s&&(m.current={startClientY:e.clientY,startOffset:s.offset,lastClientY:e.clientY,lastTime:e.timeStamp,velocity:0,currentOffset:s.offset},d(!0),document.addEventListener("pointermove",v),document.addEventListener("pointerup",_),document.addEventListener("pointercancel",E),b.current={move:v,up:_,cancel:E})}),[s,v,_,E]);(0,r.useEffect)((()=>()=>{y(),m.current=null}),[]);const w=l??s?.offset??0;return(0,r.useMemo)((()=>({offset:w,isDragging:c,grabberHandlers:{onPointerDown:S}})),[w,c,S])}},3040:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useFocusTrap=void 0;const r=n(8156),o=["a[href]","button:not([disabled])","textarea:not([disabled])","input:not([disabled])","select:not([disabled])",'[tabindex]:not([tabindex="-1"])'].join(","),i=e=>Array.from(e.querySelectorAll(o));t.useFocusTrap=(e,t)=>{(0,r.useEffect)((()=>{const n=e.current;if(!t||!n||"undefined"==typeof document)return;const r=document.activeElement;((e,t)=>e.find((e=>"separator"!==e.getAttribute("role")))??e[0]??t)(i(n),n).focus();const o=e=>{if("Tab"!==e.key)return;const t=i(n);if(0===t.length)return void e.preventDefault();const r=t[0],o=t.at(-1),a=document.activeElement;e.shiftKey&&a===r?(e.preventDefault(),o.focus()):e.shiftKey||a!==o||(e.preventDefault(),r.focus())};return n.addEventListener("keydown",o),()=>{n.removeEventListener("keydown",o),r?.focus?.()}}),[e,t])}},7370:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useKeyboardInset=void 0;const r=n(8156),o=(e,t,n)=>{Promise.resolve(e).then((e=>{t()?e.remove():n((()=>e.remove()))}))};t.useKeyboardInset=e=>{const[t,n]=(0,r.useState)(0);return(0,r.useEffect)((()=>{if(!e||"undefined"==typeof window)return void n(0);const t=(()=>{if("undefined"==typeof window)return null;const e=window.Capacitor;return e?.isPluginAvailable?.("Keyboard")?e.Plugins?.Keyboard??null:null})();if(t){let e,r,i=!1;return o(t.addListener("keyboardWillShow",(e=>{n(Math.max(0,Math.round(e?.keyboardHeight??0)))})),(()=>i),(t=>{e=t})),o(t.addListener("keyboardWillHide",(()=>n(0))),(()=>i),(e=>{r=e})),()=>{i=!0,e?.(),r?.(),n(0)}}if(!window.visualViewport)return void n(0);const r=window.visualViewport,i=()=>{const e=window.innerHeight-r.height-r.offsetTop;n(Math.max(0,Math.round(e)))};return i(),r.addEventListener("resize",i),r.addEventListener("scroll",i),window.addEventListener("resize",i),()=>{r.removeEventListener("resize",i),r.removeEventListener("scroll",i),window.removeEventListener("resize",i),n(0)}}),[e]),t}},3636:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useScrollLock=void 0;const r=n(8156),o=n(9096);let i=0,a="",s=0;const l=new Set,u=e=>{var t;(t=e.target)instanceof Node&&Array.from(l).some((e=>e.contains(t)))||(e=>e instanceof Element&&null!==e.closest(o.FLOATING_UI_PORTAL_SELECTOR))(e.target)||e.preventDefault()},c=()=>{window.scrollY!==s&&window.scrollTo(window.scrollX,s)};t.useScrollLock=(e,t)=>{(0,r.useEffect)((()=>{if(!e||"undefined"==typeof document)return;const n=t.current;return n&&l.add(n),0===i&&(a=document.body.style.overflow,s=window.scrollY,document.body.style.overflow="hidden",document.addEventListener("touchmove",u,{passive:!1}),window.addEventListener("scroll",c)),i+=1,()=>{n&&l.delete(n),i-=1,0===i&&(document.body.style.overflow=a,document.removeEventListener("touchmove",u),window.removeEventListener("scroll",c))}}),[e,t])}},749:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useSnapPoints=void 0;const r=n(8156);t.useSnapPoints=(e,t)=>{const[n,o]=(0,r.useState)(0),i=(0,r.useCallback)((()=>{const e=t.current?.clientHeight??("undefined"!=typeof window?window.innerHeight:0);o(e)}),[t]);(0,r.useEffect)((()=>{if(i(),"undefined"!=typeof window)return window.addEventListener("resize",i),window.addEventListener("orientationchange",i),window.visualViewport?.addEventListener("resize",i),()=>{window.removeEventListener("resize",i),window.removeEventListener("orientationchange",i),window.visualViewport?.removeEventListener("resize",i)}}),[i]);return{snaps:e.map((e=>{const t=((e,t)=>{if("full"===e)return t;const n=/^(\d+(?:\.\d+)?)%$/.exec(e.trim());return t*(n?Number(n[1])/100:0)})(e,n);return{point:e,height:t,offset:n-t}})),containerHeight:n}}},9628:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.BottomSheetBody=void 0;const r=n(5163).__importDefault(n(8156)),o=n(5280),i=n(9096);t.BottomSheetBody=({children:e,padding:t="base",...n})=>r.default.createElement(o.Box,{padding:i.PADDING_TOKEN_MAP[t],flex:"1",minHeight:"0",overflowY:"auto",...n},e),t.BottomSheetBody.displayName="BottomSheetBody"},8002:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.BottomSheetFooter=void 0;const r=n(5163).__importDefault(n(8156)),o=n(5280),i=n(9096);t.BottomSheetFooter=({children:e,padding:t="base",...n})=>r.default.createElement(o.Box,{padding:i.PADDING_TOKEN_MAP[t],flex:"none",display:"flex",gap:"2",justifyContent:"flex-end",...n},e),t.BottomSheetFooter.displayName="BottomSheetFooter"},1051:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.BottomSheetHeader=void 0;const r=n(5163).__importDefault(n(8156)),o=n(5280),i=n(9096);t.BottomSheetHeader=({children:e,padding:t="base",...n})=>r.default.createElement(o.Box,{padding:i.PADDING_TOKEN_MAP[t],flex:"none",...n},e),t.BottomSheetHeader.displayName="BottomSheetHeader"},9773:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.Grabber=void 0;const r=n(5163).__importStar(n(8156)),o=n(5280),i=n(9096),a=n(2893);t.Grabber=(0,r.forwardRef)((({onPointerDown:e,snapIndex:t,snapCount:n,onSnapChange:s,pillHidden:l=!1,label:u=i.DEFAULT_GRABBER_LABEL},c)=>{const d=Math.max(n-1,0);return r.default.createElement("div",{style:{display:"flex",justifyContent:"center",position:"relative",width:"100%",height:"28px",boxSizing:"border-box"}},r.default.createElement("div",{ref:c,onPointerDown:e,onKeyDown:e=>{switch(e.key){case"ArrowUp":e.preventDefault(),s((0,a.clampIndex)(t+1,n));break;case"ArrowDown":e.preventDefault(),s((0,a.clampIndex)(t-1,n));break;case"Home":e.preventDefault(),s(0);break;case"End":e.preventDefault(),s(d)}},role:"separator","aria-orientation":"horizontal","aria-label":u,"aria-valuenow":t,"aria-valuemin":0,"aria-valuemax":d,tabIndex:0,style:{position:"absolute",top:"-8px",left:"50%",transform:"translateX(-50%)",width:"56px",height:"56px",borderRadius:"50%",touchAction:"none",cursor:"grab",boxSizing:"border-box"}},r.default.createElement("div",{style:{position:"absolute",top:"16px",left:"50%",transform:"translateX(-50%)",opacity:l?0:1,transition:"opacity 300ms cubic-bezier(0.32, 0.72, 0, 1)"}},r.default.createElement(o.Box,{width:"44px",height:"4px",backgroundColor:"neutral-surfaceHighlight",borderRadius:"full"}))))})),t.Grabber.displayName="Grabber"},5163:(e,t,n)=>{n.r(t),n.d(t,{__assign:()=>i,__asyncDelegator:()=>T,__asyncGenerator:()=>O,__asyncValues:()=>x,__await:()=>g,__awaiter:()=>m,__classPrivateFieldGet:()=>A,__classPrivateFieldIn:()=>B,__classPrivateFieldSet:()=>R,__createBinding:()=>y,__decorate:()=>s,__esDecorate:()=>u,__exportStar:()=>h,__extends:()=>o,__generator:()=>b,__importDefault:()=>D,__importStar:()=>P,__makeTemplateObject:()=>I,__metadata:()=>p,__param:()=>l,__propKey:()=>d,__read:()=>_,__rest:()=>a,__runInitializers:()=>c,__setFunctionName:()=>f,__spread:()=>E,__spreadArray:()=>w,__spreadArrays:()=>S,__values:()=>v});var r=function(e,t){return r=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(e,t){e.__proto__=t}||function(e,t){for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])},r(e,t)};function o(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Class extends value "+String(t)+" is not a constructor or null");function n(){this.constructor=e}r(e,t),e.prototype=null===t?Object.create(t):(n.prototype=t.prototype,new n)}var i=function(){return i=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},i.apply(this,arguments)};function a(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(e);o<r.length;o++)t.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(n[r[o]]=e[r[o]])}return n}function s(e,t,n,r){var o,i=arguments.length,a=i<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,n):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}function l(e,t){return function(n,r){t(n,r,e)}}function u(e,t,n,r,o,i){function a(e){if(void 0!==e&&"function"!=typeof e)throw new TypeError("Function expected");return e}for(var s,l=r.kind,u="getter"===l?"get":"setter"===l?"set":"value",c=!t&&e?r.static?e:e.prototype:null,d=t||(c?Object.getOwnPropertyDescriptor(c,r.name):{}),f=!1,p=n.length-1;p>=0;p--){var m={};for(var b in r)m[b]="access"===b?{}:r[b];for(var b in r.access)m.access[b]=r.access[b];m.addInitializer=function(e){if(f)throw new TypeError("Cannot add initializers after decoration has completed");i.push(a(e||null))};var y=(0,n[p])("accessor"===l?{get:d.get,set:d.set}:d[u],m);if("accessor"===l){if(void 0===y)continue;if(null===y||"object"!=typeof y)throw new TypeError("Object expected");(s=a(y.get))&&(d.get=s),(s=a(y.set))&&(d.set=s),(s=a(y.init))&&o.push(s)}else(s=a(y))&&("field"===l?o.push(s):d[u]=s)}c&&Object.defineProperty(c,r.name,d),f=!0}function c(e,t,n){for(var r=arguments.length>2,o=0;o<t.length;o++)n=r?t[o].call(e,n):t[o].call(e);return r?n:void 0}function d(e){return"symbol"==typeof e?e:"".concat(e)}function f(e,t,n){return"symbol"==typeof t&&(t=t.description?"[".concat(t.description,"]"):""),Object.defineProperty(e,"name",{configurable:!0,value:n?"".concat(n," ",t):t})}function p(e,t){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(e,t)}function m(e,t,n,r){return new(n||(n=Promise))((function(o,i){function a(e){try{l(r.next(e))}catch(e){i(e)}}function s(e){try{l(r.throw(e))}catch(e){i(e)}}function l(e){var t;e.done?o(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(a,s)}l((r=r.apply(e,t||[])).next())}))}function b(e,t){var n,r,o,i,a={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]};return i={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function s(s){return function(l){return function(s){if(n)throw new TypeError("Generator is already executing.");for(;i&&(i=0,s[0]&&(a=0)),a;)try{if(n=1,r&&(o=2&s[0]?r.return:s[0]?r.throw||((o=r.return)&&o.call(r),0):r.next)&&!(o=o.call(r,s[1])).done)return o;switch(r=0,o&&(s=[2&s[0],o.value]),s[0]){case 0:case 1:o=s;break;case 4:return a.label++,{value:s[1],done:!1};case 5:a.label++,r=s[1],s=[0];continue;case 7:s=a.ops.pop(),a.trys.pop();continue;default:if(!(o=a.trys,(o=o.length>0&&o[o.length-1])||6!==s[0]&&2!==s[0])){a=0;continue}if(3===s[0]&&(!o||s[1]>o[0]&&s[1]<o[3])){a.label=s[1];break}if(6===s[0]&&a.label<o[1]){a.label=o[1],o=s;break}if(o&&a.label<o[2]){a.label=o[2],a.ops.push(s);break}o[2]&&a.ops.pop(),a.trys.pop();continue}s=t.call(e,a)}catch(e){s=[6,e],r=0}finally{n=o=0}if(5&s[0])throw s[1];return{value:s[0]?s[1]:void 0,done:!0}}([s,l])}}}var y=Object.create?function(e,t,n,r){void 0===r&&(r=n);var o=Object.getOwnPropertyDescriptor(t,n);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[n]}}),Object.defineProperty(e,r,o)}:function(e,t,n,r){void 0===r&&(r=n),e[r]=t[n]};function h(e,t){for(var n in e)"default"===n||Object.prototype.hasOwnProperty.call(t,n)||y(t,e,n)}function v(e){var t="function"==typeof Symbol&&Symbol.iterator,n=t&&e[t],r=0;if(n)return n.call(e);if(e&&"number"==typeof e.length)return{next:function(){return e&&r>=e.length&&(e=void 0),{value:e&&e[r++],done:!e}}};throw new TypeError(t?"Object is not iterable.":"Symbol.iterator is not defined.")}function _(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var r,o,i=n.call(e),a=[];try{for(;(void 0===t||t-- >0)&&!(r=i.next()).done;)a.push(r.value)}catch(e){o={error:e}}finally{try{r&&!r.done&&(n=i.return)&&n.call(i)}finally{if(o)throw o.error}}return a}function E(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(_(arguments[t]));return e}function S(){for(var e=0,t=0,n=arguments.length;t<n;t++)e+=arguments[t].length;var r=Array(e),o=0;for(t=0;t<n;t++)for(var i=arguments[t],a=0,s=i.length;a<s;a++,o++)r[o]=i[a];return r}function w(e,t,n){if(n||2===arguments.length)for(var r,o=0,i=t.length;o<i;o++)!r&&o in t||(r||(r=Array.prototype.slice.call(t,0,o)),r[o]=t[o]);return e.concat(r||Array.prototype.slice.call(t))}function g(e){return this instanceof g?(this.v=e,this):new g(e)}function O(e,t,n){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var r,o=n.apply(e,t||[]),i=[];return r={},a("next"),a("throw"),a("return"),r[Symbol.asyncIterator]=function(){return this},r;function a(e){o[e]&&(r[e]=function(t){return new Promise((function(n,r){i.push([e,t,n,r])>1||s(e,t)}))})}function s(e,t){try{(n=o[e](t)).value instanceof g?Promise.resolve(n.value.v).then(l,u):c(i[0][2],n)}catch(e){c(i[0][3],e)}var n}function l(e){s("next",e)}function u(e){s("throw",e)}function c(e,t){e(t),i.shift(),i.length&&s(i[0][0],i[0][1])}}function T(e){var t,n;return t={},r("next"),r("throw",(function(e){throw e})),r("return"),t[Symbol.iterator]=function(){return this},t;function r(r,o){t[r]=e[r]?function(t){return(n=!n)?{value:g(e[r](t)),done:!1}:o?o(t):t}:o}}function x(e){if(!Symbol.asyncIterator)throw new TypeError("Symbol.asyncIterator is not defined.");var t,n=e[Symbol.asyncIterator];return n?n.call(e):(e=v(e),t={},r("next"),r("throw"),r("return"),t[Symbol.asyncIterator]=function(){return this},t);function r(n){t[n]=e[n]&&function(t){return new Promise((function(r,o){(function(e,t,n,r){Promise.resolve(r).then((function(t){e({value:t,done:n})}),t)})(r,o,(t=e[n](t)).done,t.value)}))}}}function I(e,t){return Object.defineProperty?Object.defineProperty(e,"raw",{value:t}):e.raw=t,e}var L=Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t};function P(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&y(t,e,n);return L(t,e),t}function D(e){return e&&e.__esModule?e:{default:e}}function A(e,t,n,r){if("a"===n&&!r)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!r:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===n?r:"a"===n?r.call(e):r?r.value:t.get(e)}function R(e,t,n,r,o){if("m"===r)throw new TypeError("Private method is not writable");if("a"===r&&!o)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!o:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===r?o.call(e,n):o?o.value=n:t.set(e,n),n}function B(e,t){if(null===t||"object"!=typeof t&&"function"!=typeof t)throw new TypeError("Cannot use 'in' operator on non-object");return"function"==typeof e?t===e:e.has(t)}},5280:e=>{e.exports=n},7990:e=>{e.exports=r},8156:t=>{t.exports=e},7111:e=>{e.exports=t}},i={};function a(e){var t=i[e];if(void 0!==t)return t.exports;var n=i[e]={exports:{}};return o[e](n,n.exports,a),n.exports}a.d=(e,t)=>{for(var n in t)a.o(t,n)&&!a.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),a.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};return(()=>{var e=s;Object.defineProperty(e,"__esModule",{value:!0}),e.BottomSheet=void 0;const t=a(8446);var n=a(8446);Object.defineProperty(e,"BottomSheet",{enumerable:!0,get:function(){return n.BottomSheet}}),e.default=t.BottomSheet})(),s})()));

package/dist/CHANGELOG.md

@@ -2,6 +2,26 @@
 
 Nimbus is an open-source Design System created by Tiendanube / Nuvesmhop's team to empower and enhance more stories every day, with simplicity, accessibility, consistency and performance.
 
+## 2026-09-02 `1.38.1`
+
+### 💡 Others
+
+- Test release para verificar el pipeline de publicación end-to-end tras la
+  unificación de workflows de GitHub Actions (ONB-1164). Sin cambios funcionales —
+  solo un comentario en el código. ([#194](https://github.com/TiendaNube/nimbus-patterns/pull/194) by [@EzeNube](https://github.com/EzeNube))
+
+## 2026-07-24 `1.38.0`
+
+#### 🎉 New features
+
+- Added `BottomSheet` component: a mobile-first modal sheet with configurable snap points, a drag gesture to resize or dismiss, focus trapping, background scroll locking, on-screen keyboard handling, and `BottomSheet.Header`/`BottomSheet.Body`/`BottomSheet.Footer` subcomponents. ([#177](https://github.com/TiendaNube/nimbus-patterns/pull/177) by [@jffs](https://github.com/jffs))
+
+## 2026-07-15 `1.37.0`
+
+#### 🎉 New features
+
+- `NavTabs`: Added an `appearance` prop to `NavTabs.Item`, with an `"ai-generative"` variant that renders a gradient border and a fixed AI icon for AI entry points such as an assistant button. ([#176](https://github.com/TiendaNube/nimbus-patterns/pull/176) by [@jffs](https://github.com/jffs))
+
 ## 2026-06-25 `1.36.0`
 
 #### 🎉 New features

package/dist/NavTabs/index.d.ts

@@ -4,12 +4,7 @@ import { BoxProperties } from '@nimbus-ds/components';
 import React from 'react';
 import { HTMLAttributes, ReactNode } from 'react';
 
-export interface NavTabsItemProperties {
-	/**
-	 * Icon element to be rendered inside the button.
-	 * @TJS-type React.ReactNode
-	 */
-	icon: ReactNode;
+export interface NavTabsItemBaseProperties {
 	/**
 	 * Controls whether the button is active or not.
 	 */
@@ -28,7 +23,30 @@ export interface NavTabsItemProperties {
 	 */
 	ariaLabel: string;
 }
-export type NavTabsItemProps = NavTabsItemProperties & Omit<BoxProperties, "onClick"> & Omit<HTMLAttributes<HTMLElement>, "color">;
+export interface NavTabsItemNeutralProperties extends NavTabsItemBaseProperties {
+	/**
+	 * Visual variant of the button.
+	 * "ai-generative" renders a fixed AI icon with a gradient border and does not accept a custom `icon`.
+	 * @default "neutral"
+	 */
+	appearance?: "neutral";
+	/**
+	 * Icon element to be rendered inside the button.
+	 * @TJS-type React.ReactNode
+	 */
+	icon: ReactNode;
+}
+export interface NavTabsItemAIGenerativeProperties extends Omit<NavTabsItemBaseProperties, "active"> {
+	/**
+	 * Visual variant of the button.
+	 * "ai-generative" renders a fixed AI icon with a gradient border and does not accept a custom `icon`.
+	 */
+	appearance: "ai-generative";
+	icon?: never;
+	active?: never;
+}
+export type NavTabsItemVariantProperties = NavTabsItemNeutralProperties | NavTabsItemAIGenerativeProperties;
+export type NavTabsItemProps = NavTabsItemVariantProperties & Omit<BoxProperties, "onClick"> & Omit<HTMLAttributes<HTMLElement>, "color">;
 export declare const NavTabsItem: React.FC<NavTabsItemProps>;
 export interface NavTabsComponents {
 	Item: typeof NavTabsItem;