tempest-react-sdk 0.47.0 → 0.48.0

package/dist/components/AIChat/AIChatTurn.cjs

@@ -1,3 +1,3 @@
-const e=require("../../utils/cn.cjs"),t=require("../../utils/numbers.cjs"),n=require("../VisuallyHidden/VisuallyHidden.cjs"),r=require("../CopyButton/CopyButton.cjs"),i=require("../Collapsible/Collapsible.cjs"),a=require("./ai-chat-turns.cjs"),o=require("./AIChat.module.cjs"),s=require("../Markdown/Markdown.cjs");let c=require("react"),l=require("react/jsx-runtime"),u=require("lucide-react");function d({message:d,locale:f=`pt-BR`,canRegenerate:p=!1,onRegenerate:m,onFeedback:h,onEditSubmit:g,onEditError:_,onRetry:v,renderAvatar:y,renderContent:b,vote:x,defaultReasoningOpen:S=!1,showLineNumbers:C=!1}){let w=a.aiChatStrings(f),{role:T,content:E,reasoning:D,streaming:O,error:k,model:A,createdAt:j,attachments:M}=d,[N,P]=(0,c.useState)(null),[F,I]=(0,c.useState)(!1),[L,R]=(0,c.useState)(E),[z,B]=(0,c.useState)(!1),V=x??N,H=T===`user`,U=(0,c.useMemo)(()=>(0,l.jsx)(s.Markdown,{source:E,showLineNumbers:C,className:o.default.markdownRoot}),[E,C]),W=b?b(d):H?(0,l.jsx)(`div`,{className:o.default.plain,children:E}):E===``?null:U,G=async()=>{let e=L.trim();if(!(!e||z||!g)){B(!0);try{await g(d,e),I(!1)}catch(e){_?.(e)}finally{B(!1)}}},K=e=>{V!==e&&(P(e),h?.(d,e))},q=!O&&!F,J=h!==void 0||p&&m!==void 0;return(0,l.jsxs)(`article`,{className:e.cn(o.default.turn,H&&o.default.userTurn,T===`system`&&o.default.systemTurn,O&&o.default.streamingTurn),"aria-busy":O||void 0,"data-role":T,children:[(0,l.jsxs)(`header`,{className:o.default.turnHeader,children:[y&&(0,l.jsx)(`span`,{className:o.default.avatar,"aria-hidden":`true`,children:y(d)}),(0,l.jsx)(`span`,{className:e.cn(o.default.role,H&&o.default.visuallyHiddenRole),children:a.roleLabel(T,w)}),A&&!H&&(0,l.jsx)(`span`,{className:o.default.model,children:A}),j!==void 0&&(0,l.jsx)(`time`,{className:o.default.time,dateTime:new Date(j).toISOString(),children:a.turnTime(j,f)})]}),M&&M.length>0&&(0,l.jsx)(`ul`,{className:o.default.attachments,children:M.map(e=>(0,l.jsx)(`li`,{className:o.default.attachment,children:e.url?(0,l.jsx)(`img`,{className:o.default.thumb,src:e.url,alt:e.name}):(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(`span`,{className:o.default.attachmentName,children:e.name}),(0,l.jsx)(`span`,{className:o.default.attachmentMeta,children:e.size===void 0?e.mimeType:t.formatBytes(e.size)})]})},e.id))}),D&&(0,l.jsx)(i.Collapsible,{className:o.default.reasoning,defaultOpen:S||O===!0&&E===``,trigger:(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(u.ChevronRight,{className:o.default.reasoningChevron,size:14,"aria-hidden":!0}),w.reasoning]}),children:(0,l.jsx)(`div`,{className:o.default.reasoningBody,children:D})}),F?(0,l.jsxs)(`div`,{className:o.default.editor,children:[(0,l.jsx)(n.VisuallyHidden,{children:(0,l.jsx)(`label`,{htmlFor:`${d.id}-edit`,children:w.editing})}),(0,l.jsx)(`textarea`,{id:`${d.id}-edit`,className:o.default.editField,value:L,rows:Math.min(L.split(`
+const e=require("../../utils/cn.cjs"),t=require("../VisuallyHidden/VisuallyHidden.cjs"),n=require("../../utils/numbers.cjs"),r=require("../CopyButton/CopyButton.cjs"),i=require("../Collapsible/Collapsible.cjs"),a=require("./ai-chat-turns.cjs"),o=require("./AIChat.module.cjs"),s=require("../Markdown/Markdown.cjs");let c=require("react"),l=require("react/jsx-runtime"),u=require("lucide-react");function d({message:d,locale:f=`pt-BR`,canRegenerate:p=!1,onRegenerate:m,onFeedback:h,onEditSubmit:g,onEditError:_,onRetry:v,renderAvatar:y,renderContent:b,vote:x,defaultReasoningOpen:S=!1,showLineNumbers:C=!1}){let w=a.aiChatStrings(f),{role:T,content:E,reasoning:D,streaming:O,error:k,model:A,createdAt:j,attachments:M}=d,[N,P]=(0,c.useState)(null),[F,I]=(0,c.useState)(!1),[L,R]=(0,c.useState)(E),[z,B]=(0,c.useState)(!1),V=x??N,H=T===`user`,U=(0,c.useMemo)(()=>(0,l.jsx)(s.Markdown,{source:E,showLineNumbers:C,className:o.default.markdownRoot}),[E,C]),W=b?b(d):H?(0,l.jsx)(`div`,{className:o.default.plain,children:E}):E===``?null:U,G=async()=>{let e=L.trim();if(!(!e||z||!g)){B(!0);try{await g(d,e),I(!1)}catch(e){_?.(e)}finally{B(!1)}}},K=e=>{V!==e&&(P(e),h?.(d,e))},q=!O&&!F,J=h!==void 0||p&&m!==void 0;return(0,l.jsxs)(`article`,{className:e.cn(o.default.turn,H&&o.default.userTurn,T===`system`&&o.default.systemTurn,O&&o.default.streamingTurn),"aria-busy":O||void 0,"data-role":T,children:[(0,l.jsxs)(`header`,{className:o.default.turnHeader,children:[y&&(0,l.jsx)(`span`,{className:o.default.avatar,"aria-hidden":`true`,children:y(d)}),(0,l.jsx)(`span`,{className:e.cn(o.default.role,H&&o.default.visuallyHiddenRole),children:a.roleLabel(T,w)}),A&&!H&&(0,l.jsx)(`span`,{className:o.default.model,children:A}),j!==void 0&&(0,l.jsx)(`time`,{className:o.default.time,dateTime:new Date(j).toISOString(),children:a.turnTime(j,f)})]}),M&&M.length>0&&(0,l.jsx)(`ul`,{className:o.default.attachments,children:M.map(e=>(0,l.jsx)(`li`,{className:o.default.attachment,children:e.url?(0,l.jsx)(`img`,{className:o.default.thumb,src:e.url,alt:e.name}):(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(`span`,{className:o.default.attachmentName,children:e.name}),(0,l.jsx)(`span`,{className:o.default.attachmentMeta,children:e.size===void 0?e.mimeType:n.formatBytes(e.size)})]})},e.id))}),D&&(0,l.jsx)(i.Collapsible,{className:o.default.reasoning,defaultOpen:S||O===!0&&E===``,trigger:(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(u.ChevronRight,{className:o.default.reasoningChevron,size:14,"aria-hidden":!0}),w.reasoning]}),children:(0,l.jsx)(`div`,{className:o.default.reasoningBody,children:D})}),F?(0,l.jsxs)(`div`,{className:o.default.editor,children:[(0,l.jsx)(t.VisuallyHidden,{children:(0,l.jsx)(`label`,{htmlFor:`${d.id}-edit`,children:w.editing})}),(0,l.jsx)(`textarea`,{id:`${d.id}-edit`,className:o.default.editField,value:L,rows:Math.min(L.split(`
 `).length+1,10),onChange:e=>R(e.target.value)}),(0,l.jsxs)(`div`,{className:o.default.editActions,children:[(0,l.jsx)(`button`,{type:`button`,className:o.default.ghost,onClick:()=>{R(E),I(!1)},children:w.cancel}),(0,l.jsx)(`button`,{type:`button`,className:o.default.primary,disabled:z||L.trim()===``,onClick:()=>void G(),children:w.save})]})]}):(0,l.jsxs)(`div`,{className:e.cn(o.default.body,O&&o.default.streamingBody),children:[W,O===!0&&E===``&&(0,l.jsxs)(`span`,{className:o.default.dots,"aria-hidden":`true`,children:[(0,l.jsx)(`span`,{}),(0,l.jsx)(`span`,{}),(0,l.jsx)(`span`,{})]})]}),k&&(0,l.jsxs)(`p`,{className:o.default.error,role:`alert`,children:[(0,l.jsx)(`span`,{children:k}),v&&(0,l.jsx)(`button`,{type:`button`,className:o.default.retry,onClick:()=>v(d),children:w.retry})]}),q&&(0,l.jsxs)(`div`,{className:o.default.actions,"aria-label":w.turnActions,role:`group`,children:[(0,l.jsx)(r.CopyButton,{className:o.default.action,value:E,"aria-label":w.copy,title:w.copy,children:(0,l.jsx)(u.Copy,{size:14,"aria-hidden":!0})}),H&&g&&(0,l.jsx)(`button`,{type:`button`,className:o.default.action,"aria-label":w.edit,title:w.edit,onClick:()=>{R(E),I(!0)},children:(0,l.jsx)(u.Pencil,{size:14,"aria-hidden":!0})}),!H&&J&&(0,l.jsxs)(l.Fragment,{children:[p&&m&&(0,l.jsx)(`button`,{type:`button`,className:o.default.action,"aria-label":w.regenerate,title:w.regenerate,onClick:()=>m(d),children:(0,l.jsx)(u.RefreshCw,{size:14,"aria-hidden":!0})}),h&&(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(`button`,{type:`button`,className:e.cn(o.default.action,V===`up`&&o.default.actionActive),"aria-label":w.good,title:w.good,"aria-pressed":V===`up`,onClick:()=>K(`up`),children:(0,l.jsx)(u.ThumbsUp,{size:14,"aria-hidden":!0})}),(0,l.jsx)(`button`,{type:`button`,className:e.cn(o.default.action,V===`down`&&o.default.actionActive),"aria-label":w.bad,title:w.bad,"aria-pressed":V===`down`,onClick:()=>K(`down`),children:(0,l.jsx)(u.ThumbsDown,{size:14,"aria-hidden":!0})})]})]})]})]})}exports.AIChatTurn=d;
 //# sourceMappingURL=AIChatTurn.cjs.map

package/dist/components/AIChat/AIChatTurn.js

@@ -1,6 +1,6 @@
 import { cn as e } from "../../utils/cn.js";
-import { formatBytes as t } from "../../utils/numbers.js";
-import { VisuallyHidden as n } from "../VisuallyHidden/VisuallyHidden.js";
+import { VisuallyHidden as t } from "../VisuallyHidden/VisuallyHidden.js";
+import { formatBytes as n } from "../../utils/numbers.js";
 import { CopyButton as ee } from "../CopyButton/CopyButton.js";
 import { Collapsible as r } from "../Collapsible/Collapsible.js";
 import { aiChatStrings as i, roleLabel as a, turnTime as o } from "./ai-chat-turns.js";
@@ -74,7 +74,7 @@ function b({ message: b, locale: x = "pt-BR", canRegenerate: S = !1, onRegenerat
 						children: e.name
 					}), /* @__PURE__ */ f("span", {
 						className: s.attachmentMeta,
-						children: e.size === void 0 ? e.mimeType : t(e.size)
+						children: e.size === void 0 ? e.mimeType : n(e.size)
 					})] })
 				}, e.id))
 			}),
@@ -94,7 +94,7 @@ function b({ message: b, locale: x = "pt-BR", canRegenerate: S = !1, onRegenerat
 			W ? /* @__PURE__ */ p("div", {
 				className: s.editor,
 				children: [
-					/* @__PURE__ */ f(n, { children: /* @__PURE__ */ f("label", {
+					/* @__PURE__ */ f(t, { children: /* @__PURE__ */ f("label", {
 						htmlFor: `${b.id}-edit`,
 						children: N.editing
 					}) }),

package/dist/components/AppBar/use-sticky-body-warning.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-sticky-body-warning.cjs","names":[],"sources":["../../../src/components/AppBar/use-sticky-body-warning.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\nimport { isDevBuild } from \"../../utils\";\n\n/**\n * The one line of the app's own CSS that silently defeats `sticky`.\n *\n * `body { overflow-x: hidden }` is how most apps stop a too-wide child from\n * panning the page sideways. It also, per CSS Overflow 3, forces the computed\n * `overflow-y` to `auto` — a value the author never wrote — which makes the\n * body a **scroll container**. Every sticky descendant then pins to the body's\n * scrollport instead of the viewport, and that scrollport travels with the\n * document: measured in Chromium at 390px with a long page, the bar sat at\n * `top: -900px` after scrolling 900px, i.e. off screen.\n *\n * Nothing about that reads as a CSS problem from the app's side. The bar still\n * reports `position: sticky` in DevTools, the markup is unchanged, and on\n * desktop the screens usually fit without scrolling so the bug never shows. It\n * surfaces on Chrome Android, where the collapsing URL bar makes every screen a\n * scrolling screen — and it gets reported as \"the app bar is broken\", because\n * that is what the user sees.\n *\n * Hence this warning: the SDK cannot fix it from inside the component (a sticky\n * element has no way to opt out of its scroll container, and a rule the SDK\n * ships in its reset loses to the app's own stylesheet, which is imported\n * after), but it can name the cause in one console line.\n *\n * `clip` is the fix because it clamps the same horizontal overflow without\n * creating a scroll container. It has to be on `html` **and** `body` — with it\n * on only one of them the document still panned to `x: 500` in the same\n * measurement.\n */\nconst MESSAGE =\n    \"[tempest-react-sdk] <AppBar sticky /> will not stick: `document.body` has \" +\n    \"`overflow-x: hidden`, which forces its computed `overflow-y` to `auto` and makes the \" +\n    \"body a scroll container. The bar then pins to the body's scrollport instead of the \" +\n    \"viewport and scrolls off the top with the content — most visibly on Chrome Android. \" +\n    \"Fix: `html, body { overflow-x: clip }`, on both elements, since neither clamps alone. \" +\n    \"Pass `sticky={false}` if the bar is meant to scroll away.\";\n\n/** Set once the warning has been printed, so re-renders do not bury the console. */\nlet warned = false;\n\n/**\n * Reset the warn-once latch. Test-only — the latch is module state, and a suite\n * that renders more than one bar would otherwise see the warning only once.\n */\nexport function resetStickyBodyWarning(): void {\n    warned = false;\n}\n\n/**\n * Warn once, in development, when the page's own CSS will keep a sticky bar\n * from sticking.\n *\n * Reads the body's `overflow-x` rather than walking the ancestors, because that\n * single declaration is the whole failure mode: an app that genuinely wants the\n * body to scroll writes `overflow-y: auto` itself, and a sticky bar inside a\n * scroll container the app chose on purpose behaves exactly as intended. What\n * is never intentional is acquiring that scroll container as a side effect of\n * clamping the other axis.\n *\n * @param enabled - Whether the bar is actually sticky. A bar rendered with\n *   `sticky={false}` has nothing to lose and stays quiet.\n */\nexport function useStickyBodyWarning(enabled: boolean): void {\n    useEffect(() => {\n        if (!enabled || warned || !isDevBuild()) return;\n        if (typeof document === \"undefined\" || !document.body) return;\n        if (getComputedStyle(document.body).overflowX !== \"hidden\") return;\n        warned = true;\n        console.warn(MESSAGE);\n    }, [enabled]);\n}\n"],"mappings":"mEAgCA,IAAM,EACF,wdAQA,EAAS,GAwBb,SAAgB,EAAqB,EAAwB,EACzD,EAAA,EAAA,UAAA,KAAgB,CACR,CAAC,GAAW,GAAU,CAAC,EAAA,WAAW,GAClC,OAAO,SAAa,KAAe,CAAC,SAAS,MAC7C,iBAAiB,SAAS,IAAI,CAAC,CAAC,YAAc,WAClD,EAAS,GACT,QAAQ,KAAK,CAAO,EACxB,EAAG,CAAC,CAAO,CAAC,CAChB"}
+{"version":3,"file":"use-sticky-body-warning.cjs","names":[],"sources":["../../../src/components/AppBar/use-sticky-body-warning.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\nimport { isDevBuild } from \"../../utils/dev-mode\";\n\n/**\n * The one line of the app's own CSS that silently defeats `sticky`.\n *\n * `body { overflow-x: hidden }` is how most apps stop a too-wide child from\n * panning the page sideways. It also, per CSS Overflow 3, forces the computed\n * `overflow-y` to `auto` — a value the author never wrote — which makes the\n * body a **scroll container**. Every sticky descendant then pins to the body's\n * scrollport instead of the viewport, and that scrollport travels with the\n * document: measured in Chromium at 390px with a long page, the bar sat at\n * `top: -900px` after scrolling 900px, i.e. off screen.\n *\n * Nothing about that reads as a CSS problem from the app's side. The bar still\n * reports `position: sticky` in DevTools, the markup is unchanged, and on\n * desktop the screens usually fit without scrolling so the bug never shows. It\n * surfaces on Chrome Android, where the collapsing URL bar makes every screen a\n * scrolling screen — and it gets reported as \"the app bar is broken\", because\n * that is what the user sees.\n *\n * Hence this warning: the SDK cannot fix it from inside the component (a sticky\n * element has no way to opt out of its scroll container, and a rule the SDK\n * ships in its reset loses to the app's own stylesheet, which is imported\n * after), but it can name the cause in one console line.\n *\n * `clip` is the fix because it clamps the same horizontal overflow without\n * creating a scroll container. It has to be on `html` **and** `body` — with it\n * on only one of them the document still panned to `x: 500` in the same\n * measurement.\n */\nconst MESSAGE =\n    \"[tempest-react-sdk] <AppBar sticky /> will not stick: `document.body` has \" +\n    \"`overflow-x: hidden`, which forces its computed `overflow-y` to `auto` and makes the \" +\n    \"body a scroll container. The bar then pins to the body's scrollport instead of the \" +\n    \"viewport and scrolls off the top with the content — most visibly on Chrome Android. \" +\n    \"Fix: `html, body { overflow-x: clip }`, on both elements, since neither clamps alone. \" +\n    \"Pass `sticky={false}` if the bar is meant to scroll away.\";\n\n/** Set once the warning has been printed, so re-renders do not bury the console. */\nlet warned = false;\n\n/**\n * Reset the warn-once latch. Test-only — the latch is module state, and a suite\n * that renders more than one bar would otherwise see the warning only once.\n */\nexport function resetStickyBodyWarning(): void {\n    warned = false;\n}\n\n/**\n * Warn once, in development, when the page's own CSS will keep a sticky bar\n * from sticking.\n *\n * Reads the body's `overflow-x` rather than walking the ancestors, because that\n * single declaration is the whole failure mode: an app that genuinely wants the\n * body to scroll writes `overflow-y: auto` itself, and a sticky bar inside a\n * scroll container the app chose on purpose behaves exactly as intended. What\n * is never intentional is acquiring that scroll container as a side effect of\n * clamping the other axis.\n *\n * @param enabled - Whether the bar is actually sticky. A bar rendered with\n *   `sticky={false}` has nothing to lose and stays quiet.\n */\nexport function useStickyBodyWarning(enabled: boolean): void {\n    useEffect(() => {\n        if (!enabled || warned || !isDevBuild()) return;\n        if (typeof document === \"undefined\" || !document.body) return;\n        if (getComputedStyle(document.body).overflowX !== \"hidden\") return;\n        warned = true;\n        console.warn(MESSAGE);\n    }, [enabled]);\n}\n"],"mappings":"mEAgCA,IAAM,EACF,wdAQA,EAAS,GAwBb,SAAgB,EAAqB,EAAwB,EACzD,EAAA,EAAA,UAAA,KAAgB,CACR,CAAC,GAAW,GAAU,CAAC,EAAA,WAAW,GAClC,OAAO,SAAa,KAAe,CAAC,SAAS,MAC7C,iBAAiB,SAAS,IAAI,CAAC,CAAC,YAAc,WAClD,EAAS,GACT,QAAQ,KAAK,CAAO,EACxB,EAAG,CAAC,CAAO,CAAC,CAChB"}

package/dist/components/AppBar/use-sticky-body-warning.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-sticky-body-warning.js","names":[],"sources":["../../../src/components/AppBar/use-sticky-body-warning.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\nimport { isDevBuild } from \"../../utils\";\n\n/**\n * The one line of the app's own CSS that silently defeats `sticky`.\n *\n * `body { overflow-x: hidden }` is how most apps stop a too-wide child from\n * panning the page sideways. It also, per CSS Overflow 3, forces the computed\n * `overflow-y` to `auto` — a value the author never wrote — which makes the\n * body a **scroll container**. Every sticky descendant then pins to the body's\n * scrollport instead of the viewport, and that scrollport travels with the\n * document: measured in Chromium at 390px with a long page, the bar sat at\n * `top: -900px` after scrolling 900px, i.e. off screen.\n *\n * Nothing about that reads as a CSS problem from the app's side. The bar still\n * reports `position: sticky` in DevTools, the markup is unchanged, and on\n * desktop the screens usually fit without scrolling so the bug never shows. It\n * surfaces on Chrome Android, where the collapsing URL bar makes every screen a\n * scrolling screen — and it gets reported as \"the app bar is broken\", because\n * that is what the user sees.\n *\n * Hence this warning: the SDK cannot fix it from inside the component (a sticky\n * element has no way to opt out of its scroll container, and a rule the SDK\n * ships in its reset loses to the app's own stylesheet, which is imported\n * after), but it can name the cause in one console line.\n *\n * `clip` is the fix because it clamps the same horizontal overflow without\n * creating a scroll container. It has to be on `html` **and** `body` — with it\n * on only one of them the document still panned to `x: 500` in the same\n * measurement.\n */\nconst MESSAGE =\n    \"[tempest-react-sdk] <AppBar sticky /> will not stick: `document.body` has \" +\n    \"`overflow-x: hidden`, which forces its computed `overflow-y` to `auto` and makes the \" +\n    \"body a scroll container. The bar then pins to the body's scrollport instead of the \" +\n    \"viewport and scrolls off the top with the content — most visibly on Chrome Android. \" +\n    \"Fix: `html, body { overflow-x: clip }`, on both elements, since neither clamps alone. \" +\n    \"Pass `sticky={false}` if the bar is meant to scroll away.\";\n\n/** Set once the warning has been printed, so re-renders do not bury the console. */\nlet warned = false;\n\n/**\n * Reset the warn-once latch. Test-only — the latch is module state, and a suite\n * that renders more than one bar would otherwise see the warning only once.\n */\nexport function resetStickyBodyWarning(): void {\n    warned = false;\n}\n\n/**\n * Warn once, in development, when the page's own CSS will keep a sticky bar\n * from sticking.\n *\n * Reads the body's `overflow-x` rather than walking the ancestors, because that\n * single declaration is the whole failure mode: an app that genuinely wants the\n * body to scroll writes `overflow-y: auto` itself, and a sticky bar inside a\n * scroll container the app chose on purpose behaves exactly as intended. What\n * is never intentional is acquiring that scroll container as a side effect of\n * clamping the other axis.\n *\n * @param enabled - Whether the bar is actually sticky. A bar rendered with\n *   `sticky={false}` has nothing to lose and stays quiet.\n */\nexport function useStickyBodyWarning(enabled: boolean): void {\n    useEffect(() => {\n        if (!enabled || warned || !isDevBuild()) return;\n        if (typeof document === \"undefined\" || !document.body) return;\n        if (getComputedStyle(document.body).overflowX !== \"hidden\") return;\n        warned = true;\n        console.warn(MESSAGE);\n    }, [enabled]);\n}\n"],"mappings":";;;AAgCA,IAAM,IACF,ydAQA,IAAS;AAwBb,SAAgB,EAAqB,GAAwB;CACzD,QAAgB;EACR,CAAC,KAAW,KAAU,CAAC,EAAW,KAClC,OAAO,WAAa,OAAe,CAAC,SAAS,QAC7C,iBAAiB,SAAS,IAAI,CAAC,CAAC,cAAc,aAClD,IAAS,IACT,QAAQ,KAAK,CAAO;CACxB,GAAG,CAAC,CAAO,CAAC;AAChB"}
+{"version":3,"file":"use-sticky-body-warning.js","names":[],"sources":["../../../src/components/AppBar/use-sticky-body-warning.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\nimport { isDevBuild } from \"../../utils/dev-mode\";\n\n/**\n * The one line of the app's own CSS that silently defeats `sticky`.\n *\n * `body { overflow-x: hidden }` is how most apps stop a too-wide child from\n * panning the page sideways. It also, per CSS Overflow 3, forces the computed\n * `overflow-y` to `auto` — a value the author never wrote — which makes the\n * body a **scroll container**. Every sticky descendant then pins to the body's\n * scrollport instead of the viewport, and that scrollport travels with the\n * document: measured in Chromium at 390px with a long page, the bar sat at\n * `top: -900px` after scrolling 900px, i.e. off screen.\n *\n * Nothing about that reads as a CSS problem from the app's side. The bar still\n * reports `position: sticky` in DevTools, the markup is unchanged, and on\n * desktop the screens usually fit without scrolling so the bug never shows. It\n * surfaces on Chrome Android, where the collapsing URL bar makes every screen a\n * scrolling screen — and it gets reported as \"the app bar is broken\", because\n * that is what the user sees.\n *\n * Hence this warning: the SDK cannot fix it from inside the component (a sticky\n * element has no way to opt out of its scroll container, and a rule the SDK\n * ships in its reset loses to the app's own stylesheet, which is imported\n * after), but it can name the cause in one console line.\n *\n * `clip` is the fix because it clamps the same horizontal overflow without\n * creating a scroll container. It has to be on `html` **and** `body` — with it\n * on only one of them the document still panned to `x: 500` in the same\n * measurement.\n */\nconst MESSAGE =\n    \"[tempest-react-sdk] <AppBar sticky /> will not stick: `document.body` has \" +\n    \"`overflow-x: hidden`, which forces its computed `overflow-y` to `auto` and makes the \" +\n    \"body a scroll container. The bar then pins to the body's scrollport instead of the \" +\n    \"viewport and scrolls off the top with the content — most visibly on Chrome Android. \" +\n    \"Fix: `html, body { overflow-x: clip }`, on both elements, since neither clamps alone. \" +\n    \"Pass `sticky={false}` if the bar is meant to scroll away.\";\n\n/** Set once the warning has been printed, so re-renders do not bury the console. */\nlet warned = false;\n\n/**\n * Reset the warn-once latch. Test-only — the latch is module state, and a suite\n * that renders more than one bar would otherwise see the warning only once.\n */\nexport function resetStickyBodyWarning(): void {\n    warned = false;\n}\n\n/**\n * Warn once, in development, when the page's own CSS will keep a sticky bar\n * from sticking.\n *\n * Reads the body's `overflow-x` rather than walking the ancestors, because that\n * single declaration is the whole failure mode: an app that genuinely wants the\n * body to scroll writes `overflow-y: auto` itself, and a sticky bar inside a\n * scroll container the app chose on purpose behaves exactly as intended. What\n * is never intentional is acquiring that scroll container as a side effect of\n * clamping the other axis.\n *\n * @param enabled - Whether the bar is actually sticky. A bar rendered with\n *   `sticky={false}` has nothing to lose and stays quiet.\n */\nexport function useStickyBodyWarning(enabled: boolean): void {\n    useEffect(() => {\n        if (!enabled || warned || !isDevBuild()) return;\n        if (typeof document === \"undefined\" || !document.body) return;\n        if (getComputedStyle(document.body).overflowX !== \"hidden\") return;\n        warned = true;\n        console.warn(MESSAGE);\n    }, [enabled]);\n}\n"],"mappings":";;;AAgCA,IAAM,IACF,ydAQA,IAAS;AAwBb,SAAgB,EAAqB,GAAwB;CACzD,QAAgB;EACR,CAAC,KAAW,KAAU,CAAC,EAAW,KAClC,OAAO,WAAa,OAAe,CAAC,SAAS,QAC7C,iBAAiB,SAAS,IAAI,CAAC,CAAC,cAAc,aAClD,IAAS,IACT,QAAQ,KAAK,CAAO;CACxB,GAAG,CAAC,CAAO,CAAC;AAChB"}

package/dist/components/DataTable/DataTable.cjs

@@ -1,2 +1,2 @@
-const e=require("../../utils/cn.cjs"),t=require("../../utils/compare-values.cjs"),n=require("../../hooks/use-pagination.cjs"),r=require("../../hooks/use-announce.cjs"),i=require("../Pagination/Pagination.cjs"),a=require("../SearchBar/SearchBar.cjs"),o=require("../Table/Table.cjs"),s=require("./DataTable.module.cjs"),c=require("./EditableCell.cjs"),ee=require("./LoadingRows.cjs"),te=require("./use-dev-warnings.cjs"),ne=require("./edit-labels.cjs");let l=require("react"),u=require("react/jsx-runtime");function d(e,t){return`${String(e)}::${String(t)}`}function f(e){return typeof e.header==`string`?e.header:String(e.key)}function p({data:p,columns:m,pageSize:h=10,searchable:g=!1,searchKeys:_,initialSort:re,rowKey:v=(e,t)=>t,emptyMessage:ie,onCellChange:y,editLabels:b,totalItems:ae,page:x,onPageChange:S,manualSort:oe,onSortChange:se,manualSearch:ce,onSearchChange:le,loading:C=!1,className:ue,...de}){let[w,fe]=(0,l.useState)(``),[T,pe]=(0,l.useState)(re??null),{page:me,setPage:E}=n.usePagination(1,h),D=r.useAnnounce(),O=ae!==void 0,k=oe??O,A=ce??O,j=x??me,M=(0,l.useCallback)(e=>{x===void 0&&E(e),S?.(e)},[x,E,S]);te.useDevWarnings({serverMode:O,controlledPage:x,onPageChange:S,sortIsManual:k,onSortChange:se});let[N,P]=(0,l.useState)(null),[F,I]=(0,l.useState)(null),[L,R]=(0,l.useState)({}),[z,B]=(0,l.useState)({}),[V,H]=(0,l.useState)({}),U=(0,l.useMemo)(()=>({...ne.DEFAULT_EDIT_LABELS,...b}),[b]),W=y!==void 0&&m.some(e=>e.editable),he=(0,l.useMemo)(()=>_&&_.length>0?_:m.filter(e=>{let t=p.find(t=>t[e.key]!=null),n=t?t[e.key]:void 0;return typeof n==`string`||typeof n==`number`}).map(e=>e.key),[_,m,p]),G=(0,l.useMemo)(()=>{let e=w.trim().toLowerCase();return!e||!g||A?p:p.filter(t=>he.some(n=>{let r=t[n];return r!=null&&String(r).toLowerCase().includes(e)}))},[p,w,g,A,he]),K=(0,l.useMemo)(()=>{if(!T||k)return G;let e=T.direction===`asc`?1:-1;return[...G].sort((n,r)=>t.compareValues(n[T.key],r[T.key])*e)},[G,T,k]),ge=ae??K.length,q=Math.max(1,Math.ceil(ge/h));(0,l.useEffect)(()=>{!O&&j>q&&M(q)},[O,j,q,M]);let J=O?j:Math.min(j,q),Y=(0,l.useMemo)(()=>{if(O)return K;let e=(J-1)*h;return K.slice(e,e+h)},[O,K,J,h]);function _e(e){let t=T,n=!t||t.key!==e?{key:e,direction:`asc`}:t.direction===`asc`?{key:e,direction:`desc`}:null;pe(n),se?.(n)}let X=(0,l.useCallback)(e=>(J-1)*h+e,[J,h]),Z=(0,l.useMemo)(()=>{if(!W)return[];let e=[];return Y.forEach((t,n)=>{let r=v(t,X(n));for(let t of m)t.editable&&e.push(d(r,t.key))}),e},[W,Y,m,X]),Q=(0,l.useCallback)((e,t,n)=>n in L?L[n]:e[t.key],[L]),ve=(0,l.useCallback)(async(e,t,n)=>{H(t=>({...t,[e]:!0}));try{await y?.(n),D(U.saved(f(t)))}catch(n){R(t=>{let n={...t};return delete n[e],n});let r=n instanceof Error&&n.message?n.message:U.saveFailed(f(t));B(t=>({...t,[e]:r}))}finally{H(t=>{let n={...t};return delete n[e],n})}},[y,D,U]),$=(0,l.useCallback)((e,t)=>{if(t===`none`){P(null),I(e);return}let n=Z.indexOf(e),r=Z[n+(t===`next`?1:-1)];if(r===void 0){P(null),I(e);return}P(r),I(null)},[Z]),ye=(0,l.useCallback)((e,t,n,r,i,a)=>{let o=Q(e,t,n);if(i===(t.formatEdit?t.formatEdit(e):String(o??``))){$(n,a);return}let s=t.parse?t.parse(i,e):t.editorType===`number`?Number(i):i.trim(),c=t.validate?.(s,e)??null;if(c){B(e=>({...e,[n]:c}));return}B(e=>{let t={...e};return delete t[n],t}),R(e=>({...e,[n]:s})),$(n,a),ve(n,t,{row:e,key:t.key,value:s,previous:o,rowIndex:X(r)})},[Q,$,ve,X]),be=(0,l.useMemo)(()=>m.map(e=>{let t=T?.key===e.key?T?.direction===`asc`?` ▲`:` ▼`:``,n=e.sortable?(0,u.jsxs)(`button`,{type:`button`,className:s.default.sortButton,onClick:()=>_e(e.key),"aria-label":`Ordenar por ${f(e)}`,children:[e.header,(0,u.jsx)(`span`,{className:s.default.sortIndicator,"aria-hidden":!0,children:t})]}):e.header,r=t=>e.render?e.render(t):t[e.key]??null,i=(t,n)=>{let r={...t,[e.key]:n};return e.render?e.render(r):r[e.key]??null},a=W&&e.editable===!0;return{key:String(e.key),header:n,align:e.align,priority:e.priority,width:e.width,render:a?(t,n)=>{let r=d(v(t,X(n)),e.key),a=Q(t,e,r),o=e.formatEdit?e.formatEdit(t):String(a??``);return(0,u.jsx)(c.EditableCell,{text:o,columnLabel:f(e),rowNumber:n+1,inputType:e.editorType??`text`,editing:N===r,refocus:F===r,saving:V[r]===!0,error:z[r]??null,errorId:`tempest-cell-error-${r.replace(/[^\w-]/g,`_`)}`,labels:U,onOpen:()=>{P(r),I(null)},onCommit:(i,a)=>ye(t,e,r,n,i,a),onCancel:()=>{P(null),I(r),B(e=>{let t={...e};return delete t[r],t})},children:i(t,a)})}:r}}),[m,T,W,N,F,V,z,U,L,X,ye]),xe=C&&Y.length===0;return(0,u.jsxs)(`div`,{className:e.cn(s.default.wrapper,ue),...de,children:[g&&(0,u.jsx)(a.SearchBar,{value:w,onChange:e=>{fe(e),M(1),le?.(e)},wrapperClassName:s.default.search}),(0,u.jsx)(`div`,{className:e.cn(C&&!xe&&s.default.pending),"aria-busy":C||void 0,"data-testid":`tempest-datatable-body`,children:xe?(0,u.jsx)(ee.LoadingRows,{columns:be.length,rows:Math.min(h,8)}):(0,u.jsx)(o.Table,{columns:be,data:Y,rowKey:(e,t)=>v(e,X(t)),emptyMessage:ie})}),q>1&&(0,u.jsx)(i.Pagination,{page:J,totalPages:q,onPageChange:M,totalItems:ge})]})}exports.DataTable=p;
+const e=require("../../utils/cn.cjs"),t=require("../../hooks/use-pagination.cjs"),n=require("../../hooks/use-announce.cjs"),r=require("../Pagination/Pagination.cjs"),i=require("../SearchBar/SearchBar.cjs"),a=require("../Table/Table.cjs"),o=require("../../utils/compare-values.cjs"),s=require("./DataTable.module.cjs"),c=require("./EditableCell.cjs"),ee=require("./LoadingRows.cjs"),te=require("./use-dev-warnings.cjs"),ne=require("./edit-labels.cjs");let l=require("react"),u=require("react/jsx-runtime");function d(e,t){return`${String(e)}::${String(t)}`}function f(e){return typeof e.header==`string`?e.header:String(e.key)}function p({data:p,columns:m,pageSize:h=10,searchable:g=!1,searchKeys:_,initialSort:re,rowKey:v=(e,t)=>t,emptyMessage:ie,onCellChange:y,editLabels:b,totalItems:ae,page:x,onPageChange:S,manualSort:oe,onSortChange:se,manualSearch:ce,onSearchChange:le,loading:C=!1,className:ue,...de}){let[w,fe]=(0,l.useState)(``),[T,pe]=(0,l.useState)(re??null),{page:me,setPage:E}=t.usePagination(1,h),D=n.useAnnounce(),O=ae!==void 0,k=oe??O,A=ce??O,j=x??me,M=(0,l.useCallback)(e=>{x===void 0&&E(e),S?.(e)},[x,E,S]);te.useDevWarnings({serverMode:O,controlledPage:x,onPageChange:S,sortIsManual:k,onSortChange:se});let[N,P]=(0,l.useState)(null),[F,I]=(0,l.useState)(null),[L,R]=(0,l.useState)({}),[z,B]=(0,l.useState)({}),[V,H]=(0,l.useState)({}),U=(0,l.useMemo)(()=>({...ne.DEFAULT_EDIT_LABELS,...b}),[b]),W=y!==void 0&&m.some(e=>e.editable),he=(0,l.useMemo)(()=>_&&_.length>0?_:m.filter(e=>{let t=p.find(t=>t[e.key]!=null),n=t?t[e.key]:void 0;return typeof n==`string`||typeof n==`number`}).map(e=>e.key),[_,m,p]),G=(0,l.useMemo)(()=>{let e=w.trim().toLowerCase();return!e||!g||A?p:p.filter(t=>he.some(n=>{let r=t[n];return r!=null&&String(r).toLowerCase().includes(e)}))},[p,w,g,A,he]),K=(0,l.useMemo)(()=>{if(!T||k)return G;let e=T.direction===`asc`?1:-1;return[...G].sort((t,n)=>o.compareValues(t[T.key],n[T.key])*e)},[G,T,k]),ge=ae??K.length,q=Math.max(1,Math.ceil(ge/h));(0,l.useEffect)(()=>{!O&&j>q&&M(q)},[O,j,q,M]);let J=O?j:Math.min(j,q),Y=(0,l.useMemo)(()=>{if(O)return K;let e=(J-1)*h;return K.slice(e,e+h)},[O,K,J,h]);function _e(e){let t=T,n=!t||t.key!==e?{key:e,direction:`asc`}:t.direction===`asc`?{key:e,direction:`desc`}:null;pe(n),se?.(n)}let X=(0,l.useCallback)(e=>(J-1)*h+e,[J,h]),Z=(0,l.useMemo)(()=>{if(!W)return[];let e=[];return Y.forEach((t,n)=>{let r=v(t,X(n));for(let t of m)t.editable&&e.push(d(r,t.key))}),e},[W,Y,m,X]),Q=(0,l.useCallback)((e,t,n)=>n in L?L[n]:e[t.key],[L]),ve=(0,l.useCallback)(async(e,t,n)=>{H(t=>({...t,[e]:!0}));try{await y?.(n),D(U.saved(f(t)))}catch(n){R(t=>{let n={...t};return delete n[e],n});let r=n instanceof Error&&n.message?n.message:U.saveFailed(f(t));B(t=>({...t,[e]:r}))}finally{H(t=>{let n={...t};return delete n[e],n})}},[y,D,U]),$=(0,l.useCallback)((e,t)=>{if(t===`none`){P(null),I(e);return}let n=Z.indexOf(e),r=Z[n+(t===`next`?1:-1)];if(r===void 0){P(null),I(e);return}P(r),I(null)},[Z]),ye=(0,l.useCallback)((e,t,n,r,i,a)=>{let o=Q(e,t,n);if(i===(t.formatEdit?t.formatEdit(e):String(o??``))){$(n,a);return}let s=t.parse?t.parse(i,e):t.editorType===`number`?Number(i):i.trim(),c=t.validate?.(s,e)??null;if(c){B(e=>({...e,[n]:c}));return}B(e=>{let t={...e};return delete t[n],t}),R(e=>({...e,[n]:s})),$(n,a),ve(n,t,{row:e,key:t.key,value:s,previous:o,rowIndex:X(r)})},[Q,$,ve,X]),be=(0,l.useMemo)(()=>m.map(e=>{let t=T?.key===e.key?T?.direction===`asc`?` ▲`:` ▼`:``,n=e.sortable?(0,u.jsxs)(`button`,{type:`button`,className:s.default.sortButton,onClick:()=>_e(e.key),"aria-label":`Ordenar por ${f(e)}`,children:[e.header,(0,u.jsx)(`span`,{className:s.default.sortIndicator,"aria-hidden":!0,children:t})]}):e.header,r=t=>e.render?e.render(t):t[e.key]??null,i=(t,n)=>{let r={...t,[e.key]:n};return e.render?e.render(r):r[e.key]??null},a=W&&e.editable===!0;return{key:String(e.key),header:n,align:e.align,priority:e.priority,width:e.width,render:a?(t,n)=>{let r=d(v(t,X(n)),e.key),a=Q(t,e,r),o=e.formatEdit?e.formatEdit(t):String(a??``);return(0,u.jsx)(c.EditableCell,{text:o,columnLabel:f(e),rowNumber:n+1,inputType:e.editorType??`text`,editing:N===r,refocus:F===r,saving:V[r]===!0,error:z[r]??null,errorId:`tempest-cell-error-${r.replace(/[^\w-]/g,`_`)}`,labels:U,onOpen:()=>{P(r),I(null)},onCommit:(i,a)=>ye(t,e,r,n,i,a),onCancel:()=>{P(null),I(r),B(e=>{let t={...e};return delete t[r],t})},children:i(t,a)})}:r}}),[m,T,W,N,F,V,z,U,L,X,ye]),xe=C&&Y.length===0;return(0,u.jsxs)(`div`,{className:e.cn(s.default.wrapper,ue),...de,children:[g&&(0,u.jsx)(i.SearchBar,{value:w,onChange:e=>{fe(e),M(1),le?.(e)},wrapperClassName:s.default.search}),(0,u.jsx)(`div`,{className:e.cn(C&&!xe&&s.default.pending),"aria-busy":C||void 0,"data-testid":`tempest-datatable-body`,children:xe?(0,u.jsx)(ee.LoadingRows,{columns:be.length,rows:Math.min(h,8)}):(0,u.jsx)(a.Table,{columns:be,data:Y,rowKey:(e,t)=>v(e,X(t)),emptyMessage:ie})}),q>1&&(0,u.jsx)(r.Pagination,{page:J,totalPages:q,onPageChange:M,totalItems:ge})]})}exports.DataTable=p;
 //# sourceMappingURL=DataTable.cjs.map

package/dist/components/DataTable/DataTable.js

@@ -1,10 +1,10 @@
 import { cn as e } from "../../utils/cn.js";
-import { compareValues as t } from "../../utils/compare-values.js";
-import { usePagination as n } from "../../hooks/use-pagination.js";
-import { useAnnounce as r } from "../../hooks/use-announce.js";
-import { Pagination as i } from "../Pagination/Pagination.js";
-import { SearchBar as a } from "../SearchBar/SearchBar.js";
-import { Table as o } from "../Table/Table.js";
+import { usePagination as t } from "../../hooks/use-pagination.js";
+import { useAnnounce as n } from "../../hooks/use-announce.js";
+import { Pagination as r } from "../Pagination/Pagination.js";
+import { SearchBar as i } from "../SearchBar/SearchBar.js";
+import { Table as a } from "../Table/Table.js";
+import { compareValues as o } from "../../utils/compare-values.js";
 import s from "./DataTable.module.js";
 import { EditableCell as c } from "./EditableCell.js";
 import { LoadingRows as ee } from "./LoadingRows.js";
@@ -20,7 +20,7 @@ function p(e) {
 	return typeof e.header == "string" ? e.header : String(e.key);
 }
 function m({ data: m, columns: h, pageSize: g = 10, searchable: _ = !1, searchKeys: v, initialSort: oe, rowKey: y = (e, t) => t, emptyMessage: se, onCellChange: b, editLabels: ce, totalItems: le, page: x, onPageChange: S, manualSort: ue, onSortChange: C, manualSearch: de, onSearchChange: fe, loading: w = !1, className: pe, ...me }) {
-	let [T, he] = d(""), [E, ge] = d(oe ?? null), { page: _e, setPage: ve } = n(1, g), ye = r(), D = le !== void 0, O = ue ?? D, k = de ?? D, A = x ?? _e, j = l((e) => {
+	let [T, he] = d(""), [E, ge] = d(oe ?? null), { page: _e, setPage: ve } = t(1, g), ye = n(), D = le !== void 0, O = ue ?? D, k = de ?? D, A = x ?? _e, j = l((e) => {
 		x === void 0 && ve(e), S?.(e);
 	}, [
 		x,
@@ -59,7 +59,7 @@ function m({ data: m, columns: h, pageSize: g = 10, searchable: _ = !1, searchKe
 	]), G = u(() => {
 		if (!E || O) return W;
 		let e = E.direction === "asc" ? 1 : -1;
-		return [...W].sort((n, r) => t(n[E.key], r[E.key]) * e);
+		return [...W].sort((t, n) => o(t[E.key], n[E.key]) * e);
 	}, [
 		W,
 		E,
@@ -243,7 +243,7 @@ function m({ data: m, columns: h, pageSize: g = 10, searchable: _ = !1, searchKe
 		className: e(s.wrapper, pe),
 		...me,
 		children: [
-			_ && /* @__PURE__ */ f(a, {
+			_ && /* @__PURE__ */ f(i, {
 				value: T,
 				onChange: (e) => {
 					he(e), j(1), fe?.(e);
@@ -257,14 +257,14 @@ function m({ data: m, columns: h, pageSize: g = 10, searchable: _ = !1, searchKe
 				children: $ ? /* @__PURE__ */ f(ee, {
 					columns: Te.length,
 					rows: Math.min(g, 8)
-				}) : /* @__PURE__ */ f(o, {
+				}) : /* @__PURE__ */ f(a, {
 					columns: Te,
 					data: J,
 					rowKey: (e, t) => y(e, Y(t)),
 					emptyMessage: se
 				})
 			}),
-			K > 1 && /* @__PURE__ */ f(i, {
+			K > 1 && /* @__PURE__ */ f(r, {
 				page: q,
 				totalPages: K,
 				onPageChange: j,

package/dist/components/DataTable/use-dev-warnings.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-dev-warnings.cjs","names":[],"sources":["../../../src/components/DataTable/use-dev-warnings.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\nimport { isDevBuild } from \"../../utils\";\n\n/** What {@link useDevWarnings} needs to judge the prop combination. */\nexport interface DataTableDevWarningsInput {\n    /** Whether `totalItems` was passed. */\n    serverMode: boolean;\n    /** The controlled `page`, if any. */\n    controlledPage: number | undefined;\n    /** The page callback, if any. */\n    onPageChange: ((page: number) => void) | undefined;\n    /** Whether sorting is delegated. */\n    sortIsManual: boolean;\n    /** The sort callback, if any. */\n    onSortChange: ((sort: never) => void) | undefined;\n}\n\n/**\n * Warn, in development only, about prop combinations that render a table which\n * silently lies.\n *\n * Each of these produces a screen that looks like it works: the header sorts and\n * nothing moves, the pager renders and clicking it does nothing. They are not\n * type errors — every prop is optional on its own — so the only place to catch\n * them is at runtime, once, in dev.\n *\n * @param input - The resolved prop combination.\n */\nexport function useDevWarnings({\n    serverMode,\n    controlledPage,\n    onPageChange,\n    sortIsManual,\n    onSortChange,\n}: DataTableDevWarningsInput): void {\n    useEffect(() => {\n        if (!isDevBuild()) return;\n\n        if (serverMode && controlledPage === undefined) {\n            console.warn(\n                \"[tempest] <DataTable totalItems> is server mode, which needs a controlled `page`. \" +\n                    \"Without it the pager moves the internal page while `data` keeps showing page 1.\",\n            );\n        }\n        if (controlledPage !== undefined && !onPageChange) {\n            console.warn(\n                \"[tempest] <DataTable page> is controlled but `onPageChange` is missing, so the pager cannot do anything.\",\n            );\n        }\n        if (sortIsManual && !onSortChange) {\n            console.warn(\n                \"[tempest] <DataTable> is sorting manually but `onSortChange` is missing: clicking a sortable header changes the arrow and nothing else.\",\n            );\n        }\n    }, [serverMode, controlledPage, onPageChange, sortIsManual, onSortChange]);\n}\n"],"mappings":"mEA6BA,SAAgB,EAAe,CAC3B,aACA,iBACA,eACA,eACA,gBACgC,EAChC,EAAA,EAAA,UAAA,KAAgB,CACP,EAAA,WAAW,IAEZ,GAAc,IAAmB,IAAA,IACjC,QAAQ,KACJ,mKAEJ,EAEA,IAAmB,IAAA,IAAa,CAAC,GACjC,QAAQ,KACJ,0GACJ,EAEA,GAAgB,CAAC,GACjB,QAAQ,KACJ,yIACJ,EAER,EAAG,CAAC,EAAY,EAAgB,EAAc,EAAc,CAAY,CAAC,CAC7E"}
+{"version":3,"file":"use-dev-warnings.cjs","names":[],"sources":["../../../src/components/DataTable/use-dev-warnings.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\nimport { isDevBuild } from \"../../utils/dev-mode\";\n\n/** What {@link useDevWarnings} needs to judge the prop combination. */\nexport interface DataTableDevWarningsInput {\n    /** Whether `totalItems` was passed. */\n    serverMode: boolean;\n    /** The controlled `page`, if any. */\n    controlledPage: number | undefined;\n    /** The page callback, if any. */\n    onPageChange: ((page: number) => void) | undefined;\n    /** Whether sorting is delegated. */\n    sortIsManual: boolean;\n    /** The sort callback, if any. */\n    onSortChange: ((sort: never) => void) | undefined;\n}\n\n/**\n * Warn, in development only, about prop combinations that render a table which\n * silently lies.\n *\n * Each of these produces a screen that looks like it works: the header sorts and\n * nothing moves, the pager renders and clicking it does nothing. They are not\n * type errors — every prop is optional on its own — so the only place to catch\n * them is at runtime, once, in dev.\n *\n * @param input - The resolved prop combination.\n */\nexport function useDevWarnings({\n    serverMode,\n    controlledPage,\n    onPageChange,\n    sortIsManual,\n    onSortChange,\n}: DataTableDevWarningsInput): void {\n    useEffect(() => {\n        if (!isDevBuild()) return;\n\n        if (serverMode && controlledPage === undefined) {\n            console.warn(\n                \"[tempest] <DataTable totalItems> is server mode, which needs a controlled `page`. \" +\n                    \"Without it the pager moves the internal page while `data` keeps showing page 1.\",\n            );\n        }\n        if (controlledPage !== undefined && !onPageChange) {\n            console.warn(\n                \"[tempest] <DataTable page> is controlled but `onPageChange` is missing, so the pager cannot do anything.\",\n            );\n        }\n        if (sortIsManual && !onSortChange) {\n            console.warn(\n                \"[tempest] <DataTable> is sorting manually but `onSortChange` is missing: clicking a sortable header changes the arrow and nothing else.\",\n            );\n        }\n    }, [serverMode, controlledPage, onPageChange, sortIsManual, onSortChange]);\n}\n"],"mappings":"mEA6BA,SAAgB,EAAe,CAC3B,aACA,iBACA,eACA,eACA,gBACgC,EAChC,EAAA,EAAA,UAAA,KAAgB,CACP,EAAA,WAAW,IAEZ,GAAc,IAAmB,IAAA,IACjC,QAAQ,KACJ,mKAEJ,EAEA,IAAmB,IAAA,IAAa,CAAC,GACjC,QAAQ,KACJ,0GACJ,EAEA,GAAgB,CAAC,GACjB,QAAQ,KACJ,yIACJ,EAER,EAAG,CAAC,EAAY,EAAgB,EAAc,EAAc,CAAY,CAAC,CAC7E"}

package/dist/components/DataTable/use-dev-warnings.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-dev-warnings.js","names":[],"sources":["../../../src/components/DataTable/use-dev-warnings.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\nimport { isDevBuild } from \"../../utils\";\n\n/** What {@link useDevWarnings} needs to judge the prop combination. */\nexport interface DataTableDevWarningsInput {\n    /** Whether `totalItems` was passed. */\n    serverMode: boolean;\n    /** The controlled `page`, if any. */\n    controlledPage: number | undefined;\n    /** The page callback, if any. */\n    onPageChange: ((page: number) => void) | undefined;\n    /** Whether sorting is delegated. */\n    sortIsManual: boolean;\n    /** The sort callback, if any. */\n    onSortChange: ((sort: never) => void) | undefined;\n}\n\n/**\n * Warn, in development only, about prop combinations that render a table which\n * silently lies.\n *\n * Each of these produces a screen that looks like it works: the header sorts and\n * nothing moves, the pager renders and clicking it does nothing. They are not\n * type errors — every prop is optional on its own — so the only place to catch\n * them is at runtime, once, in dev.\n *\n * @param input - The resolved prop combination.\n */\nexport function useDevWarnings({\n    serverMode,\n    controlledPage,\n    onPageChange,\n    sortIsManual,\n    onSortChange,\n}: DataTableDevWarningsInput): void {\n    useEffect(() => {\n        if (!isDevBuild()) return;\n\n        if (serverMode && controlledPage === undefined) {\n            console.warn(\n                \"[tempest] <DataTable totalItems> is server mode, which needs a controlled `page`. \" +\n                    \"Without it the pager moves the internal page while `data` keeps showing page 1.\",\n            );\n        }\n        if (controlledPage !== undefined && !onPageChange) {\n            console.warn(\n                \"[tempest] <DataTable page> is controlled but `onPageChange` is missing, so the pager cannot do anything.\",\n            );\n        }\n        if (sortIsManual && !onSortChange) {\n            console.warn(\n                \"[tempest] <DataTable> is sorting manually but `onSortChange` is missing: clicking a sortable header changes the arrow and nothing else.\",\n            );\n        }\n    }, [serverMode, controlledPage, onPageChange, sortIsManual, onSortChange]);\n}\n"],"mappings":";;;AA6BA,SAAgB,EAAe,EAC3B,eACA,mBACA,iBACA,iBACA,mBACgC;CAChC,QAAgB;EACP,EAAW,MAEZ,KAAc,MAAmB,KAAA,KACjC,QAAQ,KACJ,mKAEJ,GAEA,MAAmB,KAAA,KAAa,CAAC,KACjC,QAAQ,KACJ,0GACJ,GAEA,KAAgB,CAAC,KACjB,QAAQ,KACJ,yIACJ;CAER,GAAG;EAAC;EAAY;EAAgB;EAAc;EAAc;CAAY,CAAC;AAC7E"}
+{"version":3,"file":"use-dev-warnings.js","names":[],"sources":["../../../src/components/DataTable/use-dev-warnings.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\nimport { isDevBuild } from \"../../utils/dev-mode\";\n\n/** What {@link useDevWarnings} needs to judge the prop combination. */\nexport interface DataTableDevWarningsInput {\n    /** Whether `totalItems` was passed. */\n    serverMode: boolean;\n    /** The controlled `page`, if any. */\n    controlledPage: number | undefined;\n    /** The page callback, if any. */\n    onPageChange: ((page: number) => void) | undefined;\n    /** Whether sorting is delegated. */\n    sortIsManual: boolean;\n    /** The sort callback, if any. */\n    onSortChange: ((sort: never) => void) | undefined;\n}\n\n/**\n * Warn, in development only, about prop combinations that render a table which\n * silently lies.\n *\n * Each of these produces a screen that looks like it works: the header sorts and\n * nothing moves, the pager renders and clicking it does nothing. They are not\n * type errors — every prop is optional on its own — so the only place to catch\n * them is at runtime, once, in dev.\n *\n * @param input - The resolved prop combination.\n */\nexport function useDevWarnings({\n    serverMode,\n    controlledPage,\n    onPageChange,\n    sortIsManual,\n    onSortChange,\n}: DataTableDevWarningsInput): void {\n    useEffect(() => {\n        if (!isDevBuild()) return;\n\n        if (serverMode && controlledPage === undefined) {\n            console.warn(\n                \"[tempest] <DataTable totalItems> is server mode, which needs a controlled `page`. \" +\n                    \"Without it the pager moves the internal page while `data` keeps showing page 1.\",\n            );\n        }\n        if (controlledPage !== undefined && !onPageChange) {\n            console.warn(\n                \"[tempest] <DataTable page> is controlled but `onPageChange` is missing, so the pager cannot do anything.\",\n            );\n        }\n        if (sortIsManual && !onSortChange) {\n            console.warn(\n                \"[tempest] <DataTable> is sorting manually but `onSortChange` is missing: clicking a sortable header changes the arrow and nothing else.\",\n            );\n        }\n    }, [serverMode, controlledPage, onPageChange, sortIsManual, onSortChange]);\n}\n"],"mappings":";;;AA6BA,SAAgB,EAAe,EAC3B,eACA,mBACA,iBACA,iBACA,mBACgC;CAChC,QAAgB;EACP,EAAW,MAEZ,KAAc,MAAmB,KAAA,KACjC,QAAQ,KACJ,mKAEJ,GAEA,MAAmB,KAAA,KAAa,CAAC,KACjC,QAAQ,KACJ,0GACJ,GAEA,KAAgB,CAAC,KACjB,QAAQ,KACJ,yIACJ;CAER,GAAG;EAAC;EAAY;EAAgB;EAAc;EAAc;CAAY,CAAC;AAC7E"}

package/dist/components/NotificationCenter/NotificationCenter.cjs

@@ -1,2 +1,2 @@
-const e=require("../../utils/cn.cjs"),t=require("../../utils/relative-time.cjs"),n=require("../Badge/Badge.cjs"),r=require("../EmptyState/EmptyState.cjs"),i=require("./NotificationCenter.module.cjs");let a=require("react/jsx-runtime");function o({items:o,title:s=`Notificações`,onSelect:c,onMarkRead:l,onMarkAllRead:u,onDismiss:d,renderIcon:f,locale:p=`pt-BR`,emptyState:m,now:h,className:g,..._}){let v=o.filter(e=>!e.read).length,y=h??new Date().getTime(),b=e=>{e.read||l?.(e.id),c?.(e)},x=!!(c||l);return(0,a.jsxs)(`div`,{className:e.cn(i.default.panel,g),..._,children:[(s||u&&v>0)&&(0,a.jsxs)(`header`,{className:i.default.header,children:[s?(0,a.jsxs)(`h2`,{className:i.default.title,children:[s,v>0&&(0,a.jsx)(n.Badge,{variant:`primary`,"aria-label":`${v} não lidas`,children:v})]}):(0,a.jsx)(`span`,{}),u&&v>0&&(0,a.jsx)(`button`,{type:`button`,className:i.default.headerAction,onClick:u,children:`Marcar todas como lidas`})]}),o.length===0?m??(0,a.jsx)(r.EmptyState,{title:`Nenhuma notificação`}):(0,a.jsx)(`ul`,{className:i.default.list,children:o.map(n=>(0,a.jsxs)(`li`,{className:e.cn(i.default.item,!n.read&&i.default.unread),"aria-current":n.read?void 0:`true`,children:[f&&(0,a.jsx)(`span`,{className:i.default.icon,children:f(n)}),(0,a.jsxs)(`div`,{className:i.default.body,children:[x?(0,a.jsxs)(`button`,{type:`button`,className:i.default.trigger,onClick:()=>b(n),children:[(0,a.jsx)(`span`,{className:i.default.itemTitle,children:n.title}),n.body&&(0,a.jsx)(`span`,{className:i.default.itemBody,children:n.body})]}):(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(`span`,{className:i.default.itemTitle,children:n.title}),n.body&&(0,a.jsx)(`span`,{className:i.default.itemBody,children:n.body})]}),(0,a.jsx)(`time`,{className:i.default.time,dateTime:new Date(n.receivedAt).toISOString(),children:t.relativeTime(n.receivedAt,{locale:p,now:y})})]}),d&&(0,a.jsx)(`button`,{type:`button`,className:i.default.dismiss,onClick:()=>d(n.id),"aria-label":`Descartar: ${n.title}`,children:`×`})]},n.id))})]})}exports.NotificationCenter=o;
+const e=require("../../utils/cn.cjs"),t=require("../Badge/Badge.cjs"),n=require("../EmptyState/EmptyState.cjs"),r=require("../../utils/relative-time.cjs"),i=require("./NotificationCenter.module.cjs");let a=require("react/jsx-runtime");function o({items:o,title:s=`Notificações`,onSelect:c,onMarkRead:l,onMarkAllRead:u,onDismiss:d,renderIcon:f,locale:p=`pt-BR`,emptyState:m,now:h,className:g,..._}){let v=o.filter(e=>!e.read).length,y=h??new Date().getTime(),b=e=>{e.read||l?.(e.id),c?.(e)},x=!!(c||l);return(0,a.jsxs)(`div`,{className:e.cn(i.default.panel,g),..._,children:[(s||u&&v>0)&&(0,a.jsxs)(`header`,{className:i.default.header,children:[s?(0,a.jsxs)(`h2`,{className:i.default.title,children:[s,v>0&&(0,a.jsx)(t.Badge,{variant:`primary`,"aria-label":`${v} não lidas`,children:v})]}):(0,a.jsx)(`span`,{}),u&&v>0&&(0,a.jsx)(`button`,{type:`button`,className:i.default.headerAction,onClick:u,children:`Marcar todas como lidas`})]}),o.length===0?m??(0,a.jsx)(n.EmptyState,{title:`Nenhuma notificação`}):(0,a.jsx)(`ul`,{className:i.default.list,children:o.map(t=>(0,a.jsxs)(`li`,{className:e.cn(i.default.item,!t.read&&i.default.unread),"aria-current":t.read?void 0:`true`,children:[f&&(0,a.jsx)(`span`,{className:i.default.icon,children:f(t)}),(0,a.jsxs)(`div`,{className:i.default.body,children:[x?(0,a.jsxs)(`button`,{type:`button`,className:i.default.trigger,onClick:()=>b(t),children:[(0,a.jsx)(`span`,{className:i.default.itemTitle,children:t.title}),t.body&&(0,a.jsx)(`span`,{className:i.default.itemBody,children:t.body})]}):(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(`span`,{className:i.default.itemTitle,children:t.title}),t.body&&(0,a.jsx)(`span`,{className:i.default.itemBody,children:t.body})]}),(0,a.jsx)(`time`,{className:i.default.time,dateTime:new Date(t.receivedAt).toISOString(),children:r.relativeTime(t.receivedAt,{locale:p,now:y})})]}),d&&(0,a.jsx)(`button`,{type:`button`,className:i.default.dismiss,onClick:()=>d(t.id),"aria-label":`Descartar: ${t.title}`,children:`×`})]},t.id))})]})}exports.NotificationCenter=o;
 //# sourceMappingURL=NotificationCenter.cjs.map

package/dist/components/NotificationCenter/NotificationCenter.js

@@ -1,7 +1,7 @@
 import { cn as e } from "../../utils/cn.js";
-import { relativeTime as t } from "../../utils/relative-time.js";
-import { Badge as n } from "../Badge/Badge.js";
-import { EmptyState as r } from "../EmptyState/EmptyState.js";
+import { Badge as t } from "../Badge/Badge.js";
+import { EmptyState as n } from "../EmptyState/EmptyState.js";
+import { relativeTime as r } from "../../utils/relative-time.js";
 import i from "./NotificationCenter.module.js";
 import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/components/NotificationCenter/NotificationCenter.tsx
@@ -16,7 +16,7 @@ function c({ items: c, title: l = "Notificações", onSelect: u, onMarkRead: d,
 			className: i.header,
 			children: [l ? /* @__PURE__ */ s("h2", {
 				className: i.title,
-				children: [l, b > 0 && /* @__PURE__ */ o(n, {
+				children: [l, b > 0 && /* @__PURE__ */ o(t, {
 					variant: "primary",
 					"aria-label": `${b} não lidas`,
 					children: b
@@ -27,39 +27,39 @@ function c({ items: c, title: l = "Notificações", onSelect: u, onMarkRead: d,
 				onClick: f,
 				children: "Marcar todas como lidas"
 			})]
-		}), c.length === 0 ? g ?? /* @__PURE__ */ o(r, { title: "Nenhuma notificação" }) : /* @__PURE__ */ o("ul", {
+		}), c.length === 0 ? g ?? /* @__PURE__ */ o(n, { title: "Nenhuma notificação" }) : /* @__PURE__ */ o("ul", {
 			className: i.list,
-			children: c.map((n) => /* @__PURE__ */ s("li", {
-				className: e(i.item, !n.read && i.unread),
-				"aria-current": n.read ? void 0 : "true",
+			children: c.map((t) => /* @__PURE__ */ s("li", {
+				className: e(i.item, !t.read && i.unread),
+				"aria-current": t.read ? void 0 : "true",
 				children: [
 					m && /* @__PURE__ */ o("span", {
 						className: i.icon,
-						children: m(n)
+						children: m(t)
 					}),
 					/* @__PURE__ */ s("div", {
 						className: i.body,
 						children: [C ? /* @__PURE__ */ s("button", {
 							type: "button",
 							className: i.trigger,
-							onClick: () => S(n),
+							onClick: () => S(t),
 							children: [/* @__PURE__ */ o("span", {
 								className: i.itemTitle,
-								children: n.title
-							}), n.body && /* @__PURE__ */ o("span", {
+								children: t.title
+							}), t.body && /* @__PURE__ */ o("span", {
 								className: i.itemBody,
-								children: n.body
+								children: t.body
 							})]
 						}) : /* @__PURE__ */ s(a, { children: [/* @__PURE__ */ o("span", {
 							className: i.itemTitle,
-							children: n.title
-						}), n.body && /* @__PURE__ */ o("span", {
+							children: t.title
+						}), t.body && /* @__PURE__ */ o("span", {
 							className: i.itemBody,
-							children: n.body
+							children: t.body
 						})] }), /* @__PURE__ */ o("time", {
 							className: i.time,
-							dateTime: new Date(n.receivedAt).toISOString(),
-							children: t(n.receivedAt, {
+							dateTime: new Date(t.receivedAt).toISOString(),
+							children: r(t.receivedAt, {
 								locale: h,
 								now: x
 							})
@@ -68,12 +68,12 @@ function c({ items: c, title: l = "Notificações", onSelect: u, onMarkRead: d,
 					p && /* @__PURE__ */ o("button", {
 						type: "button",
 						className: i.dismiss,
-						onClick: () => p(n.id),
-						"aria-label": `Descartar: ${n.title}`,
+						onClick: () => p(t.id),
+						"aria-label": `Descartar: ${t.title}`,
 						children: "×"
 					})
 				]
-			}, n.id))
+			}, t.id))
 		})]
 	});
 }

package/dist/components/Sidebar/Sidebar.cjs

@@ -1,2 +1,2 @@
-const e=require("../../utils/cn.cjs"),t=require("./Sidebar.module.cjs");let n=require("react/jsx-runtime");function r({header:r,items:i,value:a,onChange:o,footer:s,collapsed:c=!1,width:l=240,collapsedWidth:u=64,className:d,style:f,...p}){let m=typeof(c?u:l)==`number`?`${c?u:l}px`:c?u:l;return(0,n.jsxs)(`aside`,{className:e.cn(t.default.sidebar,c&&t.default.collapsed,d),style:{width:m,...f},...p,children:[r&&(0,n.jsx)(`div`,{className:t.default.header,children:r}),(0,n.jsx)(`nav`,{className:t.default.nav,"aria-label":`Navegação lateral`,children:i.map(r=>{let i=r.key===a;return(0,n.jsxs)(`button`,{type:`button`,className:e.cn(t.default.item,i&&t.default.active),"aria-current":i?`page`:void 0,disabled:r.disabled,onClick:()=>o?.(r.key),title:c&&typeof r.label==`string`?r.label:void 0,children:[r.icon&&(0,n.jsx)(`span`,{className:t.default.icon,children:r.icon}),!c&&(0,n.jsx)(`span`,{className:t.default.label,children:r.label}),!c&&r.badge!==void 0&&(0,n.jsx)(`span`,{className:t.default.badge,children:r.badge})]},r.key)})}),s&&(0,n.jsx)(`div`,{className:t.default.footer,children:s})]})}exports.Sidebar=r;
+const e=require("../../utils/cn.cjs"),t=require("./Sidebar.module.cjs");let n=require("react"),r=require("react/jsx-runtime");function i(e){let t=[],n;for(let r of e){if(r.type===`separator`){t.push({kind:`separator`,key:r.key}),n=void 0;continue}if(r.type===`section`){n={kind:`items`,key:r.key,section:r,items:[]},t.push(n);continue}n||(n={kind:`items`,key:`loose-${r.key}`,items:[]},t.push(n)),n.items.push(r)}return t}function a({header:a,items:o,value:s,onChange:c,footer:l,collapsed:u=!1,width:d=240,collapsedWidth:f=64,className:p,style:m,...h}){let g=(0,n.useId)(),_=i(o),v=typeof(u?f:d)==`number`?`${u?f:d}px`:u?f:d,y=n=>{let i=n.key===s,a=u&&typeof n.label==`string`?n.label:void 0,o=(0,r.jsxs)(r.Fragment,{children:[n.icon&&(0,r.jsx)(`span`,{className:t.default.icon,children:n.icon}),!u&&(0,r.jsx)(`span`,{className:t.default.label,children:n.label}),!u&&n.badge!==void 0&&(0,r.jsx)(`span`,{className:t.default.badge,children:n.badge})]});return n.href&&!n.disabled?(0,r.jsx)(`a`,{href:n.href,className:e.cn(t.default.item,i&&t.default.active),"aria-current":i?`page`:void 0,onClick:()=>c?.(n.key),title:a,children:o},n.key):(0,r.jsx)(`button`,{type:`button`,className:e.cn(t.default.item,i&&t.default.active),"aria-current":i?`page`:void 0,disabled:n.disabled,onClick:()=>c?.(n.key),title:a,children:o},n.key)};return(0,r.jsxs)(`aside`,{className:e.cn(t.default.sidebar,u&&t.default.collapsed,p),style:{width:v,...m},...h,children:[a&&(0,r.jsx)(`div`,{className:t.default.header,children:a}),(0,r.jsx)(`nav`,{className:t.default.nav,"aria-label":`Navegação lateral`,children:_.map(n=>{if(n.kind===`separator`)return(0,r.jsx)(`hr`,{className:t.default.separator},n.key);if(!n.section)return(0,r.jsx)(`div`,{className:t.default.group,children:n.items.map(y)},n.key);let i=`${g}-${n.key}`;return(0,r.jsxs)(`div`,{role:`group`,"aria-labelledby":i,className:t.default.group,children:[(0,r.jsx)(`div`,{id:i,role:`presentation`,className:e.cn(t.default.section,u&&t.default.sectionCollapsed),children:n.section.label}),n.items.map(y)]},n.key)})}),l&&(0,r.jsx)(`div`,{className:t.default.footer,children:l})]})}exports.Sidebar=a;
 //# sourceMappingURL=Sidebar.cjs.map

package/dist/components/Sidebar/Sidebar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar.cjs","names":[],"sources":["../../../src/components/Sidebar/Sidebar.tsx"],"sourcesContent":["/**\n * @tempest-limits props-count — header, items, footer are the three regions,\n * value/onChange the selection, and collapsed/width/collapsedWidth the two layout\n * modes it switches between.\n */\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Sidebar.module.css\";\n\nexport interface SidebarItem {\n    key: string;\n    label: ReactNode;\n    icon?: ReactNode;\n    badge?: ReactNode;\n    disabled?: boolean;\n    href?: string;\n}\n\nexport interface SidebarProps extends Omit<HTMLAttributes<HTMLElement>, \"onChange\"> {\n    /** Top slot — typically the logo + brand. */\n    header?: ReactNode;\n    /** Navigation items. */\n    items: SidebarItem[];\n    /** Active item key. */\n    value?: string;\n    /** Fires when an item is clicked. Receives the item's `key`. */\n    onChange?: (key: string) => void;\n    /** Bottom slot — typically settings/profile/logout. */\n    footer?: ReactNode;\n    /** Collapsed mode — only icons visible. Default `false`. */\n    collapsed?: boolean;\n    /** Width when expanded, in pixels or any CSS length. Default `240px`. */\n    width?: number | string;\n    /** Width when collapsed, in pixels or any CSS length. Default `64px`. */\n    collapsedWidth?: number | string;\n}\n\n/**\n * Desktop sidebar navigation. Pair with `<Show above=\"md\">` and a `Drawer`\n * for mobile.\n *\n * @example\n * const [tab, setTab] = useState(\"home\");\n * <Show above=\"md\">\n *     <Sidebar\n *         header={<Brand />}\n *         items={[{ key: \"home\", label: \"Home\", icon: <Home /> }]}\n *         value={tab}\n *         onChange={setTab}\n *     />\n * </Show>\n */\nexport function Sidebar({\n    header,\n    items,\n    value,\n    onChange,\n    footer,\n    collapsed = false,\n    width = 240,\n    collapsedWidth = 64,\n    className,\n    style,\n    ...props\n}: SidebarProps) {\n    const finalWidth =\n        typeof (collapsed ? collapsedWidth : width) === \"number\"\n            ? `${collapsed ? collapsedWidth : width}px`\n            : collapsed\n              ? collapsedWidth\n              : width;\n    return (\n        <aside\n            className={cn(styles.sidebar, collapsed && styles.collapsed, className)}\n            style={{ width: finalWidth, ...style }}\n            {...props}\n        >\n            {header && <div className={styles.header}>{header}</div>}\n            <nav className={styles.nav} aria-label=\"Navegação lateral\">\n                {items.map((item) => {\n                    const active = item.key === value;\n                    return (\n                        <button\n                            key={item.key}\n                            type=\"button\"\n                            className={cn(styles.item, active && styles.active)}\n                            aria-current={active ? \"page\" : undefined}\n                            disabled={item.disabled}\n                            onClick={() => onChange?.(item.key)}\n                            title={\n                                collapsed && typeof item.label === \"string\" ? item.label : undefined\n                            }\n                        >\n                            {item.icon && <span className={styles.icon}>{item.icon}</span>}\n                            {!collapsed && <span className={styles.label}>{item.label}</span>}\n                            {!collapsed && item.badge !== undefined && (\n                                <span className={styles.badge}>{item.badge}</span>\n                            )}\n                        </button>\n                    );\n                })}\n            </nav>\n            {footer && <div className={styles.footer}>{footer}</div>}\n        </aside>\n    );\n}\n"],"mappings":"2GAoDA,SAAgB,EAAQ,CACpB,SACA,QACA,QACA,WACA,SACA,YAAY,GACZ,QAAQ,IACR,iBAAiB,GACjB,YACA,QACA,GAAG,GACU,CACb,IAAM,EACF,OAAQ,EAAY,EAAiB,IAAW,SAC1C,GAAG,EAAY,EAAiB,EAAM,IACtC,EACE,EACA,EACZ,OACI,EAAA,EAAA,KAAA,CAAC,QAAD,CACI,UAAW,EAAA,GAAG,EAAA,QAAO,QAAS,GAAa,EAAA,QAAO,UAAW,CAAS,EACtE,MAAO,CAAE,MAAO,EAAY,GAAG,CAAM,EACrC,GAAI,EAHR,SAAA,CAKK,IAAU,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,OAAS,SAAA,CAAY,CAAA,GACvD,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,IAAK,aAAW,oBAClC,SAAA,EAAM,IAAK,GAAS,CACjB,IAAM,EAAS,EAAK,MAAQ,EAC5B,OACI,EAAA,EAAA,KAAA,CAAC,SAAD,CAEI,KAAK,SACL,UAAW,EAAA,GAAG,EAAA,QAAO,KAAM,GAAU,EAAA,QAAO,MAAM,EAClD,eAAc,EAAS,OAAS,IAAA,GAChC,SAAU,EAAK,SACf,YAAe,IAAW,EAAK,GAAG,EAClC,MACI,GAAa,OAAO,EAAK,OAAU,SAAW,EAAK,MAAQ,IAAA,GARnE,SAAA,CAWK,EAAK,OAAQ,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,KAAO,SAAA,EAAK,IAAW,CAAA,EAC5D,CAAC,IAAa,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,MAAQ,SAAA,EAAK,KAAY,CAAA,EAC/D,CAAC,GAAa,EAAK,QAAU,IAAA,KAC1B,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,MAAQ,SAAA,EAAK,KAAY,CAAA,CAEjD,CAfC,EAAA,EAAK,GAeN,CAEhB,CAAC,CACA,CAAA,EACJ,IAAU,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,OAAS,SAAA,CAAY,CAAA,CACpD,GAEf"}
+{"version":3,"file":"Sidebar.cjs","names":[],"sources":["../../../src/components/Sidebar/Sidebar.tsx"],"sourcesContent":["/**\n * @tempest-limits props-count — header, items, footer are the three regions,\n * value/onChange the selection, and collapsed/width/collapsedWidth the two layout\n * modes it switches between.\n */\nimport { useId, type HTMLAttributes, type ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Sidebar.module.css\";\n\nexport interface SidebarItem {\n    key: string;\n    label: ReactNode;\n    icon?: ReactNode;\n    badge?: ReactNode;\n    disabled?: boolean;\n    /**\n     * Renders the entry as a link to this URL instead of a button.\n     *\n     * `onChange` still fires on click, so an app that tracks the active key keeps\n     * working — the difference is that the entry now behaves like navigation:\n     * middle-click, ctrl-click and \"copy link address\" do what the user expects,\n     * and a screen reader announces a link rather than a button.\n     *\n     * A `disabled` entry ignores this and stays a `<button disabled>`: there is no\n     * disabled state for an anchor, and dropping the `href` to fake one leaves a\n     * link that announces itself as actionable and is not.\n     */\n    href?: string;\n}\n\n/**\n * A section heading. Every item after it belongs to the section, until the next\n * section or separator.\n */\nexport interface SidebarSection {\n    type: \"section\";\n    key: string;\n    label: ReactNode;\n}\n\n/** A plain divider, for splitting the list without naming the parts. */\nexport interface SidebarSeparator {\n    type: \"separator\";\n    key: string;\n}\n\n/**\n * One entry of the navigation list.\n *\n * An entry with no `type` is an item, which is what keeps a plain\n * `SidebarItem[]` a valid `SidebarEntry[]`: adding sections to this component\n * needed no change at any existing call site.\n */\nexport type SidebarEntry = ({ type?: \"item\" } & SidebarItem) | SidebarSection | SidebarSeparator;\n\nexport interface SidebarProps extends Omit<HTMLAttributes<HTMLElement>, \"onChange\"> {\n    /** Top slot — typically the logo + brand. */\n    header?: ReactNode;\n    /** Navigation entries. An entry with no `type` is an item. */\n    items: SidebarEntry[];\n    /** Active item key. */\n    value?: string;\n    /** Fires when an item is clicked. Receives the item's `key`. */\n    onChange?: (key: string) => void;\n    /** Bottom slot — typically settings/profile/logout. */\n    footer?: ReactNode;\n    /** Collapsed mode — only icons visible. Default `false`. */\n    collapsed?: boolean;\n    /** Width when expanded, in pixels or any CSS length. Default `240px`. */\n    width?: number | string;\n    /** Width when collapsed, in pixels or any CSS length. Default `64px`. */\n    collapsedWidth?: number | string;\n}\n\n/** A run of items, optionally under a section heading. */\ninterface ItemBlock {\n    kind: \"items\";\n    key: string;\n    section?: SidebarSection;\n    items: SidebarItem[];\n}\n\n/** A standalone divider between blocks. */\ninterface SeparatorBlock {\n    kind: \"separator\";\n    key: string;\n}\n\ntype Block = ItemBlock | SeparatorBlock;\n\n/**\n * Fold the flat entry list into the blocks that get rendered.\n *\n * A section opens a block that swallows every following item; a separator closes\n * whatever is open, so items after it are loose again. Items before the first\n * section are loose too — which is the whole existing behaviour, and why a list\n * with no sections comes out of here as one unnamed block.\n *\n * @param entries - The `items` prop, as given.\n * @returns Blocks in render order.\n */\nfunction toBlocks(entries: readonly SidebarEntry[]): Block[] {\n    const blocks: Block[] = [];\n    let open: ItemBlock | undefined;\n\n    for (const entry of entries) {\n        if (entry.type === \"separator\") {\n            blocks.push({ kind: \"separator\", key: entry.key });\n            open = undefined;\n            continue;\n        }\n        if (entry.type === \"section\") {\n            open = { kind: \"items\", key: entry.key, section: entry, items: [] };\n            blocks.push(open);\n            continue;\n        }\n        if (!open) {\n            open = { kind: \"items\", key: `loose-${entry.key}`, items: [] };\n            blocks.push(open);\n        }\n        open.items.push(entry);\n    }\n    return blocks;\n}\n\n/**\n * Desktop sidebar navigation. Pair with `<Show above=\"md\">` and a `Drawer`\n * for mobile.\n *\n * Sixteen screens in one flat list is a wall, so `items` also takes section\n * headings and separators. A section renders as a labelled `role=\"group\"`, which\n * is what tells a screen reader \"Monitoring, group, 3 items\" — the reason it is\n * not a styled `disabled` item, which would announce an unavailable button and\n * stay in the navigation order.\n *\n * @example\n * const [tab, setTab] = useState(\"home\");\n * <Show above=\"md\">\n *     <Sidebar\n *         header={<Brand />}\n *         items={[{ key: \"home\", label: \"Home\", icon: <Home /> }]}\n *         value={tab}\n *         onChange={setTab}\n *     />\n * </Show>\n *\n * @example\n * <Sidebar\n *     items={[\n *         { type: \"section\", key: \"monitoring\", label: \"Monitoring\" },\n *         { key: \"overview\", label: \"Overview\", href: \"/overview\" },\n *         { key: \"activity\", label: \"Activity\", href: \"/activity\" },\n *         { type: \"section\", key: \"admin\", label: \"Administration\" },\n *         { key: \"settings\", label: \"Settings\", href: \"/settings\" },\n *     ]}\n *     value={tab}\n *     onChange={setTab}\n * />\n */\nexport function Sidebar({\n    header,\n    items,\n    value,\n    onChange,\n    footer,\n    collapsed = false,\n    width = 240,\n    collapsedWidth = 64,\n    className,\n    style,\n    ...props\n}: SidebarProps) {\n    const baseId = useId();\n    const blocks = toBlocks(items);\n    const finalWidth =\n        typeof (collapsed ? collapsedWidth : width) === \"number\"\n            ? `${collapsed ? collapsedWidth : width}px`\n            : collapsed\n              ? collapsedWidth\n              : width;\n\n    /**\n     * Render one navigation entry.\n     *\n     * @param item - The entry to render.\n     * @returns The button, or the anchor when the entry carries an `href`.\n     */\n    const renderItem = (item: SidebarItem): ReactNode => {\n        const active = item.key === value;\n        const title = collapsed && typeof item.label === \"string\" ? item.label : undefined;\n        const body = (\n            <>\n                {item.icon && <span className={styles.icon}>{item.icon}</span>}\n                {!collapsed && <span className={styles.label}>{item.label}</span>}\n                {!collapsed && item.badge !== undefined && (\n                    <span className={styles.badge}>{item.badge}</span>\n                )}\n            </>\n        );\n\n        if (item.href && !item.disabled) {\n            return (\n                <a\n                    key={item.key}\n                    href={item.href}\n                    className={cn(styles.item, active && styles.active)}\n                    aria-current={active ? \"page\" : undefined}\n                    onClick={() => onChange?.(item.key)}\n                    title={title}\n                >\n                    {body}\n                </a>\n            );\n        }\n\n        return (\n            <button\n                key={item.key}\n                type=\"button\"\n                className={cn(styles.item, active && styles.active)}\n                aria-current={active ? \"page\" : undefined}\n                disabled={item.disabled}\n                onClick={() => onChange?.(item.key)}\n                title={title}\n            >\n                {body}\n            </button>\n        );\n    };\n\n    return (\n        <aside\n            className={cn(styles.sidebar, collapsed && styles.collapsed, className)}\n            style={{ width: finalWidth, ...style }}\n            {...props}\n        >\n            {header && <div className={styles.header}>{header}</div>}\n            <nav className={styles.nav} aria-label=\"Navegação lateral\">\n                {blocks.map((block) => {\n                    if (block.kind === \"separator\") {\n                        return <hr key={block.key} className={styles.separator} />;\n                    }\n                    if (!block.section) {\n                        return (\n                            <div key={block.key} className={styles.group}>\n                                {block.items.map(renderItem)}\n                            </div>\n                        );\n                    }\n                    const labelId = `${baseId}-${block.key}`;\n                    return (\n                        <div\n                            key={block.key}\n                            role=\"group\"\n                            aria-labelledby={labelId}\n                            className={styles.group}\n                        >\n                            <div\n                                id={labelId}\n                                role=\"presentation\"\n                                className={cn(styles.section, collapsed && styles.sectionCollapsed)}\n                            >\n                                {block.section.label}\n                            </div>\n                            {block.items.map(renderItem)}\n                        </div>\n                    );\n                })}\n            </nav>\n            {footer && <div className={styles.footer}>{footer}</div>}\n        </aside>\n    );\n}\n"],"mappings":"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"}

package/dist/components/Sidebar/Sidebar.js

@@ -1,58 +1,111 @@
 import { cn as e } from "../../utils/cn.js";
 import t from "./Sidebar.module.js";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useId as n } from "react";
+import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/Sidebar/Sidebar.tsx
-function i({ header: i, items: a, value: o, onChange: s, footer: c, collapsed: l = !1, width: u = 240, collapsedWidth: d = 64, className: f, style: p, ...m }) {
-	let h = typeof (l ? d : u) == "number" ? `${l ? d : u}px` : l ? d : u;
-	return /* @__PURE__ */ r("aside", {
-		className: e(t.sidebar, l && t.collapsed, f),
+function o(e) {
+	let t = [], n;
+	for (let r of e) {
+		if (r.type === "separator") {
+			t.push({
+				kind: "separator",
+				key: r.key
+			}), n = void 0;
+			continue;
+		}
+		if (r.type === "section") {
+			n = {
+				kind: "items",
+				key: r.key,
+				section: r,
+				items: []
+			}, t.push(n);
+			continue;
+		}
+		n || (n = {
+			kind: "items",
+			key: `loose-${r.key}`,
+			items: []
+		}, t.push(n)), n.items.push(r);
+	}
+	return t;
+}
+function s({ header: s, items: c, value: l, onChange: u, footer: d, collapsed: f = !1, width: p = 240, collapsedWidth: m = 64, className: h, style: g, ..._ }) {
+	let v = n(), y = o(c), b = typeof (f ? m : p) == "number" ? `${f ? m : p}px` : f ? m : p, x = (n) => {
+		let o = n.key === l, s = f && typeof n.label == "string" ? n.label : void 0, c = /* @__PURE__ */ a(r, { children: [
+			n.icon && /* @__PURE__ */ i("span", {
+				className: t.icon,
+				children: n.icon
+			}),
+			!f && /* @__PURE__ */ i("span", {
+				className: t.label,
+				children: n.label
+			}),
+			!f && n.badge !== void 0 && /* @__PURE__ */ i("span", {
+				className: t.badge,
+				children: n.badge
+			})
+		] });
+		return n.href && !n.disabled ? /* @__PURE__ */ i("a", {
+			href: n.href,
+			className: e(t.item, o && t.active),
+			"aria-current": o ? "page" : void 0,
+			onClick: () => u?.(n.key),
+			title: s,
+			children: c
+		}, n.key) : /* @__PURE__ */ i("button", {
+			type: "button",
+			className: e(t.item, o && t.active),
+			"aria-current": o ? "page" : void 0,
+			disabled: n.disabled,
+			onClick: () => u?.(n.key),
+			title: s,
+			children: c
+		}, n.key);
+	};
+	return /* @__PURE__ */ a("aside", {
+		className: e(t.sidebar, f && t.collapsed, h),
 		style: {
-			width: h,
-			...p
+			width: b,
+			...g
 		},
-		...m,
+		..._,
 		children: [
-			i && /* @__PURE__ */ n("div", {
+			s && /* @__PURE__ */ i("div", {
 				className: t.header,
-				children: i
+				children: s
 			}),
-			/* @__PURE__ */ n("nav", {
+			/* @__PURE__ */ i("nav", {
 				className: t.nav,
 				"aria-label": "Navegação lateral",
-				children: a.map((i) => {
-					let a = i.key === o;
-					return /* @__PURE__ */ r("button", {
-						type: "button",
-						className: e(t.item, a && t.active),
-						"aria-current": a ? "page" : void 0,
-						disabled: i.disabled,
-						onClick: () => s?.(i.key),
-						title: l && typeof i.label == "string" ? i.label : void 0,
-						children: [
-							i.icon && /* @__PURE__ */ n("span", {
-								className: t.icon,
-								children: i.icon
-							}),
-							!l && /* @__PURE__ */ n("span", {
-								className: t.label,
-								children: i.label
-							}),
-							!l && i.badge !== void 0 && /* @__PURE__ */ n("span", {
-								className: t.badge,
-								children: i.badge
-							})
-						]
-					}, i.key);
+				children: y.map((n) => {
+					if (n.kind === "separator") return /* @__PURE__ */ i("hr", { className: t.separator }, n.key);
+					if (!n.section) return /* @__PURE__ */ i("div", {
+						className: t.group,
+						children: n.items.map(x)
+					}, n.key);
+					let r = `${v}-${n.key}`;
+					return /* @__PURE__ */ a("div", {
+						role: "group",
+						"aria-labelledby": r,
+						className: t.group,
+						children: [/* @__PURE__ */ i("div", {
+							id: r,
+							role: "presentation",
+							className: e(t.section, f && t.sectionCollapsed),
+							children: n.section.label
+						}), n.items.map(x)]
+					}, n.key);
 				})
 			}),
-			c && /* @__PURE__ */ n("div", {
+			d && /* @__PURE__ */ i("div", {
 				className: t.footer,
-				children: c
+				children: d
 			})
 		]
 	});
 }
 //#endregion
-export { i as Sidebar };
+export { s as Sidebar };
 
 //# sourceMappingURL=Sidebar.js.map

package/dist/components/Sidebar/Sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar.js","names":[],"sources":["../../../src/components/Sidebar/Sidebar.tsx"],"sourcesContent":["/**\n * @tempest-limits props-count — header, items, footer are the three regions,\n * value/onChange the selection, and collapsed/width/collapsedWidth the two layout\n * modes it switches between.\n */\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Sidebar.module.css\";\n\nexport interface SidebarItem {\n    key: string;\n    label: ReactNode;\n    icon?: ReactNode;\n    badge?: ReactNode;\n    disabled?: boolean;\n    href?: string;\n}\n\nexport interface SidebarProps extends Omit<HTMLAttributes<HTMLElement>, \"onChange\"> {\n    /** Top slot — typically the logo + brand. */\n    header?: ReactNode;\n    /** Navigation items. */\n    items: SidebarItem[];\n    /** Active item key. */\n    value?: string;\n    /** Fires when an item is clicked. Receives the item's `key`. */\n    onChange?: (key: string) => void;\n    /** Bottom slot — typically settings/profile/logout. */\n    footer?: ReactNode;\n    /** Collapsed mode — only icons visible. Default `false`. */\n    collapsed?: boolean;\n    /** Width when expanded, in pixels or any CSS length. Default `240px`. */\n    width?: number | string;\n    /** Width when collapsed, in pixels or any CSS length. Default `64px`. */\n    collapsedWidth?: number | string;\n}\n\n/**\n * Desktop sidebar navigation. Pair with `<Show above=\"md\">` and a `Drawer`\n * for mobile.\n *\n * @example\n * const [tab, setTab] = useState(\"home\");\n * <Show above=\"md\">\n *     <Sidebar\n *         header={<Brand />}\n *         items={[{ key: \"home\", label: \"Home\", icon: <Home /> }]}\n *         value={tab}\n *         onChange={setTab}\n *     />\n * </Show>\n */\nexport function Sidebar({\n    header,\n    items,\n    value,\n    onChange,\n    footer,\n    collapsed = false,\n    width = 240,\n    collapsedWidth = 64,\n    className,\n    style,\n    ...props\n}: SidebarProps) {\n    const finalWidth =\n        typeof (collapsed ? collapsedWidth : width) === \"number\"\n            ? `${collapsed ? collapsedWidth : width}px`\n            : collapsed\n              ? collapsedWidth\n              : width;\n    return (\n        <aside\n            className={cn(styles.sidebar, collapsed && styles.collapsed, className)}\n            style={{ width: finalWidth, ...style }}\n            {...props}\n        >\n            {header && <div className={styles.header}>{header}</div>}\n            <nav className={styles.nav} aria-label=\"Navegação lateral\">\n                {items.map((item) => {\n                    const active = item.key === value;\n                    return (\n                        <button\n                            key={item.key}\n                            type=\"button\"\n                            className={cn(styles.item, active && styles.active)}\n                            aria-current={active ? \"page\" : undefined}\n                            disabled={item.disabled}\n                            onClick={() => onChange?.(item.key)}\n                            title={\n                                collapsed && typeof item.label === \"string\" ? item.label : undefined\n                            }\n                        >\n                            {item.icon && <span className={styles.icon}>{item.icon}</span>}\n                            {!collapsed && <span className={styles.label}>{item.label}</span>}\n                            {!collapsed && item.badge !== undefined && (\n                                <span className={styles.badge}>{item.badge}</span>\n                            )}\n                        </button>\n                    );\n                })}\n            </nav>\n            {footer && <div className={styles.footer}>{footer}</div>}\n        </aside>\n    );\n}\n"],"mappings":";;;;AAoDA,SAAgB,EAAQ,EACpB,WACA,UACA,UACA,aACA,WACA,eAAY,IACZ,WAAQ,KACR,oBAAiB,IACjB,cACA,UACA,GAAG,KACU;CACb,IAAM,IACF,QAAQ,IAAY,IAAiB,MAAW,WAC1C,GAAG,IAAY,IAAiB,EAAM,MACtC,IACE,IACA;CACZ,OACI,kBAAC,SAAD;EACI,WAAW,EAAG,EAAO,SAAS,KAAa,EAAO,WAAW,CAAS;EACtE,OAAO;GAAE,OAAO;GAAY,GAAG;EAAM;EACrC,GAAI;EAHR,UAAA;GAKK,KAAU,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAS,UAAA;GAAY,CAAA;GACvD,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAK,cAAW;IAClC,UAAA,EAAM,KAAK,MAAS;KACjB,IAAM,IAAS,EAAK,QAAQ;KAC5B,OACI,kBAAC,UAAD;MAEI,MAAK;MACL,WAAW,EAAG,EAAO,MAAM,KAAU,EAAO,MAAM;MAClD,gBAAc,IAAS,SAAS,KAAA;MAChC,UAAU,EAAK;MACf,eAAe,IAAW,EAAK,GAAG;MAClC,OACI,KAAa,OAAO,EAAK,SAAU,WAAW,EAAK,QAAQ,KAAA;MARnE,UAAA;OAWK,EAAK,QAAQ,kBAAC,QAAD;QAAM,WAAW,EAAO;QAAO,UAAA,EAAK;OAAW,CAAA;OAC5D,CAAC,KAAa,kBAAC,QAAD;QAAM,WAAW,EAAO;QAAQ,UAAA,EAAK;OAAY,CAAA;OAC/D,CAAC,KAAa,EAAK,UAAU,KAAA,KAC1B,kBAAC,QAAD;QAAM,WAAW,EAAO;QAAQ,UAAA,EAAK;OAAY,CAAA;MAEjD;KAfC,GAAA,EAAK,GAeN;IAEhB,CAAC;GACA,CAAA;GACJ,KAAU,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAS,UAAA;GAAY,CAAA;EACpD;;AAEf"}
+{"version":3,"file":"Sidebar.js","names":[],"sources":["../../../src/components/Sidebar/Sidebar.tsx"],"sourcesContent":["/**\n * @tempest-limits props-count — header, items, footer are the three regions,\n * value/onChange the selection, and collapsed/width/collapsedWidth the two layout\n * modes it switches between.\n */\nimport { useId, type HTMLAttributes, type ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Sidebar.module.css\";\n\nexport interface SidebarItem {\n    key: string;\n    label: ReactNode;\n    icon?: ReactNode;\n    badge?: ReactNode;\n    disabled?: boolean;\n    /**\n     * Renders the entry as a link to this URL instead of a button.\n     *\n     * `onChange` still fires on click, so an app that tracks the active key keeps\n     * working — the difference is that the entry now behaves like navigation:\n     * middle-click, ctrl-click and \"copy link address\" do what the user expects,\n     * and a screen reader announces a link rather than a button.\n     *\n     * A `disabled` entry ignores this and stays a `<button disabled>`: there is no\n     * disabled state for an anchor, and dropping the `href` to fake one leaves a\n     * link that announces itself as actionable and is not.\n     */\n    href?: string;\n}\n\n/**\n * A section heading. Every item after it belongs to the section, until the next\n * section or separator.\n */\nexport interface SidebarSection {\n    type: \"section\";\n    key: string;\n    label: ReactNode;\n}\n\n/** A plain divider, for splitting the list without naming the parts. */\nexport interface SidebarSeparator {\n    type: \"separator\";\n    key: string;\n}\n\n/**\n * One entry of the navigation list.\n *\n * An entry with no `type` is an item, which is what keeps a plain\n * `SidebarItem[]` a valid `SidebarEntry[]`: adding sections to this component\n * needed no change at any existing call site.\n */\nexport type SidebarEntry = ({ type?: \"item\" } & SidebarItem) | SidebarSection | SidebarSeparator;\n\nexport interface SidebarProps extends Omit<HTMLAttributes<HTMLElement>, \"onChange\"> {\n    /** Top slot — typically the logo + brand. */\n    header?: ReactNode;\n    /** Navigation entries. An entry with no `type` is an item. */\n    items: SidebarEntry[];\n    /** Active item key. */\n    value?: string;\n    /** Fires when an item is clicked. Receives the item's `key`. */\n    onChange?: (key: string) => void;\n    /** Bottom slot — typically settings/profile/logout. */\n    footer?: ReactNode;\n    /** Collapsed mode — only icons visible. Default `false`. */\n    collapsed?: boolean;\n    /** Width when expanded, in pixels or any CSS length. Default `240px`. */\n    width?: number | string;\n    /** Width when collapsed, in pixels or any CSS length. Default `64px`. */\n    collapsedWidth?: number | string;\n}\n\n/** A run of items, optionally under a section heading. */\ninterface ItemBlock {\n    kind: \"items\";\n    key: string;\n    section?: SidebarSection;\n    items: SidebarItem[];\n}\n\n/** A standalone divider between blocks. */\ninterface SeparatorBlock {\n    kind: \"separator\";\n    key: string;\n}\n\ntype Block = ItemBlock | SeparatorBlock;\n\n/**\n * Fold the flat entry list into the blocks that get rendered.\n *\n * A section opens a block that swallows every following item; a separator closes\n * whatever is open, so items after it are loose again. Items before the first\n * section are loose too — which is the whole existing behaviour, and why a list\n * with no sections comes out of here as one unnamed block.\n *\n * @param entries - The `items` prop, as given.\n * @returns Blocks in render order.\n */\nfunction toBlocks(entries: readonly SidebarEntry[]): Block[] {\n    const blocks: Block[] = [];\n    let open: ItemBlock | undefined;\n\n    for (const entry of entries) {\n        if (entry.type === \"separator\") {\n            blocks.push({ kind: \"separator\", key: entry.key });\n            open = undefined;\n            continue;\n        }\n        if (entry.type === \"section\") {\n            open = { kind: \"items\", key: entry.key, section: entry, items: [] };\n            blocks.push(open);\n            continue;\n        }\n        if (!open) {\n            open = { kind: \"items\", key: `loose-${entry.key}`, items: [] };\n            blocks.push(open);\n        }\n        open.items.push(entry);\n    }\n    return blocks;\n}\n\n/**\n * Desktop sidebar navigation. Pair with `<Show above=\"md\">` and a `Drawer`\n * for mobile.\n *\n * Sixteen screens in one flat list is a wall, so `items` also takes section\n * headings and separators. A section renders as a labelled `role=\"group\"`, which\n * is what tells a screen reader \"Monitoring, group, 3 items\" — the reason it is\n * not a styled `disabled` item, which would announce an unavailable button and\n * stay in the navigation order.\n *\n * @example\n * const [tab, setTab] = useState(\"home\");\n * <Show above=\"md\">\n *     <Sidebar\n *         header={<Brand />}\n *         items={[{ key: \"home\", label: \"Home\", icon: <Home /> }]}\n *         value={tab}\n *         onChange={setTab}\n *     />\n * </Show>\n *\n * @example\n * <Sidebar\n *     items={[\n *         { type: \"section\", key: \"monitoring\", label: \"Monitoring\" },\n *         { key: \"overview\", label: \"Overview\", href: \"/overview\" },\n *         { key: \"activity\", label: \"Activity\", href: \"/activity\" },\n *         { type: \"section\", key: \"admin\", label: \"Administration\" },\n *         { key: \"settings\", label: \"Settings\", href: \"/settings\" },\n *     ]}\n *     value={tab}\n *     onChange={setTab}\n * />\n */\nexport function Sidebar({\n    header,\n    items,\n    value,\n    onChange,\n    footer,\n    collapsed = false,\n    width = 240,\n    collapsedWidth = 64,\n    className,\n    style,\n    ...props\n}: SidebarProps) {\n    const baseId = useId();\n    const blocks = toBlocks(items);\n    const finalWidth =\n        typeof (collapsed ? collapsedWidth : width) === \"number\"\n            ? `${collapsed ? collapsedWidth : width}px`\n            : collapsed\n              ? collapsedWidth\n              : width;\n\n    /**\n     * Render one navigation entry.\n     *\n     * @param item - The entry to render.\n     * @returns The button, or the anchor when the entry carries an `href`.\n     */\n    const renderItem = (item: SidebarItem): ReactNode => {\n        const active = item.key === value;\n        const title = collapsed && typeof item.label === \"string\" ? item.label : undefined;\n        const body = (\n            <>\n                {item.icon && <span className={styles.icon}>{item.icon}</span>}\n                {!collapsed && <span className={styles.label}>{item.label}</span>}\n                {!collapsed && item.badge !== undefined && (\n                    <span className={styles.badge}>{item.badge}</span>\n                )}\n            </>\n        );\n\n        if (item.href && !item.disabled) {\n            return (\n                <a\n                    key={item.key}\n                    href={item.href}\n                    className={cn(styles.item, active && styles.active)}\n                    aria-current={active ? \"page\" : undefined}\n                    onClick={() => onChange?.(item.key)}\n                    title={title}\n                >\n                    {body}\n                </a>\n            );\n        }\n\n        return (\n            <button\n                key={item.key}\n                type=\"button\"\n                className={cn(styles.item, active && styles.active)}\n                aria-current={active ? \"page\" : undefined}\n                disabled={item.disabled}\n                onClick={() => onChange?.(item.key)}\n                title={title}\n            >\n                {body}\n            </button>\n        );\n    };\n\n    return (\n        <aside\n            className={cn(styles.sidebar, collapsed && styles.collapsed, className)}\n            style={{ width: finalWidth, ...style }}\n            {...props}\n        >\n            {header && <div className={styles.header}>{header}</div>}\n            <nav className={styles.nav} aria-label=\"Navegação lateral\">\n                {blocks.map((block) => {\n                    if (block.kind === \"separator\") {\n                        return <hr key={block.key} className={styles.separator} />;\n                    }\n                    if (!block.section) {\n                        return (\n                            <div key={block.key} className={styles.group}>\n                                {block.items.map(renderItem)}\n                            </div>\n                        );\n                    }\n                    const labelId = `${baseId}-${block.key}`;\n                    return (\n                        <div\n                            key={block.key}\n                            role=\"group\"\n                            aria-labelledby={labelId}\n                            className={styles.group}\n                        >\n                            <div\n                                id={labelId}\n                                role=\"presentation\"\n                                className={cn(styles.section, collapsed && styles.sectionCollapsed)}\n                            >\n                                {block.section.label}\n                            </div>\n                            {block.items.map(renderItem)}\n                        </div>\n                    );\n                })}\n            </nav>\n            {footer && <div className={styles.footer}>{footer}</div>}\n        </aside>\n    );\n}\n"],"mappings":"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"}

package/dist/components/Sidebar/Sidebar.module.cjs

@@ -1,2 +1,2 @@
-var e=`tempest_sidebar_UB1qz`,t=`tempest_header_zupoS`,n=`tempest_nav_aLYuL`,r=`tempest_item_IAjHb`,i=`tempest_collapsed_ZbZYA`,a=`tempest_active_BgcFy`,o=`tempest_icon_UQswn`,s=`tempest_label_TPvJ9`,c=`tempest_badge_xwEZv`,l=`tempest_footer_TyRyi`,u={sidebar:e,header:t,nav:n,item:r,collapsed:i,active:a,icon:o,label:s,badge:c,footer:l};exports.active=a,exports.badge=c,exports.collapsed=i,exports.default=u,exports.footer=l,exports.header=t,exports.icon=o,exports.item=r,exports.label=s,exports.nav=n,exports.sidebar=e;
+var e=`tempest_sidebar_UB1qz`,t=`tempest_header_zupoS`,n=`tempest_nav_aLYuL`,r=`tempest_group_YRfYm`,i=`tempest_collapsed_ZbZYA`,a=`tempest_section_lefYR`,o=`tempest_sectionCollapsed_iBtFO`,s=`tempest_separator_Ql9Hr`,c=`tempest_item_IAjHb`,l=`tempest_active_BgcFy`,u=`tempest_icon_UQswn`,d=`tempest_label_TPvJ9`,f=`tempest_badge_xwEZv`,p=`tempest_footer_TyRyi`,m={sidebar:e,header:t,nav:n,group:r,collapsed:i,section:a,sectionCollapsed:o,separator:s,item:c,active:l,icon:u,label:d,badge:f,footer:p};exports.active=l,exports.badge=f,exports.collapsed=i,exports.default=m,exports.footer=p,exports.group=r,exports.header=t,exports.icon=u,exports.item=c,exports.label=d,exports.nav=n,exports.section=a,exports.sectionCollapsed=o,exports.separator=s,exports.sidebar=e;
 //# sourceMappingURL=Sidebar.module.cjs.map

package/dist/components/Sidebar/Sidebar.module.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar.module.cjs","names":[],"sources":["../../../src/components/Sidebar/Sidebar.module.css"],"sourcesContent":[".sidebar {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    background: var(--tempest-surface);\n    border-right: 1px solid var(--tempest-border);\n    font-family: var(--tempest-font-sans);\n    transition: width var(--tempest-duration-base, 200ms) var(--tempest-ease-out, ease-out);\n    overflow: hidden;\n}\n\n.header {\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-bottom: 1px solid var(--tempest-border);\n    min-height: 56px;\n    display: flex;\n    align-items: center;\n}\n\n.nav {\n    flex: 1 1 auto;\n    overflow-y: auto;\n    padding: var(--tempest-space-2);\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n}\n\n.item {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-3);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    background: none;\n    border: 0;\n    border-radius: var(--tempest-radius-md);\n    color: var(--tempest-text);\n    font-size: var(--tempest-text-sm);\n    text-align: left;\n    cursor: pointer;\n    transition: background var(--tempest-duration-fast, 120ms);\n    min-height: 36px;\n    width: 100%;\n}\n\n.collapsed .item {\n    justify-content: center;\n    padding-left: 0;\n    padding-right: 0;\n}\n\n.item:hover {\n    background: var(--tempest-gray-100);\n}\n\n.item.active {\n    background: var(--tempest-primary-100);\n    color: var(--tempest-primary-700);\n    font-weight: var(--tempest-weight-medium);\n}\n\n.item:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.icon {\n    display: inline-flex;\n    align-items: center;\n    font-size: 18px;\n    line-height: 1;\n    flex: 0 0 auto;\n}\n\n.label {\n    flex: 1 1 auto;\n    min-width: 0;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\n.badge {\n    flex: 0 0 auto;\n    min-width: 18px;\n    height: 18px;\n    padding: 0 6px;\n    border-radius: var(--tempest-radius-full);\n    background: var(--tempest-gray-200);\n    color: var(--tempest-text);\n    font-size: 10px;\n    line-height: 18px;\n    text-align: center;\n}\n\n.footer {\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-top: 1px solid var(--tempest-border);\n}\n"],"mappings":""}
+{"version":3,"file":"Sidebar.module.cjs","names":[],"sources":["../../../src/components/Sidebar/Sidebar.module.css"],"sourcesContent":[".sidebar {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    background: var(--tempest-surface);\n    border-right: 1px solid var(--tempest-border);\n    font-family: var(--tempest-font-sans);\n    transition: width var(--tempest-duration-base, 200ms) var(--tempest-ease-out, ease-out);\n    overflow: hidden;\n}\n\n.header {\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-bottom: 1px solid var(--tempest-border);\n    min-height: 56px;\n    display: flex;\n    align-items: center;\n}\n\n.nav {\n    flex: 1 1 auto;\n    overflow-y: auto;\n    padding: var(--tempest-space-2);\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n}\n\n.group {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n}\n\n.group + .group {\n    margin-top: var(--tempest-space-3);\n}\n\n.collapsed .group + .group {\n    margin-top: var(--tempest-space-2);\n    padding-top: var(--tempest-space-2);\n    border-top: 1px solid var(--tempest-border);\n}\n\n.section {\n    padding: var(--tempest-space-2) var(--tempest-space-3) var(--tempest-space-1);\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-semibold);\n    letter-spacing: 0.04em;\n    text-transform: uppercase;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\n.sectionCollapsed {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip-path: inset(50%);\n    white-space: nowrap;\n    border: 0;\n}\n\n.separator {\n    flex: 0 0 auto;\n    margin: var(--tempest-space-2) var(--tempest-space-1);\n    border: 0;\n    border-top: 1px solid var(--tempest-border);\n}\n\n.item {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-3);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    background: none;\n    border: 0;\n    border-radius: var(--tempest-radius-md);\n    color: var(--tempest-text);\n    font-size: var(--tempest-text-sm);\n    text-align: left;\n    cursor: pointer;\n    transition: background var(--tempest-duration-fast, 120ms);\n    min-height: 36px;\n    width: 100%;\n}\n\n.collapsed .item {\n    justify-content: center;\n    padding-left: 0;\n    padding-right: 0;\n}\n\n.item {\n    text-decoration: none;\n}\n\n.item:hover {\n    background: var(--tempest-gray-100);\n}\n\n.item.active {\n    background: var(--tempest-primary-100);\n    color: var(--tempest-primary-700);\n    font-weight: var(--tempest-weight-medium);\n}\n\n.item:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.icon {\n    display: inline-flex;\n    align-items: center;\n    font-size: 18px;\n    line-height: 1;\n    flex: 0 0 auto;\n}\n\n.label {\n    flex: 1 1 auto;\n    min-width: 0;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n\n.badge {\n    flex: 0 0 auto;\n    min-width: 18px;\n    height: 18px;\n    padding: 0 6px;\n    border-radius: var(--tempest-radius-full);\n    background: var(--tempest-gray-200);\n    color: var(--tempest-text);\n    font-size: 10px;\n    line-height: 18px;\n    text-align: center;\n}\n\n.footer {\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-top: 1px solid var(--tempest-border);\n}\n"],"mappings":""}