@salt-ds/lab 1.0.0-alpha.0

package/dist-cjs/packages/lab/src/list-deprecated/internal/Highlighter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Highlighter.js","sources":["../src/list-deprecated/internal/Highlighter.jsx"],"sourcesContent":["import React from \"react\";\nimport { escapeRegExp } from \"../../utils\";\n\nimport \"./Highlighter.css\";\n\nconst baseName = \"saltHighlighter\";\n\nexport const Highlighter = (props) => {\n  const { matchPattern, text = \"\" } = props;\n  const matchRegex =\n    typeof matchPattern === \"string\"\n      ? new RegExp(`(${escapeRegExp(matchPattern)})`, \"gi\")\n      : matchPattern;\n  return (\n    <>\n      {text.split(matchRegex).map((part, index) =>\n        part.match(matchRegex) ? (\n          <strong className={`${baseName}-highlight`} key={`${index}-${part}`}>\n            {part}\n          </strong>\n        ) : (\n          part\n        )\n      )}\n    </>\n  );\n};\n"],"names":["escapeRegExp","jsx","Fragment"],"mappings":";;;;;;;;;;AAKA,MAAM,QAAW,GAAA,iBAAA,CAAA;AAEJ,MAAA,WAAA,GAAc,CAAC,KAAU,KAAA;AACpC,EAAA,MAAM,EAAE,YAAA,EAAc,IAAO,GAAA,EAAA,EAAO,GAAA,KAAA,CAAA;AACpC,EAAM,MAAA,UAAA,GACJ,OAAO,YAAA,KAAiB,QACpB,GAAA,IAAI,MAAO,CAAA,CAAA,CAAA,EAAIA,yBAAa,CAAA,YAAY,CAAM,CAAA,CAAA,CAAA,EAAA,IAAI,CAClD,GAAA,YAAA,CAAA;AACN,EACE,uBAAAC,cAAA,CAAAC,mBAAA,EAAA;AAAA,IACG,QAAA,EAAA,IAAA,CAAK,KAAM,CAAA,UAAU,CAAE,CAAA,GAAA;AAAA,MAAI,CAAC,IAAM,EAAA,KAAA,KACjC,KAAK,KAAM,CAAA,UAAU,oBAClBD,cAAA,CAAA,QAAA,EAAA;AAAA,QAAO,WAAW,CAAG,EAAA,QAAA,CAAA,UAAA,CAAA;AAAA,QACnB,QAAA,EAAA,IAAA;AAAA,OAD8C,EAAA,CAAA,EAAG,KAAS,CAAA,CAAA,EAAA,IAAA,CAAA,CAE7D,CAEA,GAAA,IAAA;AAAA,KAEJ;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/packages/lab/src/list-deprecated/internal/calcPreferredListHeight.js

@@ -0,0 +1,28 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const calcPreferredListHeight = (props = {}) => {
+  const {
+    borderless,
+    displayedItemCount = 0,
+    itemCount = 0,
+    itemHeight = 0,
+    getItemHeight,
+    gapSize = 1
+  } = props;
+  let preferredHeight = borderless ? 0 : 2;
+  const preferredItemCount = itemCount === 0 ? displayedItemCount : Math.min(displayedItemCount, itemCount);
+  if (typeof getItemHeight === "function") {
+    preferredHeight += Array.from({ length: preferredItemCount }).reduce(
+      (total, _, index) => total + Number(getItemHeight(index)) + gapSize,
+      0
+    ) - gapSize;
+  } else {
+    preferredHeight += preferredItemCount * Number(itemHeight) + (preferredItemCount - 1) * gapSize;
+  }
+  return isNaN(preferredHeight) ? void 0 : preferredHeight;
+};
+
+exports.calcPreferredListHeight = calcPreferredListHeight;
+//# sourceMappingURL=calcPreferredListHeight.js.map

