@elliemae/ds-legacy-shuttle-v2 1.0.0-rc.1

package/dist/cjs/parts/Dnd/DropIndicator.js

@@ -0,0 +1,92 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var DropIndicator_exports = {};
+__export(DropIndicator_exports, {
+  DropIndicator: () => DropIndicator,
+  default: () => DropIndicator_default
+});
+module.exports = __toCommonJS(DropIndicator_exports);
+var React = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_ds_legacy_system = require("@elliemae/ds-legacy-system");
+var DropIndicatorPosition = /* @__PURE__ */ ((DropIndicatorPosition2) => {
+  DropIndicatorPosition2["None"] = "none";
+  DropIndicatorPosition2["Before"] = "before";
+  DropIndicatorPosition2["After"] = "after";
+  return DropIndicatorPosition2;
+})(DropIndicatorPosition || {});
+const getPositionStyles = ({ dropIndicatorPosition, vertical }) => {
+  if (vertical) {
+    return `
+      left: ${dropIndicatorPosition === "before" /* Before */ ? "0" : "unset"};
+      right: ${dropIndicatorPosition === "after" /* After */ ? "0" : "unset"};
+    `;
+  }
+  return `
+      top: ${dropIndicatorPosition === "before" /* Before */ ? "0" : "unset"};
+      bottom: ${dropIndicatorPosition === "after" /* After */ ? "0" : "unset"};
+    `;
+};
+const getCircleStyles = ({ dropIndicatorPosition, vertical }) => ({
+  position: "absolute",
+  top: vertical || dropIndicatorPosition === "after" /* After */ ? "unset" : "-2px",
+  bottom: vertical || dropIndicatorPosition === "before" /* Before */ ? "unset" : "-2px",
+  left: !vertical || dropIndicatorPosition === "after" /* After */ ? "unset" : "-2px",
+  right: !vertical || dropIndicatorPosition === "before" /* Before */ ? "unset" : "-2px",
+  opacity: 1
+});
+const StyledIndicator = import_ds_legacy_system.styled.div`
+  position: absolute;
+  ${getPositionStyles}
+  box-sizing: border-box;
+  width: ${(props) => props.vertical ? "2px" : "100%"};
+  height: ${(props) => props.vertical ? "100%" : "2px"};
+  background-color: ${({ isDropValid, theme }) => isDropValid ? theme.colors.brand[600] : theme.colors.danger[900]};
+`;
+const CircleIndicator = (style, isDropValid) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { height: "6", width: "6", style, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { cx: "3", cy: "3", r: "3", strokeWidth: "0", fill: isDropValid ? "#1E79C2" : "#C64252" }) });
+const DropIndicator = (props) => {
+  const { vertical, dropIndicatorPosition, isLast, isDropValid } = props;
+  if (dropIndicatorPosition === false || !["after" /* After */, "before" /* Before */].includes(dropIndicatorPosition)) {
+    return null;
+  }
+  const safeDropIndicatorPosition = isLast ? "before" /* Before */ : dropIndicatorPosition;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    CircleIndicator(getCircleStyles({ ...props, dropIndicatorPosition: safeDropIndicatorPosition }), isDropValid),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      StyledIndicator,
+      {
+        vertical,
+        dropIndicatorPosition: safeDropIndicatorPosition,
+        isDropValid
+      }
+    )
+  ] });
+};
+var DropIndicator_default = DropIndicator;
+//# sourceMappingURL=DropIndicator.js.map

