@bitrise/bitkit-v2 0.3.187 → 0.3.188

package/dist/components/BitkitDraggableCard/BitkitDraggableCard.d.ts

@@ -0,0 +1,37 @@
+import { BoxProps } from '@chakra-ui/react/box';
+import { ReactNode, Ref } from 'react';
+export interface BitkitDraggableCardProps extends Omit<BoxProps, 'children'> {
+    children: ReactNode;
+    /** Ref for the drag handle element — pass useSortable().handleRef here. When provided, only the handle initiates drag. */
+    handleRef?: Ref<HTMLButtonElement>;
+    /** Whether this card is currently being dragged */
+    isDragging?: boolean;
+    /** Whether this card is a drop target placeholder */
+    isDropTarget?: boolean;
+}
+/**
+ * A card with a drag handle, designed for use with `@dnd-kit/react`.
+ *
+ * The component is purely presentational — it does not depend on `@dnd-kit`.
+ * Pass the refs and state flags from `useSortable` (or `useDraggable`) to wire it up.
+ *
+ * @example Full-card drag (default — the entire card is draggable)
+ * ```tsx
+ * const { ref, isDragSource, isDropTarget } = useSortable({ id, index });
+ *
+ * <BitkitDraggableCard ref={ref} isDragging={isDragSource} isDropTarget={isDropTarget}>
+ *   {children}
+ * </BitkitDraggableCard>
+ * ```
+ *
+ * @example Handle-only drag (pass handleRef to restrict drag to the handle)
+ * ```tsx
+ * const { ref, handleRef, isDragSource, isDropTarget } = useSortable({ id, index });
+ *
+ * <BitkitDraggableCard ref={ref} handleRef={handleRef} isDragging={isDragSource} isDropTarget={isDropTarget}>
+ *   {children}
+ * </BitkitDraggableCard>
+ * ```
+ */
+declare const BitkitDraggableCard: import('react').ForwardRefExoticComponent<BitkitDraggableCardProps & import('react').RefAttributes<HTMLDivElement>>;
+export default BitkitDraggableCard;

package/dist/components/BitkitDraggableCard/BitkitDraggableCard.js

@@ -0,0 +1,62 @@
+import IconDragHandle from "../../icons/IconDragHandle.js";
+import { Box } from "@chakra-ui/react/box";
+import { chakra, useSlotRecipe } from "@chakra-ui/react/styled-system";
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region lib/components/BitkitDraggableCard/BitkitDraggableCard.tsx
+/**
+* A card with a drag handle, designed for use with `@dnd-kit/react`.
+*
+* The component is purely presentational — it does not depend on `@dnd-kit`.
+* Pass the refs and state flags from `useSortable` (or `useDraggable`) to wire it up.
+*
+* @example Full-card drag (default — the entire card is draggable)
+* ```tsx
+* const { ref, isDragSource, isDropTarget } = useSortable({ id, index });
+*
+* <BitkitDraggableCard ref={ref} isDragging={isDragSource} isDropTarget={isDropTarget}>
+*   {children}
+* </BitkitDraggableCard>
+* ```
+*
+* @example Handle-only drag (pass handleRef to restrict drag to the handle)
+* ```tsx
+* const { ref, handleRef, isDragSource, isDropTarget } = useSortable({ id, index });
+*
+* <BitkitDraggableCard ref={ref} handleRef={handleRef} isDragging={isDragSource} isDropTarget={isDropTarget}>
+*   {children}
+* </BitkitDraggableCard>
+* ```
+*/
+var BitkitDraggableCard = forwardRef((props, ref) => {
+	const { children, handleRef, isDragging = false, isDropTarget = false, ...rest } = props;
+	const isFullCardDrag = !handleRef;
+	const styles = useSlotRecipe({ key: "draggableCard" })({
+		isDragging,
+		isDropTarget,
+		isFullCardDrag
+	});
+	return /* @__PURE__ */ jsxs(Box, {
+		ref,
+		css: styles.root,
+		...rest,
+		children: [isFullCardDrag ? /* @__PURE__ */ jsx(chakra.div, {
+			css: styles.handle,
+			children: /* @__PURE__ */ jsx(IconDragHandle, { size: "16" })
+		}) : /* @__PURE__ */ jsx(chakra.button, {
+			ref: handleRef,
+			type: "button",
+			"aria-label": "Drag handle",
+			css: styles.handle,
+			children: /* @__PURE__ */ jsx(IconDragHandle, { size: "16" })
+		}), /* @__PURE__ */ jsx(Box, {
+			css: styles.content,
+			children
+		})]
+	});
+});
+BitkitDraggableCard.displayName = "BitkitDraggableCard";
+//#endregion
+export { BitkitDraggableCard as default };
+
+//# sourceMappingURL=BitkitDraggableCard.js.map

