@televet/kibble-ui 5.2.0 → 5.3.1

package/dist/chunks/card.component-DegvL21w.js

@@ -0,0 +1,57 @@
+import { j as m } from "./jsx-runtime-C5mzlN2N.js";
+import { B as x } from "./index-9BerxEcw.js";
+const p = {
+  lg: 7,
+  md: 5,
+  sm: 3,
+  xs: 2
+}, f = ({
+  active: a = !1,
+  fullWidth: o = !0,
+  interactive: e = !1,
+  invalid: d = !1,
+  onClick: s,
+  onContrast: r = !1,
+  size: t = "md",
+  children: n,
+  ["data-testid"]: b = "kibble-card",
+  ...i
+}) => {
+  const c = {
+    base: `${e && a ? "transparent" : r ? "border.contrast" : "border"}`,
+    _invalid: `${r ? "border.danger.contrast" : "border.danger"}`
+  };
+  return /* @__PURE__ */ m.jsx(
+    x,
+    {
+      className: "Card",
+      "data-testid": b,
+      bg: r ? "background.contrast" : "background",
+      p: p[t],
+      border: "1px",
+      borderColor: c,
+      borderRadius: "lg",
+      ...d && { "data-invalid": "true" },
+      ...e && {
+        boxShadow: {
+          base: `${a ? r ? "active.contrast" : "active" : "none"}`,
+          ...!a && {
+            _hover: r ? "hover.contrast" : "hover"
+          }
+        },
+        cursor: "pointer",
+        transition: ".1s all ease-in-out"
+      },
+      ...o ? { w: "100%" } : { maxW: "max-content" },
+      onClick: (l) => {
+        s?.(l);
+      },
+      ...i,
+      children: n
+    }
+  );
+};
+export {
+  f as C
+};
+//# sourceMappingURL=card.component-DegvL21w.js.map

