@bitrise/bitkit-v2 0.3.194 → 0.3.195

package/dist/components/BitkitDialog/BitkitDialog.d.ts

@@ -13,10 +13,11 @@ export interface BitkitDialogProps {
     size?: 'sm' | 'md' | 'lg';
     title: ReactNode;
     trigger?: ReactNode;
+    variant?: 'overflowContent';
     children?: ReactNode;
 }
 declare const BitkitDialog: {
-    ({ headerLabel, maxHeight, onOpenChange, open, title, trigger, children, preventScroll, scrollBehavior, showScrollGradient, size, }: BitkitDialogProps): import("react/jsx-runtime").JSX.Element;
+    ({ headerLabel, maxHeight, onOpenChange, open, title, trigger, children, preventScroll, scrollBehavior: scrollBehaviorProp, showScrollGradient, size, variant, }: BitkitDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export declare const BitkitDialogActionTrigger: import('react').ForwardRefExoticComponent<Dialog.ActionTriggerProps & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/components/BitkitDialog/BitkitDialog.js

@@ -4,24 +4,29 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { Portal } from "@chakra-ui/react/portal";
 import { Dialog } from "@chakra-ui/react/dialog";
 //#region lib/components/BitkitDialog/BitkitDialog.tsx
-var BitkitDialog = ({ headerLabel, maxHeight, onOpenChange, open, title, trigger, children, preventScroll, scrollBehavior, showScrollGradient, size }) => /* @__PURE__ */ jsxs(BitkitDialogRoot, {
-	open,
-	preventScroll,
-	scrollBehavior,
-	size,
-	onOpenChange,
-	children: [trigger && /* @__PURE__ */ jsx(Dialog.Trigger, {
-		asChild: true,
-		children: trigger
-	}), /* @__PURE__ */ jsxs(Portal, { children: [/* @__PURE__ */ jsx(Dialog.Backdrop, {}), /* @__PURE__ */ jsx(Dialog.Positioner, { children: /* @__PURE__ */ jsx(BitkitDialogContent, {
-		headerLabel,
-		maxHeight,
+var BitkitDialog = ({ headerLabel, maxHeight, onOpenChange, open, title, trigger, children, preventScroll, scrollBehavior: scrollBehaviorProp, showScrollGradient, size, variant }) => {
+	const scrollBehavior = variant === "overflowContent" ? "inside" : scrollBehaviorProp;
+	return /* @__PURE__ */ jsxs(BitkitDialogRoot, {
+		open,
+		preventScroll,
 		scrollBehavior,
-		showScrollGradient,
-		title,
-		children
-	}) })] })]
-});
+		size,
+		variant,
+		onOpenChange,
+		children: [trigger && /* @__PURE__ */ jsx(Dialog.Trigger, {
+			asChild: true,
+			children: trigger
+		}), /* @__PURE__ */ jsxs(Portal, { children: [/* @__PURE__ */ jsx(Dialog.Backdrop, {}), /* @__PURE__ */ jsx(Dialog.Positioner, { children: /* @__PURE__ */ jsx(BitkitDialogContent, {
+			headerLabel,
+			maxHeight,
+			scrollBehavior,
+			showScrollGradient,
+			title,
+			variant,
+			children
+		}) })] })]
+	});
+};
 Dialog.ActionTrigger;
 Dialog.Footer;
 BitkitDialog.displayName = "BitkitDialog";

package/dist/components/BitkitDialog/BitkitDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { type ReactNode } from 'react';\n\nimport BitkitDialogContent from './BitkitDialogContent';\nimport BitkitDialogRoot from './BitkitDialogRoot';\n\nexport interface BitkitDialogProps {\n  headerLabel?: string;\n  maxHeight?: string;\n  onOpenChange?: (details: { open: boolean }) => void;\n  open?: boolean;\n  preventScroll?: boolean;\n  scrollBehavior?: 'inside' | 'outside';\n  showScrollGradient?: boolean;\n  size?: 'sm' | 'md' | 'lg';\n  title: ReactNode;\n  trigger?: ReactNode;\n  children?: ReactNode;\n}\n\nconst BitkitDialog = ({\n  headerLabel,\n  maxHeight,\n  onOpenChange,\n  open,\n  title,\n  trigger,\n  children,\n  preventScroll,\n  scrollBehavior,\n  showScrollGradient,\n  size,\n}: BitkitDialogProps) => (\n  <BitkitDialogRoot\n    open={open}\n    preventScroll={preventScroll}\n    scrollBehavior={scrollBehavior}\n    size={size}\n    onOpenChange={onOpenChange}\n  >\n    {trigger && <Dialog.Trigger asChild>{trigger}</Dialog.Trigger>}\n    <Portal>\n      <Dialog.Backdrop />\n      <Dialog.Positioner>\n        <BitkitDialogContent\n          headerLabel={headerLabel}\n          maxHeight={maxHeight}\n          scrollBehavior={scrollBehavior}\n          showScrollGradient={showScrollGradient}\n          title={title}\n        >\n          {children}\n        </BitkitDialogContent>\n      </Dialog.Positioner>\n    </Portal>\n  </BitkitDialogRoot>\n);\n\nexport const BitkitDialogActionTrigger = Dialog.ActionTrigger;\nexport const BitkitDialogFooter = Dialog.Footer;\n\nBitkitDialog.displayName = 'BitkitDialog';\n\nexport default BitkitDialog;\n"],"mappings":";;;;;;AAqBA,IAAM,gBAAgB,EACpB,aACA,WACA,cACA,MACA,OACA,SACA,UACA,eACA,gBACA,oBACA,WAEA,qBAAC,kBAAD;CACQ;CACS;CACC;CACV;CACQ;WALhB,CAOG,WAAW,oBAAC,OAAO,SAAR;EAAgB,SAAA;YAAS;EAAyB,CAAA,EAC9D,qBAAC,QAAD,EAAA,UAAA,CACE,oBAAC,OAAO,UAAR,EAAmB,CAAA,EACnB,oBAAC,OAAO,YAAR,EAAA,UACE,oBAAC,qBAAD;EACe;EACF;EACK;EACI;EACb;EAEN;EACmB,CAAA,EACJ,CAAA,CACb,EAAA,CAAA,CACQ;;AAGoB,OAAO;AACd,OAAO;AAEzC,aAAa,cAAc"}
+{"version":3,"file":"BitkitDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { type ReactNode } from 'react';\n\nimport BitkitDialogContent from './BitkitDialogContent';\nimport BitkitDialogRoot from './BitkitDialogRoot';\n\nexport interface BitkitDialogProps {\n  headerLabel?: string;\n  maxHeight?: string;\n  onOpenChange?: (details: { open: boolean }) => void;\n  open?: boolean;\n  preventScroll?: boolean;\n  scrollBehavior?: 'inside' | 'outside';\n  showScrollGradient?: boolean;\n  size?: 'sm' | 'md' | 'lg';\n  title: ReactNode;\n  trigger?: ReactNode;\n  variant?: 'overflowContent';\n  children?: ReactNode;\n}\n\nconst BitkitDialog = ({\n  headerLabel,\n  maxHeight,\n  onOpenChange,\n  open,\n  title,\n  trigger,\n  children,\n  preventScroll,\n  scrollBehavior: scrollBehaviorProp,\n  showScrollGradient,\n  size,\n  variant,\n}: BitkitDialogProps) => {\n  const scrollBehavior = variant === 'overflowContent' ? 'inside' : scrollBehaviorProp;\n\n  return (\n    <BitkitDialogRoot\n      open={open}\n      preventScroll={preventScroll}\n      scrollBehavior={scrollBehavior}\n      size={size}\n      variant={variant}\n      onOpenChange={onOpenChange}\n    >\n      {trigger && <Dialog.Trigger asChild>{trigger}</Dialog.Trigger>}\n      <Portal>\n        <Dialog.Backdrop />\n        <Dialog.Positioner>\n          <BitkitDialogContent\n            headerLabel={headerLabel}\n            maxHeight={maxHeight}\n            scrollBehavior={scrollBehavior}\n            showScrollGradient={showScrollGradient}\n            title={title}\n            variant={variant}\n          >\n            {children}\n          </BitkitDialogContent>\n        </Dialog.Positioner>\n      </Portal>\n    </BitkitDialogRoot>\n  );\n};\n\nexport const BitkitDialogActionTrigger = Dialog.ActionTrigger;\nexport const BitkitDialogFooter = Dialog.Footer;\n\nBitkitDialog.displayName = 'BitkitDialog';\n\nexport default BitkitDialog;\n"],"mappings":";;;;;;AAsBA,IAAM,gBAAgB,EACpB,aACA,WACA,cACA,MACA,OACA,SACA,UACA,eACA,gBAAgB,oBAChB,oBACA,MACA,cACuB;CACvB,MAAM,iBAAiB,YAAY,oBAAoB,WAAW;AAElE,QACE,qBAAC,kBAAD;EACQ;EACS;EACC;EACV;EACG;EACK;YANhB,CAQG,WAAW,oBAAC,OAAO,SAAR;GAAgB,SAAA;aAAS;GAAyB,CAAA,EAC9D,qBAAC,QAAD,EAAA,UAAA,CACE,oBAAC,OAAO,UAAR,EAAmB,CAAA,EACnB,oBAAC,OAAO,YAAR,EAAA,UACE,oBAAC,qBAAD;GACe;GACF;GACK;GACI;GACb;GACE;GAER;GACmB,CAAA,EACJ,CAAA,CACb,EAAA,CAAA,CACQ;;;AAIkB,OAAO;AACd,OAAO;AAEzC,aAAa,cAAc"}

package/dist/components/BitkitDialog/BitkitDialogBody.js

@@ -1,9 +1,9 @@
 import IconArrowDown from "../../icons/IconArrowDown.js";
 import { Box } from "@chakra-ui/react/box";
-import { chakra, useSlotRecipe } from "@chakra-ui/react/styled-system";
+import { chakra } from "@chakra-ui/react/styled-system";
 import { createContext, useCallback, useContext, useEffect, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { Dialog, useDialogContext } from "@chakra-ui/react/dialog";
+import { Dialog, useDialogContext, useDialogStyles } from "@chakra-ui/react/dialog";
 //#region lib/components/BitkitDialog/BitkitDialogBody.tsx
 var DialogBodyContext = createContext({
 	scrollBehavior: "outside",
@@ -11,7 +11,7 @@ var DialogBodyContext = createContext({
 });
 var ScrollableDialogBody = ({ children, ...props }) => {
 	const { showScrollGradient } = useContext(DialogBodyContext);
-	const styles = useSlotRecipe({ key: "dialog" })({});
+	const styles = useDialogStyles();
 	const { open } = useDialogContext();
 	const contentRef = useRef(null);
 	const [isScrollButtonVisible, setIsScrollButtonVisible] = useState(false);

package/dist/components/BitkitDialog/BitkitDialogBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitDialogBody.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialogBody.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Dialog, useDialogContext } from '@chakra-ui/react/dialog';\nimport { chakra, type SystemStyleObject, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { createContext, useCallback, useContext, useEffect, useRef, useState } from 'react';\n\nimport { IconArrowDown } from '../../icons';\n\ninterface DialogBodyContext {\n  scrollBehavior: 'inside' | 'outside';\n  showScrollGradient: boolean;\n}\n\nexport type BitkitDialogBodyProps = Dialog.BodyProps;\n\nexport const DialogBodyContext = createContext<DialogBodyContext>({\n  scrollBehavior: 'outside',\n  showScrollGradient: true,\n});\n\nconst ScrollableDialogBody = ({ children, ...props }: Dialog.BodyProps) => {\n  const { showScrollGradient } = useContext(DialogBodyContext);\n  const recipe = useSlotRecipe({ key: 'dialog' });\n  const styles = recipe({}) as Record<string, SystemStyleObject>;\n  const { open } = useDialogContext();\n  const contentRef = useRef<HTMLDivElement>(null);\n  const [isScrollButtonVisible, setIsScrollButtonVisible] = useState(false);\n\n  const updateScrollButtonVisibility = useCallback(() => {\n    const content = contentRef.current;\n    if (!content) {\n      setIsScrollButtonVisible(false);\n      return;\n    }\n    const didScrollToBottom = content.scrollTop >= content.scrollHeight - content.offsetHeight - 1;\n    setIsScrollButtonVisible(!didScrollToBottom);\n  }, []);\n\n  useEffect(() => {\n    const content = contentRef.current;\n    if (!open || !content) return;\n\n    content.addEventListener('scroll', updateScrollButtonVisibility);\n    const resizeObserver = new ResizeObserver(updateScrollButtonVisibility);\n    resizeObserver.observe(content);\n\n    return () => {\n      content.removeEventListener('scroll', updateScrollButtonVisibility);\n      resizeObserver.disconnect();\n    };\n  }, [open, updateScrollButtonVisibility]);\n\n  return (\n    <Box css={styles.scrollBody}>\n      <Dialog.Body ref={contentRef} {...props}>\n        {children}\n      </Dialog.Body>\n      {isScrollButtonVisible && (\n        <>\n          {showScrollGradient && <Box css={styles.scrollGradient} />}\n          <chakra.button\n            aria-label=\"Scroll to bottom\"\n            css={styles.scrollButton}\n            type=\"button\"\n            onClick={() => {\n              contentRef.current?.scrollTo({ top: contentRef.current.scrollHeight, behavior: 'smooth' });\n            }}\n          >\n            <IconArrowDown color=\"icon/tertiary\" size=\"16\" />\n          </chakra.button>\n        </>\n      )}\n    </Box>\n  );\n};\n\nconst BitkitDialogBody = (props: BitkitDialogBodyProps) => {\n  const { scrollBehavior } = useContext(DialogBodyContext);\n  if (scrollBehavior === 'inside') {\n    return <ScrollableDialogBody {...props} />;\n  }\n  return <Dialog.Body {...props} />;\n};\n\nexport default BitkitDialogBody;\n"],"mappings":";;;;;;;AAcA,IAAa,oBAAoB,cAAiC;CAChE,gBAAgB;CAChB,oBAAoB;CACrB,CAAC;AAEF,IAAM,wBAAwB,EAAE,UAAU,GAAG,YAA8B;CACzE,MAAM,EAAE,uBAAuB,WAAW,kBAAkB;CAE5D,MAAM,SADS,cAAc,EAAE,KAAK,UAAU,CAAC,CACzB,EAAE,CAAC;CACzB,MAAM,EAAE,SAAS,kBAAkB;CACnC,MAAM,aAAa,OAAuB,KAAK;CAC/C,MAAM,CAAC,uBAAuB,4BAA4B,SAAS,MAAM;CAEzE,MAAM,+BAA+B,kBAAkB;EACrD,MAAM,UAAU,WAAW;AAC3B,MAAI,CAAC,SAAS;AACZ,4BAAyB,MAAM;AAC/B;;AAGF,2BAAyB,EADC,QAAQ,aAAa,QAAQ,eAAe,QAAQ,eAAe,GACjD;IAC3C,EAAE,CAAC;AAEN,iBAAgB;EACd,MAAM,UAAU,WAAW;AAC3B,MAAI,CAAC,QAAQ,CAAC,QAAS;AAEvB,UAAQ,iBAAiB,UAAU,6BAA6B;EAChE,MAAM,iBAAiB,IAAI,eAAe,6BAA6B;AACvE,iBAAe,QAAQ,QAAQ;AAE/B,eAAa;AACX,WAAQ,oBAAoB,UAAU,6BAA6B;AACnE,kBAAe,YAAY;;IAE5B,CAAC,MAAM,6BAA6B,CAAC;AAExC,QACE,qBAAC,KAAD;EAAK,KAAK,OAAO;YAAjB,CACE,oBAAC,OAAO,MAAR;GAAa,KAAK;GAAY,GAAI;GAC/B;GACW,CAAA,EACb,yBACC,qBAAA,YAAA,EAAA,UAAA,CACG,sBAAsB,oBAAC,KAAD,EAAK,KAAK,OAAO,gBAAkB,CAAA,EAC1D,oBAAC,OAAO,QAAR;GACE,cAAW;GACX,KAAK,OAAO;GACZ,MAAK;GACL,eAAe;AACb,eAAW,SAAS,SAAS;KAAE,KAAK,WAAW,QAAQ;KAAc,UAAU;KAAU,CAAC;;aAG5F,oBAAC,eAAD;IAAe,OAAM;IAAgB,MAAK;IAAO,CAAA;GACnC,CAAA,CACf,EAAA,CAAA,CAED;;;AAIV,IAAM,oBAAoB,UAAiC;CACzD,MAAM,EAAE,mBAAmB,WAAW,kBAAkB;AACxD,KAAI,mBAAmB,SACrB,QAAO,oBAAC,sBAAD,EAAsB,GAAI,OAAS,CAAA;AAE5C,QAAO,oBAAC,OAAO,MAAR,EAAa,GAAI,OAAS,CAAA"}
+{"version":3,"file":"BitkitDialogBody.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialogBody.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Dialog, useDialogContext, useDialogStyles } from '@chakra-ui/react/dialog';\nimport { chakra } from '@chakra-ui/react/styled-system';\nimport { createContext, useCallback, useContext, useEffect, useRef, useState } from 'react';\n\nimport { IconArrowDown } from '../../icons';\n\ninterface DialogBodyContext {\n  scrollBehavior: 'inside' | 'outside';\n  showScrollGradient: boolean;\n}\n\nexport type BitkitDialogBodyProps = Dialog.BodyProps;\n\nexport const DialogBodyContext = createContext<DialogBodyContext>({\n  scrollBehavior: 'outside',\n  showScrollGradient: true,\n});\n\nconst ScrollableDialogBody = ({ children, ...props }: Dialog.BodyProps) => {\n  const { showScrollGradient } = useContext(DialogBodyContext);\n  const styles = useDialogStyles();\n  const { open } = useDialogContext();\n  const contentRef = useRef<HTMLDivElement>(null);\n  const [isScrollButtonVisible, setIsScrollButtonVisible] = useState(false);\n\n  const updateScrollButtonVisibility = useCallback(() => {\n    const content = contentRef.current;\n    if (!content) {\n      setIsScrollButtonVisible(false);\n      return;\n    }\n    const didScrollToBottom = content.scrollTop >= content.scrollHeight - content.offsetHeight - 1;\n    setIsScrollButtonVisible(!didScrollToBottom);\n  }, []);\n\n  useEffect(() => {\n    const content = contentRef.current;\n    if (!open || !content) return;\n\n    content.addEventListener('scroll', updateScrollButtonVisibility);\n    const resizeObserver = new ResizeObserver(updateScrollButtonVisibility);\n    resizeObserver.observe(content);\n\n    return () => {\n      content.removeEventListener('scroll', updateScrollButtonVisibility);\n      resizeObserver.disconnect();\n    };\n  }, [open, updateScrollButtonVisibility]);\n\n  return (\n    <Box css={styles.scrollBody}>\n      <Dialog.Body ref={contentRef} {...props}>\n        {children}\n      </Dialog.Body>\n      {isScrollButtonVisible && (\n        <>\n          {showScrollGradient && <Box css={styles.scrollGradient} />}\n          <chakra.button\n            aria-label=\"Scroll to bottom\"\n            css={styles.scrollButton}\n            type=\"button\"\n            onClick={() => {\n              contentRef.current?.scrollTo({ top: contentRef.current.scrollHeight, behavior: 'smooth' });\n            }}\n          >\n            <IconArrowDown color=\"icon/tertiary\" size=\"16\" />\n          </chakra.button>\n        </>\n      )}\n    </Box>\n  );\n};\n\nconst BitkitDialogBody = (props: BitkitDialogBodyProps) => {\n  const { scrollBehavior } = useContext(DialogBodyContext);\n  if (scrollBehavior === 'inside') {\n    return <ScrollableDialogBody {...props} />;\n  }\n  return <Dialog.Body {...props} />;\n};\n\nexport default BitkitDialogBody;\n"],"mappings":";;;;;;;AAcA,IAAa,oBAAoB,cAAiC;CAChE,gBAAgB;CAChB,oBAAoB;CACrB,CAAC;AAEF,IAAM,wBAAwB,EAAE,UAAU,GAAG,YAA8B;CACzE,MAAM,EAAE,uBAAuB,WAAW,kBAAkB;CAC5D,MAAM,SAAS,iBAAiB;CAChC,MAAM,EAAE,SAAS,kBAAkB;CACnC,MAAM,aAAa,OAAuB,KAAK;CAC/C,MAAM,CAAC,uBAAuB,4BAA4B,SAAS,MAAM;CAEzE,MAAM,+BAA+B,kBAAkB;EACrD,MAAM,UAAU,WAAW;AAC3B,MAAI,CAAC,SAAS;AACZ,4BAAyB,MAAM;AAC/B;;AAGF,2BAAyB,EADC,QAAQ,aAAa,QAAQ,eAAe,QAAQ,eAAe,GACjD;IAC3C,EAAE,CAAC;AAEN,iBAAgB;EACd,MAAM,UAAU,WAAW;AAC3B,MAAI,CAAC,QAAQ,CAAC,QAAS;AAEvB,UAAQ,iBAAiB,UAAU,6BAA6B;EAChE,MAAM,iBAAiB,IAAI,eAAe,6BAA6B;AACvE,iBAAe,QAAQ,QAAQ;AAE/B,eAAa;AACX,WAAQ,oBAAoB,UAAU,6BAA6B;AACnE,kBAAe,YAAY;;IAE5B,CAAC,MAAM,6BAA6B,CAAC;AAExC,QACE,qBAAC,KAAD;EAAK,KAAK,OAAO;YAAjB,CACE,oBAAC,OAAO,MAAR;GAAa,KAAK;GAAY,GAAI;GAC/B;GACW,CAAA,EACb,yBACC,qBAAA,YAAA,EAAA,UAAA,CACG,sBAAsB,oBAAC,KAAD,EAAK,KAAK,OAAO,gBAAkB,CAAA,EAC1D,oBAAC,OAAO,QAAR;GACE,cAAW;GACX,KAAK,OAAO;GACZ,MAAK;GACL,eAAe;AACb,eAAW,SAAS,SAAS;KAAE,KAAK,WAAW,QAAQ;KAAc,UAAU;KAAU,CAAC;;aAG5F,oBAAC,eAAD;IAAe,OAAM;IAAgB,MAAK;IAAO,CAAA;GACnC,CAAA,CACf,EAAA,CAAA,CAED;;;AAIV,IAAM,oBAAoB,UAAiC;CACzD,MAAM,EAAE,mBAAmB,WAAW,kBAAkB;AACxD,KAAI,mBAAmB,SACrB,QAAO,oBAAC,sBAAD,EAAsB,GAAI,OAAS,CAAA;AAE5C,QAAO,oBAAC,OAAO,MAAR,EAAa,GAAI,OAAS,CAAA"}

package/dist/components/BitkitDialog/BitkitDialogContent.d.ts

@@ -5,7 +5,8 @@ export interface BitkitDialogContentProps {
     scrollBehavior?: 'inside' | 'outside';
     showScrollGradient?: boolean;
     title: ReactNode;
+    variant?: 'overflowContent';
     children?: ReactNode;
 }
-declare const BitkitDialogContent: ({ headerLabel, maxHeight, title, scrollBehavior, showScrollGradient, children, }: BitkitDialogContentProps) => import("react/jsx-runtime").JSX.Element;
+declare const BitkitDialogContent: ({ headerLabel, maxHeight, title, scrollBehavior: scrollBehaviorProp, showScrollGradient, variant, children, }: BitkitDialogContentProps) => import("react/jsx-runtime").JSX.Element;
 export default BitkitDialogContent;

package/dist/components/BitkitDialog/BitkitDialogContent.js

@@ -1,12 +1,13 @@
 import BitkitCloseButton from "../BitkitCloseButton/BitkitCloseButton.js";
 import { DialogBodyContext } from "./BitkitDialogBody.js";
 import { Box } from "@chakra-ui/react/box";
-import { chakra, useSlotRecipe } from "@chakra-ui/react/styled-system";
+import { chakra } from "@chakra-ui/react/styled-system";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Dialog } from "@chakra-ui/react/dialog";
+import { Dialog, useDialogStyles } from "@chakra-ui/react/dialog";
 //#region lib/components/BitkitDialog/BitkitDialogContent.tsx
-var BitkitDialogContent = ({ headerLabel, maxHeight, title, scrollBehavior = "outside", showScrollGradient = true, children }) => {
-	const styles = useSlotRecipe({ key: "dialog" })({});
+var BitkitDialogContent = ({ headerLabel, maxHeight, title, scrollBehavior: scrollBehaviorProp = "outside", showScrollGradient = true, variant, children }) => {
+	const scrollBehavior = variant === "overflowContent" ? "inside" : scrollBehaviorProp;
+	const styles = useDialogStyles();
 	return /* @__PURE__ */ jsx(Dialog.Content, {
 		maxHeight,
 		children: /* @__PURE__ */ jsxs(DialogBodyContext.Provider, {
@@ -24,7 +25,7 @@ var BitkitDialogContent = ({ headerLabel, maxHeight, title, scrollBehavior = "ou
 				}), /* @__PURE__ */ jsx(Dialog.Title, { children: title })]
 			}), /* @__PURE__ */ jsx(Dialog.CloseTrigger, {
 				asChild: true,
-				children: /* @__PURE__ */ jsx(BitkitCloseButton, { size: "md" })
+				children: /* @__PURE__ */ jsx(BitkitCloseButton, { size: variant === "overflowContent" ? "xs" : "md" })
 			})] }), children]
 		})
 	});