package/dist/components/BitkitDraggableCard/BitkitDraggableCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BitkitDraggableCard.js","names":[],"sources":["../../../lib/components/BitkitDraggableCard/BitkitDraggableCard.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type ReactNode, type Ref } from 'react';\n\nimport IconDragHandle from '../../icons/IconDragHandle';\n\n// ----- Props -----\n\nexport interface BitkitDraggableCardProps extends Omit<BoxProps, 'children'> {\n  children: ReactNode;\n  /** Ref for the drag handle element — pass useSortable().handleRef here. When provided, only the handle initiates drag. */\n  handleRef?: Ref<HTMLButtonElement>;\n  /** Whether this card is currently being dragged */\n  isDragging?: boolean;\n  /** Whether this card is a drop target placeholder */\n  isDropTarget?: boolean;\n}\n\n// ----- Component -----\n\n/**\n * A card with a drag handle, designed for use with `@dnd-kit/react`.\n *\n * The component is purely presentational — it does not depend on `@dnd-kit`.\n * Pass the refs and state flags from `useSortable` (or `useDraggable`) to wire it up.\n *\n * @example Full-card drag (default — the entire card is draggable)\n * ```tsx\n * const { ref, isDragSource, isDropTarget } = useSortable({ id, index });\n *\n * <BitkitDraggableCard ref={ref} isDragging={isDragSource} isDropTarget={isDropTarget}>\n *   {children}\n * </BitkitDraggableCard>\n * ```\n *\n * @example Handle-only drag (pass handleRef to restrict drag to the handle)\n * ```tsx\n * const { ref, handleRef, isDragSource, isDropTarget } = useSortable({ id, index });\n *\n * <BitkitDraggableCard ref={ref} handleRef={handleRef} isDragging={isDragSource} isDropTarget={isDropTarget}>\n *   {children}\n * </BitkitDraggableCard>\n * ```\n */\nconst BitkitDraggableCard = forwardRef<HTMLDivElement, BitkitDraggableCardProps>((props, ref) => {\n  const { children, handleRef, isDragging = false, isDropTarget = false, ...rest } = props;\n\n  const isFullCardDrag = !handleRef;\n  const recipe = useSlotRecipe({ key: 'draggableCard' });\n  const styles = recipe({ isDragging, isDropTarget, isFullCardDrag });\n\n  return (\n    <Box ref={ref} css={styles.root} {...rest}>\n      {isFullCardDrag ? (\n        <chakra.div css={styles.handle}>\n          <IconDragHandle size=\"16\" />\n        </chakra.div>\n      ) : (\n        <chakra.button ref={handleRef} type=\"button\" aria-label=\"Drag handle\" css={styles.handle}>\n          <IconDragHandle size=\"16\" />\n        </chakra.button>\n      )}\n      <Box css={styles.content}>{children}</Box>\n    </Box>\n  );\n});\n\nBitkitDraggableCard.displayName = 'BitkitDraggableCard';\n\nexport default BitkitDraggableCard;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CA,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,WAAW,aAAa,OAAO,eAAe,OAAO,GAAG,SAAS;CAEnF,MAAM,iBAAiB,CAAC;CAExB,MAAM,SADS,cAAc,EAAE,KAAK,iBAAiB,CAAC,CAChC;EAAE;EAAY;EAAc;EAAgB,CAAC;AAEnE,QACE,qBAAC,KAAD;EAAU;EAAK,KAAK,OAAO;EAAM,GAAI;YAArC,CACG,iBACC,oBAAC,OAAO,KAAR;GAAY,KAAK,OAAO;aACtB,oBAAC,gBAAD,EAAgB,MAAK,MAAO,CAAA;GACjB,CAAA,GAEb,oBAAC,OAAO,QAAR;GAAe,KAAK;GAAW,MAAK;GAAS,cAAW;GAAc,KAAK,OAAO;aAChF,oBAAC,gBAAD,EAAgB,MAAK,MAAO,CAAA;GACd,CAAA,EAElB,oBAAC,KAAD;GAAK,KAAK,OAAO;GAAU;GAAe,CAAA,CACtC;;EAER;AAEF,oBAAoB,cAAc"}

package/dist/components/index.d.ts

@@ -19,6 +19,7 @@ export { default as BitkitDialog, type BitkitDialogProps } from './BitkitDialog/
 export { default as BitkitDialogBody, type BitkitDialogBodyProps } from './BitkitDialog/BitkitDialogBody';
 export { default as BitkitDialogContent, type BitkitDialogContentProps } from './BitkitDialog/BitkitDialogContent';
 export { default as BitkitDialogRoot, type BitkitDialogRootProps } from './BitkitDialog/BitkitDialogRoot';