package/dist-cjs/packages/lab/src/list-deprecated/internal/calcPreferredListHeight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calcPreferredListHeight.js","sources":["../src/list-deprecated/internal/calcPreferredListHeight.js"],"sourcesContent":["export const calcPreferredListHeight = (props = {}) => {\n  const {\n    borderless,\n    displayedItemCount = 0,\n    itemCount = 0,\n    itemHeight = 0,\n    getItemHeight,\n    gapSize = 1,\n  } = props;\n\n  let preferredHeight = borderless ? 0 : 2;\n\n  // if there is no item we render with the preferred count\n  const preferredItemCount =\n    itemCount === 0\n      ? displayedItemCount\n      : Math.min(displayedItemCount, itemCount);\n\n  if (typeof getItemHeight === \"function\") {\n    preferredHeight +=\n      Array.from({ length: preferredItemCount }).reduce(\n        (total, _, index) => total + Number(getItemHeight(index)) + gapSize,\n        0\n      ) -\n      // We don't want gap after the last item\n      gapSize;\n  } else {\n    preferredHeight +=\n      preferredItemCount * Number(itemHeight) +\n      (preferredItemCount - 1) * gapSize;\n  }\n\n  // list height will be undefined if the item height can not be\n  // converted to a number, for example rem or a percentage string\n  return isNaN(preferredHeight) ? undefined : preferredHeight;\n};\n"],"names":[],"mappings":";;;;AAAO,MAAM,uBAA0B,GAAA,CAAC,KAAQ,GAAA,EAAO,KAAA;AACrD,EAAM,MAAA;AAAA,IACJ,UAAA;AAAA,IACA,kBAAqB,GAAA,CAAA;AAAA,IACrB,SAAY,GAAA,CAAA;AAAA,IACZ,UAAa,GAAA,CAAA;AAAA,IACb,aAAA;AAAA,IACA,OAAU,GAAA,CAAA;AAAA,GACR,GAAA,KAAA,CAAA;AAEJ,EAAI,IAAA,eAAA,GAAkB,aAAa,CAAI,GAAA,CAAA,CAAA;AAGvC,EAAA,MAAM,qBACJ,SAAc,KAAA,CAAA,GACV,qBACA,IAAK,CAAA,GAAA,CAAI,oBAAoB,SAAS,CAAA,CAAA;AAE5C,EAAI,IAAA,OAAO,kBAAkB,UAAY,EAAA;AACvC,IAAA,eAAA,IACE,MAAM,IAAK,CAAA,EAAE,MAAQ,EAAA,kBAAA,EAAoB,CAAE,CAAA,MAAA;AAAA,MACzC,CAAC,OAAO,CAAG,EAAA,KAAA,KAAU,QAAQ,MAAO,CAAA,aAAA,CAAc,KAAK,CAAC,CAAI,GAAA,OAAA;AAAA,MAC5D,CAAA;AAAA,KAGF,GAAA,OAAA,CAAA;AAAA,GACG,MAAA;AACL,IAAA,eAAA,IACE,kBAAqB,GAAA,MAAA,CAAO,UAAU,CAAA,GAAA,CACrC,qBAAqB,CAAK,IAAA,OAAA,CAAA;AAAA,GAC/B;AAIA,EAAO,OAAA,KAAA,CAAM,eAAe,CAAA,GAAI,KAAY,CAAA,GAAA,eAAA,CAAA;AAC9C;;;;"}

package/dist-cjs/packages/lab/src/list-deprecated/internal/helpers.js

@@ -0,0 +1,8 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const isPlainObject = (obj) => Object.prototype.toString.call(obj) === "[object Object]";
+
+exports.isPlainObject = isPlainObject;
+//# sourceMappingURL=helpers.js.map

package/dist-cjs/packages/lab/src/list-deprecated/internal/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","sources":["../src/list-deprecated/internal/helpers.js"],"sourcesContent":["export const isPlainObject = (obj) =>\n  Object.prototype.toString.call(obj) === \"[object Object]\";\n\nexport const calcPreferredListHeight = (props = {}) => {\n  const {\n    borderless,\n    displayedItemCount = 0,\n    itemCount = 0,\n    itemHeight = 0,\n    getItemHeight,\n  } = props;\n\n  let preferredHeight = borderless ? 0 : 2;\n\n  // if there is no item we render with the preferred count\n  const preferredItemCount =\n    itemCount === 0\n      ? displayedItemCount\n      : Math.min(displayedItemCount, itemCount);\n\n  if (typeof getItemHeight === \"function\") {\n    preferredHeight += Array.from({ length: preferredItemCount }).reduce(\n      (total, _, index) => total + Number(getItemHeight(index)),\n      0\n    );\n  } else {\n    preferredHeight += preferredItemCount * Number(itemHeight);\n  }\n\n  // list height will be undefined if the item height can not be\n  // converted to a number, for example rem or a percentage string\n  return isNaN(preferredHeight) ? undefined : preferredHeight;\n};\n"],"names":[],"mappings":";;;;AAAa,MAAA,aAAA,GAAgB,CAAC,GAC5B,KAAA,MAAA,CAAO,UAAU,QAAS,CAAA,IAAA,CAAK,GAAG,CAAM,KAAA;;;;"}

package/dist-cjs/packages/lab/src/list-deprecated/internal/scrollIntoView.js

@@ -0,0 +1,27 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var computeScrollIntoView = require('compute-scroll-into-view');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var computeScrollIntoView__default = /*#__PURE__*/_interopDefaultLegacy(computeScrollIntoView);
+
+function scrollIntoView(item, list) {
+  if (!item) {
+    return;
+  }
+  const actions = computeScrollIntoView__default["default"](item, {
+    boundary: list,
+    block: "nearest",
+    scrollMode: "if-needed"
+  });
+  actions.forEach(({ el, top, left }) => {
+    el.scrollTop = top;
+    el.scrollLeft = left;
+  });
+}
+
+exports.scrollIntoView = scrollIntoView;
+//# sourceMappingURL=scrollIntoView.js.map