package/dist/cjs/parts/Dnd/DropIndicator.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/parts/Dnd/DropIndicator.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-legacy-system';\n\nenum DropIndicatorPosition {\n  None = 'none',\n  Before = 'before',\n  After = 'after',\n}\n\ninterface DropIndicatorProps {\n  vertical: boolean;\n  dropIndicatorPosition: false | DropIndicatorPosition;\n  isDropValid: boolean;\n  isLast?: boolean;\n}\n\nconst getPositionStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => {\n  if (vertical) {\n    return `\n      left: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n      right: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n    `;\n  }\n  return `\n      top: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n      bottom: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n    `;\n};\n\nconst getCircleStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => ({\n  position: 'absolute',\n  top: vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n  bottom: vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n  left: !vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n  right: !vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n  opacity: 1,\n});\n\nconst StyledIndicator = styled.div<DropIndicatorProps>`\n  position: absolute;\n  ${getPositionStyles}\n  box-sizing: border-box;\n  width: ${(props) => (props.vertical ? '2px' : '100%')};\n  height: ${(props) => (props.vertical ? '100%' : '2px')};\n  background-color: ${({ isDropValid, theme }) => (isDropValid ? theme.colors.brand[600] : theme.colors.danger[900])};\n`;\n\nconst CircleIndicator = (style: Record<string, unknown>, isDropValid: boolean) => (\n  <svg height=\"6\" width=\"6\" style={style}>\n    <circle cx=\"3\" cy=\"3\" r=\"3\" strokeWidth=\"0\" fill={isDropValid ? '#1E79C2' : '#C64252'} />\n  </svg>\n);\n\nconst DropIndicator: React.ComponentType<DropIndicatorProps> = (props) => {\n  const { vertical, dropIndicatorPosition, isLast, isDropValid } = props;\n  if (\n    dropIndicatorPosition === false ||\n    ![DropIndicatorPosition.After, DropIndicatorPosition.Before].includes(dropIndicatorPosition)\n  ) {\n    return null;\n  }\n\n  const safeDropIndicatorPosition = isLast ? DropIndicatorPosition.Before : dropIndicatorPosition;\n  return (\n    <>\n      {CircleIndicator(getCircleStyles({ ...props, dropIndicatorPosition: safeDropIndicatorPosition }), isDropValid)}\n      <StyledIndicator\n        vertical={vertical}\n        dropIndicatorPosition={safeDropIndicatorPosition}\n        isDropValid={isDropValid}\n      />\n    </>\n  );\n};\n\nexport { DropIndicator };\nexport default DropIndicator;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiDnB;AAhDJ,8BAAuB;AAEvB,IAAK,wBAAL,kBAAKA,2BAAL;AACE,EAAAA,uBAAA,UAAO;AACP,EAAAA,uBAAA,YAAS;AACT,EAAAA,uBAAA,WAAQ;AAHL,SAAAA;AAAA,GAAA;AAaL,MAAM,oBAAoB,CAAC,EAAE,uBAAuB,SAAS,MAA0B;AACrF,MAAI,UAAU;AACZ,WAAO;AAAA,cACG,0BAA0B,wBAA+B,MAAM;AAAA,eAC9D,0BAA0B,sBAA8B,MAAM;AAAA;AAAA,EAE3E;AACA,SAAO;AAAA,aACI,0BAA0B,wBAA+B,MAAM;AAAA,gBAC5D,0BAA0B,sBAA8B,MAAM;AAAA;AAE9E;AAEA,MAAM,kBAAkB,CAAC,EAAE,uBAAuB,SAAS,OAA2B;AAAA,EACpF,UAAU;AAAA,EACV,KAAK,YAAY,0BAA0B,sBAA8B,UAAU;AAAA,EACnF,QAAQ,YAAY,0BAA0B,wBAA+B,UAAU;AAAA,EACvF,MAAM,CAAC,YAAY,0BAA0B,sBAA8B,UAAU;AAAA,EACrF,OAAO,CAAC,YAAY,0BAA0B,wBAA+B,UAAU;AAAA,EACvF,SAAS;AACX;AAEA,MAAM,kBAAkB,+BAAO;AAAA;AAAA,IAE3B;AAAA;AAAA,WAEO,CAAC,UAAW,MAAM,WAAW,QAAQ;AAAA,YACpC,CAAC,UAAW,MAAM,WAAW,SAAS;AAAA,sBAC5B,CAAC,EAAE,aAAa,MAAM,MAAO,cAAc,MAAM,OAAO,MAAM,GAAG,IAAI,MAAM,OAAO,OAAO,GAAG;AAAA;AAGlH,MAAM,kBAAkB,CAAC,OAAgC,gBACvD,4CAAC,SAAI,QAAO,KAAI,OAAM,KAAI,OACxB,sDAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,KAAI,aAAY,KAAI,MAAM,cAAc,YAAY,WAAW,GACzF;AAGF,MAAM,gBAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,UAAU,uBAAuB,QAAQ,YAAY,IAAI;AACjE,MACE,0BAA0B,SAC1B,CAAC,CAAC,qBAA6B,qBAA4B,EAAE,SAAS,qBAAqB,GAC3F;AACA,WAAO;AAAA,EACT;AAEA,QAAM,4BAA4B,SAAS,wBAA+B;AAC1E,SACE,4EACG;AAAA,oBAAgB,gBAAgB,EAAE,GAAG,OAAO,uBAAuB,0BAA0B,CAAC,GAAG,WAAW;AAAA,IAC7G;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,uBAAuB;AAAA,QACvB;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAGA,IAAO,wBAAQ;",
+  "names": ["DropIndicatorPosition"]
+}

package/dist/cjs/parts/Header.js