+export { default as BitkitDraggableCard, type BitkitDraggableCardProps, } from './BitkitDraggableCard/BitkitDraggableCard';
 export { default as BitkitEmptyState, type BitkitEmptyStateProps } from './BitkitEmptyState/BitkitEmptyState';
 export { default as BitkitExpandableCard, type BitkitExpandableCardProps, } from './BitkitExpandableCard/BitkitExpandableCard';
 export { default as BitkitExplainerList, type BitkitExplainerListItemProps, type BitkitExplainerListProps, } from './BitkitExplainerList/BitkitExplainerList';

package/dist/icons/IconDragHandle.d.ts

@@ -0,0 +1,8 @@
+import { IconProps } from '@chakra-ui/react/icon';
+export interface IconDragHandleProps extends IconProps {
+    size?: '16' | '24';
+}
+declare const IconDragHandle: import('react').ForwardRefExoticComponent<IconDragHandleProps> & {
+    __bitkitIcon: true;
+};
+export default IconDragHandle;

package/dist/icons/IconDragHandle.js

@@ -0,0 +1,97 @@
+import { bitkitIcon } from "./bitkitIcon.js";
+import { Icon } from "@chakra-ui/react/icon";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region lib/icons/IconDragHandle.tsx
+var IconDragHandle = bitkitIcon(function IconDragHandle({ size = "24", ...props }, ref) {
+	if (size === "16") return /* @__PURE__ */ jsx(Icon, {
+		asChild: true,
+		ref,
+		...props,
+		children: /* @__PURE__ */ jsxs("svg", {
+			width: "16",
+			height: "16",
+			viewBox: "0 0 16 16",
+			fill: "currentColor",
+			children: [
+				/* @__PURE__ */ jsx("circle", {
+					cx: "6",
+					cy: "4",
+					r: "1"
+				}),
+				/* @__PURE__ */ jsx("circle", {
+					cx: "10",
+					cy: "4",
+					r: "1"
+				}),
+				/* @__PURE__ */ jsx("circle", {
+					cx: "6",
+					cy: "8",
+					r: "1"
+				}),
+				/* @__PURE__ */ jsx("circle", {
+					cx: "10",
+					cy: "8",
+					r: "1"
+				}),
+				/* @__PURE__ */ jsx("circle", {
+					cx: "6",
+					cy: "12",
+					r: "1"
+				}),
+				/* @__PURE__ */ jsx("circle", {
+					cx: "10",
+					cy: "12",
+					r: "1"
+				})
+			]
+		})
+	});
+	return /* @__PURE__ */ jsx(Icon, {
+		asChild: true,
+		ref,
+		...props,
+		children: /* @__PURE__ */ jsxs("svg", {
+			width: "24",
+			height: "24",
+			viewBox: "0 0 24 24",
+			fill: "currentColor",
+			children: [
+				/* @__PURE__ */ jsx("circle", {
+					cx: "9",
+					cy: "6",
+					r: "1.5"
+				}),
+				/* @__PURE__ */ jsx("circle", {
+					cx: "15",
+					cy: "6",
+					r: "1.5"
+				}),
+				/* @__PURE__ */ jsx("circle", {
+					cx: "9",
+					cy: "12",
+					r: "1.5"
+				}),
+				/* @__PURE__ */ jsx("circle", {
+					cx: "15",
+					cy: "12",
+					r: "1.5"
+				}),
+				/* @__PURE__ */ jsx("circle", {
+					cx: "9",
+					cy: "18",
+					r: "1.5"
+				}),
+				/* @__PURE__ */ jsx("circle", {
+					cx: "15",
+					cy: "18",
+					r: "1.5"
+				})
+			]
+		})
+	});
+});
+IconDragHandle.displayName = "IconDragHandle";
+//#endregion
+export { IconDragHandle as default };
+
+//# sourceMappingURL=IconDragHandle.js.map

