@commercetools/nimbus 2.11.0 → 3.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercetools/nimbus",
-  "version": "2.11.0",
+  "version": "3.0.0",
   "main": "./dist/index.cjs",
   "module": "./dist/index.es.js",
   "type": "module",
@@ -49,31 +49,32 @@
     }
   },
   "dependencies": {
-    "@chakra-ui/cli": "^3.34.0",
+    "@chakra-ui/cli": "^3.35.0",
     "@emotion/is-prop-valid": "^1.4.0",
     "@github-ui/storybook-addon-performance-panel": "^1.1.4",
     "@internationalized/string": "^3.2.8",
     "@react-aria/interactions": "3.28.0",
+    "@react-aria/utils": "3.34.0",
     "dequal": "^2.0.3",
     "escape-html": "^1.0.3",
     "is-hotkey": "^0.2.0",
     "next-themes": "^0.4.6",
     "react-aria": "3.48.0",
     "react-aria-components": "1.17.0",
-    "react-hotkeys-hook": "^5.2.1",
+    "react-hotkeys-hook": "^5.3.2",
     "react-stately": "3.46.0",
     "react-use": "^17.5.1",
     "use-debounce": "^10.1.0"
   },
   "devDependencies": {
-    "@chakra-ui/react": "^3.34.0",
+    "@chakra-ui/react": "^3.35.0",
     "@internationalized/date": "^3.12.1",
     "@react-aria/optimize-locales-plugin": "1.2.0",
     "@react-types/shared": "^3.34.0",
-    "@storybook/addon-a11y": "^10.3.5",
-    "@storybook/addon-docs": "^10.3.5",
-    "@storybook/addon-vitest": "^10.3.5",
-    "@storybook/react-vite": "^10.3.5",
+    "@storybook/addon-a11y": "^10.3.6",
+    "@storybook/addon-docs": "^10.3.6",
+    "@storybook/addon-vitest": "^10.3.6",
+    "@storybook/react-vite": "^10.3.6",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",
@@ -81,43 +82,43 @@
     "@types/is-hotkey": "^0.1.10",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
-    "@vitejs/plugin-react": "^5.1.4",
-    "@vitest/browser": "^4.1.4",
-    "@vitest/browser-playwright": "^4.1.4",
-    "@vitest/coverage-v8": "^4.1.4",
-    "@vueless/storybook-dark-mode": "^10.0.7",
+    "@vitejs/plugin-react": "^5.2.0",
+    "@vitest/browser": "^4.1.5",
+    "@vitest/browser-playwright": "^4.1.5",
+    "@vitest/coverage-v8": "^4.1.5",
+    "@vueless/storybook-dark-mode": "^10.0.8",
     "apca-w3": "^0.1.9",
     "axe-core": "^4.11.0",
-    "dompurify": "^3.4.0",
+    "dompurify": "^3.4.2",
     "glob": "^13.0.6",
     "jsdom": "29.0.1",
     "playwright": "^1.59.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "rollup": "^4.60.1",
+    "rollup": "^4.60.3",
     "rollup-plugin-tree-shakeable": "^2.0.0",
     "slate": "^0.123.0",
     "slate-history": "^0.115.0",
     "slate-hyperscript": "^0.115.0",
     "slate-react": "^0.123.0",
-    "storybook": "^10.3.5",
+    "storybook": "^10.3.6",
     "vite": "^7.3.2",
     "vite-plugin-dts": "^4.5.4",
     "vite-tsconfig-paths": "^6.1.1",
-    "vitest": "^4.1.4",
-    "@commercetools/nimbus-design-token-ts-plugin": "^2.11.0",
-    "@commercetools/nimbus-icons": "^2.11.0",
-    "@commercetools/nimbus-tokens": "^2.11.0"
+    "vitest": "^4.1.5",
+    "@commercetools/nimbus-design-token-ts-plugin": "^3.0.0",
+    "@commercetools/nimbus-icons": "^3.0.0",
+    "@commercetools/nimbus-tokens": "^3.0.0"
   },
   "peerDependencies": {
-    "@chakra-ui/react": "^3.34.0",
+    "@chakra-ui/react": "^3.35.0",
     "react": "19.x",
     "slate": "^0.123.0",
     "slate-history": "^0.115.0",
     "slate-hyperscript": "^0.115.0",
     "slate-react": "^0.123.0",
-    "@commercetools/nimbus-icons": "^2.11.0",
-    "@commercetools/nimbus-tokens": "^2.11.0"
+    "@commercetools/nimbus-icons": "^3.0.0",
+    "@commercetools/nimbus-tokens": "^3.0.0"
   },
   "scripts": {
     "build": "pnpm run build-theme-typings && pnpm run build:lib",

package/dist/chunks/avatar-BZVVE8-z.cjs.js

@@ -1,2 +0,0 @@
-"use strict";const g=require("react/jsx-runtime"),u=require("react"),$=require("@chakra-ui/react/styled-system"),e=require("./normalize-messages-Dogs8lYA.cjs.js"),A=require("./image-CGOYoc2s.cjs.js"),{withContext:z}=$.createRecipeContext({key:"nimbusAvatar"}),I=z("figure"),S={avatarLabel:a=>`Avatar image for ${a.fullName}`},h={avatarLabel:a=>`Avatarbild für ${a.fullName}`},q={avatarLabel:a=>`Imagen de avatar para ${a.fullName}`},x={avatarLabel:a=>`Image d'avatar pour ${a.fullName}`},y={avatarLabel:a=>`Avatar para ${a.fullName}`},R={en:e.normalizeMessages(S),de:e.normalizeMessages(h),es:e.normalizeMessages(q),"fr-FR":e.normalizeMessages(x),"pt-BR":e.normalizeMessages(y)};function _(a,s){return a.split("")[0].toUpperCase()+s.split("")[0].toUpperCase()}const v=a=>{const s=e.useLocalizedStringFormatter(R),{ref:f,firstName:r,lastName:o,src:t,alt:d,...p}=a,[n,l]=u.useState(!1),[i,c]=u.useState(!1),m=`${r} ${o}`,b={"aria-label":s.format("avatarLabel",{fullName:m}),ref:f,...p},L=()=>{l(!0),c(!1)},M=()=>{l(!1),c(!0)},N=!t||!n||i;return g.jsxs(I,{...b,children:[N?_(r,o):null,t&&g.jsx(A.Image,{src:t,alt:d||m,onLoad:L,onError:M,display:n&&!i?"block":"none"})]})};v.displayName="Avatar";exports.Avatar=v;
-//# sourceMappingURL=avatar-BZVVE8-z.cjs.js.map

package/dist/chunks/avatar-BZVVE8-z.cjs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"avatar-BZVVE8-z.cjs.js","sources":["../../src/components/avatar/avatar.slots.tsx","../../src/components/avatar/intl/en.ts","../../src/components/avatar/intl/de.ts","../../src/components/avatar/intl/es.ts","../../src/components/avatar/intl/fr-FR.ts","../../src/components/avatar/intl/pt-BR.ts","../../src/components/avatar/avatar.messages.ts","../../src/components/avatar/avatar.tsx"],"sourcesContent":["import { createRecipeContext } from \"@chakra-ui/react/styled-system\";\nimport type { AvatarRootSlotProps } from \"./avatar.types\";\n\nconst { withContext } = createRecipeContext({ key: \"nimbusAvatar\" });\n\nexport const AvatarRoot = withContext<HTMLElement, AvatarRootSlotProps>(\n  \"figure\"\n);\n","/**\n * Pre-compiled en messages for Avatar\n * Generated by @internationalized/string-compiler\n * DO NOT EDIT MANUALLY\n */\n\nexport default {\n  avatarLabel: (args: Record<string, string | number>) =>\n    `Avatar image for ${args.fullName}`,\n};\n","/**\n * Pre-compiled de messages for Avatar\n * Generated by @internationalized/string-compiler\n * DO NOT EDIT MANUALLY\n */\n\nexport default {\n  avatarLabel: (args: Record<string, string | number>) =>\n    `Avatarbild für ${args.fullName}`,\n};\n","/**\n * Pre-compiled es messages for Avatar\n * Generated by @internationalized/string-compiler\n * DO NOT EDIT MANUALLY\n */\n\nexport default {\n  avatarLabel: (args: Record<string, string | number>) =>\n    `Imagen de avatar para ${args.fullName}`,\n};\n","/**\n * Pre-compiled fr-FR messages for Avatar\n * Generated by @internationalized/string-compiler\n * DO NOT EDIT MANUALLY\n */\n\nexport default {\n  avatarLabel: (args: Record<string, string | number>) =>\n    `Image d'avatar pour ${args.fullName}`,\n};\n","/**\n * Pre-compiled pt-BR messages for Avatar\n * Generated by @internationalized/string-compiler\n * DO NOT EDIT MANUALLY\n */\n\nexport default {\n  avatarLabel: (args: Record<string, string | number>) =>\n    `Avatar para ${args.fullName}`,\n};\n","/**\n * Pre-compiled localized messages for Avatar component\n *\n * Generated by scripts/generate-dictionaries.ts\n * DO NOT EDIT MANUALLY\n *\n * @see https://react-spectrum.adobe.com/react-aria/internationalization.html\n */\n\nimport {\n  type LocalizedString,\n  type LocalizedStrings,\n} from \"@internationalized/string\";\nimport { normalizeMessages } from \"../../utils/normalize-messages\";\n\n// Pre-compiled message functions\nimport avatarMessages_en from \"./intl/en\";\nimport avatarMessages_de from \"./intl/de\";\nimport avatarMessages_es from \"./intl/es\";\nimport avatarMessages_fr from \"./intl/fr-FR\";\nimport avatarMessages_pt from \"./intl/pt-BR\";\n\n// Raw LocalizedStrings object for use with useLocalizedStringFormatter hook\nexport const avatarMessagesStrings: LocalizedStrings<string, LocalizedString> =\n  {\n    en: normalizeMessages(avatarMessages_en),\n    de: normalizeMessages(avatarMessages_de),\n    es: normalizeMessages(avatarMessages_es),\n    \"fr-FR\": normalizeMessages(avatarMessages_fr),\n    \"pt-BR\": normalizeMessages(avatarMessages_pt),\n  } as LocalizedStrings<string, LocalizedString>;\n\n/**\n * Available message keys for Avatar component\n */\nexport type AvatarMessageKey = \"avatarLabel\";\n","import { useState } from \"react\";\nimport { Image } from \"@/components\";\nimport { useLocalizedStringFormatter } from \"@/hooks\";\nimport { type AvatarProps } from \"./avatar.types\";\nimport { AvatarRoot } from \"./avatar.slots\";\nimport { avatarMessagesStrings } from \"./avatar.messages\";\n\nfunction getInitials(firstName: string, lastName: string) {\n  return (\n    firstName.split(\"\")[0].toUpperCase() + lastName.split(\"\")[0].toUpperCase()\n  );\n}\n\n/**\n * Avatar\n * ============================================================\n * A small image or icon that identifies and personalizes the user within the interface.\n * Displays user images or automatically generates initials from first and last names.\n * Falls back to initials if image fails to load.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/media/avatar}\n *\n * @supportsStyleProps\n *\n * @example\n * ```tsx\n * <Avatar firstName=\"John\" lastName=\"Doe\" src=\"https://example.com/avatar.jpg\" />\n * ```\n *\n * @example\n * ```tsx\n * // With initials fallback\n * <Avatar firstName=\"Jane\" lastName=\"Smith\" />\n * ```\n */\nexport const Avatar = (props: AvatarProps) => {\n  const msg = useLocalizedStringFormatter(avatarMessagesStrings);\n  const { ref, firstName, lastName, src, alt, ...rest } = props;\n  const [imageLoaded, setImageLoaded] = useState(false);\n  const [imageError, setImageError] = useState(false);\n\n  const fullName = `${firstName} ${lastName}`;\n\n  const avatarLabel = msg.format(\"avatarLabel\", {\n    fullName,\n  });\n\n  const sharedProps = {\n    \"aria-label\": avatarLabel,\n    ref,\n    ...rest,\n  };\n\n  const onLoad = () => {\n    setImageLoaded(true);\n    setImageError(false);\n  };\n\n  const onError = () => {\n    setImageLoaded(false);\n    setImageError(true);\n  };\n\n  // Show initials if no src provided, image hasn't loaded yet, or image failed\n  const shouldShowInitials = !src || !imageLoaded || imageError;\n\n  return (\n    <AvatarRoot {...sharedProps}>\n      {shouldShowInitials ? getInitials(firstName, lastName) : null}\n\n      {src && (\n        <Image\n          src={src}\n          alt={alt || fullName}\n          onLoad={onLoad}\n          onError={onError}\n          display={imageLoaded && !imageError ? \"block\" : \"none\"}\n        />\n      )}\n    </AvatarRoot>\n  );\n};\n\nAvatar.displayName = \"Avatar\";\n"],"names":["withContext","createRecipeContext","AvatarRoot","avatarMessages_en","args","avatarMessages_de","avatarMessages_es","avatarMessages_fr","avatarMessages_pt","avatarMessagesStrings","normalizeMessages","getInitials","firstName","lastName","Avatar","props","msg","useLocalizedStringFormatter","ref","src","alt","rest","imageLoaded","setImageLoaded","useState","imageError","setImageError","fullName","sharedProps","onLoad","onError","shouldShowInitials","jsxs","jsx","Image"],"mappings":"wMAGM,CAAE,YAAAA,CAAA,EAAgBC,EAAAA,oBAAoB,CAAE,IAAK,eAAgB,EAEtDC,EAAaF,EACxB,QACF,ECDAG,EAAe,CACb,YAAcC,GACZ,oBAAoBA,EAAK,QAAQ,EACrC,ECHAC,EAAe,CACb,YAAcD,GACZ,kBAAkBA,EAAK,QAAQ,EACnC,ECHAE,EAAe,CACb,YAAcF,GACZ,yBAAyBA,EAAK,QAAQ,EAC1C,ECHAG,EAAe,CACb,YAAcH,GACZ,uBAAuBA,EAAK,QAAQ,EACxC,ECHAI,EAAe,CACb,YAAcJ,GACZ,eAAeA,EAAK,QAAQ,EAChC,ECcaK,EACX,CACE,GAAIC,EAAAA,kBAAkBP,CAAiB,EACvC,GAAIO,EAAAA,kBAAkBL,CAAiB,EACvC,GAAIK,EAAAA,kBAAkBJ,CAAiB,EACvC,QAASI,EAAAA,kBAAkBH,CAAiB,EAC5C,QAASG,EAAAA,kBAAkBF,CAAiB,CAC9C,ECvBF,SAASG,EAAYC,EAAmBC,EAAkB,CACxD,OACED,EAAU,MAAM,EAAE,EAAE,CAAC,EAAE,cAAgBC,EAAS,MAAM,EAAE,EAAE,CAAC,EAAE,YAAA,CAEjE,CAwBO,MAAMC,EAAUC,GAAuB,CAC5C,MAAMC,EAAMC,EAAAA,4BAA4BR,CAAqB,EACvD,CAAE,IAAAS,EAAK,UAAAN,EAAW,SAAAC,EAAU,IAAAM,EAAK,IAAAC,EAAK,GAAGC,GAASN,EAClD,CAACO,EAAaC,CAAc,EAAIC,EAAAA,SAAS,EAAK,EAC9C,CAACC,EAAYC,CAAa,EAAIF,EAAAA,SAAS,EAAK,EAE5CG,EAAW,GAAGf,CAAS,IAAIC,CAAQ,GAMnCe,EAAc,CAClB,aALkBZ,EAAI,OAAO,cAAe,CAC5C,SAAAW,CAAA,CACD,EAIC,IAAAT,EACA,GAAGG,CAAA,EAGCQ,EAAS,IAAM,CACnBN,EAAe,EAAI,EACnBG,EAAc,EAAK,CACrB,EAEMI,EAAU,IAAM,CACpBP,EAAe,EAAK,EACpBG,EAAc,EAAI,CACpB,EAGMK,EAAqB,CAACZ,GAAO,CAACG,GAAeG,EAEnD,OACEO,EAAAA,KAAC9B,EAAA,CAAY,GAAG0B,EACb,SAAA,CAAAG,EAAqBpB,EAAYC,EAAWC,CAAQ,EAAI,KAExDM,GACCc,EAAAA,IAACC,EAAAA,MAAA,CACC,IAAAf,EACA,IAAKC,GAAOO,EACZ,OAAAE,EACA,QAAAC,EACA,QAASR,GAAe,CAACG,EAAa,QAAU,MAAA,CAAA,CAClD,EAEJ,CAEJ,EAEAX,EAAO,YAAc"}