package/dist/chunks/card.component-DegvL21w.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.component-DegvL21w.js","sources":["../../src/components/Card/card.records.ts","../../src/components/Card/card.component.tsx"],"sourcesContent":["import { CardSize } from './card.types';\n\nexport const CardPaddingMap: Record<CardSize, number> = {\n  lg: 7,\n  md: 5,\n  sm: 3,\n  xs: 2,\n};\n","import React from 'react';\nimport { Box, BoxProps } from '@chakra-ui/react/box';\nimport { CardSize } from './card.types';\nimport { CardPaddingMap } from './card.records';\n\nexport interface BaseCardProps {\n  /**\n   * If `false`, the max width will be set to `max-content` and will not take up the full width of the parent.\n   * @default true\n   */\n  fullWidth?: boolean;\n  /**\n   * If `true`, the card will use a contrasting variant.\n   * @default false\n   */\n  onContrast?: boolean;\n  /**\n   * If `true`, the card will be styled with a red border. Visual only: the message and the screen\n   * reader announcement come from the controls inside the card.\n   * @default false\n   */\n  invalid?: boolean;\n  /**\n   * Size of the card. This mostly determines the amount of padding around the inside edge of the card.\n   * @default md\n   */\n  size?: CardSize;\n  /** Data test id for the card.\n   * @default kibble-card\n   */\n  'data-testid'?: string;\n}\n\nexport interface DefaultCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: never;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: false;\n}\n\nexport interface InteractiveCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: boolean;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: true;\n}\n\nexport type KCardProps = InteractiveCardProps | DefaultCardProps;\n\nexport type CardProps = KCardProps & BoxProps;\n\nexport const Card = ({\n  active = false,\n  fullWidth = true,\n  interactive = false,\n  invalid = false,\n  onClick,\n  onContrast = false,\n  size = 'md',\n  children,\n  ['data-testid']: dataTestId = 'kibble-card',\n  ...rest\n}: CardProps): React.JSX.Element => {\n  const borderColor = {\n    base: `${interactive && active ? 'transparent' : onContrast ? 'border.contrast' : 'border'}`,\n    _invalid: `${onContrast ? 'border.danger.contrast' : 'border.danger'}`,\n  };\n\n  return (\n    <Box\n      className=\"Card\"\n      data-testid={dataTestId}\n      bg={onContrast ? 'background.contrast' : 'background'}\n      p={CardPaddingMap[size]}\n      border=\"1px\"\n      borderColor={borderColor}\n      borderRadius=\"lg\"\n      {...(invalid && { 'data-invalid': 'true' })}\n      {...(interactive && {\n        boxShadow: {\n          base: `${active ? (onContrast ? 'active.contrast' : 'active') : 'none'}`,\n          ...(!active && {\n            _hover: onContrast ? 'hover.contrast' : 'hover',\n          }),\n        },\n        cursor: 'pointer',\n        transition: '.1s all ease-in-out',\n      })}\n      {...(!fullWidth ? { maxW: 'max-content' } : { w: '100%' })}\n      onClick={(e) => {\n        onClick?.(e);\n      }}\n      {...rest}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"names":["CardPaddingMap","Card","active","fullWidth","interactive","invalid","onClick","onContrast","size","children","dataTestId","rest","borderColor","jsx","Box","e"],"mappings":";;AAEO,MAAMA,IAA2C;AAAA,EACtD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GCwDaC,IAAO,CAAC;AAAA,EACnB,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,aAAAC,IAAc;AAAA,EACd,SAAAC,IAAU;AAAA,EACV,SAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,CAAC,gBAAgBC,IAAa;AAAA,EAC9B,GAAGC;AACL,MAAoC;AAClC,QAAMC,IAAc;AAAA,IAClB,MAAM,GAAGR,KAAeF,IAAS,gBAAgBK,IAAa,oBAAoB,QAAQ;AAAA,IAC1F,UAAU,GAAGA,IAAa,2BAA2B,eAAe;AAAA,EACtE;AAGE,SAAAM,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAaJ;AAAA,MACb,IAAIH,IAAa,wBAAwB;AAAA,MACzC,GAAGP,EAAeQ,CAAI;AAAA,MACtB,QAAO;AAAA,MACP,aAAAI;AAAA,MACA,cAAa;AAAA,MACZ,GAAIP,KAAW,EAAE,gBAAgB,OAAO;AAAA,MACxC,GAAID,KAAe;AAAA,QAClB,WAAW;AAAA,UACT,MAAM,GAAGF,IAAUK,IAAa,oBAAoB,WAAY,MAAM;AAAA,UACtE,GAAI,CAACL,KAAU;AAAA,YACb,QAAQK,IAAa,mBAAmB;AAAA,UAAA;AAAA,QAE5C;AAAA,QACA,QAAQ;AAAA,QACR,YAAY;AAAA,MACd;AAAA,MACC,GAAKJ,IAAsC,EAAE,GAAG,OAAO,IAAtC,EAAE,MAAM,cAAc;AAAA,MACxC,SAAS,CAACY,MAAM;AACd,QAAAT,IAAUS,CAAC;AAAA,MACb;AAAA,MACC,GAAGJ;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EACH;AAEJ;"}

package/dist/chunks/card.component-Z7HRGxC4.js

@@ -0,0 +1,2 @@
+"use strict";const u=require("./jsx-runtime-BjDatQAs.js"),x=require("./index-BQRnVsAg.js"),g={lg:7,md:5,sm:3,xs:2},m=({active:e=!1,fullWidth:d=!0,interactive:a=!1,invalid:s=!1,onClick:t,onContrast:r=!1,size:o="md",children:n,["data-testid"]:i="kibble-card",...c})=>{const b={base:`${a&&e?"transparent":r?"border.contrast":"border"}`,_invalid:`${r?"border.danger.contrast":"border.danger"}`};return u.jsxRuntimeExports.jsx(x.Box,{className:"Card","data-testid":i,bg:r?"background.contrast":"background",p:g[o],border:"1px",borderColor:b,borderRadius:"lg",...s&&{"data-invalid":"true"},...a&&{boxShadow:{base:`${e?r?"active.contrast":"active":"none"}`,...!e&&{_hover:r?"hover.contrast":"hover"}},cursor:"pointer",transition:".1s all ease-in-out"},...d?{w:"100%"}:{maxW:"max-content"},onClick:l=>{t?.(l)},...c,children:n})};exports.Card=m;
+//# sourceMappingURL=card.component-Z7HRGxC4.js.map

package/dist/chunks/card.component-Z7HRGxC4.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card.component-Z7HRGxC4.js","sources":["../../src/components/Card/card.records.ts","../../src/components/Card/card.component.tsx"],"sourcesContent":["import { CardSize } from './card.types';\n\nexport const CardPaddingMap: Record<CardSize, number> = {\n  lg: 7,\n  md: 5,\n  sm: 3,\n  xs: 2,\n};\n","import React from 'react';\nimport { Box, BoxProps } from '@chakra-ui/react/box';\nimport { CardSize } from './card.types';\nimport { CardPaddingMap } from './card.records';\n\nexport interface BaseCardProps {\n  /**\n   * If `false`, the max width will be set to `max-content` and will not take up the full width of the parent.\n   * @default true\n   */\n  fullWidth?: boolean;\n  /**\n   * If `true`, the card will use a contrasting variant.\n   * @default false\n   */\n  onContrast?: boolean;\n  /**\n   * If `true`, the card will be styled with a red border. Visual only: the message and the screen\n   * reader announcement come from the controls inside the card.\n   * @default false\n   */\n  invalid?: boolean;\n  /**\n   * Size of the card. This mostly determines the amount of padding around the inside edge of the card.\n   * @default md\n   */\n  size?: CardSize;\n  /** Data test id for the card.\n   * @default kibble-card\n   */\n  'data-testid'?: string;\n}\n\nexport interface DefaultCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: never;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: false;\n}\n\nexport interface InteractiveCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: boolean;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: true;\n}\n\nexport type KCardProps = InteractiveCardProps | DefaultCardProps;\n\nexport type CardProps = KCardProps & BoxProps;\n\nexport const Card = ({\n  active = false,\n  fullWidth = true,\n  interactive = false,\n  invalid = false,\n  onClick,\n  onContrast = false,\n  size = 'md',\n  children,\n  ['data-testid']: dataTestId = 'kibble-card',\n  ...rest\n}: CardProps): React.JSX.Element => {\n  const borderColor = {\n    base: `${interactive && active ? 'transparent' : onContrast ? 'border.contrast' : 'border'}`,\n    _invalid: `${onContrast ? 'border.danger.contrast' : 'border.danger'}`,\n  };\n\n  return (\n    <Box\n      className=\"Card\"\n      data-testid={dataTestId}\n      bg={onContrast ? 'background.contrast' : 'background'}\n      p={CardPaddingMap[size]}\n      border=\"1px\"\n      borderColor={borderColor}\n      borderRadius=\"lg\"\n      {...(invalid && { 'data-invalid': 'true' })}\n      {...(interactive && {\n        boxShadow: {\n          base: `${active ? (onContrast ? 'active.contrast' : 'active') : 'none'}`,\n          ...(!active && {\n            _hover: onContrast ? 'hover.contrast' : 'hover',\n          }),\n        },\n        cursor: 'pointer',\n        transition: '.1s all ease-in-out',\n      })}\n      {...(!fullWidth ? { maxW: 'max-content' } : { w: '100%' })}\n      onClick={(e) => {\n        onClick?.(e);\n      }}\n      {...rest}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"names":["CardPaddingMap","Card","active","fullWidth","interactive","invalid","onClick","onContrast","size","children","dataTestId","rest","borderColor","jsx","Box","e"],"mappings":"2FAEaA,EAA2C,CACtD,GAAI,EACJ,GAAI,EACJ,GAAI,EACJ,GAAI,CACN,ECwDaC,EAAO,CAAC,CACnB,OAAAC,EAAS,GACT,UAAAC,EAAY,GACZ,YAAAC,EAAc,GACd,QAAAC,EAAU,GACV,QAAAC,EACA,WAAAC,EAAa,GACb,KAAAC,EAAO,KACP,SAAAC,EACA,CAAC,eAAgBC,EAAa,cAC9B,GAAGC,CACL,IAAoC,CAClC,MAAMC,EAAc,CAClB,KAAM,GAAGR,GAAeF,EAAS,cAAgBK,EAAa,kBAAoB,QAAQ,GAC1F,SAAU,GAAGA,EAAa,yBAA2B,eAAe,EACtE,EAGE,OAAAM,EAAA,kBAAA,IAACC,EAAA,IAAA,CACC,UAAU,OACV,cAAaJ,EACb,GAAIH,EAAa,sBAAwB,aACzC,EAAGP,EAAeQ,CAAI,EACtB,OAAO,MACP,YAAAI,EACA,aAAa,KACZ,GAAIP,GAAW,CAAE,eAAgB,MAAO,EACxC,GAAID,GAAe,CAClB,UAAW,CACT,KAAM,GAAGF,EAAUK,EAAa,kBAAoB,SAAY,MAAM,GACtE,GAAI,CAACL,GAAU,CACb,OAAQK,EAAa,iBAAmB,OAAA,CAE5C,EACA,OAAQ,UACR,WAAY,qBACd,EACC,GAAKJ,EAAsC,CAAE,EAAG,MAAO,EAAtC,CAAE,KAAM,aAAc,EACxC,QAAUY,GAAM,CACdT,IAAUS,CAAC,CACb,EACC,GAAGJ,EAEH,SAAAF,CAAA,CACH,CAEJ"}

package/dist/chunks/{conversationCard.component-Dg3RtQE8.js → conversationCard.component-CjeOO2L3.js}

@@ -1,7 +1,7 @@
 import { j as t } from "./jsx-runtime-C5mzlN2N.js";
 import { useState as H } from "react";
 import { B as f } from "./index-9BerxEcw.js";
-import { C as S } from "./card.component-B1AznjWF.js";
+import { C as S } from "./card.component-DegvL21w.js";
 import { T as B } from "./timestamp.component-gXQy-j4t.js";
 import { N as W } from "./notificationCounter.component-kKVMY1AR.js";
 import { I as g } from "./icon.component-PV_nHBId.js";
@@ -328,4 +328,4 @@ const E = ({
 export {
   lt as C
 };
-//# sourceMappingURL=conversationCard.component-Dg3RtQE8.js.map
+//# sourceMappingURL=conversationCard.component-CjeOO2L3.js.map

package/dist/chunks/{conversationCard.component-Dg3RtQE8.js.map → conversationCard.component-CjeOO2L3.js.map}

@@ -1 +1 @@
-{"version":3,"file":"conversationCard.component-Dg3RtQE8.js","sources":["../../src/components/ConversationCard/components/ConversationCardAvatarGroup/conversationCardAvatarGroup.component.tsx","../../src/components/ConversationCard/components/ConversationCardHeader/conversationCardHeader.component.tsx","../../src/components/ConversationCard/components/ConversationCardButtons/conversationCardButtons.component.tsx","../../src/components/ConversationCard/components/ConversationCardTags/conversationCardTags.component.tsx","../../src/components/ConversationCard/components/ConversationCardFooter/conversationCardFooter.component.tsx","../../src/components/ConversationCard/components/ConversationCardContent/conversationCardContent.component.tsx","../../src/components/ConversationCard/conversationCard.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { Avatar } from 'components/Avatar/avatar.component';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\n\nexport interface ConversationCardAvatarGroupProps {\n  /** Avatars to display in the group. */\n  avatars: React.ReactNode[];\n  /** Maximum number of avatars to display.\n   * @default 1\n   */\n  max?: number;\n  /** Callback function to be called when the avatar group is clicked. */\n  onAvatarGroupClick?: (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;\n  /** Label for the tooltip. */\n  tooltipLabel?: string;\n  /** Data test id for the avatar group.\n   * @default kibble-conversation-card-avatar-group\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardAvatarGroup = ({\n  avatars,\n  max = 1,\n  onAvatarGroupClick,\n  tooltipLabel,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-avatar-group',\n}: ConversationCardAvatarGroupProps): React.JSX.Element => {\n  return (\n    <Tooltip label={tooltipLabel || ''} disabled={!tooltipLabel?.length}>\n      <Flex\n        className=\"ConversationCard__AvatarGroup\"\n        data-testid={dataTestId}\n        alignItems=\"flex-start\"\n        justifyContent=\"flex-start\"\n      >\n        {max && avatars.length > max ? (\n          <Avatar\n            onClick={(e): void => {\n              e.stopPropagation();\n              if (onAvatarGroupClick) {\n                onAvatarGroupClick(e);\n              }\n            }}\n            cursor=\"pointer\"\n            name={avatars.length.toString()}\n            showTooltip={false}\n          />\n        ) : (\n          <>{avatars.map((avatar) => avatar)}</>\n        )}\n      </Flex>\n    </Tooltip>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { HStack, VStack } from '@chakra-ui/react/stack';\nimport { Timestamp, TimestampProps } from 'components/Timestamp/timestamp.component';\nimport { NotificationCounter } from 'components/NotificationCounter/notificationCounter.component';\nimport { Icon } from 'components/Icon/icon.component';\nimport { Heading } from 'components/Heading/heading.component';\nimport { Text } from 'components/Text/text.component';\nimport {\n  ConversationCardAvatarGroup,\n  ConversationCardAvatarGroupProps,\n} from '../ConversationCardAvatarGroup/conversationCardAvatarGroup.component';\n\nexport interface ConversationCardHeaderProps {\n  /** Props for the avatar group. */\n  avatarGroupProps?: ConversationCardAvatarGroupProps;\n  /** If true, the notification indicator will be displayed. */\n  showNotificationIndicator?: boolean;\n  /** Determines if the card is pinned. */\n  isCardPinned?: boolean;\n  /** Determines if the card is being hovered. */\n  isHoveringCard?: boolean;\n  /** Subtitle of the card. */\n  subtitle?: string;\n  /** Props for the timestamp. */\n  timestampProps: TimestampProps;\n  /** Title of the card. */\n  title: string;\n  /** Data test id for the header.\n   * @default kibble-conversation-card-header\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardHeader = ({\n  avatarGroupProps,\n  timestampProps,\n  isHoveringCard,\n  isCardPinned,\n  title,\n  showNotificationIndicator,\n  subtitle,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-header',\n}: ConversationCardHeaderProps): React.JSX.Element => {\n  return (\n    <HStack className=\"ConversationCard__Header\" data-testid={dataTestId} justify=\"space-between\" align=\"flex-start\">\n      <HStack className=\"ConversationCard__Header--Left\" data-testid={`${dataTestId}-left`} cursor=\"pointer\">\n        {avatarGroupProps && (\n          <ConversationCardAvatarGroup {...avatarGroupProps} tooltipLabel={avatarGroupProps?.tooltipLabel || title} />\n        )}\n        <VStack\n          className=\"ConversationCard__HeaderText\"\n          data-testid={`${dataTestId}-text`}\n          justify=\"center\"\n          align=\"left\"\n          gap=\"0\"\n        >\n          <Heading\n            className=\"ConversationCard__HeaderText--Title\"\n            data-testid={`${dataTestId}-title`}\n            size=\"sm\"\n            truncated\n          >\n            {title}\n          </Heading>\n          {subtitle && (\n            <Text\n              className=\"ConversationCard__HeaderText--Subtitle\"\n              data-testid={`${dataTestId}-subtitle`}\n              size=\"sm\"\n              variant=\"subtle\"\n              truncated\n            >\n              {subtitle}\n            </Text>\n          )}\n        </VStack>\n      </HStack>\n      <HStack\n        className=\"ConversationCard__Header--Right\"\n        data-testid={`${dataTestId}-right`}\n        visibility={isHoveringCard ? 'hidden' : 'visible'}\n        align=\"center\"\n        gap={1}\n      >\n        <Timestamp {...timestampProps} />\n        {showNotificationIndicator && (\n          <Box\n            as=\"span\"\n            className=\"ConversationCard__HeaderNotificationCounter\"\n            data-testid={`${dataTestId}-unread-indicator`}\n          >\n            <NotificationCounter size=\"xs\" />\n          </Box>\n        )}\n        {isCardPinned && (\n          <Flex data-testid={`${dataTestId}-pinned-icon`}>\n            <Icon size=\"md\" variant=\"info\" name=\"pin\" />\n          </Flex>\n        )}\n      </HStack>\n    </HStack>\n  );\n};\n","import React from 'react';\nimport { HStack } from '@chakra-ui/react/stack';\nimport { Button } from 'components/Button/button.component';\nimport { Icon } from 'components/Icon/icon.component';\nimport { Menu, MenuProps, MenuItemProps } from 'components/Menu';\n\nexport interface ConversationCardOverlayProps {\n  /** Determines if the conversation is open in an overlay. */\n  isOpenInOverlay?: boolean;\n  /** Callback function to be called when the conversation is opened in an overlay. */\n  onOpenInOverlay: () => void;\n  /** Data test id for the overlay button. */\n  'data-testid'?: string;\n}\n\nexport interface ConversationCardPinProps {\n  /** Determines if the conversation is pinned. */\n  isPinned?: boolean;\n  /** Callback function to called when the conversation is pinned. */\n  onTogglePin: (isPinned: boolean) => void;\n  /** Data test id for the pin button. */\n  'data-testid'?: string;\n}\n\nexport interface ConversationCardButtonsProps {\n  /** Props for the overlay button. */\n  overlayProps?: ConversationCardOverlayProps;\n  /** Props for the pin button. */\n  pinProps?: ConversationCardPinProps;\n  /** Props for the header Menu. */\n  headerMenuProps?: MenuProps;\n  /** Data test id for the buttons.\n   * @default kibble-conversation-card-buttons\n   */\n  'data-testid'?: string;\n}\n\ninterface ConversationCardButtonsComponentProps extends ConversationCardButtonsProps {\n  /** Determines if the conversation is being hovered.\n   * @internal\n   */\n  isHovering: boolean;\n  /** Callback function to set the hover state.\n   * @internal\n   */\n  setIsHovering: (isHovering: boolean) => void;\n}\n\nexport const ConversationCardButtons = ({\n  overlayProps,\n  pinProps,\n  headerMenuProps,\n  isHovering,\n  setIsHovering,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-buttons',\n}: ConversationCardButtonsComponentProps): React.JSX.Element => {\n  const { isOpenInOverlay, onOpenInOverlay, ['data-testid']: overlayDataTestId } = overlayProps || {};\n  const { isPinned, onTogglePin, ['data-testid']: pinDataTestId } = pinProps || {};\n  const { listProps, ['data-testid']: headerMenuDataTestId } = headerMenuProps || {};\n  const pinIconName = isPinned ? 'pinCancel' : 'pin';\n\n  return (\n    <HStack className=\"ConversationCard__Menu\" data-testid={dataTestId} gap={1}>\n      {overlayProps && (\n        <Button\n          className=\"ConversationCard__OverlayButton\"\n          data-testid={overlayDataTestId ? overlayDataTestId : `${dataTestId}-overlay-button`}\n          variant=\"secondarySubtle\"\n          borderRadius=\"sm\"\n          {...(isOpenInOverlay && { active: true })}\n          onClick={(): void => {\n            if (onOpenInOverlay) {\n              onOpenInOverlay();\n            }\n\n            if (isHovering) {\n              setIsHovering(false);\n            }\n          }}\n          iconName=\"popup\"\n          size=\"sm\"\n        />\n      )}\n      {pinProps && (\n        <Button\n          className=\"ConversationCard__PinButton\"\n          data-testid={pinDataTestId ? pinDataTestId : `${dataTestId}-pin-button`}\n          variant={isPinned ? 'secondarySubtleDestructive' : 'secondarySubtle'}\n          borderRadius=\"sm\"\n          onClick={(): void => {\n            if (onTogglePin) {\n              onTogglePin(!isPinned);\n            }\n\n            if (isHovering) {\n              setIsHovering(false);\n            }\n          }}\n          iconName={pinIconName}\n          size=\"sm\"\n        />\n      )}\n      {headerMenuProps && (\n        <Menu\n          buttonProps={\n            headerMenuProps.buttonProps || {\n              variant: 'secondarySubtle',\n              size: 'sm',\n              borderRadius: 'sm',\n              iconName: 'dotsVertical',\n              hideCaret: true,\n              padding: 0,\n            }\n          }\n          closeOnSelect={false}\n          lazyMount\n          data-testid={headerMenuDataTestId ? headerMenuDataTestId : `${dataTestId}-menu`}\n          {...headerMenuProps}\n          listProps={{\n            ...listProps,\n            menuItems: [\n              ...(pinProps\n                ? [\n                    {\n                      label: `${isPinned ? 'Unpin' : 'Pin'} Conversation`,\n                      value: 'PinConversation',\n                      variant: isPinned ? 'danger' : 'default',\n                      leftElement: <Icon size=\"md\" variant={isPinned ? 'danger' : 'default'} name={pinIconName} />,\n                      onSelect: (): void => {\n                        if (onTogglePin) {\n                          onTogglePin(!isPinned);\n                        }\n                      },\n                    } as MenuItemProps,\n                  ]\n                : []),\n              ...(listProps?.menuItems || []),\n            ],\n          }}\n        />\n      )}\n    </HStack>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Wrap, WrapItem } from '@chakra-ui/react/wrap';\nimport { Tag, TagProps } from 'components/Tag/tag.component';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\n\nexport type ConversationCardTag = TagProps & {\n  /** Content to display in the tooltip. */\n  tooltipContent?: string;\n};\n\nexport interface ConversationCardTagsProps {\n  /** Tags to display in the ConversationCard. */\n  tags: ConversationCardTag[];\n  /** Data test id for the tags.\n   * @default kibble-conversation-card-tags\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardTags = ({\n  tags,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-tags',\n}: ConversationCardTagsProps): React.JSX.Element => {\n  return (\n    <Box className=\"ConversationCard__Tags\" mt={3} data-testid={dataTestId}>\n      <Wrap gap={2}>\n        {tags.map((tag) => {\n          const { tooltipContent, ...rest } = tag;\n          let tagElement = <Tag {...rest} size=\"sm\" textTransform=\"capitalize\" />;\n\n          if (tooltipContent) {\n            tagElement = (\n              <Tooltip label={tooltipContent} placement=\"top\">\n                <Box>{tagElement}</Box>\n              </Tooltip>\n            );\n          }\n\n          return <WrapItem key={tag.label}>{tagElement}</WrapItem>;\n        })}\n      </Wrap>\n    </Box>\n  );\n};\n","import React from 'react';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { Icon, IconProps } from 'components/Icon/icon.component';\nimport { Text, TextProps } from 'components/Text/text.component';\n\nexport interface ConversationCardFooterProps {\n  /** Props for the Icon component. */\n  iconProps?: IconProps;\n  /** Content of the footer. */\n  content: React.ReactNode;\n  /** Props to customize the content styling. */\n  contentProps?: Omit<TextProps, 'children'>;\n  /** Data test id for the footer.\n   * @default kibble-conversation-card-footer\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardFooter = ({\n  iconProps,\n  content,\n  contentProps,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-footer',\n}: ConversationCardFooterProps): React.JSX.Element => {\n  const _content =\n    typeof content === 'string' ? (\n      <Text\n        className=\"ConversationCard__FooterMessage\"\n        data-testid={`${dataTestId}-message`}\n        size=\"sm\"\n        variant=\"subtle\"\n        {...contentProps}\n        {...(iconProps && { ml: 1 })}\n      >\n        {content}\n      </Text>\n    ) : (\n      content\n    );\n  return (\n    <Flex className=\"ConversationCard__Footer\" data-testid={dataTestId} mt={3} alignItems=\"center\">\n      {iconProps && <Icon size=\"sm\" variant=\"subtle\" {...iconProps} />}\n      {_content}\n    </Flex>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { HStack } from '@chakra-ui/react/stack';\nimport { Text, TextProps } from 'components/Text/text.component';\n\nexport interface ConversationCardContentProps {\n  /** Content of the card. */\n  content?: React.ReactNode;\n  /** Props to customize the content styling. */\n  contentProps?: Omit<TextProps, 'children'>;\n  /** Optional Menu for the card. */\n  contentMenu?: React.ReactNode;\n  /** Data test id for the content.\n   * @default kibble-conversation-card-content\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardContent = ({\n  contentMenu,\n  content,\n  contentProps,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-content',\n}: ConversationCardContentProps): React.JSX.Element => {\n  const _content =\n    typeof content === 'string' ? (\n      <Text\n        className=\"ConversationCard__Content\"\n        data-testid={`${dataTestId}-content`}\n        truncated\n        size=\"sm\"\n        {...contentProps}\n      >\n        {content}\n      </Text>\n    ) : (\n      content\n    );\n\n  return (\n    <HStack\n      className=\"ConversationCard__ContentContainer\"\n      data-testid={`${dataTestId}-container`}\n      mt={3}\n      justifyContent=\"space-between\"\n      alignItems=\"center\"\n    >\n      {_content}\n      {contentMenu && (\n        <Box className=\"ConversationCard__ContentMenu\" data-testid={`${dataTestId}-menu`} ml=\"auto\">\n          {contentMenu}\n        </Box>\n      )}\n    </HStack>\n  );\n};\n","import React, { useState } from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Card } from 'components/Card/card.component';\nimport { MenuProps } from 'components/Menu/menu.component';\nimport {\n  ConversationCardHeader,\n  ConversationCardHeaderProps,\n} from './components/ConversationCardHeader/conversationCardHeader.component';\nimport {\n  ConversationCardButtons,\n  ConversationCardOverlayProps,\n  ConversationCardPinProps,\n} from './components/ConversationCardButtons/conversationCardButtons.component';\nimport {\n  ConversationCardTag,\n  ConversationCardTags,\n} from './components/ConversationCardTags/conversationCardTags.component';\nimport {\n  ConversationCardFooter,\n  ConversationCardFooterProps,\n} from './components/ConversationCardFooter/conversationCardFooter.component';\nimport {\n  ConversationCardContent,\n  ConversationCardContentProps,\n} from './components/ConversationCardContent/conversationCardContent.component';\nimport { ConversationCardAvatarGroupProps } from './components/ConversationCardAvatarGroup/conversationCardAvatarGroup.component';\n\nexport interface ConversationCardProps extends ConversationCardContentProps {\n  /**\n   * Used to enable hover actions on the ConversationCard.\n   * @default true\n   */\n  allowHoverActions?: boolean;\n  /** Props for the `AvatarGroup` component. */\n  avatarGroupProps?: ConversationCardAvatarGroupProps;\n  /** Props for the ConversationCard footer. */\n  footerProps?: ConversationCardFooterProps;\n  /** Props for the Menu component. See the `Menu` for more details. This component provides a default menu button if none is provided. If menuProps and pinProps are passed together, the component automatically adds a menuItem to control the pinned state. */\n  headerMenuProps?: MenuProps;\n  /** Props for the ConversationCard header. */\n  headerProps: ConversationCardHeaderProps;\n  /**\n   * Used to set the active state of the ConversationCard.\n   * @default false\n   */\n  active?: boolean;\n  /** Callback function for clicking the ConversationCard. */\n  onClick?: () => void;\n  /** Props to show and configure the conversation overlay button. If not passed, the overlay button won't be shown. */\n  overlayProps?: ConversationCardOverlayProps;\n  /** Props for the pin functionality. If not passed, pin functionality won't be shown. */\n  pinProps?: ConversationCardPinProps;\n  /**\n   * Used to preserve the position of the ConversationCard in a list with infinite scrolling.\n   * @default false\n   */\n  shouldPreservePosition?: boolean;\n  /**\n   * Used to show the unread messages indicator.\n   * @default false\n   */\n  showNotificationIndicator?: boolean;\n  /** The tags to be displayed in the ConversationCard. See the `Tag` for more information. Additionally, you can pass in a tooltipContent to customize what is shown in the tooltip. */\n  tags?: ConversationCardTag[];\n  /** Data test id for the conversation card.\n   * @default kibble-conversation-card\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCard = ({\n  allowHoverActions = true,\n  avatarGroupProps,\n  content,\n  contentProps,\n  contentMenu,\n  footerProps,\n  headerMenuProps,\n  headerProps,\n  active,\n  onClick,\n  overlayProps,\n  pinProps,\n  shouldPreservePosition = false,\n  showNotificationIndicator,\n  tags,\n  ['data-testid']: dataTestId = 'kibble-conversation-card',\n}: ConversationCardProps): React.JSX.Element => {\n  const { isPinned } = pinProps || {};\n  const [isHovering, setIsHovering] = useState(false);\n\n  return (\n    <Card\n      className=\"ConversationCard\"\n      id=\"conversation-card-item\"\n      data-testid={dataTestId}\n      interactive\n      active={active}\n      size=\"sm\"\n      fullWidth\n      onClick={(): void => {\n        if (onClick) {\n          onClick();\n        }\n      }}\n      bg={showNotificationIndicator || active || isHovering ? 'background.default' : 'background.subtle'}\n      onMouseEnter={(): void => {\n        if (allowHoverActions) {\n          setIsHovering(true);\n        }\n      }}\n      onMouseLeave={(): void => setIsHovering(false)}\n      pos=\"relative\"\n      css={{ overflowAnchor: shouldPreservePosition ? 'auto' : 'none' }}\n    >\n      {isHovering && (\n        <Box\n          className=\"ConversationCard__Button--Container\"\n          data-testid={`${dataTestId}-button-container`}\n          pos=\"absolute\"\n          top={2}\n          zIndex=\"banner\"\n          right={2}\n          bg=\"background\"\n          borderRadius=\"md\"\n          onClick={(e): void => e.stopPropagation()}\n        >\n          <ConversationCardButtons\n            overlayProps={overlayProps}\n            pinProps={pinProps}\n            headerMenuProps={headerMenuProps}\n            isHovering={isHovering}\n            setIsHovering={setIsHovering}\n          />\n        </Box>\n      )}\n      <ConversationCardHeader\n        avatarGroupProps={avatarGroupProps}\n        isHoveringCard={isHovering}\n        isCardPinned={isPinned}\n        showNotificationIndicator={showNotificationIndicator}\n        {...headerProps}\n      />\n      <ConversationCardContent content={content} contentProps={contentProps} contentMenu={contentMenu} />\n      {!!tags?.length && <ConversationCardTags tags={tags} />}\n      {footerProps && <ConversationCardFooter {...footerProps} />}\n    </Card>\n  );\n};\n"],"names":["ConversationCardAvatarGroup","avatars","max","onAvatarGroupClick","tooltipLabel","dataTestId","jsx","Tooltip","Flex","Avatar","e","Fragment","avatar","ConversationCardHeader","avatarGroupProps","timestampProps","isHoveringCard","isCardPinned","title","showNotificationIndicator","subtitle","jsxs","HStack","VStack","Heading","Text","Timestamp","Box","NotificationCounter","Icon","ConversationCardButtons","overlayProps","pinProps","headerMenuProps","isHovering","setIsHovering","isOpenInOverlay","onOpenInOverlay","overlayDataTestId","isPinned","onTogglePin","pinDataTestId","listProps","headerMenuDataTestId","pinIconName","Button","Menu","ConversationCardTags","tags","Wrap","tag","tooltipContent","rest","tagElement","Tag","WrapItem","ConversationCardFooter","iconProps","content","contentProps","_content","ConversationCardContent","contentMenu","ConversationCard","allowHoverActions","footerProps","headerProps","active","onClick","shouldPreservePosition","useState","Card"],"mappings":"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"}
+{"version":3,"file":"conversationCard.component-CjeOO2L3.js","sources":["../../src/components/ConversationCard/components/ConversationCardAvatarGroup/conversationCardAvatarGroup.component.tsx","../../src/components/ConversationCard/components/ConversationCardHeader/conversationCardHeader.component.tsx","../../src/components/ConversationCard/components/ConversationCardButtons/conversationCardButtons.component.tsx","../../src/components/ConversationCard/components/ConversationCardTags/conversationCardTags.component.tsx","../../src/components/ConversationCard/components/ConversationCardFooter/conversationCardFooter.component.tsx","../../src/components/ConversationCard/components/ConversationCardContent/conversationCardContent.component.tsx","../../src/components/ConversationCard/conversationCard.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { Avatar } from 'components/Avatar/avatar.component';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\n\nexport interface ConversationCardAvatarGroupProps {\n  /** Avatars to display in the group. */\n  avatars: React.ReactNode[];\n  /** Maximum number of avatars to display.\n   * @default 1\n   */\n  max?: number;\n  /** Callback function to be called when the avatar group is clicked. */\n  onAvatarGroupClick?: (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;\n  /** Label for the tooltip. */\n  tooltipLabel?: string;\n  /** Data test id for the avatar group.\n   * @default kibble-conversation-card-avatar-group\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardAvatarGroup = ({\n  avatars,\n  max = 1,\n  onAvatarGroupClick,\n  tooltipLabel,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-avatar-group',\n}: ConversationCardAvatarGroupProps): React.JSX.Element => {\n  return (\n    <Tooltip label={tooltipLabel || ''} disabled={!tooltipLabel?.length}>\n      <Flex\n        className=\"ConversationCard__AvatarGroup\"\n        data-testid={dataTestId}\n        alignItems=\"flex-start\"\n        justifyContent=\"flex-start\"\n      >\n        {max && avatars.length > max ? (\n          <Avatar\n            onClick={(e): void => {\n              e.stopPropagation();\n              if (onAvatarGroupClick) {\n                onAvatarGroupClick(e);\n              }\n            }}\n            cursor=\"pointer\"\n            name={avatars.length.toString()}\n            showTooltip={false}\n          />\n        ) : (\n          <>{avatars.map((avatar) => avatar)}</>\n        )}\n      </Flex>\n    </Tooltip>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { HStack, VStack } from '@chakra-ui/react/stack';\nimport { Timestamp, TimestampProps } from 'components/Timestamp/timestamp.component';\nimport { NotificationCounter } from 'components/NotificationCounter/notificationCounter.component';\nimport { Icon } from 'components/Icon/icon.component';\nimport { Heading } from 'components/Heading/heading.component';\nimport { Text } from 'components/Text/text.component';\nimport {\n  ConversationCardAvatarGroup,\n  ConversationCardAvatarGroupProps,\n} from '../ConversationCardAvatarGroup/conversationCardAvatarGroup.component';\n\nexport interface ConversationCardHeaderProps {\n  /** Props for the avatar group. */\n  avatarGroupProps?: ConversationCardAvatarGroupProps;\n  /** If true, the notification indicator will be displayed. */\n  showNotificationIndicator?: boolean;\n  /** Determines if the card is pinned. */\n  isCardPinned?: boolean;\n  /** Determines if the card is being hovered. */\n  isHoveringCard?: boolean;\n  /** Subtitle of the card. */\n  subtitle?: string;\n  /** Props for the timestamp. */\n  timestampProps: TimestampProps;\n  /** Title of the card. */\n  title: string;\n  /** Data test id for the header.\n   * @default kibble-conversation-card-header\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardHeader = ({\n  avatarGroupProps,\n  timestampProps,\n  isHoveringCard,\n  isCardPinned,\n  title,\n  showNotificationIndicator,\n  subtitle,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-header',\n}: ConversationCardHeaderProps): React.JSX.Element => {\n  return (\n    <HStack className=\"ConversationCard__Header\" data-testid={dataTestId} justify=\"space-between\" align=\"flex-start\">\n      <HStack className=\"ConversationCard__Header--Left\" data-testid={`${dataTestId}-left`} cursor=\"pointer\">\n        {avatarGroupProps && (\n          <ConversationCardAvatarGroup {...avatarGroupProps} tooltipLabel={avatarGroupProps?.tooltipLabel || title} />\n        )}\n        <VStack\n          className=\"ConversationCard__HeaderText\"\n          data-testid={`${dataTestId}-text`}\n          justify=\"center\"\n          align=\"left\"\n          gap=\"0\"\n        >\n          <Heading\n            className=\"ConversationCard__HeaderText--Title\"\n            data-testid={`${dataTestId}-title`}\n            size=\"sm\"\n            truncated\n          >\n            {title}\n          </Heading>\n          {subtitle && (\n            <Text\n              className=\"ConversationCard__HeaderText--Subtitle\"\n              data-testid={`${dataTestId}-subtitle`}\n              size=\"sm\"\n              variant=\"subtle\"\n              truncated\n            >\n              {subtitle}\n            </Text>\n          )}\n        </VStack>\n      </HStack>\n      <HStack\n        className=\"ConversationCard__Header--Right\"\n        data-testid={`${dataTestId}-right`}\n        visibility={isHoveringCard ? 'hidden' : 'visible'}\n        align=\"center\"\n        gap={1}\n      >\n        <Timestamp {...timestampProps} />\n        {showNotificationIndicator && (\n          <Box\n            as=\"span\"\n            className=\"ConversationCard__HeaderNotificationCounter\"\n            data-testid={`${dataTestId}-unread-indicator`}\n          >\n            <NotificationCounter size=\"xs\" />\n          </Box>\n        )}\n        {isCardPinned && (\n          <Flex data-testid={`${dataTestId}-pinned-icon`}>\n            <Icon size=\"md\" variant=\"info\" name=\"pin\" />\n          </Flex>\n        )}\n      </HStack>\n    </HStack>\n  );\n};\n","import React from 'react';\nimport { HStack } from '@chakra-ui/react/stack';\nimport { Button } from 'components/Button/button.component';\nimport { Icon } from 'components/Icon/icon.component';\nimport { Menu, MenuProps, MenuItemProps } from 'components/Menu';\n\nexport interface ConversationCardOverlayProps {\n  /** Determines if the conversation is open in an overlay. */\n  isOpenInOverlay?: boolean;\n  /** Callback function to be called when the conversation is opened in an overlay. */\n  onOpenInOverlay: () => void;\n  /** Data test id for the overlay button. */\n  'data-testid'?: string;\n}\n\nexport interface ConversationCardPinProps {\n  /** Determines if the conversation is pinned. */\n  isPinned?: boolean;\n  /** Callback function to called when the conversation is pinned. */\n  onTogglePin: (isPinned: boolean) => void;\n  /** Data test id for the pin button. */\n  'data-testid'?: string;\n}\n\nexport interface ConversationCardButtonsProps {\n  /** Props for the overlay button. */\n  overlayProps?: ConversationCardOverlayProps;\n  /** Props for the pin button. */\n  pinProps?: ConversationCardPinProps;\n  /** Props for the header Menu. */\n  headerMenuProps?: MenuProps;\n  /** Data test id for the buttons.\n   * @default kibble-conversation-card-buttons\n   */\n  'data-testid'?: string;\n}\n\ninterface ConversationCardButtonsComponentProps extends ConversationCardButtonsProps {\n  /** Determines if the conversation is being hovered.\n   * @internal\n   */\n  isHovering: boolean;\n  /** Callback function to set the hover state.\n   * @internal\n   */\n  setIsHovering: (isHovering: boolean) => void;\n}\n\nexport const ConversationCardButtons = ({\n  overlayProps,\n  pinProps,\n  headerMenuProps,\n  isHovering,\n  setIsHovering,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-buttons',\n}: ConversationCardButtonsComponentProps): React.JSX.Element => {\n  const { isOpenInOverlay, onOpenInOverlay, ['data-testid']: overlayDataTestId } = overlayProps || {};\n  const { isPinned, onTogglePin, ['data-testid']: pinDataTestId } = pinProps || {};\n  const { listProps, ['data-testid']: headerMenuDataTestId } = headerMenuProps || {};\n  const pinIconName = isPinned ? 'pinCancel' : 'pin';\n\n  return (\n    <HStack className=\"ConversationCard__Menu\" data-testid={dataTestId} gap={1}>\n      {overlayProps && (\n        <Button\n          className=\"ConversationCard__OverlayButton\"\n          data-testid={overlayDataTestId ? overlayDataTestId : `${dataTestId}-overlay-button`}\n          variant=\"secondarySubtle\"\n          borderRadius=\"sm\"\n          {...(isOpenInOverlay && { active: true })}\n          onClick={(): void => {\n            if (onOpenInOverlay) {\n              onOpenInOverlay();\n            }\n\n            if (isHovering) {\n              setIsHovering(false);\n            }\n          }}\n          iconName=\"popup\"\n          size=\"sm\"\n        />\n      )}\n      {pinProps && (\n        <Button\n          className=\"ConversationCard__PinButton\"\n          data-testid={pinDataTestId ? pinDataTestId : `${dataTestId}-pin-button`}\n          variant={isPinned ? 'secondarySubtleDestructive' : 'secondarySubtle'}\n          borderRadius=\"sm\"\n          onClick={(): void => {\n            if (onTogglePin) {\n              onTogglePin(!isPinned);\n            }\n\n            if (isHovering) {\n              setIsHovering(false);\n            }\n          }}\n          iconName={pinIconName}\n          size=\"sm\"\n        />\n      )}\n      {headerMenuProps && (\n        <Menu\n          buttonProps={\n            headerMenuProps.buttonProps || {\n              variant: 'secondarySubtle',\n              size: 'sm',\n              borderRadius: 'sm',\n              iconName: 'dotsVertical',\n              hideCaret: true,\n              padding: 0,\n            }\n          }\n          closeOnSelect={false}\n          lazyMount\n          data-testid={headerMenuDataTestId ? headerMenuDataTestId : `${dataTestId}-menu`}\n          {...headerMenuProps}\n          listProps={{\n            ...listProps,\n            menuItems: [\n              ...(pinProps\n                ? [\n                    {\n                      label: `${isPinned ? 'Unpin' : 'Pin'} Conversation`,\n                      value: 'PinConversation',\n                      variant: isPinned ? 'danger' : 'default',\n                      leftElement: <Icon size=\"md\" variant={isPinned ? 'danger' : 'default'} name={pinIconName} />,\n                      onSelect: (): void => {\n                        if (onTogglePin) {\n                          onTogglePin(!isPinned);\n                        }\n                      },\n                    } as MenuItemProps,\n                  ]\n                : []),\n              ...(listProps?.menuItems || []),\n            ],\n          }}\n        />\n      )}\n    </HStack>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Wrap, WrapItem } from '@chakra-ui/react/wrap';\nimport { Tag, TagProps } from 'components/Tag/tag.component';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\n\nexport type ConversationCardTag = TagProps & {\n  /** Content to display in the tooltip. */\n  tooltipContent?: string;\n};\n\nexport interface ConversationCardTagsProps {\n  /** Tags to display in the ConversationCard. */\n  tags: ConversationCardTag[];\n  /** Data test id for the tags.\n   * @default kibble-conversation-card-tags\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardTags = ({\n  tags,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-tags',\n}: ConversationCardTagsProps): React.JSX.Element => {\n  return (\n    <Box className=\"ConversationCard__Tags\" mt={3} data-testid={dataTestId}>\n      <Wrap gap={2}>\n        {tags.map((tag) => {\n          const { tooltipContent, ...rest } = tag;\n          let tagElement = <Tag {...rest} size=\"sm\" textTransform=\"capitalize\" />;\n\n          if (tooltipContent) {\n            tagElement = (\n              <Tooltip label={tooltipContent} placement=\"top\">\n                <Box>{tagElement}</Box>\n              </Tooltip>\n            );\n          }\n\n          return <WrapItem key={tag.label}>{tagElement}</WrapItem>;\n        })}\n      </Wrap>\n    </Box>\n  );\n};\n","import React from 'react';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { Icon, IconProps } from 'components/Icon/icon.component';\nimport { Text, TextProps } from 'components/Text/text.component';\n\nexport interface ConversationCardFooterProps {\n  /** Props for the Icon component. */\n  iconProps?: IconProps;\n  /** Content of the footer. */\n  content: React.ReactNode;\n  /** Props to customize the content styling. */\n  contentProps?: Omit<TextProps, 'children'>;\n  /** Data test id for the footer.\n   * @default kibble-conversation-card-footer\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardFooter = ({\n  iconProps,\n  content,\n  contentProps,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-footer',\n}: ConversationCardFooterProps): React.JSX.Element => {\n  const _content =\n    typeof content === 'string' ? (\n      <Text\n        className=\"ConversationCard__FooterMessage\"\n        data-testid={`${dataTestId}-message`}\n        size=\"sm\"\n        variant=\"subtle\"\n        {...contentProps}\n        {...(iconProps && { ml: 1 })}\n      >\n        {content}\n      </Text>\n    ) : (\n      content\n    );\n  return (\n    <Flex className=\"ConversationCard__Footer\" data-testid={dataTestId} mt={3} alignItems=\"center\">\n      {iconProps && <Icon size=\"sm\" variant=\"subtle\" {...iconProps} />}\n      {_content}\n    </Flex>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { HStack } from '@chakra-ui/react/stack';\nimport { Text, TextProps } from 'components/Text/text.component';\n\nexport interface ConversationCardContentProps {\n  /** Content of the card. */\n  content?: React.ReactNode;\n  /** Props to customize the content styling. */\n  contentProps?: Omit<TextProps, 'children'>;\n  /** Optional Menu for the card. */\n  contentMenu?: React.ReactNode;\n  /** Data test id for the content.\n   * @default kibble-conversation-card-content\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardContent = ({\n  contentMenu,\n  content,\n  contentProps,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-content',\n}: ConversationCardContentProps): React.JSX.Element => {\n  const _content =\n    typeof content === 'string' ? (\n      <Text\n        className=\"ConversationCard__Content\"\n        data-testid={`${dataTestId}-content`}\n        truncated\n        size=\"sm\"\n        {...contentProps}\n      >\n        {content}\n      </Text>\n    ) : (\n      content\n    );\n\n  return (\n    <HStack\n      className=\"ConversationCard__ContentContainer\"\n      data-testid={`${dataTestId}-container`}\n      mt={3}\n      justifyContent=\"space-between\"\n      alignItems=\"center\"\n    >\n      {_content}\n      {contentMenu && (\n        <Box className=\"ConversationCard__ContentMenu\" data-testid={`${dataTestId}-menu`} ml=\"auto\">\n          {contentMenu}\n        </Box>\n      )}\n    </HStack>\n  );\n};\n","import React, { useState } from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Card } from 'components/Card/card.component';\nimport { MenuProps } from 'components/Menu/menu.component';\nimport {\n  ConversationCardHeader,\n  ConversationCardHeaderProps,\n} from './components/ConversationCardHeader/conversationCardHeader.component';\nimport {\n  ConversationCardButtons,\n  ConversationCardOverlayProps,\n  ConversationCardPinProps,\n} from './components/ConversationCardButtons/conversationCardButtons.component';\nimport {\n  ConversationCardTag,\n  ConversationCardTags,\n} from './components/ConversationCardTags/conversationCardTags.component';\nimport {\n  ConversationCardFooter,\n  ConversationCardFooterProps,\n} from './components/ConversationCardFooter/conversationCardFooter.component';\nimport {\n  ConversationCardContent,\n  ConversationCardContentProps,\n} from './components/ConversationCardContent/conversationCardContent.component';\nimport { ConversationCardAvatarGroupProps } from './components/ConversationCardAvatarGroup/conversationCardAvatarGroup.component';\n\nexport interface ConversationCardProps extends ConversationCardContentProps {\n  /**\n   * Used to enable hover actions on the ConversationCard.\n   * @default true\n   */\n  allowHoverActions?: boolean;\n  /** Props for the `AvatarGroup` component. */\n  avatarGroupProps?: ConversationCardAvatarGroupProps;\n  /** Props for the ConversationCard footer. */\n  footerProps?: ConversationCardFooterProps;\n  /** Props for the Menu component. See the `Menu` for more details. This component provides a default menu button if none is provided. If menuProps and pinProps are passed together, the component automatically adds a menuItem to control the pinned state. */\n  headerMenuProps?: MenuProps;\n  /** Props for the ConversationCard header. */\n  headerProps: ConversationCardHeaderProps;\n  /**\n   * Used to set the active state of the ConversationCard.\n   * @default false\n   */\n  active?: boolean;\n  /** Callback function for clicking the ConversationCard. */\n  onClick?: () => void;\n  /** Props to show and configure the conversation overlay button. If not passed, the overlay button won't be shown. */\n  overlayProps?: ConversationCardOverlayProps;\n  /** Props for the pin functionality. If not passed, pin functionality won't be shown. */\n  pinProps?: ConversationCardPinProps;\n  /**\n   * Used to preserve the position of the ConversationCard in a list with infinite scrolling.\n   * @default false\n   */\n  shouldPreservePosition?: boolean;\n  /**\n   * Used to show the unread messages indicator.\n   * @default false\n   */\n  showNotificationIndicator?: boolean;\n  /** The tags to be displayed in the ConversationCard. See the `Tag` for more information. Additionally, you can pass in a tooltipContent to customize what is shown in the tooltip. */\n  tags?: ConversationCardTag[];\n  /** Data test id for the conversation card.\n   * @default kibble-conversation-card\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCard = ({\n  allowHoverActions = true,\n  avatarGroupProps,\n  content,\n  contentProps,\n  contentMenu,\n  footerProps,\n  headerMenuProps,\n  headerProps,\n  active,\n  onClick,\n  overlayProps,\n  pinProps,\n  shouldPreservePosition = false,\n  showNotificationIndicator,\n  tags,\n  ['data-testid']: dataTestId = 'kibble-conversation-card',\n}: ConversationCardProps): React.JSX.Element => {\n  const { isPinned } = pinProps || {};\n  const [isHovering, setIsHovering] = useState(false);\n\n  return (\n    <Card\n      className=\"ConversationCard\"\n      id=\"conversation-card-item\"\n      data-testid={dataTestId}\n      interactive\n      active={active}\n      size=\"sm\"\n      fullWidth\n      onClick={(): void => {\n        if (onClick) {\n          onClick();\n        }\n      }}\n      bg={showNotificationIndicator || active || isHovering ? 'background.default' : 'background.subtle'}\n      onMouseEnter={(): void => {\n        if (allowHoverActions) {\n          setIsHovering(true);\n        }\n      }}\n      onMouseLeave={(): void => setIsHovering(false)}\n      pos=\"relative\"\n      css={{ overflowAnchor: shouldPreservePosition ? 'auto' : 'none' }}\n    >\n      {isHovering && (\n        <Box\n          className=\"ConversationCard__Button--Container\"\n          data-testid={`${dataTestId}-button-container`}\n          pos=\"absolute\"\n          top={2}\n          zIndex=\"banner\"\n          right={2}\n          bg=\"background\"\n          borderRadius=\"md\"\n          onClick={(e): void => e.stopPropagation()}\n        >\n          <ConversationCardButtons\n            overlayProps={overlayProps}\n            pinProps={pinProps}\n            headerMenuProps={headerMenuProps}\n            isHovering={isHovering}\n            setIsHovering={setIsHovering}\n          />\n        </Box>\n      )}\n      <ConversationCardHeader\n        avatarGroupProps={avatarGroupProps}\n        isHoveringCard={isHovering}\n        isCardPinned={isPinned}\n        showNotificationIndicator={showNotificationIndicator}\n        {...headerProps}\n      />\n      <ConversationCardContent content={content} contentProps={contentProps} contentMenu={contentMenu} />\n      {!!tags?.length && <ConversationCardTags tags={tags} />}\n      {footerProps && <ConversationCardFooter {...footerProps} />}\n    </Card>\n  );\n};\n"],"names":["ConversationCardAvatarGroup","avatars","max","onAvatarGroupClick","tooltipLabel","dataTestId","jsx","Tooltip","Flex","Avatar","e","Fragment","avatar","ConversationCardHeader","avatarGroupProps","timestampProps","isHoveringCard","isCardPinned","title","showNotificationIndicator","subtitle","jsxs","HStack","VStack","Heading","Text","Timestamp","Box","NotificationCounter","Icon","ConversationCardButtons","overlayProps","pinProps","headerMenuProps","isHovering","setIsHovering","isOpenInOverlay","onOpenInOverlay","overlayDataTestId","isPinned","onTogglePin","pinDataTestId","listProps","headerMenuDataTestId","pinIconName","Button","Menu","ConversationCardTags","tags","Wrap","tag","tooltipContent","rest","tagElement","Tag","WrapItem","ConversationCardFooter","iconProps","content","contentProps","_content","ConversationCardContent","contentMenu","ConversationCard","allowHoverActions","footerProps","headerProps","active","onClick","shouldPreservePosition","useState","Card"],"mappings":";;;;;;;;;;;;;;;;;;AAsBO,MAAMA,IAA8B,CAAC;AAAA,EAC1C,SAAAC;AAAA,EACA,KAAAC,IAAM;AAAA,EACN,oBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,CAAC,gBAAgBC,IAAa;AAChC,MAEIC,gBAAAA,MAACC,KAAQ,OAAOH,KAAgB,IAAI,UAAU,CAACA,GAAc,QAC3D,UAAAE,gBAAAA,EAAA;AAAA,EAACE;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,eAAaH;AAAA,IACb,YAAW;AAAA,IACX,gBAAe;AAAA,IAEd,UAAAH,KAAOD,EAAQ,SAASC,IACvBI,gBAAAA,EAAA;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,SAAS,CAACC,MAAY;AACpB,UAAAA,EAAE,gBAAgB,GACdP,KACFA,EAAmBO,CAAC;AAAA,QAExB;AAAA,QACA,QAAO;AAAA,QACP,MAAMT,EAAQ,OAAO,SAAS;AAAA,QAC9B,aAAa;AAAA,MAAA;AAAA,IAAA,IAGZK,gBAAAA,EAAA,IAAAK,EAAA,UAAA,EAAA,UAAAV,EAAQ,IAAI,CAACW,MAAWA,CAAM,EAAE,CAAA;AAAA,EAAA;AAAA,GAGzC,GClBSC,IAAyB,CAAC;AAAA,EACrC,kBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,OAAAC;AAAA,EACA,2BAAAC;AAAA,EACA,UAAAC;AAAA,EACA,CAAC,gBAAgBf,IAAa;AAChC,MAEIgB,gBAAAA,OAACC,KAAO,WAAU,4BAA2B,eAAajB,GAAY,SAAQ,iBAAgB,OAAM,cAClG,UAAA;AAAA,EAACgB,gBAAAA,EAAAA,KAAAC,GAAA,EAAO,WAAU,kCAAiC,eAAa,GAAGjB,CAAU,SAAS,QAAO,WAC1F,UAAA;AAAA,IAAAS,2BACEd,GAA6B,EAAA,GAAGc,GAAkB,cAAcA,GAAkB,gBAAgBI,GAAO;AAAA,IAE5GG,gBAAAA,EAAA;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,eAAa,GAAGlB,CAAU;AAAA,QAC1B,SAAQ;AAAA,QACR,OAAM;AAAA,QACN,KAAI;AAAA,QAEJ,UAAA;AAAA,UAAAC,gBAAAA,EAAA;AAAA,YAACkB;AAAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,eAAa,GAAGnB,CAAU;AAAA,cAC1B,MAAK;AAAA,cACL,WAAS;AAAA,cAER,UAAAa;AAAA,YAAA;AAAA,UACH;AAAA,UACCE,KACCd,gBAAAA,EAAA;AAAA,YAACmB;AAAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,eAAa,GAAGpB,CAAU;AAAA,cAC1B,MAAK;AAAA,cACL,SAAQ;AAAA,cACR,WAAS;AAAA,cAER,UAAAe;AAAA,YAAA;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ,GACF;AAAA,EACAC,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAa,GAAGjB,CAAU;AAAA,MAC1B,YAAYW,IAAiB,WAAW;AAAA,MACxC,OAAM;AAAA,MACN,KAAK;AAAA,MAEL,UAAA;AAAA,QAACV,gBAAAA,EAAAA,IAAAoB,GAAA,EAAW,GAAGX,GAAgB;AAAA,QAC9BI,KACCb,gBAAAA,EAAA;AAAA,UAACqB;AAAA,UAAA;AAAA,YACC,IAAG;AAAA,YACH,WAAU;AAAA,YACV,eAAa,GAAGtB,CAAU;AAAA,YAE1B,UAAAC,gBAAAA,EAAAA,IAACsB,GAAoB,EAAA,MAAK,KAAK,CAAA;AAAA,UAAA;AAAA,QACjC;AAAA,QAEDX,KACCX,gBAAAA,EAAAA,IAACE,GAAK,EAAA,eAAa,GAAGH,CAAU,gBAC9B,UAACC,gBAAAA,EAAA,IAAAuB,GAAA,EAAK,MAAK,MAAK,SAAQ,QAAO,MAAK,OAAM,EAC5C,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAEJ,GACF,GCtDSC,IAA0B,CAAC;AAAA,EACtC,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,CAAC,gBAAgB9B,IAAa;AAChC,MAAgE;AACxD,QAAA,EAAE,iBAAA+B,GAAiB,iBAAAC,GAAiB,CAAC,aAAa,GAAGC,EAAA,IAAsBP,KAAgB,CAAC,GAC5F,EAAE,UAAAQ,GAAU,aAAAC,GAAa,CAAC,aAAa,GAAGC,EAAA,IAAkBT,KAAY,CAAC,GACzE,EAAE,WAAAU,GAAW,CAAC,aAAa,GAAGC,EAAqB,IAAIV,KAAmB,CAAC,GAC3EW,IAAcL,IAAW,cAAc;AAE7C,gCACGjB,GAAO,EAAA,WAAU,0BAAyB,eAAajB,GAAY,KAAK,GACtE,UAAA;AAAA,IACC0B,KAAAzB,gBAAAA,EAAA;AAAA,MAACuC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,eAAaP,KAAwC,GAAGjC,CAAU;AAAA,QAClE,SAAQ;AAAA,QACR,cAAa;AAAA,QACZ,GAAI+B,KAAmB,EAAE,QAAQ,GAAK;AAAA,QACvC,SAAS,MAAY;AACnB,UAAIC,KACcA,EAAA,GAGdH,KACFC,EAAc,EAAK;AAAA,QAEvB;AAAA,QACA,UAAS;AAAA,QACT,MAAK;AAAA,MAAA;AAAA,IACP;AAAA,IAEDH,KACC1B,gBAAAA,EAAA;AAAA,MAACuC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,eAAaJ,KAAgC,GAAGpC,CAAU;AAAA,QAC1D,SAASkC,IAAW,+BAA+B;AAAA,QACnD,cAAa;AAAA,QACb,SAAS,MAAY;AACnB,UAAIC,KACFA,EAAY,CAACD,CAAQ,GAGnBL,KACFC,EAAc,EAAK;AAAA,QAEvB;AAAA,QACA,UAAUS;AAAA,QACV,MAAK;AAAA,MAAA;AAAA,IACP;AAAA,IAEDX,KACC3B,gBAAAA,EAAA;AAAA,MAACwC;AAAA,MAAA;AAAA,QACC,aACEb,EAAgB,eAAe;AAAA,UAC7B,SAAS;AAAA,UACT,MAAM;AAAA,UACN,cAAc;AAAA,UACd,UAAU;AAAA,UACV,WAAW;AAAA,UACX,SAAS;AAAA,QACX;AAAA,QAEF,eAAe;AAAA,QACf,WAAS;AAAA,QACT,eAAaU,KAA8C,GAAGtC,CAAU;AAAA,QACvE,GAAG4B;AAAA,QACJ,WAAW;AAAA,UACT,GAAGS;AAAA,UACH,WAAW;AAAA,YACT,GAAIV,IACA;AAAA,cACE;AAAA,gBACE,OAAO,GAAGO,IAAW,UAAU,KAAK;AAAA,gBACpC,OAAO;AAAA,gBACP,SAASA,IAAW,WAAW;AAAA,gBAC/B,aAAcjC,gBAAAA,EAAA,IAAAuB,GAAA,EAAK,MAAK,MAAK,SAASU,IAAW,WAAW,WAAW,MAAMK,EAAa,CAAA;AAAA,gBAC1F,UAAU,MAAY;AACpB,kBAAIJ,KACFA,EAAY,CAACD,CAAQ;AAAA,gBACvB;AAAA,cACF;AAAA,YACF,IAEF,CAAC;AAAA,YACL,GAAIG,GAAW,aAAa,CAAA;AAAA,UAAC;AAAA,QAC/B;AAAA,MACF;AAAA,IAAA;AAAA,EACF,GAEJ;AAEJ,GC3HaK,IAAuB,CAAC;AAAA,EACnC,MAAAC;AAAA,EACA,CAAC,gBAAgB3C,IAAa;AAChC,MAEKC,gBAAAA,EAAA,IAAAqB,GAAA,EAAI,WAAU,0BAAyB,IAAI,GAAG,eAAatB,GAC1D,UAAAC,gBAAAA,MAAC2C,KAAK,KAAK,GACR,UAAKD,EAAA,IAAI,CAACE,MAAQ;AACjB,QAAM,EAAE,gBAAAC,GAAgB,GAAGC,EAAA,IAASF;AAChC,MAAAG,0BAAcC,GAAK,EAAA,GAAGF,GAAM,MAAK,MAAK,eAAc,cAAa;AAErE,SAAID,MAEAE,IAAA/C,gBAAAA,EAAA,IAACC,KAAQ,OAAO4C,GAAgB,WAAU,OACxC,UAAA7C,gBAAAA,EAAAA,IAACqB,GAAK,EAAA,UAAA0B,EAAA,CAAW,EACnB,CAAA,IAII/C,gBAAAA,EAAAA,IAAAiD,GAAA,EAA0B,UAAZF,EAAA,GAAAH,EAAI,KAAmB;AAAA,CAC9C,GACH,EACF,CAAA,GCxBSM,IAAyB,CAAC;AAAA,EACrC,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,CAAC,gBAAgBtD,IAAa;AAChC,MAAsD;AAC9C,QAAAuD,IACJ,OAAOF,KAAY,WACjBpD,gBAAAA,EAAA;AAAA,IAACmB;AAAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAa,GAAGpB,CAAU;AAAA,MAC1B,MAAK;AAAA,MACL,SAAQ;AAAA,MACP,GAAGsD;AAAA,MACH,GAAIF,KAAa,EAAE,IAAI,EAAE;AAAA,MAEzB,UAAAC;AAAA,IAAA;AAAA,EAAA,IAGHA;AAGF,SAAArC,gBAAAA,OAACb,KAAK,WAAU,4BAA2B,eAAaH,GAAY,IAAI,GAAG,YAAW,UACnF,UAAA;AAAA,IAAAoD,2BAAc5B,GAAK,EAAA,MAAK,MAAK,SAAQ,UAAU,GAAG4B,GAAW;AAAA,IAC7DG;AAAA,EAAA,GACH;AAEJ,GC3BaC,IAA0B,CAAC;AAAA,EACtC,aAAAC;AAAA,EACA,SAAAJ;AAAA,EACA,cAAAC;AAAA,EACA,CAAC,gBAAgBtD,IAAa;AAChC,MAAuD;AAC/C,QAAAuD,IACJ,OAAOF,KAAY,WACjBpD,gBAAAA,EAAA;AAAA,IAACmB;AAAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAa,GAAGpB,CAAU;AAAA,MAC1B,WAAS;AAAA,MACT,MAAK;AAAA,MACJ,GAAGsD;AAAA,MAEH,UAAAD;AAAA,IAAA;AAAA,EAAA,IAGHA;AAIF,SAAArC,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAa,GAAGjB,CAAU;AAAA,MAC1B,IAAI;AAAA,MACJ,gBAAe;AAAA,MACf,YAAW;AAAA,MAEV,UAAA;AAAA,QAAAuD;AAAA,QACAE,KACExD,gBAAAA,EAAAA,IAAAqB,GAAA,EAAI,WAAU,iCAAgC,eAAa,GAAGtB,CAAU,SAAS,IAAG,QAClF,UACHyD,EAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ;AAEJ,GCeaC,KAAmB,CAAC;AAAA,EAC/B,mBAAAC,IAAoB;AAAA,EACpB,kBAAAlD;AAAA,EACA,SAAA4C;AAAA,EACA,cAAAC;AAAA,EACA,aAAAG;AAAA,EACA,aAAAG;AAAA,EACA,iBAAAhC;AAAA,EACA,aAAAiC;AAAA,EACA,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAArC;AAAA,EACA,UAAAC;AAAA,EACA,wBAAAqC,IAAyB;AAAA,EACzB,2BAAAlD;AAAA,EACA,MAAA6B;AAAA,EACA,CAAC,gBAAgB3C,IAAa;AAChC,MAAgD;AAC9C,QAAM,EAAE,UAAAkC,MAAaP,KAAY,CAAC,GAC5B,CAACE,GAAYC,CAAa,IAAImC,EAAS,EAAK;AAGhD,SAAAjD,gBAAAA,EAAA;AAAA,IAACkD;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,IAAG;AAAA,MACH,eAAalE;AAAA,MACb,aAAW;AAAA,MACX,QAAA8D;AAAA,MACA,MAAK;AAAA,MACL,WAAS;AAAA,MACT,SAAS,MAAY;AACnB,QAAIC,KACMA,EAAA;AAAA,MAEZ;AAAA,MACA,IAAIjD,KAA6BgD,KAAUjC,IAAa,uBAAuB;AAAA,MAC/E,cAAc,MAAY;AACxB,QAAI8B,KACF7B,EAAc,EAAI;AAAA,MAEtB;AAAA,MACA,cAAc,MAAYA,EAAc,EAAK;AAAA,MAC7C,KAAI;AAAA,MACJ,KAAK,EAAE,gBAAgBkC,IAAyB,SAAS,OAAO;AAAA,MAE/D,UAAA;AAAA,QACCnC,KAAA5B,gBAAAA,EAAA;AAAA,UAACqB;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAa,GAAGtB,CAAU;AAAA,YAC1B,KAAI;AAAA,YACJ,KAAK;AAAA,YACL,QAAO;AAAA,YACP,OAAO;AAAA,YACP,IAAG;AAAA,YACH,cAAa;AAAA,YACb,SAAS,CAACK,MAAYA,EAAE,gBAAgB;AAAA,YAExC,UAAAJ,gBAAAA,EAAA;AAAA,cAACwB;AAAA,cAAA;AAAA,gBACC,cAAAC;AAAA,gBACA,UAAAC;AAAA,gBACA,iBAAAC;AAAA,gBACA,YAAAC;AAAA,gBACA,eAAAC;AAAA,cAAA;AAAA,YAAA;AAAA,UACF;AAAA,QACF;AAAA,QAEF7B,gBAAAA,EAAA;AAAA,UAACO;AAAA,UAAA;AAAA,YACC,kBAAAC;AAAA,YACA,gBAAgBoB;AAAA,YAChB,cAAcK;AAAA,YACd,2BAAApB;AAAA,YACC,GAAG+C;AAAA,UAAA;AAAA,QACN;AAAA,QACC5D,gBAAAA,EAAAA,IAAAuD,GAAA,EAAwB,SAAAH,GAAkB,cAAAC,GAA4B,aAAAG,EAA0B,CAAA;AAAA,QAChG,CAAC,CAACd,GAAM,UAAU1C,gBAAAA,EAAA,IAACyC,KAAqB,MAAAC,GAAY;AAAA,QACpDiB,KAAe3D,gBAAAA,EAAA,IAACkD,GAAwB,EAAA,GAAGS,EAAa,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAC3D;AAEJ;"}

package/dist/chunks/{conversationCard.component-BM1FexSR.js → conversationCard.component-ESYyuGvU.js}

@@ -1,2 +1,2 @@
-"use strict";const t=require("./jsx-runtime-BjDatQAs.js"),y=require("react"),C=require("./index-BQRnVsAg.js"),z=require("./card.component-BmBiYbMV.js"),$=require("./timestamp.component-CRTYMLmn.js"),H=require("./notificationCounter.component-Cmpqouio.js"),R=require("./icon.component-B1hr5lLa.js"),B=require("./heading.component-DeM4h5rY.js"),E=require("./text.component-D5GpbfNx.js"),F=require("./avatar.component-BGgZoVJS.js"),k=require("./tooltip.component-DBw-hAPU.js"),g=require("./flex-BOU6tYUd.js"),j=require("./h-stack-D4MnHHRc.js"),W=require("./v-stack-Bz-79Toq.js"),h=require("./button.component-DjdgBXDC.js"),O=require("./menu.component-B_rE1WZ2.js"),T=require("./tag.component-C98Wf07v.js"),N=require("./wrap-BzPamGsJ.js"),w=({avatars:e,max:n=1,onAvatarGroupClick:a,tooltipLabel:s,["data-testid"]:i="kibble-conversation-card-avatar-group"})=>t.jsxRuntimeExports.jsx(k.Tooltip,{label:s||"",disabled:!s?.length,children:t.jsxRuntimeExports.jsx(g.Flex,{className:"ConversationCard__AvatarGroup","data-testid":i,alignItems:"flex-start",justifyContent:"flex-start",children:n&&e.length>n?t.jsxRuntimeExports.jsx(F.Avatar,{onClick:r=>{r.stopPropagation(),a&&a(r)},cursor:"pointer",name:e.length.toString(),showTooltip:!1}):t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:e.map(r=>r)})})}),D=({avatarGroupProps:e,timestampProps:n,isHoveringCard:a,isCardPinned:s,title:i,showNotificationIndicator:r,subtitle:d,["data-testid"]:o="kibble-conversation-card-header"})=>t.jsxRuntimeExports.jsxs(j.HStack,{className:"ConversationCard__Header","data-testid":o,justify:"space-between",align:"flex-start",children:[t.jsxRuntimeExports.jsxs(j.HStack,{className:"ConversationCard__Header--Left","data-testid":`${o}-left`,cursor:"pointer",children:[e&&t.jsxRuntimeExports.jsx(w,{...e,tooltipLabel:e?.tooltipLabel||i}),t.jsxRuntimeExports.jsxs(W.VStack,{className:"ConversationCard__HeaderText","data-testid":`${o}-text`,justify:"center",align:"left",gap:"0",children:[t.jsxRuntimeExports.jsx(B.WrappedHeading,{className:"ConversationCard__HeaderText--Title","data-testid":`${o}-title`,size:"sm",truncated:!0,children:i}),d&&t.jsxRuntimeExports.jsx(E.WrappedText,{className:"ConversationCard__HeaderText--Subtitle","data-testid":`${o}-subtitle`,size:"sm",variant:"subtle",truncated:!0,children:d})]})]}),t.jsxRuntimeExports.jsxs(j.HStack,{className:"ConversationCard__Header--Right","data-testid":`${o}-right`,visibility:a?"hidden":"visible",align:"center",gap:1,children:[t.jsxRuntimeExports.jsx($.Timestamp,{...n}),r&&t.jsxRuntimeExports.jsx(C.Box,{as:"span",className:"ConversationCard__HeaderNotificationCounter","data-testid":`${o}-unread-indicator`,children:t.jsxRuntimeExports.jsx(H.NotificationCounter,{size:"xs"})}),s&&t.jsxRuntimeExports.jsx(g.Flex,{"data-testid":`${o}-pinned-icon`,children:t.jsxRuntimeExports.jsx(R.Icon,{size:"md",variant:"info",name:"pin"})})]})]}),M=({overlayProps:e,pinProps:n,headerMenuProps:a,isHovering:s,setIsHovering:i,["data-testid"]:r="kibble-conversation-card-buttons"})=>{const{isOpenInOverlay:d,onOpenInOverlay:o,["data-testid"]:u}=e||{},{isPinned:c,onTogglePin:x,["data-testid"]:l}=n||{},{listProps:v,["data-testid"]:m}=a||{},p=c?"pinCancel":"pin";return t.jsxRuntimeExports.jsxs(j.HStack,{className:"ConversationCard__Menu","data-testid":r,gap:1,children:[e&&t.jsxRuntimeExports.jsx(h.Button,{className:"ConversationCard__OverlayButton","data-testid":u||`${r}-overlay-button`,variant:"secondarySubtle",borderRadius:"sm",...d&&{active:!0},onClick:()=>{o&&o(),s&&i(!1)},iconName:"popup",size:"sm"}),n&&t.jsxRuntimeExports.jsx(h.Button,{className:"ConversationCard__PinButton","data-testid":l||`${r}-pin-button`,variant:c?"secondarySubtleDestructive":"secondarySubtle",borderRadius:"sm",onClick:()=>{x&&x(!c),s&&i(!1)},iconName:p,size:"sm"}),a&&t.jsxRuntimeExports.jsx(O.Menu,{buttonProps:a.buttonProps||{variant:"secondarySubtle",size:"sm",borderRadius:"sm",iconName:"dotsVertical",hideCaret:!0,padding:0},closeOnSelect:!1,lazyMount:!0,"data-testid":m||`${r}-menu`,...a,listProps:{...v,menuItems:[...n?[{label:`${c?"Unpin":"Pin"} Conversation`,value:"PinConversation",variant:c?"danger":"default",leftElement:t.jsxRuntimeExports.jsx(R.Icon,{size:"md",variant:c?"danger":"default",name:p}),onSelect:()=>{x&&x(!c)}}]:[],...v?.menuItems||[]]}})]})},A=({tags:e,["data-testid"]:n="kibble-conversation-card-tags"})=>t.jsxRuntimeExports.jsx(C.Box,{className:"ConversationCard__Tags",mt:3,"data-testid":n,children:t.jsxRuntimeExports.jsx(N.Wrap,{gap:2,children:e.map(a=>{const{tooltipContent:s,...i}=a;let r=t.jsxRuntimeExports.jsx(T.Tag,{...i,size:"sm",textTransform:"capitalize"});return s&&(r=t.jsxRuntimeExports.jsx(k.Tooltip,{label:s,placement:"top",children:t.jsxRuntimeExports.jsx(C.Box,{children:r})})),t.jsxRuntimeExports.jsx(N.WrapItem,{children:r},a.label)})})}),L=({iconProps:e,content:n,contentProps:a,["data-testid"]:s="kibble-conversation-card-footer"})=>{const i=typeof n=="string"?t.jsxRuntimeExports.jsx(E.WrappedText,{className:"ConversationCard__FooterMessage","data-testid":`${s}-message`,size:"sm",variant:"subtle",...a,...e&&{ml:1},children:n}):n;return t.jsxRuntimeExports.jsxs(g.Flex,{className:"ConversationCard__Footer","data-testid":s,mt:3,alignItems:"center",children:[e&&t.jsxRuntimeExports.jsx(R.Icon,{size:"sm",variant:"subtle",...e}),i]})},V=({contentMenu:e,content:n,contentProps:a,["data-testid"]:s="kibble-conversation-card-content"})=>{const i=typeof n=="string"?t.jsxRuntimeExports.jsx(E.WrappedText,{className:"ConversationCard__Content","data-testid":`${s}-content`,truncated:!0,size:"sm",...a,children:n}):n;return t.jsxRuntimeExports.jsxs(j.HStack,{className:"ConversationCard__ContentContainer","data-testid":`${s}-container`,mt:3,justifyContent:"space-between",alignItems:"center",children:[i,e&&t.jsxRuntimeExports.jsx(C.Box,{className:"ConversationCard__ContentMenu","data-testid":`${s}-menu`,ml:"auto",children:e})]})},I=({allowHoverActions:e=!0,avatarGroupProps:n,content:a,contentProps:s,contentMenu:i,footerProps:r,headerMenuProps:d,headerProps:o,active:u,onClick:c,overlayProps:x,pinProps:l,shouldPreservePosition:v=!1,showNotificationIndicator:m,tags:p,["data-testid"]:f="kibble-conversation-card"})=>{const{isPinned:q}=l||{},[b,_]=y.useState(!1);return t.jsxRuntimeExports.jsxs(z.Card,{className:"ConversationCard",id:"conversation-card-item","data-testid":f,interactive:!0,active:u,size:"sm",fullWidth:!0,onClick:()=>{c&&c()},bg:m||u||b?"background.default":"background.subtle",onMouseEnter:()=>{e&&_(!0)},onMouseLeave:()=>_(!1),pos:"relative",css:{overflowAnchor:v?"auto":"none"},children:[b&&t.jsxRuntimeExports.jsx(C.Box,{className:"ConversationCard__Button--Container","data-testid":`${f}-button-container`,pos:"absolute",top:2,zIndex:"banner",right:2,bg:"background",borderRadius:"md",onClick:S=>S.stopPropagation(),children:t.jsxRuntimeExports.jsx(M,{overlayProps:x,pinProps:l,headerMenuProps:d,isHovering:b,setIsHovering:_})}),t.jsxRuntimeExports.jsx(D,{avatarGroupProps:n,isHoveringCard:b,isCardPinned:q,showNotificationIndicator:m,...o}),t.jsxRuntimeExports.jsx(V,{content:a,contentProps:s,contentMenu:i}),!!p?.length&&t.jsxRuntimeExports.jsx(A,{tags:p}),r&&t.jsxRuntimeExports.jsx(L,{...r})]})};exports.ConversationCard=I;
-//# sourceMappingURL=conversationCard.component-BM1FexSR.js.map
+"use strict";const t=require("./jsx-runtime-BjDatQAs.js"),y=require("react"),C=require("./index-BQRnVsAg.js"),z=require("./card.component-Z7HRGxC4.js"),$=require("./timestamp.component-CRTYMLmn.js"),H=require("./notificationCounter.component-Cmpqouio.js"),R=require("./icon.component-B1hr5lLa.js"),B=require("./heading.component-DeM4h5rY.js"),E=require("./text.component-D5GpbfNx.js"),F=require("./avatar.component-BGgZoVJS.js"),k=require("./tooltip.component-DBw-hAPU.js"),g=require("./flex-BOU6tYUd.js"),j=require("./h-stack-D4MnHHRc.js"),W=require("./v-stack-Bz-79Toq.js"),h=require("./button.component-DjdgBXDC.js"),O=require("./menu.component-B_rE1WZ2.js"),T=require("./tag.component-C98Wf07v.js"),N=require("./wrap-BzPamGsJ.js"),w=({avatars:e,max:n=1,onAvatarGroupClick:a,tooltipLabel:s,["data-testid"]:i="kibble-conversation-card-avatar-group"})=>t.jsxRuntimeExports.jsx(k.Tooltip,{label:s||"",disabled:!s?.length,children:t.jsxRuntimeExports.jsx(g.Flex,{className:"ConversationCard__AvatarGroup","data-testid":i,alignItems:"flex-start",justifyContent:"flex-start",children:n&&e.length>n?t.jsxRuntimeExports.jsx(F.Avatar,{onClick:r=>{r.stopPropagation(),a&&a(r)},cursor:"pointer",name:e.length.toString(),showTooltip:!1}):t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:e.map(r=>r)})})}),D=({avatarGroupProps:e,timestampProps:n,isHoveringCard:a,isCardPinned:s,title:i,showNotificationIndicator:r,subtitle:d,["data-testid"]:o="kibble-conversation-card-header"})=>t.jsxRuntimeExports.jsxs(j.HStack,{className:"ConversationCard__Header","data-testid":o,justify:"space-between",align:"flex-start",children:[t.jsxRuntimeExports.jsxs(j.HStack,{className:"ConversationCard__Header--Left","data-testid":`${o}-left`,cursor:"pointer",children:[e&&t.jsxRuntimeExports.jsx(w,{...e,tooltipLabel:e?.tooltipLabel||i}),t.jsxRuntimeExports.jsxs(W.VStack,{className:"ConversationCard__HeaderText","data-testid":`${o}-text`,justify:"center",align:"left",gap:"0",children:[t.jsxRuntimeExports.jsx(B.WrappedHeading,{className:"ConversationCard__HeaderText--Title","data-testid":`${o}-title`,size:"sm",truncated:!0,children:i}),d&&t.jsxRuntimeExports.jsx(E.WrappedText,{className:"ConversationCard__HeaderText--Subtitle","data-testid":`${o}-subtitle`,size:"sm",variant:"subtle",truncated:!0,children:d})]})]}),t.jsxRuntimeExports.jsxs(j.HStack,{className:"ConversationCard__Header--Right","data-testid":`${o}-right`,visibility:a?"hidden":"visible",align:"center",gap:1,children:[t.jsxRuntimeExports.jsx($.Timestamp,{...n}),r&&t.jsxRuntimeExports.jsx(C.Box,{as:"span",className:"ConversationCard__HeaderNotificationCounter","data-testid":`${o}-unread-indicator`,children:t.jsxRuntimeExports.jsx(H.NotificationCounter,{size:"xs"})}),s&&t.jsxRuntimeExports.jsx(g.Flex,{"data-testid":`${o}-pinned-icon`,children:t.jsxRuntimeExports.jsx(R.Icon,{size:"md",variant:"info",name:"pin"})})]})]}),M=({overlayProps:e,pinProps:n,headerMenuProps:a,isHovering:s,setIsHovering:i,["data-testid"]:r="kibble-conversation-card-buttons"})=>{const{isOpenInOverlay:d,onOpenInOverlay:o,["data-testid"]:u}=e||{},{isPinned:c,onTogglePin:x,["data-testid"]:l}=n||{},{listProps:v,["data-testid"]:m}=a||{},p=c?"pinCancel":"pin";return t.jsxRuntimeExports.jsxs(j.HStack,{className:"ConversationCard__Menu","data-testid":r,gap:1,children:[e&&t.jsxRuntimeExports.jsx(h.Button,{className:"ConversationCard__OverlayButton","data-testid":u||`${r}-overlay-button`,variant:"secondarySubtle",borderRadius:"sm",...d&&{active:!0},onClick:()=>{o&&o(),s&&i(!1)},iconName:"popup",size:"sm"}),n&&t.jsxRuntimeExports.jsx(h.Button,{className:"ConversationCard__PinButton","data-testid":l||`${r}-pin-button`,variant:c?"secondarySubtleDestructive":"secondarySubtle",borderRadius:"sm",onClick:()=>{x&&x(!c),s&&i(!1)},iconName:p,size:"sm"}),a&&t.jsxRuntimeExports.jsx(O.Menu,{buttonProps:a.buttonProps||{variant:"secondarySubtle",size:"sm",borderRadius:"sm",iconName:"dotsVertical",hideCaret:!0,padding:0},closeOnSelect:!1,lazyMount:!0,"data-testid":m||`${r}-menu`,...a,listProps:{...v,menuItems:[...n?[{label:`${c?"Unpin":"Pin"} Conversation`,value:"PinConversation",variant:c?"danger":"default",leftElement:t.jsxRuntimeExports.jsx(R.Icon,{size:"md",variant:c?"danger":"default",name:p}),onSelect:()=>{x&&x(!c)}}]:[],...v?.menuItems||[]]}})]})},A=({tags:e,["data-testid"]:n="kibble-conversation-card-tags"})=>t.jsxRuntimeExports.jsx(C.Box,{className:"ConversationCard__Tags",mt:3,"data-testid":n,children:t.jsxRuntimeExports.jsx(N.Wrap,{gap:2,children:e.map(a=>{const{tooltipContent:s,...i}=a;let r=t.jsxRuntimeExports.jsx(T.Tag,{...i,size:"sm",textTransform:"capitalize"});return s&&(r=t.jsxRuntimeExports.jsx(k.Tooltip,{label:s,placement:"top",children:t.jsxRuntimeExports.jsx(C.Box,{children:r})})),t.jsxRuntimeExports.jsx(N.WrapItem,{children:r},a.label)})})}),L=({iconProps:e,content:n,contentProps:a,["data-testid"]:s="kibble-conversation-card-footer"})=>{const i=typeof n=="string"?t.jsxRuntimeExports.jsx(E.WrappedText,{className:"ConversationCard__FooterMessage","data-testid":`${s}-message`,size:"sm",variant:"subtle",...a,...e&&{ml:1},children:n}):n;return t.jsxRuntimeExports.jsxs(g.Flex,{className:"ConversationCard__Footer","data-testid":s,mt:3,alignItems:"center",children:[e&&t.jsxRuntimeExports.jsx(R.Icon,{size:"sm",variant:"subtle",...e}),i]})},V=({contentMenu:e,content:n,contentProps:a,["data-testid"]:s="kibble-conversation-card-content"})=>{const i=typeof n=="string"?t.jsxRuntimeExports.jsx(E.WrappedText,{className:"ConversationCard__Content","data-testid":`${s}-content`,truncated:!0,size:"sm",...a,children:n}):n;return t.jsxRuntimeExports.jsxs(j.HStack,{className:"ConversationCard__ContentContainer","data-testid":`${s}-container`,mt:3,justifyContent:"space-between",alignItems:"center",children:[i,e&&t.jsxRuntimeExports.jsx(C.Box,{className:"ConversationCard__ContentMenu","data-testid":`${s}-menu`,ml:"auto",children:e})]})},I=({allowHoverActions:e=!0,avatarGroupProps:n,content:a,contentProps:s,contentMenu:i,footerProps:r,headerMenuProps:d,headerProps:o,active:u,onClick:c,overlayProps:x,pinProps:l,shouldPreservePosition:v=!1,showNotificationIndicator:m,tags:p,["data-testid"]:f="kibble-conversation-card"})=>{const{isPinned:q}=l||{},[b,_]=y.useState(!1);return t.jsxRuntimeExports.jsxs(z.Card,{className:"ConversationCard",id:"conversation-card-item","data-testid":f,interactive:!0,active:u,size:"sm",fullWidth:!0,onClick:()=>{c&&c()},bg:m||u||b?"background.default":"background.subtle",onMouseEnter:()=>{e&&_(!0)},onMouseLeave:()=>_(!1),pos:"relative",css:{overflowAnchor:v?"auto":"none"},children:[b&&t.jsxRuntimeExports.jsx(C.Box,{className:"ConversationCard__Button--Container","data-testid":`${f}-button-container`,pos:"absolute",top:2,zIndex:"banner",right:2,bg:"background",borderRadius:"md",onClick:S=>S.stopPropagation(),children:t.jsxRuntimeExports.jsx(M,{overlayProps:x,pinProps:l,headerMenuProps:d,isHovering:b,setIsHovering:_})}),t.jsxRuntimeExports.jsx(D,{avatarGroupProps:n,isHoveringCard:b,isCardPinned:q,showNotificationIndicator:m,...o}),t.jsxRuntimeExports.jsx(V,{content:a,contentProps:s,contentMenu:i}),!!p?.length&&t.jsxRuntimeExports.jsx(A,{tags:p}),r&&t.jsxRuntimeExports.jsx(L,{...r})]})};exports.ConversationCard=I;
+//# sourceMappingURL=conversationCard.component-ESYyuGvU.js.map