package/dist/components/BitkitDialog/BitkitDialogContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitDialogContent.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialogContent.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Dialog } from '@chakra-ui/react/dialog';\nimport { chakra, type SystemStyleObject, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { type ReactNode } from 'react';\n\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport { DialogBodyContext } from './BitkitDialogBody';\n\nexport interface BitkitDialogContentProps {\n  headerLabel?: string;\n  maxHeight?: string;\n  scrollBehavior?: 'inside' | 'outside';\n  showScrollGradient?: boolean;\n  title: ReactNode;\n  children?: ReactNode;\n}\n\nconst BitkitDialogContent = ({\n  headerLabel,\n  maxHeight,\n  title,\n  scrollBehavior = 'outside',\n  showScrollGradient = true,\n  children,\n}: BitkitDialogContentProps) => {\n  const recipe = useSlotRecipe({ key: 'dialog' });\n  const styles = recipe({}) as Record<string, SystemStyleObject>;\n\n  return (\n    <Dialog.Content maxHeight={maxHeight}>\n      <DialogBodyContext.Provider value={{ scrollBehavior, showScrollGradient }}>\n        <Dialog.Header>\n          <Box display=\"flex\" flexDirection=\"column\" gap=\"4\">\n            {headerLabel && <chakra.p css={styles.label}>{headerLabel}</chakra.p>}\n            <Dialog.Title>{title}</Dialog.Title>\n          </Box>\n          <Dialog.CloseTrigger asChild>\n            <BitkitCloseButton size=\"md\" />\n          </Dialog.CloseTrigger>\n        </Dialog.Header>\n        {children}\n      </DialogBodyContext.Provider>\n    </Dialog.Content>\n  );\n};\n\nexport default BitkitDialogContent;\n"],"mappings":";;;;;;;AAiBA,IAAM,uBAAuB,EAC3B,aACA,WACA,OACA,iBAAiB,WACjB,qBAAqB,MACrB,eAC8B;CAE9B,MAAM,SADS,cAAc,EAAE,KAAK,UAAU,CAAC,CACzB,EAAE,CAAC;AAEzB,QACE,oBAAC,OAAO,SAAR;EAA2B;YACzB,qBAAC,kBAAkB,UAAnB;GAA4B,OAAO;IAAE;IAAgB;IAAoB;aAAzE,CACE,qBAAC,OAAO,QAAR,EAAA,UAAA,CACE,qBAAC,KAAD;IAAK,SAAQ;IAAO,eAAc;IAAS,KAAI;cAA/C,CACG,eAAe,oBAAC,OAAO,GAAR;KAAU,KAAK,OAAO;eAAQ;KAAuB,CAAA,EACrE,oBAAC,OAAO,OAAR,EAAA,UAAe,OAAqB,CAAA,CAChC;OACN,oBAAC,OAAO,cAAR;IAAqB,SAAA;cACnB,oBAAC,mBAAD,EAAmB,MAAK,MAAO,CAAA;IACX,CAAA,CACR,EAAA,CAAA,EACf,SAC0B;;EACd,CAAA"}
+{"version":3,"file":"BitkitDialogContent.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialogContent.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Dialog, useDialogStyles } from '@chakra-ui/react/dialog';\nimport { chakra } from '@chakra-ui/react/styled-system';\nimport { type ReactNode } from 'react';\n\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport { DialogBodyContext } from './BitkitDialogBody';\n\nexport interface BitkitDialogContentProps {\n  headerLabel?: string;\n  maxHeight?: string;\n  scrollBehavior?: 'inside' | 'outside';\n  showScrollGradient?: boolean;\n  title: ReactNode;\n  variant?: 'overflowContent';\n  children?: ReactNode;\n}\n\nconst BitkitDialogContent = ({\n  headerLabel,\n  maxHeight,\n  title,\n  scrollBehavior: scrollBehaviorProp = 'outside',\n  showScrollGradient = true,\n  variant,\n  children,\n}: BitkitDialogContentProps) => {\n  const scrollBehavior = variant === 'overflowContent' ? 'inside' : scrollBehaviorProp;\n  const styles = useDialogStyles();\n\n  return (\n    <Dialog.Content maxHeight={maxHeight}>\n      <DialogBodyContext.Provider value={{ scrollBehavior, showScrollGradient }}>\n        <Dialog.Header>\n          <Box display=\"flex\" flexDirection=\"column\" gap=\"4\">\n            {headerLabel && <chakra.p css={styles.label}>{headerLabel}</chakra.p>}\n            <Dialog.Title>{title}</Dialog.Title>\n          </Box>\n          <Dialog.CloseTrigger asChild>\n            <BitkitCloseButton size={variant === 'overflowContent' ? 'xs' : 'md'} />\n          </Dialog.CloseTrigger>\n        </Dialog.Header>\n        {children}\n      </DialogBodyContext.Provider>\n    </Dialog.Content>\n  );\n};\n\nexport default BitkitDialogContent;\n"],"mappings":";;;;;;;AAkBA,IAAM,uBAAuB,EAC3B,aACA,WACA,OACA,gBAAgB,qBAAqB,WACrC,qBAAqB,MACrB,SACA,eAC8B;CAC9B,MAAM,iBAAiB,YAAY,oBAAoB,WAAW;CAClE,MAAM,SAAS,iBAAiB;AAEhC,QACE,oBAAC,OAAO,SAAR;EAA2B;YACzB,qBAAC,kBAAkB,UAAnB;GAA4B,OAAO;IAAE;IAAgB;IAAoB;aAAzE,CACE,qBAAC,OAAO,QAAR,EAAA,UAAA,CACE,qBAAC,KAAD;IAAK,SAAQ;IAAO,eAAc;IAAS,KAAI;cAA/C,CACG,eAAe,oBAAC,OAAO,GAAR;KAAU,KAAK,OAAO;eAAQ;KAAuB,CAAA,EACrE,oBAAC,OAAO,OAAR,EAAA,UAAe,OAAqB,CAAA,CAChC;OACN,oBAAC,OAAO,cAAR;IAAqB,SAAA;cACnB,oBAAC,mBAAD,EAAmB,MAAM,YAAY,oBAAoB,OAAO,MAAQ,CAAA;IACpD,CAAA,CACR,EAAA,CAAA,EACf,SAC0B;;EACd,CAAA"}

