@wix/patterns 1.228.0 → 1.229.0

package/dist/cjs/components/Kanban/CardActions.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_mobxReactLite","_designSystem","_useCardActions","_ActionModal","_jsxFileName","_CardActions","actionCell","originalItem","itemIndex","itemActionsState","stageKey","item","secondaryActions","primaryActionProps","useCardActions","cardKey","key","default","createElement","Fragment","confirmModal","value","MessageActionModal","_extends2","state","__self","__source","fileName","lineNumber","columnNumber","Box","gap","Button","style","zIndex","size","priority","onClick","e","stopPropagation","disabled","prefixIcon","dataHook","text","CardActions","exports","observer"],"sources":["../../../../src/components/Kanban/CardActions.tsx"],"sourcesContent":["import React from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { FiltersMap, stringFilter } from '@wix/bex-core';\nimport { Box, Button } from '@wix/design-system';\nimport { useCardActions } from './useCardActions';\nimport { KanbanCardProps } from './Card';\nimport { MessageActionModal } from '../ActionModal';\n\ntype CardActionsProps<\n  T,\n  S,\n  F extends FiltersMap & { stageId: ReturnType<typeof stringFilter> },\n> = Pick<\n  KanbanCardProps<T, S, F>,\n  | 'actionCell'\n  | 'originalItem'\n  | 'itemIndex'\n  | 'itemActionsState'\n  | 'stageKey'\n  | 'item'\n>;\n\nfunction _CardActions<\n  T,\n  S,\n  F extends FiltersMap & { stageId: ReturnType<typeof stringFilter> },\n>({\n  actionCell,\n  originalItem,\n  itemIndex,\n  itemActionsState,\n  stageKey,\n  item,\n}: CardActionsProps<T, S, F>) {\n  const { secondaryActions, primaryActionProps } = useCardActions({\n    actionCell,\n    originalItem,\n    itemIndex,\n    itemActionsState,\n    stageKey,\n    cardKey: item.key,\n  });\n\n  return (\n    <>\n      {/* Render modals from ItemActionsState */}\n      {itemActionsState.confirmModal.value && (\n        <MessageActionModal\n          state={itemActionsState.confirmModal}\n          {...itemActionsState.confirmModal.value}\n        />\n      )}\n      <Box gap=\"SP2\">\n        {secondaryActions}\n        {primaryActionProps && (\n          <Button\n            style={{ zIndex: 50 }}\n            size=\"tiny\"\n            priority=\"secondary\"\n            onClick={(e) => {\n              e.stopPropagation();\n              primaryActionProps.onClick();\n            }}\n            disabled={primaryActionProps.disabled}\n            prefixIcon={primaryActionProps.prefixIcon}\n            dataHook={`kanban-card-primary-action-${stageKey}-${item.key}`}\n          >\n            {primaryActionProps.text}\n          </Button>\n        )}\n      </Box>\n    </>\n  );\n}\n\nexport const CardActions = observer(_CardActions);\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,cAAA,GAAAD,OAAA;AAEA,IAAAE,aAAA,GAAAF,OAAA;AACA,IAAAG,eAAA,GAAAH,OAAA;AAEA,IAAAI,YAAA,GAAAJ,OAAA;AAAoD,IAAAK,YAAA;AAgBpD,SAASC,YAAYA,CAInB;EACAC,UAAU;EACVC,YAAY;EACZC,SAAS;EACTC,gBAAgB;EAChBC,QAAQ;EACRC;AACyB,CAAC,EAAE;EAC5B,MAAM;IAAEC,gBAAgB;IAAEC;EAAmB,CAAC,GAAG,IAAAC,8BAAc,EAAC;IAC9DR,UAAU;IACVC,YAAY;IACZC,SAAS;IACTC,gBAAgB;IAChBC,QAAQ;IACRK,OAAO,EAAEJ,IAAI,CAACK;EAChB,CAAC,CAAC;EAEF,oBACEnB,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAAArB,MAAA,CAAAoB,OAAA,CAAAE,QAAA,QAEGV,gBAAgB,CAACW,YAAY,CAACC,KAAK,iBAClCxB,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAACf,YAAA,CAAAmB,kBAAkB,MAAAC,SAAA,CAAAN,OAAA;IACjBO,KAAK,EAAEf,gBAAgB,CAACW;EAAa,GACjCX,gBAAgB,CAACW,YAAY,CAACC,KAAK;IAAAI,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAvB,YAAA;MAAAwB,UAAA;MAAAC,YAAA;IAAA;EAAA,EACxC,CACF,eACDhC,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAACjB,aAAA,CAAA6B,GAAG;IAACC,GAAG,EAAC,KAAK;IAAAN,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAvB,YAAA;MAAAwB,UAAA;MAAAC,YAAA;IAAA;EAAA,GACXjB,gBAAgB,EAChBC,kBAAkB,iBACjBhB,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAACjB,aAAA,CAAA+B,MAAM;IACLC,KAAK,EAAE;MAAEC,MAAM,EAAE;IAAG,CAAE;IACtBC,IAAI,EAAC,MAAM;IACXC,QAAQ,EAAC,WAAW;IACpBC,OAAO,EAAGC,CAAC,IAAK;MACdA,CAAC,CAACC,eAAe,CAAC,CAAC;MACnB1B,kBAAkB,CAACwB,OAAO,CAAC,CAAC;IAC9B,CAAE;IACFG,QAAQ,EAAE3B,kBAAkB,CAAC2B,QAAS;IACtCC,UAAU,EAAE5B,kBAAkB,CAAC4B,UAAW;IAC1CC,QAAQ,EAAE,8BAA8BhC,QAAQ,IAAIC,IAAI,CAACK,GAAG,EAAG;IAAAS,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAvB,YAAA;MAAAwB,UAAA;MAAAC,YAAA;IAAA;EAAA,GAE9DhB,kBAAkB,CAAC8B,IACd,CAEP,CACL,CAAC;AAEP;AAEO,MAAMC,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAG,IAAAE,uBAAQ,EAACzC,YAAY,CAAC","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_mobxReactLite","_designSystem","_useCardActions","_ActionModal","_jsxFileName","_CardActions","actionCell","originalItem","itemIndex","itemActionsState","stageKey","item","secondaryActions","primaryActionProps","useCardActions","cardKey","key","default","createElement","Fragment","confirmModal","value","MessageActionModal","_extends2","state","__self","__source","fileName","lineNumber","columnNumber","Box","gap","Button","style","zIndex","size","priority","onClick","e","stopPropagation","disabled","prefixIcon","dataHook","text","CardActions","exports","observer"],"sources":["../../../../src/components/Kanban/CardActions.tsx"],"sourcesContent":["import React from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { FiltersMap } from '@wix/bex-core';\nimport { Box, Button } from '@wix/design-system';\nimport { useCardActions } from './useCardActions';\nimport { KanbanCardProps } from './Card';\nimport { MessageActionModal } from '../ActionModal';\n\ntype CardActionsProps<T, S, F extends FiltersMap> = Pick<\n  KanbanCardProps<T, S, F>,\n  | 'actionCell'\n  | 'originalItem'\n  | 'itemIndex'\n  | 'itemActionsState'\n  | 'stageKey'\n  | 'item'\n>;\n\nfunction _CardActions<T, S, F extends FiltersMap>({\n  actionCell,\n  originalItem,\n  itemIndex,\n  itemActionsState,\n  stageKey,\n  item,\n}: CardActionsProps<T, S, F>) {\n  const { secondaryActions, primaryActionProps } = useCardActions({\n    actionCell,\n    originalItem,\n    itemIndex,\n    itemActionsState,\n    stageKey,\n    cardKey: item.key,\n  });\n\n  return (\n    <>\n      {/* Render modals from ItemActionsState */}\n      {itemActionsState.confirmModal.value && (\n        <MessageActionModal\n          state={itemActionsState.confirmModal}\n          {...itemActionsState.confirmModal.value}\n        />\n      )}\n      <Box gap=\"9px\">\n        {secondaryActions}\n        {primaryActionProps && (\n          <Button\n            style={{ zIndex: 50 }}\n            size=\"tiny\"\n            priority=\"secondary\"\n            onClick={(e) => {\n              e.stopPropagation();\n              primaryActionProps.onClick();\n            }}\n            disabled={primaryActionProps.disabled}\n            prefixIcon={primaryActionProps.prefixIcon}\n            dataHook={`kanban-card-primary-action-${stageKey}-${item.key}`}\n          >\n            {primaryActionProps.text}\n          </Button>\n        )}\n      </Box>\n    </>\n  );\n}\n\nexport const CardActions = observer(_CardActions);\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,cAAA,GAAAD,OAAA;AAEA,IAAAE,aAAA,GAAAF,OAAA;AACA,IAAAG,eAAA,GAAAH,OAAA;AAEA,IAAAI,YAAA,GAAAJ,OAAA;AAAoD,IAAAK,YAAA;AAYpD,SAASC,YAAYA,CAA6B;EAChDC,UAAU;EACVC,YAAY;EACZC,SAAS;EACTC,gBAAgB;EAChBC,QAAQ;EACRC;AACyB,CAAC,EAAE;EAC5B,MAAM;IAAEC,gBAAgB;IAAEC;EAAmB,CAAC,GAAG,IAAAC,8BAAc,EAAC;IAC9DR,UAAU;IACVC,YAAY;IACZC,SAAS;IACTC,gBAAgB;IAChBC,QAAQ;IACRK,OAAO,EAAEJ,IAAI,CAACK;EAChB,CAAC,CAAC;EAEF,oBACEnB,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAAArB,MAAA,CAAAoB,OAAA,CAAAE,QAAA,QAEGV,gBAAgB,CAACW,YAAY,CAACC,KAAK,iBAClCxB,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAACf,YAAA,CAAAmB,kBAAkB,MAAAC,SAAA,CAAAN,OAAA;IACjBO,KAAK,EAAEf,gBAAgB,CAACW;EAAa,GACjCX,gBAAgB,CAACW,YAAY,CAACC,KAAK;IAAAI,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAvB,YAAA;MAAAwB,UAAA;MAAAC,YAAA;IAAA;EAAA,EACxC,CACF,eACDhC,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAACjB,aAAA,CAAA6B,GAAG;IAACC,GAAG,EAAC,KAAK;IAAAN,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAvB,YAAA;MAAAwB,UAAA;MAAAC,YAAA;IAAA;EAAA,GACXjB,gBAAgB,EAChBC,kBAAkB,iBACjBhB,MAAA,CAAAoB,OAAA,CAAAC,aAAA,CAACjB,aAAA,CAAA+B,MAAM;IACLC,KAAK,EAAE;MAAEC,MAAM,EAAE;IAAG,CAAE;IACtBC,IAAI,EAAC,MAAM;IACXC,QAAQ,EAAC,WAAW;IACpBC,OAAO,EAAGC,CAAC,IAAK;MACdA,CAAC,CAACC,eAAe,CAAC,CAAC;MACnB1B,kBAAkB,CAACwB,OAAO,CAAC,CAAC;IAC9B,CAAE;IACFG,QAAQ,EAAE3B,kBAAkB,CAAC2B,QAAS;IACtCC,UAAU,EAAE5B,kBAAkB,CAAC4B,UAAW;IAC1CC,QAAQ,EAAE,8BAA8BhC,QAAQ,IAAIC,IAAI,CAACK,GAAG,EAAG;IAAAS,MAAA;IAAAC,QAAA;MAAAC,QAAA,EAAAvB,YAAA;MAAAwB,UAAA;MAAAC,YAAA;IAAA;EAAA,GAE9DhB,kBAAkB,CAAC8B,IACd,CAEP,CACL,CAAC;AAEP;AAEO,MAAMC,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAG,IAAAE,uBAAQ,EAACzC,YAAY,CAAC","ignoreList":[]}

package/dist/cjs/components/Kanban/Kanban.js

@@ -10,10 +10,9 @@ var _mobxReactLite = require("mobx-react-lite");
 var _Stage = require("./Stage");
 var _designSystem = require("@wix/design-system");
 var _CollectionCard = require("../CollectionCard");
+var _KanbanCardDragAndDrop = require("../KanbanDragAndDropDndKit/KanbanCardDragAndDrop");
 var _jsxFileName = "/home/builduser/work/db7ea24852bc3350/packages/cairo/dist/cjs/components/Kanban/Kanban.tsx";
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-// import { CollectionCard } from '../CollectionCard';
-
 function _Kanban(props) {
   const {
     state,
@@ -22,19 +21,52 @@ function _Kanban(props) {
   const {
     toolbar
   } = state;
-
-  // if (process.env.NODE_ENV !== 'production') {
-  //   minimalRequiredWdsRuntimeCheck({
-  //     required: '^1.64.1',
-  //     requiredBy: 'WixPatterns/Kanban',
-  //   });
-  // }
   (0, _react.useEffect)(() => {
     props.state.init();
   }, [props.state]);
   const stages = (0, _react.useMemo)(() => {
-    return props.state.stages();
-  }, [props.state.stages()]);
+    return props.state.stages;
+  }, [props.state.stages]);
+
+  // Calculate active stage key from activeId
+  const activeId = state.dragAndDropState.activeId;
+  const activeStageKey = activeId ? activeId.substring(0, activeId.indexOf('-##-')) || null : null;
+
+  // Wrap with global drag and drop context - always enabled for Kanban
+  const {
+    KanbanDragAndDropContext
+  } = _KanbanCardDragAndDrop.KanbanCardDragAndDrop;
+  const stagesContent = /*#__PURE__*/_react.default.createElement(KanbanDragAndDropContext, {
+    state: state,
+    stageId: "all",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 37,
+      columnNumber: 5
+    }
+  }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
+    direction: "horizontal",
+    gap: "12px",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 38,
+      columnNumber: 7
+    }
+  }, stages.map(stage => /*#__PURE__*/_react.default.createElement(_Stage.StageComponent, (0, _extends2.default)({
+    dataHook: `kanban-stage-${props.state.stageKey(stage)}`,
+    key: props.state.stageKey(stage),
+    activeStageKey: activeStageKey,
+    stageKey: props.state.stageKey(stage)
+  }, props, {
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 40,
+      columnNumber: 11
+    }
+  })))));
   return /*#__PURE__*/_react.default.createElement(_CollectionCard.CollectionCard, {
     errorState: false,
     state: toolbar,
@@ -42,7 +74,7 @@ function _Kanban(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 35,
+      lineNumber: 53,
       columnNumber: 5
     }
   }, /*#__PURE__*/_react.default.createElement(_ToolbarCollection.ToolbarCollection, {
@@ -52,7 +84,7 @@ function _Kanban(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 36,
+      lineNumber: 54,
       columnNumber: 7
     }
   }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
@@ -63,7 +95,7 @@ function _Kanban(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 37,
+      lineNumber: 55,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
@@ -72,37 +104,18 @@ function _Kanban(props) {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 43,
+      lineNumber: 61,
       columnNumber: 11
     }
   }, props.state.isLoading() ? /*#__PURE__*/_react.default.createElement("div", {
+    "data-hook": "kanban-loading",
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 45,
+      lineNumber: 63,
       columnNumber: 15
     }
-  }, "loading stages...") : /*#__PURE__*/_react.default.createElement(_designSystem.Box, {
-    direction: "horizontal",
-    gap: "12px",
-    __self: this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 47,
-      columnNumber: 15
-    }
-  }, stages.map(stage => /*#__PURE__*/_react.default.createElement(_Stage.StageComponent, (0, _extends2.default)({
-    stageState: props.state.getStageState(stage),
-    dataHook: `kanban-stage-${props.state.stageKey(stage)}`,
-    key: props.state.stageKey(stage)
-  }, props, {
-    __self: this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 49,
-      columnNumber: 19
-    }
-  }))))))));
+  }, "loading stages...") : stagesContent))));
 }
 const Kanban = exports.Kanban = (0, _mobxReactLite.observer)(_Kanban);
 //# sourceMappingURL=Kanban.js.map