package/dist/chunks/{conversationCard.component-BM1FexSR.js.map → conversationCard.component-ESYyuGvU.js.map}

@@ -1 +1 @@
-{"version":3,"file":"conversationCard.component-BM1FexSR.js","sources":["../../src/components/ConversationCard/components/ConversationCardAvatarGroup/conversationCardAvatarGroup.component.tsx","../../src/components/ConversationCard/components/ConversationCardHeader/conversationCardHeader.component.tsx","../../src/components/ConversationCard/components/ConversationCardButtons/conversationCardButtons.component.tsx","../../src/components/ConversationCard/components/ConversationCardTags/conversationCardTags.component.tsx","../../src/components/ConversationCard/components/ConversationCardFooter/conversationCardFooter.component.tsx","../../src/components/ConversationCard/components/ConversationCardContent/conversationCardContent.component.tsx","../../src/components/ConversationCard/conversationCard.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { Avatar } from 'components/Avatar/avatar.component';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\n\nexport interface ConversationCardAvatarGroupProps {\n  /** Avatars to display in the group. */\n  avatars: React.ReactNode[];\n  /** Maximum number of avatars to display.\n   * @default 1\n   */\n  max?: number;\n  /** Callback function to be called when the avatar group is clicked. */\n  onAvatarGroupClick?: (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;\n  /** Label for the tooltip. */\n  tooltipLabel?: string;\n  /** Data test id for the avatar group.\n   * @default kibble-conversation-card-avatar-group\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardAvatarGroup = ({\n  avatars,\n  max = 1,\n  onAvatarGroupClick,\n  tooltipLabel,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-avatar-group',\n}: ConversationCardAvatarGroupProps): React.JSX.Element => {\n  return (\n    <Tooltip label={tooltipLabel || ''} disabled={!tooltipLabel?.length}>\n      <Flex\n        className=\"ConversationCard__AvatarGroup\"\n        data-testid={dataTestId}\n        alignItems=\"flex-start\"\n        justifyContent=\"flex-start\"\n      >\n        {max && avatars.length > max ? (\n          <Avatar\n            onClick={(e): void => {\n              e.stopPropagation();\n              if (onAvatarGroupClick) {\n                onAvatarGroupClick(e);\n              }\n            }}\n            cursor=\"pointer\"\n            name={avatars.length.toString()}\n            showTooltip={false}\n          />\n        ) : (\n          <>{avatars.map((avatar) => avatar)}</>\n        )}\n      </Flex>\n    </Tooltip>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { HStack, VStack } from '@chakra-ui/react/stack';\nimport { Timestamp, TimestampProps } from 'components/Timestamp/timestamp.component';\nimport { NotificationCounter } from 'components/NotificationCounter/notificationCounter.component';\nimport { Icon } from 'components/Icon/icon.component';\nimport { Heading } from 'components/Heading/heading.component';\nimport { Text } from 'components/Text/text.component';\nimport {\n  ConversationCardAvatarGroup,\n  ConversationCardAvatarGroupProps,\n} from '../ConversationCardAvatarGroup/conversationCardAvatarGroup.component';\n\nexport interface ConversationCardHeaderProps {\n  /** Props for the avatar group. */\n  avatarGroupProps?: ConversationCardAvatarGroupProps;\n  /** If true, the notification indicator will be displayed. */\n  showNotificationIndicator?: boolean;\n  /** Determines if the card is pinned. */\n  isCardPinned?: boolean;\n  /** Determines if the card is being hovered. */\n  isHoveringCard?: boolean;\n  /** Subtitle of the card. */\n  subtitle?: string;\n  /** Props for the timestamp. */\n  timestampProps: TimestampProps;\n  /** Title of the card. */\n  title: string;\n  /** Data test id for the header.\n   * @default kibble-conversation-card-header\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardHeader = ({\n  avatarGroupProps,\n  timestampProps,\n  isHoveringCard,\n  isCardPinned,\n  title,\n  showNotificationIndicator,\n  subtitle,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-header',\n}: ConversationCardHeaderProps): React.JSX.Element => {\n  return (\n    <HStack className=\"ConversationCard__Header\" data-testid={dataTestId} justify=\"space-between\" align=\"flex-start\">\n      <HStack className=\"ConversationCard__Header--Left\" data-testid={`${dataTestId}-left`} cursor=\"pointer\">\n        {avatarGroupProps && (\n          <ConversationCardAvatarGroup {...avatarGroupProps} tooltipLabel={avatarGroupProps?.tooltipLabel || title} />\n        )}\n        <VStack\n          className=\"ConversationCard__HeaderText\"\n          data-testid={`${dataTestId}-text`}\n          justify=\"center\"\n          align=\"left\"\n          gap=\"0\"\n        >\n          <Heading\n            className=\"ConversationCard__HeaderText--Title\"\n            data-testid={`${dataTestId}-title`}\n            size=\"sm\"\n            truncated\n          >\n            {title}\n          </Heading>\n          {subtitle && (\n            <Text\n              className=\"ConversationCard__HeaderText--Subtitle\"\n              data-testid={`${dataTestId}-subtitle`}\n              size=\"sm\"\n              variant=\"subtle\"\n              truncated\n            >\n              {subtitle}\n            </Text>\n          )}\n        </VStack>\n      </HStack>\n      <HStack\n        className=\"ConversationCard__Header--Right\"\n        data-testid={`${dataTestId}-right`}\n        visibility={isHoveringCard ? 'hidden' : 'visible'}\n        align=\"center\"\n        gap={1}\n      >\n        <Timestamp {...timestampProps} />\n        {showNotificationIndicator && (\n          <Box\n            as=\"span\"\n            className=\"ConversationCard__HeaderNotificationCounter\"\n            data-testid={`${dataTestId}-unread-indicator`}\n          >\n            <NotificationCounter size=\"xs\" />\n          </Box>\n        )}\n        {isCardPinned && (\n          <Flex data-testid={`${dataTestId}-pinned-icon`}>\n            <Icon size=\"md\" variant=\"info\" name=\"pin\" />\n          </Flex>\n        )}\n      </HStack>\n    </HStack>\n  );\n};\n","import React from 'react';\nimport { HStack } from '@chakra-ui/react/stack';\nimport { Button } from 'components/Button/button.component';\nimport { Icon } from 'components/Icon/icon.component';\nimport { Menu, MenuProps, MenuItemProps } from 'components/Menu';\n\nexport interface ConversationCardOverlayProps {\n  /** Determines if the conversation is open in an overlay. */\n  isOpenInOverlay?: boolean;\n  /** Callback function to be called when the conversation is opened in an overlay. */\n  onOpenInOverlay: () => void;\n  /** Data test id for the overlay button. */\n  'data-testid'?: string;\n}\n\nexport interface ConversationCardPinProps {\n  /** Determines if the conversation is pinned. */\n  isPinned?: boolean;\n  /** Callback function to called when the conversation is pinned. */\n  onTogglePin: (isPinned: boolean) => void;\n  /** Data test id for the pin button. */\n  'data-testid'?: string;\n}\n\nexport interface ConversationCardButtonsProps {\n  /** Props for the overlay button. */\n  overlayProps?: ConversationCardOverlayProps;\n  /** Props for the pin button. */\n  pinProps?: ConversationCardPinProps;\n  /** Props for the header Menu. */\n  headerMenuProps?: MenuProps;\n  /** Data test id for the buttons.\n   * @default kibble-conversation-card-buttons\n   */\n  'data-testid'?: string;\n}\n\ninterface ConversationCardButtonsComponentProps extends ConversationCardButtonsProps {\n  /** Determines if the conversation is being hovered.\n   * @internal\n   */\n  isHovering: boolean;\n  /** Callback function to set the hover state.\n   * @internal\n   */\n  setIsHovering: (isHovering: boolean) => void;\n}\n\nexport const ConversationCardButtons = ({\n  overlayProps,\n  pinProps,\n  headerMenuProps,\n  isHovering,\n  setIsHovering,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-buttons',\n}: ConversationCardButtonsComponentProps): React.JSX.Element => {\n  const { isOpenInOverlay, onOpenInOverlay, ['data-testid']: overlayDataTestId } = overlayProps || {};\n  const { isPinned, onTogglePin, ['data-testid']: pinDataTestId } = pinProps || {};\n  const { listProps, ['data-testid']: headerMenuDataTestId } = headerMenuProps || {};\n  const pinIconName = isPinned ? 'pinCancel' : 'pin';\n\n  return (\n    <HStack className=\"ConversationCard__Menu\" data-testid={dataTestId} gap={1}>\n      {overlayProps && (\n        <Button\n          className=\"ConversationCard__OverlayButton\"\n          data-testid={overlayDataTestId ? overlayDataTestId : `${dataTestId}-overlay-button`}\n          variant=\"secondarySubtle\"\n          borderRadius=\"sm\"\n          {...(isOpenInOverlay && { active: true })}\n          onClick={(): void => {\n            if (onOpenInOverlay) {\n              onOpenInOverlay();\n            }\n\n            if (isHovering) {\n              setIsHovering(false);\n            }\n          }}\n          iconName=\"popup\"\n          size=\"sm\"\n        />\n      )}\n      {pinProps && (\n        <Button\n          className=\"ConversationCard__PinButton\"\n          data-testid={pinDataTestId ? pinDataTestId : `${dataTestId}-pin-button`}\n          variant={isPinned ? 'secondarySubtleDestructive' : 'secondarySubtle'}\n          borderRadius=\"sm\"\n          onClick={(): void => {\n            if (onTogglePin) {\n              onTogglePin(!isPinned);\n            }\n\n            if (isHovering) {\n              setIsHovering(false);\n            }\n          }}\n          iconName={pinIconName}\n          size=\"sm\"\n        />\n      )}\n      {headerMenuProps && (\n        <Menu\n          buttonProps={\n            headerMenuProps.buttonProps || {\n              variant: 'secondarySubtle',\n              size: 'sm',\n              borderRadius: 'sm',\n              iconName: 'dotsVertical',\n              hideCaret: true,\n              padding: 0,\n            }\n          }\n          closeOnSelect={false}\n          lazyMount\n          data-testid={headerMenuDataTestId ? headerMenuDataTestId : `${dataTestId}-menu`}\n          {...headerMenuProps}\n          listProps={{\n            ...listProps,\n            menuItems: [\n              ...(pinProps\n                ? [\n                    {\n                      label: `${isPinned ? 'Unpin' : 'Pin'} Conversation`,\n                      value: 'PinConversation',\n                      variant: isPinned ? 'danger' : 'default',\n                      leftElement: <Icon size=\"md\" variant={isPinned ? 'danger' : 'default'} name={pinIconName} />,\n                      onSelect: (): void => {\n                        if (onTogglePin) {\n                          onTogglePin(!isPinned);\n                        }\n                      },\n                    } as MenuItemProps,\n                  ]\n                : []),\n              ...(listProps?.menuItems || []),\n            ],\n          }}\n        />\n      )}\n    </HStack>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Wrap, WrapItem } from '@chakra-ui/react/wrap';\nimport { Tag, TagProps } from 'components/Tag/tag.component';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\n\nexport type ConversationCardTag = TagProps & {\n  /** Content to display in the tooltip. */\n  tooltipContent?: string;\n};\n\nexport interface ConversationCardTagsProps {\n  /** Tags to display in the ConversationCard. */\n  tags: ConversationCardTag[];\n  /** Data test id for the tags.\n   * @default kibble-conversation-card-tags\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardTags = ({\n  tags,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-tags',\n}: ConversationCardTagsProps): React.JSX.Element => {\n  return (\n    <Box className=\"ConversationCard__Tags\" mt={3} data-testid={dataTestId}>\n      <Wrap gap={2}>\n        {tags.map((tag) => {\n          const { tooltipContent, ...rest } = tag;\n          let tagElement = <Tag {...rest} size=\"sm\" textTransform=\"capitalize\" />;\n\n          if (tooltipContent) {\n            tagElement = (\n              <Tooltip label={tooltipContent} placement=\"top\">\n                <Box>{tagElement}</Box>\n              </Tooltip>\n            );\n          }\n\n          return <WrapItem key={tag.label}>{tagElement}</WrapItem>;\n        })}\n      </Wrap>\n    </Box>\n  );\n};\n","import React from 'react';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { Icon, IconProps } from 'components/Icon/icon.component';\nimport { Text, TextProps } from 'components/Text/text.component';\n\nexport interface ConversationCardFooterProps {\n  /** Props for the Icon component. */\n  iconProps?: IconProps;\n  /** Content of the footer. */\n  content: React.ReactNode;\n  /** Props to customize the content styling. */\n  contentProps?: Omit<TextProps, 'children'>;\n  /** Data test id for the footer.\n   * @default kibble-conversation-card-footer\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardFooter = ({\n  iconProps,\n  content,\n  contentProps,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-footer',\n}: ConversationCardFooterProps): React.JSX.Element => {\n  const _content =\n    typeof content === 'string' ? (\n      <Text\n        className=\"ConversationCard__FooterMessage\"\n        data-testid={`${dataTestId}-message`}\n        size=\"sm\"\n        variant=\"subtle\"\n        {...contentProps}\n        {...(iconProps && { ml: 1 })}\n      >\n        {content}\n      </Text>\n    ) : (\n      content\n    );\n  return (\n    <Flex className=\"ConversationCard__Footer\" data-testid={dataTestId} mt={3} alignItems=\"center\">\n      {iconProps && <Icon size=\"sm\" variant=\"subtle\" {...iconProps} />}\n      {_content}\n    </Flex>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { HStack } from '@chakra-ui/react/stack';\nimport { Text, TextProps } from 'components/Text/text.component';\n\nexport interface ConversationCardContentProps {\n  /** Content of the card. */\n  content?: React.ReactNode;\n  /** Props to customize the content styling. */\n  contentProps?: Omit<TextProps, 'children'>;\n  /** Optional Menu for the card. */\n  contentMenu?: React.ReactNode;\n  /** Data test id for the content.\n   * @default kibble-conversation-card-content\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardContent = ({\n  contentMenu,\n  content,\n  contentProps,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-content',\n}: ConversationCardContentProps): React.JSX.Element => {\n  const _content =\n    typeof content === 'string' ? (\n      <Text\n        className=\"ConversationCard__Content\"\n        data-testid={`${dataTestId}-content`}\n        truncated\n        size=\"sm\"\n        {...contentProps}\n      >\n        {content}\n      </Text>\n    ) : (\n      content\n    );\n\n  return (\n    <HStack\n      className=\"ConversationCard__ContentContainer\"\n      data-testid={`${dataTestId}-container`}\n      mt={3}\n      justifyContent=\"space-between\"\n      alignItems=\"center\"\n    >\n      {_content}\n      {contentMenu && (\n        <Box className=\"ConversationCard__ContentMenu\" data-testid={`${dataTestId}-menu`} ml=\"auto\">\n          {contentMenu}\n        </Box>\n      )}\n    </HStack>\n  );\n};\n","import React, { useState } from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Card } from 'components/Card/card.component';\nimport { MenuProps } from 'components/Menu/menu.component';\nimport {\n  ConversationCardHeader,\n  ConversationCardHeaderProps,\n} from './components/ConversationCardHeader/conversationCardHeader.component';\nimport {\n  ConversationCardButtons,\n  ConversationCardOverlayProps,\n  ConversationCardPinProps,\n} from './components/ConversationCardButtons/conversationCardButtons.component';\nimport {\n  ConversationCardTag,\n  ConversationCardTags,\n} from './components/ConversationCardTags/conversationCardTags.component';\nimport {\n  ConversationCardFooter,\n  ConversationCardFooterProps,\n} from './components/ConversationCardFooter/conversationCardFooter.component';\nimport {\n  ConversationCardContent,\n  ConversationCardContentProps,\n} from './components/ConversationCardContent/conversationCardContent.component';\nimport { ConversationCardAvatarGroupProps } from './components/ConversationCardAvatarGroup/conversationCardAvatarGroup.component';\n\nexport interface ConversationCardProps extends ConversationCardContentProps {\n  /**\n   * Used to enable hover actions on the ConversationCard.\n   * @default true\n   */\n  allowHoverActions?: boolean;\n  /** Props for the `AvatarGroup` component. */\n  avatarGroupProps?: ConversationCardAvatarGroupProps;\n  /** Props for the ConversationCard footer. */\n  footerProps?: ConversationCardFooterProps;\n  /** Props for the Menu component. See the `Menu` for more details. This component provides a default menu button if none is provided. If menuProps and pinProps are passed together, the component automatically adds a menuItem to control the pinned state. */\n  headerMenuProps?: MenuProps;\n  /** Props for the ConversationCard header. */\n  headerProps: ConversationCardHeaderProps;\n  /**\n   * Used to set the active state of the ConversationCard.\n   * @default false\n   */\n  active?: boolean;\n  /** Callback function for clicking the ConversationCard. */\n  onClick?: () => void;\n  /** Props to show and configure the conversation overlay button. If not passed, the overlay button won't be shown. */\n  overlayProps?: ConversationCardOverlayProps;\n  /** Props for the pin functionality. If not passed, pin functionality won't be shown. */\n  pinProps?: ConversationCardPinProps;\n  /**\n   * Used to preserve the position of the ConversationCard in a list with infinite scrolling.\n   * @default false\n   */\n  shouldPreservePosition?: boolean;\n  /**\n   * Used to show the unread messages indicator.\n   * @default false\n   */\n  showNotificationIndicator?: boolean;\n  /** The tags to be displayed in the ConversationCard. See the `Tag` for more information. Additionally, you can pass in a tooltipContent to customize what is shown in the tooltip. */\n  tags?: ConversationCardTag[];\n  /** Data test id for the conversation card.\n   * @default kibble-conversation-card\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCard = ({\n  allowHoverActions = true,\n  avatarGroupProps,\n  content,\n  contentProps,\n  contentMenu,\n  footerProps,\n  headerMenuProps,\n  headerProps,\n  active,\n  onClick,\n  overlayProps,\n  pinProps,\n  shouldPreservePosition = false,\n  showNotificationIndicator,\n  tags,\n  ['data-testid']: dataTestId = 'kibble-conversation-card',\n}: ConversationCardProps): React.JSX.Element => {\n  const { isPinned } = pinProps || {};\n  const [isHovering, setIsHovering] = useState(false);\n\n  return (\n    <Card\n      className=\"ConversationCard\"\n      id=\"conversation-card-item\"\n      data-testid={dataTestId}\n      interactive\n      active={active}\n      size=\"sm\"\n      fullWidth\n      onClick={(): void => {\n        if (onClick) {\n          onClick();\n        }\n      }}\n      bg={showNotificationIndicator || active || isHovering ? 'background.default' : 'background.subtle'}\n      onMouseEnter={(): void => {\n        if (allowHoverActions) {\n          setIsHovering(true);\n        }\n      }}\n      onMouseLeave={(): void => setIsHovering(false)}\n      pos=\"relative\"\n      css={{ overflowAnchor: shouldPreservePosition ? 'auto' : 'none' }}\n    >\n      {isHovering && (\n        <Box\n          className=\"ConversationCard__Button--Container\"\n          data-testid={`${dataTestId}-button-container`}\n          pos=\"absolute\"\n          top={2}\n          zIndex=\"banner\"\n          right={2}\n          bg=\"background\"\n          borderRadius=\"md\"\n          onClick={(e): void => e.stopPropagation()}\n        >\n          <ConversationCardButtons\n            overlayProps={overlayProps}\n            pinProps={pinProps}\n            headerMenuProps={headerMenuProps}\n            isHovering={isHovering}\n            setIsHovering={setIsHovering}\n          />\n        </Box>\n      )}\n      <ConversationCardHeader\n        avatarGroupProps={avatarGroupProps}\n        isHoveringCard={isHovering}\n        isCardPinned={isPinned}\n        showNotificationIndicator={showNotificationIndicator}\n        {...headerProps}\n      />\n      <ConversationCardContent content={content} contentProps={contentProps} contentMenu={contentMenu} />\n      {!!tags?.length && <ConversationCardTags tags={tags} />}\n      {footerProps && <ConversationCardFooter {...footerProps} />}\n    </Card>\n  );\n};\n"],"names":["ConversationCardAvatarGroup","avatars","max","onAvatarGroupClick","tooltipLabel","dataTestId","jsx","Tooltip","Flex","Avatar","e","Fragment","avatar","ConversationCardHeader","avatarGroupProps","timestampProps","isHoveringCard","isCardPinned","title","showNotificationIndicator","subtitle","jsxs","HStack","VStack","Heading","Text","Timestamp","Box","NotificationCounter","Icon","ConversationCardButtons","overlayProps","pinProps","headerMenuProps","isHovering","setIsHovering","isOpenInOverlay","onOpenInOverlay","overlayDataTestId","isPinned","onTogglePin","pinDataTestId","listProps","headerMenuDataTestId","pinIconName","Button","Menu","ConversationCardTags","tags","Wrap","tag","tooltipContent","rest","tagElement","Tag","WrapItem","ConversationCardFooter","iconProps","content","contentProps","_content","ConversationCardContent","contentMenu","ConversationCard","allowHoverActions","footerProps","headerProps","active","onClick","shouldPreservePosition","useState","Card"],"mappings":"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"}
+{"version":3,"file":"conversationCard.component-ESYyuGvU.js","sources":["../../src/components/ConversationCard/components/ConversationCardAvatarGroup/conversationCardAvatarGroup.component.tsx","../../src/components/ConversationCard/components/ConversationCardHeader/conversationCardHeader.component.tsx","../../src/components/ConversationCard/components/ConversationCardButtons/conversationCardButtons.component.tsx","../../src/components/ConversationCard/components/ConversationCardTags/conversationCardTags.component.tsx","../../src/components/ConversationCard/components/ConversationCardFooter/conversationCardFooter.component.tsx","../../src/components/ConversationCard/components/ConversationCardContent/conversationCardContent.component.tsx","../../src/components/ConversationCard/conversationCard.component.tsx"],"sourcesContent":["import React from 'react';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { Avatar } from 'components/Avatar/avatar.component';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\n\nexport interface ConversationCardAvatarGroupProps {\n  /** Avatars to display in the group. */\n  avatars: React.ReactNode[];\n  /** Maximum number of avatars to display.\n   * @default 1\n   */\n  max?: number;\n  /** Callback function to be called when the avatar group is clicked. */\n  onAvatarGroupClick?: (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;\n  /** Label for the tooltip. */\n  tooltipLabel?: string;\n  /** Data test id for the avatar group.\n   * @default kibble-conversation-card-avatar-group\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardAvatarGroup = ({\n  avatars,\n  max = 1,\n  onAvatarGroupClick,\n  tooltipLabel,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-avatar-group',\n}: ConversationCardAvatarGroupProps): React.JSX.Element => {\n  return (\n    <Tooltip label={tooltipLabel || ''} disabled={!tooltipLabel?.length}>\n      <Flex\n        className=\"ConversationCard__AvatarGroup\"\n        data-testid={dataTestId}\n        alignItems=\"flex-start\"\n        justifyContent=\"flex-start\"\n      >\n        {max && avatars.length > max ? (\n          <Avatar\n            onClick={(e): void => {\n              e.stopPropagation();\n              if (onAvatarGroupClick) {\n                onAvatarGroupClick(e);\n              }\n            }}\n            cursor=\"pointer\"\n            name={avatars.length.toString()}\n            showTooltip={false}\n          />\n        ) : (\n          <>{avatars.map((avatar) => avatar)}</>\n        )}\n      </Flex>\n    </Tooltip>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { HStack, VStack } from '@chakra-ui/react/stack';\nimport { Timestamp, TimestampProps } from 'components/Timestamp/timestamp.component';\nimport { NotificationCounter } from 'components/NotificationCounter/notificationCounter.component';\nimport { Icon } from 'components/Icon/icon.component';\nimport { Heading } from 'components/Heading/heading.component';\nimport { Text } from 'components/Text/text.component';\nimport {\n  ConversationCardAvatarGroup,\n  ConversationCardAvatarGroupProps,\n} from '../ConversationCardAvatarGroup/conversationCardAvatarGroup.component';\n\nexport interface ConversationCardHeaderProps {\n  /** Props for the avatar group. */\n  avatarGroupProps?: ConversationCardAvatarGroupProps;\n  /** If true, the notification indicator will be displayed. */\n  showNotificationIndicator?: boolean;\n  /** Determines if the card is pinned. */\n  isCardPinned?: boolean;\n  /** Determines if the card is being hovered. */\n  isHoveringCard?: boolean;\n  /** Subtitle of the card. */\n  subtitle?: string;\n  /** Props for the timestamp. */\n  timestampProps: TimestampProps;\n  /** Title of the card. */\n  title: string;\n  /** Data test id for the header.\n   * @default kibble-conversation-card-header\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardHeader = ({\n  avatarGroupProps,\n  timestampProps,\n  isHoveringCard,\n  isCardPinned,\n  title,\n  showNotificationIndicator,\n  subtitle,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-header',\n}: ConversationCardHeaderProps): React.JSX.Element => {\n  return (\n    <HStack className=\"ConversationCard__Header\" data-testid={dataTestId} justify=\"space-between\" align=\"flex-start\">\n      <HStack className=\"ConversationCard__Header--Left\" data-testid={`${dataTestId}-left`} cursor=\"pointer\">\n        {avatarGroupProps && (\n          <ConversationCardAvatarGroup {...avatarGroupProps} tooltipLabel={avatarGroupProps?.tooltipLabel || title} />\n        )}\n        <VStack\n          className=\"ConversationCard__HeaderText\"\n          data-testid={`${dataTestId}-text`}\n          justify=\"center\"\n          align=\"left\"\n          gap=\"0\"\n        >\n          <Heading\n            className=\"ConversationCard__HeaderText--Title\"\n            data-testid={`${dataTestId}-title`}\n            size=\"sm\"\n            truncated\n          >\n            {title}\n          </Heading>\n          {subtitle && (\n            <Text\n              className=\"ConversationCard__HeaderText--Subtitle\"\n              data-testid={`${dataTestId}-subtitle`}\n              size=\"sm\"\n              variant=\"subtle\"\n              truncated\n            >\n              {subtitle}\n            </Text>\n          )}\n        </VStack>\n      </HStack>\n      <HStack\n        className=\"ConversationCard__Header--Right\"\n        data-testid={`${dataTestId}-right`}\n        visibility={isHoveringCard ? 'hidden' : 'visible'}\n        align=\"center\"\n        gap={1}\n      >\n        <Timestamp {...timestampProps} />\n        {showNotificationIndicator && (\n          <Box\n            as=\"span\"\n            className=\"ConversationCard__HeaderNotificationCounter\"\n            data-testid={`${dataTestId}-unread-indicator`}\n          >\n            <NotificationCounter size=\"xs\" />\n          </Box>\n        )}\n        {isCardPinned && (\n          <Flex data-testid={`${dataTestId}-pinned-icon`}>\n            <Icon size=\"md\" variant=\"info\" name=\"pin\" />\n          </Flex>\n        )}\n      </HStack>\n    </HStack>\n  );\n};\n","import React from 'react';\nimport { HStack } from '@chakra-ui/react/stack';\nimport { Button } from 'components/Button/button.component';\nimport { Icon } from 'components/Icon/icon.component';\nimport { Menu, MenuProps, MenuItemProps } from 'components/Menu';\n\nexport interface ConversationCardOverlayProps {\n  /** Determines if the conversation is open in an overlay. */\n  isOpenInOverlay?: boolean;\n  /** Callback function to be called when the conversation is opened in an overlay. */\n  onOpenInOverlay: () => void;\n  /** Data test id for the overlay button. */\n  'data-testid'?: string;\n}\n\nexport interface ConversationCardPinProps {\n  /** Determines if the conversation is pinned. */\n  isPinned?: boolean;\n  /** Callback function to called when the conversation is pinned. */\n  onTogglePin: (isPinned: boolean) => void;\n  /** Data test id for the pin button. */\n  'data-testid'?: string;\n}\n\nexport interface ConversationCardButtonsProps {\n  /** Props for the overlay button. */\n  overlayProps?: ConversationCardOverlayProps;\n  /** Props for the pin button. */\n  pinProps?: ConversationCardPinProps;\n  /** Props for the header Menu. */\n  headerMenuProps?: MenuProps;\n  /** Data test id for the buttons.\n   * @default kibble-conversation-card-buttons\n   */\n  'data-testid'?: string;\n}\n\ninterface ConversationCardButtonsComponentProps extends ConversationCardButtonsProps {\n  /** Determines if the conversation is being hovered.\n   * @internal\n   */\n  isHovering: boolean;\n  /** Callback function to set the hover state.\n   * @internal\n   */\n  setIsHovering: (isHovering: boolean) => void;\n}\n\nexport const ConversationCardButtons = ({\n  overlayProps,\n  pinProps,\n  headerMenuProps,\n  isHovering,\n  setIsHovering,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-buttons',\n}: ConversationCardButtonsComponentProps): React.JSX.Element => {\n  const { isOpenInOverlay, onOpenInOverlay, ['data-testid']: overlayDataTestId } = overlayProps || {};\n  const { isPinned, onTogglePin, ['data-testid']: pinDataTestId } = pinProps || {};\n  const { listProps, ['data-testid']: headerMenuDataTestId } = headerMenuProps || {};\n  const pinIconName = isPinned ? 'pinCancel' : 'pin';\n\n  return (\n    <HStack className=\"ConversationCard__Menu\" data-testid={dataTestId} gap={1}>\n      {overlayProps && (\n        <Button\n          className=\"ConversationCard__OverlayButton\"\n          data-testid={overlayDataTestId ? overlayDataTestId : `${dataTestId}-overlay-button`}\n          variant=\"secondarySubtle\"\n          borderRadius=\"sm\"\n          {...(isOpenInOverlay && { active: true })}\n          onClick={(): void => {\n            if (onOpenInOverlay) {\n              onOpenInOverlay();\n            }\n\n            if (isHovering) {\n              setIsHovering(false);\n            }\n          }}\n          iconName=\"popup\"\n          size=\"sm\"\n        />\n      )}\n      {pinProps && (\n        <Button\n          className=\"ConversationCard__PinButton\"\n          data-testid={pinDataTestId ? pinDataTestId : `${dataTestId}-pin-button`}\n          variant={isPinned ? 'secondarySubtleDestructive' : 'secondarySubtle'}\n          borderRadius=\"sm\"\n          onClick={(): void => {\n            if (onTogglePin) {\n              onTogglePin(!isPinned);\n            }\n\n            if (isHovering) {\n              setIsHovering(false);\n            }\n          }}\n          iconName={pinIconName}\n          size=\"sm\"\n        />\n      )}\n      {headerMenuProps && (\n        <Menu\n          buttonProps={\n            headerMenuProps.buttonProps || {\n              variant: 'secondarySubtle',\n              size: 'sm',\n              borderRadius: 'sm',\n              iconName: 'dotsVertical',\n              hideCaret: true,\n              padding: 0,\n            }\n          }\n          closeOnSelect={false}\n          lazyMount\n          data-testid={headerMenuDataTestId ? headerMenuDataTestId : `${dataTestId}-menu`}\n          {...headerMenuProps}\n          listProps={{\n            ...listProps,\n            menuItems: [\n              ...(pinProps\n                ? [\n                    {\n                      label: `${isPinned ? 'Unpin' : 'Pin'} Conversation`,\n                      value: 'PinConversation',\n                      variant: isPinned ? 'danger' : 'default',\n                      leftElement: <Icon size=\"md\" variant={isPinned ? 'danger' : 'default'} name={pinIconName} />,\n                      onSelect: (): void => {\n                        if (onTogglePin) {\n                          onTogglePin(!isPinned);\n                        }\n                      },\n                    } as MenuItemProps,\n                  ]\n                : []),\n              ...(listProps?.menuItems || []),\n            ],\n          }}\n        />\n      )}\n    </HStack>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Wrap, WrapItem } from '@chakra-ui/react/wrap';\nimport { Tag, TagProps } from 'components/Tag/tag.component';\nimport { Tooltip } from 'components/Tooltip/tooltip.component';\n\nexport type ConversationCardTag = TagProps & {\n  /** Content to display in the tooltip. */\n  tooltipContent?: string;\n};\n\nexport interface ConversationCardTagsProps {\n  /** Tags to display in the ConversationCard. */\n  tags: ConversationCardTag[];\n  /** Data test id for the tags.\n   * @default kibble-conversation-card-tags\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardTags = ({\n  tags,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-tags',\n}: ConversationCardTagsProps): React.JSX.Element => {\n  return (\n    <Box className=\"ConversationCard__Tags\" mt={3} data-testid={dataTestId}>\n      <Wrap gap={2}>\n        {tags.map((tag) => {\n          const { tooltipContent, ...rest } = tag;\n          let tagElement = <Tag {...rest} size=\"sm\" textTransform=\"capitalize\" />;\n\n          if (tooltipContent) {\n            tagElement = (\n              <Tooltip label={tooltipContent} placement=\"top\">\n                <Box>{tagElement}</Box>\n              </Tooltip>\n            );\n          }\n\n          return <WrapItem key={tag.label}>{tagElement}</WrapItem>;\n        })}\n      </Wrap>\n    </Box>\n  );\n};\n","import React from 'react';\nimport { Flex } from '@chakra-ui/react/flex';\nimport { Icon, IconProps } from 'components/Icon/icon.component';\nimport { Text, TextProps } from 'components/Text/text.component';\n\nexport interface ConversationCardFooterProps {\n  /** Props for the Icon component. */\n  iconProps?: IconProps;\n  /** Content of the footer. */\n  content: React.ReactNode;\n  /** Props to customize the content styling. */\n  contentProps?: Omit<TextProps, 'children'>;\n  /** Data test id for the footer.\n   * @default kibble-conversation-card-footer\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardFooter = ({\n  iconProps,\n  content,\n  contentProps,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-footer',\n}: ConversationCardFooterProps): React.JSX.Element => {\n  const _content =\n    typeof content === 'string' ? (\n      <Text\n        className=\"ConversationCard__FooterMessage\"\n        data-testid={`${dataTestId}-message`}\n        size=\"sm\"\n        variant=\"subtle\"\n        {...contentProps}\n        {...(iconProps && { ml: 1 })}\n      >\n        {content}\n      </Text>\n    ) : (\n      content\n    );\n  return (\n    <Flex className=\"ConversationCard__Footer\" data-testid={dataTestId} mt={3} alignItems=\"center\">\n      {iconProps && <Icon size=\"sm\" variant=\"subtle\" {...iconProps} />}\n      {_content}\n    </Flex>\n  );\n};\n","import React from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { HStack } from '@chakra-ui/react/stack';\nimport { Text, TextProps } from 'components/Text/text.component';\n\nexport interface ConversationCardContentProps {\n  /** Content of the card. */\n  content?: React.ReactNode;\n  /** Props to customize the content styling. */\n  contentProps?: Omit<TextProps, 'children'>;\n  /** Optional Menu for the card. */\n  contentMenu?: React.ReactNode;\n  /** Data test id for the content.\n   * @default kibble-conversation-card-content\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCardContent = ({\n  contentMenu,\n  content,\n  contentProps,\n  ['data-testid']: dataTestId = 'kibble-conversation-card-content',\n}: ConversationCardContentProps): React.JSX.Element => {\n  const _content =\n    typeof content === 'string' ? (\n      <Text\n        className=\"ConversationCard__Content\"\n        data-testid={`${dataTestId}-content`}\n        truncated\n        size=\"sm\"\n        {...contentProps}\n      >\n        {content}\n      </Text>\n    ) : (\n      content\n    );\n\n  return (\n    <HStack\n      className=\"ConversationCard__ContentContainer\"\n      data-testid={`${dataTestId}-container`}\n      mt={3}\n      justifyContent=\"space-between\"\n      alignItems=\"center\"\n    >\n      {_content}\n      {contentMenu && (\n        <Box className=\"ConversationCard__ContentMenu\" data-testid={`${dataTestId}-menu`} ml=\"auto\">\n          {contentMenu}\n        </Box>\n      )}\n    </HStack>\n  );\n};\n","import React, { useState } from 'react';\nimport { Box } from '@chakra-ui/react/box';\nimport { Card } from 'components/Card/card.component';\nimport { MenuProps } from 'components/Menu/menu.component';\nimport {\n  ConversationCardHeader,\n  ConversationCardHeaderProps,\n} from './components/ConversationCardHeader/conversationCardHeader.component';\nimport {\n  ConversationCardButtons,\n  ConversationCardOverlayProps,\n  ConversationCardPinProps,\n} from './components/ConversationCardButtons/conversationCardButtons.component';\nimport {\n  ConversationCardTag,\n  ConversationCardTags,\n} from './components/ConversationCardTags/conversationCardTags.component';\nimport {\n  ConversationCardFooter,\n  ConversationCardFooterProps,\n} from './components/ConversationCardFooter/conversationCardFooter.component';\nimport {\n  ConversationCardContent,\n  ConversationCardContentProps,\n} from './components/ConversationCardContent/conversationCardContent.component';\nimport { ConversationCardAvatarGroupProps } from './components/ConversationCardAvatarGroup/conversationCardAvatarGroup.component';\n\nexport interface ConversationCardProps extends ConversationCardContentProps {\n  /**\n   * Used to enable hover actions on the ConversationCard.\n   * @default true\n   */\n  allowHoverActions?: boolean;\n  /** Props for the `AvatarGroup` component. */\n  avatarGroupProps?: ConversationCardAvatarGroupProps;\n  /** Props for the ConversationCard footer. */\n  footerProps?: ConversationCardFooterProps;\n  /** Props for the Menu component. See the `Menu` for more details. This component provides a default menu button if none is provided. If menuProps and pinProps are passed together, the component automatically adds a menuItem to control the pinned state. */\n  headerMenuProps?: MenuProps;\n  /** Props for the ConversationCard header. */\n  headerProps: ConversationCardHeaderProps;\n  /**\n   * Used to set the active state of the ConversationCard.\n   * @default false\n   */\n  active?: boolean;\n  /** Callback function for clicking the ConversationCard. */\n  onClick?: () => void;\n  /** Props to show and configure the conversation overlay button. If not passed, the overlay button won't be shown. */\n  overlayProps?: ConversationCardOverlayProps;\n  /** Props for the pin functionality. If not passed, pin functionality won't be shown. */\n  pinProps?: ConversationCardPinProps;\n  /**\n   * Used to preserve the position of the ConversationCard in a list with infinite scrolling.\n   * @default false\n   */\n  shouldPreservePosition?: boolean;\n  /**\n   * Used to show the unread messages indicator.\n   * @default false\n   */\n  showNotificationIndicator?: boolean;\n  /** The tags to be displayed in the ConversationCard. See the `Tag` for more information. Additionally, you can pass in a tooltipContent to customize what is shown in the tooltip. */\n  tags?: ConversationCardTag[];\n  /** Data test id for the conversation card.\n   * @default kibble-conversation-card\n   */\n  'data-testid'?: string;\n}\n\nexport const ConversationCard = ({\n  allowHoverActions = true,\n  avatarGroupProps,\n  content,\n  contentProps,\n  contentMenu,\n  footerProps,\n  headerMenuProps,\n  headerProps,\n  active,\n  onClick,\n  overlayProps,\n  pinProps,\n  shouldPreservePosition = false,\n  showNotificationIndicator,\n  tags,\n  ['data-testid']: dataTestId = 'kibble-conversation-card',\n}: ConversationCardProps): React.JSX.Element => {\n  const { isPinned } = pinProps || {};\n  const [isHovering, setIsHovering] = useState(false);\n\n  return (\n    <Card\n      className=\"ConversationCard\"\n      id=\"conversation-card-item\"\n      data-testid={dataTestId}\n      interactive\n      active={active}\n      size=\"sm\"\n      fullWidth\n      onClick={(): void => {\n        if (onClick) {\n          onClick();\n        }\n      }}\n      bg={showNotificationIndicator || active || isHovering ? 'background.default' : 'background.subtle'}\n      onMouseEnter={(): void => {\n        if (allowHoverActions) {\n          setIsHovering(true);\n        }\n      }}\n      onMouseLeave={(): void => setIsHovering(false)}\n      pos=\"relative\"\n      css={{ overflowAnchor: shouldPreservePosition ? 'auto' : 'none' }}\n    >\n      {isHovering && (\n        <Box\n          className=\"ConversationCard__Button--Container\"\n          data-testid={`${dataTestId}-button-container`}\n          pos=\"absolute\"\n          top={2}\n          zIndex=\"banner\"\n          right={2}\n          bg=\"background\"\n          borderRadius=\"md\"\n          onClick={(e): void => e.stopPropagation()}\n        >\n          <ConversationCardButtons\n            overlayProps={overlayProps}\n            pinProps={pinProps}\n            headerMenuProps={headerMenuProps}\n            isHovering={isHovering}\n            setIsHovering={setIsHovering}\n          />\n        </Box>\n      )}\n      <ConversationCardHeader\n        avatarGroupProps={avatarGroupProps}\n        isHoveringCard={isHovering}\n        isCardPinned={isPinned}\n        showNotificationIndicator={showNotificationIndicator}\n        {...headerProps}\n      />\n      <ConversationCardContent content={content} contentProps={contentProps} contentMenu={contentMenu} />\n      {!!tags?.length && <ConversationCardTags tags={tags} />}\n      {footerProps && <ConversationCardFooter {...footerProps} />}\n    </Card>\n  );\n};\n"],"names":["ConversationCardAvatarGroup","avatars","max","onAvatarGroupClick","tooltipLabel","dataTestId","jsx","Tooltip","Flex","Avatar","e","Fragment","avatar","ConversationCardHeader","avatarGroupProps","timestampProps","isHoveringCard","isCardPinned","title","showNotificationIndicator","subtitle","jsxs","HStack","VStack","Heading","Text","Timestamp","Box","NotificationCounter","Icon","ConversationCardButtons","overlayProps","pinProps","headerMenuProps","isHovering","setIsHovering","isOpenInOverlay","onOpenInOverlay","overlayDataTestId","isPinned","onTogglePin","pinDataTestId","listProps","headerMenuDataTestId","pinIconName","Button","Menu","ConversationCardTags","tags","Wrap","tag","tooltipContent","rest","tagElement","Tag","WrapItem","ConversationCardFooter","iconProps","content","contentProps","_content","ConversationCardContent","contentMenu","ConversationCard","allowHoverActions","footerProps","headerProps","active","onClick","shouldPreservePosition","useState","Card"],"mappings":"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"}