@@ -0,0 +1,91 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Header_exports = {};
+__export(Header_exports, {
+  Header: () => Header
+});
+module.exports = __toCommonJS(Header_exports);
+var React = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = __toESM(require("react"));
+var import_ds_legacy_grid = require("@elliemae/ds-legacy-grid");
+var import_ds_legacy_icons = require("@elliemae/ds-legacy-icons");
+var import_ds_legacy_button_v2 = require("@elliemae/ds-legacy-button-v2");
+var import_ds_legacy_system = require("@elliemae/ds-legacy-system");
+var import_DSShuttleV2Definitions = require("../config/DSShuttleV2Definitions.js");
+var import_useStore = require("../config/useStore/index.js");
+var import_useFocusTracker = require("../config/useFocusTracker/index.js");
+const StyledIconButton = (0, import_ds_legacy_system.styled)(import_ds_legacy_button_v2.DSButtonV2, { name: import_DSShuttleV2Definitions.DSShuttleV2Name, slot: import_DSShuttleV2Definitions.DSShuttleV2Slots.HEADER_SEARCH_ICON })``;
+const Header = import_react.default.memo((panelMetaInfo) => {
+  const { isDestinationPanel } = panelMetaInfo;
+  const HeaderRenderer = (0, import_useStore.usePropsStore)((state) => isDestinationPanel ? state.DestinationHeader : state.SourceHeader);
+  const onSearchBarOpen = (0, import_useStore.usePropsStore)(
+    (state) => isDestinationPanel ? state.onDesinationOpenSearchbar : state.onSourceOpenSearchbar
+  );
+  const isSearchBarOpen = (0, import_useStore.usePropsStore)(
+    (state) => isDestinationPanel ? state.destinationShowSearchbar : state.sourceShowSearchbar
+  );
+  const { trackFocusRegionHeader, trackFocusItemReset, trackFocusActionReset } = (0, import_useFocusTracker.useFocusTracker)();
+  const onHeaderFocus = import_react.default.useCallback(() => {
+    trackFocusRegionHeader(isDestinationPanel);
+    trackFocusItemReset();
+    trackFocusActionReset();
+  }, [isDestinationPanel, trackFocusActionReset, trackFocusItemReset, trackFocusRegionHeader]);
+  const handleFilterClick = import_react.default.useCallback(
+    (event) => {
+      onSearchBarOpen?.(!isSearchBarOpen, { event });
+    },
+    [isSearchBarOpen, onSearchBarOpen]
+  );
+  const cols = import_react.default.useMemo(() => {
+    const finalCols = ["1fr"];
+    if (onSearchBarOpen)
+      finalCols.push("auto");
+    return finalCols;
+  }, [onSearchBarOpen]);
+  const getOwnerProps = (0, import_useStore.usePropsStore)((store) => store.get);
+  const getOwnerPropsArguments = (0, import_react.useCallback)(() => panelMetaInfo, [panelMetaInfo]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_legacy_grid.Grid, { onFocus: onHeaderFocus, cols, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(HeaderRenderer, {}),
+    onSearchBarOpen ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_legacy_grid.Grid, { alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      StyledIconButton,
+      {
+        "aria-label": `Toggle ${isDestinationPanel ? "destination" : "source"} panel filter bar`,
+        buttonType: "icon",
+        onClick: handleFilterClick,
+        w: 24,
+        h: 24,
+        getOwnerProps,
+        getOwnerPropsArguments,
+        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_legacy_icons.Search, { width: "1.077rem", height: "1.077rem" })
+      }
+    ) }) : null
+  ] });
+});
+//# sourceMappingURL=Header.js.map