package/dist/chunks/avatar-g0-w5BFv.es.js

@@ -1,58 +0,0 @@
-import { jsxs as L, jsx as I } from "react/jsx-runtime";
-import { useState as f } from "react";
-import { createRecipeContext as N } from "@chakra-ui/react/styled-system";
-import { n as e, u as A } from "./normalize-messages-CeN1NEyM.es.js";
-import { I as h } from "./image-DRigLU80.es.js";
-const { withContext: M } = /* @__PURE__ */ N({ key: "nimbusAvatar" }), $ = /* @__PURE__ */ M(
-  "figure"
-), x = {
-  avatarLabel: (a) => `Avatar image for ${a.fullName}`
-}, S = {
-  avatarLabel: (a) => `Avatarbild für ${a.fullName}`
-}, _ = {
-  avatarLabel: (a) => `Imagen de avatar para ${a.fullName}`
-}, C = {
-  avatarLabel: (a) => `Image d'avatar pour ${a.fullName}`
-}, R = {
-  avatarLabel: (a) => `Avatar para ${a.fullName}`
-}, w = {
-  en: /* @__PURE__ */ e(x),
-  de: /* @__PURE__ */ e(S),
-  es: /* @__PURE__ */ e(_),
-  "fr-FR": /* @__PURE__ */ e(C),
-  "pt-BR": /* @__PURE__ */ e(R)
-};
-function y(a, t) {
-  return a.split("")[0].toUpperCase() + t.split("")[0].toUpperCase();
-}
-const E = (a) => {
-  const t = A(w), { ref: v, firstName: r, lastName: o, src: s, alt: p, ...g } = a, [l, n] = f(!1), [m, i] = f(!1), c = `${r} ${o}`, u = {
-    "aria-label": t.format("avatarLabel", {
-      fullName: c
-    }),
-    ref: v,
-    ...g
-  }, d = () => {
-    n(!0), i(!1);
-  }, b = () => {
-    n(!1), i(!0);
-  };
-  return /* @__PURE__ */ L($, { ...u, children: [
-    !s || !l || m ? y(r, o) : null,
-    s && /* @__PURE__ */ I(
-      h,
-      {
-        src: s,
-        alt: p || c,
-        onLoad: d,
-        onError: b,
-        display: l && !m ? "block" : "none"
-      }
-    )
-  ] });
-};
-E.displayName = "Avatar";
-export {
-  E as A
-};
-//# sourceMappingURL=avatar-g0-w5BFv.es.js.map