package/dist/cjs/cli/generate-theme-types.cjs

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
-"use strict";const s=require("node:child_process"),n=require("node:fs"),c=require("node:path"),a=require("node:url");var o=typeof document<"u"?document.currentScript:null;const l=()=>{const e=c.resolve(c.dirname(a.fileURLToPath(typeof document>"u"?require("url").pathToFileURL(__filename).href:o&&o.tagName.toUpperCase()==="SCRIPT"&&o.src||new URL("cjs/cli/generate-theme-types.cjs",document.baseURI).href)),"../../../package.json"),t=JSON.parse(n.readFileSync(e,"utf8"));return{cli:t.devDependencies["@chakra-ui/cli"],react:t.dependencies["@chakra-ui/react"]}},u=()=>{const e=c.resolve(process.cwd(),".kibble-temp"),t=c.resolve(e,"theme.config.ts");return n.existsSync(e)||n.mkdirSync(e,{recursive:!0}),n.writeFileSync(t,`
+"use strict";const a=require("node:child_process"),n=require("node:fs"),l=require("node:module"),o=require("node:path");var c=typeof document<"u"?document.currentScript:null;const u=()=>{const e=l.createRequire(typeof document>"u"?require("url").pathToFileURL(__filename).href:c&&c.tagName.toUpperCase()==="SCRIPT"&&c.src||new URL("cjs/cli/generate-theme-types.cjs",document.baseURI).href);try{return e.resolve("@chakra-ui/cli/package.json")}catch(r){const s=r instanceof Error?r.message:String(r);throw new Error(`Could not resolve @chakra-ui/cli, which @televet/kibble-ui depends on. Reinstall @televet/kibble-ui. (${s})`)}},h=()=>{const e=u(),{bin:r}=JSON.parse(n.readFileSync(e,"utf8"));if(!r?.chakra)throw new Error('@chakra-ui/cli does not declare a "chakra" bin entry.');return o.resolve(o.dirname(e),r.chakra)},m=()=>{const e=o.resolve(process.cwd(),".kibble-temp"),r=o.resolve(e,"theme.config.ts");return n.existsSync(e)||n.mkdirSync(e,{recursive:!0}),n.writeFileSync(r,`
 import { system } from "@televet/kibble-ui/theme";
 export default system;
-`),t},i=e=>{const t=c.dirname(e);n.rmSync(t,{recursive:!0,force:!0})};let r;try{console.log("🐕 Kibble UI: Creating temporary theme configuration..."),r=u(),console.log("🐕 Kibble UI: Generating theme types...");const{cli:e,react:t}=l();s.execSync(`npx --yes -p @chakra-ui/cli@${e} -p @chakra-ui/react@${t} chakra typegen ${r}`,{stdio:"inherit"}),console.log("🐕 Kibble UI: Cleaning up..."),i(r),console.log("✨ Kibble UI: Theme types generated successfully!")}catch(e){if(console.error("❌ Kibble UI: Failed to generate theme types."),console.error(e),r)try{i(r)}catch{}process.exit(1)}
+`),r},i=e=>{const r=o.dirname(e);n.rmSync(r,{recursive:!0,force:!0})};let t;try{console.log("🐕 Kibble UI: Creating temporary theme configuration..."),t=m(),console.log("🐕 Kibble UI: Generating theme types..."),a.execFileSync(process.execPath,[h(),"typegen",t],{stdio:"inherit"}),console.log("🐕 Kibble UI: Cleaning up..."),i(t),console.log("✨ Kibble UI: Theme types generated successfully!")}catch(e){if(console.error("❌ Kibble UI: Failed to generate theme types."),console.error(e),t)try{i(t)}catch{}process.exit(1)}
 //# sourceMappingURL=generate-theme-types.cjs.map