package/dist/cjs/parts/Header.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/parts/Header.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React, { useCallback } from 'react';\nimport { Grid } from '@elliemae/ds-legacy-grid';\nimport { Search } from '@elliemae/ds-legacy-icons';\nimport {\n  DSButtonV2,\n  type DSButtonT,\n  // BUTTON_SIZES\n} from '@elliemae/ds-legacy-button-v2';\nimport { styled } from '@elliemae/ds-legacy-system';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../config/DSShuttleV2Definitions.js';\nimport { usePropsStore } from '../config/useStore/index.js';\nimport { useFocusTracker } from '../config/useFocusTracker/index.js';\nimport { type DSShuttleV2T } from '../react-desc-prop-types.js';\n\nconst StyledIconButton = styled(DSButtonV2, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.HEADER_SEARCH_ICON })``;\nexport const Header = React.memo((panelMetaInfo: DSShuttleV2T.PanelMetaInfo) => {\n  const { isDestinationPanel } = panelMetaInfo;\n  const HeaderRenderer = usePropsStore((state) => (isDestinationPanel ? state.DestinationHeader : state.SourceHeader));\n  const onSearchBarOpen = usePropsStore((state) =>\n    isDestinationPanel ? state.onDesinationOpenSearchbar : state.onSourceOpenSearchbar,\n  );\n  const isSearchBarOpen = usePropsStore((state) =>\n    isDestinationPanel ? state.destinationShowSearchbar : state.sourceShowSearchbar,\n  );\n  const { trackFocusRegionHeader, trackFocusItemReset, trackFocusActionReset } = useFocusTracker();\n  const onHeaderFocus = React.useCallback(() => {\n    trackFocusRegionHeader(isDestinationPanel);\n    trackFocusItemReset();\n    trackFocusActionReset();\n  }, [isDestinationPanel, trackFocusActionReset, trackFocusItemReset, trackFocusRegionHeader]);\n\n  const handleFilterClick = React.useCallback(\n    (event: Parameters<Required<DSButtonT.Props>['onClick']>[0]) => {\n      onSearchBarOpen?.(!isSearchBarOpen, { event });\n    },\n    [isSearchBarOpen, onSearchBarOpen],\n  );\n\n  const cols = React.useMemo(() => {\n    const finalCols = ['1fr'];\n    if (onSearchBarOpen) finalCols.push('auto');\n    return finalCols;\n  }, [onSearchBarOpen]);\n\n  const getOwnerProps = usePropsStore((store) => store.get);\n  const getOwnerPropsArguments = useCallback(() => panelMetaInfo, [panelMetaInfo]);\n\n  return (\n    <Grid onFocus={onHeaderFocus} cols={cols}>\n      <HeaderRenderer />\n      {onSearchBarOpen ? (\n        <Grid alignItems=\"center\" justifyContent=\"center\">\n          <StyledIconButton\n            aria-label={`Toggle ${isDestinationPanel ? 'destination' : 'source'} panel filter bar`}\n            buttonType=\"icon\"\n            onClick={handleFilterClick}\n            w={24}\n            h={24}\n            getOwnerProps={getOwnerProps}\n            getOwnerPropsArguments={getOwnerPropsArguments}\n          >\n            <Search width=\"1.077rem\" height=\"1.077rem\" />\n          </StyledIconButton>\n        </Grid>\n      ) : null}\n    </Grid>\n  );\n});\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgDnB;AAhDJ,mBAAmC;AACnC,4BAAqB;AACrB,6BAAuB;AACvB,iCAIO;AACP,8BAAuB;AACvB,oCAAkD;AAClD,sBAA8B;AAC9B,6BAAgC;AAGhC,MAAM,uBAAmB,gCAAO,uCAAY,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,mBAAmB,CAAC;AACzG,MAAM,SAAS,aAAAA,QAAM,KAAK,CAAC,kBAA8C;AAC9E,QAAM,EAAE,mBAAmB,IAAI;AAC/B,QAAM,qBAAiB,+BAAc,CAAC,UAAW,qBAAqB,MAAM,oBAAoB,MAAM,YAAa;AACnH,QAAM,sBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AACA,QAAM,sBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,2BAA2B,MAAM;AAAA,EAC9D;AACA,QAAM,EAAE,wBAAwB,qBAAqB,sBAAsB,QAAI,wCAAgB;AAC/F,QAAM,gBAAgB,aAAAA,QAAM,YAAY,MAAM;AAC5C,2BAAuB,kBAAkB;AACzC,wBAAoB;AACpB,0BAAsB;AAAA,EACxB,GAAG,CAAC,oBAAoB,uBAAuB,qBAAqB,sBAAsB,CAAC;AAE3F,QAAM,oBAAoB,aAAAA,QAAM;AAAA,IAC9B,CAAC,UAA+D;AAC9D,wBAAkB,CAAC,iBAAiB,EAAE,MAAM,CAAC;AAAA,IAC/C;AAAA,IACA,CAAC,iBAAiB,eAAe;AAAA,EACnC;AAEA,QAAM,OAAO,aAAAA,QAAM,QAAQ,MAAM;AAC/B,UAAM,YAAY,CAAC,KAAK;AACxB,QAAI;AAAiB,gBAAU,KAAK,MAAM;AAC1C,WAAO;AAAA,EACT,GAAG,CAAC,eAAe,CAAC;AAEpB,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,6BAAyB,0BAAY,MAAM,eAAe,CAAC,aAAa,CAAC;AAE/E,SACE,6CAAC,8BAAK,SAAS,eAAe,MAC5B;AAAA,gDAAC,kBAAe;AAAA,IACf,kBACC,4CAAC,8BAAK,YAAW,UAAS,gBAAe,UACvC;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,UAAU,qBAAqB,gBAAgB;AAAA,QAC3D,YAAW;AAAA,QACX,SAAS;AAAA,QACT,GAAG;AAAA,QACH,GAAG;AAAA,QACH;AAAA,QACA;AAAA,QAEA,sDAAC,iCAAO,OAAM,YAAW,QAAO,YAAW;AAAA;AAAA,IAC7C,GACF,IACE;AAAA,KACN;AAEJ,CAAC;",
+  "names": ["React"]
+}

package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js