package/dist/cjs/components/Kanban/Kanban.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_ToolbarCollection","_mobxReactLite","_Stage","_designSystem","_CollectionCard","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_Kanban","props","state","dataHook","toolbar","useEffect","init","stages","useMemo","createElement","CollectionCard","errorState","__self","__source","fileName","lineNumber","columnNumber","ToolbarCollection","search","sticky","Box","margin","overflow","direction","isLoading","gap","map","stage","StageComponent","_extends2","stageState","getStageState","stageKey","key","Kanban","exports","observer"],"sources":["../../../../src/components/Kanban/Kanban.tsx"],"sourcesContent":["import React, { useEffect, useMemo } from 'react';\nimport { ToolbarBaseProps, ToolbarCollection } from '../ToolbarCollection';\nimport { observer } from 'mobx-react-lite';\nimport { FiltersMap } from '@wix/bex-core';\nimport { KanbanBaseProps } from './KanbanProps';\nimport { StageComponent } from './Stage';\nimport { Box } from '@wix/design-system';\nimport { CollectionCard } from '../CollectionCard';\n// import { CollectionCard } from '../CollectionCard';\n\nexport interface KanbanProps<C, S, F extends FiltersMap>\n  extends ToolbarBaseProps,\n    KanbanBaseProps<C, S, F> {}\n\nfunction _Kanban<C, S, F extends FiltersMap>(props: KanbanProps<C, S, F>) {\n  const { state, dataHook } = props;\n\n  const { toolbar } = state;\n\n  // if (process.env.NODE_ENV !== 'production') {\n  //   minimalRequiredWdsRuntimeCheck({\n  //     required: '^1.64.1',\n  //     requiredBy: 'WixPatterns/Kanban',\n  //   });\n  // }\n  useEffect(() => {\n    props.state.init();\n  }, [props.state]);\n\n  const stages = useMemo(() => {\n    return props.state.stages();\n  }, [props.state.stages()]);\n\n  return (\n    <CollectionCard errorState={false} state={toolbar} dataHook={dataHook}>\n      <ToolbarCollection search={true} sticky state={toolbar}>\n        <Box\n          dataHook=\"kanban-test\"\n          margin=\"24px\"\n          overflow=\"auto\"\n          direction=\"vertical\"\n        >\n          <Box dataHook=\"kanban-stages\" direction=\"vertical\">\n            {props.state.isLoading() ? (\n              <div>loading stages...</div>\n            ) : (\n              <Box direction=\"horizontal\" gap=\"12px\">\n                {stages.map((stage: S) => (\n                  <StageComponent\n                    stageState={props.state.getStageState(stage)}\n                    dataHook={`kanban-stage-${props.state.stageKey(stage)}`}\n                    key={props.state.stageKey(stage)}\n                    {...props}\n                  />\n                ))}\n              </Box>\n            )}\n          </Box>\n        </Box>\n      </ToolbarCollection>\n    </CollectionCard>\n  );\n}\n\nexport const Kanban = observer(_Kanban);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_ToolbarCollection","_mobxReactLite","_Stage","_designSystem","_CollectionCard","_KanbanCardDragAndDrop","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_Kanban","props","state","dataHook","toolbar","useEffect","init","stages","useMemo","activeId","dragAndDropState","activeStageKey","substring","indexOf","KanbanDragAndDropContext","KanbanCardDragAndDrop","stagesContent","createElement","stageId","__self","__source","fileName","lineNumber","columnNumber","Box","direction","gap","map","stage","StageComponent","_extends2","stageKey","key","CollectionCard","errorState","ToolbarCollection","search","sticky","margin","overflow","isLoading","Kanban","exports","observer"],"sources":["../../../../src/components/Kanban/Kanban.tsx"],"sourcesContent":["import React, { useEffect, useMemo } from 'react';\nimport { ToolbarBaseProps, ToolbarCollection } from '../ToolbarCollection';\nimport { observer } from 'mobx-react-lite';\nimport { FiltersMap } from '@wix/bex-core';\nimport { KanbanBaseProps } from './KanbanProps';\nimport { StageComponent } from './Stage';\nimport { Box } from '@wix/design-system';\nimport { CollectionCard } from '../CollectionCard';\nimport { KanbanCardDragAndDrop } from '../KanbanDragAndDropDndKit/KanbanCardDragAndDrop';\n\nexport interface KanbanProps<C, S, F extends FiltersMap>\n  extends ToolbarBaseProps,\n    KanbanBaseProps<C, S, F> {}\n\nfunction _Kanban<C, S, F extends FiltersMap>(props: KanbanProps<C, S, F>) {\n  const { state, dataHook } = props;\n\n  const { toolbar } = state;\n\n  useEffect(() => {\n    props.state.init();\n  }, [props.state]);\n\n  const stages = useMemo(() => {\n    return props.state.stages;\n  }, [props.state.stages]);\n\n  // Calculate active stage key from activeId\n  const activeId = state.dragAndDropState.activeId;\n  const activeStageKey = activeId\n    ? activeId.substring(0, activeId.indexOf('-##-')) || null\n    : null;\n\n  // Wrap with global drag and drop context - always enabled for Kanban\n  const { KanbanDragAndDropContext } = KanbanCardDragAndDrop;\n  const stagesContent = (\n    <KanbanDragAndDropContext state={state} stageId=\"all\">\n      <Box direction=\"horizontal\" gap=\"12px\">\n        {stages.map((stage: S) => (\n          <StageComponent\n            dataHook={`kanban-stage-${props.state.stageKey(stage)}`}\n            key={props.state.stageKey(stage)}\n            activeStageKey={activeStageKey}\n            stageKey={props.state.stageKey(stage)}\n            {...props}\n          />\n        ))}\n      </Box>\n    </KanbanDragAndDropContext>\n  );\n\n  return (\n    <CollectionCard errorState={false} state={toolbar} dataHook={dataHook}>\n      <ToolbarCollection search={true} sticky state={toolbar}>\n        <Box\n          dataHook=\"kanban-test\"\n          margin=\"24px\"\n          overflow=\"auto\"\n          direction=\"vertical\"\n        >\n          <Box dataHook=\"kanban-stages\" direction=\"vertical\">\n            {props.state.isLoading() ? (\n              <div data-hook=\"kanban-loading\">loading stages...</div>\n            ) : (\n              stagesContent\n            )}\n          </Box>\n        </Box>\n      </ToolbarCollection>\n    </CollectionCard>\n  );\n}\n\nexport const Kanban = observer(_Kanban);\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/Kanban/Kanban.uni.driver.js