package/dist/cjs/cli/generate-theme-types.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"generate-theme-types.cjs","sources":["../../../src/cli/generate-theme-types.ts"],"sourcesContent":["#!/usr/bin/env node\n\nimport { execSync } from 'node:child_process';\nimport { existsSync, mkdirSync, writeFileSync, rmSync, readFileSync } from 'node:fs';\nimport { dirname, resolve } from 'node:path';\nimport { fileURLToPath } from 'node:url';\n\n// Read kibble-ui's own pinned @chakra-ui/cli and @chakra-ui/react versions so the\n// npx-installed CLI always matches what this package was built and tested against,\n// instead of drifting out of sync with a second hardcoded copy of the versions.\nconst getChakraVersions = (): { cli: string; react: string } => {\n  const packageJsonPath = resolve(dirname(fileURLToPath(import.meta.url)), '../../../package.json');\n  const packageJson = JSON.parse(readFileSync(packageJsonPath, 'utf8'));\n  return {\n    cli: packageJson.devDependencies['@chakra-ui/cli'],\n    react: packageJson.dependencies['@chakra-ui/react'],\n  };\n};\n\n// Create a temporary theme config file that imports from kibble-ui\nconst createTempThemeConfig = (): string => {\n  const tempDir = resolve(process.cwd(), '.kibble-temp');\n  const tempFile = resolve(tempDir, 'theme.config.ts');\n\n  if (!existsSync(tempDir)) {\n    mkdirSync(tempDir, { recursive: true });\n  }\n\n  const configContent = `\nimport { system } from \"@televet/kibble-ui/theme\";\nexport default system;\n`;\n\n  writeFileSync(tempFile, configContent);\n  return tempFile;\n};\n\n// Clean up temporary files\nconst cleanup = (tempFile: string): void => {\n  const tempDir = dirname(tempFile);\n  rmSync(tempDir, { recursive: true, force: true });\n};\n\nlet tempFile: string | undefined;\n\ntry {\n  console.log('🐕 Kibble UI: Creating temporary theme configuration...');\n  tempFile = createTempThemeConfig();\n\n  console.log('🐕 Kibble UI: Generating theme types...');\n  // @chakra-ui/cli only lists @chakra-ui/react as a peerDependency, and npx's isolated\n  // install of a bare `npx @chakra-ui/cli` doesn't reliably pull it in (varies by npm\n  // version). Installing both explicitly into the same npx-isolated tree fixes resolution.\n  const { cli: chakraCliVersion, react: chakraReactVersion } = getChakraVersions();\n  execSync(\n    `npx --yes -p @chakra-ui/cli@${chakraCliVersion} -p @chakra-ui/react@${chakraReactVersion} chakra typegen ${tempFile}`,\n    { stdio: 'inherit' },\n  );\n\n  console.log('🐕 Kibble UI: Cleaning up...');\n  cleanup(tempFile);\n\n  console.log('✨ Kibble UI: Theme types generated successfully!');\n} catch (error) {\n  console.error('❌ Kibble UI: Failed to generate theme types.');\n  console.error(error);\n\n  if (tempFile) {\n    try {\n      cleanup(tempFile);\n    } catch {\n      // Best-effort cleanup — the error above is the one that matters.\n    }\n  }\n\n  process.exit(1);\n}\n"],"names":["getChakraVersions","packageJsonPath","resolve","dirname","fileURLToPath","_documentCurrentScript","packageJson","readFileSync","createTempThemeConfig","tempDir","tempFile","existsSync","mkdirSync","writeFileSync","cleanup","rmSync","chakraCliVersion","chakraReactVersion","execSync","error"],"mappings":";2KAUA,MAAMA,EAAoB,IAAsC,CACxD,MAAAC,EAAkBC,EAAAA,QAAQC,EAAQ,QAAAC,EAAA,cAA6B,OAAA,SAAA,IAAA,QAAA,KAAA,EAAA,cAAA,UAAA,EAAA,KAAAC,GAAAA,EAAA,QAAA,YAAA,IAAA,UAAAA,EAAA,KAAA,IAAA,IAAA,mCAAA,SAAA,OAAA,EAAA,IAAA,CAAC,EAAG,uBAAuB,EAC1FC,EAAc,KAAK,MAAMC,EAAAA,aAAaN,EAAiB,MAAM,CAAC,EAC7D,MAAA,CACL,IAAKK,EAAY,gBAAgB,gBAAgB,EACjD,MAAOA,EAAY,aAAa,kBAAkB,CACpD,CACF,EAGME,EAAwB,IAAc,CAC1C,MAAMC,EAAUP,EAAA,QAAQ,QAAQ,IAAA,EAAO,cAAc,EAC/CQ,EAAWR,EAAAA,QAAQO,EAAS,iBAAiB,EAE/C,OAACE,EAAAA,WAAWF,CAAO,GACrBG,EAAAA,UAAUH,EAAS,CAAE,UAAW,EAAA,CAAM,EAQxCI,EAAA,cAAcH,EALQ;AAAA;AAAA;AAAA,CAKe,EAC9BA,CACT,EAGMI,EAAWJ,GAA2B,CACpC,MAAAD,EAAUN,UAAQO,CAAQ,EAChCK,EAAA,OAAON,EAAS,CAAE,UAAW,GAAM,MAAO,GAAM,CAClD,EAEA,IAAIC,EAEJ,GAAI,CACF,QAAQ,IAAI,yDAAyD,EACrEA,EAAWF,EAAsB,EAEjC,QAAQ,IAAI,yCAAyC,EAIrD,KAAM,CAAE,IAAKQ,EAAkB,MAAOC,CAAA,EAAuBjB,EAAkB,EAC/EkB,EAAA,SACE,+BAA+BF,CAAgB,wBAAwBC,CAAkB,mBAAmBP,CAAQ,GACpH,CAAE,MAAO,SAAU,CACrB,EAEA,QAAQ,IAAI,8BAA8B,EAC1CI,EAAQJ,CAAQ,EAEhB,QAAQ,IAAI,kDAAkD,CAChE,OAASS,EAAO,CAId,GAHA,QAAQ,MAAM,8CAA8C,EAC5D,QAAQ,MAAMA,CAAK,EAEfT,EACE,GAAA,CACFI,EAAQJ,CAAQ,CAAA,MACV,CAAA,CAKV,QAAQ,KAAK,CAAC,CAChB"}
+{"version":3,"file":"generate-theme-types.cjs","sources":["../../../src/cli/generate-theme-types.ts"],"sourcesContent":["#!/usr/bin/env node\n\nimport { execFileSync } from 'node:child_process';\nimport { existsSync, mkdirSync, writeFileSync, rmSync, readFileSync } from 'node:fs';\nimport { createRequire } from 'node:module';\nimport { dirname, resolve } from 'node:path';\n\nconst resolveChakraPackageJsonPath = (): string => {\n  const require = createRequire(import.meta.url);\n  try {\n    return require.resolve('@chakra-ui/cli/package.json');\n  } catch (cause) {\n    // src/cli is also compiled by tsconfig.app.json at lib ES2020, which has no Error cause option.\n    const reason = cause instanceof Error ? cause.message : String(cause);\n    throw new Error(\n      `Could not resolve @chakra-ui/cli, which @televet/kibble-ui depends on. Reinstall @televet/kibble-ui. (${reason})`,\n    );\n  }\n};\n\n// Resolve the installed @chakra-ui/cli binary so typegen runs offline, with no npx install step.\nconst resolveChakraBin = (): string => {\n  const packageJsonPath = resolveChakraPackageJsonPath();\n  const { bin } = JSON.parse(readFileSync(packageJsonPath, 'utf8')) as { bin?: Record<string, string> };\n  if (!bin?.chakra) {\n    throw new Error('@chakra-ui/cli does not declare a \"chakra\" bin entry.');\n  }\n  return resolve(dirname(packageJsonPath), bin.chakra);\n};\n\n// Create a temporary theme config file that imports from kibble-ui\nconst createTempThemeConfig = (): string => {\n  const tempDir = resolve(process.cwd(), '.kibble-temp');\n  const tempFile = resolve(tempDir, 'theme.config.ts');\n\n  if (!existsSync(tempDir)) {\n    mkdirSync(tempDir, { recursive: true });\n  }\n\n  const configContent = `\nimport { system } from \"@televet/kibble-ui/theme\";\nexport default system;\n`;\n\n  writeFileSync(tempFile, configContent);\n  return tempFile;\n};\n\n// Clean up temporary files\nconst cleanup = (tempFile: string): void => {\n  const tempDir = dirname(tempFile);\n  rmSync(tempDir, { recursive: true, force: true });\n};\n\nlet tempFile: string | undefined;\n\ntry {\n  console.log('🐕 Kibble UI: Creating temporary theme configuration...');\n  tempFile = createTempThemeConfig();\n\n  console.log('🐕 Kibble UI: Generating theme types...');\n  execFileSync(process.execPath, [resolveChakraBin(), 'typegen', tempFile], { stdio: 'inherit' });\n\n  console.log('🐕 Kibble UI: Cleaning up...');\n  cleanup(tempFile);\n\n  console.log('✨ Kibble UI: Theme types generated successfully!');\n} catch (error) {\n  console.error('❌ Kibble UI: Failed to generate theme types.');\n  console.error(error);\n\n  if (tempFile) {\n    try {\n      cleanup(tempFile);\n    } catch {\n      // Best-effort cleanup — the error above is the one that matters.\n    }\n  }\n\n  process.exit(1);\n}\n"],"names":["resolveChakraPackageJsonPath","require","createRequire","cause","reason","resolveChakraBin","packageJsonPath","bin","readFileSync","resolve","dirname","createTempThemeConfig","tempDir","tempFile","existsSync","mkdirSync","writeFileSync","cleanup","rmSync","execFileSync","error"],"mappings":";8KAOA,MAAMA,EAA+B,IAAc,CAC3C,MAAAC,EAAUC,EAAc,+LAAe,EACzC,GAAA,CACK,OAAAD,EAAQ,QAAQ,6BAA6B,QAC7CE,EAAO,CAEd,MAAMC,EAASD,aAAiB,MAAQA,EAAM,QAAU,OAAOA,CAAK,EACpE,MAAM,IAAI,MACR,yGAAyGC,CAAM,GACjH,CAAA,CAEJ,EAGMC,EAAmB,IAAc,CACrC,MAAMC,EAAkBN,EAA6B,EAC/C,CAAE,IAAAO,GAAQ,KAAK,MAAMC,eAAaF,EAAiB,MAAM,CAAC,EAC5D,GAAA,CAACC,GAAK,OACF,MAAA,IAAI,MAAM,uDAAuD,EAEzE,OAAOE,EAAQ,QAAAC,EAAA,QAAQJ,CAAe,EAAGC,EAAI,MAAM,CACrD,EAGMI,EAAwB,IAAc,CAC1C,MAAMC,EAAUH,EAAA,QAAQ,QAAQ,IAAA,EAAO,cAAc,EAC/CI,EAAWJ,EAAAA,QAAQG,EAAS,iBAAiB,EAE/C,OAACE,EAAAA,WAAWF,CAAO,GACrBG,EAAAA,UAAUH,EAAS,CAAE,UAAW,EAAA,CAAM,EAQxCI,EAAA,cAAcH,EALQ;AAAA;AAAA;AAAA,CAKe,EAC9BA,CACT,EAGMI,EAAWJ,GAA2B,CACpC,MAAAD,EAAUF,UAAQG,CAAQ,EAChCK,EAAA,OAAON,EAAS,CAAE,UAAW,GAAM,MAAO,GAAM,CAClD,EAEA,IAAIC,EAEJ,GAAI,CACF,QAAQ,IAAI,yDAAyD,EACrEA,EAAWF,EAAsB,EAEjC,QAAQ,IAAI,yCAAyC,EACxCQ,EAAAA,aAAA,QAAQ,SAAU,CAACd,EAAiB,EAAG,UAAWQ,CAAQ,EAAG,CAAE,MAAO,UAAW,EAE9F,QAAQ,IAAI,8BAA8B,EAC1CI,EAAQJ,CAAQ,EAEhB,QAAQ,IAAI,kDAAkD,CAChE,OAASO,EAAO,CAId,GAHA,QAAQ,MAAM,8CAA8C,EAC5D,QAAQ,MAAMA,CAAK,EAEfP,EACE,GAAA,CACFI,EAAQJ,CAAQ,CAAA,MACV,CAAA,CAKV,QAAQ,KAAK,CAAC,CAChB"}

