@nimbus-ds/patterns 1.35.1-rc.10 → 1.35.1-rc.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -2,12 +2,6 @@
2
2
 
3
3
  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.
4
4
 
5
- ## 2026-07-15 `1.37.0`
6
-
7
- #### 🎉 New features
8
-
9
- - `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))
10
-
11
5
  ## 2026-06-25 `1.36.0`
12
6
 
13
7
  #### 🎉 New features
@@ -0,0 +1,184 @@
1
+ // Generated by dts-bundle-generator v8.1.2
2
+
3
+ import React from 'react';
4
+ import { HTMLAttributes, ReactNode } from 'react';
5
+
6
+ export type BottomSheetPadding = "none" | "base";
7
+ /**
8
+ * A snap point expressed as a viewport-height percentage (e.g. "60%") or the
9
+ * keyword "full" (which stops just below the status bar, not full-bleed).
10
+ */
11
+ export type BottomSheetSnapPoint = `${number}%` | "full";
12
+ /**
13
+ * Predicate variant of `closeOnOutsidePress`: receives the DOM event and
14
+ * returns `true` to allow closing, `false` to ignore the press.
15
+ */
16
+ export type CloseOnOutsidePress = (event: PointerEvent | MouseEvent) => boolean;
17
+ export interface BottomSheetProperties {
18
+ /**
19
+ * Determines if the bottom sheet is shown or not.
20
+ * @default false
21
+ */
22
+ open?: boolean;
23
+ /**
24
+ * Callback fired when the component requests to be closed (overlay press,
25
+ * close control, Escape, or a downward dismiss gesture).
26
+ * () => void;
27
+ */
28
+ onRemove?: () => void;
29
+ /**
30
+ * Ordered list of heights the sheet can snap to. Each entry is a
31
+ * viewport-height percentage (e.g. "60%") or the keyword "full".
32
+ * @default ["60%", "90%", "full"]
33
+ */
34
+ snapPoints?: BottomSheetSnapPoint[];
35
+ /**
36
+ * Index within `snapPoints` used as the initial snap point.
37
+ * @default 0
38
+ */
39
+ defaultSnap?: number;
40
+ /**
41
+ * Content of the sheet. Compose with BottomSheet.Header, BottomSheet.Body
42
+ * and BottomSheet.Footer.
43
+ * @TJS-type React.ReactNode
44
+ */
45
+ children?: ReactNode;
46
+ /**
47
+ * Controls whether pressing outside should close the sheet.
48
+ * - boolean: enable/disable dismissal on outside press
49
+ * - function: receive the DOM event and return true to allow closing
50
+ * @default true
51
+ */
52
+ closeOnOutsidePress?: boolean | CloseOnOutsidePress;
53
+ /**
54
+ * The attribute name to ignore when checking for outside presses, so
55
+ * portaled Popover/Modal content does not close the sheet.
56
+ * @default "data-nimbus-outside-press-ignore"
57
+ */
58
+ ignoreAttributeName?: string;
59
+ /**
60
+ * Determines if background scroll is locked while the sheet is open.
61
+ * @default true
62
+ */
63
+ needRemoveScroll?: boolean;
64
+ /**
65
+ * Explicit z-index for the sheet layer. Omitted by default: like Nimbus's
66
+ * own Sidebar/Modal/Popover, the sheet relies on DOM mount order rather
67
+ * than a z-index. Its portal mounts into the nearest Nimbus
68
+ * <ThemeProvider>'s own wrapper element (the same container
69
+ * Sidebar/Modal/Popover portal into), falling back to document.body only
70
+ * when no ThemeProvider is present. In both cases, later-mounted siblings
71
+ * paint on top of earlier ones as long as neither sets a z-index, so this
72
+ * keeps the sheet correctly stacked against Popover and other BottomSheet
73
+ * instances. Only set this to force a specific stacking order against
74
+ * something outside that convention.
75
+ */
76
+ zIndex?: number;
77
+ }
78
+ /**
79
+ * Public props for `BottomSheet`. Combines `BottomSheetProperties` (the
80
+ * sheet's own behavior — visibility, snap points, dismissal, stacking) with
81
+ * `root` and every native `div` attribute except `color`.
82
+ */
83
+ export type BottomSheetProps = BottomSheetProperties & {
84
+ /**
85
+ * Root element where the portal should be mounted. When provided and not
86
+ * null, the portal renders inside this element. Otherwise it renders into
87
+ * the nearest Nimbus <ThemeProvider>'s own wrapper element (same as
88
+ * Sidebar/Modal/Popover), so it inherits the active theme's CSS custom
89
+ * properties and stacks correctly against them; it falls back to
90
+ * document.body only when no ThemeProvider is present. Useful to scope the
91
+ * sheet within a container (e.g., AppShell.Chat).
92
+ */
93
+ root?: HTMLElement | null;
94
+ } & Omit<HTMLAttributes<HTMLDivElement>, "color">;
95
+ export interface BottomSheetHeaderProperties {
96
+ /**
97
+ * The content of the sheet header. Accepts any node (title, actions, icons).
98
+ * @TJS-type React.ReactNode
99
+ */
100
+ children?: ReactNode;
101
+ /**
102
+ * The padding around the header content area.
103
+ * @default base
104
+ */
105
+ padding?: BottomSheetPadding;
106
+ }
107
+ /**
108
+ * Public props for `BottomSheet.Header`. Combines `BottomSheetHeaderProperties`
109
+ * with every native element attribute except `color` (same reason as
110
+ * `BottomSheetProps`: it conflicts with Box's own color-token sprinkle).
111
+ */
112
+ export type BottomSheetHeaderProps = BottomSheetHeaderProperties & Omit<HTMLAttributes<HTMLElement>, "color">;
113
+ export interface BottomSheetBodyProperties {
114
+ /**
115
+ * The scrollable content of the sheet.
116
+ * @TJS-type React.ReactNode
117
+ */
118
+ children: ReactNode;
119
+ /**
120
+ * The padding around the body content area.
121
+ * @default base
122
+ */
123
+ padding?: BottomSheetPadding;
124
+ }
125
+ /**
126
+ * Public props for `BottomSheet.Body`. Combines `BottomSheetBodyProperties`
127
+ * (`children` is required, unlike `Header`'s) with every native element
128
+ * attribute except `color`.
129
+ */
130
+ export type BottomSheetBodyProps = BottomSheetBodyProperties & Omit<HTMLAttributes<HTMLElement>, "color">;
131
+ export interface BottomSheetFooterProperties {
132
+ /**
133
+ * The content of the sheet footer.
134
+ * @TJS-type React.ReactNode
135
+ */
136
+ children: ReactNode;
137
+ /**
138
+ * The padding around the footer content area.
139
+ * @default base
140
+ */
141
+ padding?: BottomSheetPadding;
142
+ }
143
+ /**
144
+ * Public props for `BottomSheet.Footer`. Combines `BottomSheetFooterProperties`
145
+ * (`children` is required, same as `Body`) with every native element
146
+ * attribute except `color`. `BottomSheet.Footer` itself is optional to
147
+ * render at all — omitting it entirely is how a sheet renders without a
148
+ * footer region.
149
+ */
150
+ export type BottomSheetFooterProps = BottomSheetFooterProperties & Omit<HTMLAttributes<HTMLElement>, "color">;
151
+ declare const BottomSheetBody: React.FC<BottomSheetBodyProps>;
152
+ declare const BottomSheetFooter: React.FC<BottomSheetFooterProps>;
153
+ declare const BottomSheetHeader: React.FC<BottomSheetHeaderProps>;
154
+ declare const BottomSheetBase: React.FC<BottomSheetProps>;
155
+ /**
156
+ * A mobile-first modal sheet that slides up from the bottom edge, with
157
+ * configurable snap points and a pointer-driven drag gesture to resize
158
+ * between them or dismiss by dragging down.
159
+ *
160
+ * Controlled via `open`/`onRemove`, the same contract as `Sidebar`: the
161
+ * component never changes its own visibility, it only requests to close (via
162
+ * overlay press, Escape, or a downward dismiss gesture) — the consumer sets
163
+ * `open` to `false` in response.
164
+ *
165
+ * Compose with `BottomSheet.Header` (optional), `BottomSheet.Body`
166
+ * (required), and `BottomSheet.Footer` (optional) as `children`.
167
+ *
168
+ * Behaves as a modal: renders as `role="dialog"`/`aria-modal="true"`, dims
169
+ * and blocks the background, traps focus while open, and restores it to the
170
+ * previously focused element on close. Automatically labels the dialog via
171
+ * `aria-labelledby` pointing at `BottomSheet.Header` when one is present;
172
+ * pass an explicit `aria-label`/`aria-labelledby` to override that.
173
+ */
174
+ export declare const BottomSheet: typeof BottomSheetBase & {
175
+ Header: typeof BottomSheetHeader;
176
+ Body: typeof BottomSheetBody;
177
+ Footer: typeof BottomSheetFooter;
178
+ };
179
+
180
+ export {
181
+ BottomSheet as default,
182
+ };
183
+
184
+ export {};
@@ -0,0 +1,2 @@
1
+ "use client";
2
+ !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),u=n(3687),c=n(8555),l=n(3040),f=n(7370),d=n(3636),p=n(749),m=n(9628),y=n(8002),b=n(1051),h=n(9773),v=(e,t)=>Math.min(Math.max(e,0),Math.max(t-1,0));let _=0;t.BottomSheet=({open:e=!1,onRemove:t,snapPoints:n=[...s.DEFAULT_SNAP_POINTS],defaultSnap:m=s.DEFAULT_SNAP_INDEX,children:y,closeOnOutsidePress:g=!0,ignoreAttributeName:S=s.DEFAULT_IGNORE_ATTRIBUTE_NAME,needRemoveScroll:w=!0,zIndex:E,root:O,...T})=>{const[P,x]=(0,r.useState)((()=>v(m,n.length))),D=(0,r.useRef)(null),I=(0,r.useRef)(null),A=(0,r.useRef)(null),j=(0,r.useRef)(null);j.current=O??null;const L=(0,r.useRef)(void 0);L.current||(_+=1,L.current=`bottom-sheet-header-${_}`);const M=(0,r.useRef)(!1);(0,r.useEffect)((()=>{e?(M.current?x((e=>v(e,n.length))):x(v(m,n.length)),M.current=!0):M.current=!1}),[e,n.length]);const{snaps:N,containerHeight:R}=(0,p.useSnapPoints)(n,j),B=(0,f.useKeyboardInset)(e),{refThemeProvider:H}=(0,a.useTheme)(),C=()=>t?.(),{offset:k,isDragging:F,grabberHandlers:G}=(0,c.useDragGesture)({snaps:N,snapIndex:P,containerHeight:R,onSnapChange:x,onDismiss:C});if((0,d.useScrollLock)(e&&w),(0,l.useFocusTrap)(I,e),(0,u.useDismissHandlers)({enabled:e,panelRef:I,overlayRef:D,closeOnOutsidePress:g,ignoreAttributeName:S,onRequestClose:C}),!e)return null;const z=Math.max(0,R-k-B),U="undefined"!=typeof document?O??H?.current??document.body:null;if(!U)return null;const{style:Y,...K}=T,q="aria-label"in K||"aria-labelledby"in K;let V;const X=q?y:r.default.Children.map(y,(e=>{if(r.default.isValidElement(e)&&e.type===b.BottomSheetHeader){const t=e;return V=t.props.id??L.current,r.default.cloneElement(t,{id:V})}return e})),$={[S]:""};return(0,o.createPortal)(r.default.createElement(r.default.Fragment,null,r.default.createElement("div",{ref:D,...$,style:{position:"fixed",top:0,left:0,right:0,bottom:0,backgroundColor:"var(--nimbus-colors-neutral-textHigh)",opacity:.4,zIndex:E}}),r.default.createElement("div",{ref:I,role:"dialog","aria-modal":"true","aria-labelledby":q?void 0:V,tabIndex:-1,...$,...K,style:{...Y,position:"fixed",left:0,right:0,display:"flex",flexDirection:"column",backgroundColor:"var(--nimbus-colors-neutral-background)",boxSizing:"border-box",bottom:B,height:z,zIndex:E,borderTopLeftRadius:"var(--nimbus-shape-border-radius-6)",borderTopRightRadius:"var(--nimbus-shape-border-radius-6)",transition:F?"none":s.SETTLE_TRANSITION}},r.default.createElement(h.Grabber,{ref:A,onPointerDown:G.onPointerDown,snapIndex:P,snapCount:N.length,onSnapChange:x}),r.default.createElement(i.Box,{display:"flex",flexDirection:"column",flex:"1",minHeight:"0"},X))),U)},t.BottomSheet.Header=b.BottomSheetHeader,t.BottomSheet.Body=m.BottomSheetBody,t.BottomSheet.Footer=y.BottomSheetFooter,t.BottomSheet.displayName="BottomSheet"},9096:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.DEFAULT_IGNORE_ATTRIBUTE_NAME=t.PADDING_TOKEN_MAP=t.SETTLE_TRANSITION=t.DISMISS_VELOCITY_THRESHOLD=t.DISMISS_DISTANCE_THRESHOLD=t.FULL_TOP_GAP_RATIO=t.DEFAULT_SNAP_INDEX=t.DEFAULT_SNAP_POINTS=void 0,t.DEFAULT_SNAP_POINTS=["60%","90%","full"],t.DEFAULT_SNAP_INDEX=0,t.FULL_TOP_GAP_RATIO=.053,t.DISMISS_DISTANCE_THRESHOLD=96,t.DISMISS_VELOCITY_THRESHOLD=.5,t.SETTLE_TRANSITION="height 300ms cubic-bezier(0.32, 0.72, 0, 1), bottom 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"},3687:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useDismissHandlers=void 0;const r=n(8156),o=[];t.useDismissHandlers=({enabled:e,panelRef:t,overlayRef:n,closeOnOutsidePress:i=!0,ignoreAttributeName:a,onRequestClose:s})=>{(0,r.useEffect)((()=>{if(!e||"undefined"==typeof document)return;const r={};o.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(`[${a}], [data-floating-ui-portal]`)||(e=>"function"==typeof i?i(e):i)(e)&&s()},c=e=>{"Escape"===e.key&&o.at(-1)===r&&s()};return document.addEventListener("pointerdown",u,!0),document.addEventListener("keydown",c),()=>{document.removeEventListener("pointerdown",u,!0),document.removeEventListener("keydown",c);const e=o.indexOf(r);-1!==e&&o.splice(e,1)}}),[e,t,n,i,a,s])}},8555:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useDragGesture=void 0;const r=n(8156),o=n(9096),i=e=>e.map(((e,t)=>({...e,index:t}))).sort(((e,t)=>e.height-t.height));t.useDragGesture=({snaps:e,snapIndex:t,containerHeight:n,onSnapChange:a,onDismiss:s})=>{const u=e[t],[c,l]=(0,r.useState)(null),[f,d]=(0,r.useState)(!1),p=(0,r.useRef)(null),m=(0,r.useRef)(null),y=()=>{const e=m.current;e&&(document.removeEventListener("pointermove",e.move),document.removeEventListener("pointerup",e.up),document.removeEventListener("pointercancel",e.cancel),m.current=null)},b=(0,r.useCallback)((t=>{const r=i(e),a=r.at(-1)?.offset??0,s=(r[0]?.offset??n)+2*o.DISMISS_DISTANCE_THRESHOLD;return Math.min(Math.max(t,a),s)}),[e,n]),h=(0,r.useCallback)((e=>{if(!p.current)return;const t=e.timeStamp,n=t-p.current.lastTime||1,r=e.clientY-p.current.lastClientY;p.current.velocity=r/n,p.current.lastClientY=e.clientY,p.current.lastTime=t;const o=p.current.startOffset+(e.clientY-p.current.startClientY),i=b(o);p.current.currentOffset=i,l(i)}),[b]),v=(0,r.useCallback)((()=>{const n=p.current;if(p.current=null,d(!1),l(null),!n)return;const r=((e,t,n)=>{const r=i(n),a=r[0],s=e>a.offset+o.DISMISS_DISTANCE_THRESHOLD,u=t>o.DISMISS_VELOCITY_THRESHOLD&&e>=a.offset;if(s||u)return{dismiss:!0};let c=r.reduce(((t,n)=>Math.abs(e-n.offset)<Math.abs(e-t.offset)?n:t),r[0]);if(Math.abs(t)>o.DISMISS_VELOCITY_THRESHOLD){const e=r.findIndex((e=>e.index===c.index));if(t>0&&e>0){const t=r[e-1];t.height<c.height&&(c=t)}else if(t<0&&e<r.length-1){const t=r[e+1];t.height>c.height&&(c=t)}}return{dismiss:!1,index:c.index}})(n.currentOffset,n.velocity,e);r.dismiss?s():r.index!==t&&a(r.index),y()}),[e,t,a,s]),_=(0,r.useCallback)((()=>{p.current=null,d(!1),l(null),y()}),[]),g=(0,r.useCallback)((e=>{u&&(p.current={startClientY:e.clientY,startOffset:u.offset,lastClientY:e.clientY,lastTime:e.timeStamp,velocity:0,currentOffset:u.offset},d(!0),document.addEventListener("pointermove",h),document.addEventListener("pointerup",v),document.addEventListener("pointercancel",_),m.current={move:h,up:v,cancel:_})}),[u,h,v,_]);(0,r.useEffect)((()=>()=>{y(),p.current=null}),[]);const S=c??u?.offset??0;return(0,r.useMemo)((()=>({offset:S,isDragging:f,grabberHandlers:{onPointerDown:g}})),[S,f,g])}},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);t.useKeyboardInset=e=>{const[t,n]=(0,r.useState)(0);return(0,r.useEffect)((()=>{if(!e||"undefined"==typeof window||!window.visualViewport)return void n(0);const t=window.visualViewport,r=()=>{const e=window.innerHeight-t.height-t.offsetTop;n(Math.max(0,Math.round(e)))};return r(),t.addEventListener("resize",r),t.addEventListener("scroll",r),()=>{t.removeEventListener("resize",r),t.removeEventListener("scroll",r),n(0)}}),[e]),t}},3636:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useScrollLock=void 0;const r=n(8156);let o=0,i="";t.useScrollLock=e=>{(0,r.useEffect)((()=>{if(e&&"undefined"!=typeof document)return 0===o&&(i=document.body.style.overflow,document.body.style.overflow="hidden"),o+=1,()=>{o-=1,0===o&&(document.body.style.overflow=i)}}),[e])}},749:(e,t,n)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useSnapPoints=void 0;const r=n(8156),o=n(9096);t.useSnapPoints=(e,t)=>{const[n,i]=(0,r.useState)(0),a=(0,r.useCallback)((()=>{const e=t.current?.clientHeight??("undefined"!=typeof window?window.innerHeight:0);i(e)}),[t]);(0,r.useEffect)((()=>{if(a(),"undefined"!=typeof window)return window.addEventListener("resize",a),window.addEventListener("orientationchange",a),()=>{window.removeEventListener("resize",a),window.removeEventListener("orientationchange",a)}}),[a]);return{snaps:e.map((e=>{const t=((e,t)=>{if("full"===e)return t*(1-o.FULL_TOP_GAP_RATIO);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);t.Grabber=(0,r.forwardRef)((({onPointerDown:e,snapIndex:t,snapCount:n,onSnapChange:i},a)=>{const s=Math.max(n-1,0),u=e=>Math.min(Math.max(e,0),s);return r.default.createElement("div",{ref:a,onPointerDown:e,onKeyDown:e=>{switch(e.key){case"ArrowUp":e.preventDefault(),i(u(t+1));break;case"ArrowDown":e.preventDefault(),i(u(t-1));break;case"Home":e.preventDefault(),i(0);break;case"End":e.preventDefault(),i(s)}},role:"separator","aria-orientation":"horizontal","aria-label":"Drag to resize or dismiss","aria-valuenow":t,"aria-valuemin":0,"aria-valuemax":s,tabIndex:0,style:{display:"flex",justifyContent:"center",alignItems:"center",width:"100%",paddingTop:"var(--nimbus-spacing-2)",paddingBottom:"var(--nimbus-spacing-2)",touchAction:"none",cursor:"grab",boxSizing:"border-box"}},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:()=>P,__await:()=>E,__awaiter:()=>m,__classPrivateFieldGet:()=>j,__classPrivateFieldIn:()=>M,__classPrivateFieldSet:()=>L,__createBinding:()=>b,__decorate:()=>s,__esDecorate:()=>c,__exportStar:()=>h,__extends:()=>o,__generator:()=>y,__importDefault:()=>A,__importStar:()=>I,__makeTemplateObject:()=>x,__metadata:()=>p,__param:()=>u,__propKey:()=>f,__read:()=>_,__rest:()=>a,__runInitializers:()=>l,__setFunctionName:()=>d,__spread:()=>g,__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 u(e,t){return function(n,r){t(n,r,e)}}function c(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,u=r.kind,c="getter"===u?"get":"setter"===u?"set":"value",l=!t&&e?r.static?e:e.prototype:null,f=t||(l?Object.getOwnPropertyDescriptor(l,r.name):{}),d=!1,p=n.length-1;p>=0;p--){var m={};for(var y in r)m[y]="access"===y?{}:r[y];for(var y in r.access)m.access[y]=r.access[y];m.addInitializer=function(e){if(d)throw new TypeError("Cannot add initializers after decoration has completed");i.push(a(e||null))};var b=(0,n[p])("accessor"===u?{get:f.get,set:f.set}:f[c],m);if("accessor"===u){if(void 0===b)continue;if(null===b||"object"!=typeof b)throw new TypeError("Object expected");(s=a(b.get))&&(f.get=s),(s=a(b.set))&&(f.set=s),(s=a(b.init))&&o.push(s)}else(s=a(b))&&("field"===u?o.push(s):f[c]=s)}l&&Object.defineProperty(l,r.name,f),d=!0}function l(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 f(e){return"symbol"==typeof e?e:"".concat(e)}function d(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{u(r.next(e))}catch(e){i(e)}}function s(e){try{u(r.throw(e))}catch(e){i(e)}}function u(e){var t;e.done?o(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(a,s)}u((r=r.apply(e,t||[])).next())}))}function y(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(u){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,u])}}}var b=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)||b(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 g(){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 E(e){return this instanceof E?(this.v=e,this):new E(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 E?Promise.resolve(n.value.v).then(u,c):l(i[0][2],n)}catch(e){l(i[0][3],e)}var n}function u(e){s("next",e)}function c(e){s("throw",e)}function l(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:E(e[r](t)),done:!1}:o?o(t):t}:o}}function P(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 x(e,t){return Object.defineProperty?Object.defineProperty(e,"raw",{value:t}):e.raw=t,e}var D=Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t};function I(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)&&b(t,e,n);return D(t,e),t}function A(e){return e&&e.__esModule?e:{default:e}}function j(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 L(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 M(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 CHANGED
@@ -2,12 +2,6 @@
2
2
 
3
3
  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.
4
4
 
5
- ## 2026-07-15 `1.37.0`
6
-
7
- #### 🎉 New features
8
-
9
- - `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))
10
-
11
5
  ## 2026-06-25 `1.36.0`