package/dist-cjs/packages/lab/src/list-deprecated/internal/scrollIntoView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrollIntoView.js","sources":["../src/list-deprecated/internal/scrollIntoView.js"],"sourcesContent":["import computeScrollIntoView from \"compute-scroll-into-view\";\n\nexport function scrollIntoView(item, list) {\n  if (!item) {\n    return;\n  }\n\n  const actions = computeScrollIntoView(item, {\n    boundary: list,\n    block: \"nearest\",\n    scrollMode: \"if-needed\",\n  });\n\n  actions.forEach(({ el, top, left }) => {\n    el.scrollTop = top;\n    el.scrollLeft = left;\n  });\n}\n"],"names":["computeScrollIntoView"],"mappings":";;;;;;;;;;AAEgB,SAAA,cAAA,CAAe,MAAM,IAAM,EAAA;AACzC,EAAA,IAAI,CAAC,IAAM,EAAA;AACT,IAAA,OAAA;AAAA,GACF;AAEA,EAAM,MAAA,OAAA,GAAUA,0CAAsB,IAAM,EAAA;AAAA,IAC1C,QAAU,EAAA,IAAA;AAAA,IACV,KAAO,EAAA,SAAA;AAAA,IACP,UAAY,EAAA,WAAA;AAAA,GACb,CAAA,CAAA;AAED,EAAA,OAAA,CAAQ,QAAQ,CAAC,EAAE,EAAI,EAAA,GAAA,EAAK,MAAW,KAAA;AACrC,IAAA,EAAA,CAAG,SAAY,GAAA,GAAA,CAAA;AACf,IAAA,EAAA,CAAG,UAAa,GAAA,IAAA,CAAA;AAAA,GACjB,CAAA,CAAA;AACH;;;;"}

package/dist-cjs/packages/lab/src/list-deprecated/internal/useListAutoSizer.js

@@ -0,0 +1,46 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var core = require('@salt-ds/core');
+
+function useListAutoSizer(props) {
+  const { responsive, width, height } = props;
+  const [size, setSize] = React.useState({ width, height });
+  const ref = React.useRef(null);
+  const handleResize = React.useCallback(function handleResize2(contentRect) {
+    if (contentRect.width > 0 && contentRect.height > 0) {
+      setSize({
+        width: contentRect.width,
+        height: contentRect.height
+      });
+    }
+  }, []);
+  core.useIsomorphicLayoutEffect(() => {
+    setSize({ width, height });
+  }, [width, height]);
+  core.useIsomorphicLayoutEffect(() => {
+    if (responsive) {
+      let observer;
+      if (ref.current) {
+        handleResize(ref.current.getBoundingClientRect());
+        observer = new ResizeObserver(
+          ([{ contentRect }]) => {
+            handleResize(contentRect);
+          }
+        );
+        observer.observe(ref.current);
+      }
+      return () => {
+        if (observer) {
+          observer.disconnect();
+        }
+      };
+    }
+  }, [handleResize, responsive]);
+  return [ref, size];
+}
+
+exports.useListAutoSizer = useListAutoSizer;
+//# sourceMappingURL=useListAutoSizer.js.map