package/dist/chunks/avatar-g0-w5BFv.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"avatar-g0-w5BFv.es.js","sources":["../../src/components/avatar/avatar.slots.tsx","../../src/components/avatar/intl/en.ts","../../src/components/avatar/intl/de.ts","../../src/components/avatar/intl/es.ts","../../src/components/avatar/intl/fr-FR.ts","../../src/components/avatar/intl/pt-BR.ts","../../src/components/avatar/avatar.messages.ts","../../src/components/avatar/avatar.tsx"],"sourcesContent":["import { createRecipeContext } from \"@chakra-ui/react/styled-system\";\nimport type { AvatarRootSlotProps } from \"./avatar.types\";\n\nconst { withContext } = createRecipeContext({ key: \"nimbusAvatar\" });\n\nexport const AvatarRoot = withContext<HTMLElement, AvatarRootSlotProps>(\n  \"figure\"\n);\n","/**\n * Pre-compiled en messages for Avatar\n * Generated by @internationalized/string-compiler\n * DO NOT EDIT MANUALLY\n */\n\nexport default {\n  avatarLabel: (args: Record<string, string | number>) =>\n    `Avatar image for ${args.fullName}`,\n};\n","/**\n * Pre-compiled de messages for Avatar\n * Generated by @internationalized/string-compiler\n * DO NOT EDIT MANUALLY\n */\n\nexport default {\n  avatarLabel: (args: Record<string, string | number>) =>\n    `Avatarbild für ${args.fullName}`,\n};\n","/**\n * Pre-compiled es messages for Avatar\n * Generated by @internationalized/string-compiler\n * DO NOT EDIT MANUALLY\n */\n\nexport default {\n  avatarLabel: (args: Record<string, string | number>) =>\n    `Imagen de avatar para ${args.fullName}`,\n};\n","/**\n * Pre-compiled fr-FR messages for Avatar\n * Generated by @internationalized/string-compiler\n * DO NOT EDIT MANUALLY\n */\n\nexport default {\n  avatarLabel: (args: Record<string, string | number>) =>\n    `Image d'avatar pour ${args.fullName}`,\n};\n","/**\n * Pre-compiled pt-BR messages for Avatar\n * Generated by @internationalized/string-compiler\n * DO NOT EDIT MANUALLY\n */\n\nexport default {\n  avatarLabel: (args: Record<string, string | number>) =>\n    `Avatar para ${args.fullName}`,\n};\n","/**\n * Pre-compiled localized messages for Avatar component\n *\n * Generated by scripts/generate-dictionaries.ts\n * DO NOT EDIT MANUALLY\n *\n * @see https://react-spectrum.adobe.com/react-aria/internationalization.html\n */\n\nimport {\n  type LocalizedString,\n  type LocalizedStrings,\n} from \"@internationalized/string\";\nimport { normalizeMessages } from \"../../utils/normalize-messages\";\n\n// Pre-compiled message functions\nimport avatarMessages_en from \"./intl/en\";\nimport avatarMessages_de from \"./intl/de\";\nimport avatarMessages_es from \"./intl/es\";\nimport avatarMessages_fr from \"./intl/fr-FR\";\nimport avatarMessages_pt from \"./intl/pt-BR\";\n\n// Raw LocalizedStrings object for use with useLocalizedStringFormatter hook\nexport const avatarMessagesStrings: LocalizedStrings<string, LocalizedString> =\n  {\n    en: normalizeMessages(avatarMessages_en),\n    de: normalizeMessages(avatarMessages_de),\n    es: normalizeMessages(avatarMessages_es),\n    \"fr-FR\": normalizeMessages(avatarMessages_fr),\n    \"pt-BR\": normalizeMessages(avatarMessages_pt),\n  } as LocalizedStrings<string, LocalizedString>;\n\n/**\n * Available message keys for Avatar component\n */\nexport type AvatarMessageKey = \"avatarLabel\";\n","import { useState } from \"react\";\nimport { Image } from \"@/components\";\nimport { useLocalizedStringFormatter } from \"@/hooks\";\nimport { type AvatarProps } from \"./avatar.types\";\nimport { AvatarRoot } from \"./avatar.slots\";\nimport { avatarMessagesStrings } from \"./avatar.messages\";\n\nfunction getInitials(firstName: string, lastName: string) {\n  return (\n    firstName.split(\"\")[0].toUpperCase() + lastName.split(\"\")[0].toUpperCase()\n  );\n}\n\n/**\n * Avatar\n * ============================================================\n * A small image or icon that identifies and personalizes the user within the interface.\n * Displays user images or automatically generates initials from first and last names.\n * Falls back to initials if image fails to load.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/media/avatar}\n *\n * @supportsStyleProps\n *\n * @example\n * ```tsx\n * <Avatar firstName=\"John\" lastName=\"Doe\" src=\"https://example.com/avatar.jpg\" />\n * ```\n *\n * @example\n * ```tsx\n * // With initials fallback\n * <Avatar firstName=\"Jane\" lastName=\"Smith\" />\n * ```\n */\nexport const Avatar = (props: AvatarProps) => {\n  const msg = useLocalizedStringFormatter(avatarMessagesStrings);\n  const { ref, firstName, lastName, src, alt, ...rest } = props;\n  const [imageLoaded, setImageLoaded] = useState(false);\n  const [imageError, setImageError] = useState(false);\n\n  const fullName = `${firstName} ${lastName}`;\n\n  const avatarLabel = msg.format(\"avatarLabel\", {\n    fullName,\n  });\n\n  const sharedProps = {\n    \"aria-label\": avatarLabel,\n    ref,\n    ...rest,\n  };\n\n  const onLoad = () => {\n    setImageLoaded(true);\n    setImageError(false);\n  };\n\n  const onError = () => {\n    setImageLoaded(false);\n    setImageError(true);\n  };\n\n  // Show initials if no src provided, image hasn't loaded yet, or image failed\n  const shouldShowInitials = !src || !imageLoaded || imageError;\n\n  return (\n    <AvatarRoot {...sharedProps}>\n      {shouldShowInitials ? getInitials(firstName, lastName) : null}\n\n      {src && (\n        <Image\n          src={src}\n          alt={alt || fullName}\n          onLoad={onLoad}\n          onError={onError}\n          display={imageLoaded && !imageError ? \"block\" : \"none\"}\n        />\n      )}\n    </AvatarRoot>\n  );\n};\n\nAvatar.displayName = \"Avatar\";\n"],"names":["withContext","createRecipeContext","AvatarRoot","avatarMessages_en","args","avatarMessages_de","avatarMessages_es","avatarMessages_fr","avatarMessages_pt","avatarMessagesStrings","normalizeMessages","getInitials","firstName","lastName","Avatar","props","msg","useLocalizedStringFormatter","ref","src","alt","rest","imageLoaded","setImageLoaded","useState","imageError","setImageError","fullName","sharedProps","onLoad","onError","jsxs","jsx","Image"],"mappings":";;;;;AAGA,MAAM,EAAE,aAAAA,EAAA,IAAgB,gBAAAC,EAAoB,EAAE,KAAK,gBAAgB,GAEtDC,IAAa,gBAAAF;AAAA,EACxB;AACF,GCDAG,IAAe;AAAA,EACb,aAAa,CAACC,MACZ,oBAAoBA,EAAK,QAAQ;AACrC,GCHAC,IAAe;AAAA,EACb,aAAa,CAACD,MACZ,kBAAkBA,EAAK,QAAQ;AACnC,GCHAE,IAAe;AAAA,EACb,aAAa,CAACF,MACZ,yBAAyBA,EAAK,QAAQ;AAC1C,GCHAG,IAAe;AAAA,EACb,aAAa,CAACH,MACZ,uBAAuBA,EAAK,QAAQ;AACxC,GCHAI,IAAe;AAAA,EACb,aAAa,CAACJ,MACZ,eAAeA,EAAK,QAAQ;AAChC,GCcaK,IACX;AAAA,EACE,IAAI,gBAAAC,EAAkBP,CAAiB;AAAA,EACvC,IAAI,gBAAAO,EAAkBL,CAAiB;AAAA,EACvC,IAAI,gBAAAK,EAAkBJ,CAAiB;AAAA,EACvC,SAAS,gBAAAI,EAAkBH,CAAiB;AAAA,EAC5C,SAAS,gBAAAG,EAAkBF,CAAiB;AAC9C;ACvBF,SAASG,EAAYC,GAAmBC,GAAkB;AACxD,SACED,EAAU,MAAM,EAAE,EAAE,CAAC,EAAE,gBAAgBC,EAAS,MAAM,EAAE,EAAE,CAAC,EAAE,YAAA;AAEjE;AAwBO,MAAMC,IAAS,CAACC,MAAuB;AAC5C,QAAMC,IAAMC,EAA4BR,CAAqB,GACvD,EAAE,KAAAS,GAAK,WAAAN,GAAW,UAAAC,GAAU,KAAAM,GAAK,KAAAC,GAAK,GAAGC,MAASN,GAClD,CAACO,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAC9C,CAACC,GAAYC,CAAa,IAAIF,EAAS,EAAK,GAE5CG,IAAW,GAAGf,CAAS,IAAIC,CAAQ,IAMnCe,IAAc;AAAA,IAClB,cALkBZ,EAAI,OAAO,eAAe;AAAA,MAC5C,UAAAW;AAAA,IAAA,CACD;AAAA,IAIC,KAAAT;AAAA,IACA,GAAGG;AAAA,EAAA,GAGCQ,IAAS,MAAM;AACnB,IAAAN,EAAe,EAAI,GACnBG,EAAc,EAAK;AAAA,EACrB,GAEMI,IAAU,MAAM;AACpB,IAAAP,EAAe,EAAK,GACpBG,EAAc,EAAI;AAAA,EACpB;AAKA,SACE,gBAAAK,EAAC7B,GAAA,EAAY,GAAG0B,GACb,UAAA;AAAA,IAJsB,CAACT,KAAO,CAACG,KAAeG,IAIzBd,EAAYC,GAAWC,CAAQ,IAAI;AAAA,IAExDM,KACC,gBAAAa;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,KAAAd;AAAA,QACA,KAAKC,KAAOO;AAAA,QACZ,QAAAE;AAAA,QACA,SAAAC;AAAA,QACA,SAASR,KAAe,CAACG,IAAa,UAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EAClD,GAEJ;AAEJ;AAEAX,EAAO,cAAc;"}