package/dist/icons/IconDragHandle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconDragHandle.js","names":[],"sources":["../../lib/icons/IconDragHandle.tsx"],"sourcesContent":["// @generate:skip\n// This file is manually maintained — the drag handle icon has no Figma source.\n\nimport { Icon, type IconProps } from '@chakra-ui/react/icon';\nimport { type Ref } from 'react';\n\nimport { bitkitIcon } from './bitkitIcon';\n\nexport interface IconDragHandleProps extends IconProps {\n  size?: '16' | '24';\n}\n\nconst IconDragHandle = bitkitIcon(function IconDragHandle(\n  { size = '24', ...props }: IconDragHandleProps,\n  ref: Ref<SVGSVGElement>,\n) {\n  if (size === '16') {\n    return (\n      <Icon asChild ref={ref} {...props}>\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"currentColor\">\n          <circle cx=\"6\" cy=\"4\" r=\"1\" />\n          <circle cx=\"10\" cy=\"4\" r=\"1\" />\n          <circle cx=\"6\" cy=\"8\" r=\"1\" />\n          <circle cx=\"10\" cy=\"8\" r=\"1\" />\n          <circle cx=\"6\" cy=\"12\" r=\"1\" />\n          <circle cx=\"10\" cy=\"12\" r=\"1\" />\n        </svg>\n      </Icon>\n    );\n  }\n\n  return (\n    <Icon asChild ref={ref} {...props}>\n      <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n        <circle cx=\"9\" cy=\"6\" r=\"1.5\" />\n        <circle cx=\"15\" cy=\"6\" r=\"1.5\" />\n        <circle cx=\"9\" cy=\"12\" r=\"1.5\" />\n        <circle cx=\"15\" cy=\"12\" r=\"1.5\" />\n        <circle cx=\"9\" cy=\"18\" r=\"1.5\" />\n        <circle cx=\"15\" cy=\"18\" r=\"1.5\" />\n      </svg>\n    </Icon>\n  );\n});\n\nIconDragHandle.displayName = 'IconDragHandle';\n\nexport default IconDragHandle;\n"],"mappings":";;;;AAYA,IAAM,iBAAiB,WAAW,SAAS,eACzC,EAAE,OAAO,MAAM,GAAG,SAClB,KACA;AACA,KAAI,SAAS,KACX,QACE,oBAAC,MAAD;EAAM,SAAA;EAAa;EAAK,GAAI;YAC1B,qBAAC,OAAD;GAAK,OAAM;GAAK,QAAO;GAAK,SAAQ;GAAY,MAAK;aAArD;IACE,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAI,GAAE;KAAM,CAAA;IAC9B,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAI,GAAE;KAAM,CAAA;IAC/B,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAI,GAAE;KAAM,CAAA;IAC9B,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAI,GAAE;KAAM,CAAA;IAC/B,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAK,GAAE;KAAM,CAAA;IAC/B,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAK,GAAE;KAAM,CAAA;IAC5B;;EACD,CAAA;AAIX,QACE,oBAAC,MAAD;EAAM,SAAA;EAAa;EAAK,GAAI;YAC1B,qBAAC,OAAD;GAAK,OAAM;GAAK,QAAO;GAAK,SAAQ;GAAY,MAAK;aAArD;IACE,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAI,GAAE;KAAQ,CAAA;IAChC,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAI,GAAE;KAAQ,CAAA;IACjC,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAK,GAAE;KAAQ,CAAA;IACjC,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAK,GAAE;KAAQ,CAAA;IAClC,oBAAC,UAAD;KAAQ,IAAG;KAAI,IAAG;KAAK,GAAE;KAAQ,CAAA;IACjC,oBAAC,UAAD;KAAQ,IAAG;KAAK,IAAG;KAAK,GAAE;KAAQ,CAAA;IAC9B;;EACD,CAAA;EAET;AAEF,eAAe,cAAc"}

package/dist/icons/index.d.ts

@@ -118,6 +118,7 @@ export { default as IconDotnetText, type IconDotnetTextProps } from './IconDotne
 export { default as IconDotnetTextColor, type IconDotnetTextColorProps } from './IconDotnetTextColor';
 export { default as IconDoubleCircle, type IconDoubleCircleProps } from './IconDoubleCircle';
 export { default as IconDownload, type IconDownloadProps } from './IconDownload';
+export { default as IconDragHandle, type IconDragHandleProps } from './IconDragHandle';
 export { default as IconEc2Ami, type IconEc2AmiProps } from './IconEc2Ami';
 export { default as IconEnterprise, type IconEnterpriseProps } from './IconEnterprise';
 export { default as IconErrorCircle, type IconErrorCircleProps } from './IconErrorCircle';

package/dist/main.js

@@ -103,6 +103,7 @@ import IconDotnetText from "./icons/IconDotnetText.js";
 import IconDotnetTextColor from "./icons/IconDotnetTextColor.js";
 import IconDoubleCircle from "./icons/IconDoubleCircle.js";
 import IconDownload from "./icons/IconDownload.js";
+import IconDragHandle from "./icons/IconDragHandle.js";
 import IconEc2Ami from "./icons/IconEc2Ami.js";
 import IconEnterprise from "./icons/IconEnterprise.js";
 import IconErrorCircle from "./icons/IconErrorCircle.js";
@@ -303,6 +304,7 @@ import BitkitDialogBody from "./components/BitkitDialog/BitkitDialogBody.js";
 import BitkitDialogContent from "./components/BitkitDialog/BitkitDialogContent.js";
 import BitkitDialogRoot from "./components/BitkitDialog/BitkitDialogRoot.js";
 import BitkitDialog from "./components/BitkitDialog/BitkitDialog.js";
+import BitkitDraggableCard from "./components/BitkitDraggableCard/BitkitDraggableCard.js";
 import BitkitEmptyState from "./components/BitkitEmptyState/BitkitEmptyState.js";
 import BitkitExpandableCard from "./components/BitkitExpandableCard/BitkitExpandableCard.js";
 import BitkitExplainerList_default from "./components/BitkitExplainerList/BitkitExplainerList.js";