package/dist-cjs/packages/lab/src/list-deprecated/internal/useListAutoSizer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useListAutoSizer.js","sources":["../src/list-deprecated/internal/useListAutoSizer.ts"],"sourcesContent":["import { useRef, useState, useCallback, Ref } from \"react\";\nimport { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\n\nexport interface ListAutosizerProps {\n  responsive: boolean;\n  height?: number | string;\n  width?: number | string;\n}\n\ninterface size {\n  height?: number | string;\n  width?: number | string;\n}\n\nexport function useListAutoSizer<Element extends HTMLElement>(\n  props: ListAutosizerProps\n): [Ref<Element>, size] {\n  const { responsive, width, height } = props;\n  const [size, setSize] = useState({ width, height });\n  const ref = useRef<Element>(null);\n\n  const handleResize = useCallback(function handleResize(contentRect: DOMRect) {\n    if (contentRect.width > 0 && contentRect.height > 0) {\n      setSize({\n        width: contentRect.width,\n        height: contentRect.height,\n      });\n    }\n  }, []);\n\n  useIsomorphicLayoutEffect(() => {\n    setSize({ width, height });\n  }, [width, height]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (responsive) {\n      let observer: ResizeObserver;\n      if (ref.current) {\n        handleResize(ref.current.getBoundingClientRect());\n        observer = new ResizeObserver(\n          ([{ contentRect }]: ResizeObserverEntry[]) => {\n            handleResize(contentRect);\n          }\n        );\n        observer.observe(ref.current);\n      }\n      return () => {\n        if (observer) {\n          observer.disconnect();\n        }\n      };\n    }\n  }, [handleResize, responsive]);\n\n  return [ref, size];\n}\n"],"names":["useState","useRef","useCallback","handleResize","useIsomorphicLayoutEffect"],"mappings":";;;;;;;AAcO,SAAS,iBACd,KACsB,EAAA;AACtB,EAAA,MAAM,EAAE,UAAA,EAAY,KAAO,EAAA,MAAA,EAAW,GAAA,KAAA,CAAA;AACtC,EAAM,MAAA,CAAC,MAAM,OAAO,CAAA,GAAIA,eAAS,EAAE,KAAA,EAAO,QAAQ,CAAA,CAAA;AAClD,EAAM,MAAA,GAAA,GAAMC,aAAgB,IAAI,CAAA,CAAA;AAEhC,EAAA,MAAM,YAAe,GAAAC,iBAAA,CAAY,SAASC,aAAAA,CAAa,WAAsB,EAAA;AAC3E,IAAA,IAAI,WAAY,CAAA,KAAA,GAAQ,CAAK,IAAA,WAAA,CAAY,SAAS,CAAG,EAAA;AACnD,MAAQ,OAAA,CAAA;AAAA,QACN,OAAO,WAAY,CAAA,KAAA;AAAA,QACnB,QAAQ,WAAY,CAAA,MAAA;AAAA,OACrB,CAAA,CAAA;AAAA,KACH;AAAA,GACF,EAAG,EAAE,CAAA,CAAA;AAEL,EAAAC,8BAAA,CAA0B,MAAM;AAC9B,IAAQ,OAAA,CAAA,EAAE,KAAO,EAAA,MAAA,EAAQ,CAAA,CAAA;AAAA,GACxB,EAAA,CAAC,KAAO,EAAA,MAAM,CAAC,CAAA,CAAA;AAElB,EAAAA,8BAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,UAAY,EAAA;AACd,MAAI,IAAA,QAAA,CAAA;AACJ,MAAA,IAAI,IAAI,OAAS,EAAA;AACf,QAAa,YAAA,CAAA,GAAA,CAAI,OAAQ,CAAA,qBAAA,EAAuB,CAAA,CAAA;AAChD,QAAA,QAAA,GAAW,IAAI,cAAA;AAAA,UACb,CAAC,CAAC,EAAE,WAAA,EAAa,CAA6B,KAAA;AAC5C,YAAA,YAAA,CAAa,WAAW,CAAA,CAAA;AAAA,WAC1B;AAAA,SACF,CAAA;AACA,QAAS,QAAA,CAAA,OAAA,CAAQ,IAAI,OAAO,CAAA,CAAA;AAAA,OAC9B;AACA,MAAA,OAAO,MAAM;AACX,QAAA,IAAI,QAAU,EAAA;AACZ,UAAA,QAAA,CAAS,UAAW,EAAA,CAAA;AAAA,SACtB;AAAA,OACF,CAAA;AAAA,KACF;AAAA,GACC,EAAA,CAAC,YAAc,EAAA,UAAU,CAAC,CAAA,CAAA;AAE7B,EAAO,OAAA,CAAC,KAAK,IAAI,CAAA,CAAA;AACnB;;;;"}

package/dist-cjs/packages/lab/src/list-deprecated/internal/useWidth.js

@@ -0,0 +1,35 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var core = require('@salt-ds/core');
+var React = require('react');
+
+function useWidth(responsive) {
+  const [width, setWidth] = React.useState();
+  const ref = React.useRef();
+  const handleResize = React.useCallback(function handleResize2(contentRect) {
+    setWidth(contentRect.width);
+  }, []);
+  core.useIsomorphicLayoutEffect(() => {
+    if (!ref.current) {
+      return void 0;
+    }
+    handleResize(ref.current.getBoundingClientRect());
+    if (responsive) {
+      const observer = new ResizeObserver(
+        ([{ contentRect }]) => {
+          handleResize(contentRect);
+        }
+      );
+      observer.observe(ref.current);
+      return () => {
+        observer.disconnect();
+      };
+    }
+  }, [handleResize, responsive]);
+  return [ref, width];
+}
+
+exports.useWidth = useWidth;
+//# sourceMappingURL=useWidth.js.map