@@ -0,0 +1,121 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var withConditionalDnDRowContext_exports = {};
+__export(withConditionalDnDRowContext_exports, {
+  withConditionalDnDRowContext: () => withConditionalDnDRowContext
+});
+module.exports = __toCommonJS(withConditionalDnDRowContext_exports);
+var React = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = __toESM(require("react"));
+var import_ds_legacy_drag_and_drop = require("@elliemae/ds-legacy-drag-and-drop");
+var import_react_dom = require("react-dom");
+var import_useStore = require("../../config/useStore/index.js");
+var import_ItemOverlay = require("../Item/ItemOverlay.js");
+const withConditionalDnDRowContext = (Component) => (props) => {
+  const { isDestinationPanel } = props;
+  const itemList = (0, import_useStore.usePropsStore)(
+    (state) => isDestinationPanel ? state.destinationConfiguredData : state.sourceConfiguredData
+  );
+  const withDragNDrop = (0, import_useStore.usePropsStore)(
+    (state) => isDestinationPanel ? !state.removeDragAndDropFromDestination : state.addDragAndDropFromSource
+  );
+  const setDndDraggingItemMeta = (0, import_useStore.useInternalStore)((state) => state.setDndDraggingItemMeta);
+  const dndDraggingItemMeta = (0, import_useStore.useInternalStore)((state) => state.dndDraggingItemMeta);
+  const setOverId = (0, import_useStore.useInternalStore)((state) => state.setOverId);
+  const setIsDropValid = (0, import_useStore.useInternalStore)((state) => state.setIsDropValid);
+  const setDndDraggingItem = (0, import_useStore.useInternalStore)((state) => state.setDndDraggingItem);
+  const setLastActiveId = (0, import_useStore.useInternalStore)((state) => state.setLastActiveId);
+  const setDropIndicatorPosition = (0, import_useStore.useInternalStore)((state) => state.setDropIndicatorPosition);
+  const onItemsReorder = (0, import_useStore.usePropsStore)(
+    (state) => isDestinationPanel ? state.onDestinationReorder : state.onSourceReorder
+  );
+  const onReorder = (0, import_react.useCallback)(
+    (dndActive, targetIndex, metadata) => {
+      const { considerExpanding, over: dndOver, ...dndData } = metadata;
+      const over2 = dndOver.original.original;
+      const active2 = dndActive.original.original;
+      const cleanedMetaData = { ...dndData, over: over2, active: active2, targetIndex };
+      onItemsReorder(active2, cleanedMetaData);
+    },
+    [onItemsReorder]
+  );
+  const treeConfig = import_react.default.useMemo(() => {
+    const configuredItemList = itemList.map((item, i) => ({
+      // dnd
+      uid: item.hydratedId,
+      depth: 0,
+      parentId: null,
+      realIndex: i,
+      childrenCount: 0,
+      original: item
+    }));
+    return {
+      flattenedItems: configuredItemList,
+      isHorizontalDnD: false,
+      isExpandable: false,
+      onReorder,
+      maxDragAndDropLevel: 0,
+      getIsDropValid: () => true
+    };
+  }, [itemList, onReorder]);
+  const { dndContextProps, sortableContextProps, activeItem, active, over, dropIndicatorPosition, isDropValid } = (0, import_ds_legacy_drag_and_drop.useTreeDndkitConfig)(treeConfig);
+  const containerSortableContextProps = sortableContextProps.root;
+  (0, import_react.useEffect)(() => {
+    setLastActiveId(active?.id?.toString() ?? "");
+    setOverId(over?.id?.toString() ?? "");
+    setIsDropValid(isDropValid);
+    setDndDraggingItem(activeItem?.original ?? null);
+    setDropIndicatorPosition(dropIndicatorPosition);
+    if (!active)
+      setDndDraggingItemMeta(null);
+  }, [
+    active,
+    activeItem,
+    dropIndicatorPosition,
+    isDropValid,
+    over,
+    setDndDraggingItem,
+    setDndDraggingItemMeta,
+    setDropIndicatorPosition,
+    setIsDropValid,
+    setLastActiveId,
+    setOverId
+  ]);
+  if (withDragNDrop)
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_legacy_drag_and_drop.DndContext, { ...dndContextProps, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_legacy_drag_and_drop.SortableContext, { ...containerSortableContextProps, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { ...props }),
+      (0, import_react_dom.createPortal)(
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_legacy_drag_and_drop.DragOverlay, { style: { width: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: dndDraggingItemMeta ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ItemOverlay.ItemOverlay, { ...dndDraggingItemMeta }) : null }) }),
+        document.body
+      )
+    ] }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { ...props });
+};
+//# sourceMappingURL=withConditionalDnDRowContext.js.map

package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/parts/HoC/withConditionalDnDRowContext.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable indent */\n/* eslint-disable max-statements */\n/* eslint-disable max-params */\n/* eslint-disable react/function-component-definition */\nimport React, { useCallback, useEffect } from 'react';\nimport type { DnDKitTree } from '@elliemae/ds-legacy-drag-and-drop';\nimport { DndContext, DragOverlay, SortableContext, useTreeDndkitConfig } from '@elliemae/ds-legacy-drag-and-drop';\nimport { createPortal } from 'react-dom';\nimport { useInternalStore, usePropsStore } from '../../config/useStore/index.js';\nimport type { DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { ItemOverlay } from '../Item/ItemOverlay.js';\n\n// create a type omittting height from PanelMetaInfo\ntype HoCConfig = DSShuttleV2T.PanelMetaInfo;\ntype InternalHoCStates = {\n  activeId?: DSShuttleV2T.HydratedId;\n  overId?: DSShuttleV2T.HydratedId;\n  isDropValid?: boolean;\n};\ntype ResultComponentProps = DSShuttleV2T.PanelMetaInfo & InternalHoCStates;\n\n// only wraps in \"DnDContext\" and \"DnDTreeContext\" if any Drag and Drop functionality is requested\nexport const withConditionalDnDRowContext: ConfiguredReactFunctionalHOC<HoCConfig, ResultComponentProps> =\n  (Component) => (props) => {\n    const { isDestinationPanel } = props;\n    const itemList = usePropsStore((state) =>\n      isDestinationPanel ? state.destinationConfiguredData : state.sourceConfiguredData,\n    );\n\n    const withDragNDrop = usePropsStore((state) =>\n      isDestinationPanel ? !state.removeDragAndDropFromDestination : state.addDragAndDropFromSource,\n    );\n\n    const setDndDraggingItemMeta = useInternalStore((state) => state.setDndDraggingItemMeta);\n    const dndDraggingItemMeta = useInternalStore((state) => state.dndDraggingItemMeta);\n    const setOverId = useInternalStore((state) => state.setOverId);\n    const setIsDropValid = useInternalStore((state) => state.setIsDropValid);\n    const setDndDraggingItem = useInternalStore((state) => state.setDndDraggingItem);\n    const setLastActiveId = useInternalStore((state) => state.setLastActiveId);\n    const setDropIndicatorPosition = useInternalStore((state) => state.setDropIndicatorPosition);\n\n    const onItemsReorder = usePropsStore((state) =>\n      isDestinationPanel ? state.onDestinationReorder : state.onSourceReorder,\n    );\n\n    const onReorder: DnDKitTree.OnReorder<DSShuttleV2T.ConfiguredDatum> = useCallback(\n      (dndActive, targetIndex, metadata) => {\n        // eslint-disable-next-line no-unused-vars\n        const { considerExpanding, over: dndOver, ...dndData } = metadata;\n        const over = dndOver.original.original;\n        const active = dndActive.original.original;\n        const cleanedMetaData = { ...dndData, over, active, targetIndex };\n        onItemsReorder(active, cleanedMetaData);\n      },\n      [onItemsReorder],\n    );\n\n    const treeConfig = React.useMemo(() => {\n      const configuredItemList = itemList.map((item, i) => ({\n        // dnd\n        uid: item.hydratedId,\n        depth: 0,\n        parentId: null,\n        realIndex: i,\n        childrenCount: 0,\n        original: item,\n      }));\n      return {\n        flattenedItems: configuredItemList,\n        isHorizontalDnD: false,\n        isExpandable: false,\n        onReorder,\n        maxDragAndDropLevel: 0,\n        getIsDropValid: () => true,\n      };\n    }, [itemList, onReorder]);\n\n    const { dndContextProps, sortableContextProps, activeItem, active, over, dropIndicatorPosition, isDropValid } =\n      useTreeDndkitConfig(treeConfig);\n\n    const containerSortableContextProps = sortableContextProps.root;\n\n    useEffect(() => {\n      setLastActiveId(active?.id?.toString() ?? '');\n      setOverId(over?.id?.toString() ?? '');\n      setIsDropValid(isDropValid);\n      setDndDraggingItem(activeItem?.original ?? null);\n      setDropIndicatorPosition(dropIndicatorPosition);\n      if (!active) setDndDraggingItemMeta(null);\n    }, [\n      active,\n      activeItem,\n      dropIndicatorPosition,\n      isDropValid,\n      over,\n      setDndDraggingItem,\n      setDndDraggingItemMeta,\n      setDropIndicatorPosition,\n      setIsDropValid,\n      setLastActiveId,\n      setOverId,\n    ]);\n\n    if (withDragNDrop)\n      return (\n        <DndContext {...dndContextProps}>\n          <SortableContext {...containerSortableContextProps}>\n            <Component {...props} />\n            {createPortal(\n              <DragOverlay style={{ width: 'auto' }}>\n                <>{dndDraggingItemMeta ? <ItemOverlay {...dndDraggingItemMeta} /> : null}</>\n              </DragOverlay>,\n              document.body,\n            )}\n          </SortableContext>\n        </DndContext>\n      );\n    return <Component {...props} />;\n  };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
+  "names": ["over", "active", "React"]
+}