@@ -341,4 +343,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, BitkitDialogContent, BitkitDialogRoot, 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, BitkitPaginationLoadMore, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect, BitkitSelectMenu, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, 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, 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, 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, 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, BitkitPaginationLoadMore, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect, BitkitSelectMenu, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, 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, 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/DraggableCard.recipe.d.ts

@@ -0,0 +1,83 @@
+declare const draggableCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "handle", {
+    isDragging: {
+        true: {
+            root: {
+                borderColor: "border/strong";
+                boxShadow: "elevation/lg";
+                cursor: "grabbing";
+            };
+            handle: {
+                color: "icon/secondary";
+            };
+        };
+    };
+    isDropTarget: {
+        true: {
+            root: {
+                background: "background/secondary";
+                borderColor: "border/strong";
+                borderStyle: "dashed";
+                boxShadow: "none";
+            };
+            handle: {
+                visibility: "hidden";
+            };
+            content: {
+                visibility: "hidden";
+            };
+        };
+    };
+    isFullCardDrag: {
+        true: {
+            root: {
+                cursor: "grab";
+                _hover: {
+                    borderColor: "border/regular";
+                    _active: {
+                        borderColor: "border/strong";
+                    };
+                };
+                _active: {
+                    borderColor: "border/strong";
+                };
+            };
+            handle: {
+                pointerEvents: "none";
+            };
+            content: {
+                paddingInlineStart: number;
+            };
+        };
+        false: {
+            root: {
+                _hover: {
+                    borderColor: "border/regular";
+                };
+            };
+            handle: {
+                appearance: "none";
+                background: "transparent";
+                border: "none";
+                cursor: "grab";
+                focusVisibleRing: "none";
+                _focusVisible: {
+                    boxShadow: "inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)";
+                };
+                _hover: {
+                    background: "background/hover";
+                    color: "icon/secondary";
+                    _active: {
+                        background: "background/active";
+                    };
+                };
+                _active: {
+                    background: "background/active";
+                };
+            };
+            content: {
+                paddingInlineStart: "8";
+            };
+        };
+    };
+}>;
+export default draggableCardSlotRecipe;

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