package/dist-cjs/packages/lab/src/list-deprecated/internal/useWidth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useWidth.js","sources":["../src/list-deprecated/internal/useWidth.ts"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\nimport { RefObject, useCallback, useRef, useState } from \"react\";\n\nexport function useWidth<Element extends HTMLElement>(\n  responsive: boolean\n): [RefObject<Element>, number] {\n  const [width, setWidth] = useState<number>();\n  const ref = useRef<Element>();\n\n  const handleResize = useCallback(function handleResize(contentRect: DOMRect) {\n    setWidth(contentRect.width);\n  }, []);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!ref.current) {\n      return undefined;\n    }\n\n    handleResize(ref.current.getBoundingClientRect());\n\n    if (responsive) {\n      const observer = new ResizeObserver(\n        ([{ contentRect }]: ResizeObserverEntry[]) => {\n          handleResize(contentRect);\n        }\n      );\n      observer.observe(ref.current);\n\n      return () => {\n        observer.disconnect();\n      };\n    }\n  }, [handleResize, responsive]);\n\n  return [ref, width] as [RefObject<Element>, number];\n}\n"],"names":["useState","useRef","useCallback","handleResize","useIsomorphicLayoutEffect"],"mappings":";;;;;;;AAGO,SAAS,SACd,UAC8B,EAAA;AAC9B,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIA,cAAiB,EAAA,CAAA;AAC3C,EAAA,MAAM,MAAMC,YAAgB,EAAA,CAAA;AAE5B,EAAA,MAAM,YAAe,GAAAC,iBAAA,CAAY,SAASC,aAAAA,CAAa,WAAsB,EAAA;AAC3E,IAAA,QAAA,CAAS,YAAY,KAAK,CAAA,CAAA;AAAA,GAC5B,EAAG,EAAE,CAAA,CAAA;AAEL,EAAAC,8BAAA,CAA0B,MAAM;AAC9B,IAAI,IAAA,CAAC,IAAI,OAAS,EAAA;AAChB,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACT;AAEA,IAAa,YAAA,CAAA,GAAA,CAAI,OAAQ,CAAA,qBAAA,EAAuB,CAAA,CAAA;AAEhD,IAAA,IAAI,UAAY,EAAA;AACd,MAAA,MAAM,WAAW,IAAI,cAAA;AAAA,QACnB,CAAC,CAAC,EAAE,WAAA,EAAa,CAA6B,KAAA;AAC5C,UAAA,YAAA,CAAa,WAAW,CAAA,CAAA;AAAA,SAC1B;AAAA,OACF,CAAA;AACA,MAAS,QAAA,CAAA,OAAA,CAAQ,IAAI,OAAO,CAAA,CAAA;AAE5B,MAAA,OAAO,MAAM;AACX,QAAA,QAAA,CAAS,UAAW,EAAA,CAAA;AAAA,OACtB,CAAA;AAAA,KACF;AAAA,GACC,EAAA,CAAC,YAAc,EAAA,UAAU,CAAC,CAAA,CAAA;AAE7B,EAAO,OAAA,CAAC,KAAK,KAAK,CAAA,CAAA;AACpB;;;;"}

package/dist-cjs/packages/lab/src/list-deprecated/itemToString.js

@@ -0,0 +1,24 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var helpers = require('./internal/helpers.js');
+
+function itemToString(item) {
+  if (!helpers.isPlainObject(item)) {
+    return String(item);
+  }
+  if (Object.prototype.hasOwnProperty.call(item, "label")) {
+    return String(item.label);
+  }
+  console.warn(
+    [
+      "itemToString: you've likely forgotten to set the label prop on the item object.",
+      "You can also provide your own `itemToString` implementation."
+    ].join("\n")
+  );
+  return "";
+}
+
+exports.itemToString = itemToString;
+//# sourceMappingURL=itemToString.js.map

package/dist-cjs/packages/lab/src/list-deprecated/itemToString.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"itemToString.js","sources":["../src/list-deprecated/itemToString.ts"],"sourcesContent":["import { isPlainObject } from \"./internal/helpers\";\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type ItemToStringFunction = (item: any) => string;\n\nexport function itemToString(item: any) {\n  if (!isPlainObject(item)) {\n    return String(item);\n  }\n\n  if (Object.prototype.hasOwnProperty.call(item, \"label\")) {\n    return String(item.label);\n  }\n\n  console.warn(\n    [\n      \"itemToString: you've likely forgotten to set the label prop on the item object.\",\n      \"You can also provide your own `itemToString` implementation.\",\n    ].join(\"\\n\")\n  );\n\n  return \"\";\n}\n"],"names":["isPlainObject"],"mappings":";;;;;;AAKO,SAAS,aAAa,IAAW,EAAA;AACtC,EAAI,IAAA,CAACA,qBAAc,CAAA,IAAI,CAAG,EAAA;AACxB,IAAA,OAAO,OAAO,IAAI,CAAA,CAAA;AAAA,GACpB;AAEA,EAAA,IAAI,OAAO,SAAU,CAAA,cAAA,CAAe,IAAK,CAAA,IAAA,EAAM,OAAO,CAAG,EAAA;AACvD,IAAO,OAAA,MAAA,CAAO,KAAK,KAAK,CAAA,CAAA;AAAA,GAC1B;AAEA,EAAQ,OAAA,CAAA,IAAA;AAAA,IACN;AAAA,MACE,iFAAA;AAAA,MACA,8DAAA;AAAA,KACF,CAAE,KAAK,IAAI,CAAA;AAAA,GACb,CAAA;AAEA,EAAO,OAAA,EAAA,CAAA;AACT;;;;"}