package/dist/cjs/parts/HoC/withConditionalUseSortable.js

@@ -0,0 +1,43 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var withConditionalUseSortable_exports = {};
+__export(withConditionalUseSortable_exports, {
+  withConditionalUseSortable: () => withConditionalUseSortable
+});
+module.exports = __toCommonJS(withConditionalUseSortable_exports);
+var React = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_ds_legacy_drag_and_drop = require("@elliemae/ds-legacy-drag-and-drop");
+const withConditionalUseSortable = (Component) => function(props) {
+  const { datumInternalMeta } = props;
+  const { hydratedId } = datumInternalMeta;
+  const useSortableHelpers = (0, import_ds_legacy_drag_and_drop.useSortable)({ id: hydratedId });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { ...props, useSortableHelpers });
+};
+//# sourceMappingURL=withConditionalUseSortable.js.map

package/dist/cjs/parts/HoC/withConditionalUseSortable.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/parts/HoC/withConditionalUseSortable.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { useSortable } from '@elliemae/ds-legacy-drag-and-drop';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\n\ntype HoCConfig = DSShuttleV2T.ItemMeta;\ntype ResultComponentProps = DSShuttleV2T.ItemMeta & { useSortableHelpers: ReturnType<typeof useSortable> };\nexport const withConditionalUseSortable: ConfiguredReactFunctionalHOC<HoCConfig, ResultComponentProps> = (Component) =>\n  function (props) {\n    const { datumInternalMeta } = props;\n    const { hydratedId } = datumInternalMeta;\n    const useSortableHelpers = useSortable({ id: hydratedId });\n\n    return <Component {...props} useSortableHelpers={useSortableHelpers} />;\n  };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADYZ;AAXX,qCAA4B;AAKrB,MAAM,6BAA4F,CAAC,cACxG,SAAU,OAAO;AACf,QAAM,EAAE,kBAAkB,IAAI;AAC9B,QAAM,EAAE,WAAW,IAAI;AACvB,QAAM,yBAAqB,4CAAY,EAAE,IAAI,WAAW,CAAC;AAEzD,SAAO,4CAAC,aAAW,GAAG,OAAO,oBAAwC;AACvE;",
+  "names": []
+}

package/dist/cjs/parts/Item/Item.js

