@bitrise/bitkit-v2 0.3.377 → 0.3.379

package/dist/components/BitkitNoteCard/BitkitNoteCard.d.ts

@@ -4,6 +4,8 @@ import { NotificationVariant } from '../../theme/common/AlertAndToast.common';
 import { NotificationAction } from '../common/notificationMaps';
 export type BitkitNoteCardProps = Omit<BoxProps, 'children' | 'title'> & {
     action?: NotificationAction;
+    defaultOpen?: boolean;
+    isCollapsible?: boolean;
     message?: ReactNode;
     messageList?: ReactNode[];
     status?: NotificationVariant;
@@ -11,6 +13,8 @@ export type BitkitNoteCardProps = Omit<BoxProps, 'children' | 'title'> & {
 };
 declare const BitkitNoteCard: import('react').ForwardRefExoticComponent<Omit<BoxProps, "title" | "children"> & {
     action?: NotificationAction;
+    defaultOpen?: boolean;
+    isCollapsible?: boolean;
     message?: ReactNode;
     messageList?: ReactNode[];
     status?: NotificationVariant;

package/dist/components/BitkitNoteCard/BitkitNoteCard.js

@@ -1,19 +1,30 @@
+import IconChevronDown from "../../icons/IconChevronDown.js";
+import IconChevronUp from "../../icons/IconChevronUp.js";
 import { ICON_COMPONENTS_MAP } from "../common/notificationMaps.js";
 import BitkitButton from "../BitkitButton/BitkitButton.js";
+import BitkitLinkButton from "../BitkitLinkButton/BitkitLinkButton.js";
 import BitkitList_default from "../BitkitList/BitkitList.js";
 import { Box } from "@chakra-ui/react/box";
 import { useSlotRecipe } from "@chakra-ui/react/styled-system";
-import { forwardRef } from "react";
+import { forwardRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Text } from "@chakra-ui/react/text";
+import { Collapsible } from "@chakra-ui/react/collapsible";
 //#region lib/components/BitkitNoteCard/BitkitNoteCard.tsx
 var BitkitNoteCard = forwardRef((props, ref) => {
-	const { action, message, messageList, status = "info", title, ...rest } = props;
+	const { action, defaultOpen = false, isCollapsible = false, message, messageList, status = "info", title, ...rest } = props;
 	const styles = useSlotRecipe({ key: "noteCard" })({ status });
+	const [isOpen, setIsOpen] = useState(defaultOpen);
 	const IconComponent = ICON_COMPONENTS_MAP[status];
 	const isProgress = status === "progress";
 	const listItems = (messageList ?? []).filter((item) => item !== null && item !== void 0 && typeof item !== "boolean");
 	const hasList = listItems.length > 0;
+	const hasToggle = isCollapsible && hasList;
+	const list = hasList ? /* @__PURE__ */ jsx(BitkitList_default, {
+		css: styles.messageList,
+		size: "md",
+		children: listItems.map((item, index) => /* @__PURE__ */ jsx(BitkitList_default.Item, { children: item }, index))
+	}) : null;
 	return /* @__PURE__ */ jsxs(Box, {
 		ref,
 		css: styles.root,
@@ -37,11 +48,23 @@ var BitkitNoteCard = forwardRef((props, ref) => {
 						css: styles.message,
 						children: message
 					}),
-					hasList && /* @__PURE__ */ jsx(BitkitList_default, {
-						css: styles.messageList,
-						size: "md",
-						children: listItems.map((item, index) => /* @__PURE__ */ jsx(BitkitList_default.Item, { children: item }, index))
-					})
+					hasToggle ? /* @__PURE__ */ jsxs(Collapsible.Root, {
+						css: styles.collapsible,
+						onOpenChange: (details) => setIsOpen(details.open),
+						open: isOpen,
+						unstyled: true,
+						children: [/* @__PURE__ */ jsx(Collapsible.Content, {
+							css: styles.collapsibleContent,
+							children: list
+						}), /* @__PURE__ */ jsx(Collapsible.Trigger, {
+							asChild: true,
+							children: /* @__PURE__ */ jsx(BitkitLinkButton, {
+								css: styles.collapsibleTrigger,
+								suffixIcon: isOpen ? IconChevronUp : IconChevronDown,
+								children: isOpen ? "Hide details" : "Show details"
+							})
+						})]
+					}) : list
 				]
 			}), action && (action.href !== void 0 ? /* @__PURE__ */ jsx(BitkitButton, {
 				css: [styles.actionArea, hasList && styles.actionAreaList],

package/dist/components/BitkitNoteCard/BitkitNoteCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitNoteCard.js","names":[],"sources":["../../../lib/components/BitkitNoteCard/BitkitNoteCard.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { type ElementType, forwardRef, type ReactNode } from 'react';\n\nimport { type NotificationVariant } from '../../theme/common/AlertAndToast.common';\nimport BitkitButton from '../BitkitButton/BitkitButton';\nimport BitkitList from '../BitkitList/BitkitList';\nimport { ICON_COMPONENTS_MAP, type NotificationAction } from '../common/notificationMaps';\n\n// ----- Props -----\n\nexport type BitkitNoteCardProps = Omit<BoxProps, 'children' | 'title'> & {\n  action?: NotificationAction;\n  message?: ReactNode;\n  messageList?: ReactNode[];\n  status?: NotificationVariant;\n  title?: string;\n};\n\n// ----- Component -----\n\nconst BitkitNoteCard = forwardRef<HTMLDivElement, BitkitNoteCardProps>((props, ref) => {\n  const { action, message, messageList, status = 'info', title, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'noteCard' });\n  const styles = recipe({ status });\n\n  const IconComponent: ElementType = ICON_COMPONENTS_MAP[status];\n  const isProgress = status === 'progress';\n  const listItems = (messageList ?? []).filter(\n    (item) => item !== null && item !== undefined && typeof item !== 'boolean',\n  );\n  const hasList = listItems.length > 0;\n\n  return (\n    <Box ref={ref} css={styles.root} {...rest}>\n      <Box css={styles.iconBar}>\n        <Box css={styles.iconWrapper}>{isProgress ? <IconComponent size=\"lg\" /> : <IconComponent size=\"24\" />}</Box>\n      </Box>\n      <Box css={[styles.content, !action && { paddingInlineEnd: '24' }]}>\n        <Box css={[styles.messageBlock, !title && { paddingBlockStart: '2' }]}>\n          {title && <Text css={styles.title}>{title}</Text>}\n          {message && <Text css={styles.message}>{message}</Text>}\n          {hasList && (\n            <BitkitList css={styles.messageList} size=\"md\">\n              {listItems.map((item, index) => (\n                <BitkitList.Item key={index}>{item}</BitkitList.Item>\n              ))}\n            </BitkitList>\n          )}\n        </Box>\n        {action &&\n          (action.href !== undefined ? (\n            <BitkitButton\n              css={[styles.actionArea, hasList && styles.actionAreaList]}\n              href={action.href}\n              onClick={action.onClick}\n              rel={action.target === '_blank' ? 'noopener noreferrer' : undefined}\n              size=\"md\"\n              // See the known gap documented on `NotificationAction.state`: BitkitButton's anchor\n              // variant has no loading state, so only `disabled` carries over here.\n              state={action.state === 'loading' ? undefined : action.state}\n              target={action.target}\n              variant=\"tertiary\"\n            >\n              {action.label}\n            </BitkitButton>\n          ) : (\n            <BitkitButton\n              css={[styles.actionArea, hasList && styles.actionAreaList]}\n              onClick={action.onClick}\n              size=\"md\"\n              state={action.state}\n              variant=\"tertiary\"\n              marginBlock=\"4\"\n            >\n              {action.label}\n            </BitkitButton>\n          ))}\n      </Box>\n    </Box>\n  );\n});\n\nBitkitNoteCard.displayName = 'BitkitNoteCard';\n\nexport default BitkitNoteCard;\n"],"mappings":";;;;;;;;;AAsBA,IAAM,iBAAiB,YAAiD,OAAO,QAAQ;CACrF,MAAM,EAAE,QAAQ,SAAS,aAAa,SAAS,QAAQ,OAAO,GAAG,SAAS;CAG1E,MAAM,SADS,cAAc,EAAE,KAAK,WAAW,CAChC,CAAA,CAAO,EAAE,OAAO,CAAC;CAEhC,MAAM,gBAA6B,oBAAoB;CACvD,MAAM,aAAa,WAAW;CAC9B,MAAM,aAAa,eAAe,CAAC,EAAA,CAAG,QACnC,SAAS,SAAS,QAAQ,SAAS,KAAA,KAAa,OAAO,SAAS,SACnE;CACA,MAAM,UAAU,UAAU,SAAS;CAEnC,OACE,qBAAC,KAAD;EAAU;EAAK,KAAK,OAAO;EAAM,GAAI;EAArC,UAAA,CACE,oBAAC,KAAD;GAAK,KAAK,OAAO;GACf,UAAA,oBAAC,KAAD;IAAK,KAAK,OAAO;IAAc,UAAA,aAAa,oBAAC,eAAD,EAAe,MAAK,KAAM,CAAA,IAAI,oBAAC,eAAD,EAAe,MAAK,KAAM,CAAA;GAAO,CAAA;EACxG,CAAA,GACL,qBAAC,KAAD;GAAK,KAAK,CAAC,OAAO,SAAS,CAAC,UAAU,EAAE,kBAAkB,KAAK,CAAC;GAAhE,UAAA,CACE,qBAAC,KAAD;IAAK,KAAK,CAAC,OAAO,cAAc,CAAC,SAAS,EAAE,mBAAmB,IAAI,CAAC;IAApE,UAAA;KACG,SAAS,oBAAC,MAAD;MAAM,KAAK,OAAO;MAAQ,UAAA;KAAY,CAAA;KAC/C,WAAW,oBAAC,MAAD;MAAM,KAAK,OAAO;MAAU,UAAA;KAAc,CAAA;KACrD,WACC,oBAAC,oBAAD;MAAY,KAAK,OAAO;MAAa,MAAK;MACvC,UAAA,UAAU,KAAK,MAAM,UACpB,oBAAC,mBAAW,MAAZ,EAAA,UAA8B,KAAsB,GAA9B,KAA8B,CACrD;KACS,CAAA;IAEX;GACJ,CAAA,GAAA,WACE,OAAO,SAAS,KAAA,IACf,oBAAC,cAAD;IACE,KAAK,CAAC,OAAO,YAAY,WAAW,OAAO,cAAc;IACzD,MAAM,OAAO;IACb,SAAS,OAAO;IAChB,KAAK,OAAO,WAAW,WAAW,wBAAwB,KAAA;IAC1D,MAAK;IAGL,OAAO,OAAO,UAAU,YAAY,KAAA,IAAY,OAAO;IACvD,QAAQ,OAAO;IACf,SAAQ;IAEP,UAAA,OAAO;GACI,CAAA,IAEd,oBAAC,cAAD;IACE,KAAK,CAAC,OAAO,YAAY,WAAW,OAAO,cAAc;IACzD,SAAS,OAAO;IAChB,MAAK;IACL,OAAO,OAAO;IACd,SAAQ;IACR,aAAY;IAEX,UAAA,OAAO;GACI,CAAA,EAEf;EACF,CAAA,CAAA;;AAET,CAAC;AAED,eAAe,cAAc"}
+{"version":3,"file":"BitkitNoteCard.js","names":[],"sources":["../../../lib/components/BitkitNoteCard/BitkitNoteCard.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Collapsible } from '@chakra-ui/react/collapsible';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { type ElementType, forwardRef, type ReactNode, useState } from 'react';\n\nimport { IconChevronDown, IconChevronUp } from '../../icons';\nimport { type NotificationVariant } from '../../theme/common/AlertAndToast.common';\nimport BitkitButton from '../BitkitButton/BitkitButton';\nimport BitkitLinkButton from '../BitkitLinkButton/BitkitLinkButton';\nimport BitkitList from '../BitkitList/BitkitList';\nimport { ICON_COMPONENTS_MAP, type NotificationAction } from '../common/notificationMaps';\n\n// ----- Props -----\n\nexport type BitkitNoteCardProps = Omit<BoxProps, 'children' | 'title'> & {\n  action?: NotificationAction;\n  defaultOpen?: boolean;\n  isCollapsible?: boolean;\n  message?: ReactNode;\n  messageList?: ReactNode[];\n  status?: NotificationVariant;\n  title?: string;\n};\n\n// ----- Component -----\n\nconst BitkitNoteCard = forwardRef<HTMLDivElement, BitkitNoteCardProps>((props, ref) => {\n  const {\n    action,\n    defaultOpen = false,\n    isCollapsible = false,\n    message,\n    messageList,\n    status = 'info',\n    title,\n    ...rest\n  } = props;\n\n  const recipe = useSlotRecipe({ key: 'noteCard' });\n  const styles = recipe({ status });\n\n  const [isOpen, setIsOpen] = useState(defaultOpen);\n\n  const IconComponent: ElementType = ICON_COMPONENTS_MAP[status];\n  const isProgress = status === 'progress';\n  const listItems = (messageList ?? []).filter(\n    (item) => item !== null && item !== undefined && typeof item !== 'boolean',\n  );\n  const hasList = listItems.length > 0;\n  const hasToggle = isCollapsible && hasList;\n\n  const list = hasList ? (\n    <BitkitList css={styles.messageList} size=\"md\">\n      {listItems.map((item, index) => (\n        <BitkitList.Item key={index}>{item}</BitkitList.Item>\n      ))}\n    </BitkitList>\n  ) : null;\n\n  return (\n    <Box ref={ref} css={styles.root} {...rest}>\n      <Box css={styles.iconBar}>\n        <Box css={styles.iconWrapper}>{isProgress ? <IconComponent size=\"lg\" /> : <IconComponent size=\"24\" />}</Box>\n      </Box>\n      <Box css={[styles.content, !action && { paddingInlineEnd: '24' }]}>\n        <Box css={[styles.messageBlock, !title && { paddingBlockStart: '2' }]}>\n          {title && <Text css={styles.title}>{title}</Text>}\n          {message && <Text css={styles.message}>{message}</Text>}\n          {hasToggle ? (\n            <Collapsible.Root\n              css={styles.collapsible}\n              onOpenChange={(details) => setIsOpen(details.open)}\n              open={isOpen}\n              unstyled\n            >\n              <Collapsible.Content css={styles.collapsibleContent}>{list}</Collapsible.Content>\n              <Collapsible.Trigger asChild>\n                <BitkitLinkButton css={styles.collapsibleTrigger} suffixIcon={isOpen ? IconChevronUp : IconChevronDown}>\n                  {isOpen ? 'Hide details' : 'Show details'}\n                </BitkitLinkButton>\n              </Collapsible.Trigger>\n            </Collapsible.Root>\n          ) : (\n            list\n          )}\n        </Box>\n        {action &&\n          (action.href !== undefined ? (\n            <BitkitButton\n              css={[styles.actionArea, hasList && styles.actionAreaList]}\n              href={action.href}\n              onClick={action.onClick}\n              rel={action.target === '_blank' ? 'noopener noreferrer' : undefined}\n              size=\"md\"\n              // See the known gap documented on `NotificationAction.state`: BitkitButton's anchor\n              // variant has no loading state, so only `disabled` carries over here.\n              state={action.state === 'loading' ? undefined : action.state}\n              target={action.target}\n              variant=\"tertiary\"\n            >\n              {action.label}\n            </BitkitButton>\n          ) : (\n            <BitkitButton\n              css={[styles.actionArea, hasList && styles.actionAreaList]}\n              onClick={action.onClick}\n              size=\"md\"\n              state={action.state}\n              variant=\"tertiary\"\n              marginBlock=\"4\"\n            >\n              {action.label}\n            </BitkitButton>\n          ))}\n      </Box>\n    </Box>\n  );\n});\n\nBitkitNoteCard.displayName = 'BitkitNoteCard';\n\nexport default BitkitNoteCard;\n"],"mappings":";;;;;;;;;;;;;AA2BA,IAAM,iBAAiB,YAAiD,OAAO,QAAQ;CACrF,MAAM,EACJ,QACA,cAAc,OACd,gBAAgB,OAChB,SACA,aACA,SAAS,QACT,OACA,GAAG,SACD;CAGJ,MAAM,SADS,cAAc,EAAE,KAAK,WAAW,CAChC,CAAA,CAAO,EAAE,OAAO,CAAC;CAEhC,MAAM,CAAC,QAAQ,aAAa,SAAS,WAAW;CAEhD,MAAM,gBAA6B,oBAAoB;CACvD,MAAM,aAAa,WAAW;CAC9B,MAAM,aAAa,eAAe,CAAC,EAAA,CAAG,QACnC,SAAS,SAAS,QAAQ,SAAS,KAAA,KAAa,OAAO,SAAS,SACnE;CACA,MAAM,UAAU,UAAU,SAAS;CACnC,MAAM,YAAY,iBAAiB;CAEnC,MAAM,OAAO,UACX,oBAAC,oBAAD;EAAY,KAAK,OAAO;EAAa,MAAK;EACvC,UAAA,UAAU,KAAK,MAAM,UACpB,oBAAC,mBAAW,MAAZ,EAAA,UAA8B,KAAsB,GAA9B,KAA8B,CACrD;CACS,CAAA,IACV;CAEJ,OACE,qBAAC,KAAD;EAAU;EAAK,KAAK,OAAO;EAAM,GAAI;EAArC,UAAA,CACE,oBAAC,KAAD;GAAK,KAAK,OAAO;GACf,UAAA,oBAAC,KAAD;IAAK,KAAK,OAAO;IAAc,UAAA,aAAa,oBAAC,eAAD,EAAe,MAAK,KAAM,CAAA,IAAI,oBAAC,eAAD,EAAe,MAAK,KAAM,CAAA;GAAO,CAAA;EACxG,CAAA,GACL,qBAAC,KAAD;GAAK,KAAK,CAAC,OAAO,SAAS,CAAC,UAAU,EAAE,kBAAkB,KAAK,CAAC;GAAhE,UAAA,CACE,qBAAC,KAAD;IAAK,KAAK,CAAC,OAAO,cAAc,CAAC,SAAS,EAAE,mBAAmB,IAAI,CAAC;IAApE,UAAA;KACG,SAAS,oBAAC,MAAD;MAAM,KAAK,OAAO;MAAQ,UAAA;KAAY,CAAA;KAC/C,WAAW,oBAAC,MAAD;MAAM,KAAK,OAAO;MAAU,UAAA;KAAc,CAAA;KACrD,YACC,qBAAC,YAAY,MAAb;MACE,KAAK,OAAO;MACZ,eAAe,YAAY,UAAU,QAAQ,IAAI;MACjD,MAAM;MACN,UAAA;MAJF,UAAA,CAME,oBAAC,YAAY,SAAb;OAAqB,KAAK,OAAO;OAAqB,UAAA;MAA0B,CAAA,GAChF,oBAAC,YAAY,SAAb;OAAqB,SAAA;OACnB,UAAA,oBAAC,kBAAD;QAAkB,KAAK,OAAO;QAAoB,YAAY,SAAS,gBAAgB;QACpF,UAAA,SAAS,iBAAiB;OACX,CAAA;MACC,CAAA,CACL;KAElB,CAAA,IAAA;IAEC;GACJ,CAAA,GAAA,WACE,OAAO,SAAS,KAAA,IACf,oBAAC,cAAD;IACE,KAAK,CAAC,OAAO,YAAY,WAAW,OAAO,cAAc;IACzD,MAAM,OAAO;IACb,SAAS,OAAO;IAChB,KAAK,OAAO,WAAW,WAAW,wBAAwB,KAAA;IAC1D,MAAK;IAGL,OAAO,OAAO,UAAU,YAAY,KAAA,IAAY,OAAO;IACvD,QAAQ,OAAO;IACf,SAAQ;IAEP,UAAA,OAAO;GACI,CAAA,IAEd,oBAAC,cAAD;IACE,KAAK,CAAC,OAAO,YAAY,WAAW,OAAO,cAAc;IACzD,SAAS,OAAO;IAChB,MAAK;IACL,OAAO,OAAO;IACd,SAAQ;IACR,aAAY;IAEX,UAAA,OAAO;GACI,CAAA,EAEf;EACF,CAAA,CAAA;;AAET,CAAC;AAED,eAAe,cAAc"}

package/dist/components/BitkitTableCard/BitkitTableCard.d.ts

@@ -0,0 +1,14 @@
+import { CardRootProps } from '@chakra-ui/react/card';
+import { ReactNode } from 'react';
+export interface BitkitTableCardProps extends Omit<CardRootProps, 'children'> {
+    /** Trailing action in the header, e.g. a `BitkitButton`. Omit it and the header is title-only. */
+    action?: ReactNode;
+    /** The table filling the card. Use `<Table.Root variant="card">` so it matches the card's frame. */
+    children: ReactNode;
+    /** Quieter second line under the title. */
+    secondaryText?: ReactNode;
+    /** The card's heading. Named like `BitkitAlert`'s so the native `title` attribute stays free. */
+    titleText: ReactNode;
+}
+declare const BitkitTableCard: import('react').ForwardRefExoticComponent<BitkitTableCardProps & import('react').RefAttributes<HTMLDivElement>>;
+export default BitkitTableCard;

package/dist/components/BitkitTableCard/BitkitTableCard.js

@@ -0,0 +1,40 @@
+import { Box } from "@chakra-ui/react/box";
+import { useSlotRecipe } from "@chakra-ui/react/styled-system";
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Card } from "@chakra-ui/react/card";
+//#region lib/components/BitkitTableCard/BitkitTableCard.tsx
+var BitkitTableCard = forwardRef((props, ref) => {
+	const { action, children, secondaryText, titleText, ...rest } = props;
+	const styles = useSlotRecipe({ key: "tableCard" })();
+	return /* @__PURE__ */ jsxs(Card.Root, {
+		ref,
+		css: styles.root,
+		elevation: false,
+		...rest,
+		children: [/* @__PURE__ */ jsx(Card.Header, {
+			css: styles.header,
+			children: /* @__PURE__ */ jsxs(Box, {
+				css: styles.contentBlock,
+				children: [/* @__PURE__ */ jsxs(Box, {
+					css: styles.titleBlock,
+					children: [/* @__PURE__ */ jsx(Card.Title, {
+						css: styles.title,
+						children: titleText
+					}), secondaryText && /* @__PURE__ */ jsx(Card.Description, {
+						css: styles.description,
+						children: secondaryText
+					})]
+				}), action]
+			})
+		}), /* @__PURE__ */ jsx(Card.Body, {
+			css: styles.body,
+			children
+		})]
+	});
+});
+BitkitTableCard.displayName = "BitkitTableCard";
+//#endregion
+export { BitkitTableCard as default };
+
+//# sourceMappingURL=BitkitTableCard.js.map

package/dist/components/BitkitTableCard/BitkitTableCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BitkitTableCard.js","names":[],"sources":["../../../lib/components/BitkitTableCard/BitkitTableCard.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Card, type CardRootProps } from '@chakra-ui/react/card';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type ReactNode } from 'react';\n\nexport interface BitkitTableCardProps extends Omit<CardRootProps, 'children'> {\n  /** Trailing action in the header, e.g. a `BitkitButton`. Omit it and the header is title-only. */\n  action?: ReactNode;\n  /** The table filling the card. Use `<Table.Root variant=\"card\">` so it matches the card's frame. */\n  children: ReactNode;\n  /** Quieter second line under the title. */\n  secondaryText?: ReactNode;\n  /** The card's heading. Named like `BitkitAlert`'s so the native `title` attribute stays free. */\n  titleText: ReactNode;\n}\n\nconst BitkitTableCard = forwardRef<HTMLDivElement, BitkitTableCardProps>((props, ref) => {\n  const { action, children, secondaryText, titleText, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'tableCard' });\n  const styles = recipe();\n\n  return (\n    <Card.Root ref={ref} css={styles.root} elevation={false} {...rest}>\n      <Card.Header css={styles.header}>\n        <Box css={styles.contentBlock}>\n          <Box css={styles.titleBlock}>\n            <Card.Title css={styles.title}>{titleText}</Card.Title>\n            {secondaryText && <Card.Description css={styles.description}>{secondaryText}</Card.Description>}\n          </Box>\n          {action}\n        </Box>\n      </Card.Header>\n      <Card.Body css={styles.body}>{children}</Card.Body>\n    </Card.Root>\n  );\n});\n\nBitkitTableCard.displayName = 'BitkitTableCard';\n\nexport default BitkitTableCard;\n"],"mappings":";;;;;;AAgBA,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EAAE,QAAQ,UAAU,eAAe,WAAW,GAAG,SAAS;CAGhE,MAAM,SADS,cAAc,EAAE,KAAK,YAAY,CACjC,CAAA,CAAO;CAEtB,OACE,qBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,OAAO;EAAM,WAAW;EAAO,GAAI;EAA7D,UAAA,CACE,oBAAC,KAAK,QAAN;GAAa,KAAK,OAAO;GACvB,UAAA,qBAAC,KAAD;IAAK,KAAK,OAAO;IAAjB,UAAA,CACE,qBAAC,KAAD;KAAK,KAAK,OAAO;KAAjB,UAAA,CACE,oBAAC,KAAK,OAAN;MAAY,KAAK,OAAO;MAAQ,UAAA;KAAsB,CAAA,GACrD,iBAAiB,oBAAC,KAAK,aAAN;MAAkB,KAAK,OAAO;MAAc,UAAA;KAAgC,CAAA,CAC3F;IACJ,CAAA,GAAA,MACE;;EACM,CAAA,GACb,oBAAC,KAAK,MAAN;GAAW,KAAK,OAAO;GAAO;EAAoB,CAAA,CACzC;;AAEf,CAAC;AAED,gBAAgB,cAAc"}

package/dist/components/index.d.ts

@@ -79,6 +79,7 @@ export { default as BitkitFilterRow, type BitkitFilterRowProps } from './BitkitT
 export { default as BitkitLinkedRow, type BitkitLinkedRowLinkCellProps, type BitkitLinkedRowProps, } from './BitkitTable/BitkitLinkedRow';
 export { type BitkitRowAction, default as BitkitRowActionsCell, type BitkitRowActionsCellProps, } from './BitkitTable/BitkitRowActionsCell';
 export { default as BitkitSortableColumnHeader, type BitkitSortableColumnHeaderProps, } from './BitkitTable/BitkitSortableColumnHeader';
+export { default as BitkitTableCard, type BitkitTableCardProps } from './BitkitTableCard/BitkitTableCard';
 export { default as BitkitTabs } from './BitkitTabs/BitkitTabs';
 export { default as BitkitTag, type BitkitTagProps } from './BitkitTag/BitkitTag';
 export { default as BitkitTagsInput, type BitkitTagsInputProps } from './BitkitTagsInput/BitkitTagsInput';

package/dist/main.js

@@ -367,6 +367,7 @@ import BitkitFilterRow from "./components/BitkitTable/BitkitFilterRow.js";
 import BitkitLinkedRow_default from "./components/BitkitTable/BitkitLinkedRow.js";
 import BitkitRowActionsCell from "./components/BitkitTable/BitkitRowActionsCell.js";
 import BitkitSortableColumnHeader from "./components/BitkitTable/BitkitSortableColumnHeader.js";
+import BitkitTableCard from "./components/BitkitTableCard/BitkitTableCard.js";
 import BitkitTabs from "./components/BitkitTabs/BitkitTabs.js";
 import BitkitTagsInput from "./components/BitkitTagsInput/BitkitTagsInput.js";
 import BitkitTextArea from "./components/BitkitTextArea/BitkitTextArea.js";
@@ -377,4 +378,4 @@ import BitkitTreeView, { createTreeCollection } from "./components/BitkitTreeVie
 import useResponsive, { ResponsiveProvider } from "./hooks/useResponsive.js";
 import bitkitTheme from "./theme/index.js";
 import Provider from "./providers/BitkitProvider.js";
-export { BitkitAccordion_default as BitkitAccordion, BitkitActionBar, BitkitActionMenu_default as BitkitActionMenu, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitBreadcrumb, BitkitBulkActionsRow, BitkitButton, BitkitCalendar, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox_default as BitkitCombobox, BitkitControlButton, BitkitDataWidget, BitkitDatePicker, BitkitDefinitionTooltip, BitkitDialog_default as BitkitDialog, BitkitDraggableCard, BitkitDrawer, BitkitEmptyState, BitkitExpandableCard, BitkitExpandableRow, BitkitField, BitkitFileInput, BitkitFilterRow, BitkitFormDialog_default as BitkitFormDialog, BitkitGroupHeading, BitkitHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLightbox, BitkitLink, BitkitLinkButton, BitkitLinkedRow_default as BitkitLinkedRow, BitkitList_default as BitkitList, BitkitMarkdown, BitkitMarkdownCard, BitkitMultiselect_default as BitkitMultiselect, BitkitMultiselectMenu, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOverflowContent, BitkitOverflowTooltip, BitkitPageFooter_default as BitkitPageFooter, BitkitPagination, BitkitPaginationLoadMore, BitkitPopover, BitkitProgressBar, BitkitPromoBanner, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitRowActionsCell, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect_default as BitkitSelect, BitkitSelectMenu, BitkitSelectMenuAction, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSettingsCard_default as BitkitSettingsCard, BitkitSidebar_default as BitkitSidebar, BitkitSkeletonGroup, BitkitSortableColumnHeader, BitkitSpinner, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitStepperDialog_default as BitkitStepperDialog, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitSwitch, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextArea, BitkitTextInput, BitkitToggleButton, BitkitTooltip, BitkitTour, BitkitTreeView, IconAbortCircle, IconAbortCircleFilled, IconAddons, IconAgent, IconAnchor, IconAndroid, IconApp, IconAppSettings, IconAppStore, IconAppStoreColor, IconApple, IconArchive, IconArchiveDelete, IconArchiveRestore, IconArrowBackAndDown, IconArrowBackAndUp, IconArrowDown, IconArrowForwardAndDown, IconArrowForwardAndUp, IconArrowLeft, IconArrowNortheast, IconArrowNorthwest, IconArrowRight, IconArrowUp, IconArrowsHorizontal, IconArrowsVertical, IconAutomation, IconAws, IconAwsColor, IconBadge3RdParty, IconBadgeBitrise, IconBadgeUpgrade, IconBadgeVersionOk, IconBazel, IconBell, IconBitbot, IconBitbotError, IconBitbucket, IconBitbucketColor, IconBitbucketNeutral, IconBitbucketWhite, IconBlockCircle, IconBook, IconBoxArrowDown, IconBoxDot, IconBoxLinesOverflow, IconBoxLinesWrap, IconBranch, IconBrowserstackColor, IconBug, IconBuild, IconBuildCache, IconBuildCacheFilled, IconBuildEnvSetup, IconBuildHub, IconBuildHubFilled, IconCalendar, IconChangePlan, IconChat, IconCheck, IconCheckCircle, IconCheckCircleFilled, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconCi, IconCiFilled, IconCircle, IconCircleDashed, IconCircleHalfFilled, IconClaude, IconClaudeColor, IconClock, IconCode, IconCodePush, IconCodeSigning, IconCoffee, IconCommit, IconConfigure, IconConnectedAccounts, IconContainer, IconCopy, IconCordova, IconCpu, IconCreditcard, IconCredits, IconCross, IconCrossCircle, IconCrossCircleFilled, IconCrown, IconCycle, IconDashboard, IconDashboardFilled, IconDeployment, IconDetails, IconDoc, IconDollar, IconDot, IconDotnet, IconDotnetColor, IconDotnetText, IconDotnetTextColor, IconDoubleCircle, IconDownload, IconDragHandle, IconEc2Ami, IconEnterprise, IconErrorCircle, IconErrorCircleFilled, IconExpand, IconExtraBuildCapacity, IconEye, IconEyeSlash, IconFastlane, IconFileDoc, IconFilePdf, IconFilePlist, IconFileYml, IconFileZip, IconFilter, IconFlag, IconFlutter, IconFolder, IconFullscreen, IconFullscreenExit, IconGauge, IconGit, IconGithub, IconGitlab, IconGitlabColor, IconGitlabWhite, IconGlobe, IconGo, IconGoogleColor, IconGooglePlay, IconGooglePlayColor, IconGradle, IconGroup, IconHashtag, IconHeadset, IconHeart, IconHistory, IconHourglass, IconImage, IconInfoCircle, IconInfoCircleFilled, IconInsights, IconInsightsFilled, IconInstall, IconInteraction, IconInvoice, IconIonic, IconJapanese, IconJava, IconJavaColor, IconJavaDuke, IconJavaDukeColor, IconKey, IconKotlin, IconKotlinColor, IconKotlinWhite, IconLaptop, IconLaunchdarkly, IconLegacyApp, IconLightbulb, IconLink, IconLinux, IconLock, IconLockOpen, IconLogin, IconLogout, IconMacos, IconMagicWand, IconMagnifier, IconMail, IconMedal, IconMemory, IconMenuGrid, IconMenuHamburger, IconMessage, IconMessageAlert, IconMessageQuestion, IconMicrophone, IconMinus, IconMinusCircle, IconMinusCircleFilled, IconMobile, IconMobileLandscape, IconMonitorChart, IconMoreHorizontal, IconMoreVertical, IconNews, IconNextjs, IconNodejs, IconOpenInNew, IconOther, IconOutsideContributor, IconOverview, IconPause, IconPencil, IconPeople, IconPercent, IconPerson, IconPersonWithDesk, IconPlay, IconPlus, IconPlusCircle, IconPlusCircleFilled, IconPower, IconProject, IconProjectSettings, IconPull, IconPush, IconPuzzle, IconPython, IconPythonColor, IconQuestionCircle, IconQuestionCircleFilled, IconReact, IconRefresh, IconRegex, IconRelease, IconReleaseFilled, IconRemoteAccess, IconReplace, IconResponsiveness, IconReviewerApproved, IconReviewerAssigned, IconReviewerRejected, IconRuby, IconRubyColor, IconSave, IconSecurityShield, IconSettings, IconSettingsFilled, IconShuffle, IconSiren, IconSkip, IconSkipCircle, IconSkipCircleFilled, IconSlack, IconSlackColor, IconSparkle, IconSparkleFilled, IconSpinnerOnDisabled, IconSpinnerPurple, IconSpinnerPurpleDouble, IconSpinnerWhite, IconStability, IconStack, IconStar, IconStep, IconStop, IconStopwatch, IconTag, IconTasks, IconTeams, IconTeamsColor, IconTemplateCode, IconTerminal, IconTestQuarantine, IconThemeDarkToggle, IconThumbDown, IconThumbUp, IconTools, IconTrash, IconTrigger, IconUbuntu, IconUbuntuColor, IconUnity3D, IconUpload, IconValidateShield, IconVideo, IconWarning, IconWarningYellow, IconWebUi, IconWebhooks, IconWorkflow, IconWorkflowFlow, IconXTwitter, IconXamarin, IconXcode, ResponsiveProvider, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast, createTreeCollection, dismissBitkitToast, rem, useBitkitTour, useResponsive, useStepperDialog };
+export { BitkitAccordion_default as BitkitAccordion, BitkitActionBar, BitkitActionMenu_default as BitkitActionMenu, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitBreadcrumb, BitkitBulkActionsRow, BitkitButton, BitkitCalendar, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox_default as BitkitCombobox, BitkitControlButton, BitkitDataWidget, BitkitDatePicker, BitkitDefinitionTooltip, BitkitDialog_default as BitkitDialog, BitkitDraggableCard, BitkitDrawer, BitkitEmptyState, BitkitExpandableCard, BitkitExpandableRow, BitkitField, BitkitFileInput, BitkitFilterRow, BitkitFormDialog_default as BitkitFormDialog, BitkitGroupHeading, BitkitHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLightbox, BitkitLink, BitkitLinkButton, BitkitLinkedRow_default as BitkitLinkedRow, BitkitList_default as BitkitList, BitkitMarkdown, BitkitMarkdownCard, BitkitMultiselect_default as BitkitMultiselect, BitkitMultiselectMenu, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOverflowContent, BitkitOverflowTooltip, BitkitPageFooter_default as BitkitPageFooter, BitkitPagination, BitkitPaginationLoadMore, BitkitPopover, BitkitProgressBar, BitkitPromoBanner, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitRowActionsCell, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect_default as BitkitSelect, BitkitSelectMenu, BitkitSelectMenuAction, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSettingsCard_default as BitkitSettingsCard, BitkitSidebar_default as BitkitSidebar, BitkitSkeletonGroup, BitkitSortableColumnHeader, BitkitSpinner, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitStepperDialog_default as BitkitStepperDialog, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitSwitch, BitkitTableCard, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextArea, BitkitTextInput, BitkitToggleButton, BitkitTooltip, BitkitTour, BitkitTreeView, IconAbortCircle, IconAbortCircleFilled, IconAddons, IconAgent, IconAnchor, IconAndroid, IconApp, IconAppSettings, IconAppStore, IconAppStoreColor, IconApple, IconArchive, IconArchiveDelete, IconArchiveRestore, IconArrowBackAndDown, IconArrowBackAndUp, IconArrowDown, IconArrowForwardAndDown, IconArrowForwardAndUp, IconArrowLeft, IconArrowNortheast, IconArrowNorthwest, IconArrowRight, IconArrowUp, IconArrowsHorizontal, IconArrowsVertical, IconAutomation, IconAws, IconAwsColor, IconBadge3RdParty, IconBadgeBitrise, IconBadgeUpgrade, IconBadgeVersionOk, IconBazel, IconBell, IconBitbot, IconBitbotError, IconBitbucket, IconBitbucketColor, IconBitbucketNeutral, IconBitbucketWhite, IconBlockCircle, IconBook, IconBoxArrowDown, IconBoxDot, IconBoxLinesOverflow, IconBoxLinesWrap, IconBranch, IconBrowserstackColor, IconBug, IconBuild, IconBuildCache, IconBuildCacheFilled, IconBuildEnvSetup, IconBuildHub, IconBuildHubFilled, IconCalendar, IconChangePlan, IconChat, IconCheck, IconCheckCircle, IconCheckCircleFilled, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconCi, IconCiFilled, IconCircle, IconCircleDashed, IconCircleHalfFilled, IconClaude, IconClaudeColor, IconClock, IconCode, IconCodePush, IconCodeSigning, IconCoffee, IconCommit, IconConfigure, IconConnectedAccounts, IconContainer, IconCopy, IconCordova, IconCpu, IconCreditcard, IconCredits, IconCross, IconCrossCircle, IconCrossCircleFilled, IconCrown, IconCycle, IconDashboard, IconDashboardFilled, IconDeployment, IconDetails, IconDoc, IconDollar, IconDot, IconDotnet, IconDotnetColor, IconDotnetText, IconDotnetTextColor, IconDoubleCircle, IconDownload, IconDragHandle, IconEc2Ami, IconEnterprise, IconErrorCircle, IconErrorCircleFilled, IconExpand, IconExtraBuildCapacity, IconEye, IconEyeSlash, IconFastlane, IconFileDoc, IconFilePdf, IconFilePlist, IconFileYml, IconFileZip, IconFilter, IconFlag, IconFlutter, IconFolder, IconFullscreen, IconFullscreenExit, IconGauge, IconGit, IconGithub, IconGitlab, IconGitlabColor, IconGitlabWhite, IconGlobe, IconGo, IconGoogleColor, IconGooglePlay, IconGooglePlayColor, IconGradle, IconGroup, IconHashtag, IconHeadset, IconHeart, IconHistory, IconHourglass, IconImage, IconInfoCircle, IconInfoCircleFilled, IconInsights, IconInsightsFilled, IconInstall, IconInteraction, IconInvoice, IconIonic, IconJapanese, IconJava, IconJavaColor, IconJavaDuke, IconJavaDukeColor, IconKey, IconKotlin, IconKotlinColor, IconKotlinWhite, IconLaptop, IconLaunchdarkly, IconLegacyApp, IconLightbulb, IconLink, IconLinux, IconLock, IconLockOpen, IconLogin, IconLogout, IconMacos, IconMagicWand, IconMagnifier, IconMail, IconMedal, IconMemory, IconMenuGrid, IconMenuHamburger, IconMessage, IconMessageAlert, IconMessageQuestion, IconMicrophone, IconMinus, IconMinusCircle, IconMinusCircleFilled, IconMobile, IconMobileLandscape, IconMonitorChart, IconMoreHorizontal, IconMoreVertical, IconNews, IconNextjs, IconNodejs, IconOpenInNew, IconOther, IconOutsideContributor, IconOverview, IconPause, IconPencil, IconPeople, IconPercent, IconPerson, IconPersonWithDesk, IconPlay, IconPlus, IconPlusCircle, IconPlusCircleFilled, IconPower, IconProject, IconProjectSettings, IconPull, IconPush, IconPuzzle, IconPython, IconPythonColor, IconQuestionCircle, IconQuestionCircleFilled, IconReact, IconRefresh, IconRegex, IconRelease, IconReleaseFilled, IconRemoteAccess, IconReplace, IconResponsiveness, IconReviewerApproved, IconReviewerAssigned, IconReviewerRejected, IconRuby, IconRubyColor, IconSave, IconSecurityShield, IconSettings, IconSettingsFilled, IconShuffle, IconSiren, IconSkip, IconSkipCircle, IconSkipCircleFilled, IconSlack, IconSlackColor, IconSparkle, IconSparkleFilled, IconSpinnerOnDisabled, IconSpinnerPurple, IconSpinnerPurpleDouble, IconSpinnerWhite, IconStability, IconStack, IconStar, IconStep, IconStop, IconStopwatch, IconTag, IconTasks, IconTeams, IconTeamsColor, IconTemplateCode, IconTerminal, IconTestQuarantine, IconThemeDarkToggle, IconThumbDown, IconThumbUp, IconTools, IconTrash, IconTrigger, IconUbuntu, IconUbuntuColor, IconUnity3D, IconUpload, IconValidateShield, IconVideo, IconWarning, IconWarningYellow, IconWebUi, IconWebhooks, IconWorkflow, IconWorkflowFlow, IconXTwitter, IconXamarin, IconXcode, ResponsiveProvider, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast, createTreeCollection, dismissBitkitToast, rem, useBitkitTour, useResponsive, useStepperDialog };

package/dist/theme/slot-recipes/NoteCard.recipe.d.ts

@@ -1,4 +1,4 @@
-declare const noteCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "iconBar" | "message" | "messageList" | "iconWrapper" | "messageBlock" | "actionArea" | "actionAreaList", {
+declare const noteCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "collapsible" | "root" | "iconBar" | "message" | "messageList" | "iconWrapper" | "messageBlock" | "collapsibleContent" | "collapsibleTrigger" | "actionArea" | "actionAreaList", {
     status: {
         ai: {
             iconBar: {

package/dist/theme/slot-recipes/NoteCard.recipe.js

@@ -41,6 +41,9 @@ var noteCardSlotRecipe = defineSlotRecipe({
 		"messageList",
 		"title",
 		"message",
+		"collapsible",
+		"collapsibleContent",
+		"collapsibleTrigger",
 		"actionArea",
 		"actionAreaList"
 	],
@@ -102,6 +105,27 @@ var noteCardSlotRecipe = defineSlotRecipe({
 			textStyle: "body/md/regular",
 			color: "text/body"
 		},
+		collapsible: {
+			display: "flex",
+			flexDirection: "column",
+			gap: "4",
+			width: "100%"
+		},
+		collapsibleContent: {
+			overflow: "hidden",
+			_open: {
+				animationName: "expand-height, fade-in",
+				animationDuration: "moderate"
+			},
+			_closed: {
+				animationName: "collapse-height, fade-out",
+				animationDuration: "moderate"
+			}
+		},
+		collapsibleTrigger: {
+			alignSelf: "flex-start",
+			marginBlockStart: "4"
+		},
 		actionArea: { flexShrink: 0 },
 		actionAreaList: { alignSelf: { tablet: "flex-start" } }
 	},

package/dist/theme/slot-recipes/NoteCard.recipe.js.map

@@ -1 +1 @@
-{"version":3,"file":"NoteCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/NoteCard.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { type NotificationVariant } from '../common/AlertAndToast.common';\n\nconst MESSAGE_ONLY_STATUSES: NotificationVariant[] = ['critical', 'progress', 'success'];\n\nconst SIDEBAR_ICON_COLOR_MAP: Record<NotificationVariant, string> = {\n  ai: 'color/indigo/base',\n  critical: 'color/red/base',\n  info: 'color/blue/base',\n  progress: 'color/purple/base',\n  success: 'color/green/base',\n  warning: 'color/yellow/base',\n};\n\nconst STATUS_TEXT_COLOR_MAP: Record<NotificationVariant, string> = {\n  ai: 'status/ai/text',\n  critical: 'text/negative',\n  info: 'text/primary',\n  progress: 'text/secondary',\n  success: 'text/positive',\n  warning: 'text/primary',\n};\n\nconst getStatusVariant = (v: NotificationVariant) => ({\n  iconBar: {\n    backgroundColor: `status/${v}/bg`,\n    color: SIDEBAR_ICON_COLOR_MAP[v],\n  },\n  root: { borderColor: `status/${v}/border` },\n  title: { color: STATUS_TEXT_COLOR_MAP[v] },\n  ...(MESSAGE_ONLY_STATUSES.includes(v) && {\n    message: { '&:only-child': { color: STATUS_TEXT_COLOR_MAP[v] } },\n  }),\n});\n\nconst noteCardSlotRecipe = defineSlotRecipe({\n  className: 'note-card',\n  slots: [\n    'root',\n    'iconBar',\n    'iconWrapper',\n    'content',\n    'messageBlock',\n    'messageList',\n    'title',\n    'message',\n    'actionArea',\n    'actionAreaList',\n  ],\n  base: {\n    root: {\n      alignItems: 'stretch',\n      backgroundColor: 'background/primary',\n      border: '1px solid',\n      borderRadius: '8',\n      display: 'flex',\n      overflow: 'hidden',\n    },\n    iconBar: {\n      alignItems: 'flex-start',\n      display: 'flex',\n      flexShrink: 0,\n      justifyContent: 'center',\n      paddingBlock: '12',\n      paddingInline: '8',\n    },\n    iconWrapper: {\n      alignItems: 'center',\n      display: 'flex',\n      height: '24',\n      justifyContent: 'center',\n      width: '24',\n    },\n    content: {\n      alignItems: { base: 'flex-end', tablet: 'center' },\n      display: 'flex',\n      flex: 1,\n      flexDirection: { base: 'column', tablet: 'row' },\n      gap: { base: '12', tablet: '24' },\n      minWidth: 0,\n      paddingBlock: '12',\n      paddingInlineEnd: '16',\n      paddingInlineStart: '12',\n    },\n    messageBlock: {\n      display: 'flex',\n      flex: 1,\n      flexDirection: 'column',\n      gap: '4',\n      minWidth: 0,\n      width: '100%',\n    },\n    messageList: {\n      paddingBlock: '4',\n    },\n    title: {\n      textStyle: 'body/lg/semibold',\n    },\n    message: {\n      textStyle: 'body/md/regular',\n      color: 'text/body',\n    },\n    actionArea: {\n      flexShrink: 0,\n    },\n    actionAreaList: {\n      alignSelf: { tablet: 'flex-start' },\n    },\n  },\n  variants: {\n    status: {\n      ai: {\n        iconBar: {\n          background: 'gradient/ai/background/minimal-vertical',\n          color: SIDEBAR_ICON_COLOR_MAP.ai,\n        },\n        root: {\n          backgroundColor: 'transparent',\n          border: '1px solid transparent',\n          background:\n            'linear-gradient({colors.neutral.100}, {colors.neutral.100}) padding-box, linear-gradient(135deg, {colors.purple.80} 0%, {colors.indigo.80} 50%, {colors.blue.80} 100%) border-box',\n        },\n        title: { color: STATUS_TEXT_COLOR_MAP.ai },\n      },\n      critical: getStatusVariant('critical'),\n      info: getStatusVariant('info'),\n      progress: getStatusVariant('progress'),\n      success: getStatusVariant('success'),\n      warning: getStatusVariant('warning'),\n    },\n  },\n  defaultVariants: {\n    status: 'info',\n  },\n});\n\nexport default noteCardSlotRecipe;\n"],"mappings":";;AAIA,IAAM,wBAA+C;CAAC;CAAY;CAAY;AAAS;AAEvF,IAAM,yBAA8D;CAClE,IAAI;CACJ,UAAU;CACV,MAAM;CACN,UAAU;CACV,SAAS;CACT,SAAS;AACX;AAEA,IAAM,wBAA6D;CACjE,IAAI;CACJ,UAAU;CACV,MAAM;CACN,UAAU;CACV,SAAS;CACT,SAAS;AACX;AAEA,IAAM,oBAAoB,OAA4B;CACpD,SAAS;EACP,iBAAiB,UAAU,EAAE;EAC7B,OAAO,uBAAuB;CAChC;CACA,MAAM,EAAE,aAAa,UAAU,EAAE,SAAS;CAC1C,OAAO,EAAE,OAAO,sBAAsB,GAAG;CACzC,GAAI,sBAAsB,SAAS,CAAC,KAAK,EACvC,SAAS,EAAE,gBAAgB,EAAE,OAAO,sBAAsB,GAAG,EAAE,EACjE;AACF;AAEA,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,iBAAiB;GACjB,QAAQ;GACR,cAAc;GACd,SAAS;GACT,UAAU;EACZ;EACA,SAAS;GACP,YAAY;GACZ,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,cAAc;GACd,eAAe;EACjB;EACA,aAAa;GACX,YAAY;GACZ,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,OAAO;EACT;EACA,SAAS;GACP,YAAY;IAAE,MAAM;IAAY,QAAQ;GAAS;GACjD,SAAS;GACT,MAAM;GACN,eAAe;IAAE,MAAM;IAAU,QAAQ;GAAM;GAC/C,KAAK;IAAE,MAAM;IAAM,QAAQ;GAAK;GAChC,UAAU;GACV,cAAc;GACd,kBAAkB;GAClB,oBAAoB;EACtB;EACA,cAAc;GACZ,SAAS;GACT,MAAM;GACN,eAAe;GACf,KAAK;GACL,UAAU;GACV,OAAO;EACT;EACA,aAAa,EACX,cAAc,IAChB;EACA,OAAO,EACL,WAAW,mBACb;EACA,SAAS;GACP,WAAW;GACX,OAAO;EACT;EACA,YAAY,EACV,YAAY,EACd;EACA,gBAAgB,EACd,WAAW,EAAE,QAAQ,aAAa,EACpC;CACF;CACA,UAAU,EACR,QAAQ;EACN,IAAI;GACF,SAAS;IACP,YAAY;IACZ,OAAO,uBAAuB;GAChC;GACA,MAAM;IACJ,iBAAiB;IACjB,QAAQ;IACR,YACE;GACJ;GACA,OAAO,EAAE,OAAO,sBAAsB,GAAG;EAC3C;EACA,UAAU,iBAAiB,UAAU;EACrC,MAAM,iBAAiB,MAAM;EAC7B,UAAU,iBAAiB,UAAU;EACrC,SAAS,iBAAiB,SAAS;EACnC,SAAS,iBAAiB,SAAS;CACrC,EACF;CACA,iBAAiB,EACf,QAAQ,OACV;AACF,CAAC"}
+{"version":3,"file":"NoteCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/NoteCard.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { type NotificationVariant } from '../common/AlertAndToast.common';\n\nconst MESSAGE_ONLY_STATUSES: NotificationVariant[] = ['critical', 'progress', 'success'];\n\nconst SIDEBAR_ICON_COLOR_MAP: Record<NotificationVariant, string> = {\n  ai: 'color/indigo/base',\n  critical: 'color/red/base',\n  info: 'color/blue/base',\n  progress: 'color/purple/base',\n  success: 'color/green/base',\n  warning: 'color/yellow/base',\n};\n\nconst STATUS_TEXT_COLOR_MAP: Record<NotificationVariant, string> = {\n  ai: 'status/ai/text',\n  critical: 'text/negative',\n  info: 'text/primary',\n  progress: 'text/secondary',\n  success: 'text/positive',\n  warning: 'text/primary',\n};\n\nconst getStatusVariant = (v: NotificationVariant) => ({\n  iconBar: {\n    backgroundColor: `status/${v}/bg`,\n    color: SIDEBAR_ICON_COLOR_MAP[v],\n  },\n  root: { borderColor: `status/${v}/border` },\n  title: { color: STATUS_TEXT_COLOR_MAP[v] },\n  ...(MESSAGE_ONLY_STATUSES.includes(v) && {\n    message: { '&:only-child': { color: STATUS_TEXT_COLOR_MAP[v] } },\n  }),\n});\n\nconst noteCardSlotRecipe = defineSlotRecipe({\n  className: 'note-card',\n  slots: [\n    'root',\n    'iconBar',\n    'iconWrapper',\n    'content',\n    'messageBlock',\n    'messageList',\n    'title',\n    'message',\n    'collapsible',\n    'collapsibleContent',\n    'collapsibleTrigger',\n    'actionArea',\n    'actionAreaList',\n  ],\n  base: {\n    root: {\n      alignItems: 'stretch',\n      backgroundColor: 'background/primary',\n      border: '1px solid',\n      borderRadius: '8',\n      display: 'flex',\n      overflow: 'hidden',\n    },\n    iconBar: {\n      alignItems: 'flex-start',\n      display: 'flex',\n      flexShrink: 0,\n      justifyContent: 'center',\n      paddingBlock: '12',\n      paddingInline: '8',\n    },\n    iconWrapper: {\n      alignItems: 'center',\n      display: 'flex',\n      height: '24',\n      justifyContent: 'center',\n      width: '24',\n    },\n    content: {\n      alignItems: { base: 'flex-end', tablet: 'center' },\n      display: 'flex',\n      flex: 1,\n      flexDirection: { base: 'column', tablet: 'row' },\n      gap: { base: '12', tablet: '24' },\n      minWidth: 0,\n      paddingBlock: '12',\n      paddingInlineEnd: '16',\n      paddingInlineStart: '12',\n    },\n    messageBlock: {\n      display: 'flex',\n      flex: 1,\n      flexDirection: 'column',\n      gap: '4',\n      minWidth: 0,\n      width: '100%',\n    },\n    messageList: {\n      paddingBlock: '4',\n    },\n    title: {\n      textStyle: 'body/lg/semibold',\n    },\n    message: {\n      textStyle: 'body/md/regular',\n      color: 'text/body',\n    },\n    collapsible: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '4',\n      width: '100%',\n    },\n    collapsibleContent: {\n      overflow: 'hidden',\n      _open: {\n        animationName: 'expand-height, fade-in',\n        animationDuration: 'moderate',\n      },\n      _closed: {\n        animationName: 'collapse-height, fade-out',\n        animationDuration: 'moderate',\n      },\n    },\n    collapsibleTrigger: {\n      alignSelf: 'flex-start',\n      marginBlockStart: '4',\n    },\n    actionArea: {\n      flexShrink: 0,\n    },\n    actionAreaList: {\n      alignSelf: { tablet: 'flex-start' },\n    },\n  },\n  variants: {\n    status: {\n      ai: {\n        iconBar: {\n          background: 'gradient/ai/background/minimal-vertical',\n          color: SIDEBAR_ICON_COLOR_MAP.ai,\n        },\n        root: {\n          backgroundColor: 'transparent',\n          border: '1px solid transparent',\n          background:\n            'linear-gradient({colors.neutral.100}, {colors.neutral.100}) padding-box, linear-gradient(135deg, {colors.purple.80} 0%, {colors.indigo.80} 50%, {colors.blue.80} 100%) border-box',\n        },\n        title: { color: STATUS_TEXT_COLOR_MAP.ai },\n      },\n      critical: getStatusVariant('critical'),\n      info: getStatusVariant('info'),\n      progress: getStatusVariant('progress'),\n      success: getStatusVariant('success'),\n      warning: getStatusVariant('warning'),\n    },\n  },\n  defaultVariants: {\n    status: 'info',\n  },\n});\n\nexport default noteCardSlotRecipe;\n"],"mappings":";;AAIA,IAAM,wBAA+C;CAAC;CAAY;CAAY;AAAS;AAEvF,IAAM,yBAA8D;CAClE,IAAI;CACJ,UAAU;CACV,MAAM;CACN,UAAU;CACV,SAAS;CACT,SAAS;AACX;AAEA,IAAM,wBAA6D;CACjE,IAAI;CACJ,UAAU;CACV,MAAM;CACN,UAAU;CACV,SAAS;CACT,SAAS;AACX;AAEA,IAAM,oBAAoB,OAA4B;CACpD,SAAS;EACP,iBAAiB,UAAU,EAAE;EAC7B,OAAO,uBAAuB;CAChC;CACA,MAAM,EAAE,aAAa,UAAU,EAAE,SAAS;CAC1C,OAAO,EAAE,OAAO,sBAAsB,GAAG;CACzC,GAAI,sBAAsB,SAAS,CAAC,KAAK,EACvC,SAAS,EAAE,gBAAgB,EAAE,OAAO,sBAAsB,GAAG,EAAE,EACjE;AACF;AAEA,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,iBAAiB;GACjB,QAAQ;GACR,cAAc;GACd,SAAS;GACT,UAAU;EACZ;EACA,SAAS;GACP,YAAY;GACZ,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,cAAc;GACd,eAAe;EACjB;EACA,aAAa;GACX,YAAY;GACZ,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,OAAO;EACT;EACA,SAAS;GACP,YAAY;IAAE,MAAM;IAAY,QAAQ;GAAS;GACjD,SAAS;GACT,MAAM;GACN,eAAe;IAAE,MAAM;IAAU,QAAQ;GAAM;GAC/C,KAAK;IAAE,MAAM;IAAM,QAAQ;GAAK;GAChC,UAAU;GACV,cAAc;GACd,kBAAkB;GAClB,oBAAoB;EACtB;EACA,cAAc;GACZ,SAAS;GACT,MAAM;GACN,eAAe;GACf,KAAK;GACL,UAAU;GACV,OAAO;EACT;EACA,aAAa,EACX,cAAc,IAChB;EACA,OAAO,EACL,WAAW,mBACb;EACA,SAAS;GACP,WAAW;GACX,OAAO;EACT;EACA,aAAa;GACX,SAAS;GACT,eAAe;GACf,KAAK;GACL,OAAO;EACT;EACA,oBAAoB;GAClB,UAAU;GACV,OAAO;IACL,eAAe;IACf,mBAAmB;GACrB;GACA,SAAS;IACP,eAAe;IACf,mBAAmB;GACrB;EACF;EACA,oBAAoB;GAClB,WAAW;GACX,kBAAkB;EACpB;EACA,YAAY,EACV,YAAY,EACd;EACA,gBAAgB,EACd,WAAW,EAAE,QAAQ,aAAa,EACpC;CACF;CACA,UAAU,EACR,QAAQ;EACN,IAAI;GACF,SAAS;IACP,YAAY;IACZ,OAAO,uBAAuB;GAChC;GACA,MAAM;IACJ,iBAAiB;IACjB,QAAQ;IACR,YACE;GACJ;GACA,OAAO,EAAE,OAAO,sBAAsB,GAAG;EAC3C;EACA,UAAU,iBAAiB,UAAU;EACrC,MAAM,iBAAiB,MAAM;EAC7B,UAAU,iBAAiB,UAAU;EACrC,SAAS,iBAAiB,SAAS;EACnC,SAAS,iBAAiB,SAAS;CACrC,EACF;CACA,iBAAiB,EACf,QAAQ,OACV;AACF,CAAC"}

package/dist/theme/slot-recipes/Table.recipe.d.ts

@@ -41,6 +41,31 @@ declare const tableSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"
                 borderTopColor: "border/regular";
             };
         };
+        card: {
+            columnHeader: {
+                borderBottomColor: "border/minimal";
+                height: "48";
+                padding: "12";
+            };
+            cell: {
+                borderBottomColor: "border/minimal";
+                borderTopColor: "border/minimal";
+                paddingInline: "12";
+            };
+            row: {
+                'thead &, tbody &': {
+                    '& > :where(td, th):first-child': {
+                        paddingInlineStart: "24";
+                    };
+                    '& > :where(td, th):last-child': {
+                        paddingInlineEnd: "24";
+                    };
+                };
+            };
+            footer: {
+                borderTopColor: "border/minimal";
+            };
+        };
     };
     size: {
         sm: {

package/dist/theme/slot-recipes/Table.recipe.js

@@ -190,6 +190,23 @@ var tableSlotRecipe = defineSlotRecipe({
 					paddingInline: "12"
 				},
 				footer: { borderTopColor: "border/regular" }
+			},
+			card: {
+				columnHeader: {
+					borderBottomColor: "border/minimal",
+					height: "48",
+					padding: "12"
+				},
+				cell: {
+					borderBottomColor: "border/minimal",
+					borderTopColor: "border/minimal",
+					paddingInline: "12"
+				},
+				row: { "thead &, tbody &": {
+					"& > :where(td, th):first-child": { paddingInlineStart: "24" },
+					"& > :where(td, th):last-child": { paddingInlineEnd: "24" }
+				} },
+				footer: { borderTopColor: "border/minimal" }
 			}
 		},
 		size: {
@@ -301,6 +318,17 @@ var tableSlotRecipe = defineSlotRecipe({
 			layout: "stacked",
 			variant: "borderless"
 		},
+		{
+			css: {
+				cell: { paddingInline: "16" },
+				row: { "thead &, tbody &": {
+					"& > :where(td, th):first-child": { paddingInlineStart: "16" },
+					"& > :where(td, th):last-child": { paddingInlineEnd: "16" }
+				} }
+			},
+			layout: "stacked",
+			variant: "card"
+		},
 		{
 			css: { cell: { height: "auto" } },
 			layout: "stacked"

package/dist/theme/slot-recipes/Table.recipe.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Table.recipe.ts"],"sourcesContent":["import { tableAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\n// A control like a checkbox renders as an inline-flex <label>, which sits on the line box's\n// baseline — so the text strut's descender space leaves it a pixel or two above the row's centre.\n// Making it block-level takes the line box out of the equation and lets vertical-align: middle\n// centre it exactly.\nconst controlOnlyCell = {\n  '& > :where(label):only-child': {\n    display: 'flex',\n  },\n};\n\nconst tableSlotRecipe = defineSlotRecipe({\n  className: 'table',\n  slots: [\n    ...tableAnatomy.keys(),\n    'actionsCell',\n    'actionsGroup',\n    'bulkActionsGroup',\n    'bulkActionsButtons',\n    'expandCell',\n    'expandTrigger',\n    'expandableRow',\n    'expandedCell',\n    'expandedContent',\n    'expandedRow',\n    'filterControls',\n    'linkedRow',\n    'rowLink',\n    'sortColumnHeader',\n    'sortTrigger',\n    'utilityCell',\n  ],\n  base: {\n    root: {\n      fontVariantNumeric: 'lining-nums tabular-nums',\n      textAlign: 'start',\n      width: 'full',\n    },\n    caption: {\n      captionSide: 'top !important',\n      textAlign: 'start',\n      '& > * + *': {\n        marginBlockStart: '4',\n      },\n    },\n    cell: {\n      color: 'text/body',\n      textStyle: 'body/md/regular',\n    },\n    actionsCell: {\n      textAlign: 'end',\n      whiteSpace: 'nowrap',\n      // Shrink-to-fit: a table cell can't go below its content width, so any value under the\n      // content's own width collapses the column around the buttons and leaves the rest to\n      // the data columns.\n      width: '1%',\n    },\n    actionsGroup: {\n      alignItems: 'center',\n      display: 'inline-flex',\n      gap: '8',\n      position: 'relative',\n    },\n    bulkActionsGroup: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '12',\n    },\n    bulkActionsButtons: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '12',\n      marginInlineStart: 'auto',\n    },\n    expandCell: {\n      paddingBlock: 0,\n      paddingInline: 0,\n      verticalAlign: 'middle',\n      width: '48',\n    },\n    // A fixed 32x32 box (per the design), centred in the cell by the cell's own vertical-align.\n    // Deriving the size from padding instead leaves it at the mercy of the Collapsible recipe's\n    // asymmetric paddingBlockStart, which is what pushed the chevron 2px above the row's centre.\n    expandTrigger: {\n      alignItems: 'center',\n      background: 'none',\n      border: 'none',\n      cursor: 'pointer',\n      display: 'flex',\n      height: '32',\n      justifyContent: 'center',\n      marginInlineStart: '12',\n      padding: 0,\n      width: '32',\n    },\n    expandableRow: {\n      '& > td': {\n        borderBottomWidth: 0,\n      },\n    },\n    expandedCell: {\n      height: 0,\n      paddingBlock: 0,\n      paddingInline: 0,\n    },\n    expandedContent: {\n      borderBlockStartColor: 'border/minimal',\n      borderBlockStartStyle: 'solid',\n      borderBlockStartWidth: '1',\n      marginInlineEnd: '16',\n      marginInlineStart: '48',\n      paddingBlockEnd: '24',\n      paddingBlockStart: '16',\n      paddingInlineEnd: '16',\n      paddingInlineStart: '12',\n    },\n    expandedRow: {\n      _hover: {\n        background: 'none',\n      },\n    },\n    filterControls: {\n      alignItems: 'center',\n      display: 'flex',\n      flexWrap: 'wrap',\n      gap: '16',\n      width: 'full',\n    },\n    linkedRow: {\n      position: 'relative',\n      _hover: {\n        backgroundColor: 'background/secondary',\n      },\n      '& :where(a:not([data-row-link]), button, input, label, select)': {\n        position: 'relative',\n        zIndex: '1',\n      },\n    },\n    rowLink: {\n      textDecoration: 'none',\n      // The row's own background change is the hover affordance; the link recipe's hover\n      // underline would fire on every row hover, since the stretched pseudo covers the row.\n      _hover: {\n        textDecoration: 'none',\n      },\n      _after: {\n        content: '\"\"',\n        inset: 0,\n        position: 'absolute',\n      },\n      _focusVisible: {\n        outline: 'none',\n        _after: {\n          outline: 'var(--focus-ring-width) var(--focus-ring-style) var(--focus-ring-color)',\n          outlineOffset: 'calc(var(--focus-ring-width) * -1)',\n        },\n      },\n    },\n    sortColumnHeader: {\n      paddingBlock: 0,\n      paddingInline: 0,\n    },\n    sortTrigger: {\n      alignItems: 'center',\n      appearance: 'none',\n      background: 'none',\n      border: 'none',\n      color: 'inherit',\n      cursor: 'pointer',\n      display: 'flex',\n      font: 'inherit',\n      gap: '8',\n      height: 'full',\n      paddingBlock: '12',\n      paddingInline: '16',\n      userSelect: 'none',\n      width: 'full',\n      _focusVisible: {\n        outlineOffset: '-3px',\n      },\n      _hover: {\n        backgroundColor: 'background/active',\n      },\n    },\n    utilityCell: {\n      height: 'auto',\n      paddingBlock: '12',\n      paddingInline: '16',\n    },\n  },\n  variants: {\n    variant: {\n      default: {\n        root: {\n          borderColor: 'border/regular',\n          borderRadius: '4',\n          borderStyle: 'solid',\n          borderWidth: '1',\n          overflow: 'hidden',\n        },\n        header: {\n          '& :where(th)': {\n            backgroundColor: 'background/tertiary',\n          },\n        },\n        columnHeader: {\n          borderBottomColor: 'border/minimal',\n          paddingBlock: '12',\n          paddingInline: '16',\n        },\n        cell: {\n          borderBottomColor: 'border/minimal',\n          borderTopColor: 'border/minimal',\n          paddingInline: '16',\n        },\n        footer: {\n          borderTopColor: 'border/minimal',\n        },\n      },\n      borderless: {\n        columnHeader: {\n          borderBottomColor: 'border/regular',\n          padding: '12',\n        },\n        cell: {\n          borderBottomColor: 'border/regular',\n          borderTopColor: 'border/regular',\n          paddingInline: '12',\n        },\n        footer: {\n          borderTopColor: 'border/regular',\n        },\n      },\n    },\n    size: {\n      sm: {\n        cell: {\n          height: '48',\n        },\n      },\n      md: {\n        cell: {\n          height: rem(56),\n        },\n      },\n      lg: {\n        cell: {\n          height: '64',\n        },\n      },\n    },\n    // Hovering a row tints it. Usually a reading aid on a long or wide table rather than a hint\n    // that the row is clickable, so it says nothing about the row being interactive — turn it off\n    // for short, static tables where there is no place to lose.\n    rowHover: {\n      true: {},\n      false: {},\n    },\n    layout: {\n      table: {\n        root: {\n          borderCollapse: 'separate',\n          borderSpacing: '0',\n        },\n        caption: {\n          marginBlockEnd: '24',\n        },\n        columnHeader: {\n          borderBottomStyle: 'solid',\n          borderBottomWidth: '1',\n          color: 'text/primary',\n          fontWeight: 'bold',\n          textAlign: 'start',\n          textStyle: 'heading/h5',\n          verticalAlign: 'middle',\n          ...controlOnlyCell,\n        },\n        cell: {\n          borderBottomStyle: 'solid',\n          borderBottomWidth: '1',\n          verticalAlign: 'middle',\n          ...controlOnlyCell,\n          // border-collapse: separate ignores borders on tfoot itself (CSS 2.1 §17.6.1),\n          // so the body/footer divider has to live on the footer's cells.\n          'tfoot &': {\n            borderBottomWidth: 0,\n            borderTopStyle: 'solid',\n            borderTopWidth: '1',\n          },\n        },\n        body: {\n          '& :where(tr)': {\n            '&:has(input:checked), &[data-selected]': {\n              backgroundColor: 'background/selected',\n              _hover: {\n                backgroundColor: 'background/selected',\n              },\n            },\n          },\n          '& :where(tr:last-child) td': {\n            borderBottomWidth: 0,\n          },\n        },\n      },\n      stacked: {\n        root: {\n          display: 'block',\n        },\n        caption: {\n          display: 'block',\n          padding: '16',\n          backgroundColor: 'background/secondary',\n          borderBottomColor: 'border/minimal',\n          borderBottomStyle: 'solid',\n          borderBottomWidth: '1',\n        },\n        header: {\n          borderWidth: 0,\n          clip: 'rect(0, 0, 0, 0)',\n          height: '1',\n          margin: '-1px',\n          overflow: 'hidden',\n          padding: 0,\n          position: 'absolute',\n          whiteSpace: 'nowrap',\n          width: '1',\n        },\n        body: {\n          display: 'block',\n        },\n        row: {\n          borderBottomColor: 'border/minimal',\n          borderBottomStyle: 'solid',\n          borderBottomWidth: '1',\n          display: 'block',\n          paddingBlock: '12',\n          '&:last-child': {\n            borderBottomWidth: 0,\n          },\n        },\n        cell: {\n          alignItems: 'center',\n          display: 'flex',\n          minHeight: '48',\n          paddingInline: '16',\n          _before: {\n            alignSelf: 'center',\n            color: 'text/primary',\n            content: 'attr(data-label)',\n            flexShrink: 0,\n            fontWeight: 'semibold',\n            marginInlineEnd: '16',\n            width: '96',\n          },\n          'tfoot &': {\n            display: 'block',\n            paddingInline: 0,\n            _before: {\n              content: 'none',\n            },\n          },\n        },\n        // display: block takes tfoot out of the table model, so a border on it does render here\n        footer: {\n          borderTopStyle: 'solid',\n          borderTopWidth: '1',\n          display: 'block',\n        },\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      css: {\n        row: {\n          borderBottomColor: 'border/regular',\n        },\n      },\n      layout: 'stacked',\n      variant: 'borderless',\n    },\n    // The `size` variant pins a fixed cell height (48/56/64px), and it is merged after `layout`\n    // regardless of declaration order — so only a compound variant can release it. Stacked cells\n    // are flex containers whose content (label gutter + a multi-line value) routinely needs more\n    // room than the fixed height, and the stacked `cell` keeps `minHeight: 48` as the floor.\n    {\n      css: {\n        cell: {\n          height: 'auto',\n        },\n      },\n      layout: 'stacked',\n    },\n    // Scoped to `layout: table` because that is where the hover lived before: the stacked layout\n    // renders rows as blocks and never tinted them.\n    {\n      css: {\n        body: {\n          '& :where(tr)': {\n            _hover: {\n              backgroundColor: 'background/secondary',\n            },\n          },\n        },\n      },\n      layout: 'table',\n      rowHover: true,\n    },\n  ],\n  defaultVariants: {\n    layout: 'table',\n    rowHover: true,\n    size: 'lg',\n    variant: 'default',\n  },\n});\n\nexport default tableSlotRecipe;\n"],"mappings":"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"}
+{"version":3,"file":"Table.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Table.recipe.ts"],"sourcesContent":["import { tableAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\n// A control like a checkbox renders as an inline-flex <label>, which sits on the line box's\n// baseline — so the text strut's descender space leaves it a pixel or two above the row's centre.\n// Making it block-level takes the line box out of the equation and lets vertical-align: middle\n// centre it exactly.\nconst controlOnlyCell = {\n  '& > :where(label):only-child': {\n    display: 'flex',\n  },\n};\n\nconst tableSlotRecipe = defineSlotRecipe({\n  className: 'table',\n  slots: [\n    ...tableAnatomy.keys(),\n    'actionsCell',\n    'actionsGroup',\n    'bulkActionsGroup',\n    'bulkActionsButtons',\n    'expandCell',\n    'expandTrigger',\n    'expandableRow',\n    'expandedCell',\n    'expandedContent',\n    'expandedRow',\n    'filterControls',\n    'linkedRow',\n    'rowLink',\n    'sortColumnHeader',\n    'sortTrigger',\n    'utilityCell',\n  ],\n  base: {\n    root: {\n      fontVariantNumeric: 'lining-nums tabular-nums',\n      textAlign: 'start',\n      width: 'full',\n    },\n    caption: {\n      captionSide: 'top !important',\n      textAlign: 'start',\n      '& > * + *': {\n        marginBlockStart: '4',\n      },\n    },\n    cell: {\n      color: 'text/body',\n      textStyle: 'body/md/regular',\n    },\n    actionsCell: {\n      textAlign: 'end',\n      whiteSpace: 'nowrap',\n      // Shrink-to-fit: a table cell can't go below its content width, so any value under the\n      // content's own width collapses the column around the buttons and leaves the rest to\n      // the data columns.\n      width: '1%',\n    },\n    actionsGroup: {\n      alignItems: 'center',\n      display: 'inline-flex',\n      gap: '8',\n      position: 'relative',\n    },\n    bulkActionsGroup: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '12',\n    },\n    bulkActionsButtons: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '12',\n      marginInlineStart: 'auto',\n    },\n    expandCell: {\n      paddingBlock: 0,\n      paddingInline: 0,\n      verticalAlign: 'middle',\n      width: '48',\n    },\n    // A fixed 32x32 box (per the design), centred in the cell by the cell's own vertical-align.\n    // Deriving the size from padding instead leaves it at the mercy of the Collapsible recipe's\n    // asymmetric paddingBlockStart, which is what pushed the chevron 2px above the row's centre.\n    expandTrigger: {\n      alignItems: 'center',\n      background: 'none',\n      border: 'none',\n      cursor: 'pointer',\n      display: 'flex',\n      height: '32',\n      justifyContent: 'center',\n      marginInlineStart: '12',\n      padding: 0,\n      width: '32',\n    },\n    expandableRow: {\n      '& > td': {\n        borderBottomWidth: 0,\n      },\n    },\n    expandedCell: {\n      height: 0,\n      paddingBlock: 0,\n      paddingInline: 0,\n    },\n    expandedContent: {\n      borderBlockStartColor: 'border/minimal',\n      borderBlockStartStyle: 'solid',\n      borderBlockStartWidth: '1',\n      marginInlineEnd: '16',\n      marginInlineStart: '48',\n      paddingBlockEnd: '24',\n      paddingBlockStart: '16',\n      paddingInlineEnd: '16',\n      paddingInlineStart: '12',\n    },\n    expandedRow: {\n      _hover: {\n        background: 'none',\n      },\n    },\n    filterControls: {\n      alignItems: 'center',\n      display: 'flex',\n      flexWrap: 'wrap',\n      gap: '16',\n      width: 'full',\n    },\n    linkedRow: {\n      position: 'relative',\n      _hover: {\n        backgroundColor: 'background/secondary',\n      },\n      '& :where(a:not([data-row-link]), button, input, label, select)': {\n        position: 'relative',\n        zIndex: '1',\n      },\n    },\n    rowLink: {\n      textDecoration: 'none',\n      // The row's own background change is the hover affordance; the link recipe's hover\n      // underline would fire on every row hover, since the stretched pseudo covers the row.\n      _hover: {\n        textDecoration: 'none',\n      },\n      _after: {\n        content: '\"\"',\n        inset: 0,\n        position: 'absolute',\n      },\n      _focusVisible: {\n        outline: 'none',\n        _after: {\n          outline: 'var(--focus-ring-width) var(--focus-ring-style) var(--focus-ring-color)',\n          outlineOffset: 'calc(var(--focus-ring-width) * -1)',\n        },\n      },\n    },\n    sortColumnHeader: {\n      paddingBlock: 0,\n      paddingInline: 0,\n    },\n    sortTrigger: {\n      alignItems: 'center',\n      appearance: 'none',\n      background: 'none',\n      border: 'none',\n      color: 'inherit',\n      cursor: 'pointer',\n      display: 'flex',\n      font: 'inherit',\n      gap: '8',\n      height: 'full',\n      paddingBlock: '12',\n      paddingInline: '16',\n      userSelect: 'none',\n      width: 'full',\n      _focusVisible: {\n        outlineOffset: '-3px',\n      },\n      _hover: {\n        backgroundColor: 'background/active',\n      },\n    },\n    utilityCell: {\n      height: 'auto',\n      paddingBlock: '12',\n      paddingInline: '16',\n    },\n  },\n  variants: {\n    variant: {\n      default: {\n        root: {\n          borderColor: 'border/regular',\n          borderRadius: '4',\n          borderStyle: 'solid',\n          borderWidth: '1',\n          overflow: 'hidden',\n        },\n        header: {\n          '& :where(th)': {\n            backgroundColor: 'background/tertiary',\n          },\n        },\n        columnHeader: {\n          borderBottomColor: 'border/minimal',\n          paddingBlock: '12',\n          paddingInline: '16',\n        },\n        cell: {\n          borderBottomColor: 'border/minimal',\n          borderTopColor: 'border/minimal',\n          paddingInline: '16',\n        },\n        footer: {\n          borderTopColor: 'border/minimal',\n        },\n      },\n      borderless: {\n        columnHeader: {\n          borderBottomColor: 'border/regular',\n          padding: '12',\n        },\n        cell: {\n          borderBottomColor: 'border/regular',\n          borderTopColor: 'border/regular',\n          paddingInline: '12',\n        },\n        footer: {\n          borderTopColor: 'border/regular',\n        },\n      },\n      card: {\n        columnHeader: {\n          borderBottomColor: 'border/minimal',\n          height: '48',\n          padding: '12',\n        },\n        cell: {\n          borderBottomColor: 'border/minimal',\n          borderTopColor: 'border/minimal',\n          paddingInline: '12',\n        },\n        row: {\n          'thead &, tbody &': {\n            '& > :where(td, th):first-child': {\n              paddingInlineStart: '24',\n            },\n            '& > :where(td, th):last-child': {\n              paddingInlineEnd: '24',\n            },\n          },\n        },\n        footer: {\n          borderTopColor: 'border/minimal',\n        },\n      },\n    },\n    size: {\n      sm: {\n        cell: {\n          height: '48',\n        },\n      },\n      md: {\n        cell: {\n          height: rem(56),\n        },\n      },\n      lg: {\n        cell: {\n          height: '64',\n        },\n      },\n    },\n    // Hovering a row tints it. Usually a reading aid on a long or wide table rather than a hint\n    // that the row is clickable, so it says nothing about the row being interactive — turn it off\n    // for short, static tables where there is no place to lose.\n    rowHover: {\n      true: {},\n      false: {},\n    },\n    layout: {\n      table: {\n        root: {\n          borderCollapse: 'separate',\n          borderSpacing: '0',\n        },\n        caption: {\n          marginBlockEnd: '24',\n        },\n        columnHeader: {\n          borderBottomStyle: 'solid',\n          borderBottomWidth: '1',\n          color: 'text/primary',\n          fontWeight: 'bold',\n          textAlign: 'start',\n          textStyle: 'heading/h5',\n          verticalAlign: 'middle',\n          ...controlOnlyCell,\n        },\n        cell: {\n          borderBottomStyle: 'solid',\n          borderBottomWidth: '1',\n          verticalAlign: 'middle',\n          ...controlOnlyCell,\n          // border-collapse: separate ignores borders on tfoot itself (CSS 2.1 §17.6.1),\n          // so the body/footer divider has to live on the footer's cells.\n          'tfoot &': {\n            borderBottomWidth: 0,\n            borderTopStyle: 'solid',\n            borderTopWidth: '1',\n          },\n        },\n        body: {\n          '& :where(tr)': {\n            '&:has(input:checked), &[data-selected]': {\n              backgroundColor: 'background/selected',\n              _hover: {\n                backgroundColor: 'background/selected',\n              },\n            },\n          },\n          '& :where(tr:last-child) td': {\n            borderBottomWidth: 0,\n          },\n        },\n      },\n      stacked: {\n        root: {\n          display: 'block',\n        },\n        caption: {\n          display: 'block',\n          padding: '16',\n          backgroundColor: 'background/secondary',\n          borderBottomColor: 'border/minimal',\n          borderBottomStyle: 'solid',\n          borderBottomWidth: '1',\n        },\n        header: {\n          borderWidth: 0,\n          clip: 'rect(0, 0, 0, 0)',\n          height: '1',\n          margin: '-1px',\n          overflow: 'hidden',\n          padding: 0,\n          position: 'absolute',\n          whiteSpace: 'nowrap',\n          width: '1',\n        },\n        body: {\n          display: 'block',\n        },\n        row: {\n          borderBottomColor: 'border/minimal',\n          borderBottomStyle: 'solid',\n          borderBottomWidth: '1',\n          display: 'block',\n          paddingBlock: '12',\n          '&:last-child': {\n            borderBottomWidth: 0,\n          },\n        },\n        cell: {\n          alignItems: 'center',\n          display: 'flex',\n          minHeight: '48',\n          paddingInline: '16',\n          _before: {\n            alignSelf: 'center',\n            color: 'text/primary',\n            content: 'attr(data-label)',\n            flexShrink: 0,\n            fontWeight: 'semibold',\n            marginInlineEnd: '16',\n            width: '96',\n          },\n          'tfoot &': {\n            display: 'block',\n            paddingInline: 0,\n            _before: {\n              content: 'none',\n            },\n          },\n        },\n        // display: block takes tfoot out of the table model, so a border on it does render here\n        footer: {\n          borderTopStyle: 'solid',\n          borderTopWidth: '1',\n          display: 'block',\n        },\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      css: {\n        row: {\n          borderBottomColor: 'border/regular',\n        },\n      },\n      layout: 'stacked',\n      variant: 'borderless',\n    },\n    // The card gutter and the 12px cell padding are for the wide layout. Stacked rows are blocks\n    // whose cells run vertically, so an inline indent on only the first and last one reads as a\n    // misalignment — everything goes back to the stacked layout's own 16px.\n    {\n      css: {\n        cell: {\n          paddingInline: '16',\n        },\n        row: {\n          'thead &, tbody &': {\n            '& > :where(td, th):first-child': {\n              paddingInlineStart: '16',\n            },\n            '& > :where(td, th):last-child': {\n              paddingInlineEnd: '16',\n            },\n          },\n        },\n      },\n      layout: 'stacked',\n      variant: 'card',\n    },\n    // The `size` variant pins a fixed cell height (48/56/64px), and it is merged after `layout`\n    // regardless of declaration order — so only a compound variant can release it. Stacked cells\n    // are flex containers whose content (label gutter + a multi-line value) routinely needs more\n    // room than the fixed height, and the stacked `cell` keeps `minHeight: 48` as the floor.\n    {\n      css: {\n        cell: {\n          height: 'auto',\n        },\n      },\n      layout: 'stacked',\n    },\n    // Scoped to `layout: table` because that is where the hover lived before: the stacked layout\n    // renders rows as blocks and never tinted them.\n    {\n      css: {\n        body: {\n          '& :where(tr)': {\n            _hover: {\n              backgroundColor: 'background/secondary',\n            },\n          },\n        },\n      },\n      layout: 'table',\n      rowHover: true,\n    },\n  ],\n  defaultVariants: {\n    layout: 'table',\n    rowHover: true,\n    size: 'lg',\n    variant: 'default',\n  },\n});\n\nexport default tableSlotRecipe;\n"],"mappings":"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"}

package/dist/theme/slot-recipes/TableCard.recipe.d.ts

@@ -0,0 +1,2 @@
+declare const tableCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "root" | "description" | "titleBlock" | "contentBlock", import('@chakra-ui/react').SlotRecipeVariantRecord<"body" | "footer" | "header" | "title" | "root" | "description" | "titleBlock" | "contentBlock">>;
+export default tableCardSlotRecipe;

package/dist/theme/slot-recipes/TableCard.recipe.js

@@ -0,0 +1,54 @@
+import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
+import { cardAnatomy } from "@chakra-ui/react/anatomy";
+//#region lib/theme/slot-recipes/TableCard.recipe.ts
+var tableCardAnatomy = cardAnatomy.extendWith("contentBlock", "titleBlock");
+var tableCardSlotRecipe = defineSlotRecipe({
+	className: "table-card",
+	slots: tableCardAnatomy.keys(),
+	base: {
+		root: { overflow: "hidden" },
+		header: {
+			backgroundColor: "background/secondary",
+			borderBottomColor: "border/regular",
+			borderBottomStyle: "solid",
+			borderBottomWidth: "1",
+			paddingBlock: "16",
+			paddingInline: {
+				base: "16",
+				tablet: "24"
+			}
+		},
+		contentBlock: {
+			alignItems: "center",
+			display: "flex",
+			gap: "16",
+			justifyContent: "space-between"
+		},
+		titleBlock: {
+			display: "flex",
+			flex: 1,
+			flexDirection: "column",
+			gap: "4",
+			minWidth: 0
+		},
+		title: {
+			color: "text/primary",
+			textStyle: {
+				base: "heading/h3",
+				tablet: "heading/h4"
+			}
+		},
+		description: {
+			color: "text/secondary",
+			textStyle: "body/md/regular"
+		},
+		body: {
+			backgroundColor: "background/primary",
+			padding: 0
+		}
+	}
+});
+//#endregion
+export { tableCardSlotRecipe as default };
+
+//# sourceMappingURL=TableCard.recipe.js.map

package/dist/theme/slot-recipes/TableCard.recipe.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/TableCard.recipe.ts"],"sourcesContent":["import { cardAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst tableCardAnatomy = cardAnatomy.extendWith('contentBlock', 'titleBlock');\n\nconst tableCardSlotRecipe = defineSlotRecipe({\n  className: 'table-card',\n  slots: tableCardAnatomy.keys(),\n  base: {\n    root: {\n      overflow: 'hidden',\n    },\n    header: {\n      backgroundColor: 'background/secondary',\n      borderBottomColor: 'border/regular',\n      borderBottomStyle: 'solid',\n      borderBottomWidth: '1',\n      paddingBlock: '16',\n      paddingInline: { base: '16', tablet: '24' },\n    },\n    contentBlock: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '16',\n      justifyContent: 'space-between',\n    },\n    titleBlock: {\n      display: 'flex',\n      flex: 1,\n      flexDirection: 'column',\n      gap: '4',\n      minWidth: 0,\n    },\n    title: {\n      color: 'text/primary',\n      textStyle: { base: 'heading/h3', tablet: 'heading/h4' },\n    },\n    description: {\n      color: 'text/secondary',\n      textStyle: 'body/md/regular',\n    },\n    body: {\n      backgroundColor: 'background/primary',\n      padding: 0,\n    },\n  },\n});\n\nexport default tableCardSlotRecipe;\n"],"mappings":";;;AAGA,IAAM,mBAAmB,YAAY,WAAW,gBAAgB,YAAY;AAE5E,IAAM,sBAAsB,iBAAiB;CAC3C,WAAW;CACX,OAAO,iBAAiB,KAAK;CAC7B,MAAM;EACJ,MAAM,EACJ,UAAU,SACZ;EACA,QAAQ;GACN,iBAAiB;GACjB,mBAAmB;GACnB,mBAAmB;GACnB,mBAAmB;GACnB,cAAc;GACd,eAAe;IAAE,MAAM;IAAM,QAAQ;GAAK;EAC5C;EACA,cAAc;GACZ,YAAY;GACZ,SAAS;GACT,KAAK;GACL,gBAAgB;EAClB;EACA,YAAY;GACV,SAAS;GACT,MAAM;GACN,eAAe;GACf,KAAK;GACL,UAAU;EACZ;EACA,OAAO;GACL,OAAO;GACP,WAAW;IAAE,MAAM;IAAc,QAAQ;GAAa;EACxD;EACA,aAAa;GACX,OAAO;GACP,WAAW;EACb;EACA,MAAM;GACJ,iBAAiB;GACjB,SAAS;EACX;CACF;AACF,CAAC"}

package/dist/theme/slot-recipes/index.d.ts

@@ -1184,7 +1184,7 @@ declare const slotRecipes: {
             };
         };
     }>;
-    noteCard: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "iconBar" | "message" | "messageList" | "iconWrapper" | "messageBlock" | "actionArea" | "actionAreaList", {
+    noteCard: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "collapsible" | "root" | "iconBar" | "message" | "messageList" | "iconWrapper" | "messageBlock" | "collapsibleContent" | "collapsibleTrigger" | "actionArea" | "actionAreaList", {
         status: {
             ai: {
                 iconBar: {
@@ -2155,6 +2155,31 @@ declare const slotRecipes: {
                     borderTopColor: "border/regular";
                 };
             };
+            card: {
+                columnHeader: {
+                    borderBottomColor: "border/minimal";
+                    height: "48";
+                    padding: "12";
+                };
+                cell: {
+                    borderBottomColor: "border/minimal";
+                    borderTopColor: "border/minimal";
+                    paddingInline: "12";
+                };
+                row: {
+                    'thead &, tbody &': {
+                        '& > :where(td, th):first-child': {
+                            paddingInlineStart: "24";
+                        };
+                        '& > :where(td, th):last-child': {
+                            paddingInlineEnd: "24";
+                        };
+                    };
+                };
+                footer: {
+                    borderTopColor: "border/minimal";
+                };
+            };
         };
         size: {
             sm: {
@@ -2291,6 +2316,7 @@ declare const slotRecipes: {
             };
         };
     }>;
+    tableCard: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "root" | "description" | "titleBlock" | "contentBlock", import('@chakra-ui/react').SlotRecipeVariantRecord<"body" | "footer" | "header" | "title" | "root" | "description" | "titleBlock" | "contentBlock">>;
     tabs: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "list" | "root" | "trigger" | "indicator" | "contentGroup" | "moreTrigger", {
         variant: {
             line: {

package/dist/theme/slot-recipes/index.js

@@ -51,6 +51,7 @@ import stepCardSlotRecipe from "./StepCard.recipe.js";
 import stepsSlotRecipe from "./Steps.recipe.js";
 import switchSlotRecipe from "./Switch.recipe.js";
 import tableSlotRecipe from "./Table.recipe.js";
+import tableCardSlotRecipe from "./TableCard.recipe.js";
 import tabsSlotRecipe from "./Tabs.recipe.js";
 import tagSlotRecipe from "./Tag.recipe.js";
 import tagsInputSlotRecipe from "./TagsInput.recipe.js";
@@ -114,6 +115,7 @@ var slotRecipes = {
 	steps: stepsSlotRecipe,
 	switch: switchSlotRecipe,
 	table: tableSlotRecipe,
+	tableCard: tableCardSlotRecipe,
 	tabs: tabsSlotRecipe,
 	tag: tagSlotRecipe,
 	tagsInput: tagsInputSlotRecipe,

package/dist/theme/slot-recipes/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../lib/theme/slot-recipes/index.ts"],"sourcesContent":["import accordionSlotRecipe from './Accordion.recipe.ts';\nimport actionBarSlotRecipe from './ActionBar.recipe.ts';\nimport alertSlotRecipe from './Alert.recipe.ts';\nimport avatarSlotRecipe from './Avatar.recipe.ts';\nimport breadcrumbSlotRecipe from './Breadcrumb.recipe.ts';\nimport cardSlotRecipe from './Card.recipe';\nimport checkboxSlotRecipe from './Checkbox.recipe';\nimport codeSnippetSlotRecipe from './CodeSnippet.recipe.ts';\nimport collapsibleSlotRecipe from './Collapsible.recipe.ts';\nimport comboboxSlotRecipe from './Combobox.recipe.ts';\nimport dataWidgetSlotRecipe from './DataWidget.recipe.ts';\nimport datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport draggableCardSlotRecipe from './DraggableCard.recipe.ts';\nimport drawerSlotRecipe from './Drawer.recipe.ts';\nimport emptyStateSlotRecipe from './EmptyState.recipe';\nimport expandableCardSlotRecipe from './ExpandableCard.recipe.ts';\nimport fieldSlotRecipe from './Field.recipe';\nimport fieldsetSlotRecipe from './Fieldset.recipe.ts';\nimport fileUploadSlotRecipe from './FileUpload.recipe.ts';\nimport groupHeadingSlotRecipe from './GroupHeading.recipe.ts';\nimport imageCropperSlotRecipe from './ImageCropper.recipe.ts';\nimport inlineLoadingSlotRecipe from './InlineLoading.recipe.ts';\nimport labeledDataSlotRecipe from './LabeledData.recipe.ts';\nimport listSlotRecipe from './List.recipe.ts';\nimport markdownSlotRecipe from './Markdown.recipe.ts';\nimport markdownCardSlotRecipe from './MarkdownCard.recipe.ts';\nimport menuSlotRecipe from './Menu.recipe.ts';\nimport multiselectSlotRecipe from './Multiselect.recipe.ts';\nimport nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport noteCardSlotRecipe from './NoteCard.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport overflowContentSlotRecipe from './OverflowContent.recipe.ts';\nimport pageFooterSlotRecipe from './PageFooter.recipe.ts';\nimport paginationSlotRecipe from './Pagination.recipe.ts';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.recipe.ts';\nimport popoverSlotRecipe from './Popover.recipe.ts';\nimport progressSlotRecipe from './Progress.recipe.ts';\nimport qrCodeSlotRecipe from './QrCode.recipe.ts';\nimport radioGroupSlotRecipe from './RadioGroup.recipe.ts';\nimport ribbonSlotRecipe from './Ribbon.recipe.ts';\nimport sectionHeadingSlotRecipe from './SectionHeading.recipe.ts';\nimport segmentGroupSlotRecipe from './SegmentGroup.recipe.ts';\nimport { selectSlotRecipe } from './Select.recipe.ts';\nimport settingsCardSlotRecipe from './SettingsCard.recipe.ts';\nimport sidebarSlotRecipe from './Sidebar.recipe.ts';\nimport splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport statSlotRecipe from './Stat.recipe.ts';\nimport stepCardSlotRecipe from './StepCard.recipe.ts';\nimport stepsSlotRecipe from './Steps.recipe.ts';\nimport switchSlotRecipe from './Switch.recipe';\nimport tableSlotRecipe from './Table.recipe.ts';\nimport tabsSlotRecipe from './Tabs.recipe';\nimport tagSlotRecipe from './Tag.recipe.ts';\nimport tagsInputSlotRecipe from './TagsInput.recipe.ts';\nimport textInputSlotRecipe from './TextInput.recipe.ts';\nimport toastSlotRecipe from './Toast.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\nimport tourSlotRecipe from './Tour.recipe.ts';\nimport treeViewSlotRecipe from './TreeView.recipe.ts';\n\nconst slotRecipes = {\n  accordion: accordionSlotRecipe,\n  actionBar: actionBarSlotRecipe,\n  alert: alertSlotRecipe,\n  avatar: avatarSlotRecipe,\n  breadcrumb: breadcrumbSlotRecipe,\n  card: cardSlotRecipe,\n  checkbox: checkboxSlotRecipe,\n  codeSnippet: codeSnippetSlotRecipe,\n  collapsible: collapsibleSlotRecipe,\n  combobox: comboboxSlotRecipe,\n  dataWidget: dataWidgetSlotRecipe,\n  datePicker: datePickerSlotRecipe,\n  datePickerSelect: datePickerSelectSlotRecipe,\n  dialog: dialogSlotRecipe,\n  draggableCard: draggableCardSlotRecipe,\n  drawer: drawerSlotRecipe,\n  emptyState: emptyStateSlotRecipe,\n  expandableCard: expandableCardSlotRecipe,\n  field: fieldSlotRecipe,\n  groupHeading: groupHeadingSlotRecipe,\n  fieldset: fieldsetSlotRecipe,\n  fileUpload: fileUploadSlotRecipe,\n  imageCropper: imageCropperSlotRecipe,\n  inlineLoading: inlineLoadingSlotRecipe,\n  list: listSlotRecipe,\n  markdown: markdownSlotRecipe,\n  markdownCard: markdownCardSlotRecipe,\n  menu: menuSlotRecipe,\n  multiselect: multiselectSlotRecipe,\n  noteCard: noteCardSlotRecipe,\n  nativeSelect: nativeSelectSlotRecipe,\n  numberInput: numberInputSlotRecipe,\n  overflowContent: overflowContentSlotRecipe,\n  pageFooter: pageFooterSlotRecipe,\n  pagination: paginationSlotRecipe,\n  paginationLoadMore: paginationLoadMoreSlotRecipe,\n  popover: popoverSlotRecipe,\n  progress: progressSlotRecipe,\n  qrCode: qrCodeSlotRecipe,\n  radioGroup: radioGroupSlotRecipe,\n  ribbon: ribbonSlotRecipe,\n  sectionHeading: sectionHeadingSlotRecipe,\n  labeledData: labeledDataSlotRecipe,\n  segmentGroup: segmentGroupSlotRecipe,\n  sidebar: sidebarSlotRecipe,\n  select: selectSlotRecipe,\n  settingsCard: settingsCardSlotRecipe,\n  splitButton: splitButtonSlotRecipe,\n  stat: statSlotRecipe,\n  stepsCard: stepCardSlotRecipe,\n  steps: stepsSlotRecipe,\n  switch: switchSlotRecipe,\n  table: tableSlotRecipe,\n  tabs: tabsSlotRecipe,\n  tag: tagSlotRecipe,\n  tagsInput: tagsInputSlotRecipe,\n  textInput: textInputSlotRecipe,\n  toast: toastSlotRecipe,\n  tooltip: tooltipSlotRecipe,\n  tour: tourSlotRecipe,\n  treeView: treeViewSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8DA,IAAM,cAAc;CAClB,WAAW;CACX,WAAW;CACX,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,MAAM;CACN,UAAU;CACV,aAAa;CACb,aAAa;CACb,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,kBAAkB;CAClB,QAAQ;CACR,eAAe;CACf,QAAQ;CACR,YAAY;CACZ,gBAAgB;CAChB,OAAO;CACP,cAAc;CACd,UAAU;CACV,YAAY;CACZ,cAAc;CACd,eAAe;CACf,MAAM;CACN,UAAU;CACV,cAAc;CACd,MAAM;CACN,aAAa;CACb,UAAU;CACV,cAAc;CACd,aAAa;CACb,iBAAiB;CACjB,YAAY;CACZ,YAAY;CACZ,oBAAoB;CACpB,SAAS;CACT,UAAU;CACV,QAAQ;CACR,YAAY;CACZ,QAAQ;CACR,gBAAgB;CAChB,aAAa;CACb,cAAc;CACd,SAAS;CACT,QAAQ;CACR,cAAc;CACd,aAAa;CACb,MAAM;CACN,WAAW;CACX,OAAO;CACP,QAAQ;CACR,OAAO;CACP,MAAM;CACN,KAAK;CACL,WAAW;CACX,WAAW;CACX,OAAO;CACP,SAAS;CACT,MAAM;CACN,UAAU;AACZ"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../lib/theme/slot-recipes/index.ts"],"sourcesContent":["import accordionSlotRecipe from './Accordion.recipe.ts';\nimport actionBarSlotRecipe from './ActionBar.recipe.ts';\nimport alertSlotRecipe from './Alert.recipe.ts';\nimport avatarSlotRecipe from './Avatar.recipe.ts';\nimport breadcrumbSlotRecipe from './Breadcrumb.recipe.ts';\nimport cardSlotRecipe from './Card.recipe';\nimport checkboxSlotRecipe from './Checkbox.recipe';\nimport codeSnippetSlotRecipe from './CodeSnippet.recipe.ts';\nimport collapsibleSlotRecipe from './Collapsible.recipe.ts';\nimport comboboxSlotRecipe from './Combobox.recipe.ts';\nimport dataWidgetSlotRecipe from './DataWidget.recipe.ts';\nimport datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport draggableCardSlotRecipe from './DraggableCard.recipe.ts';\nimport drawerSlotRecipe from './Drawer.recipe.ts';\nimport emptyStateSlotRecipe from './EmptyState.recipe';\nimport expandableCardSlotRecipe from './ExpandableCard.recipe.ts';\nimport fieldSlotRecipe from './Field.recipe';\nimport fieldsetSlotRecipe from './Fieldset.recipe.ts';\nimport fileUploadSlotRecipe from './FileUpload.recipe.ts';\nimport groupHeadingSlotRecipe from './GroupHeading.recipe.ts';\nimport imageCropperSlotRecipe from './ImageCropper.recipe.ts';\nimport inlineLoadingSlotRecipe from './InlineLoading.recipe.ts';\nimport labeledDataSlotRecipe from './LabeledData.recipe.ts';\nimport listSlotRecipe from './List.recipe.ts';\nimport markdownSlotRecipe from './Markdown.recipe.ts';\nimport markdownCardSlotRecipe from './MarkdownCard.recipe.ts';\nimport menuSlotRecipe from './Menu.recipe.ts';\nimport multiselectSlotRecipe from './Multiselect.recipe.ts';\nimport nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport noteCardSlotRecipe from './NoteCard.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport overflowContentSlotRecipe from './OverflowContent.recipe.ts';\nimport pageFooterSlotRecipe from './PageFooter.recipe.ts';\nimport paginationSlotRecipe from './Pagination.recipe.ts';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.recipe.ts';\nimport popoverSlotRecipe from './Popover.recipe.ts';\nimport progressSlotRecipe from './Progress.recipe.ts';\nimport qrCodeSlotRecipe from './QrCode.recipe.ts';\nimport radioGroupSlotRecipe from './RadioGroup.recipe.ts';\nimport ribbonSlotRecipe from './Ribbon.recipe.ts';\nimport sectionHeadingSlotRecipe from './SectionHeading.recipe.ts';\nimport segmentGroupSlotRecipe from './SegmentGroup.recipe.ts';\nimport { selectSlotRecipe } from './Select.recipe.ts';\nimport settingsCardSlotRecipe from './SettingsCard.recipe.ts';\nimport sidebarSlotRecipe from './Sidebar.recipe.ts';\nimport splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport statSlotRecipe from './Stat.recipe.ts';\nimport stepCardSlotRecipe from './StepCard.recipe.ts';\nimport stepsSlotRecipe from './Steps.recipe.ts';\nimport switchSlotRecipe from './Switch.recipe';\nimport tableSlotRecipe from './Table.recipe.ts';\nimport tableCardSlotRecipe from './TableCard.recipe.ts';\nimport tabsSlotRecipe from './Tabs.recipe';\nimport tagSlotRecipe from './Tag.recipe.ts';\nimport tagsInputSlotRecipe from './TagsInput.recipe.ts';\nimport textInputSlotRecipe from './TextInput.recipe.ts';\nimport toastSlotRecipe from './Toast.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\nimport tourSlotRecipe from './Tour.recipe.ts';\nimport treeViewSlotRecipe from './TreeView.recipe.ts';\n\nconst slotRecipes = {\n  accordion: accordionSlotRecipe,\n  actionBar: actionBarSlotRecipe,\n  alert: alertSlotRecipe,\n  avatar: avatarSlotRecipe,\n  breadcrumb: breadcrumbSlotRecipe,\n  card: cardSlotRecipe,\n  checkbox: checkboxSlotRecipe,\n  codeSnippet: codeSnippetSlotRecipe,\n  collapsible: collapsibleSlotRecipe,\n  combobox: comboboxSlotRecipe,\n  dataWidget: dataWidgetSlotRecipe,\n  datePicker: datePickerSlotRecipe,\n  datePickerSelect: datePickerSelectSlotRecipe,\n  dialog: dialogSlotRecipe,\n  draggableCard: draggableCardSlotRecipe,\n  drawer: drawerSlotRecipe,\n  emptyState: emptyStateSlotRecipe,\n  expandableCard: expandableCardSlotRecipe,\n  field: fieldSlotRecipe,\n  groupHeading: groupHeadingSlotRecipe,\n  fieldset: fieldsetSlotRecipe,\n  fileUpload: fileUploadSlotRecipe,\n  imageCropper: imageCropperSlotRecipe,\n  inlineLoading: inlineLoadingSlotRecipe,\n  list: listSlotRecipe,\n  markdown: markdownSlotRecipe,\n  markdownCard: markdownCardSlotRecipe,\n  menu: menuSlotRecipe,\n  multiselect: multiselectSlotRecipe,\n  noteCard: noteCardSlotRecipe,\n  nativeSelect: nativeSelectSlotRecipe,\n  numberInput: numberInputSlotRecipe,\n  overflowContent: overflowContentSlotRecipe,\n  pageFooter: pageFooterSlotRecipe,\n  pagination: paginationSlotRecipe,\n  paginationLoadMore: paginationLoadMoreSlotRecipe,\n  popover: popoverSlotRecipe,\n  progress: progressSlotRecipe,\n  qrCode: qrCodeSlotRecipe,\n  radioGroup: radioGroupSlotRecipe,\n  ribbon: ribbonSlotRecipe,\n  sectionHeading: sectionHeadingSlotRecipe,\n  labeledData: labeledDataSlotRecipe,\n  segmentGroup: segmentGroupSlotRecipe,\n  sidebar: sidebarSlotRecipe,\n  select: selectSlotRecipe,\n  settingsCard: settingsCardSlotRecipe,\n  splitButton: splitButtonSlotRecipe,\n  stat: statSlotRecipe,\n  stepsCard: stepCardSlotRecipe,\n  steps: stepsSlotRecipe,\n  switch: switchSlotRecipe,\n  table: tableSlotRecipe,\n  tableCard: tableCardSlotRecipe,\n  tabs: tabsSlotRecipe,\n  tag: tagSlotRecipe,\n  tagsInput: tagsInputSlotRecipe,\n  textInput: textInputSlotRecipe,\n  toast: toastSlotRecipe,\n  tooltip: tooltipSlotRecipe,\n  tour: tourSlotRecipe,\n  treeView: treeViewSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DA,IAAM,cAAc;CAClB,WAAW;CACX,WAAW;CACX,OAAO;CACP,QAAQ;CACR,YAAY;CACZ,MAAM;CACN,UAAU;CACV,aAAa;CACb,aAAa;CACb,UAAU;CACV,YAAY;CACZ,YAAY;CACZ,kBAAkB;CAClB,QAAQ;CACR,eAAe;CACf,QAAQ;CACR,YAAY;CACZ,gBAAgB;CAChB,OAAO;CACP,cAAc;CACd,UAAU;CACV,YAAY;CACZ,cAAc;CACd,eAAe;CACf,MAAM;CACN,UAAU;CACV,cAAc;CACd,MAAM;CACN,aAAa;CACb,UAAU;CACV,cAAc;CACd,aAAa;CACb,iBAAiB;CACjB,YAAY;CACZ,YAAY;CACZ,oBAAoB;CACpB,SAAS;CACT,UAAU;CACV,QAAQ;CACR,YAAY;CACZ,QAAQ;CACR,gBAAgB;CAChB,aAAa;CACb,cAAc;CACd,SAAS;CACT,QAAQ;CACR,cAAc;CACd,aAAa;CACb,MAAM;CACN,WAAW;CACX,OAAO;CACP,QAAQ;CACR,OAAO;CACP,WAAW;CACX,MAAM;CACN,KAAK;CACL,WAAW;CACX,WAAW;CACX,OAAO;CACP,SAAS;CACT,MAAM;CACN,UAAU;AACZ"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitrise/bitkit-v2",
   "private": false,
-  "version": "0.3.377",
+  "version": "0.3.379",
   "description": "Bitrise Design System Components built with Chakra UI V3",
   "keywords": [
     "react",