package/dist-cjs/packages/lab/src/list-deprecated/useList.js

@@ -0,0 +1,436 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var core = require('@salt-ds/core');
+var React = require('react');
+
+function useList(props = {}) {
+  validateProps(props);
+  const generatedId = core.useId(props.id);
+  const {
+    id = generatedId,
+    source = [],
+    itemCount = source.length,
+    getItemId = (index) => `${id}-item-${index}`,
+    getItemAtIndex: getItemAtIndexProp,
+    getItemIndex: getItemIndexProp,
+    displayedItemCount = 10,
+    initialSelectedItem,
+    selectionVariant,
+    disabled = false,
+    onBlur,
+    onChange,
+    onFocus,
+    onKeyDown,
+    onMouseDown,
+    onMouseLeave,
+    onSelect,
+    disableMouseDown,
+    restoreLastFocus,
+    highlightedIndex: highlightedIndexProp,
+    selectedItem: selectedItemProp,
+    tabToSelect,
+    ...restProps
+  } = props;
+  const {
+    isFocusVisibleRef,
+    onFocus: handleFocusVisible,
+    onBlur: handleBlurVisible,
+    ref: focusVisibleRef
+  } = core.useIsFocusVisible();
+  const { current: isDeselectable } = React.useRef(
+    selectionVariant === "deselectable"
+  );
+  const { current: isMultiSelect } = React.useRef(
+    selectionVariant === "multiple" || selectionVariant === "extended" || Array.isArray(initialSelectedItem) || Array.isArray(selectedItemProp)
+  );
+  const { current: isExtendedSelect } = React.useRef(selectionVariant === "extended");
+  let getItemIndex = React.useCallback(
+    (item) => source.indexOf(item),
+    [source]
+  );
+  let getItemAtIndex = React.useCallback((index) => source[index], [source]);
+  const indexComparator = React.useCallback(
+    (a, b) => getItemIndex(a) - getItemIndex(b),
+    [getItemIndex]
+  );
+  if (typeof getItemIndexProp === "function" && typeof getItemAtIndexProp === "function") {
+    getItemIndex = getItemIndexProp;
+    getItemAtIndex = getItemAtIndexProp;
+  }
+  const rootRef = React.useRef();
+  const [focusVisible, setFocusVisible] = React.useState(false);
+  const [lastFocusedIndex, setLastFocusedIndex] = React.useState(-1);
+  const [selectedItem, setSelectedItem] = core.useControlled({
+    controlled: selectedItemProp,
+    default: initialSelectedItem != null ? initialSelectedItem : isMultiSelect ? [] : null,
+    name: "useList",
+    state: "selectedItem"
+  });
+  const [highlightedIndex, setHighlightedIndex] = core.useControlled({
+    controlled: highlightedIndexProp,
+    default: void 0,
+    name: "useList",
+    state: "highlightedIndex"
+  });
+  const handleSingleSelect = React.useCallback(
+    (event, index, item) => {
+      const isSelected = item === selectedItem;
+      let nextItem;
+      if (isSelected && !isDeselectable) {
+        return;
+      }
+      if (!isSelected) {
+        nextItem = item;
+        setHighlightedIndex(index);
+      } else {
+        nextItem = null;
+      }
+      setSelectedItem(
+        nextItem
+      );
+      if (onChange) {
+        onChange(
+          event,
+          nextItem
+        );
+      }
+    },
+    [
+      isDeselectable,
+      onChange,
+      selectedItem,
+      setHighlightedIndex,
+      setSelectedItem
+    ]
+  );
+  const handleMultiSelect = React.useCallback(
+    (event, index, item) => {
+      const isSelected = selectedItem.indexOf(item) !== -1;
+      let nextItems = selectedItem;
+      if (!isSelected) {
+        nextItems = nextItems.concat([item]).sort(indexComparator);
+        setHighlightedIndex(index);
+      } else {
+        nextItems = nextItems.filter((selected) => selected !== item);
+      }
+      setSelectedItem(
+        nextItems
+      );
+      if (onChange) {
+        onChange(
+          event,
+          nextItems
+        );
+      }
+    },
+    [
+      indexComparator,
+      onChange,
+      selectedItem,
+      setHighlightedIndex,
+      setSelectedItem
+    ]
+  );
+  const handleRangeSelect = React.useCallback(
+    (event, index) => {
+      var _a;
+      const currentSelection = event.ctrlKey || event.metaKey ? selectedItem : [];
+      const lastSelectedItemIndex = selectedItem.length > 0 ? getItemIndex(
+        selectedItem[selectedItem.length - 1]
+      ) : 0;
+      const startRegion = Math.min(
+        index != null ? index : lastSelectedItemIndex,
+        lastSelectedItemIndex
+      );
+      const endRegion = Math.max(
+        index != null ? index : lastSelectedItemIndex,
+        lastSelectedItemIndex
+      );
+      const rangeSelection = source.slice(startRegion, endRegion + 1);
+      const nextItems = [
+        .../* @__PURE__ */ new Set([...currentSelection, ...rangeSelection])
+      ];
+      (_a = core.ownerDocument(event.currentTarget).getSelection()) == null ? void 0 : _a.removeAllRanges();
+      setSelectedItem(
+        nextItems
+      );
+      if (onChange) {
+        onChange(
+          event,
+          nextItems
+        );
+      }
+    },
+    [getItemIndex, onChange, selectedItem, setSelectedItem, source]
+  );
+  const handleExtendedSelect = React.useCallback(
+    (event, index, item) => {
+      let nextItems = selectedItem;
+      if (event.shiftKey) {
+        handleRangeSelect(event, index);
+      } else if (selectedItem.length === 0 || event.ctrlKey || event.metaKey) {
+        console.log("handleMulti");
+        handleMultiSelect(event, index, item);
+      } else {
+        nextItems = [item];
+        setSelectedItem(
+          nextItems
+        );
+        if (onChange) {
+          onChange(
+            event,
+            nextItems
+          );
+        }
+      }
+    },
+    [
+      handleMultiSelect,
+      handleRangeSelect,
+      onChange,
+      selectedItem,
+      setSelectedItem
+    ]
+  );
+  const handleSelect = React.useCallback(
+    (event, index, item) => {
+      if (item == null || item.disabled) {
+        return;
+      }
+      if (onSelect) {
+        console.log("onSelect");
+        onSelect(event, item);
+      }
+      if (isExtendedSelect) {
+        handleExtendedSelect(event, index, item);
+      } else if (isMultiSelect) {
+        handleMultiSelect(event, index, item);
+      } else {
+        handleSingleSelect(event, index, item);
+      }
+    },
+    [
+      handleExtendedSelect,
+      handleMultiSelect,
+      handleSingleSelect,
+      isExtendedSelect,
+      isMultiSelect,
+      onSelect
+    ]
+  );
+  const saveFocusedIndex = (index) => {
+    setLastFocusedIndex(index);
+    return index;
+  };
+  const keyDownHandlers = {
+    ArrowUp: (event) => {
+      event.preventDefault();
+      setHighlightedIndex(
+        (prevHighlightedIndex) => saveFocusedIndex(Math.max(0, (prevHighlightedIndex != null ? prevHighlightedIndex : itemCount) - 1))
+      );
+    },
+    ArrowDown: (event) => {
+      event.preventDefault();
+      setHighlightedIndex(
+        (prevHighlightedIndex) => saveFocusedIndex(
+          Math.min(itemCount - 1, (prevHighlightedIndex != null ? prevHighlightedIndex : -1) + 1)
+        )
+      );
+    },
+    PageUp: (event) => {
+      event.preventDefault();
+      setHighlightedIndex(
+        (prevHighlightedIndex) => saveFocusedIndex(
+          Math.max(
+            0,
+            (prevHighlightedIndex != null ? prevHighlightedIndex : displayedItemCount) - displayedItemCount
+          )
+        )
+      );
+    },
+    PageDown: (event) => {
+      event.preventDefault();
+      setHighlightedIndex(
+        (prevHighlightedIndex) => saveFocusedIndex(
+          Math.min(
+            itemCount - 1,
+            (prevHighlightedIndex != null ? prevHighlightedIndex : 0) + displayedItemCount
+          )
+        )
+      );
+    },
+    Home: (event) => {
+      event.preventDefault();
+      setHighlightedIndex(saveFocusedIndex(0));
+    },
+    End: (event) => {
+      event.preventDefault();
+      setHighlightedIndex(saveFocusedIndex(itemCount - 1));
+    },
+    Enter: (event) => {
+      event.preventDefault();
+      handleSelect(
+        event,
+        highlightedIndex,
+        highlightedIndex != null && highlightedIndex > -1 ? getItemAtIndex(highlightedIndex) : null
+      );
+    },
+    " ": (event) => {
+      event.preventDefault();
+      handleSelect(
+        event,
+        highlightedIndex,
+        highlightedIndex != null && highlightedIndex > -1 ? getItemAtIndex(highlightedIndex) : null
+      );
+    },
+    Tab: (event) => {
+      if (tabToSelect) {
+        handleSelect(
+          event,
+          highlightedIndex,
+          highlightedIndex != null && highlightedIndex > -1 ? getItemAtIndex(highlightedIndex) : null
+        );
+      } else {
+        setHighlightedIndex(void 0);
+      }
+    }
+  };
+  const handleKeyDown = (event) => {
+    if (isFocusVisibleRef.current) {
+      setFocusVisible(true);
+    }
+    const handler = keyDownHandlers[event.key];
+    if (handler) {
+      handler(event);
+    }
+    if (onKeyDown) {
+      onKeyDown(event);
+    }
+  };
+  const handleFocus = (event) => {
+    handleFocusVisible(event);
+    if (isFocusVisibleRef.current) {
+      setFocusVisible(true);
+    }
+    if (highlightedIndex === void 0) {
+      const firstSelectedItem = isMultiSelect ? selectedItem[0] : selectedItem;
+      setHighlightedIndex(
+        Math.max(
+          restoreLastFocus ? lastFocusedIndex : firstSelectedItem ? getItemIndex(firstSelectedItem) : -1,
+          0
+        )
+      );
+    }
+    if (onFocus) {
+      onFocus(event);
+    }
+  };
+  const handleBlur = (event) => {
+    setHighlightedIndex(void 0);
+    handleBlurVisible();
+    if (!isFocusVisibleRef.current) {
+      setFocusVisible(false);
+    }
+    if (onBlur) {
+      onBlur(event);
+    }
+  };
+  const handleMouseDown = (event) => {
+    if (disableMouseDown) {
+      event.preventDefault();
+    } else if (onMouseDown) {
+      onMouseDown(event);
+    }
+  };
+  const handleMouseLeave = (event) => {
+    if (focusVisible && id) {
+      const rootNode = (rootRef.current || core.ownerDocument(event.currentTarget)).getRootNode();
+      const listNode = rootNode.getElementById(id);
+      if (listNode == null ? void 0 : listNode.contains(event.target)) {
+        setHighlightedIndex(void 0);
+      }
+    } else {
+      setHighlightedIndex(void 0);
+    }
+    if (onMouseLeave) {
+      onMouseLeave(event);
+    }
+  };
+  const eventHandlers = {
+    onFocus: handleFocus,
+    onBlur: handleBlur,
+    onKeyDown: handleKeyDown,
+    onMouseDown: handleMouseDown,
+    onMouseLeave: handleMouseLeave
+  };
+  const ariaProps = {
+    role: "listbox",
+    "aria-activedescendant": highlightedIndex !== void 0 && highlightedIndex >= 0 ? getItemId(highlightedIndex) : void 0
+  };
+  if (isMultiSelect) {
+    ariaProps["aria-multiselectable"] = true;
+  }
+  return {
+    focusedRef: core.useForkRef(rootRef, focusVisibleRef),
+    state: {
+      id,
+      focusVisible,
+      selectedItem,
+      highlightedIndex,
+      isDeselectable,
+      isMultiSelect,
+      isDisabled: disabled
+    },
+    helpers: {
+      setFocusVisible,
+      setSelectedItem,
+      setHighlightedIndex,
+      keyDownHandlers,
+      handleSelect
+    },
+    listProps: {
+      id,
+      source,
+      itemCount,
+      disableMouseDown,
+      displayedItemCount,
+      getItemAtIndex,
+      getItemIndex,
+      getItemId,
+      disabled,
+      ...ariaProps,
+      ...restProps,
+      ...disabled ? {} : eventHandlers
+    }
+  };
+}
+const validateProps = (props) => {
+  if (process.env.NODE_ENV !== "production") {
+    const { source, itemCount, getItemIndex, getItemAtIndex } = props;
+    const hasIndexer = typeof getItemIndex === "function" && typeof getItemAtIndex === "function";
+    const hasNoIndexer = getItemIndex === void 0 && getItemAtIndex === void 0;
+    const sourceNotArray = !Array.isArray(source);
+    React.useEffect(() => {
+      if (sourceNotArray) {
+        console.error("`source` for useList must be an array.");
+      }
+    }, [sourceNotArray]);
+    React.useEffect(() => {
+      if (!hasNoIndexer && !hasIndexer) {
+        console.error(
+          "useList needs to have both `getItemIndex` and `getItemAtIndex`."
+        );
+      }
+      if (!hasNoIndexer && itemCount === void 0) {
+        console.error(
+          "useList needs to have `itemCount` if an indexer is used."
+        );
+      }
+    }, [hasIndexer, hasNoIndexer, itemCount]);
+  }
+};
+
+exports.useList = useList;
+//# sourceMappingURL=useList.js.map