12
6
 
13
7
  #### 🎉 New features
@@ -4,7 +4,12 @@ import { BoxProperties } from '@nimbus-ds/components';
4
4
  import React from 'react';
5
5
  import { HTMLAttributes, ReactNode } from 'react';
6
6
 
7
- export interface NavTabsItemBaseProperties {
7
+ export interface NavTabsItemProperties {
8
+ /**
9
+ * Icon element to be rendered inside the button.
10
+ * @TJS-type React.ReactNode
11
+ */
12
+ icon: ReactNode;
8
13
  /**
9
14
  * Controls whether the button is active or not.
10
15
  */
@@ -23,30 +28,7 @@ export interface NavTabsItemBaseProperties {
23
28
  */
24
29
  ariaLabel: string;
25
30
  }
26
- export interface NavTabsItemNeutralProperties extends NavTabsItemBaseProperties {
27
- /**
28
- * Visual variant of the button.
29
- * "ai-generative" renders a fixed AI icon with a gradient border and does not accept a custom `icon`.
30
- * @default "neutral"
31
- */
32
- appearance?: "neutral";
33
- /**
34
- * Icon element to be rendered inside the button.
35
- * @TJS-type React.ReactNode
36
- */
37
- icon: ReactNode;
38
- }
39
- export interface NavTabsItemAIGenerativeProperties extends Omit<NavTabsItemBaseProperties, "active"> {
40
- /**
41
- * Visual variant of the button.
42
- * "ai-generative" renders a fixed AI icon with a gradient border and does not accept a custom `icon`.
43
- */
44
- appearance: "ai-generative";
45
- icon?: never;
46
- active?: never;
47
- }
48
- export type NavTabsItemVariantProperties = NavTabsItemNeutralProperties | NavTabsItemAIGenerativeProperties;
49
- export type NavTabsItemProps = NavTabsItemVariantProperties & Omit<BoxProperties, "onClick"> & Omit<HTMLAttributes<HTMLElement>, "color">;
31
+ export type NavTabsItemProps = NavTabsItemProperties & Omit<BoxProperties, "onClick"> & Omit<HTMLAttributes<HTMLElement>, "color">;
50
32
  export declare const NavTabsItem: React.FC<NavTabsItemProps>;
51
33
  export interface NavTabsComponents {
52
34
  Item: typeof NavTabsItem;