package/dist/chunks/card-9_RuK9Zz.cjs.js

@@ -1,2 +0,0 @@
-"use strict";const a=require("react/jsx-runtime"),e=require("react"),P=require("@chakra-ui/react/styled-system"),v=require("./stack-CIN13EDn.cjs.js"),d=require("./extract-style-props-DiP1lZl_.cjs.js"),{withProvider:j,withContext:y}=P.createSlotRecipeContext({key:"nimbusCard"}),N=j("div","root"),h=y("div","header"),q=y("div","content"),l=e.createContext(void 0),i=({ref:o,children:s,...t})=>{const n=P.useSlotRecipe({key:"nimbusCard"}),[r,c]=n.splitVariantProps(t),[m,S]=d.extractStyleProps(c),[f,p]=e.useState(null),[R,x]=e.useState(null),H=e.useMemo(()=>({setHeader:p,setContent:x}),[p,x]);return a.jsx(l.Provider,{value:H,children:a.jsxs(N,{ref:o,...r,...m,...S,children:[a.jsxs(v.Stack,{direction:"column",gap:"200",children:[f,R]}),s]})})};i.displayName="Card.Root";const u=({children:o,...s})=>{const t=e.useContext(l),[n,r]=d.extractStyleProps(s);return e.useEffect(()=>{if(t){const c=a.jsx(h,{...n,...r,children:o});return t.setHeader(c),()=>t.setHeader(null)}},[o,n,r,t]),null};u.displayName="Card.Header";const C=({children:o,...s})=>{const t=e.useContext(l),[n,r]=d.extractStyleProps(s);return e.useEffect(()=>{if(t){const c=a.jsx(q,{...n,...r,children:o});return t.setContent(c),()=>t.setContent(null)}},[o,n,r,t]),null};C.displayName="Card.Content";const $={Root:i,Header:u,Content:C};exports.Card=$;exports.CardContent=C;exports.CardHeader=u;exports.CardRoot=i;
-//# sourceMappingURL=card-9_RuK9Zz.cjs.js.map