package/dist/components/BitkitDialog/BitkitDialogRoot.d.ts

@@ -1,4 +1,6 @@
 import { Dialog } from '@chakra-ui/react/dialog';
-export type BitkitDialogRootProps = Dialog.RootProps;
+export type BitkitDialogRootProps = Dialog.RootProps & {
+    variant?: 'overflowContent';
+};
 declare const BitkitDialogRoot: ({ closeOnInteractOutside, preventScroll, ...props }: BitkitDialogRootProps) => import("react/jsx-runtime").JSX.Element;
 export default BitkitDialogRoot;

package/dist/components/BitkitDialog/BitkitDialogRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitDialogRoot.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialogRoot.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\n\nexport type BitkitDialogRootProps = Dialog.RootProps;\n\nconst BitkitDialogRoot = ({\n  closeOnInteractOutside = false,\n  preventScroll = true,\n  ...props\n}: BitkitDialogRootProps) => (\n  <Dialog.Root closeOnInteractOutside={closeOnInteractOutside} preventScroll={preventScroll} {...props} />\n);\n\nexport default BitkitDialogRoot;\n"],"mappings":";;;AAIA,IAAM,oBAAoB,EACxB,yBAAyB,OACzB,gBAAgB,MAChB,GAAG,YAEH,oBAAC,OAAO,MAAR;CAAqC;CAAuC;CAAe,GAAI;CAAS,CAAA"}
+{"version":3,"file":"BitkitDialogRoot.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialogRoot.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\n\nexport type BitkitDialogRootProps = Dialog.RootProps & {\n  variant?: 'overflowContent';\n};\n\nconst BitkitDialogRoot = ({\n  closeOnInteractOutside = false,\n  preventScroll = true,\n  ...props\n}: BitkitDialogRootProps) => (\n  <Dialog.Root closeOnInteractOutside={closeOnInteractOutside} preventScroll={preventScroll} {...props} />\n);\n\nexport default BitkitDialogRoot;\n"],"mappings":";;;AAMA,IAAM,oBAAoB,EACxB,yBAAyB,OACzB,gBAAgB,MAChB,GAAG,YAEH,oBAAC,OAAO,MAAR;CAAqC;CAAuC;CAAe,GAAI;CAAS,CAAA"}