@@ -0,0 +1,133 @@
+import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
+//#region lib/theme/slot-recipes/DraggableCard.recipe.ts
+var draggableCardSlotRecipe = defineSlotRecipe({
+	className: "draggable-card",
+	slots: [
+		"root",
+		"handle",
+		"content"
+	],
+	base: {
+		root: {
+			alignItems: "stretch",
+			backgroundColor: "background/primary",
+			border: "1px solid",
+			borderColor: "border/minimal",
+			borderRadius: "8",
+			boxShadow: "elevation/sm",
+			display: "flex",
+			overflow: "hidden"
+		},
+		handle: {
+			alignItems: "center",
+			color: "icon/tertiary",
+			display: "flex",
+			flexShrink: 0,
+			justifyContent: "center",
+			width: "24"
+		},
+		content: {
+			flex: 1,
+			minWidth: 0,
+			overflow: "hidden",
+			paddingBlock: "16",
+			paddingInlineEnd: "16"
+		}
+	},
+	variants: {
+		isDragging: { true: {
+			root: {
+				borderColor: "border/strong",
+				boxShadow: "elevation/lg",
+				cursor: "grabbing"
+			},
+			handle: { color: "icon/secondary" }
+		} },
+		isDropTarget: { true: {
+			root: {
+				background: "background/secondary",
+				borderColor: "border/strong",
+				borderStyle: "dashed",
+				boxShadow: "none"
+			},
+			handle: { visibility: "hidden" },
+			content: { visibility: "hidden" }
+		} },
+		isFullCardDrag: {
+			true: {
+				root: {
+					cursor: "grab",
+					_hover: {
+						borderColor: "border/regular",
+						_active: { borderColor: "border/strong" }
+					},
+					_active: { borderColor: "border/strong" }
+				},
+				handle: { pointerEvents: "none" },
+				content: { paddingInlineStart: 0 }
+			},
+			false: {
+				root: { _hover: { borderColor: "border/regular" } },
+				handle: {
+					appearance: "none",
+					background: "transparent",
+					border: "none",
+					cursor: "grab",
+					focusVisibleRing: "none",
+					_focusVisible: { boxShadow: "inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)" },
+					_hover: {
+						background: "background/hover",
+						color: "icon/secondary",
+						_active: { background: "background/active" }
+					},
+					_active: { background: "background/active" }
+				},
+				content: { paddingInlineStart: "8" }
+			}
+		}
+	},
+	compoundVariants: [
+		{
+			isDragging: true,
+			isFullCardDrag: true,
+			css: { root: {
+				cursor: "grabbing",
+				_hover: { borderColor: "border/strong" }
+			} }
+		},
+		{
+			isDragging: true,
+			isFullCardDrag: false,
+			css: {
+				root: { _hover: { borderColor: "border/strong" } },
+				handle: {
+					background: "background/active",
+					cursor: "grabbing",
+					_hover: { background: "background/active" }
+				}
+			}
+		},
+		{
+			isDropTarget: true,
+			isFullCardDrag: true,
+			css: { root: {
+				cursor: "default",
+				_hover: { borderColor: "border/strong" }
+			} }
+		},
+		{
+			isDropTarget: true,
+			isFullCardDrag: false,
+			css: { root: { _hover: { borderColor: "border/strong" } } }
+		}
+	],
+	defaultVariants: {
+		isDragging: false,
+		isDropTarget: false,
+		isFullCardDrag: true
+	}
+});
+//#endregion
+export { draggableCardSlotRecipe as default };
+
+//# sourceMappingURL=DraggableCard.recipe.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DraggableCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/DraggableCard.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst draggableCardSlotRecipe = defineSlotRecipe({\n  className: 'draggable-card',\n  slots: ['root', 'handle', 'content'],\n  base: {\n    root: {\n      alignItems: 'stretch',\n      backgroundColor: 'background/primary',\n      border: '1px solid',\n      borderColor: 'border/minimal',\n      borderRadius: '8',\n      boxShadow: 'elevation/sm',\n      display: 'flex',\n      overflow: 'hidden',\n    },\n    handle: {\n      alignItems: 'center',\n      color: 'icon/tertiary',\n      display: 'flex',\n      flexShrink: 0,\n      justifyContent: 'center',\n      width: '24',\n    },\n    content: {\n      flex: 1,\n      minWidth: 0,\n      overflow: 'hidden',\n      paddingBlock: '16',\n      paddingInlineEnd: '16',\n    },\n  },\n  variants: {\n    isDragging: {\n      true: {\n        root: {\n          borderColor: 'border/strong',\n          boxShadow: 'elevation/lg',\n          cursor: 'grabbing',\n        },\n        handle: {\n          color: 'icon/secondary',\n        },\n      },\n    },\n    isDropTarget: {\n      true: {\n        root: {\n          background: 'background/secondary',\n          borderColor: 'border/strong',\n          borderStyle: 'dashed',\n          boxShadow: 'none',\n        },\n        handle: {\n          visibility: 'hidden',\n        },\n        content: {\n          visibility: 'hidden',\n        },\n      },\n    },\n    isFullCardDrag: {\n      true: {\n        root: {\n          cursor: 'grab',\n          _hover: {\n            borderColor: 'border/regular',\n            _active: {\n              borderColor: 'border/strong',\n            },\n          },\n          _active: {\n            borderColor: 'border/strong',\n          },\n        },\n        handle: {\n          pointerEvents: 'none',\n        },\n        content: {\n          paddingInlineStart: 0,\n        },\n      },\n      false: {\n        root: {\n          _hover: {\n            borderColor: 'border/regular',\n          },\n        },\n        handle: {\n          appearance: 'none',\n          background: 'transparent',\n          border: 'none',\n          cursor: 'grab',\n          focusVisibleRing: 'none',\n          _focusVisible: {\n            boxShadow: 'inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)',\n          },\n          _hover: {\n            background: 'background/hover',\n            color: 'icon/secondary',\n            _active: {\n              background: 'background/active',\n            },\n          },\n          _active: {\n            background: 'background/active',\n          },\n        },\n        content: {\n          paddingInlineStart: '8',\n        },\n      },\n    },\n  },\n  compoundVariants: [\n    {\n      isDragging: true,\n      isFullCardDrag: true,\n      css: {\n        root: {\n          cursor: 'grabbing',\n          _hover: {\n            borderColor: 'border/strong',\n          },\n        },\n      },\n    },\n    {\n      isDragging: true,\n      isFullCardDrag: false,\n      css: {\n        root: {\n          _hover: {\n            borderColor: 'border/strong',\n          },\n        },\n        handle: {\n          background: 'background/active',\n          cursor: 'grabbing',\n          _hover: {\n            background: 'background/active',\n          },\n        },\n      },\n    },\n    {\n      isDropTarget: true,\n      isFullCardDrag: true,\n      css: {\n        root: {\n          cursor: 'default',\n          _hover: {\n            borderColor: 'border/strong',\n          },\n        },\n      },\n    },\n    {\n      isDropTarget: true,\n      isFullCardDrag: false,\n      css: {\n        root: {\n          _hover: {\n            borderColor: 'border/strong',\n          },\n        },\n      },\n    },\n  ],\n  defaultVariants: {\n    isDragging: false,\n    isDropTarget: false,\n    isFullCardDrag: true,\n  },\n});\n\nexport default draggableCardSlotRecipe;\n"],"mappings":";;AAEA,IAAM,0BAA0B,iBAAiB;CAC/C,WAAW;CACX,OAAO;EAAC;EAAQ;EAAU;EAAU;CACpC,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,iBAAiB;GACjB,QAAQ;GACR,aAAa;GACb,cAAc;GACd,WAAW;GACX,SAAS;GACT,UAAU;GACX;EACD,QAAQ;GACN,YAAY;GACZ,OAAO;GACP,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,OAAO;GACR;EACD,SAAS;GACP,MAAM;GACN,UAAU;GACV,UAAU;GACV,cAAc;GACd,kBAAkB;GACnB;EACF;CACD,UAAU;EACR,YAAY,EACV,MAAM;GACJ,MAAM;IACJ,aAAa;IACb,WAAW;IACX,QAAQ;IACT;GACD,QAAQ,EACN,OAAO,kBACR;GACF,EACF;EACD,cAAc,EACZ,MAAM;GACJ,MAAM;IACJ,YAAY;IACZ,aAAa;IACb,aAAa;IACb,WAAW;IACZ;GACD,QAAQ,EACN,YAAY,UACb;GACD,SAAS,EACP,YAAY,UACb;GACF,EACF;EACD,gBAAgB;GACd,MAAM;IACJ,MAAM;KACJ,QAAQ;KACR,QAAQ;MACN,aAAa;MACb,SAAS,EACP,aAAa,iBACd;MACF;KACD,SAAS,EACP,aAAa,iBACd;KACF;IACD,QAAQ,EACN,eAAe,QAChB;IACD,SAAS,EACP,oBAAoB,GACrB;IACF;GACD,OAAO;IACL,MAAM,EACJ,QAAQ,EACN,aAAa,kBACd,EACF;IACD,QAAQ;KACN,YAAY;KACZ,YAAY;KACZ,QAAQ;KACR,QAAQ;KACR,kBAAkB;KAClB,eAAe,EACb,WAAW,+DACZ;KACD,QAAQ;MACN,YAAY;MACZ,OAAO;MACP,SAAS,EACP,YAAY,qBACb;MACF;KACD,SAAS,EACP,YAAY,qBACb;KACF;IACD,SAAS,EACP,oBAAoB,KACrB;IACF;GACF;EACF;CACD,kBAAkB;EAChB;GACE,YAAY;GACZ,gBAAgB;GAChB,KAAK,EACH,MAAM;IACJ,QAAQ;IACR,QAAQ,EACN,aAAa,iBACd;IACF,EACF;GACF;EACD;GACE,YAAY;GACZ,gBAAgB;GAChB,KAAK;IACH,MAAM,EACJ,QAAQ,EACN,aAAa,iBACd,EACF;IACD,QAAQ;KACN,YAAY;KACZ,QAAQ;KACR,QAAQ,EACN,YAAY,qBACb;KACF;IACF;GACF;EACD;GACE,cAAc;GACd,gBAAgB;GAChB,KAAK,EACH,MAAM;IACJ,QAAQ;IACR,QAAQ,EACN,aAAa,iBACd;IACF,EACF;GACF;EACD;GACE,cAAc;GACd,gBAAgB;GAChB,KAAK,EACH,MAAM,EACJ,QAAQ,EACN,aAAa,iBACd,EACF,EACF;GACF;EACF;CACD,iBAAiB;EACf,YAAY;EACZ,cAAc;EACd,gBAAgB;EACjB;CACF,CAAC"}

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