package/dist/chunks/card-9_RuK9Zz.cjs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"card-9_RuK9Zz.cjs.js","sources":["../../src/components/card/card.slots.tsx","../../src/components/card/components/card.root.tsx","../../src/components/card/components/card.header.tsx","../../src/components/card/components/card.content.tsx","../../src/components/card/card.tsx"],"sourcesContent":["import { createSlotRecipeContext } from \"@chakra-ui/react/styled-system\";\nimport type { SlotComponent } from \"../../type-utils/slot-types\";\nimport type {\n  CardContentSlotProps,\n  CardHeaderSlotProps,\n  CardRootSlotProps,\n} from \"./card.types\";\n\nconst { withProvider, withContext } = createSlotRecipeContext({\n  key: \"nimbusCard\",\n});\n\n/**\n * Root component that provides the styling context for the Card component.\n * Uses Chakra UI's recipe context system for consistent styling across instances.\n */\nexport const CardRoot: SlotComponent<HTMLDivElement, CardRootSlotProps> =\n  withProvider<HTMLDivElement, CardRootSlotProps>(\"div\", \"root\");\n\nexport const CardHeader: SlotComponent<HTMLDivElement, CardHeaderSlotProps> =\n  withContext<HTMLDivElement, CardHeaderSlotProps>(\"div\", \"header\");\n\nexport const CardContent: SlotComponent<HTMLDivElement, CardContentSlotProps> =\n  withContext<HTMLDivElement, CardContentSlotProps>(\"div\", \"content\");\n","import { createContext, useMemo, useState, type ReactNode } from \"react\";\nimport { useSlotRecipe } from \"@chakra-ui/react/styled-system\";\nimport { CardRoot as CardRootSlot } from \"../card.slots\";\nimport type { CardProps } from \"../card.types\";\nimport { Stack } from \"../../stack\";\nimport { extractStyleProps } from \"@/utils\";\n\ntype CardContextValue = {\n  setHeader: (header: React.ReactNode) => void;\n  setContent: (content: React.ReactNode) => void;\n};\n\nexport const CardContext = createContext<CardContextValue | undefined>(\n  undefined\n);\n\n/**\n * Card.Root - The root component that provides context and styling for the card\n *\n * @supportsStyleProps\n */\nexport const CardRoot = ({ ref, children, ...props }: CardProps) => {\n  // Standard pattern: First split recipe variants\n  const recipe = useSlotRecipe({ key: \"nimbusCard\" });\n  const [recipeProps, restRecipeProps] = recipe.splitVariantProps(props);\n\n  // Standard pattern: Second extract style props from remaining\n  const [styleProps, functionalProps] = extractStyleProps(restRecipeProps);\n\n  const [headerNode, setHeader] = useState<ReactNode>(null);\n  const [contentNode, setContent] = useState<ReactNode>(null);\n\n  // Memoize the context value so we don't cause unnecessary re-renders\n  const contextValue = useMemo(\n    () => ({\n      setHeader,\n      setContent,\n    }),\n    [setHeader, setContent]\n  );\n\n  return (\n    <CardContext.Provider value={contextValue}>\n      <CardRootSlot\n        ref={ref}\n        {...recipeProps}\n        {...styleProps}\n        {...functionalProps}\n      >\n        {/* Always render them in this order/layout to protect consumers */}\n        <Stack direction=\"column\" gap=\"200\">\n          {headerNode}\n          {contentNode}\n        </Stack>\n\n        {/* Render all consumer sub-components, including our own */}\n        {children}\n      </CardRootSlot>\n    </CardContext.Provider>\n  );\n};\n\nCardRoot.displayName = \"Card.Root\";\n","import { useContext, useEffect } from \"react\";\nimport { CardHeader as CardHeaderSlot } from \"../card.slots\";\nimport { CardContext } from \"./card.root\";\nimport type { CardHeaderProps } from \"../card.types\";\nimport { extractStyleProps } from \"@/utils\";\n\n/**\n * Card.Header - The header section of the card\n *\n * @supportsStyleProps\n */\nexport const CardHeader = ({ children, ...props }: CardHeaderProps) => {\n  const context = useContext(CardContext);\n\n  // Standard pattern: Extract and forward style props\n  const [styleProps, functionalProps] = extractStyleProps(props);\n\n  useEffect(() => {\n    if (context) {\n      const slotElement = (\n        <CardHeaderSlot {...styleProps} {...functionalProps}>\n          {children}\n        </CardHeaderSlot>\n      );\n      // Register it with the parent\n      context.setHeader(slotElement);\n\n      // On unmount, remove it\n      return () => context.setHeader(null);\n    }\n  }, [children, styleProps, functionalProps, context]);\n\n  return null;\n};\nCardHeader.displayName = \"Card.Header\";\n","import { useContext, useEffect } from \"react\";\nimport { CardContent as CardContentSlot } from \"../card.slots\";\nimport { CardContext } from \"./card.root\";\nimport type { CardContentProps } from \"../card.types\";\nimport { extractStyleProps } from \"@/utils\";\n\n/**\n * Card.Content - The main content area of the card\n *\n * @supportsStyleProps\n */\nexport const CardContent = ({ children, ...props }: CardContentProps) => {\n  const context = useContext(CardContext);\n\n  // Standard pattern: Extract and forward style props\n  const [styleProps, functionalProps] = extractStyleProps(props);\n\n  useEffect(() => {\n    if (context) {\n      const slotElement = (\n        <CardContentSlot {...styleProps} {...functionalProps}>\n          {children}\n        </CardContentSlot>\n      );\n      // Register it with the parent\n      context.setContent(slotElement);\n\n      // On unmount, remove it\n      return () => context.setContent(null);\n    }\n  }, [children, styleProps, functionalProps, context]);\n\n  return null;\n};\n\nCardContent.displayName = \"Card.Content\";\n","import { CardRoot, CardHeader, CardContent } from \"./components\";\n\n/**\n * Card\n * ============================================================\n * A versatile container component that presents self-contained information\n * in a visually distinct way. Cards group related content and actions\n * together, making it easy to scan and interact with information.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/data-display/card}\n *\n * @example\n * ```tsx\n * <Card.Root>\n *   <Card.Header>Card Title</Card.Header>\n *   <Card.Content>Card content goes here</Card.Content>\n * </Card.Root>\n * ```\n */\nexport const Card = {\n  /**\n   * # Card.Root\n   *\n   * The root component that provides context and styling for the card.\n   * Must wrap all card parts (Header, Content) to coordinate their behavior.\n   * Accepts styling variants for padding, border, elevation, and background.\n   *\n   * @example\n   * ```tsx\n   * <Card.Root cardPadding=\"md\" borderStyle=\"outlined\" elevation=\"elevated\">\n   *   <Card.Header>Title</Card.Header>\n   *   <Card.Content>Content</Card.Content>\n   * </Card.Root>\n   * ```\n   */\n  Root: CardRoot,\n  /**\n   * # Card.Header\n   *\n   * The header section of the card, typically containing the card title\n   * or primary heading. Automatically positioned above the card content\n   * in a consistent layout.\n   *\n   * @example\n   * ```tsx\n   * <Card.Root>\n   *   <Card.Header>Card Title</Card.Header>\n   *   <Card.Content>Content here</Card.Content>\n   * </Card.Root>\n   * ```\n   */\n  Header: CardHeader,\n  /**\n   * # Card.Content\n   *\n   * The main content area of the card. Contains the primary information,\n   * body text, or interactive elements. Automatically positioned below\n   * the card header in a consistent layout.\n   *\n   * @example\n   * ```tsx\n   * <Card.Root>\n   *   <Card.Header>Title</Card.Header>\n   *   <Card.Content>\n   *     <Text>This is the main card content.</Text>\n   *   </Card.Content>\n   * </Card.Root>\n   * ```\n   */\n  Content: CardContent,\n};\n\nexport {\n  CardRoot as _CardRoot,\n  CardHeader as _CardHeader,\n  CardContent as _CardContent,\n};\n"],"names":["withProvider","withContext","createSlotRecipeContext","CardRoot","CardHeader","CardContent","CardContext","createContext","ref","children","props","recipe","useSlotRecipe","recipeProps","restRecipeProps","styleProps","functionalProps","extractStyleProps","headerNode","setHeader","useState","contentNode","setContent","contextValue","useMemo","jsx","jsxs","CardRootSlot","Stack","context","useContext","useEffect","slotElement","CardHeaderSlot","CardContentSlot","Card"],"mappings":"yMAQM,CAAE,aAAAA,EAAc,YAAAC,CAAA,EAAgBC,0BAAwB,CAC5D,IAAK,YACP,CAAC,EAMYC,EACXH,EAAgD,MAAO,MAAM,EAElDI,EACXH,EAAiD,MAAO,QAAQ,EAErDI,EACXJ,EAAkD,MAAO,SAAS,ECXvDK,EAAcC,EAAAA,cACzB,MACF,EAOaJ,EAAW,CAAC,CAAE,IAAAK,EAAK,SAAAC,EAAU,GAAGC,KAAuB,CAElE,MAAMC,EAASC,EAAAA,cAAc,CAAE,IAAK,aAAc,EAC5C,CAACC,EAAaC,CAAe,EAAIH,EAAO,kBAAkBD,CAAK,EAG/D,CAACK,EAAYC,CAAe,EAAIC,EAAAA,kBAAkBH,CAAe,EAEjE,CAACI,EAAYC,CAAS,EAAIC,EAAAA,SAAoB,IAAI,EAClD,CAACC,EAAaC,CAAU,EAAIF,EAAAA,SAAoB,IAAI,EAGpDG,EAAeC,EAAAA,QACnB,KAAO,CACL,UAAAL,EACA,WAAAG,CAAA,GAEF,CAACH,EAAWG,CAAU,CAAA,EAGxB,OACEG,EAAAA,IAACnB,EAAY,SAAZ,CAAqB,MAAOiB,EAC3B,SAAAG,EAAAA,KAACC,EAAA,CACC,IAAAnB,EACC,GAAGK,EACH,GAAGE,EACH,GAAGC,EAGJ,SAAA,CAAAU,EAAAA,KAACE,EAAAA,MAAA,CAAM,UAAU,SAAS,IAAI,MAC3B,SAAA,CAAAV,EACAG,CAAA,EACH,EAGCZ,CAAA,CAAA,CAAA,EAEL,CAEJ,EAEAN,EAAS,YAAc,YCnDhB,MAAMC,EAAa,CAAC,CAAE,SAAAK,EAAU,GAAGC,KAA6B,CACrE,MAAMmB,EAAUC,EAAAA,WAAWxB,CAAW,EAGhC,CAACS,EAAYC,CAAe,EAAIC,EAAAA,kBAAkBP,CAAK,EAE7DqB,OAAAA,EAAAA,UAAU,IAAM,CACd,GAAIF,EAAS,CACX,MAAMG,EACJP,EAAAA,IAACQ,EAAA,CAAgB,GAAGlB,EAAa,GAAGC,EACjC,SAAAP,EACH,EAGF,OAAAoB,EAAQ,UAAUG,CAAW,EAGtB,IAAMH,EAAQ,UAAU,IAAI,CACrC,CACF,EAAG,CAACpB,EAAUM,EAAYC,EAAiBa,CAAO,CAAC,EAE5C,IACT,EACAzB,EAAW,YAAc,cCvBlB,MAAMC,EAAc,CAAC,CAAE,SAAAI,EAAU,GAAGC,KAA8B,CACvE,MAAMmB,EAAUC,EAAAA,WAAWxB,CAAW,EAGhC,CAACS,EAAYC,CAAe,EAAIC,EAAAA,kBAAkBP,CAAK,EAE7DqB,OAAAA,EAAAA,UAAU,IAAM,CACd,GAAIF,EAAS,CACX,MAAMG,EACJP,EAAAA,IAACS,EAAA,CAAiB,GAAGnB,EAAa,GAAGC,EAClC,SAAAP,EACH,EAGF,OAAAoB,EAAQ,WAAWG,CAAW,EAGvB,IAAMH,EAAQ,WAAW,IAAI,CACtC,CACF,EAAG,CAACpB,EAAUM,EAAYC,EAAiBa,CAAO,CAAC,EAE5C,IACT,EAEAxB,EAAY,YAAc,eChBnB,MAAM8B,EAAO,CAgBlB,KAAMhC,EAgBN,OAAQC,EAkBR,QAASC,CACX"}