package/dist/components/BitkitLinkButton/BitkitLinkButton.d.ts

@@ -1,6 +1,6 @@
 import { HTMLChakraProps, RecipeProps } from '@chakra-ui/react/styled-system';
 import { BitkitIconComponent } from '../../icons';
-export interface BitkitLinkButtonProps extends Omit<HTMLChakraProps<'button'>, 'css' | 'disabled' | 'type'>, RecipeProps<'linkButton'> {
+export interface BitkitLinkButtonProps extends Omit<HTMLChakraProps<'button'>, 'disabled' | 'type'>, RecipeProps<'linkButton'> {
     children: string;
     state?: 'disabled';
     suffixIcon?: BitkitIconComponent;

package/dist/components/BitkitLinkButton/BitkitLinkButton.js

@@ -3,13 +3,13 @@ import { forwardRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region lib/components/BitkitLinkButton/BitkitLinkButton.tsx
 var BitkitLinkButton = forwardRef((props, ref) => {
-	const { children, size, state, suffixIcon: SuffixIcon, ...rest } = props;
+	const { children, css, size, state, suffixIcon: SuffixIcon, ...rest } = props;
 	const recipe = useRecipe({ key: "linkButton" });
 	const iconSize = size === "lg" ? "24" : "16";
 	return /* @__PURE__ */ jsxs(chakra.button, {
 		ref,
 		...rest,
-		css: recipe({ size }),
+		css: [recipe({ size }), css],
 		disabled: state === "disabled",
 		type: "button",
 		children: [children, SuffixIcon && /* @__PURE__ */ jsx(SuffixIcon, { size: iconSize })]

package/dist/components/BitkitLinkButton/BitkitLinkButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitLinkButton.js","names":[],"sources":["../../../lib/components/BitkitLinkButton/BitkitLinkButton.tsx"],"sourcesContent":["import { chakra, type HTMLChakraProps, type RecipeProps, useRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\n\nexport interface BitkitLinkButtonProps\n  extends Omit<HTMLChakraProps<'button'>, 'css' | 'disabled' | 'type'>, RecipeProps<'linkButton'> {\n  children: string;\n  state?: 'disabled';\n  suffixIcon?: BitkitIconComponent;\n}\n\nconst BitkitLinkButton = forwardRef<HTMLButtonElement, BitkitLinkButtonProps>((props, ref) => {\n  const { children, size, state, suffixIcon: SuffixIcon, ...rest } = props;\n\n  const recipe = useRecipe({ key: 'linkButton' });\n  const iconSize = size === 'lg' ? '24' : '16';\n\n  return (\n    <chakra.button ref={ref} {...rest} css={recipe({ size })} disabled={state === 'disabled'} type=\"button\">\n      {children}\n      {SuffixIcon && <SuffixIcon size={iconSize} />}\n    </chakra.button>\n  );\n});\n\nBitkitLinkButton.displayName = 'BitkitLinkButton';\n\nexport default BitkitLinkButton;\n"],"mappings":";;;;AAYA,IAAM,mBAAmB,YAAsD,OAAO,QAAQ;CAC5F,MAAM,EAAE,UAAU,MAAM,OAAO,YAAY,YAAY,GAAG,SAAS;CAEnE,MAAM,SAAS,UAAU,EAAE,KAAK,cAAc,CAAC;CAC/C,MAAM,WAAW,SAAS,OAAO,OAAO;AAExC,QACE,qBAAC,OAAO,QAAR;EAAoB;EAAK,GAAI;EAAM,KAAK,OAAO,EAAE,MAAM,CAAC;EAAE,UAAU,UAAU;EAAY,MAAK;YAA/F,CACG,UACA,cAAc,oBAAC,YAAD,EAAY,MAAM,UAAY,CAAA,CAC/B;;EAElB;AAEF,iBAAiB,cAAc"}
+{"version":3,"file":"BitkitLinkButton.js","names":[],"sources":["../../../lib/components/BitkitLinkButton/BitkitLinkButton.tsx"],"sourcesContent":["import { chakra, type HTMLChakraProps, type RecipeProps, useRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\n\nexport interface BitkitLinkButtonProps\n  extends Omit<HTMLChakraProps<'button'>, 'disabled' | 'type'>, RecipeProps<'linkButton'> {\n  children: string;\n  state?: 'disabled';\n  suffixIcon?: BitkitIconComponent;\n}\n\nconst BitkitLinkButton = forwardRef<HTMLButtonElement, BitkitLinkButtonProps>((props, ref) => {\n  const { children, css, size, state, suffixIcon: SuffixIcon, ...rest } = props;\n\n  const recipe = useRecipe({ key: 'linkButton' });\n  const iconSize = size === 'lg' ? '24' : '16';\n\n  return (\n    <chakra.button ref={ref} {...rest} css={[recipe({ size }), css]} disabled={state === 'disabled'} type=\"button\">\n      {children}\n      {SuffixIcon && <SuffixIcon size={iconSize} />}\n    </chakra.button>\n  );\n});\n\nBitkitLinkButton.displayName = 'BitkitLinkButton';\n\nexport default BitkitLinkButton;\n"],"mappings":";;;;AAYA,IAAM,mBAAmB,YAAsD,OAAO,QAAQ;CAC5F,MAAM,EAAE,UAAU,KAAK,MAAM,OAAO,YAAY,YAAY,GAAG,SAAS;CAExE,MAAM,SAAS,UAAU,EAAE,KAAK,cAAc,CAAC;CAC/C,MAAM,WAAW,SAAS,OAAO,OAAO;AAExC,QACE,qBAAC,OAAO,QAAR;EAAoB;EAAK,GAAI;EAAM,KAAK,CAAC,OAAO,EAAE,MAAM,CAAC,EAAE,IAAI;EAAE,UAAU,UAAU;EAAY,MAAK;YAAtG,CACG,UACA,cAAc,oBAAC,YAAD,EAAY,MAAM,UAAY,CAAA,CAC/B;;EAElB;AAEF,iBAAiB,cAAc"}

package/dist/components/BitkitOverflowContent/BitkitOverflowContent.d.ts

@@ -0,0 +1,9 @@
+import { BoxProps } from '@chakra-ui/react/box';
+import { ReactNode } from 'react';
+export interface BitkitOverflowContentProps extends Omit<BoxProps, 'children' | 'title'> {
+    children: ReactNode;
+    previewText?: string;
+    title: string;
+}
+declare const BitkitOverflowContent: import('react').ForwardRefExoticComponent<BitkitOverflowContentProps & import('react').RefAttributes<HTMLDivElement>>;
+export default BitkitOverflowContent;

package/dist/components/BitkitOverflowContent/BitkitOverflowContent.js

@@ -0,0 +1,40 @@
+import BitkitDialogBody from "../BitkitDialog/BitkitDialogBody.js";
+import BitkitDialog from "../BitkitDialog/BitkitDialog.js";
+import BitkitLinkButton from "../BitkitLinkButton/BitkitLinkButton.js";
+import { Box } from "@chakra-ui/react/box";
+import { useSlotRecipe } from "@chakra-ui/react/styled-system";
+import { Text } from "@chakra-ui/react/text";
+import { forwardRef, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region lib/components/BitkitOverflowContent/BitkitOverflowContent.tsx
+var BitkitOverflowContent = forwardRef((props, ref) => {
+	const { children, previewText, title, ...rest } = props;
+	const [open, setOpen] = useState(false);
+	const styles = useSlotRecipe({ key: "overflowContent" })();
+	const preview = previewText || (typeof children === "string" ? children : "Click to view content");
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs(Box, {
+		ref,
+		css: styles.root,
+		...rest,
+		children: [/* @__PURE__ */ jsx(Text, {
+			css: styles.preview,
+			children: preview
+		}), /* @__PURE__ */ jsx(BitkitLinkButton, {
+			...styles.action,
+			onClick: () => setOpen(true),
+			children: `View ${title.toLowerCase()}`
+		})]
+	}), /* @__PURE__ */ jsx(BitkitDialog, {
+		open,
+		size: "sm",
+		title,
+		variant: "overflowContent",
+		onOpenChange: ({ open: isOpen }) => setOpen(isOpen),
+		children: /* @__PURE__ */ jsx(BitkitDialogBody, { children })
+	})] });
+});
+BitkitOverflowContent.displayName = "BitkitOverflowContent";
+//#endregion
+export { BitkitOverflowContent as default };
+
+//# sourceMappingURL=BitkitOverflowContent.js.map

package/dist/components/BitkitOverflowContent/BitkitOverflowContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BitkitOverflowContent.js","names":[],"sources":["../../../lib/components/BitkitOverflowContent/BitkitOverflowContent.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 { forwardRef, type ReactNode, useState } from 'react';\n\nimport BitkitDialog from '../BitkitDialog/BitkitDialog';\nimport BitkitDialogBody from '../BitkitDialog/BitkitDialogBody';\nimport BitkitLinkButton from '../BitkitLinkButton/BitkitLinkButton';\n\nexport interface BitkitOverflowContentProps extends Omit<BoxProps, 'children' | 'title'> {\n  children: ReactNode;\n  previewText?: string;\n  title: string;\n}\n\nconst BitkitOverflowContent = forwardRef<HTMLDivElement, BitkitOverflowContentProps>((props, ref) => {\n  const { children, previewText, title, ...rest } = props;\n  const [open, setOpen] = useState(false);\n  const recipe = useSlotRecipe({ key: 'overflowContent' });\n  const styles = recipe();\n  const preview = previewText || (typeof children === 'string' ? children : 'Click to view content');\n\n  return (\n    <>\n      <Box ref={ref} css={styles.root} {...rest}>\n        <Text css={styles.preview}>{preview}</Text>\n        <BitkitLinkButton {...styles.action} onClick={() => setOpen(true)}>\n          {`View ${title.toLowerCase()}`}\n        </BitkitLinkButton>\n      </Box>\n      <BitkitDialog\n        open={open}\n        size=\"sm\"\n        title={title}\n        variant=\"overflowContent\"\n        onOpenChange={({ open: isOpen }) => setOpen(isOpen)}\n      >\n        <BitkitDialogBody>{children}</BitkitDialogBody>\n      </BitkitDialog>\n    </>\n  );\n});\n\nBitkitOverflowContent.displayName = 'BitkitOverflowContent';\n\nexport default BitkitOverflowContent;\n"],"mappings":";;;;;;;;;AAeA,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,aAAa,OAAO,GAAG,SAAS;CAClD,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CAEvC,MAAM,SADS,cAAc,EAAE,KAAK,mBAAmB,CAAC,EACjC;CACvB,MAAM,UAAU,gBAAgB,OAAO,aAAa,WAAW,WAAW;AAE1E,QACE,qBAAA,YAAA,EAAA,UAAA,CACE,qBAAC,KAAD;EAAU;EAAK,KAAK,OAAO;EAAM,GAAI;YAArC,CACE,oBAAC,MAAD;GAAM,KAAK,OAAO;aAAU;GAAe,CAAA,EAC3C,oBAAC,kBAAD;GAAkB,GAAI,OAAO;GAAQ,eAAe,QAAQ,KAAK;aAC9D,QAAQ,MAAM,aAAa;GACX,CAAA,CACf;KACN,oBAAC,cAAD;EACQ;EACN,MAAK;EACE;EACP,SAAQ;EACR,eAAe,EAAE,MAAM,aAAa,QAAQ,OAAO;YAEnD,oBAAC,kBAAD,EAAmB,UAA4B,CAAA;EAClC,CAAA,CACd,EAAA,CAAA;EAEL;AAEF,sBAAsB,cAAc"}

package/dist/components/index.d.ts

@@ -40,6 +40,7 @@ export { default as BitkitNativeSelect, type BitkitNativeSelectProps } from './B
 export { default as BitkitNoteCard, type BitkitNoteCardProps } from './BitkitNoteCard/BitkitNoteCard';
 export { default as BitkitNumberInput, type BitkitNumberInputProps } from './BitkitNumberInput/BitkitNumberInput';
 export { default as BitkitOrderedList, type BitkitOrderedListItemProps, type BitkitOrderedListProps, } from './BitkitOrderedList/BitkitOrderedList';
+export { default as BitkitOverflowContent, type BitkitOverflowContentProps, } from './BitkitOverflowContent/BitkitOverflowContent';
 export { default as BitkitOverflowTooltip, type BitkitOverflowTooltipProps, } from './BitkitOverflowTooltip/BitkitOverflowTooltip';
 export { default as BitkitPagination, type BitkitPaginationLabels, type BitkitPaginationProps, } from './BitkitPagination/BitkitPagination';
 export { default as BitkitPaginationLoadMore, type BitkitPaginationLoadMoreProps, } from './BitkitPaginationLoadMore/BitkitPaginationLoadMore';

package/dist/main.js

@@ -324,6 +324,7 @@ import BitkitMarkdownCard from "./components/BitkitMarkdownCard/BitkitMarkdownCa
 import BitkitNativeSelect from "./components/BitkitNativeSelect/BitkitNativeSelect.js";
 import BitkitNoteCard from "./components/BitkitNoteCard/BitkitNoteCard.js";
 import BitkitNumberInput from "./components/BitkitNumberInput/BitkitNumberInput.js";
+import BitkitOverflowContent from "./components/BitkitOverflowContent/BitkitOverflowContent.js";
 import BitkitOverflowTooltip from "./components/BitkitOverflowTooltip/BitkitOverflowTooltip.js";
 import BitkitPagination from "./components/BitkitPagination/BitkitPagination.js";
 import BitkitPaginationLoadMore from "./components/BitkitPaginationLoadMore/BitkitPaginationLoadMore.js";
@@ -349,4 +350,4 @@ import BitkitToggle from "./components/BitkitToggle/BitkitToggle.js";
 import BitkitToggleButton from "./components/BitkitToggleButton/BitkitToggleButton.js";
 import bitkitTheme from "./theme/index.js";
 import Provider from "./providers/BitkitProvider.js";
-export { BitkitAccordion, BitkitActionBar, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitButton, BitkitCalendar, BitkitCard, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox, BitkitControlButton, BitkitDefinitionTooltip, BitkitDialog, BitkitDialogBody, BitkitDialogButtons, BitkitDialogContent, BitkitDialogRoot, BitkitDraggableCard, BitkitEmptyState, BitkitExpandableCard, BitkitExplainerList_default as BitkitExplainerList, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLink, BitkitLinkButton, BitkitMarkdown, BitkitMarkdownCard, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOrderedList_default as BitkitOrderedList, BitkitOverflowTooltip, BitkitPagination, BitkitPaginationLoadMore, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect, BitkitSelectMenu, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSidebar_default as BitkitSidebar, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextInput, BitkitToggle, BitkitToggleButton, BitkitTooltip, BitkitUnorderedList_default as BitkitUnorderedList, 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, 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, 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, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast };
+export { BitkitAccordion, BitkitActionBar, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitButton, BitkitCalendar, BitkitCard, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox, BitkitControlButton, BitkitDefinitionTooltip, BitkitDialog, BitkitDialogBody, BitkitDialogButtons, BitkitDialogContent, BitkitDialogRoot, BitkitDraggableCard, BitkitEmptyState, BitkitExpandableCard, BitkitExplainerList_default as BitkitExplainerList, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLink, BitkitLinkButton, BitkitMarkdown, BitkitMarkdownCard, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOrderedList_default as BitkitOrderedList, BitkitOverflowContent, BitkitOverflowTooltip, BitkitPagination, BitkitPaginationLoadMore, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect, BitkitSelectMenu, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSidebar_default as BitkitSidebar, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextInput, BitkitToggle, BitkitToggleButton, BitkitTooltip, BitkitUnorderedList_default as BitkitUnorderedList, 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, 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, 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, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast };

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

@@ -1,4 +1,4 @@
-declare const dialogSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "label" | "title" | "trigger" | "positioner" | "closeTrigger" | "description" | "backdrop" | "scrollBody" | "scrollButton" | "scrollGradient", {
+declare const dialogSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "label" | "title" | "trigger" | "positioner" | "closeTrigger" | "description" | "scrollBody" | "scrollGradient" | "scrollButton" | "backdrop", {
     scrollBehavior: {
         inside: {
             body: {
@@ -31,5 +31,51 @@ declare const dialogSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<
             };
         };
     };
+    variant: {
+        overflowContent: {
+            content: {
+                maxHeight: "calc(100dvh - 48px)";
+                overflow: "hidden";
+            };
+            header: {
+                gap: "8";
+                paddingBlockEnd: "8";
+                paddingBlockStart: "16";
+                paddingInline: "16";
+            };
+            title: {
+                paddingInlineEnd: "32";
+                textStyle: "heading/h4";
+            };
+            body: {
+                overflowY: "auto";
+                paddingBlockEnd: "8";
+                paddingInline: "16";
+                _last: {
+                    paddingBlockEnd: number;
+                };
+            };
+            scrollBody: {
+                _last: {
+                    paddingBlockEnd: "16";
+                };
+            };
+            footer: {
+                paddingBlockEnd: "16";
+                paddingBlockStart: number;
+                paddingInline: "16";
+            };
+            closeTrigger: {
+                insetEnd: "12";
+                top: "12";
+            };
+            scrollGradient: {
+                bottom: "16";
+            };
+            scrollButton: {
+                bottom: "8";
+            };
+        };
+    };
 }>;
 export default dialogSlotRecipe;

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

@@ -121,7 +121,7 @@ var dialogSlotRecipe = defineSlotRecipe({
 			width: "32"
 		},
 		scrollGradient: {
-			background: "linear-gradient(0deg, white 0%, rgba(255, 255, 255, 0) 100%)",
+			background: "linear-gradient(0deg, {colors.background.primary} 0%, transparent 100%)",
 			bottom: "48",
 			height: "32",
 			pointerEvents: "none",
@@ -147,7 +147,41 @@ var dialogSlotRecipe = defineSlotRecipe({
 			lg: { content: { width: rem(800) } },
 			md: { content: { width: rem(640) } },
 			sm: { content: { width: rem(480) } }
-		}
+		},
+		variant: { overflowContent: {
+			content: {
+				maxHeight: "calc(100dvh - 48px)",
+				overflow: "hidden"
+			},
+			header: {
+				gap: "8",
+				paddingBlockEnd: "8",
+				paddingBlockStart: "16",
+				paddingInline: "16"
+			},
+			title: {
+				paddingInlineEnd: "32",
+				textStyle: "heading/h4"
+			},
+			body: {
+				overflowY: "auto",
+				paddingBlockEnd: "8",
+				paddingInline: "16",
+				_last: { paddingBlockEnd: 0 }
+			},
+			scrollBody: { _last: { paddingBlockEnd: "16" } },
+			footer: {
+				paddingBlockEnd: "16",
+				paddingBlockStart: 0,
+				paddingInline: "16"
+			},
+			closeTrigger: {
+				insetEnd: "12",
+				top: "12"
+			},
+			scrollGradient: { bottom: "16" },
+			scrollButton: { bottom: "8" }
+		} }
 	},
 	defaultVariants: {
 		scrollBehavior: "outside",

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

@@ -1 +1 @@
-{"version":3,"file":"Dialog.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Dialog.recipe.ts"],"sourcesContent":["import { dialogAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst dialogSlotRecipe = defineSlotRecipe({\n  className: 'dialog',\n  slots: [...dialogAnatomy.keys(), 'label', 'scrollBody', 'scrollButton', 'scrollGradient'] as const,\n  base: {\n    backdrop: {\n      background: 'utilities/overlay',\n      position: 'fixed',\n      inset: '0',\n      zIndex: 'dialogOverlay',\n      _open: {\n        animationStyle: 'fade-in',\n        animationDuration: 'moderate',\n      },\n      _closed: {\n        animationStyle: 'fade-out',\n        animationDuration: 'moderate',\n      },\n    },\n    positioner: {\n      alignItems: 'center',\n      display: 'flex',\n      height: '100dvh',\n      justifyContent: 'center',\n      left: '0',\n      position: 'fixed',\n      top: '0',\n      width: '100dvw',\n      zIndex: 'dialog',\n    },\n    content: {\n      background: 'background/primary',\n      borderRadius: '8',\n      boxShadow: 'elevation/lg',\n      display: 'flex',\n      flexDirection: 'column',\n      outline: 'none',\n      position: 'relative',\n      _open: {\n        animationStyle: 'scale-fade-in',\n        animationDuration: 'moderate',\n      },\n      _closed: {\n        animationStyle: 'scale-fade-out',\n        animationDuration: 'faster',\n      },\n    },\n    header: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '16',\n      paddingBlock: '24',\n      paddingInline: '32',\n      position: 'relative',\n    },\n    title: {\n      color: 'text/primary',\n      paddingInlineEnd: '48',\n      textStyle: 'comp/dialog/title',\n    },\n    description: {\n      color: 'text/body',\n      textStyle: 'body/lg/regular',\n    },\n    label: {\n      color: 'text/secondary',\n      textStyle: 'comp/dialog/label',\n    },\n    body: {\n      display: 'flex',\n      flex: '1',\n      flexDirection: 'column',\n      gap: '24',\n      paddingInline: '32',\n      _last: {\n        paddingBlockEnd: '48',\n      },\n    },\n    scrollBody: {\n      display: 'flex',\n      flexDirection: 'column',\n      minHeight: 0,\n      position: 'relative',\n      _last: {\n        paddingBlockEnd: '48',\n      },\n    },\n    footer: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '16',\n      justifyContent: 'flex-end',\n      paddingBlockEnd: '32',\n      paddingBlockStart: '24',\n      paddingInline: '32',\n    },\n    closeTrigger: {\n      insetEnd: '24',\n      position: 'absolute',\n      top: '24',\n    },\n    scrollButton: {\n      alignItems: 'center',\n      alignSelf: 'center',\n      background: 'background/primary',\n      borderColor: 'border/minimal',\n      borderRadius: '100%',\n      borderWidth: '1px',\n      bottom: '16',\n      boxShadow: 'elevation/lg',\n      cursor: 'pointer',\n      display: 'flex',\n      height: '32',\n      justifyContent: 'center',\n      position: 'absolute',\n      width: '32',\n    },\n    scrollGradient: {\n      background: 'linear-gradient(0deg, white 0%, rgba(255, 255, 255, 0) 100%)',\n      bottom: '48',\n      height: '32',\n      pointerEvents: 'none',\n      position: 'absolute',\n      width: '100%',\n    },\n  },\n  variants: {\n    scrollBehavior: {\n      inside: {\n        body: {\n          overflowY: 'auto',\n          _last: {\n            paddingBlockEnd: 0, // override base _last: scrollBody slot handles padding instead\n          },\n        },\n        content: {\n          maxHeight: 'calc(100dvh - 96px)',\n          overflow: 'hidden',\n        },\n      },\n      outside: {},\n    },\n    size: {\n      lg: {\n        content: {\n          width: rem(800),\n        },\n      },\n      md: {\n        content: {\n          width: rem(640),\n        },\n      },\n      sm: {\n        content: {\n          width: rem(480),\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    scrollBehavior: 'outside',\n    size: 'md',\n  },\n});\n\nexport default dialogSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,mBAAmB,iBAAiB;CACxC,WAAW;CACX,OAAO;EAAC,GAAG,cAAc,MAAM;EAAE;EAAS;EAAc;EAAgB;EAAiB;CACzF,MAAM;EACJ,UAAU;GACR,YAAY;GACZ,UAAU;GACV,OAAO;GACP,QAAQ;GACR,OAAO;IACL,gBAAgB;IAChB,mBAAmB;IACpB;GACD,SAAS;IACP,gBAAgB;IAChB,mBAAmB;IACpB;GACF;EACD,YAAY;GACV,YAAY;GACZ,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,MAAM;GACN,UAAU;GACV,KAAK;GACL,OAAO;GACP,QAAQ;GACT;EACD,SAAS;GACP,YAAY;GACZ,cAAc;GACd,WAAW;GACX,SAAS;GACT,eAAe;GACf,SAAS;GACT,UAAU;GACV,OAAO;IACL,gBAAgB;IAChB,mBAAmB;IACpB;GACD,SAAS;IACP,gBAAgB;IAChB,mBAAmB;IACpB;GACF;EACD,QAAQ;GACN,SAAS;GACT,eAAe;GACf,KAAK;GACL,cAAc;GACd,eAAe;GACf,UAAU;GACX;EACD,OAAO;GACL,OAAO;GACP,kBAAkB;GAClB,WAAW;GACZ;EACD,aAAa;GACX,OAAO;GACP,WAAW;GACZ;EACD,OAAO;GACL,OAAO;GACP,WAAW;GACZ;EACD,MAAM;GACJ,SAAS;GACT,MAAM;GACN,eAAe;GACf,KAAK;GACL,eAAe;GACf,OAAO,EACL,iBAAiB,MAClB;GACF;EACD,YAAY;GACV,SAAS;GACT,eAAe;GACf,WAAW;GACX,UAAU;GACV,OAAO,EACL,iBAAiB,MAClB;GACF;EACD,QAAQ;GACN,YAAY;GACZ,SAAS;GACT,KAAK;GACL,gBAAgB;GAChB,iBAAiB;GACjB,mBAAmB;GACnB,eAAe;GAChB;EACD,cAAc;GACZ,UAAU;GACV,UAAU;GACV,KAAK;GACN;EACD,cAAc;GACZ,YAAY;GACZ,WAAW;GACX,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,QAAQ;GACR,WAAW;GACX,QAAQ;GACR,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,UAAU;GACV,OAAO;GACR;EACD,gBAAgB;GACd,YAAY;GACZ,QAAQ;GACR,QAAQ;GACR,eAAe;GACf,UAAU;GACV,OAAO;GACR;EACF;CACD,UAAU;EACR,gBAAgB;GACd,QAAQ;IACN,MAAM;KACJ,WAAW;KACX,OAAO,EACL,iBAAiB,GAClB;KACF;IACD,SAAS;KACP,WAAW;KACX,UAAU;KACX;IACF;GACD,SAAS,EAAE;GACZ;EACD,MAAM;GACJ,IAAI,EACF,SAAS,EACP,OAAO,IAAI,IAAI,EAChB,EACF;GACD,IAAI,EACF,SAAS,EACP,OAAO,IAAI,IAAI,EAChB,EACF;GACD,IAAI,EACF,SAAS,EACP,OAAO,IAAI,IAAI,EAChB,EACF;GACF;EACF;CACD,iBAAiB;EACf,gBAAgB;EAChB,MAAM;EACP;CACF,CAAC"}
+{"version":3,"file":"Dialog.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Dialog.recipe.ts"],"sourcesContent":["import { dialogAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst dialogSlotRecipe = defineSlotRecipe({\n  className: 'dialog',\n  slots: [...dialogAnatomy.keys(), 'label', 'scrollBody', 'scrollButton', 'scrollGradient'] as const,\n  base: {\n    backdrop: {\n      background: 'utilities/overlay',\n      position: 'fixed',\n      inset: '0',\n      zIndex: 'dialogOverlay',\n      _open: {\n        animationStyle: 'fade-in',\n        animationDuration: 'moderate',\n      },\n      _closed: {\n        animationStyle: 'fade-out',\n        animationDuration: 'moderate',\n      },\n    },\n    positioner: {\n      alignItems: 'center',\n      display: 'flex',\n      height: '100dvh',\n      justifyContent: 'center',\n      left: '0',\n      position: 'fixed',\n      top: '0',\n      width: '100dvw',\n      zIndex: 'dialog',\n    },\n    content: {\n      background: 'background/primary',\n      borderRadius: '8',\n      boxShadow: 'elevation/lg',\n      display: 'flex',\n      flexDirection: 'column',\n      outline: 'none',\n      position: 'relative',\n      _open: {\n        animationStyle: 'scale-fade-in',\n        animationDuration: 'moderate',\n      },\n      _closed: {\n        animationStyle: 'scale-fade-out',\n        animationDuration: 'faster',\n      },\n    },\n    header: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '16',\n      paddingBlock: '24',\n      paddingInline: '32',\n      position: 'relative',\n    },\n    title: {\n      color: 'text/primary',\n      paddingInlineEnd: '48',\n      textStyle: 'comp/dialog/title',\n    },\n    description: {\n      color: 'text/body',\n      textStyle: 'body/lg/regular',\n    },\n    label: {\n      color: 'text/secondary',\n      textStyle: 'comp/dialog/label',\n    },\n    body: {\n      display: 'flex',\n      flex: '1',\n      flexDirection: 'column',\n      gap: '24',\n      paddingInline: '32',\n      _last: {\n        paddingBlockEnd: '48',\n      },\n    },\n    scrollBody: {\n      display: 'flex',\n      flexDirection: 'column',\n      minHeight: 0,\n      position: 'relative',\n      _last: {\n        paddingBlockEnd: '48',\n      },\n    },\n    footer: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '16',\n      justifyContent: 'flex-end',\n      paddingBlockEnd: '32',\n      paddingBlockStart: '24',\n      paddingInline: '32',\n    },\n    closeTrigger: {\n      insetEnd: '24',\n      position: 'absolute',\n      top: '24',\n    },\n    scrollButton: {\n      alignItems: 'center',\n      alignSelf: 'center',\n      background: 'background/primary',\n      borderColor: 'border/minimal',\n      borderRadius: '100%',\n      borderWidth: '1px',\n      bottom: '16',\n      boxShadow: 'elevation/lg',\n      cursor: 'pointer',\n      display: 'flex',\n      height: '32',\n      justifyContent: 'center',\n      position: 'absolute',\n      width: '32',\n    },\n    scrollGradient: {\n      background: 'linear-gradient(0deg, {colors.background.primary} 0%, transparent 100%)',\n      bottom: '48',\n      height: '32',\n      pointerEvents: 'none',\n      position: 'absolute',\n      width: '100%',\n    },\n  },\n  variants: {\n    scrollBehavior: {\n      inside: {\n        body: {\n          overflowY: 'auto',\n          _last: {\n            paddingBlockEnd: 0, // override base _last: scrollBody slot handles padding instead\n          },\n        },\n        content: {\n          maxHeight: 'calc(100dvh - 96px)',\n          overflow: 'hidden',\n        },\n      },\n      outside: {},\n    },\n    size: {\n      lg: {\n        content: {\n          width: rem(800),\n        },\n      },\n      md: {\n        content: {\n          width: rem(640),\n        },\n      },\n      sm: {\n        content: {\n          width: rem(480),\n        },\n      },\n    },\n    variant: {\n      overflowContent: {\n        content: {\n          maxHeight: 'calc(100dvh - 48px)',\n          overflow: 'hidden',\n        },\n        header: {\n          gap: '8',\n          paddingBlockEnd: '8',\n          paddingBlockStart: '16',\n          paddingInline: '16',\n        },\n        title: {\n          paddingInlineEnd: '32',\n          textStyle: 'heading/h4',\n        },\n        body: {\n          overflowY: 'auto',\n          paddingBlockEnd: '8',\n          paddingInline: '16',\n          _last: {\n            paddingBlockEnd: 0,\n          },\n        },\n        scrollBody: {\n          _last: {\n            paddingBlockEnd: '16',\n          },\n        },\n        footer: {\n          paddingBlockEnd: '16',\n          paddingBlockStart: 0,\n          paddingInline: '16',\n        },\n        closeTrigger: {\n          insetEnd: '12',\n          top: '12',\n        },\n        scrollGradient: {\n          bottom: '16',\n        },\n        scrollButton: {\n          bottom: '8',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    scrollBehavior: 'outside',\n    size: 'md',\n  },\n});\n\nexport default dialogSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,mBAAmB,iBAAiB;CACxC,WAAW;CACX,OAAO;EAAC,GAAG,cAAc,MAAM;EAAE;EAAS;EAAc;EAAgB;EAAiB;CACzF,MAAM;EACJ,UAAU;GACR,YAAY;GACZ,UAAU;GACV,OAAO;GACP,QAAQ;GACR,OAAO;IACL,gBAAgB;IAChB,mBAAmB;IACpB;GACD,SAAS;IACP,gBAAgB;IAChB,mBAAmB;IACpB;GACF;EACD,YAAY;GACV,YAAY;GACZ,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,MAAM;GACN,UAAU;GACV,KAAK;GACL,OAAO;GACP,QAAQ;GACT;EACD,SAAS;GACP,YAAY;GACZ,cAAc;GACd,WAAW;GACX,SAAS;GACT,eAAe;GACf,SAAS;GACT,UAAU;GACV,OAAO;IACL,gBAAgB;IAChB,mBAAmB;IACpB;GACD,SAAS;IACP,gBAAgB;IAChB,mBAAmB;IACpB;GACF;EACD,QAAQ;GACN,SAAS;GACT,eAAe;GACf,KAAK;GACL,cAAc;GACd,eAAe;GACf,UAAU;GACX;EACD,OAAO;GACL,OAAO;GACP,kBAAkB;GAClB,WAAW;GACZ;EACD,aAAa;GACX,OAAO;GACP,WAAW;GACZ;EACD,OAAO;GACL,OAAO;GACP,WAAW;GACZ;EACD,MAAM;GACJ,SAAS;GACT,MAAM;GACN,eAAe;GACf,KAAK;GACL,eAAe;GACf,OAAO,EACL,iBAAiB,MAClB;GACF;EACD,YAAY;GACV,SAAS;GACT,eAAe;GACf,WAAW;GACX,UAAU;GACV,OAAO,EACL,iBAAiB,MAClB;GACF;EACD,QAAQ;GACN,YAAY;GACZ,SAAS;GACT,KAAK;GACL,gBAAgB;GAChB,iBAAiB;GACjB,mBAAmB;GACnB,eAAe;GAChB;EACD,cAAc;GACZ,UAAU;GACV,UAAU;GACV,KAAK;GACN;EACD,cAAc;GACZ,YAAY;GACZ,WAAW;GACX,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,QAAQ;GACR,WAAW;GACX,QAAQ;GACR,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,UAAU;GACV,OAAO;GACR;EACD,gBAAgB;GACd,YAAY;GACZ,QAAQ;GACR,QAAQ;GACR,eAAe;GACf,UAAU;GACV,OAAO;GACR;EACF;CACD,UAAU;EACR,gBAAgB;GACd,QAAQ;IACN,MAAM;KACJ,WAAW;KACX,OAAO,EACL,iBAAiB,GAClB;KACF;IACD,SAAS;KACP,WAAW;KACX,UAAU;KACX;IACF;GACD,SAAS,EAAE;GACZ;EACD,MAAM;GACJ,IAAI,EACF,SAAS,EACP,OAAO,IAAI,IAAI,EAChB,EACF;GACD,IAAI,EACF,SAAS,EACP,OAAO,IAAI,IAAI,EAChB,EACF;GACD,IAAI,EACF,SAAS,EACP,OAAO,IAAI,IAAI,EAChB,EACF;GACF;EACD,SAAS,EACP,iBAAiB;GACf,SAAS;IACP,WAAW;IACX,UAAU;IACX;GACD,QAAQ;IACN,KAAK;IACL,iBAAiB;IACjB,mBAAmB;IACnB,eAAe;IAChB;GACD,OAAO;IACL,kBAAkB;IAClB,WAAW;IACZ;GACD,MAAM;IACJ,WAAW;IACX,iBAAiB;IACjB,eAAe;IACf,OAAO,EACL,iBAAiB,GAClB;IACF;GACD,YAAY,EACV,OAAO,EACL,iBAAiB,MAClB,EACF;GACD,QAAQ;IACN,iBAAiB;IACjB,mBAAmB;IACnB,eAAe;IAChB;GACD,cAAc;IACZ,UAAU;IACV,KAAK;IACN;GACD,gBAAgB,EACd,QAAQ,MACT;GACD,cAAc,EACZ,QAAQ,KACT;GACF,EACF;EACF;CACD,iBAAiB;EACf,gBAAgB;EAChB,MAAM;EACP;CACF,CAAC"}

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

@@ -0,0 +1,2 @@
+declare const overflowContentSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "action" | "preview", import('@chakra-ui/react').SlotRecipeVariantRecord<"root" | "action" | "preview">>;
+export default overflowContentSlotRecipe;

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

@@ -0,0 +1,42 @@
+import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
+//#region lib/theme/slot-recipes/OverflowContent.recipe.ts
+var overflowContentSlotRecipe = defineSlotRecipe({
+	className: "overflowContent",
+	slots: [
+		"root",
+		"preview",
+		"action"
+	],
+	base: {
+		root: {
+			alignItems: "center",
+			display: "flex",
+			gap: "4"
+		},
+		preview: {
+			color: "text/body",
+			flex: "1",
+			minWidth: 0,
+			overflow: "hidden",
+			position: "relative",
+			textOverflow: "ellipsis",
+			textStyle: "body/md/regular",
+			whiteSpace: "nowrap",
+			_after: {
+				background: "linear-gradient(to left, {colors.background.primary} 0%, transparent 100%)",
+				content: "\"\"",
+				height: "100%",
+				pointerEvents: "none",
+				position: "absolute",
+				right: "0",
+				top: "0",
+				width: "32"
+			}
+		},
+		action: { flexShrink: "0" }
+	}
+});
+//#endregion
+export { overflowContentSlotRecipe as default };
+
+//# sourceMappingURL=OverflowContent.recipe.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"OverflowContent.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/OverflowContent.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst overflowContentSlotRecipe = defineSlotRecipe({\n  className: 'overflowContent',\n  slots: ['root', 'preview', 'action'] as const,\n  base: {\n    root: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '4',\n    },\n    preview: {\n      color: 'text/body',\n      flex: '1',\n      minWidth: 0,\n      overflow: 'hidden',\n      position: 'relative',\n      textOverflow: 'ellipsis',\n      textStyle: 'body/md/regular',\n      whiteSpace: 'nowrap',\n      _after: {\n        background: 'linear-gradient(to left, {colors.background.primary} 0%, transparent 100%)',\n        content: '\"\"',\n        height: '100%',\n        pointerEvents: 'none',\n        position: 'absolute',\n        right: '0',\n        top: '0',\n        width: '32',\n      },\n    },\n    action: {\n      flexShrink: '0',\n    },\n  },\n});\n\nexport default overflowContentSlotRecipe;\n"],"mappings":";;AAEA,IAAM,4BAA4B,iBAAiB;CACjD,WAAW;CACX,OAAO;EAAC;EAAQ;EAAW;EAAS;CACpC,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,SAAS;GACT,KAAK;GACN;EACD,SAAS;GACP,OAAO;GACP,MAAM;GACN,UAAU;GACV,UAAU;GACV,UAAU;GACV,cAAc;GACd,WAAW;GACX,YAAY;GACZ,QAAQ;IACN,YAAY;IACZ,SAAS;IACT,QAAQ;IACR,eAAe;IACf,UAAU;IACV,OAAO;IACP,KAAK;IACL,OAAO;IACR;GACF;EACD,QAAQ,EACN,YAAY,KACb;EACF;CACF,CAAC"}

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

@@ -507,7 +507,7 @@ declare const slotRecipes: {
             };
         };
     }>;
-    dialog: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "label" | "title" | "trigger" | "positioner" | "closeTrigger" | "description" | "backdrop" | "scrollBody" | "scrollButton" | "scrollGradient", {
+    dialog: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "label" | "title" | "trigger" | "positioner" | "closeTrigger" | "description" | "scrollBody" | "scrollGradient" | "scrollButton" | "backdrop", {
         scrollBehavior: {
             inside: {
                 body: {
@@ -540,6 +540,52 @@ declare const slotRecipes: {
                 };
             };
         };
+        variant: {
+            overflowContent: {
+                content: {
+                    maxHeight: "calc(100dvh - 48px)";
+                    overflow: "hidden";
+                };
+                header: {
+                    gap: "8";
+                    paddingBlockEnd: "8";
+                    paddingBlockStart: "16";
+                    paddingInline: "16";
+                };
+                title: {
+                    paddingInlineEnd: "32";
+                    textStyle: "heading/h4";
+                };
+                body: {
+                    overflowY: "auto";
+                    paddingBlockEnd: "8";
+                    paddingInline: "16";
+                    _last: {
+                        paddingBlockEnd: number;
+                    };
+                };
+                scrollBody: {
+                    _last: {
+                        paddingBlockEnd: "16";
+                    };
+                };
+                footer: {
+                    paddingBlockEnd: "16";
+                    paddingBlockStart: number;
+                    paddingInline: "16";
+                };
+                closeTrigger: {
+                    insetEnd: "12";
+                    top: "12";
+                };
+                scrollGradient: {
+                    bottom: "16";
+                };
+                scrollButton: {
+                    bottom: "8";
+                };
+            };
+        };
     }>;
     draggableCard: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "handle", {
         isDragging: {
@@ -943,6 +989,7 @@ declare const slotRecipes: {
             };
         };
     }>;
+    overflowContent: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "action" | "preview", import('@chakra-ui/react').SlotRecipeVariantRecord<"root" | "action" | "preview">>;
     pagination: import('@chakra-ui/react').SlotRecipeDefinition<"text" | "root" | "itemsBlock" | "itemsSelect" | "pageBlock" | "pageSelect", {
         variant: {
             card: {

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

@@ -29,6 +29,7 @@ import markdownCardSlotRecipe from "./MarkdownCard.recipe.js";
 import menuSlotRecipe from "./Menu.recipe.js";
 import nativeSelectSlotRecipe from "./NativeSelect.recipe.js";
 import noteCardSlotRecipe from "./NoteCard.recipe.js";
+import overflowContentSlotRecipe from "./OverflowContent.recipe.js";
 import paginationSlotRecipe from "./Pagination.recipe.js";
 import paginationLoadMoreRecipe from "./PaginationLoadMore.recipe.js";
 import radioGroupSlotRecipe from "./RadioGroup.recipe.js";
@@ -78,6 +79,7 @@ var slotRecipes = {
 	noteCard: noteCardSlotRecipe,
 	nativeSelect: nativeSelectSlotRecipe,
 	numberInput: numberInputSlotRecipe,
+	overflowContent: overflowContentSlotRecipe,
 	pagination: paginationSlotRecipe,
 	paginationLoadMore: paginationLoadMoreRecipe,
 	radioGroup: radioGroupSlotRecipe,

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 datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport draggableCardSlotRecipe from './DraggableCard.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 nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport noteCardSlotRecipe from './NoteCard.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport paginationSlotRecipe from './Pagination.recipe.ts';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.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 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 toastSlotRecipe from './Toast.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\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  datePicker: datePickerSlotRecipe,\n  datePickerSelect: datePickerSelectSlotRecipe,\n  dialog: dialogSlotRecipe,\n  draggableCard: draggableCardSlotRecipe,\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  noteCard: noteCardSlotRecipe,\n  nativeSelect: nativeSelectSlotRecipe,\n  numberInput: numberInputSlotRecipe,\n  pagination: paginationSlotRecipe,\n  paginationLoadMore: paginationLoadMoreSlotRecipe,\n  radioGroup: radioGroupSlotRecipe,\n  ribbon: ribbonSlotRecipe,\n  sectionHeading: sectionHeadingSlotRecipe,\n  labeledData: labeledDataSlotRecipe,\n  segmentGroup: segmentGroupSlotRecipe,\n  sidebar: sidebarSlotRecipe,\n  select: selectSlotRecipe,\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  toast: toastSlotRecipe,\n  tooltip: tooltipSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA,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,kBAAkB;CAClB,QAAQ;CACR,eAAe;CACf,YAAY;CACZ,gBAAgB;CAChB,OAAO;CACP,cAAc;CACd,UAAU;CACV,YAAY;CACZ,cAAc;CACd,eAAe;CACf,MAAM;CACN,UAAU;CACV,cAAc;CACd,MAAM;CACN,UAAU;CACV,cAAc;CACd,aAAa;CACb,YAAY;CACZ,oBAAoB;CACpB,YAAY;CACZ,QAAQ;CACR,gBAAgB;CAChB,aAAa;CACb,cAAc;CACd,SAAS;CACT,QAAQ;CACR,aAAa;CACb,MAAM;CACN,WAAW;CACX,OAAO;CACP,QAAQ;CACR,OAAO;CACP,MAAM;CACN,KAAK;CACL,WAAW;CACX,OAAO;CACP,SAAS;CACV"}
+{"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 datePickerSlotRecipe from './DatePicker.recipe.ts';\nimport datePickerSelectSlotRecipe from './DatePickerSelect.recipe.ts';\nimport dialogSlotRecipe from './Dialog.recipe.ts';\nimport draggableCardSlotRecipe from './DraggableCard.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 nativeSelectSlotRecipe from './NativeSelect.recipe.ts';\nimport noteCardSlotRecipe from './NoteCard.recipe.ts';\nimport numberInputSlotRecipe from './NumberInput.recipe';\nimport overflowContentSlotRecipe from './OverflowContent.recipe.ts';\nimport paginationSlotRecipe from './Pagination.recipe.ts';\nimport paginationLoadMoreSlotRecipe from './PaginationLoadMore.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 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 toastSlotRecipe from './Toast.recipe';\nimport tooltipSlotRecipe from './Tooltip.recipe';\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  datePicker: datePickerSlotRecipe,\n  datePickerSelect: datePickerSelectSlotRecipe,\n  dialog: dialogSlotRecipe,\n  draggableCard: draggableCardSlotRecipe,\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  noteCard: noteCardSlotRecipe,\n  nativeSelect: nativeSelectSlotRecipe,\n  numberInput: numberInputSlotRecipe,\n  overflowContent: overflowContentSlotRecipe,\n  pagination: paginationSlotRecipe,\n  paginationLoadMore: paginationLoadMoreSlotRecipe,\n  radioGroup: radioGroupSlotRecipe,\n  ribbon: ribbonSlotRecipe,\n  sectionHeading: sectionHeadingSlotRecipe,\n  labeledData: labeledDataSlotRecipe,\n  segmentGroup: segmentGroupSlotRecipe,\n  sidebar: sidebarSlotRecipe,\n  select: selectSlotRecipe,\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  toast: toastSlotRecipe,\n  tooltip: tooltipSlotRecipe,\n};\n\nexport default slotRecipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDA,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,kBAAkB;CAClB,QAAQ;CACR,eAAe;CACf,YAAY;CACZ,gBAAgB;CAChB,OAAO;CACP,cAAc;CACd,UAAU;CACV,YAAY;CACZ,cAAc;CACd,eAAe;CACf,MAAM;CACN,UAAU;CACV,cAAc;CACd,MAAM;CACN,UAAU;CACV,cAAc;CACd,aAAa;CACb,iBAAiB;CACjB,YAAY;CACZ,oBAAoB;CACpB,YAAY;CACZ,QAAQ;CACR,gBAAgB;CAChB,aAAa;CACb,cAAc;CACd,SAAS;CACT,QAAQ;CACR,aAAa;CACb,MAAM;CACN,WAAW;CACX,OAAO;CACP,QAAQ;CACR,OAAO;CACP,MAAM;CACN,KAAK;CACL,WAAW;CACX,OAAO;CACP,SAAS;CACV"}

package/package.json

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