@@ -6,12 +6,36 @@ exports.default = void 0;
 var _CollectionToolbarUni = require("../CollectionToolbar/CollectionToolbar.uni.driver");
 var _baseUniDriverFactory = require("../../unidriver/baseUniDriverFactory");
 var _unidriver = require("@wix/design-system/dist/testkit/unidriver");
+var _DragAndDropUni = require("../DragAndDrop/DragAndDrop.uni.driver");
 function KanbanUniDriver(base, body) {
   const toolbarBase = () => base.$('[data-hook="collection-toolbar"]');
   const toolbar = () => (0, _CollectionToolbarUni.CollectionToolbarUniDriver)(toolbarBase(), body);
+  const dragAndDrop = () => (0, _DragAndDropUni.DragAndDropUniDriver)(base);
+  const dragCardToStage = async ({
+    sourceStageKey,
+    cardKey,
+    targetStageKey
+  }) => {
+    const targetStageElement = base.$(`[data-hook^="kanban-stage-container-${targetStageKey}"]`);
+    if (!(await targetStageElement.exists())) {
+      throw new Error(`Target stage with key ${targetStageKey} not found`);
+    }
+    const sourceStageElement = base.$(`[data-hook^="kanban-stage-container-${sourceStageKey}"]`);
+    if (!(await sourceStageElement.exists())) {
+      throw new Error(`Source stage with key ${sourceStageKey} not found`);
+    }
+    const cardElement = base.$(`[data-hook^="kanban-card-drag-item-${sourceStageKey}-##-${cardKey}"]`);
+    if (!(await cardElement.exists())) {
+      throw new Error(`Card with key ${cardKey} not found in stage ${sourceStageKey}`);
+    }
+    const driverDragAndDrop = dragAndDrop();
+    await driverDragAndDrop.dragStart(cardElement);
+    await driverDragAndDrop.dragEnd(targetStageElement);
+  };
   return {
     ...(0, _baseUniDriverFactory.baseUniDriverFactory)(base),
     toolbar: () => toolbar(),
+    isKanbanLoading: () => base.$('[data-hook="kanban-loading"]').exists(),
     stages: {
       count: () => base.$$('[data-hook^="kanban-stage-container"]').count(),
       stageTitle: stageId => {
@@ -55,6 +79,10 @@ function KanbanUniDriver(base, body) {
     },
     cards: {
       count: stageKey => base.$$(`[data-hook^="kanban-card-${stageKey}-"]`).count(),
+      exists: ({
+        stageKey,
+        cardKey
+      }) => base.$(`[data-hook^="kanban-card-${stageKey}-${cardKey}"]`).exists(),
       getTitle: ({
         stageKey,
         cardKey
@@ -84,7 +112,8 @@ function KanbanUniDriver(base, body) {
           clickTriggerElement: () => iconButton.click()
         };
       },
-      getActionModal: () => (0, _unidriver.MessageModalLayoutUniDriver)(body.$('[data-hook="collection-action-modal"]'), body)
+      getActionModal: () => (0, _unidriver.MessageModalLayoutUniDriver)(body.$('[data-hook="collection-action-modal"]'), body),
+      dragCardToStage
     }
   };
 }

package/dist/cjs/components/Kanban/Kanban.uni.driver.js.map

@@ -1 +1 @@
-{"version":3,"names":["_CollectionToolbarUni","require","_baseUniDriverFactory","_unidriver","KanbanUniDriver","base","body","toolbarBase","$","toolbar","CollectionToolbarUniDriver","baseUniDriverFactory","stages","count","$$","stageTitle","stageId","TextUniDriver","stageSummary","counterBadge","CounterBadgeUniDriver","exists","totalItems","getContentText","scrollToEndOfStageCardsContainer","stageKey","scrollableElementDataHook","page","getNative","evaluate","_dataHook","scrollableElement","document","querySelector","scrollBy","behavior","top","scrollHeight","waitForTimeout","pageScrollContent","nativeEl","scrollTop","clientHeight","dispatchEvent","Event","cards","getTitle","cardKey","getPrimaryAction","button","ButtonUniDriver","text","getButtonTextContent","getSecondaryActions","popoverMenu","PopoverMenuUniDriver","triggerButton","getTriggerElement","iconButton","IconButtonUniDriver","clickTriggerElement","click","getActionModal","MessageModalLayoutUniDriver","_default","exports","default"],"sources":["../../../../src/components/Kanban/Kanban.uni.driver.ts"],"sourcesContent":["import { UniDriver } from '@wix/wix-ui-test-utils/unidriver';\nimport { CollectionToolbarUniDriver } from '../CollectionToolbar/CollectionToolbar.uni.driver';\nimport { baseUniDriverFactory } from '../../unidriver/baseUniDriverFactory';\nimport { SledPage } from '@wix/sled-test-runner';\nimport {\n  ButtonUniDriver,\n  CounterBadgeUniDriver,\n  IconButtonUniDriver,\n  MessageModalLayoutUniDriver,\n  PopoverMenuUniDriver,\n  TextUniDriver,\n} from '@wix/design-system/dist/testkit/unidriver';\n\nexport function KanbanUniDriver(base: UniDriver, body: UniDriver) {\n  const toolbarBase = () => base.$('[data-hook=\"collection-toolbar\"]');\n\n  const toolbar = () => CollectionToolbarUniDriver(toolbarBase(), body);\n\n  return {\n    ...baseUniDriverFactory(base),\n    toolbar: () => toolbar(),\n    stages: {\n      count: () => base.$$('[data-hook^=\"kanban-stage-container\"]').count(),\n      stageTitle: (stageId: string) => {\n        return TextUniDriver(\n          base.$(`[data-hook^=\"kanban-stage-title-${stageId}\"]`),\n          body,\n        );\n      },\n      stageSummary: (stageId: string) => {\n        const counterBadge = CounterBadgeUniDriver(\n          base.$(`[data-hook^=\"kanban-stage-title-total-${stageId}\"]`),\n          body,\n        );\n        return {\n          ...counterBadge,\n          exists: () => counterBadge.exists(),\n          totalItems: () => counterBadge.getContentText(),\n        };\n      },\n      scrollToEndOfStageCardsContainer: async (stageKey: string) => {\n        const scrollableElementDataHook = `kanban-stage-cards-container-${stageKey}`;\n\n        const { page } = (await body\n          .$(`[data-hook=\"${scrollableElementDataHook}\"]`)\n          .getNative()) as {\n          page?: SledPage['page'];\n        };\n        // puppeteer\n        if (page?.evaluate) {\n          await page.evaluate((_dataHook: string) => {\n            const scrollableElement = document.querySelector(\n              `[data-hook=\"${_dataHook}\"]`,\n            )!;\n            scrollableElement.scrollBy({\n              behavior: 'smooth',\n              top: scrollableElement.scrollHeight,\n            });\n          }, scrollableElementDataHook);\n          await page.waitForTimeout(1000); // delay scroll resolve by 1 sec\n        }\n        // jsdom\n        else {\n          const pageScrollContent = body.$(\n            `[data-hook=\"${scrollableElementDataHook}\"]`,\n          );\n\n          if (await pageScrollContent.exists()) {\n            // Scroll to the end of pageScrollContent by setting scrollTop to (scrollHeight - clientHeight)\n            const nativeEl = await pageScrollContent.getNative();\n            nativeEl.scrollTop = nativeEl.scrollHeight - nativeEl.clientHeight;\n            await nativeEl.dispatchEvent(new Event('scroll'));\n          }\n        }\n      },\n    },\n    cards: {\n      count: (stageKey: string) =>\n        base.$$(`[data-hook^=\"kanban-card-${stageKey}-\"]`).count(),\n      getTitle: ({\n        stageKey,\n        cardKey,\n      }: {\n        stageKey: string;\n        cardKey: string;\n      }) => {\n        return TextUniDriver(\n          base.$(`[data-hook^=\"kanban-card-title-${stageKey}-${cardKey}\"]`),\n          body,\n        );\n      },\n      getPrimaryAction: ({\n        stageKey,\n        cardKey,\n      }: {\n        stageKey: string;\n        cardKey: string;\n      }) => {\n        const button = ButtonUniDriver(\n          base.$(\n            `[data-hook=\"kanban-card-primary-action-${stageKey}-${cardKey}\"]`,\n          ),\n          body,\n        );\n        return {\n          ...button,\n          exists: () => button.exists(),\n          text: () => button.getButtonTextContent(),\n        };\n      },\n      getSecondaryActions: ({\n        stageKey,\n        cardKey,\n      }: {\n        stageKey: string;\n        cardKey: string;\n      }) => {\n        const popoverMenu = PopoverMenuUniDriver(\n          base.$(\n            `[data-hook=\"kanban-card-more-actions-${stageKey}-${cardKey}\"]`,\n          ),\n          body,\n        );\n\n        const triggerButton = popoverMenu.getTriggerElement(\n          `kanban-card-more-actions-trigger-${stageKey}-${cardKey}`,\n        );\n        const iconButton = IconButtonUniDriver(triggerButton, base);\n        return {\n          ...popoverMenu,\n          clickTriggerElement: () => iconButton.click(),\n        };\n      },\n      getActionModal: () =>\n        MessageModalLayoutUniDriver(\n          body.$('[data-hook=\"collection-action-modal\"]'),\n          body,\n        ),\n    },\n  };\n}\n\nexport default KanbanUniDriver;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_CollectionToolbarUni","require","_baseUniDriverFactory","_unidriver","_DragAndDropUni","KanbanUniDriver","base","body","toolbarBase","$","toolbar","CollectionToolbarUniDriver","dragAndDrop","DragAndDropUniDriver","dragCardToStage","sourceStageKey","cardKey","targetStageKey","targetStageElement","exists","Error","sourceStageElement","cardElement","driverDragAndDrop","dragStart","dragEnd","baseUniDriverFactory","isKanbanLoading","stages","count","$$","stageTitle","stageId","TextUniDriver","stageSummary","counterBadge","CounterBadgeUniDriver","totalItems","getContentText","scrollToEndOfStageCardsContainer","stageKey","scrollableElementDataHook","page","getNative","evaluate","_dataHook","scrollableElement","document","querySelector","scrollBy","behavior","top","scrollHeight","waitForTimeout","pageScrollContent","nativeEl","scrollTop","clientHeight","dispatchEvent","Event","cards","getTitle","getPrimaryAction","button","ButtonUniDriver","text","getButtonTextContent","getSecondaryActions","popoverMenu","PopoverMenuUniDriver","triggerButton","getTriggerElement","iconButton","IconButtonUniDriver","clickTriggerElement","click","getActionModal","MessageModalLayoutUniDriver","_default","exports","default"],"sources":["../../../../src/components/Kanban/Kanban.uni.driver.ts"],"sourcesContent":["import { UniDriver } from '@wix/wix-ui-test-utils/unidriver';\nimport { CollectionToolbarUniDriver } from '../CollectionToolbar/CollectionToolbar.uni.driver';\nimport { baseUniDriverFactory } from '../../unidriver/baseUniDriverFactory';\nimport { SledPage } from '@wix/sled-test-runner';\nimport {\n  ButtonUniDriver,\n  CounterBadgeUniDriver,\n  IconButtonUniDriver,\n  MessageModalLayoutUniDriver,\n  PopoverMenuUniDriver,\n  TextUniDriver,\n} from '@wix/design-system/dist/testkit/unidriver';\nimport { DragAndDropUniDriver } from '../DragAndDrop/DragAndDrop.uni.driver';\n\nexport function KanbanUniDriver(base: UniDriver, body: UniDriver) {\n  const toolbarBase = () => base.$('[data-hook=\"collection-toolbar\"]');\n\n  const toolbar = () => CollectionToolbarUniDriver(toolbarBase(), body);\n\n  const dragAndDrop = () => DragAndDropUniDriver(base);\n\n  const dragCardToStage = async ({\n    sourceStageKey,\n    cardKey,\n    targetStageKey,\n  }: {\n    sourceStageKey: string;\n    cardKey: string;\n    targetStageKey: string;\n  }) => {\n    const targetStageElement = base.$(\n      `[data-hook^=\"kanban-stage-container-${targetStageKey}\"]`,\n    );\n\n    if (!(await targetStageElement.exists())) {\n      throw new Error(`Target stage with key ${targetStageKey} not found`);\n    }\n\n    const sourceStageElement = base.$(\n      `[data-hook^=\"kanban-stage-container-${sourceStageKey}\"]`,\n    );\n\n    if (!(await sourceStageElement.exists())) {\n      throw new Error(`Source stage with key ${sourceStageKey} not found`);\n    }\n\n    const cardElement = base.$(\n      `[data-hook^=\"kanban-card-drag-item-${sourceStageKey}-##-${cardKey}\"]`,\n    );\n\n    if (!(await cardElement.exists())) {\n      throw new Error(\n        `Card with key ${cardKey} not found in stage ${sourceStageKey}`,\n      );\n    }\n\n    const driverDragAndDrop = dragAndDrop();\n    await driverDragAndDrop.dragStart(cardElement);\n    await driverDragAndDrop.dragEnd(targetStageElement);\n  };\n\n  return {\n    ...baseUniDriverFactory(base),\n    toolbar: () => toolbar(),\n    isKanbanLoading: () => base.$('[data-hook=\"kanban-loading\"]').exists(),\n    stages: {\n      count: () => base.$$('[data-hook^=\"kanban-stage-container\"]').count(),\n      stageTitle: (stageId: string) => {\n        return TextUniDriver(\n          base.$(`[data-hook^=\"kanban-stage-title-${stageId}\"]`),\n          body,\n        );\n      },\n      stageSummary: (stageId: string) => {\n        const counterBadge = CounterBadgeUniDriver(\n          base.$(`[data-hook^=\"kanban-stage-title-total-${stageId}\"]`),\n          body,\n        );\n        return {\n          ...counterBadge,\n          exists: () => counterBadge.exists(),\n          totalItems: () => counterBadge.getContentText(),\n        };\n      },\n      scrollToEndOfStageCardsContainer: async (stageKey: string) => {\n        const scrollableElementDataHook = `kanban-stage-cards-container-${stageKey}`;\n\n        const { page } = (await body\n          .$(`[data-hook=\"${scrollableElementDataHook}\"]`)\n          .getNative()) as {\n          page?: SledPage['page'];\n        };\n        // puppeteer\n        if (page?.evaluate) {\n          await page.evaluate((_dataHook: string) => {\n            const scrollableElement = document.querySelector(\n              `[data-hook=\"${_dataHook}\"]`,\n            )!;\n            scrollableElement.scrollBy({\n              behavior: 'smooth',\n              top: scrollableElement.scrollHeight,\n            });\n          }, scrollableElementDataHook);\n          await page.waitForTimeout(1000); // delay scroll resolve by 1 sec\n        }\n        // jsdom\n        else {\n          const pageScrollContent = body.$(\n            `[data-hook=\"${scrollableElementDataHook}\"]`,\n          );\n\n          if (await pageScrollContent.exists()) {\n            // Scroll to the end of pageScrollContent by setting scrollTop to (scrollHeight - clientHeight)\n            const nativeEl = await pageScrollContent.getNative();\n            nativeEl.scrollTop = nativeEl.scrollHeight - nativeEl.clientHeight;\n            await nativeEl.dispatchEvent(new Event('scroll'));\n          }\n        }\n      },\n    },\n    cards: {\n      count: (stageKey: string) =>\n        base.$$(`[data-hook^=\"kanban-card-${stageKey}-\"]`).count(),\n      exists: ({ stageKey, cardKey }: { stageKey: string; cardKey: string }) =>\n        base.$(`[data-hook^=\"kanban-card-${stageKey}-${cardKey}\"]`).exists(),\n      getTitle: ({\n        stageKey,\n        cardKey,\n      }: {\n        stageKey: string;\n        cardKey: string;\n      }) => {\n        return TextUniDriver(\n          base.$(`[data-hook^=\"kanban-card-title-${stageKey}-${cardKey}\"]`),\n          body,\n        );\n      },\n      getPrimaryAction: ({\n        stageKey,\n        cardKey,\n      }: {\n        stageKey: string;\n        cardKey: string;\n      }) => {\n        const button = ButtonUniDriver(\n          base.$(\n            `[data-hook=\"kanban-card-primary-action-${stageKey}-${cardKey}\"]`,\n          ),\n          body,\n        );\n        return {\n          ...button,\n          exists: () => button.exists(),\n          text: () => button.getButtonTextContent(),\n        };\n      },\n      getSecondaryActions: ({\n        stageKey,\n        cardKey,\n      }: {\n        stageKey: string;\n        cardKey: string;\n      }) => {\n        const popoverMenu = PopoverMenuUniDriver(\n          base.$(\n            `[data-hook=\"kanban-card-more-actions-${stageKey}-${cardKey}\"]`,\n          ),\n          body,\n        );\n\n        const triggerButton = popoverMenu.getTriggerElement(\n          `kanban-card-more-actions-trigger-${stageKey}-${cardKey}`,\n        );\n        const iconButton = IconButtonUniDriver(triggerButton, base);\n        return {\n          ...popoverMenu,\n          clickTriggerElement: () => iconButton.click(),\n        };\n      },\n      getActionModal: () =>\n        MessageModalLayoutUniDriver(\n          body.$('[data-hook=\"collection-action-modal\"]'),\n          body,\n        ),\n      dragCardToStage,\n    },\n  };\n}\n\nexport default KanbanUniDriver;\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/Kanban/Stage.js

@@ -1,20 +1,28 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 exports.__esModule = true;
 exports.StageComponent = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _designSystem = require("@wix/design-system");
 var _mobxReactLite = require("mobx-react-lite");
 var _Card = require("./Card");
+var _KanbanCardDragAndDrop = require("../KanbanDragAndDropDndKit/KanbanCardDragAndDrop");
 var _state = require("../../state");
+var _core = require("@wix/wix-style-react-incubator/dnd-kit/core");
+var _mobx = require("mobx");
 var _jsxFileName = "/home/builduser/work/db7ea24852bc3350/packages/cairo/dist/cjs/components/Kanban/Stage.tsx";
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _StageComponent({
   dataHook,
-  stageState,
+  state,
   stageSummary,
+  activeStageKey,
+  stageKey,
   ...props
 }) {
+  const stageState = state.kanbanStageStates[stageKey];
   const handleScroll = e => {
     const {
       scrollTop,
@@ -30,6 +38,17 @@ function _StageComponent({
       keyedItems
     }
   } = stageState.itemsCollectionState;
+
+  // Make the stage droppable
+  const {
+    isOver,
+    setNodeRef: setDroppableRef
+  } = (0, _core.useDroppable)({
+    id: stageState.stageKey
+  });
+
+  // Check if this stage is the source stage (where drag originated)
+  const isDndSourceStage = activeStageKey === stageState.stageKey;
   const items = React.useMemo(() => {
     return keyedItems.map((keyedItem, index) => {
       const itemActionsState = new _state.ItemActionsState({
@@ -39,7 +58,7 @@ function _StageComponent({
       });
       return {
         keyedItem,
-        stageKey: stageState.stageKey(),
+        stageKey: stageState.stageKey,
         originalItem: keyedItem.item,
         itemIndex: index,
         itemActionsState,
@@ -54,49 +73,65 @@ function _StageComponent({
       };
     });
   }, [keyedItems, keyedItems.length]);
-  return /*#__PURE__*/React.createElement(_designSystem.Box, {
-    width: "270px",
-    dataHook: `kanban-stage-container-${stageState.stageKey()}`,
-    backgroundColor: "#F4F7FF",
-    borderRadius: "8px",
-    paddingLeft: "12px",
-    paddingRight: "12px",
-    direction: "vertical",
+  const {
+    DraggableCard
+  } = _KanbanCardDragAndDrop.KanbanCardDragAndDrop;
+  return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
+    ref: setDroppableRef,
+    "data-hook": `kanban-stage-container-${stageState.stageKey}`,
+    style: {
+      width: '270px',
+      backgroundColor: isOver && !isDndSourceStage ? '#9C9EA6' : '#F4F7FF',
+      borderRadius: '8px',
+      display: 'flex',
+      flexDirection: 'column',
+      transition: 'background-color 0.2s ease',
+      border: isOver && !isDndSourceStage ? '2px dashed #2196F3' : '2px solid transparent'
+    }
+  }, process.env.NODE_ENV === 'test' && {
+    onPointerUp: (0, _mobx.action)(() => {
+      if (state.dragAndDropState.activeId) {
+        state.dragAndDropState.handleDragEnd({
+          over: {
+            id: stageState.stageKey
+          },
+          active: {
+            id: state.dragAndDropState.activeId
+          }
+        });
+      }
+    })
+  }, {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 77,
+      lineNumber: 88,
       columnNumber: 5
     }
-  }, /*#__PURE__*/React.createElement(_designSystem.Box, {
+  }), /*#__PURE__*/React.createElement(_designSystem.Box, {
     width: "246px",
     direction: "vertical",
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 86,
+      lineNumber: 114,
       columnNumber: 7
     }
   }, /*#__PURE__*/React.createElement("div", {
-    "data-hook": dataHook
-    // onDragOver={(e) => e.preventDefault()}
-    // onDrop={(e) => {
-    //   e.preventDefault();
-    // }}
-    ,
+    "data-hook": dataHook,
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 87,
+      lineNumber: 115,
       columnNumber: 9
     }
   }, /*#__PURE__*/React.createElement(_designSystem.Box, {
-    paddingTop: "12px",
     direction: "vertical",
+    padding: "12px",
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 94,
+      lineNumber: 116,
       columnNumber: 11
     }
   }, /*#__PURE__*/React.createElement(_designSystem.Box, {
@@ -107,7 +142,7 @@ function _StageComponent({
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 95,
+      lineNumber: 117,
       columnNumber: 13
     }
   }, /*#__PURE__*/React.createElement(_designSystem.Box, {
@@ -115,44 +150,43 @@ function _StageComponent({
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 101,
+      lineNumber: 123,
       columnNumber: 15
     }
   }, /*#__PURE__*/React.createElement(_designSystem.Text, {
     size: "small",
     weight: "bold",
-    dataHook: `kanban-stage-title-${stageState.stageKey()}`,
+    dataHook: `kanban-stage-title-${stageState.stageKey}`,
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 102,
+      lineNumber: 124,
       columnNumber: 17
     }
-  }, stageState.stageName()), /*#__PURE__*/React.createElement(_designSystem.CounterBadge, {
-    dataHook: `kanban-stage-title-total-${stageState.stageKey()}`,
+  }, stageState.stageName), /*#__PURE__*/React.createElement(_designSystem.CounterBadge, {
+    dataHook: `kanban-stage-title-total-${stageState.stageKey}`,
     skin: "light",
     truncate: false,
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 109,
+      lineNumber: 131,
       columnNumber: 17
     }
   }, stageState.totalItems())), /*#__PURE__*/React.createElement(_designSystem.Box, {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 117,
+      lineNumber: 139,
       columnNumber: 15
     }
   }, stageSummary == null ? void 0 : stageSummary({
     stage: stageState.stage
   }))), /*#__PURE__*/React.createElement(_designSystem.Box, {
-    paddingBottom: "12px",
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 119,
+      lineNumber: 141,
       columnNumber: 13
     }
   }, /*#__PURE__*/React.createElement(_designSystem.AddItem, {
@@ -161,7 +195,7 @@ function _StageComponent({
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 120,
+      lineNumber: 142,
       columnNumber: 15
     }
   }, /*#__PURE__*/React.createElement(_designSystem.Box, {
@@ -170,23 +204,32 @@ function _StageComponent({
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 121,
+      lineNumber: 143,
       columnNumber: 17
     }
   }, "Add Card")))), stageState.isLoading() ? /*#__PURE__*/React.createElement("div", {
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 128,
+      lineNumber: 150,
       columnNumber: 13
     }
-  }, "loading cards...") : /*#__PURE__*/React.createElement("div", {
-    "data-hook": `kanban-stage-cards-container-${stageState.stageKey()}`,
+  }, "loading cards...") : /*#__PURE__*/React.createElement(_designSystem.Box, {
+    paddingBottom: "12px",
+    direction: "vertical",
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 152,
+      columnNumber: 13
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    "data-hook": `kanban-stage-cards-container-${stageState.stageKey}`,
     style: {
       overflow: 'auto',
       height: '100%',
-      minHeight: '600px',
-      maxHeight: 'calc(100vh - 400px)',
+      minHeight: '430px',
+      maxHeight: 'calc(100vh - 420px)',
       display: 'flex',
       flexDirection: 'column',
       gap: '12px'
@@ -195,38 +238,39 @@ function _StageComponent({
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 130,
-      columnNumber: 13
+      lineNumber: 153,
+      columnNumber: 15
     }
-  }, items.map(itemData => {
-    var _itemData$item;
-    return /*#__PURE__*/React.createElement(_Card.CardComponent, {
-      key: `${itemData.stageKey}-${(_itemData$item = itemData.item) == null ? void 0 : _itemData$item.key}`,
-      keyedItem: itemData.keyedItem,
-      originalItem: itemData.keyedItem.item,
-      itemIndex: itemData.itemIndex,
-      item: itemData.item,
-      stageKey: itemData.stageKey,
-      actionCell: itemData.actionCell,
-      itemActionsState: itemData.itemActionsState,
+  }, items == null ? void 0 : items.map(item => /*#__PURE__*/React.createElement(DraggableCard, {
+    key: `${item.stageKey}-##-${item.item.key}`,
+    id: `${item.stageKey}-##-${item.item.key}`,
+    state: state,
+    cardProps: {
+      keyedItem: item.keyedItem,
+      originalItem: item.keyedItem.item,
+      itemIndex: item.itemIndex,
+      item: item.item,
+      stageKey: item.stageKey,
+      actionCell: item.actionCell,
+      itemActionsState: item.itemActionsState,
       dataExtension: props.dataExtension,
-      tags: props.tags,
-      __self: this,
-      __source: {
-        fileName: _jsxFileName,
-        lineNumber: 144,
-        columnNumber: 17
-      }
-    });
-  }), stageState.itemsCollectionState.status.isLoading && /*#__PURE__*/React.createElement("div", {
+      tags: props.tags
+    },
+    __self: this,
+    __source: {
+      fileName: _jsxFileName,
+      lineNumber: 167,
+      columnNumber: 19
+    }
+  }, _Card.CardComponent)), stageState.itemsCollectionState.status.isLoading && /*#__PURE__*/React.createElement("div", {
     className: "text-sm text-center text-gray-500",
     __self: this,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 158,
-      columnNumber: 17
+      lineNumber: 187,
+      columnNumber: 19
     }
-  }, "Loading more...")))));
+  }, "Loading more..."))))));
 }
 const StageComponent = exports.StageComponent = (0, _mobxReactLite.observer)(_StageComponent);
 //# sourceMappingURL=Stage.js.map