package/dist/chunks/card-uXOOkYyy.es.js

@@ -1,114 +0,0 @@
-import { jsx as a, jsxs as p } from "react/jsx-runtime";
-import { useState as C, useMemo as N, createContext as b, useContext as u, useEffect as m } from "react";
-import { createSlotRecipeContext as k, useSlotRecipe as E } from "@chakra-ui/react/styled-system";
-import { S as $ } from "./stack-CoNreM7B.es.js";
-import { e as c } from "./extract-style-props-D86m_g63.es.js";
-const { withProvider: j, withContext: f } = /* @__PURE__ */ k({
-  key: "nimbusCard"
-}), w = /* @__PURE__ */ j("div", "root"), V = /* @__PURE__ */ f("div", "header"), g = /* @__PURE__ */ f("div", "content"), d = /* @__PURE__ */ b(
-  void 0
-), x = ({ ref: e, children: r, ...t }) => {
-  const o = E({ key: "nimbusCard" }), [n, s] = o.splitVariantProps(t), [v, H] = c(s), [R, i] = C(null), [S, l] = C(null), h = N(
-    () => ({
-      setHeader: i,
-      setContent: l
-    }),
-    [i, l]
-  );
-  return /* @__PURE__ */ a(d.Provider, { value: h, children: /* @__PURE__ */ p(
-    w,
-    {
-      ref: e,
-      ...n,
-      ...v,
-      ...H,
-      children: [
-        /* @__PURE__ */ p($, { direction: "column", gap: "200", children: [
-          R,
-          S
-        ] }),
-        r
-      ]
-    }
-  ) });
-};
-x.displayName = "Card.Root";
-const P = ({ children: e, ...r }) => {
-  const t = u(d), [o, n] = c(r);
-  return m(() => {
-    if (t) {
-      const s = /* @__PURE__ */ a(V, { ...o, ...n, children: e });
-      return t.setHeader(s), () => t.setHeader(null);
-    }
-  }, [e, o, n, t]), null;
-};
-P.displayName = "Card.Header";
-const y = ({ children: e, ...r }) => {
-  const t = u(d), [o, n] = c(r);
-  return m(() => {
-    if (t) {
-      const s = /* @__PURE__ */ a(g, { ...o, ...n, children: e });
-      return t.setContent(s), () => t.setContent(null);
-    }
-  }, [e, o, n, t]), null;
-};
-y.displayName = "Card.Content";
-const D = {
-  /**
-   * # Card.Root
-   *
-   * The root component that provides context and styling for the card.
-   * Must wrap all card parts (Header, Content) to coordinate their behavior.
-   * Accepts styling variants for padding, border, elevation, and background.
-   *
-   * @example
-   * ```tsx
-   * <Card.Root cardPadding="md" borderStyle="outlined" elevation="elevated">
-   *   <Card.Header>Title</Card.Header>
-   *   <Card.Content>Content</Card.Content>
-   * </Card.Root>
-   * ```
-   */
-  Root: x,
-  /**
-   * # Card.Header
-   *
-   * The header section of the card, typically containing the card title
-   * or primary heading. Automatically positioned above the card content
-   * in a consistent layout.
-   *
-   * @example
-   * ```tsx
-   * <Card.Root>
-   *   <Card.Header>Card Title</Card.Header>
-   *   <Card.Content>Content here</Card.Content>
-   * </Card.Root>
-   * ```
-   */
-  Header: P,
-  /**
-   * # Card.Content
-   *
-   * The main content area of the card. Contains the primary information,
-   * body text, or interactive elements. Automatically positioned below
-   * the card header in a consistent layout.
-   *
-   * @example
-   * ```tsx
-   * <Card.Root>
-   *   <Card.Header>Title</Card.Header>
-   *   <Card.Content>
-   *     <Text>This is the main card content.</Text>
-   *   </Card.Content>
-   * </Card.Root>
-   * ```
-   */
-  Content: y
-};
-export {
-  D as C,
-  y as a,
-  P as b,
-  x as c
-};
-//# sourceMappingURL=card-uXOOkYyy.es.js.map