@@ -0,0 +1,222 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var Item_exports = {};
+__export(Item_exports, {
+  Item: () => Item,
+  ItemSortable: () => ItemSortable,
+  default: () => Item_default
+});
+module.exports = __toCommonJS(Item_exports);
+var React = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = __toESM(require("react"));
+var import_ds_legacy_utilities = require("@elliemae/ds-legacy-utilities");
+var import_ds_legacy_system = require("@elliemae/ds-legacy-system");
+var import_ds_legacy_grid = require("@elliemae/ds-legacy-grid");
+var import_DSShuttleV2Definitions = require("../../config/DSShuttleV2Definitions.js");
+var import_useStore = require("../../config/useStore/index.js");
+var import_ItemSelection = require("./ItemSelection.js");
+var import_ItemActions = require("./ItemActions/index.js");
+var import_ItemMiddleSection = require("./ItemMiddleSection.js");
+var import_useSelectionLogic = require("./useSelectionLogic.js");
+var import_useItemArrowNavigation = require("./useItemArrowNavigation.js");
+var import_constants = require("../../constants/index.js");
+var import_DndHandle = require("../Dnd/DndHandle.js");
+var import_DropIndicator = require("../Dnd/DropIndicator.js");
+var import_withConditionalUseSortable = require("../HoC/withConditionalUseSortable.js");
+var import_useInnerRefHandlers = require("./ItemActions/useInnerRefHandlers.js");
+var import_useItemKeyboardSelection = require("./useItemKeyboardSelection.js");
+var import_useThisItemIsFocused = require("./useThisItemIsFocused.js");
+const cssDisabled = import_ds_legacy_system.css`
+  background-color: ${({ theme }) => theme.colors.neutral["100"]};
+  color: ${({ theme }) => theme.colors.neutral["300"]};
+  .DSShuttleV2-item-action-btn-to-source-icon > svg,
+  .DSShuttleV2-item-action-btn-to-destination-icon > svg,
+  .DSShuttleV2-item-action-btn-drilldown-icon > svg {
+    fill: ${({ theme }) => theme.colors.neutral["300"]};
+  }
+`;
+const focusRing = import_ds_legacy_system.css`
+  outline: 2px solid ${({ theme }) => theme.colors.brand["700"]};
+  outline-offset: -2px;
+`;
+const ItemWrapper = (0, import_ds_legacy_system.styled)(import_ds_legacy_grid.Grid, { name: import_DSShuttleV2Definitions.DSShuttleV2Name, slot: import_DSShuttleV2Definitions.DSShuttleV2Slots.ITEM_WRAPPER })`
+  min-height: 2.769rem;
+  position: relative;
+  background-color: white;
+  &:hover {
+    background-color: ${({ isDndActive, theme }) => !isDndActive ? theme.colors.brand["200"] : "white"};
+    .DSShuttleV2-item-action-btn-to-source-icon > svg,
+    .DSShuttleV2-item-action-btn-to-destination-icon > svg,
+    .DSShuttleV2-item-action-btn-drilldown-icon > svg {
+      fill: brand-700;
+    }
+    ${({ isDragging }) => isDragging && cssDisabled}
+  }
+
+  ${({ hasFocusRing }) => hasFocusRing && focusRing}
+
+  border-bottom: 1px solid neutral-100;
+
+  ${({ isDragging }) => isDragging && cssDisabled}
+`;
+const ItemSelectionWrapper = (0, import_ds_legacy_system.styled)(import_ds_legacy_grid.Grid, { name: import_DSShuttleV2Definitions.DSShuttleV2Name, slot: import_DSShuttleV2Definitions.DSShuttleV2Slots.ITEM_CHECKBOX })`
+  height: 100%;
+  &:focus {
+    outline: none;
+  }
+`;
+const useInnerRefHandlers = (itemMeta) => {
+  const { datumInternalMeta, isDestinationPanel } = itemMeta;
+  const { hydratedId } = datumInternalMeta;
+  const setZustandRef = (0, import_useStore.useInternalStore)((state) => state.setZustandRef);
+  const setDeferFocusUntilFirstRender = (0, import_useStore.useInternalStore)((state) => state.setDeferFocusUntilFirstRender);
+  const getDeferFocusUntilFirstRender = (0, import_useStore.useInternalStore)((state) => state.getDeferFocusUntilFirstRender);
+  const thisItemIsFocused = (0, import_useThisItemIsFocused.useThisItemIsFocused)(itemMeta);
+  const currRegion = isDestinationPanel ? import_constants.REGIONS_FOCUSES.DESTINATION_PANEL_ITEM : import_constants.REGIONS_FOCUSES.SOURCE_PANEL_ITEM;
+  const currItemId = hydratedId;
+  const innerRefHandlerParentItem = import_react.default.useCallback(
+    (node) => {
+      setZustandRef([currRegion, currItemId, "parent"], node);
+      if (getDeferFocusUntilFirstRender() && thisItemIsFocused && node) {
+        node?.focus();
+        setDeferFocusUntilFirstRender(false);
+      }
+    },
+    [
+      setZustandRef,
+      currRegion,
+      currItemId,
+      getDeferFocusUntilFirstRender,
+      thisItemIsFocused,
+      setDeferFocusUntilFirstRender
+    ]
+  );
+  return import_react.default.useMemo(() => ({ innerRefHandlerParentItem }), [innerRefHandlerParentItem]);
+};
+const Item = import_react.default.memo((itemMeta) => {
+  const { datumInternalMeta, withDragNDrop, useSortableHelpers, hasMultipleSelection } = itemMeta;
+  const { isSelected, hydratedId, softDeleted } = datumInternalMeta;
+  const cols = (0, import_react.useMemo)(() => {
+    if (withDragNDrop)
+      return ["5px", "auto", "1fr", "auto"];
+    return ["5px", "1fr", "auto"];
+  }, [withDragNDrop]);
+  const setDndDraggingItemMeta = (0, import_useStore.useInternalStore)((state) => state.setDndDraggingItemMeta);
+  const getIsDragAndDropHappening = (0, import_useStore.useInternalStore)((state) => state.getIsDragAndDropHappening);
+  const isDraggingThisItem = (0, import_useStore.useInternalStore)((state) => state.dndDraggingItem?.hydratedId === hydratedId);
+  import_react.default.useEffect(() => {
+    if (isDraggingThisItem) {
+      setDndDraggingItemMeta((prevItemMeta) => {
+        if (prevItemMeta?.datumInternalMeta.hydratedId === hydratedId)
+          return prevItemMeta;
+        return itemMeta;
+      });
+    }
+  }, [hydratedId, isDraggingThisItem, itemMeta, setDndDraggingItemMeta]);
+  const { selectItem, onShiftMouseDownPreventTextSelection } = (0, import_useSelectionLogic.useSelectionLogic)(itemMeta);
+  const { onItemContainerKeyDown } = (0, import_useItemArrowNavigation.useItemArrowNavigation)(itemMeta);
+  const { onItemKeyDownSelection } = (0, import_useItemKeyboardSelection.useItemKeyboardSelection)(itemMeta);
+  const handleItemKeyDown = import_react.default.useCallback(
+    (event) => {
+      onItemKeyDownSelection(event);
+      onItemContainerKeyDown(event);
+    },
+    [onItemKeyDownSelection, onItemContainerKeyDown]
+  );
+  const { innerRefHandlerParentItem } = useInnerRefHandlers(itemMeta);
+  const { innerRefHandlerDnd } = (0, import_useInnerRefHandlers.useInnerRefHandlers)(itemMeta);
+  const overId = (0, import_useStore.useInternalStore)((state) => state.overId);
+  const isDropValid = (0, import_useStore.useInternalStore)((state) => state.isDropValid);
+  const dropIndicatorPosition = (0, import_useStore.useInternalStore)((state) => state.dropIndicatorPosition);
+  const showDropIndicatorPosition = hydratedId === overId && dropIndicatorPosition;
+  const sortableRef = useSortableHelpers?.setNodeRef ?? (() => {
+  });
+  const thisItemIsFocused = (0, import_useThisItemIsFocused.useThisItemIsFocused)(itemMeta);
+  const config = import_react.default.useMemo(() => ({ hasFocus: thisItemIsFocused }), [thisItemIsFocused]);
+  const tooltipHelpers = (0, import_ds_legacy_utilities.useHeadlessTooltip)(config);
+  const idItem = (0, import_react.useMemo)(() => `${hydratedId}-wrapper${softDeleted ? "-soft-deleted" : ""}`, [hydratedId, softDeleted]);
+  const getOwnerProps = (0, import_useStore.usePropsStore)((store) => store.get);
+  const getOwnerPropsArguments = import_react.default.useCallback(() => itemMeta, [itemMeta]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    ItemWrapper,
+    {
+      isDragging: isDraggingThisItem,
+      isDndActive: getIsDragAndDropHappening(),
+      cols,
+      alignItems: "center",
+      onClick: selectItem,
+      ref: sortableRef,
+      onKeyDown: handleItemKeyDown,
+      onMouseDown: onShiftMouseDownPreventTextSelection,
+      onMouseEnter: tooltipHelpers.onMouseEnter,
+      onMouseLeave: tooltipHelpers.onMouseLeave,
+      onPointerEnter: tooltipHelpers.onMouseEnter,
+      onPointerLeave: tooltipHelpers.onMouseLeave,
+      hasFocusRing: thisItemIsFocused,
+      tabIndex: -1,
+      getOwnerProps,
+      getOwnerPropsArguments,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          ItemSelectionWrapper,
+          {
+            role: "checkbox",
+            "aria-checked": isSelected,
+            onFocus: tooltipHelpers.onFocus,
+            onBlur: tooltipHelpers.onBlur,
+            "aria-labelledby": `${hydratedId}-text-section${softDeleted ? "-soft-deleted" : ""}`,
+            id: idItem,
+            ref: innerRefHandlerParentItem,
+            getOwnerProps,
+            getOwnerPropsArguments,
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ItemSelection.ItemSelection, { ...itemMeta })
+          }
+        ),
+        withDragNDrop && useSortableHelpers ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_DndHandle.DragHandle,
+          {
+            id: hydratedId,
+            useSortableHelpers,
+            isDndActive: getIsDragAndDropHappening(),
+            isDragging: isDraggingThisItem,
+            innerRef: innerRefHandlerDnd,
+            disabled: hasMultipleSelection
+          }
+        ) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ItemMiddleSection.ItemMiddleSection, { ...itemMeta, tooltipHelpers }),
+        !hasMultipleSelection ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ItemActions.ItemActions, { ...itemMeta }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DropIndicator.DropIndicator, { vertical: false, dropIndicatorPosition: showDropIndicatorPosition, isDropValid })
+      ]
+    }
+  );
+});
+const ItemSortable = (0, import_withConditionalUseSortable.withConditionalUseSortable)(Item);
+var Item_default = ItemSortable;
+//# sourceMappingURL=Item.js.map