@@ -1,2 +1,2 @@
-declare const imageCropperSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "image" | "root" | "viewport" | "selection" | "handle", import('@chakra-ui/react').SlotRecipeVariantRecord<"grid" | "image" | "root" | "viewport" | "selection" | "handle">>;
+declare const imageCropperSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "image" | "root" | "handle" | "viewport" | "selection", import('@chakra-ui/react').SlotRecipeVariantRecord<"grid" | "image" | "root" | "handle" | "viewport" | "selection">>;
 export default imageCropperSlotRecipe;

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

@@ -541,6 +541,88 @@ declare const slotRecipes: {
             };
         };
     }>;
+    draggableCard: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "handle", {
+        isDragging: {
+            true: {
+                root: {
+                    borderColor: "border/strong";
+                    boxShadow: "elevation/lg";
+                    cursor: "grabbing";
+                };
+                handle: {
+                    color: "icon/secondary";
+                };
+            };
+        };
+        isDropTarget: {
+            true: {
+                root: {
+                    background: "background/secondary";
+                    borderColor: "border/strong";
+                    borderStyle: "dashed";
+                    boxShadow: "none";
+                };
+                handle: {
+                    visibility: "hidden";
+                };
+                content: {
+                    visibility: "hidden";
+                };
+            };
+        };
+        isFullCardDrag: {
+            true: {
+                root: {
+                    cursor: "grab";
+                    _hover: {
+                        borderColor: "border/regular";
+                        _active: {
+                            borderColor: "border/strong";
+                        };
+                    };
+                    _active: {
+                        borderColor: "border/strong";
+                    };
+                };
+                handle: {
+                    pointerEvents: "none";
+                };
+                content: {
+                    paddingInlineStart: number;
+                };
+            };
+            false: {
+                root: {
+                    _hover: {
+                        borderColor: "border/regular";
+                    };
+                };
+                handle: {
+                    appearance: "none";
+                    background: "transparent";
+                    border: "none";
+                    cursor: "grab";
+                    focusVisibleRing: "none";
+                    _focusVisible: {
+                        boxShadow: "inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)";
+                    };
+                    _hover: {
+                        background: "background/hover";
+                        color: "icon/secondary";
+                        _active: {
+                            background: "background/active";
+                        };
+                    };
+                    _active: {
+                        background: "background/active";
+                    };
+                };
+                content: {
+                    paddingInlineStart: "8";
+                };
+            };
+        };
+    }>;
     emptyState: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "description" | "indicator", {
         colorScheme: {
             white: {
@@ -590,7 +672,7 @@ declare const slotRecipes: {
             };
         };
     }>;
-    imageCropper: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "image" | "root" | "viewport" | "selection" | "handle", import('@chakra-ui/react').SlotRecipeVariantRecord<"grid" | "image" | "root" | "viewport" | "selection" | "handle">>;
+    imageCropper: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "image" | "root" | "handle" | "viewport" | "selection", import('@chakra-ui/react').SlotRecipeVariantRecord<"grid" | "image" | "root" | "handle" | "viewport" | "selection">>;
     inlineLoading: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root", {
         size: {
             sm: {

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

@@ -13,6 +13,7 @@ import datePickerSlotRecipe from "./DatePicker.recipe.js";
 import { selectSlotRecipe } from "./Select.recipe.js";
 import datePickerSelectSlotRecipe from "./DatePickerSelect.recipe.js";
 import dialogSlotRecipe from "./Dialog.recipe.js";
+import draggableCardSlotRecipe from "./DraggableCard.recipe.js";
 import emptyStateSlotRecipe from "./EmptyState.recipe.js";
 import expandableCardSlotRecipe from "./ExpandableCard.recipe.js";
 import fieldSlotRecipe from "./Field.recipe.js";
@@ -57,6 +58,7 @@ var slotRecipes = {
 	datePicker: datePickerSlotRecipe,
 	datePickerSelect: datePickerSelectSlotRecipe,
 	dialog: dialogSlotRecipe,
+	draggableCard: draggableCardSlotRecipe,
 	emptyState: emptyStateSlotRecipe,
 	expandableCard: expandableCardSlotRecipe,
 	field: fieldSlotRecipe,

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 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 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 splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport statSlotRecipe from './Stat.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  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  paginationLoadMore: paginationLoadMoreSlotRecipe,\n  radioGroup: radioGroupSlotRecipe,\n  ribbon: ribbonSlotRecipe,\n  sectionHeading: sectionHeadingSlotRecipe,\n  labeledData: labeledDataSlotRecipe,\n  segmentGroup: segmentGroupSlotRecipe,\n  select: selectSlotRecipe,\n  splitButton: splitButtonSlotRecipe,\n  stat: statSlotRecipe,\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6CA,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,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,oBAAoB;CACpB,YAAY;CACZ,QAAQ;CACR,gBAAgB;CAChB,aAAa;CACb,cAAc;CACd,QAAQ;CACR,aAAa;CACb,MAAM;CACN,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 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 splitButtonSlotRecipe from './SplitButton.recipe.ts';\nimport statSlotRecipe from './Stat.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  paginationLoadMore: paginationLoadMoreSlotRecipe,\n  radioGroup: radioGroupSlotRecipe,\n  ribbon: ribbonSlotRecipe,\n  sectionHeading: sectionHeadingSlotRecipe,\n  labeledData: labeledDataSlotRecipe,\n  segmentGroup: segmentGroupSlotRecipe,\n  select: selectSlotRecipe,\n  splitButton: splitButtonSlotRecipe,\n  stat: statSlotRecipe,\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA,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,oBAAoB;CACpB,YAAY;CACZ,QAAQ;CACR,gBAAgB;CAChB,aAAa;CACb,cAAc;CACd,QAAQ;CACR,aAAa;CACb,MAAM;CACN,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.187",
+  "version": "0.3.188",
   "description": "Bitrise Design System Components built with Chakra UI V3",
   "keywords": [
     "react",
@@ -61,7 +61,7 @@
     "@figma-export/transform-svg-with-svgo": "^6.4.0",
     "@google-cloud/storage": "^7.19.0",
     "@storybook/addon-docs": "10.3.5",
-    "@storybook/addon-mcp": "^0.5.0",
+    "@storybook/addon-mcp": "^0.6.0",
     "@storybook/react-vite": "10.3.5",
     "@svgr/plugin-jsx": "^8.1.0",
     "@types/node": "^25.6.0",