package/dist/chunks/card-uXOOkYyy.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"card-uXOOkYyy.es.js","sources":["../../src/components/card/card.slots.tsx","../../src/components/card/components/card.root.tsx","../../src/components/card/components/card.header.tsx","../../src/components/card/components/card.content.tsx","../../src/components/card/card.tsx"],"sourcesContent":["import { createSlotRecipeContext } from \"@chakra-ui/react/styled-system\";\nimport type { SlotComponent } from \"../../type-utils/slot-types\";\nimport type {\n  CardContentSlotProps,\n  CardHeaderSlotProps,\n  CardRootSlotProps,\n} from \"./card.types\";\n\nconst { withProvider, withContext } = createSlotRecipeContext({\n  key: \"nimbusCard\",\n});\n\n/**\n * Root component that provides the styling context for the Card component.\n * Uses Chakra UI's recipe context system for consistent styling across instances.\n */\nexport const CardRoot: SlotComponent<HTMLDivElement, CardRootSlotProps> =\n  withProvider<HTMLDivElement, CardRootSlotProps>(\"div\", \"root\");\n\nexport const CardHeader: SlotComponent<HTMLDivElement, CardHeaderSlotProps> =\n  withContext<HTMLDivElement, CardHeaderSlotProps>(\"div\", \"header\");\n\nexport const CardContent: SlotComponent<HTMLDivElement, CardContentSlotProps> =\n  withContext<HTMLDivElement, CardContentSlotProps>(\"div\", \"content\");\n","import { createContext, useMemo, useState, type ReactNode } from \"react\";\nimport { useSlotRecipe } from \"@chakra-ui/react/styled-system\";\nimport { CardRoot as CardRootSlot } from \"../card.slots\";\nimport type { CardProps } from \"../card.types\";\nimport { Stack } from \"../../stack\";\nimport { extractStyleProps } from \"@/utils\";\n\ntype CardContextValue = {\n  setHeader: (header: React.ReactNode) => void;\n  setContent: (content: React.ReactNode) => void;\n};\n\nexport const CardContext = createContext<CardContextValue | undefined>(\n  undefined\n);\n\n/**\n * Card.Root - The root component that provides context and styling for the card\n *\n * @supportsStyleProps\n */\nexport const CardRoot = ({ ref, children, ...props }: CardProps) => {\n  // Standard pattern: First split recipe variants\n  const recipe = useSlotRecipe({ key: \"nimbusCard\" });\n  const [recipeProps, restRecipeProps] = recipe.splitVariantProps(props);\n\n  // Standard pattern: Second extract style props from remaining\n  const [styleProps, functionalProps] = extractStyleProps(restRecipeProps);\n\n  const [headerNode, setHeader] = useState<ReactNode>(null);\n  const [contentNode, setContent] = useState<ReactNode>(null);\n\n  // Memoize the context value so we don't cause unnecessary re-renders\n  const contextValue = useMemo(\n    () => ({\n      setHeader,\n      setContent,\n    }),\n    [setHeader, setContent]\n  );\n\n  return (\n    <CardContext.Provider value={contextValue}>\n      <CardRootSlot\n        ref={ref}\n        {...recipeProps}\n        {...styleProps}\n        {...functionalProps}\n      >\n        {/* Always render them in this order/layout to protect consumers */}\n        <Stack direction=\"column\" gap=\"200\">\n          {headerNode}\n          {contentNode}\n        </Stack>\n\n        {/* Render all consumer sub-components, including our own */}\n        {children}\n      </CardRootSlot>\n    </CardContext.Provider>\n  );\n};\n\nCardRoot.displayName = \"Card.Root\";\n","import { useContext, useEffect } from \"react\";\nimport { CardHeader as CardHeaderSlot } from \"../card.slots\";\nimport { CardContext } from \"./card.root\";\nimport type { CardHeaderProps } from \"../card.types\";\nimport { extractStyleProps } from \"@/utils\";\n\n/**\n * Card.Header - The header section of the card\n *\n * @supportsStyleProps\n */\nexport const CardHeader = ({ children, ...props }: CardHeaderProps) => {\n  const context = useContext(CardContext);\n\n  // Standard pattern: Extract and forward style props\n  const [styleProps, functionalProps] = extractStyleProps(props);\n\n  useEffect(() => {\n    if (context) {\n      const slotElement = (\n        <CardHeaderSlot {...styleProps} {...functionalProps}>\n          {children}\n        </CardHeaderSlot>\n      );\n      // Register it with the parent\n      context.setHeader(slotElement);\n\n      // On unmount, remove it\n      return () => context.setHeader(null);\n    }\n  }, [children, styleProps, functionalProps, context]);\n\n  return null;\n};\nCardHeader.displayName = \"Card.Header\";\n","import { useContext, useEffect } from \"react\";\nimport { CardContent as CardContentSlot } from \"../card.slots\";\nimport { CardContext } from \"./card.root\";\nimport type { CardContentProps } from \"../card.types\";\nimport { extractStyleProps } from \"@/utils\";\n\n/**\n * Card.Content - The main content area of the card\n *\n * @supportsStyleProps\n */\nexport const CardContent = ({ children, ...props }: CardContentProps) => {\n  const context = useContext(CardContext);\n\n  // Standard pattern: Extract and forward style props\n  const [styleProps, functionalProps] = extractStyleProps(props);\n\n  useEffect(() => {\n    if (context) {\n      const slotElement = (\n        <CardContentSlot {...styleProps} {...functionalProps}>\n          {children}\n        </CardContentSlot>\n      );\n      // Register it with the parent\n      context.setContent(slotElement);\n\n      // On unmount, remove it\n      return () => context.setContent(null);\n    }\n  }, [children, styleProps, functionalProps, context]);\n\n  return null;\n};\n\nCardContent.displayName = \"Card.Content\";\n","import { CardRoot, CardHeader, CardContent } from \"./components\";\n\n/**\n * Card\n * ============================================================\n * A versatile container component that presents self-contained information\n * in a visually distinct way. Cards group related content and actions\n * together, making it easy to scan and interact with information.\n *\n * @see {@link https://nimbus-documentation.vercel.app/components/data-display/card}\n *\n * @example\n * ```tsx\n * <Card.Root>\n *   <Card.Header>Card Title</Card.Header>\n *   <Card.Content>Card content goes here</Card.Content>\n * </Card.Root>\n * ```\n */\nexport const Card = {\n  /**\n   * # Card.Root\n   *\n   * The root component that provides context and styling for the card.\n   * Must wrap all card parts (Header, Content) to coordinate their behavior.\n   * Accepts styling variants for padding, border, elevation, and background.\n   *\n   * @example\n   * ```tsx\n   * <Card.Root cardPadding=\"md\" borderStyle=\"outlined\" elevation=\"elevated\">\n   *   <Card.Header>Title</Card.Header>\n   *   <Card.Content>Content</Card.Content>\n   * </Card.Root>\n   * ```\n   */\n  Root: CardRoot,\n  /**\n   * # Card.Header\n   *\n   * The header section of the card, typically containing the card title\n   * or primary heading. Automatically positioned above the card content\n   * in a consistent layout.\n   *\n   * @example\n   * ```tsx\n   * <Card.Root>\n   *   <Card.Header>Card Title</Card.Header>\n   *   <Card.Content>Content here</Card.Content>\n   * </Card.Root>\n   * ```\n   */\n  Header: CardHeader,\n  /**\n   * # Card.Content\n   *\n   * The main content area of the card. Contains the primary information,\n   * body text, or interactive elements. Automatically positioned below\n   * the card header in a consistent layout.\n   *\n   * @example\n   * ```tsx\n   * <Card.Root>\n   *   <Card.Header>Title</Card.Header>\n   *   <Card.Content>\n   *     <Text>This is the main card content.</Text>\n   *   </Card.Content>\n   * </Card.Root>\n   * ```\n   */\n  Content: CardContent,\n};\n\nexport {\n  CardRoot as _CardRoot,\n  CardHeader as _CardHeader,\n  CardContent as _CardContent,\n};\n"],"names":["withProvider","withContext","createSlotRecipeContext","CardRoot","CardHeader","CardContent","CardContext","createContext","ref","children","props","recipe","useSlotRecipe","recipeProps","restRecipeProps","styleProps","functionalProps","extractStyleProps","headerNode","setHeader","useState","contentNode","setContent","contextValue","useMemo","jsx","jsxs","CardRootSlot","Stack","context","useContext","useEffect","slotElement","CardHeaderSlot","CardContentSlot","Card"],"mappings":";;;;;AAQA,MAAM,EAAE,cAAAA,GAAc,aAAAC,EAAA,IAAgB,gBAAAC,EAAwB;AAAA,EAC5D,KAAK;AACP,CAAC,GAMYC,IACX,gBAAAH,EAAgD,OAAO,MAAM,GAElDI,IACX,gBAAAH,EAAiD,OAAO,QAAQ,GAErDI,IACX,gBAAAJ,EAAkD,OAAO,SAAS,GCXvDK,IAAc,gBAAAC;AAAA,EACzB;AACF,GAOaJ,IAAW,CAAC,EAAE,KAAAK,GAAK,UAAAC,GAAU,GAAGC,QAAuB;AAElE,QAAMC,IAASC,EAAc,EAAE,KAAK,cAAc,GAC5C,CAACC,GAAaC,CAAe,IAAIH,EAAO,kBAAkBD,CAAK,GAG/D,CAACK,GAAYC,CAAe,IAAIC,EAAkBH,CAAe,GAEjE,CAACI,GAAYC,CAAS,IAAIC,EAAoB,IAAI,GAClD,CAACC,GAAaC,CAAU,IAAIF,EAAoB,IAAI,GAGpDG,IAAeC;AAAA,IACnB,OAAO;AAAA,MACL,WAAAL;AAAA,MACA,YAAAG;AAAA,IAAA;AAAA,IAEF,CAACH,GAAWG,CAAU;AAAA,EAAA;AAGxB,SACE,gBAAAG,EAACnB,EAAY,UAAZ,EAAqB,OAAOiB,GAC3B,UAAA,gBAAAG;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAAAnB;AAAA,MACC,GAAGK;AAAA,MACH,GAAGE;AAAA,MACH,GAAGC;AAAA,MAGJ,UAAA;AAAA,QAAA,gBAAAU,EAACE,GAAA,EAAM,WAAU,UAAS,KAAI,OAC3B,UAAA;AAAA,UAAAV;AAAA,UACAG;AAAA,QAAA,GACH;AAAA,QAGCZ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;AAEAN,EAAS,cAAc;ACnDhB,MAAMC,IAAa,CAAC,EAAE,UAAAK,GAAU,GAAGC,QAA6B;AACrE,QAAMmB,IAAUC,EAAWxB,CAAW,GAGhC,CAACS,GAAYC,CAAe,IAAIC,EAAkBP,CAAK;AAE7D,SAAAqB,EAAU,MAAM;AACd,QAAIF,GAAS;AACX,YAAMG,IACJ,gBAAAP,EAACQ,GAAA,EAAgB,GAAGlB,GAAa,GAAGC,GACjC,UAAAP,GACH;AAGF,aAAAoB,EAAQ,UAAUG,CAAW,GAGtB,MAAMH,EAAQ,UAAU,IAAI;AAAA,IACrC;AAAA,EACF,GAAG,CAACpB,GAAUM,GAAYC,GAAiBa,CAAO,CAAC,GAE5C;AACT;AACAzB,EAAW,cAAc;ACvBlB,MAAMC,IAAc,CAAC,EAAE,UAAAI,GAAU,GAAGC,QAA8B;AACvE,QAAMmB,IAAUC,EAAWxB,CAAW,GAGhC,CAACS,GAAYC,CAAe,IAAIC,EAAkBP,CAAK;AAE7D,SAAAqB,EAAU,MAAM;AACd,QAAIF,GAAS;AACX,YAAMG,IACJ,gBAAAP,EAACS,GAAA,EAAiB,GAAGnB,GAAa,GAAGC,GAClC,UAAAP,GACH;AAGF,aAAAoB,EAAQ,WAAWG,CAAW,GAGvB,MAAMH,EAAQ,WAAW,IAAI;AAAA,IACtC;AAAA,EACF,GAAG,CAACpB,GAAUM,GAAYC,GAAiBa,CAAO,CAAC,GAE5C;AACT;AAEAxB,EAAY,cAAc;AChBnB,MAAM8B,IAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgBlB,MAAMhC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgBN,QAAQC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAkBR,SAASC;AACX;"}