package/dist/cjs/components/Card/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../chunks/card.component-BmBiYbMV.js"),r=require("../../../chunks/card.types-MvkQTTZF.js");exports.Card=e.Card;exports.cardSizes=r.cardSizes;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../chunks/card.component-Z7HRGxC4.js"),r=require("../../../chunks/card.types-MvkQTTZF.js");exports.Card=e.Card;exports.cardSizes=r.cardSizes;
 //# sourceMappingURL=index.cjs.map

package/dist/cjs/components/ConversationCard/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../chunks/conversationCard.component-BM1FexSR.js");exports.ConversationCard=e.ConversationCard;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../chunks/conversationCard.component-ESYyuGvU.js");exports.ConversationCard=e.ConversationCard;
 //# sourceMappingURL=index.cjs.map

package/dist/cjs/components/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("../../chunks/alert.component-1-RhljlT.js"),g=require("../../chunks/alert.types-8mtsdXr4.js"),y=require("../../chunks/avatar.component-BGgZoVJS.js"),c=require("../../chunks/avatar.types-Bmt5Uhfb.js"),b=require("../../chunks/avatarGroup.component-ClqXmemB.js"),P=require("../../chunks/button.component-DjdgBXDC.js"),e=require("../../chunks/button.types-DXP4uRV8.js"),C=require("../../chunks/buttonGroup.component-BRafsTrY.js"),o=require("../../chunks/calendar.component-Dt452bDI.js"),k=require("../../chunks/card.component-BmBiYbMV.js"),z=require("../../chunks/card.types-MvkQTTZF.js"),h=require("../../chunks/characterCounter.component-CczgC612.js"),B=require("../../chunks/checkbox.component-CyVZ9Xv2.js"),D=require("../../chunks/checkboxGroup.component-DVEQJk7I.js"),I=require("../../chunks/conversationCard.component-BM1FexSR.js"),x=require("../../chunks/datePicker.component-CLkxmQLL.js"),V=require("../../chunks/datePicker.provider-CcGhcyCp.js"),n=require("../../chunks/dateTimePicker.component-DS_GGUy_.js"),f=require("../../chunks/divider.component-BX3zyB7O.js"),r=require("../../chunks/divider.types-DBNcs0IR.js"),A=require("../../chunks/heading.component-DeM4h5rY.js"),R=require("../../chunks/icon.component-B1hr5lLa.js"),W=require("../../chunks/icon.types-2obj_NKG.js"),G=require("../../chunks/link.component-_YXG8MDq.js"),p=require("../../chunks/logo.types-88a31xCx.js"),u=require("../../chunks/maintenanceBanner.types-CPr8G6Hj.js"),M=require("../../chunks/menu.component-B_rE1WZ2.js"),t=require("../../chunks/modal.types-CfN8ElV6.js"),w=require("../../chunks/notificationCounter.component-Cmpqouio.js"),d=require("../../chunks/notificationCounter.types-B_-siNfi.js"),L=require("../../chunks/picture.component-BA2hgdZy.js"),m=require("../../chunks/pinInput.types-CtkczGt3.js"),O=require("../../chunks/popover.component-Cw6-018C.js"),i=require("../../chunks/popover.types-ChA9ccQ2.js"),a=require("../../chunks/radioGroup.types-BIhmFPWh.js"),F=require("../../chunks/radiomark.component-YJNr68s7.js"),N=require("../../chunks/rating.component-C6qlmmF7.js"),E=require("../../chunks/ratingDots.component-CMljyqn1.js"),H=require("../../chunks/select.component-LmZa9UrH.js"),K=require("../../chunks/sortableList.component-DX9EP39N.js"),j=require("../../chunks/spinner.component-0tE7mnxi.js"),J=require("../../chunks/spinner.types-BCLN5-H2.js"),l=require("../../chunks/styledAvatar.types-BG2G_U-W.js"),_=require("../../chunks/swatch.types-AZLB8OWG.js"),Q=require("../../chunks/switch.component-BSdPjnqI.js"),s=require("../../chunks/tab.types-C3Si454B.js"),U=require("../../chunks/tag.component-C98Wf07v.js"),q=require("../../chunks/tag.types-BnDFgTvb.js"),v=require("../../chunks/tagBlock.component-DFnrBQW3.js"),X=require("../../chunks/text.component-D5GpbfNx.js"),Y=require("../../chunks/textInput.component-KjxR5ln_.js"),Z=require("../../chunks/textarea.component-BtE7Ec9v.js"),S=require("../../chunks/timePicker.component-uf5hCWTW.js"),$=require("../../chunks/timeRange.component-CjQ7PYJR.js"),ee=require("../../chunks/timestamp.component-CRTYMLmn.js"),te=require("./Toast/index.cjs"),oe=require("../../chunks/tooltip.component-DBw-hAPU.js"),ne=require("../../chunks/numberInput.component-B7c9cP1S.js");exports.Alert=T.Alert;exports.alertButtonPositions=g.alertButtonPositions;exports.Avatar=y.Avatar;exports.avatarSizes=c.avatarSizes;exports.avatarVariants=c.avatarVariants;exports.AvatarGroup=b.AvatarGroup;exports.Button=P.Button;exports.buttonConfigVariants=e.buttonConfigVariants;exports.buttonIconPositions=e.buttonIconPositions;exports.buttonSizes=e.buttonSizes;exports.buttonSpinnerPlacements=e.buttonSpinnerPlacements;exports.buttonVariants=e.buttonVariants;exports.ButtonGroup=C.ButtonGroup;exports.Calendar=o.Calendar;exports.CalendarFooterButton=o.CalendarFooterButton;exports.isRangePreset=o.isRangePreset;exports.Card=k.Card;exports.cardSizes=z.cardSizes;exports.CharacterCounter=h.CharacterCounter;exports.Checkbox=B.WrappedCheckbox;exports.CheckboxGroup=D.WrappedCheckboxGroup;exports.ConversationCard=I.ConversationCard;exports.DatePicker=x.DatePicker;exports.DateFormats=V.DateFormats;exports.DateTimePicker=n.DateTimePicker;exports.DateTimePickerDefaultOptionValue=n.DateTimePickerDefaultOptionValue;exports.calendarViews=n.calendarViews;exports.Divider=f.Divider;exports.dividerOrientations=r.dividerOrientations;exports.dividerSizes=r.dividerSizes;exports.dividerVariants=r.dividerVariants;exports.Heading=A.WrappedHeading;exports.Icon=R.Icon;exports.iconSizes=W.iconSizes;exports.Link=G.Link;exports.Logo=p.Logo;exports.logoTypes=p.logoTypes;exports.MaintenanceBanner=u.MaintenanceBanner;exports.maintenanceBannerEnvKeys=u.maintenanceBannerEnvKeys;exports.Menu=M.Menu;exports.Modal=t.Modal;exports.modalMotionPresets=t.modalMotionPresets;exports.modalPlacements=t.modalPlacements;exports.modalScrollBehaviors=t.modalScrollBehaviors;exports.modalSizes=t.modalSizes;exports.NotificationCounter=w.NotificationCounter;exports.notificationCounterSizes=d.notificationCounterSizes;exports.notificationCounterVariants=d.notificationCounterVariants;exports.Picture=L.Picture;exports.PinInput=m.WrappedPinInput;exports.pinInputTypes=m.pinInputTypes;exports.Popover=O.Popover;exports.popoverSizes=i.popoverSizes;exports.popoverTriggerTypes=i.popoverTriggerTypes;exports.popoverVariants=i.popoverVariants;exports.RadioGroup=a.WrappedRadioGroup;exports.radioAlignments=a.radioAlignments;exports.radioTypes=a.radioTypes;exports.Radiomark=F.Radiomark;exports.Rating=N.WrappedRating;exports.RatingDots=E.WrappedRatingDots;exports.Select=H.WrappedSelect;exports.SortableList=K.SortableList;exports.Spinner=j.Spinner;exports.spinnerSizes=J.spinnerSizes;exports.StyledAvatar=l.StyledAvatar;exports.styledAvatarTypes=l.styledAvatarTypes;exports.Swatch=_.Swatch;exports.swatchSizes=_.swatchSizes;exports.Switch=Q.WrappedSwitch;exports.Tabs=s.Tabs;exports.tabIconPositions=s.tabIconPositions;exports.tabSizes=s.tabSizes;exports.Tag=U.Tag;exports.closeButtonDisplays=q.closeButtonDisplays;exports.tagSizes=q.tagSizes;exports.TagBlock=v.TagBlock;exports.TagDisabledState=v.TagDisabledState;exports.Text=X.WrappedText;exports.TextInput=Y.WrappedTextInput;exports.Textarea=Z.WrappedTextarea;exports.Meridiem=S.Meridiem;exports.TimePicker=S.TimePicker;exports.TimeRange=$.TimeRange;exports.Timestamp=ee.Timestamp;exports.useToast=te.useToast;exports.Tooltip=oe.Tooltip;exports.NumberInput=ne.WrappedNumberInput;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=require("../../chunks/alert.component-1-RhljlT.js"),g=require("../../chunks/alert.types-8mtsdXr4.js"),y=require("../../chunks/avatar.component-BGgZoVJS.js"),c=require("../../chunks/avatar.types-Bmt5Uhfb.js"),b=require("../../chunks/avatarGroup.component-ClqXmemB.js"),P=require("../../chunks/button.component-DjdgBXDC.js"),e=require("../../chunks/button.types-DXP4uRV8.js"),C=require("../../chunks/buttonGroup.component-BRafsTrY.js"),o=require("../../chunks/calendar.component-Dt452bDI.js"),k=require("../../chunks/card.component-Z7HRGxC4.js"),z=require("../../chunks/card.types-MvkQTTZF.js"),h=require("../../chunks/characterCounter.component-CczgC612.js"),B=require("../../chunks/checkbox.component-CyVZ9Xv2.js"),D=require("../../chunks/checkboxGroup.component-DVEQJk7I.js"),I=require("../../chunks/conversationCard.component-ESYyuGvU.js"),x=require("../../chunks/datePicker.component-CLkxmQLL.js"),V=require("../../chunks/datePicker.provider-CcGhcyCp.js"),n=require("../../chunks/dateTimePicker.component-DS_GGUy_.js"),f=require("../../chunks/divider.component-BX3zyB7O.js"),r=require("../../chunks/divider.types-DBNcs0IR.js"),A=require("../../chunks/heading.component-DeM4h5rY.js"),R=require("../../chunks/icon.component-B1hr5lLa.js"),W=require("../../chunks/icon.types-2obj_NKG.js"),G=require("../../chunks/link.component-_YXG8MDq.js"),p=require("../../chunks/logo.types-88a31xCx.js"),u=require("../../chunks/maintenanceBanner.types-CPr8G6Hj.js"),M=require("../../chunks/menu.component-B_rE1WZ2.js"),t=require("../../chunks/modal.types-CfN8ElV6.js"),w=require("../../chunks/notificationCounter.component-Cmpqouio.js"),d=require("../../chunks/notificationCounter.types-B_-siNfi.js"),L=require("../../chunks/picture.component-BA2hgdZy.js"),m=require("../../chunks/pinInput.types-CtkczGt3.js"),O=require("../../chunks/popover.component-Cw6-018C.js"),i=require("../../chunks/popover.types-ChA9ccQ2.js"),a=require("../../chunks/radioGroup.types-BIhmFPWh.js"),F=require("../../chunks/radiomark.component-YJNr68s7.js"),N=require("../../chunks/rating.component-C6qlmmF7.js"),E=require("../../chunks/ratingDots.component-CMljyqn1.js"),H=require("../../chunks/select.component-LmZa9UrH.js"),K=require("../../chunks/sortableList.component-DX9EP39N.js"),j=require("../../chunks/spinner.component-0tE7mnxi.js"),J=require("../../chunks/spinner.types-BCLN5-H2.js"),l=require("../../chunks/styledAvatar.types-BG2G_U-W.js"),_=require("../../chunks/swatch.types-AZLB8OWG.js"),Q=require("../../chunks/switch.component-BSdPjnqI.js"),s=require("../../chunks/tab.types-C3Si454B.js"),U=require("../../chunks/tag.component-C98Wf07v.js"),q=require("../../chunks/tag.types-BnDFgTvb.js"),v=require("../../chunks/tagBlock.component-DFnrBQW3.js"),X=require("../../chunks/text.component-D5GpbfNx.js"),Y=require("../../chunks/textInput.component-KjxR5ln_.js"),Z=require("../../chunks/textarea.component-BtE7Ec9v.js"),S=require("../../chunks/timePicker.component-uf5hCWTW.js"),$=require("../../chunks/timeRange.component-CjQ7PYJR.js"),ee=require("../../chunks/timestamp.component-CRTYMLmn.js"),te=require("./Toast/index.cjs"),oe=require("../../chunks/tooltip.component-DBw-hAPU.js"),ne=require("../../chunks/numberInput.component-B7c9cP1S.js");exports.Alert=T.Alert;exports.alertButtonPositions=g.alertButtonPositions;exports.Avatar=y.Avatar;exports.avatarSizes=c.avatarSizes;exports.avatarVariants=c.avatarVariants;exports.AvatarGroup=b.AvatarGroup;exports.Button=P.Button;exports.buttonConfigVariants=e.buttonConfigVariants;exports.buttonIconPositions=e.buttonIconPositions;exports.buttonSizes=e.buttonSizes;exports.buttonSpinnerPlacements=e.buttonSpinnerPlacements;exports.buttonVariants=e.buttonVariants;exports.ButtonGroup=C.ButtonGroup;exports.Calendar=o.Calendar;exports.CalendarFooterButton=o.CalendarFooterButton;exports.isRangePreset=o.isRangePreset;exports.Card=k.Card;exports.cardSizes=z.cardSizes;exports.CharacterCounter=h.CharacterCounter;exports.Checkbox=B.WrappedCheckbox;exports.CheckboxGroup=D.WrappedCheckboxGroup;exports.ConversationCard=I.ConversationCard;exports.DatePicker=x.DatePicker;exports.DateFormats=V.DateFormats;exports.DateTimePicker=n.DateTimePicker;exports.DateTimePickerDefaultOptionValue=n.DateTimePickerDefaultOptionValue;exports.calendarViews=n.calendarViews;exports.Divider=f.Divider;exports.dividerOrientations=r.dividerOrientations;exports.dividerSizes=r.dividerSizes;exports.dividerVariants=r.dividerVariants;exports.Heading=A.WrappedHeading;exports.Icon=R.Icon;exports.iconSizes=W.iconSizes;exports.Link=G.Link;exports.Logo=p.Logo;exports.logoTypes=p.logoTypes;exports.MaintenanceBanner=u.MaintenanceBanner;exports.maintenanceBannerEnvKeys=u.maintenanceBannerEnvKeys;exports.Menu=M.Menu;exports.Modal=t.Modal;exports.modalMotionPresets=t.modalMotionPresets;exports.modalPlacements=t.modalPlacements;exports.modalScrollBehaviors=t.modalScrollBehaviors;exports.modalSizes=t.modalSizes;exports.NotificationCounter=w.NotificationCounter;exports.notificationCounterSizes=d.notificationCounterSizes;exports.notificationCounterVariants=d.notificationCounterVariants;exports.Picture=L.Picture;exports.PinInput=m.WrappedPinInput;exports.pinInputTypes=m.pinInputTypes;exports.Popover=O.Popover;exports.popoverSizes=i.popoverSizes;exports.popoverTriggerTypes=i.popoverTriggerTypes;exports.popoverVariants=i.popoverVariants;exports.RadioGroup=a.WrappedRadioGroup;exports.radioAlignments=a.radioAlignments;exports.radioTypes=a.radioTypes;exports.Radiomark=F.Radiomark;exports.Rating=N.WrappedRating;exports.RatingDots=E.WrappedRatingDots;exports.Select=H.WrappedSelect;exports.SortableList=K.SortableList;exports.Spinner=j.Spinner;exports.spinnerSizes=J.spinnerSizes;exports.StyledAvatar=l.StyledAvatar;exports.styledAvatarTypes=l.styledAvatarTypes;exports.Swatch=_.Swatch;exports.swatchSizes=_.swatchSizes;exports.Switch=Q.WrappedSwitch;exports.Tabs=s.Tabs;exports.tabIconPositions=s.tabIconPositions;exports.tabSizes=s.tabSizes;exports.Tag=U.Tag;exports.closeButtonDisplays=q.closeButtonDisplays;exports.tagSizes=q.tagSizes;exports.TagBlock=v.TagBlock;exports.TagDisabledState=v.TagDisabledState;exports.Text=X.WrappedText;exports.TextInput=Y.WrappedTextInput;exports.Textarea=Z.WrappedTextarea;exports.Meridiem=S.Meridiem;exports.TimePicker=S.TimePicker;exports.TimeRange=$.TimeRange;exports.Timestamp=ee.Timestamp;exports.useToast=te.useToast;exports.Tooltip=oe.Tooltip;exports.NumberInput=ne.WrappedNumberInput;
 //# sourceMappingURL=index.cjs.map

package/dist/cjs/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("../chunks/alert.component-1-RhljlT.js"),h=require("../chunks/alert.types-8mtsdXr4.js"),S=require("../chunks/avatar.component-BGgZoVJS.js"),u=require("../chunks/avatar.types-Bmt5Uhfb.js"),k=require("../chunks/avatarGroup.component-ClqXmemB.js"),C=require("../chunks/button.component-DjdgBXDC.js"),e=require("../chunks/button.types-DXP4uRV8.js"),P=require("../chunks/buttonGroup.component-BRafsTrY.js"),n=require("../chunks/calendar.component-Dt452bDI.js"),D=require("../chunks/card.component-BmBiYbMV.js"),M=require("../chunks/card.types-MvkQTTZF.js"),z=require("../chunks/characterCounter.component-CczgC612.js"),x=require("../chunks/checkbox.component-CyVZ9Xv2.js"),B=require("../chunks/checkboxGroup.component-DVEQJk7I.js"),V=require("../chunks/conversationCard.component-BM1FexSR.js"),f=require("../chunks/datePicker.component-CLkxmQLL.js"),I=require("../chunks/datePicker.provider-CcGhcyCp.js"),r=require("../chunks/dateTimePicker.component-DS_GGUy_.js"),w=require("../chunks/divider.component-BX3zyB7O.js"),i=require("../chunks/divider.types-DBNcs0IR.js"),A=require("../chunks/heading.component-DeM4h5rY.js"),R=require("../chunks/icon.component-B1hr5lLa.js"),W=require("../chunks/icon.types-2obj_NKG.js"),G=require("../chunks/link.component-_YXG8MDq.js"),d=require("../chunks/logo.types-88a31xCx.js"),m=require("../chunks/maintenanceBanner.types-CPr8G6Hj.js"),L=require("../chunks/menu.component-B_rE1WZ2.js"),t=require("../chunks/modal.types-CfN8ElV6.js"),K=require("../chunks/notificationCounter.component-Cmpqouio.js"),l=require("../chunks/notificationCounter.types-B_-siNfi.js"),O=require("../chunks/picture.component-BA2hgdZy.js"),_=require("../chunks/pinInput.types-CtkczGt3.js"),F=require("../chunks/popover.component-Cw6-018C.js"),a=require("../chunks/popover.types-ChA9ccQ2.js"),s=require("../chunks/radioGroup.types-BIhmFPWh.js"),N=require("../chunks/radiomark.component-YJNr68s7.js"),E=require("../chunks/rating.component-C6qlmmF7.js"),H=require("../chunks/ratingDots.component-CMljyqn1.js"),j=require("../chunks/select.component-LmZa9UrH.js"),J=require("../chunks/sortableList.component-DX9EP39N.js"),Q=require("../chunks/spinner.component-0tE7mnxi.js"),U=require("../chunks/spinner.types-BCLN5-H2.js"),q=require("../chunks/styledAvatar.types-BG2G_U-W.js"),T=require("../chunks/swatch.types-AZLB8OWG.js"),X=require("../chunks/switch.component-BSdPjnqI.js"),c=require("../chunks/tab.types-C3Si454B.js"),Y=require("../chunks/tag.component-C98Wf07v.js"),v=require("../chunks/tag.types-BnDFgTvb.js"),y=require("../chunks/tagBlock.component-DFnrBQW3.js"),Z=require("../chunks/text.component-D5GpbfNx.js"),$=require("../chunks/textInput.component-KjxR5ln_.js"),ee=require("../chunks/textarea.component-BtE7Ec9v.js"),g=require("../chunks/timePicker.component-uf5hCWTW.js"),te=require("../chunks/timeRange.component-CjQ7PYJR.js"),oe=require("../chunks/timestamp.component-CRTYMLmn.js"),ne=require("./components/Toast/index.cjs"),re=require("../chunks/tooltip.component-DBw-hAPU.js"),ie=require("../chunks/numberInput.component-B7c9cP1S.js"),ae=require("../chunks/withDarkMode-R08khTA6.js"),se=require("../chunks/withLightMode-Crw8xtkD.js"),ce=require("./hooks/useBreakpoint/index.cjs"),pe=require("./hooks/useColorMode/index.cjs"),ue=require("./hooks/useColorModeValue/index.cjs"),de=require("./hooks/useDeviceType/index.cjs"),o=require("./shared/types/index.cjs"),me=require("../chunks/theme-BFbOz0Jj.js"),p=require("../chunks/theme.provider-CO6PM6Lp.js");exports.Alert=b.Alert;exports.alertButtonPositions=h.alertButtonPositions;exports.Avatar=S.Avatar;exports.avatarSizes=u.avatarSizes;exports.avatarVariants=u.avatarVariants;exports.AvatarGroup=k.AvatarGroup;exports.Button=C.Button;exports.buttonConfigVariants=e.buttonConfigVariants;exports.buttonIconPositions=e.buttonIconPositions;exports.buttonSizes=e.buttonSizes;exports.buttonSpinnerPlacements=e.buttonSpinnerPlacements;exports.buttonVariants=e.buttonVariants;exports.ButtonGroup=P.ButtonGroup;exports.Calendar=n.Calendar;exports.CalendarFooterButton=n.CalendarFooterButton;exports.isRangePreset=n.isRangePreset;exports.Card=D.Card;exports.cardSizes=M.cardSizes;exports.CharacterCounter=z.CharacterCounter;exports.Checkbox=x.WrappedCheckbox;exports.CheckboxGroup=B.WrappedCheckboxGroup;exports.ConversationCard=V.ConversationCard;exports.DatePicker=f.DatePicker;exports.DateFormats=I.DateFormats;exports.DateTimePicker=r.DateTimePicker;exports.DateTimePickerDefaultOptionValue=r.DateTimePickerDefaultOptionValue;exports.calendarViews=r.calendarViews;exports.Divider=w.Divider;exports.dividerOrientations=i.dividerOrientations;exports.dividerSizes=i.dividerSizes;exports.dividerVariants=i.dividerVariants;exports.Heading=A.WrappedHeading;exports.Icon=R.Icon;exports.iconSizes=W.iconSizes;exports.Link=G.Link;exports.Logo=d.Logo;exports.logoTypes=d.logoTypes;exports.MaintenanceBanner=m.MaintenanceBanner;exports.maintenanceBannerEnvKeys=m.maintenanceBannerEnvKeys;exports.Menu=L.Menu;exports.Modal=t.Modal;exports.modalMotionPresets=t.modalMotionPresets;exports.modalPlacements=t.modalPlacements;exports.modalScrollBehaviors=t.modalScrollBehaviors;exports.modalSizes=t.modalSizes;exports.NotificationCounter=K.NotificationCounter;exports.notificationCounterSizes=l.notificationCounterSizes;exports.notificationCounterVariants=l.notificationCounterVariants;exports.Picture=O.Picture;exports.PinInput=_.WrappedPinInput;exports.pinInputTypes=_.pinInputTypes;exports.Popover=F.Popover;exports.popoverSizes=a.popoverSizes;exports.popoverTriggerTypes=a.popoverTriggerTypes;exports.popoverVariants=a.popoverVariants;exports.RadioGroup=s.WrappedRadioGroup;exports.radioAlignments=s.radioAlignments;exports.radioTypes=s.radioTypes;exports.Radiomark=N.Radiomark;exports.Rating=E.WrappedRating;exports.RatingDots=H.WrappedRatingDots;exports.Select=j.WrappedSelect;exports.SortableList=J.SortableList;exports.Spinner=Q.Spinner;exports.spinnerSizes=U.spinnerSizes;exports.StyledAvatar=q.StyledAvatar;exports.styledAvatarTypes=q.styledAvatarTypes;exports.Swatch=T.Swatch;exports.swatchSizes=T.swatchSizes;exports.Switch=X.WrappedSwitch;exports.Tabs=c.Tabs;exports.tabIconPositions=c.tabIconPositions;exports.tabSizes=c.tabSizes;exports.Tag=Y.Tag;exports.closeButtonDisplays=v.closeButtonDisplays;exports.tagSizes=v.tagSizes;exports.TagBlock=y.TagBlock;exports.TagDisabledState=y.TagDisabledState;exports.Text=Z.WrappedText;exports.TextInput=$.WrappedTextInput;exports.Textarea=ee.WrappedTextarea;exports.Meridiem=g.Meridiem;exports.TimePicker=g.TimePicker;exports.TimeRange=te.TimeRange;exports.Timestamp=oe.Timestamp;exports.useToast=ne.useToast;exports.Tooltip=re.Tooltip;exports.NumberInput=ie.WrappedNumberInput;exports.withDarkMode=ae.withDarkMode;exports.withLightMode=se.withLightMode;exports.useBreakpoint=ce.useBreakpoint;exports.useColorMode=pe.useColorMode;exports.useColorModeValue=ue.useColorModeValue;exports.useDeviceType=de.useDeviceType;exports.alignments=o.alignments;exports.flexDirections=o.flexDirections;exports.placements=o.placements;exports.statuses=o.statuses;exports.typographyVariants=o.typographyVariants;exports.colorModeThemeKey=me.colorModeThemeKey;exports.KibbleThemeProvider=p.KibbleThemeProvider;exports.kibbleThemeConfig=p.kibbleThemeConfig;exports.system=p.system;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("../chunks/alert.component-1-RhljlT.js"),h=require("../chunks/alert.types-8mtsdXr4.js"),S=require("../chunks/avatar.component-BGgZoVJS.js"),u=require("../chunks/avatar.types-Bmt5Uhfb.js"),k=require("../chunks/avatarGroup.component-ClqXmemB.js"),C=require("../chunks/button.component-DjdgBXDC.js"),e=require("../chunks/button.types-DXP4uRV8.js"),P=require("../chunks/buttonGroup.component-BRafsTrY.js"),n=require("../chunks/calendar.component-Dt452bDI.js"),D=require("../chunks/card.component-Z7HRGxC4.js"),M=require("../chunks/card.types-MvkQTTZF.js"),z=require("../chunks/characterCounter.component-CczgC612.js"),x=require("../chunks/checkbox.component-CyVZ9Xv2.js"),B=require("../chunks/checkboxGroup.component-DVEQJk7I.js"),V=require("../chunks/conversationCard.component-ESYyuGvU.js"),f=require("../chunks/datePicker.component-CLkxmQLL.js"),I=require("../chunks/datePicker.provider-CcGhcyCp.js"),r=require("../chunks/dateTimePicker.component-DS_GGUy_.js"),w=require("../chunks/divider.component-BX3zyB7O.js"),i=require("../chunks/divider.types-DBNcs0IR.js"),A=require("../chunks/heading.component-DeM4h5rY.js"),R=require("../chunks/icon.component-B1hr5lLa.js"),W=require("../chunks/icon.types-2obj_NKG.js"),G=require("../chunks/link.component-_YXG8MDq.js"),d=require("../chunks/logo.types-88a31xCx.js"),m=require("../chunks/maintenanceBanner.types-CPr8G6Hj.js"),L=require("../chunks/menu.component-B_rE1WZ2.js"),t=require("../chunks/modal.types-CfN8ElV6.js"),K=require("../chunks/notificationCounter.component-Cmpqouio.js"),l=require("../chunks/notificationCounter.types-B_-siNfi.js"),O=require("../chunks/picture.component-BA2hgdZy.js"),_=require("../chunks/pinInput.types-CtkczGt3.js"),F=require("../chunks/popover.component-Cw6-018C.js"),a=require("../chunks/popover.types-ChA9ccQ2.js"),s=require("../chunks/radioGroup.types-BIhmFPWh.js"),N=require("../chunks/radiomark.component-YJNr68s7.js"),E=require("../chunks/rating.component-C6qlmmF7.js"),H=require("../chunks/ratingDots.component-CMljyqn1.js"),j=require("../chunks/select.component-LmZa9UrH.js"),J=require("../chunks/sortableList.component-DX9EP39N.js"),Q=require("../chunks/spinner.component-0tE7mnxi.js"),U=require("../chunks/spinner.types-BCLN5-H2.js"),q=require("../chunks/styledAvatar.types-BG2G_U-W.js"),T=require("../chunks/swatch.types-AZLB8OWG.js"),X=require("../chunks/switch.component-BSdPjnqI.js"),c=require("../chunks/tab.types-C3Si454B.js"),Y=require("../chunks/tag.component-C98Wf07v.js"),v=require("../chunks/tag.types-BnDFgTvb.js"),y=require("../chunks/tagBlock.component-DFnrBQW3.js"),Z=require("../chunks/text.component-D5GpbfNx.js"),$=require("../chunks/textInput.component-KjxR5ln_.js"),ee=require("../chunks/textarea.component-BtE7Ec9v.js"),g=require("../chunks/timePicker.component-uf5hCWTW.js"),te=require("../chunks/timeRange.component-CjQ7PYJR.js"),oe=require("../chunks/timestamp.component-CRTYMLmn.js"),ne=require("./components/Toast/index.cjs"),re=require("../chunks/tooltip.component-DBw-hAPU.js"),ie=require("../chunks/numberInput.component-B7c9cP1S.js"),ae=require("../chunks/withDarkMode-R08khTA6.js"),se=require("../chunks/withLightMode-Crw8xtkD.js"),ce=require("./hooks/useBreakpoint/index.cjs"),pe=require("./hooks/useColorMode/index.cjs"),ue=require("./hooks/useColorModeValue/index.cjs"),de=require("./hooks/useDeviceType/index.cjs"),o=require("./shared/types/index.cjs"),me=require("../chunks/theme-BFbOz0Jj.js"),p=require("../chunks/theme.provider-CO6PM6Lp.js");exports.Alert=b.Alert;exports.alertButtonPositions=h.alertButtonPositions;exports.Avatar=S.Avatar;exports.avatarSizes=u.avatarSizes;exports.avatarVariants=u.avatarVariants;exports.AvatarGroup=k.AvatarGroup;exports.Button=C.Button;exports.buttonConfigVariants=e.buttonConfigVariants;exports.buttonIconPositions=e.buttonIconPositions;exports.buttonSizes=e.buttonSizes;exports.buttonSpinnerPlacements=e.buttonSpinnerPlacements;exports.buttonVariants=e.buttonVariants;exports.ButtonGroup=P.ButtonGroup;exports.Calendar=n.Calendar;exports.CalendarFooterButton=n.CalendarFooterButton;exports.isRangePreset=n.isRangePreset;exports.Card=D.Card;exports.cardSizes=M.cardSizes;exports.CharacterCounter=z.CharacterCounter;exports.Checkbox=x.WrappedCheckbox;exports.CheckboxGroup=B.WrappedCheckboxGroup;exports.ConversationCard=V.ConversationCard;exports.DatePicker=f.DatePicker;exports.DateFormats=I.DateFormats;exports.DateTimePicker=r.DateTimePicker;exports.DateTimePickerDefaultOptionValue=r.DateTimePickerDefaultOptionValue;exports.calendarViews=r.calendarViews;exports.Divider=w.Divider;exports.dividerOrientations=i.dividerOrientations;exports.dividerSizes=i.dividerSizes;exports.dividerVariants=i.dividerVariants;exports.Heading=A.WrappedHeading;exports.Icon=R.Icon;exports.iconSizes=W.iconSizes;exports.Link=G.Link;exports.Logo=d.Logo;exports.logoTypes=d.logoTypes;exports.MaintenanceBanner=m.MaintenanceBanner;exports.maintenanceBannerEnvKeys=m.maintenanceBannerEnvKeys;exports.Menu=L.Menu;exports.Modal=t.Modal;exports.modalMotionPresets=t.modalMotionPresets;exports.modalPlacements=t.modalPlacements;exports.modalScrollBehaviors=t.modalScrollBehaviors;exports.modalSizes=t.modalSizes;exports.NotificationCounter=K.NotificationCounter;exports.notificationCounterSizes=l.notificationCounterSizes;exports.notificationCounterVariants=l.notificationCounterVariants;exports.Picture=O.Picture;exports.PinInput=_.WrappedPinInput;exports.pinInputTypes=_.pinInputTypes;exports.Popover=F.Popover;exports.popoverSizes=a.popoverSizes;exports.popoverTriggerTypes=a.popoverTriggerTypes;exports.popoverVariants=a.popoverVariants;exports.RadioGroup=s.WrappedRadioGroup;exports.radioAlignments=s.radioAlignments;exports.radioTypes=s.radioTypes;exports.Radiomark=N.Radiomark;exports.Rating=E.WrappedRating;exports.RatingDots=H.WrappedRatingDots;exports.Select=j.WrappedSelect;exports.SortableList=J.SortableList;exports.Spinner=Q.Spinner;exports.spinnerSizes=U.spinnerSizes;exports.StyledAvatar=q.StyledAvatar;exports.styledAvatarTypes=q.styledAvatarTypes;exports.Swatch=T.Swatch;exports.swatchSizes=T.swatchSizes;exports.Switch=X.WrappedSwitch;exports.Tabs=c.Tabs;exports.tabIconPositions=c.tabIconPositions;exports.tabSizes=c.tabSizes;exports.Tag=Y.Tag;exports.closeButtonDisplays=v.closeButtonDisplays;exports.tagSizes=v.tagSizes;exports.TagBlock=y.TagBlock;exports.TagDisabledState=y.TagDisabledState;exports.Text=Z.WrappedText;exports.TextInput=$.WrappedTextInput;exports.Textarea=ee.WrappedTextarea;exports.Meridiem=g.Meridiem;exports.TimePicker=g.TimePicker;exports.TimeRange=te.TimeRange;exports.Timestamp=oe.Timestamp;exports.useToast=ne.useToast;exports.Tooltip=re.Tooltip;exports.NumberInput=ie.WrappedNumberInput;exports.withDarkMode=ae.withDarkMode;exports.withLightMode=se.withLightMode;exports.useBreakpoint=ce.useBreakpoint;exports.useColorMode=pe.useColorMode;exports.useColorModeValue=ue.useColorModeValue;exports.useDeviceType=de.useDeviceType;exports.alignments=o.alignments;exports.flexDirections=o.flexDirections;exports.placements=o.placements;exports.statuses=o.statuses;exports.typographyVariants=o.typographyVariants;exports.colorModeThemeKey=me.colorModeThemeKey;exports.KibbleThemeProvider=p.KibbleThemeProvider;exports.kibbleThemeConfig=p.kibbleThemeConfig;exports.system=p.system;
 //# sourceMappingURL=index.cjs.map

package/dist/components.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": 1,
-  "kibbleVersion": "5.2.0",
-  "generatedAt": "2026-10-13T21:56:00.915Z",
+  "kibbleVersion": "5.3.1",
+  "generatedAt": "2026-11-03T21:08:02.861Z",
   "storybookBase": "https://televet.github.io/kibble-ui",
   "propsScope": "Props declared in kibble-ui. Inherited Chakra style and DOM props are summarised in extendsType.",
   "components": [
@@ -1422,6 +1422,14 @@
         {
           "name": "Invalid",
           "argsSource": "{\n    size: 'md',\n    children: \"I'm an invalid card!\",\n    interactive: true,\n    active: false,\n    fullWidth: false,\n    invalid: true,\n  }"
+        },
+        {
+          "name": "NonInteractiveInvalid",
+          "argsSource": "{\n    size: 'md',\n    children: \"I'm an invalid card that you can't click!\",\n    fullWidth: false,\n    invalid: true,\n  }"
+        },
+        {
+          "name": "NonInteractiveInvalidOnContrast",
+          "argsSource": "{\n    size: 'md',\n    children: <Text variant=\"onContrast\">I&apos;m an invalid card on a contrasting surface.</Text>,\n    fullWidth: false,\n    invalid: true,\n    onContrast: true,\n  }"
         }
       ],
       "hasStories": true,
@@ -1464,7 +1472,7 @@
           "name": "invalid",
           "type": "boolean",
           "required": false,
-          "description": "*Only applicable when the `interactive` prop is `true`. If `true`, the card will be styled with a red border.",
+          "description": "If `true`, the card will be styled with a red border. Visual only: the message and the screen\nreader announcement come from the controls inside the card.",
           "defaultValue": "false"
         },
         {

package/dist/esm/cli/generate-theme-types.js

@@ -1,36 +1,40 @@
 #!/usr/bin/env node
-import { execSync as i } from "node:child_process";
-import { existsSync as s, mkdirSync as a, writeFileSync as l, readFileSync as m, rmSync as p } from "node:fs";
-import { resolve as o, dirname as n } from "node:path";
-import { fileURLToPath as u } from "node:url";
-const h = () => {
-  const e = o(n(u(import.meta.url)), "../../../package.json"), t = JSON.parse(m(e, "utf8"));
-  return {
-    cli: t.devDependencies["@chakra-ui/cli"],
-    react: t.dependencies["@chakra-ui/react"]
-  };
+import { execFileSync as s } from "node:child_process";
+import { existsSync as a, mkdirSync as l, writeFileSync as m, readFileSync as p, rmSync as u } from "node:fs";
+import { createRequire as h } from "node:module";
+import { resolve as o, dirname as i } from "node:path";
+const b = () => {
+  const e = h(import.meta.url);
+  try {
+    return e.resolve("@chakra-ui/cli/package.json");
+  } catch (r) {
+    const n = r instanceof Error ? r.message : String(r);
+    throw new Error(
+      `Could not resolve @chakra-ui/cli, which @televet/kibble-ui depends on. Reinstall @televet/kibble-ui. (${n})`
+    );
+  }
 }, g = () => {
-  const e = o(process.cwd(), ".kibble-temp"), t = o(e, "theme.config.ts");
-  return s(e) || a(e, { recursive: !0 }), l(t, `
+  const e = b(), { bin: r } = JSON.parse(p(e, "utf8"));
+  if (!r?.chakra)
+    throw new Error('@chakra-ui/cli does not declare a "chakra" bin entry.');
+  return o(i(e), r.chakra);
+}, f = () => {
+  const e = o(process.cwd(), ".kibble-temp"), r = o(e, "theme.config.ts");
+  return a(e) || l(e, { recursive: !0 }), m(r, `
 import { system } from "@televet/kibble-ui/theme";
 export default system;
-`), t;
+`), r;
 }, c = (e) => {
-  const t = n(e);
-  p(t, { recursive: !0, force: !0 });
+  const r = i(e);
+  u(r, { recursive: !0, force: !0 });
 };
-let r;
+let t;
 try {
-  console.log("🐕 Kibble UI: Creating temporary theme configuration..."), r = g(), console.log("🐕 Kibble UI: Generating theme types...");
-  const { cli: e, react: t } = h();
-  i(
-    `npx --yes -p @chakra-ui/cli@${e} -p @chakra-ui/react@${t} chakra typegen ${r}`,
-    { stdio: "inherit" }
-  ), console.log("🐕 Kibble UI: Cleaning up..."), c(r), console.log("✨ Kibble UI: Theme types generated successfully!");
+  console.log("🐕 Kibble UI: Creating temporary theme configuration..."), t = f(), console.log("🐕 Kibble UI: Generating theme types..."), s(process.execPath, [g(), "typegen", t], { stdio: "inherit" }), console.log("🐕 Kibble UI: Cleaning up..."), c(t), console.log("✨ Kibble UI: Theme types generated successfully!");
 } catch (e) {
-  if (console.error("❌ Kibble UI: Failed to generate theme types."), console.error(e), r)
+  if (console.error("❌ Kibble UI: Failed to generate theme types."), console.error(e), t)
     try {
-      c(r);
+      c(t);
     } catch {
     }
   process.exit(1);

package/dist/esm/cli/generate-theme-types.js.map

@@ -1 +1 @@
-{"version":3,"file":"generate-theme-types.js","sources":["../../../src/cli/generate-theme-types.ts"],"sourcesContent":["#!/usr/bin/env node\n\nimport { execSync } from 'node:child_process';\nimport { existsSync, mkdirSync, writeFileSync, rmSync, readFileSync } from 'node:fs';\nimport { dirname, resolve } from 'node:path';\nimport { fileURLToPath } from 'node:url';\n\n// Read kibble-ui's own pinned @chakra-ui/cli and @chakra-ui/react versions so the\n// npx-installed CLI always matches what this package was built and tested against,\n// instead of drifting out of sync with a second hardcoded copy of the versions.\nconst getChakraVersions = (): { cli: string; react: string } => {\n  const packageJsonPath = resolve(dirname(fileURLToPath(import.meta.url)), '../../../package.json');\n  const packageJson = JSON.parse(readFileSync(packageJsonPath, 'utf8'));\n  return {\n    cli: packageJson.devDependencies['@chakra-ui/cli'],\n    react: packageJson.dependencies['@chakra-ui/react'],\n  };\n};\n\n// Create a temporary theme config file that imports from kibble-ui\nconst createTempThemeConfig = (): string => {\n  const tempDir = resolve(process.cwd(), '.kibble-temp');\n  const tempFile = resolve(tempDir, 'theme.config.ts');\n\n  if (!existsSync(tempDir)) {\n    mkdirSync(tempDir, { recursive: true });\n  }\n\n  const configContent = `\nimport { system } from \"@televet/kibble-ui/theme\";\nexport default system;\n`;\n\n  writeFileSync(tempFile, configContent);\n  return tempFile;\n};\n\n// Clean up temporary files\nconst cleanup = (tempFile: string): void => {\n  const tempDir = dirname(tempFile);\n  rmSync(tempDir, { recursive: true, force: true });\n};\n\nlet tempFile: string | undefined;\n\ntry {\n  console.log('🐕 Kibble UI: Creating temporary theme configuration...');\n  tempFile = createTempThemeConfig();\n\n  console.log('🐕 Kibble UI: Generating theme types...');\n  // @chakra-ui/cli only lists @chakra-ui/react as a peerDependency, and npx's isolated\n  // install of a bare `npx @chakra-ui/cli` doesn't reliably pull it in (varies by npm\n  // version). Installing both explicitly into the same npx-isolated tree fixes resolution.\n  const { cli: chakraCliVersion, react: chakraReactVersion } = getChakraVersions();\n  execSync(\n    `npx --yes -p @chakra-ui/cli@${chakraCliVersion} -p @chakra-ui/react@${chakraReactVersion} chakra typegen ${tempFile}`,\n    { stdio: 'inherit' },\n  );\n\n  console.log('🐕 Kibble UI: Cleaning up...');\n  cleanup(tempFile);\n\n  console.log('✨ Kibble UI: Theme types generated successfully!');\n} catch (error) {\n  console.error('❌ Kibble UI: Failed to generate theme types.');\n  console.error(error);\n\n  if (tempFile) {\n    try {\n      cleanup(tempFile);\n    } catch {\n      // Best-effort cleanup — the error above is the one that matters.\n    }\n  }\n\n  process.exit(1);\n}\n"],"names":["getChakraVersions","packageJsonPath","resolve","dirname","fileURLToPath","packageJson","readFileSync","createTempThemeConfig","tempDir","tempFile","existsSync","mkdirSync","writeFileSync","cleanup","rmSync","chakraCliVersion","chakraReactVersion","execSync","error"],"mappings":";;;;;AAUA,MAAMA,IAAoB,MAAsC;AACxD,QAAAC,IAAkBC,EAAQC,EAAQC,EAAc,YAAY,GAAG,CAAC,GAAG,uBAAuB,GAC1FC,IAAc,KAAK,MAAMC,EAAaL,GAAiB,MAAM,CAAC;AAC7D,SAAA;AAAA,IACL,KAAKI,EAAY,gBAAgB,gBAAgB;AAAA,IACjD,OAAOA,EAAY,aAAa,kBAAkB;AAAA,EACpD;AACF,GAGME,IAAwB,MAAc;AAC1C,QAAMC,IAAUN,EAAQ,QAAQ,IAAA,GAAO,cAAc,GAC/CO,IAAWP,EAAQM,GAAS,iBAAiB;AAE/C,SAACE,EAAWF,CAAO,KACrBG,EAAUH,GAAS,EAAE,WAAW,GAAA,CAAM,GAQxCI,EAAcH,GALQ;AAAA;AAAA;AAAA,CAKe,GAC9BA;AACT,GAGMI,IAAU,CAACJ,MAA2B;AACpC,QAAAD,IAAUL,EAAQM,CAAQ;AAChC,EAAAK,EAAON,GAAS,EAAE,WAAW,IAAM,OAAO,IAAM;AAClD;AAEA,IAAIC;AAEJ,IAAI;AACF,UAAQ,IAAI,yDAAyD,GACrEA,IAAWF,EAAsB,GAEjC,QAAQ,IAAI,yCAAyC;AAIrD,QAAM,EAAE,KAAKQ,GAAkB,OAAOC,EAAA,IAAuBhB,EAAkB;AAC/E,EAAAiB;AAAA,IACE,+BAA+BF,CAAgB,wBAAwBC,CAAkB,mBAAmBP,CAAQ;AAAA,IACpH,EAAE,OAAO,UAAU;AAAA,EACrB,GAEA,QAAQ,IAAI,8BAA8B,GAC1CI,EAAQJ,CAAQ,GAEhB,QAAQ,IAAI,kDAAkD;AAChE,SAASS,GAAO;AAId,MAHA,QAAQ,MAAM,8CAA8C,GAC5D,QAAQ,MAAMA,CAAK,GAEfT;AACE,QAAA;AACF,MAAAI,EAAQJ,CAAQ;AAAA,IAAA,QACV;AAAA,IAAA;AAKV,UAAQ,KAAK,CAAC;AAChB;"}
+{"version":3,"file":"generate-theme-types.js","sources":["../../../src/cli/generate-theme-types.ts"],"sourcesContent":["#!/usr/bin/env node\n\nimport { execFileSync } from 'node:child_process';\nimport { existsSync, mkdirSync, writeFileSync, rmSync, readFileSync } from 'node:fs';\nimport { createRequire } from 'node:module';\nimport { dirname, resolve } from 'node:path';\n\nconst resolveChakraPackageJsonPath = (): string => {\n  const require = createRequire(import.meta.url);\n  try {\n    return require.resolve('@chakra-ui/cli/package.json');\n  } catch (cause) {\n    // src/cli is also compiled by tsconfig.app.json at lib ES2020, which has no Error cause option.\n    const reason = cause instanceof Error ? cause.message : String(cause);\n    throw new Error(\n      `Could not resolve @chakra-ui/cli, which @televet/kibble-ui depends on. Reinstall @televet/kibble-ui. (${reason})`,\n    );\n  }\n};\n\n// Resolve the installed @chakra-ui/cli binary so typegen runs offline, with no npx install step.\nconst resolveChakraBin = (): string => {\n  const packageJsonPath = resolveChakraPackageJsonPath();\n  const { bin } = JSON.parse(readFileSync(packageJsonPath, 'utf8')) as { bin?: Record<string, string> };\n  if (!bin?.chakra) {\n    throw new Error('@chakra-ui/cli does not declare a \"chakra\" bin entry.');\n  }\n  return resolve(dirname(packageJsonPath), bin.chakra);\n};\n\n// Create a temporary theme config file that imports from kibble-ui\nconst createTempThemeConfig = (): string => {\n  const tempDir = resolve(process.cwd(), '.kibble-temp');\n  const tempFile = resolve(tempDir, 'theme.config.ts');\n\n  if (!existsSync(tempDir)) {\n    mkdirSync(tempDir, { recursive: true });\n  }\n\n  const configContent = `\nimport { system } from \"@televet/kibble-ui/theme\";\nexport default system;\n`;\n\n  writeFileSync(tempFile, configContent);\n  return tempFile;\n};\n\n// Clean up temporary files\nconst cleanup = (tempFile: string): void => {\n  const tempDir = dirname(tempFile);\n  rmSync(tempDir, { recursive: true, force: true });\n};\n\nlet tempFile: string | undefined;\n\ntry {\n  console.log('🐕 Kibble UI: Creating temporary theme configuration...');\n  tempFile = createTempThemeConfig();\n\n  console.log('🐕 Kibble UI: Generating theme types...');\n  execFileSync(process.execPath, [resolveChakraBin(), 'typegen', tempFile], { stdio: 'inherit' });\n\n  console.log('🐕 Kibble UI: Cleaning up...');\n  cleanup(tempFile);\n\n  console.log('✨ Kibble UI: Theme types generated successfully!');\n} catch (error) {\n  console.error('❌ Kibble UI: Failed to generate theme types.');\n  console.error(error);\n\n  if (tempFile) {\n    try {\n      cleanup(tempFile);\n    } catch {\n      // Best-effort cleanup — the error above is the one that matters.\n    }\n  }\n\n  process.exit(1);\n}\n"],"names":["resolveChakraPackageJsonPath","require","createRequire","cause","reason","resolveChakraBin","packageJsonPath","bin","readFileSync","resolve","dirname","createTempThemeConfig","tempDir","tempFile","existsSync","mkdirSync","writeFileSync","cleanup","rmSync","execFileSync","error"],"mappings":";;;;;AAOA,MAAMA,IAA+B,MAAc;AAC3C,QAAAC,IAAUC,EAAc,YAAY,GAAG;AACzC,MAAA;AACK,WAAAD,EAAQ,QAAQ,6BAA6B;AAAA,WAC7CE,GAAO;AAEd,UAAMC,IAASD,aAAiB,QAAQA,EAAM,UAAU,OAAOA,CAAK;AACpE,UAAM,IAAI;AAAA,MACR,yGAAyGC,CAAM;AAAA,IACjH;AAAA,EAAA;AAEJ,GAGMC,IAAmB,MAAc;AACrC,QAAMC,IAAkBN,EAA6B,GAC/C,EAAE,KAAAO,MAAQ,KAAK,MAAMC,EAAaF,GAAiB,MAAM,CAAC;AAC5D,MAAA,CAACC,GAAK;AACF,UAAA,IAAI,MAAM,uDAAuD;AAEzE,SAAOE,EAAQC,EAAQJ,CAAe,GAAGC,EAAI,MAAM;AACrD,GAGMI,IAAwB,MAAc;AAC1C,QAAMC,IAAUH,EAAQ,QAAQ,IAAA,GAAO,cAAc,GAC/CI,IAAWJ,EAAQG,GAAS,iBAAiB;AAE/C,SAACE,EAAWF,CAAO,KACrBG,EAAUH,GAAS,EAAE,WAAW,GAAA,CAAM,GAQxCI,EAAcH,GALQ;AAAA;AAAA;AAAA,CAKe,GAC9BA;AACT,GAGMI,IAAU,CAACJ,MAA2B;AACpC,QAAAD,IAAUF,EAAQG,CAAQ;AAChC,EAAAK,EAAON,GAAS,EAAE,WAAW,IAAM,OAAO,IAAM;AAClD;AAEA,IAAIC;AAEJ,IAAI;AACF,UAAQ,IAAI,yDAAyD,GACrEA,IAAWF,EAAsB,GAEjC,QAAQ,IAAI,yCAAyC,GACxCQ,EAAA,QAAQ,UAAU,CAACd,EAAiB,GAAG,WAAWQ,CAAQ,GAAG,EAAE,OAAO,WAAW,GAE9F,QAAQ,IAAI,8BAA8B,GAC1CI,EAAQJ,CAAQ,GAEhB,QAAQ,IAAI,kDAAkD;AAChE,SAASO,GAAO;AAId,MAHA,QAAQ,MAAM,8CAA8C,GAC5D,QAAQ,MAAMA,CAAK,GAEfP;AACE,QAAA;AACF,MAAAI,EAAQJ,CAAQ;AAAA,IAAA,QACV;AAAA,IAAA;AAKV,UAAQ,KAAK,CAAC;AAChB;"}

package/dist/esm/components/Card/index.js

@@ -1,4 +1,4 @@
-import { C as o } from "../../../chunks/card.component-B1AznjWF.js";
+import { C as o } from "../../../chunks/card.component-DegvL21w.js";
 import { c as s } from "../../../chunks/card.types-Cixp7ouC.js";
 export {
   o as Card,

package/dist/esm/components/ConversationCard/index.js

@@ -1,4 +1,4 @@
-import { C as a } from "../../../chunks/conversationCard.component-Dg3RtQE8.js";
+import { C as a } from "../../../chunks/conversationCard.component-CjeOO2L3.js";
 export {
   a as ConversationCard
 };

package/dist/esm/components/index.js

@@ -7,12 +7,12 @@ import { B as d } from "../../chunks/button.component-BO6oee_V.js";
 import { b as u, d as T, c as S, e as b, a as v } from "../../chunks/button.types-BjfcUcMn.js";
 import { B as P } from "../../chunks/buttonGroup.component-Ce5TKLEN.js";
 import { C as D, a as W, i as z } from "../../chunks/calendar.component-D0IcPD3-.js";
-import { C as k } from "../../chunks/card.component-B1AznjWF.js";
+import { C as k } from "../../chunks/card.component-DegvL21w.js";
 import { c as A } from "../../chunks/card.types-Cixp7ouC.js";
 import { C as I } from "../../chunks/characterCounter.component-B45KB7Xu.js";
 import { W as h } from "../../chunks/checkbox.component-BoqZIgZE.js";
 import { W as L } from "../../chunks/checkboxGroup.component-B0QCi1NL.js";
-import { C as G } from "../../chunks/conversationCard.component-Dg3RtQE8.js";
+import { C as G } from "../../chunks/conversationCard.component-CjeOO2L3.js";
 import { D as F } from "../../chunks/datePicker.component-C-rCSpQD.js";
 import { D as E } from "../../chunks/datePicker.provider-rPzC-iBh.js";
 import { D as K, a as j, c as q } from "../../chunks/dateTimePicker.component-CYFud4bA.js";

package/dist/esm/index.js

@@ -7,12 +7,12 @@ import { B as l } from "../chunks/button.component-BO6oee_V.js";
 import { b as u, d as T, c as S, e as b, a as C } from "../chunks/button.types-BjfcUcMn.js";
 import { B as v } from "../chunks/buttonGroup.component-Ce5TKLEN.js";
 import { C as D, a as h, i as y } from "../chunks/calendar.component-D0IcPD3-.js";
-import { C as k } from "../chunks/card.component-B1AznjWF.js";
+import { C as k } from "../chunks/card.component-DegvL21w.js";
 import { c as z } from "../chunks/card.types-Cixp7ouC.js";
 import { C as V } from "../chunks/characterCounter.component-B45KB7Xu.js";
 import { W as w } from "../chunks/checkbox.component-BoqZIgZE.js";
 import { W as R } from "../chunks/checkboxGroup.component-B0QCi1NL.js";
-import { C as G } from "../chunks/conversationCard.component-Dg3RtQE8.js";
+import { C as G } from "../chunks/conversationCard.component-CjeOO2L3.js";
 import { D as N } from "../chunks/datePicker.component-C-rCSpQD.js";
 import { D as O } from "../chunks/datePicker.provider-rPzC-iBh.js";
 import { D as H, a as j, c as q } from "../chunks/dateTimePicker.component-CYFud4bA.js";

package/dist/types/components/Card/card.component.d.ts

@@ -12,6 +12,12 @@ export interface BaseCardProps {
      * @default false
      */
     onContrast?: boolean;
+    /**
+     * If `true`, the card will be styled with a red border. Visual only: the message and the screen
+     * reader announcement come from the controls inside the card.
+     * @default false
+     */
+    invalid?: boolean;
     /**
      * Size of the card. This mostly determines the amount of padding around the inside edge of the card.
      * @default md
@@ -28,11 +34,6 @@ export interface DefaultCardProps extends BaseCardProps {
      * @default false
      */
     active?: never;
-    /**
-     * *Only applicable when the `interactive` prop is `true`. If `true`, the card will be styled with a red border.
-     * @default false
-     */
-    invalid?: never;
     /**
      * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.
      * @default false
@@ -45,11 +46,6 @@ export interface InteractiveCardProps extends BaseCardProps {
      * @default false
      */
     active?: boolean;
-    /**
-     * *Only applicable when the `interactive` prop is `true`. If `true`, the card will be styled with a red border.
-     * @default false
-     */
-    invalid?: boolean;
     /**
      * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.
      * @default false

package/package.json

@@ -4,7 +4,7 @@
     "packages/*"
   ],
   "description": "Kibble Design System by Otto",
-  "version": "5.2.0",
+  "version": "5.3.1",
   "type": "module",
   "main": "./dist/cjs/index.cjs",
   "module": "./dist/esm/index.js",
@@ -135,7 +135,6 @@
     ]
   },
   "devDependencies": {
-    "@chakra-ui/cli": "^3.19.2",
     "@chromatic-com/storybook": "^5.1.2",
     "@emotion/react": "^11.14.0",
     "@eslint/js": "^9.21.0",
@@ -161,7 +160,7 @@
     "globals": "^15.15.0",
     "husky": "^9.1.7",
     "lint-staged": "^15.5.0",
-    "playwright": "^1.57.0",
+    "playwright": "^1.64.1",
     "plop": "^4.0.1",
     "prettier": "^3.5.3",
     "react-docgen-typescript": "^2.4.0",
@@ -184,6 +183,7 @@
     "react": "^19.0.0"
   },
   "dependencies": {
+    "@chakra-ui/cli": "~3.29.0",
     "@chakra-ui/react": "^3.24.0",
     "@datepicker-react/hooks": "^2.8.4",
     "@dnd-kit/core": "^6.3.1",

package/dist/chunks/card.component-B1AznjWF.js

@@ -1,55 +0,0 @@
-import { j as l } from "./jsx-runtime-C5mzlN2N.js";
-import { B as m } from "./index-9BerxEcw.js";
-const x = {
-  lg: 7,
-  md: 5,
-  sm: 3,
-  xs: 2
-}, g = ({
-  active: a = !1,
-  fullWidth: e = !0,
-  interactive: o = !1,
-  invalid: d = !1,
-  onClick: s,
-  onContrast: r = !1,
-  size: t = "md",
-  children: b,
-  ["data-testid"]: i = "kibble-card",
-  ...n
-}) => /* @__PURE__ */ l.jsx(
-  m,
-  {
-    className: "Card",
-    "data-testid": i,
-    bg: r ? "background.contrast" : "background",
-    p: x[t],
-    border: "1px",
-    borderColor: r ? "border.contrast" : "border",
-    borderRadius: "lg",
-    ...d && { "aria-invalid": !0 },
-    ...o && {
-      borderColor: {
-        base: `${a ? "transparent" : r ? "border.contrast" : "border"}`,
-        _invalid: `${r ? "border.danger.contrast" : "border.danger"}`
-      },
-      boxShadow: {
-        base: `${a ? r ? "active.contrast" : "active" : "none"}`,
-        ...!a && {
-          _hover: r ? "hover.contrast" : "hover"
-        }
-      },
-      cursor: "pointer",
-      transition: ".1s all ease-in-out"
-    },
-    ...e ? { w: "100%" } : { maxW: "max-content" },
-    onClick: (c) => {
-      s?.(c);
-    },
-    ...n,
-    children: b
-  }
-);
-export {
-  g as C
-};
-//# sourceMappingURL=card.component-B1AznjWF.js.map

package/dist/chunks/card.component-B1AznjWF.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"card.component-B1AznjWF.js","sources":["../../src/components/Card/card.records.ts","../../src/components/Card/card.component.tsx"],"sourcesContent":["import { CardSize } from './card.types';\n\nexport const CardPaddingMap: Record<CardSize, number> = {\n  lg: 7,\n  md: 5,\n  sm: 3,\n  xs: 2,\n};\n","import React from 'react';\nimport { Box, BoxProps } from '@chakra-ui/react/box';\nimport { CardSize } from './card.types';\nimport { CardPaddingMap } from './card.records';\n\nexport interface BaseCardProps {\n  /**\n   * If `false`, the max width will be set to `max-content` and will not take up the full width of the parent.\n   * @default true\n   */\n  fullWidth?: boolean;\n  /**\n   * If `true`, the card will use a contrasting variant.\n   * @default false\n   */\n  onContrast?: boolean;\n  /**\n   * Size of the card. This mostly determines the amount of padding around the inside edge of the card.\n   * @default md\n   */\n  size?: CardSize;\n  /** Data test id for the card.\n   * @default kibble-card\n   */\n  'data-testid'?: string;\n}\n\nexport interface DefaultCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: never;\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, the card will be styled with a red border.\n   * @default false\n   */\n  invalid?: never;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: false;\n}\n\nexport interface InteractiveCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: boolean;\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, the card will be styled with a red border.\n   * @default false\n   */\n  invalid?: boolean;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: true;\n}\n\nexport type KCardProps = InteractiveCardProps | DefaultCardProps;\n\nexport type CardProps = KCardProps & BoxProps;\n\nexport const Card = ({\n  active = false,\n  fullWidth = true,\n  interactive = false,\n  invalid = false,\n  onClick,\n  onContrast = false,\n  size = 'md',\n  children,\n  ['data-testid']: dataTestId = 'kibble-card',\n  ...rest\n}: CardProps): React.JSX.Element => {\n  return (\n    <Box\n      className=\"Card\"\n      data-testid={dataTestId}\n      bg={onContrast ? 'background.contrast' : 'background'}\n      p={CardPaddingMap[size]}\n      border=\"1px\"\n      borderColor={onContrast ? 'border.contrast' : 'border'}\n      borderRadius=\"lg\"\n      {...(invalid && { 'aria-invalid': true })}\n      {...(interactive && {\n        borderColor: {\n          base: `${active ? 'transparent' : onContrast ? 'border.contrast' : 'border'}`,\n          _invalid: `${onContrast ? 'border.danger.contrast' : 'border.danger'}`,\n        },\n        boxShadow: {\n          base: `${active ? (onContrast ? 'active.contrast' : 'active') : 'none'}`,\n          ...(!active && {\n            _hover: onContrast ? 'hover.contrast' : 'hover',\n          }),\n        },\n        cursor: 'pointer',\n        transition: '.1s all ease-in-out',\n      })}\n      {...(!fullWidth ? { maxW: 'max-content' } : { w: '100%' })}\n      onClick={(e) => {\n        onClick?.(e);\n      }}\n      {...rest}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"names":["CardPaddingMap","Card","active","fullWidth","interactive","invalid","onClick","onContrast","size","children","dataTestId","rest","jsx","Box","e"],"mappings":";;AAEO,MAAMA,IAA2C;AAAA,EACtD,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GC4DaC,IAAO,CAAC;AAAA,EACnB,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,aAAAC,IAAc;AAAA,EACd,SAAAC,IAAU;AAAA,EACV,SAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,CAAC,gBAAgBC,IAAa;AAAA,EAC9B,GAAGC;AACL,MAEIC,gBAAAA,EAAA;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,eAAaH;AAAA,IACb,IAAIH,IAAa,wBAAwB;AAAA,IACzC,GAAGP,EAAeQ,CAAI;AAAA,IACtB,QAAO;AAAA,IACP,aAAaD,IAAa,oBAAoB;AAAA,IAC9C,cAAa;AAAA,IACZ,GAAIF,KAAW,EAAE,gBAAgB,GAAK;AAAA,IACtC,GAAID,KAAe;AAAA,MAClB,aAAa;AAAA,QACX,MAAM,GAAGF,IAAS,gBAAgBK,IAAa,oBAAoB,QAAQ;AAAA,QAC3E,UAAU,GAAGA,IAAa,2BAA2B,eAAe;AAAA,MACtE;AAAA,MACA,WAAW;AAAA,QACT,MAAM,GAAGL,IAAUK,IAAa,oBAAoB,WAAY,MAAM;AAAA,QACtE,GAAI,CAACL,KAAU;AAAA,UACb,QAAQK,IAAa,mBAAmB;AAAA,QAAA;AAAA,MAE5C;AAAA,MACA,QAAQ;AAAA,MACR,YAAY;AAAA,IACd;AAAA,IACC,GAAKJ,IAAsC,EAAE,GAAG,OAAO,IAAtC,EAAE,MAAM,cAAc;AAAA,IACxC,SAAS,CAACW,MAAM;AACd,MAAAR,IAAUQ,CAAC;AAAA,IACb;AAAA,IACC,GAAGH;AAAA,IAEH,UAAAF;AAAA,EAAA;AACH;"}

package/dist/chunks/card.component-BmBiYbMV.js

@@ -1,2 +0,0 @@
-"use strict";const l=require("./jsx-runtime-BjDatQAs.js"),u=require("./index-BQRnVsAg.js"),x={lg:7,md:5,sm:3,xs:2},g=({active:e=!1,fullWidth:a=!0,interactive:d=!1,invalid:o=!1,onClick:s,onContrast:r=!1,size:t="md",children:n,["data-testid"]:i="kibble-card",...b})=>l.jsxRuntimeExports.jsx(u.Box,{className:"Card","data-testid":i,bg:r?"background.contrast":"background",p:x[t],border:"1px",borderColor:r?"border.contrast":"border",borderRadius:"lg",...o&&{"aria-invalid":!0},...d&&{borderColor:{base:`${e?"transparent":r?"border.contrast":"border"}`,_invalid:`${r?"border.danger.contrast":"border.danger"}`},boxShadow:{base:`${e?r?"active.contrast":"active":"none"}`,...!e&&{_hover:r?"hover.contrast":"hover"}},cursor:"pointer",transition:".1s all ease-in-out"},...a?{w:"100%"}:{maxW:"max-content"},onClick:c=>{s?.(c)},...b,children:n});exports.Card=g;
-//# sourceMappingURL=card.component-BmBiYbMV.js.map

package/dist/chunks/card.component-BmBiYbMV.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"card.component-BmBiYbMV.js","sources":["../../src/components/Card/card.records.ts","../../src/components/Card/card.component.tsx"],"sourcesContent":["import { CardSize } from './card.types';\n\nexport const CardPaddingMap: Record<CardSize, number> = {\n  lg: 7,\n  md: 5,\n  sm: 3,\n  xs: 2,\n};\n","import React from 'react';\nimport { Box, BoxProps } from '@chakra-ui/react/box';\nimport { CardSize } from './card.types';\nimport { CardPaddingMap } from './card.records';\n\nexport interface BaseCardProps {\n  /**\n   * If `false`, the max width will be set to `max-content` and will not take up the full width of the parent.\n   * @default true\n   */\n  fullWidth?: boolean;\n  /**\n   * If `true`, the card will use a contrasting variant.\n   * @default false\n   */\n  onContrast?: boolean;\n  /**\n   * Size of the card. This mostly determines the amount of padding around the inside edge of the card.\n   * @default md\n   */\n  size?: CardSize;\n  /** Data test id for the card.\n   * @default kibble-card\n   */\n  'data-testid'?: string;\n}\n\nexport interface DefaultCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: never;\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, the card will be styled with a red border.\n   * @default false\n   */\n  invalid?: never;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: false;\n}\n\nexport interface InteractiveCardProps extends BaseCardProps {\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, a blue 2px box shadow will be present around the card.\n   * @default false\n   */\n  active?: boolean;\n  /**\n   * *Only applicable when the `interactive` prop is `true`. If `true`, the card will be styled with a red border.\n   * @default false\n   */\n  invalid?: boolean;\n  /**\n   * If `true`, the card will have hover and active states, and will use the pointer cursor. If setting this value you can also pass the `active` prop to triggr the cards active state.\n   * @default false\n   */\n  interactive?: true;\n}\n\nexport type KCardProps = InteractiveCardProps | DefaultCardProps;\n\nexport type CardProps = KCardProps & BoxProps;\n\nexport const Card = ({\n  active = false,\n  fullWidth = true,\n  interactive = false,\n  invalid = false,\n  onClick,\n  onContrast = false,\n  size = 'md',\n  children,\n  ['data-testid']: dataTestId = 'kibble-card',\n  ...rest\n}: CardProps): React.JSX.Element => {\n  return (\n    <Box\n      className=\"Card\"\n      data-testid={dataTestId}\n      bg={onContrast ? 'background.contrast' : 'background'}\n      p={CardPaddingMap[size]}\n      border=\"1px\"\n      borderColor={onContrast ? 'border.contrast' : 'border'}\n      borderRadius=\"lg\"\n      {...(invalid && { 'aria-invalid': true })}\n      {...(interactive && {\n        borderColor: {\n          base: `${active ? 'transparent' : onContrast ? 'border.contrast' : 'border'}`,\n          _invalid: `${onContrast ? 'border.danger.contrast' : 'border.danger'}`,\n        },\n        boxShadow: {\n          base: `${active ? (onContrast ? 'active.contrast' : 'active') : 'none'}`,\n          ...(!active && {\n            _hover: onContrast ? 'hover.contrast' : 'hover',\n          }),\n        },\n        cursor: 'pointer',\n        transition: '.1s all ease-in-out',\n      })}\n      {...(!fullWidth ? { maxW: 'max-content' } : { w: '100%' })}\n      onClick={(e) => {\n        onClick?.(e);\n      }}\n      {...rest}\n    >\n      {children}\n    </Box>\n  );\n};\n"],"names":["CardPaddingMap","Card","active","fullWidth","interactive","invalid","onClick","onContrast","size","children","dataTestId","rest","jsx","Box","e"],"mappings":"2FAEaA,EAA2C,CACtD,GAAI,EACJ,GAAI,EACJ,GAAI,EACJ,GAAI,CACN,EC4DaC,EAAO,CAAC,CACnB,OAAAC,EAAS,GACT,UAAAC,EAAY,GACZ,YAAAC,EAAc,GACd,QAAAC,EAAU,GACV,QAAAC,EACA,WAAAC,EAAa,GACb,KAAAC,EAAO,KACP,SAAAC,EACA,CAAC,eAAgBC,EAAa,cAC9B,GAAGC,CACL,IAEIC,EAAA,kBAAA,IAACC,EAAA,IAAA,CACC,UAAU,OACV,cAAaH,EACb,GAAIH,EAAa,sBAAwB,aACzC,EAAGP,EAAeQ,CAAI,EACtB,OAAO,MACP,YAAaD,EAAa,kBAAoB,SAC9C,aAAa,KACZ,GAAIF,GAAW,CAAE,eAAgB,EAAK,EACtC,GAAID,GAAe,CAClB,YAAa,CACX,KAAM,GAAGF,EAAS,cAAgBK,EAAa,kBAAoB,QAAQ,GAC3E,SAAU,GAAGA,EAAa,yBAA2B,eAAe,EACtE,EACA,UAAW,CACT,KAAM,GAAGL,EAAUK,EAAa,kBAAoB,SAAY,MAAM,GACtE,GAAI,CAACL,GAAU,CACb,OAAQK,EAAa,iBAAmB,OAAA,CAE5C,EACA,OAAQ,UACR,WAAY,qBACd,EACC,GAAKJ,EAAsC,CAAE,EAAG,MAAO,EAAtC,CAAE,KAAM,aAAc,EACxC,QAAUW,GAAM,CACdR,IAAUQ,CAAC,CACb,EACC,GAAGH,EAEH,SAAAF,CAAA,CACH"}