react-aria 3.48.0 → 3.50.0

package/dist/private/selection/useTypeSelect.js

@@ -1,5 +1,5 @@
 import {getEventTarget as $d8ac7ed472840322$export$e58f029f0fbfdb29, nodeContains as $d8ac7ed472840322$export$4282f70798064fe0} from "../utils/shadowdom/DOMFunctions.js";
-import {useRef as $hxkp5$useRef} from "react";
+import {useRef as $hxkp5$useRef, useEffect as $hxkp5$useEffect} from "react";
 
 /*
  * Copyright 2020 Adobe. All rights reserved.
@@ -21,40 +21,72 @@ function $d6feb9780eea1a71$export$e32c88dfddc6e1d8(options) {
     let state = (0, $hxkp5$useRef)({
         search: '',
         timeout: undefined
-    }).current;
-    let onKeyDown = (e)=>{
-        let character = $d6feb9780eea1a71$var$getStringForKey(e.key);
-        if (!character || e.ctrlKey || e.metaKey || !(0, $d8ac7ed472840322$export$4282f70798064fe0)(e.currentTarget, (0, $d8ac7ed472840322$export$e58f029f0fbfdb29)(e)) || state.search.length === 0 && character === ' ') return;
-        // Do not propagate the Spacebar event if it's meant to be part of the search.
-        // When we time out, the search term becomes empty, hence the check on length.
-        // Trimming is to account for the case of pressing the Spacebar more than once,
-        // which should cycle through the selection/deselection of the focused item.
-        if (character === ' ' && state.search.trim().length > 0) {
+    });
+    let onKeyDownCapture = (e)=>{
+        // if we're in the middle of a search, then a spacebar should be treated as a search and we should not propagate the event
+        // since we handle this one in a capture phase, we should ignore it in the bubble phase
+        if (state.current.search.length > 0 && e.key === ' ') {
             e.preventDefault();
-            if (!('continuePropagation' in e)) e.stopPropagation();
+            if (!('continuePropagation' in e) || 'continuePropagation' in e && !e.isPropagationStopped()) e.stopPropagation();
+            state.current.search += ' ';
+            if (keyboardDelegate.getKeyForSearch != null) {
+                // Use the delegate to find a key to focus.
+                // Prioritize items after the currently focused item, falling back to searching the whole list.
+                let key = keyboardDelegate.getKeyForSearch(state.current.search, selectionManager.focusedKey);
+                // If no key found, search from the top.
+                if (key == null) key = keyboardDelegate.getKeyForSearch(state.current.search);
+                if (key != null) {
+                    selectionManager.setFocusedKey(key);
+                    if (onTypeSelect) onTypeSelect(key);
+                }
+            }
+            clearTimeout(state.current.timeout);
+            state.current.timeout = setTimeout(()=>{
+                state.current.search = '';
+            }, $d6feb9780eea1a71$var$TYPEAHEAD_DEBOUNCE_WAIT_MS);
         }
-        state.search += character;
+    };
+    let onKeyDown = (e)=>{
+        let character = $d6feb9780eea1a71$var$getStringForKey(e.key);
+        if (!character || e.ctrlKey || e.metaKey || e.altKey || !(0, $d8ac7ed472840322$export$4282f70798064fe0)(e.currentTarget, (0, $d8ac7ed472840322$export$e58f029f0fbfdb29)(e)) || state.current.search.length === 0 && character === ' ') return;
+        state.current.search += character;
         if (keyboardDelegate.getKeyForSearch != null) {
             // Use the delegate to find a key to focus.
             // Prioritize items after the currently focused item, falling back to searching the whole list.
-            let key = keyboardDelegate.getKeyForSearch(state.search, selectionManager.focusedKey);
-            // If no key found, search from the top.
-            if (key == null) key = keyboardDelegate.getKeyForSearch(state.search);
+            let key = keyboardDelegate.getKeyForSearch(state.current.search, selectionManager.focusedKey);
+            if (key == null) key = keyboardDelegate.getKeyForSearch(state.current.search);
             if (key != null) {
                 selectionManager.setFocusedKey(key);
                 if (onTypeSelect) onTypeSelect(key);
+                e.preventDefault();
+                if (!('continuePropagation' in e)) e.stopPropagation();
+            } else {
+                // if still nothing then the type to select is done and everything is reset
+                state.current.search = '';
+                clearTimeout(state.current.timeout);
+                state.current.timeout = undefined;
+                return;
             }
         }
-        clearTimeout(state.timeout);
-        state.timeout = setTimeout(()=>{
-            state.search = '';
+        clearTimeout(state.current.timeout);
+        state.current.timeout = setTimeout(()=>{
+            state.current.search = '';
         }, $d6feb9780eea1a71$var$TYPEAHEAD_DEBOUNCE_WAIT_MS);
     };
+    (0, $hxkp5$useEffect)(()=>{
+        let timeout = state.current.timeout;
+        return ()=>{
+            clearTimeout(timeout);
+        };
+    }, [
+        state
+    ]);
     return {
         typeSelectProps: {
             // Using a capturing listener to catch the keydown event before
             // other hooks in order to handle the Spacebar event.
-            onKeyDownCapture: keyboardDelegate.getKeyForSearch ? onKeyDown : undefined
+            onKeyDownCapture: keyboardDelegate.getKeyForSearch ? onKeyDownCapture : undefined,
+            onKeyDown: keyboardDelegate.getKeyForSearch ? onKeyDown : undefined
         }
     };
 }

package/dist/private/selection/useTypeSelect.js.map

@@ -1 +1 @@
-{"mappings":";;;AAAA;;;;;;;;;;CAUC;;AAOD;;CAEC,GACD,MAAM,mDAA6B,MAAM,WAAW;AA2B7C,SAAS,0CAAc,OAA8B;IAC1D,IAAI,oBAAC,gBAAgB,oBAAE,gBAAgB,gBAAE,YAAY,EAAC,GAAG;IACzD,IAAI,QAAQ,CAAA,GAAA,aAAK,EAAwE;QACvF,QAAQ;QACR,SAAS;IACX,GAAG,OAAO;IAEV,IAAI,YAAY,CAAC;QACf,IAAI,YAAY,sCAAgB,EAAE,GAAG;QACrC,IAAI,CAAC,aAAa,EAAE,OAAO,IAAI,EAAE,OAAO,IAAI,CAAC,CAAA,GAAA,yCAAW,EAAE,EAAE,aAAa,EAAE,CAAA,GAAA,yCAAa,EAAE,OAAuB,MAAM,MAAM,CAAC,MAAM,KAAK,KAAK,cAAc,KAC1J;QAGF,8EAA8E;QAC9E,8EAA8E;QAC9E,+EAA+E;QAC/E,4EAA4E;QAC5E,IAAI,cAAc,OAAO,MAAM,MAAM,CAAC,IAAI,GAAG,MAAM,GAAG,GAAG;YACvD,EAAE,cAAc;YAChB,IAAI,CAAE,CAAA,yBAAyB,CAAA,GAC7B,EAAE,eAAe;QAErB;QAEA,MAAM,MAAM,IAAI;QAEhB,IAAI,iBAAiB,eAAe,IAAI,MAAM;YAC5C,2CAA2C;YAC3C,+FAA+F;YAC/F,IAAI,MAAM,iBAAiB,eAAe,CAAC,MAAM,MAAM,EAAE,iBAAiB,UAAU;YAEpF,wCAAwC;YACxC,IAAI,OAAO,MACT,MAAM,iBAAiB,eAAe,CAAC,MAAM,MAAM;YAGrD,IAAI,OAAO,MAAM;gBACf,iBAAiB,aAAa,CAAC;gBAC/B,IAAI,cACF,aAAa;YAEjB;QACF;QAEA,aAAa,MAAM,OAAO;QAC1B,MAAM,OAAO,GAAG,WAAW;YACzB,MAAM,MAAM,GAAG;QACjB,GAAG;IACL;IAEA,OAAO;QACL,iBAAiB;YACf,+DAA+D;YAC/D,qDAAqD;YACrD,kBAAkB,iBAAiB,eAAe,GAAG,YAAY;QACnE;IACF;AACF;AAEA,SAAS,sCAAgB,GAAW;IAClC,mDAAmD;IACnD,+DAA+D;IAC/D,6BAA6B;IAC7B,0CAA0C;IAC1C,IAAI,IAAI,MAAM,KAAK,KAAK,CAAC,UAAU,IAAI,CAAC,MACtC,OAAO;IAGT,OAAO;AACT","sources":["packages/react-aria/src/selection/useTypeSelect.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {DOMAttributes, Key, KeyboardDelegate} from '@react-types/shared';\nimport {getEventTarget, nodeContains} from '../utils/shadowdom/DOMFunctions';\nimport {KeyboardEvent, useRef} from 'react';\nimport {MultipleSelectionManager} from 'react-stately/useMultipleSelectionState';\n\n/**\n * Controls how long to wait before clearing the typeahead buffer.\n */\nconst TYPEAHEAD_DEBOUNCE_WAIT_MS = 1000; // 1 second\n\nexport interface AriaTypeSelectOptions {\n  /**\n   * A delegate that returns collection item keys with respect to visual layout.\n   */\n  keyboardDelegate: KeyboardDelegate,\n  /**\n   * An interface for reading and updating multiple selection state.\n   */\n  selectionManager: MultipleSelectionManager,\n  /**\n   * Called when an item is focused by typing.\n   */\n  onTypeSelect?: (key: Key) => void\n}\n\nexport interface TypeSelectAria {\n  /**\n   * Props to be spread on the owner of the options.\n   */\n  typeSelectProps: DOMAttributes\n}\n\n/**\n * Handles typeahead interactions with collections.\n */\nexport function useTypeSelect(options: AriaTypeSelectOptions): TypeSelectAria {\n  let {keyboardDelegate, selectionManager, onTypeSelect} = options;\n  let state = useRef<{search: string, timeout: ReturnType<typeof setTimeout> | undefined}>({\n    search: '',\n    timeout: undefined\n  }).current;\n\n  let onKeyDown = (e: KeyboardEvent) => {\n    let character = getStringForKey(e.key);\n    if (!character || e.ctrlKey || e.metaKey || !nodeContains(e.currentTarget, getEventTarget(e) as HTMLElement) || (state.search.length === 0 && character === ' ')) {\n      return;\n    }\n\n    // Do not propagate the Spacebar event if it's meant to be part of the search.\n    // When we time out, the search term becomes empty, hence the check on length.\n    // Trimming is to account for the case of pressing the Spacebar more than once,\n    // which should cycle through the selection/deselection of the focused item.\n    if (character === ' ' && state.search.trim().length > 0) {\n      e.preventDefault();\n      if (!('continuePropagation' in e)) {\n        e.stopPropagation();\n      }\n    }\n\n    state.search += character;\n\n    if (keyboardDelegate.getKeyForSearch != null) {\n      // Use the delegate to find a key to focus.\n      // Prioritize items after the currently focused item, falling back to searching the whole list.\n      let key = keyboardDelegate.getKeyForSearch(state.search, selectionManager.focusedKey);\n\n      // If no key found, search from the top.\n      if (key == null) {\n        key = keyboardDelegate.getKeyForSearch(state.search);\n      }\n\n      if (key != null) {\n        selectionManager.setFocusedKey(key);\n        if (onTypeSelect) {\n          onTypeSelect(key);\n        }\n      }\n    }\n\n    clearTimeout(state.timeout);\n    state.timeout = setTimeout(() => {\n      state.search = '';\n    }, TYPEAHEAD_DEBOUNCE_WAIT_MS);\n  };\n\n  return {\n    typeSelectProps: {\n      // Using a capturing listener to catch the keydown event before\n      // other hooks in order to handle the Spacebar event.\n      onKeyDownCapture: keyboardDelegate.getKeyForSearch ? onKeyDown : undefined\n    }\n  };\n}\n\nfunction getStringForKey(key: string) {\n  // If the key is of length 1, it is an ASCII value.\n  // Otherwise, if there are no ASCII characters in the key name,\n  // it is a Unicode character.\n  // See https://www.w3.org/TR/uievents-key/\n  if (key.length === 1 || !/^[A-Z]/i.test(key)) {\n    return key;\n  }\n\n  return '';\n}\n"],"names":[],"version":3,"file":"useTypeSelect.js.map"}
+{"mappings":"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","sources":["packages/react-aria/src/selection/useTypeSelect.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {DOMAttributes, Key, KeyboardDelegate} from '@react-types/shared';\nimport {getEventTarget, nodeContains} from '../utils/shadowdom/DOMFunctions';\nimport {KeyboardEvent, useEffect, useRef} from 'react';\nimport {MultipleSelectionManager} from 'react-stately/useMultipleSelectionState';\n\n/**\n * Controls how long to wait before clearing the typeahead buffer.\n */\nconst TYPEAHEAD_DEBOUNCE_WAIT_MS = 1000; // 1 second\n\nexport interface AriaTypeSelectOptions {\n  /**\n   * A delegate that returns collection item keys with respect to visual layout.\n   */\n  keyboardDelegate: KeyboardDelegate;\n  /**\n   * An interface for reading and updating multiple selection state.\n   */\n  selectionManager: MultipleSelectionManager;\n  /**\n   * Called when an item is focused by typing.\n   */\n  onTypeSelect?: (key: Key) => void;\n}\n\nexport interface TypeSelectAria {\n  /**\n   * Props to be spread on the owner of the options.\n   */\n  typeSelectProps: DOMAttributes;\n}\n\n/**\n * Handles typeahead interactions with collections.\n */\nexport function useTypeSelect(options: AriaTypeSelectOptions): TypeSelectAria {\n  let {keyboardDelegate, selectionManager, onTypeSelect} = options;\n  let state = useRef<{search: string; timeout: ReturnType<typeof setTimeout> | undefined}>({\n    search: '',\n    timeout: undefined\n  });\n\n  let onKeyDownCapture = (e: KeyboardEvent) => {\n    // if we're in the middle of a search, then a spacebar should be treated as a search and we should not propagate the event\n    // since we handle this one in a capture phase, we should ignore it in the bubble phase\n    if (state.current.search.length > 0 && e.key === ' ') {\n      e.preventDefault();\n      if (\n        !('continuePropagation' in e) ||\n        ('continuePropagation' in e && !e.isPropagationStopped())\n      ) {\n        e.stopPropagation();\n      }\n      state.current.search += ' ';\n\n      if (keyboardDelegate.getKeyForSearch != null) {\n        // Use the delegate to find a key to focus.\n        // Prioritize items after the currently focused item, falling back to searching the whole list.\n        let key = keyboardDelegate.getKeyForSearch(\n          state.current.search,\n          selectionManager.focusedKey\n        );\n\n        // If no key found, search from the top.\n        if (key == null) {\n          key = keyboardDelegate.getKeyForSearch(state.current.search);\n        }\n\n        if (key != null) {\n          selectionManager.setFocusedKey(key);\n          if (onTypeSelect) {\n            onTypeSelect(key);\n          }\n        }\n      }\n\n      clearTimeout(state.current.timeout);\n      state.current.timeout = setTimeout(() => {\n        state.current.search = '';\n      }, TYPEAHEAD_DEBOUNCE_WAIT_MS);\n    }\n  };\n\n  let onKeyDown = (e: KeyboardEvent) => {\n    let character = getStringForKey(e.key);\n    if (\n      !character ||\n      e.ctrlKey ||\n      e.metaKey ||\n      e.altKey ||\n      !nodeContains(e.currentTarget, getEventTarget(e) as HTMLElement) ||\n      (state.current.search.length === 0 && character === ' ')\n    ) {\n      return;\n    }\n\n    state.current.search += character;\n\n    if (keyboardDelegate.getKeyForSearch != null) {\n      // Use the delegate to find a key to focus.\n      // Prioritize items after the currently focused item, falling back to searching the whole list.\n      let key = keyboardDelegate.getKeyForSearch(state.current.search, selectionManager.focusedKey);\n\n      if (key == null) {\n        key = keyboardDelegate.getKeyForSearch(state.current.search);\n      }\n\n      if (key != null) {\n        selectionManager.setFocusedKey(key);\n        if (onTypeSelect) {\n          onTypeSelect(key);\n        }\n        e.preventDefault();\n        if (!('continuePropagation' in e)) {\n          e.stopPropagation();\n        }\n      } else {\n        // if still nothing then the type to select is done and everything is reset\n        state.current.search = '';\n        clearTimeout(state.current.timeout);\n        state.current.timeout = undefined;\n        return;\n      }\n    }\n\n    clearTimeout(state.current.timeout);\n    state.current.timeout = setTimeout(() => {\n      state.current.search = '';\n    }, TYPEAHEAD_DEBOUNCE_WAIT_MS);\n  };\n\n  useEffect(() => {\n    let timeout = state.current.timeout;\n    return () => {\n      clearTimeout(timeout);\n    };\n  }, [state]);\n\n  return {\n    typeSelectProps: {\n      // Using a capturing listener to catch the keydown event before\n      // other hooks in order to handle the Spacebar event.\n      onKeyDownCapture: keyboardDelegate.getKeyForSearch ? onKeyDownCapture : undefined,\n      onKeyDown: keyboardDelegate.getKeyForSearch ? onKeyDown : undefined\n    }\n  };\n}\n\nfunction getStringForKey(key: string) {\n  // If the key is of length 1, it is an ASCII value.\n  // Otherwise, if there are no ASCII characters in the key name,\n  // it is a Unicode character.\n  // See https://www.w3.org/TR/uievents-key/\n  if (key.length === 1 || !/^[A-Z]/i.test(key)) {\n    return key;\n  }\n\n  return '';\n}\n"],"names":[],"version":3,"file":"useTypeSelect.js.map"}

package/dist/private/selection/useTypeSelect.mjs

@@ -1,5 +1,5 @@
 import {getEventTarget as $23f2114a1b82827e$export$e58f029f0fbfdb29, nodeContains as $23f2114a1b82827e$export$4282f70798064fe0} from "../utils/shadowdom/DOMFunctions.mjs";
-import {useRef as $dLAPo$useRef} from "react";
+import {useRef as $dLAPo$useRef, useEffect as $dLAPo$useEffect} from "react";
 
 /*
  * Copyright 2020 Adobe. All rights reserved.
@@ -21,40 +21,72 @@ function $f5a4a9a3486154da$export$e32c88dfddc6e1d8(options) {
     let state = (0, $dLAPo$useRef)({
         search: '',
         timeout: undefined
-    }).current;
-    let onKeyDown = (e)=>{
-        let character = $f5a4a9a3486154da$var$getStringForKey(e.key);
-        if (!character || e.ctrlKey || e.metaKey || !(0, $23f2114a1b82827e$export$4282f70798064fe0)(e.currentTarget, (0, $23f2114a1b82827e$export$e58f029f0fbfdb29)(e)) || state.search.length === 0 && character === ' ') return;
-        // Do not propagate the Spacebar event if it's meant to be part of the search.
-        // When we time out, the search term becomes empty, hence the check on length.
-        // Trimming is to account for the case of pressing the Spacebar more than once,
-        // which should cycle through the selection/deselection of the focused item.
-        if (character === ' ' && state.search.trim().length > 0) {
+    });
+    let onKeyDownCapture = (e)=>{
+        // if we're in the middle of a search, then a spacebar should be treated as a search and we should not propagate the event
+        // since we handle this one in a capture phase, we should ignore it in the bubble phase
+        if (state.current.search.length > 0 && e.key === ' ') {
             e.preventDefault();
-            if (!('continuePropagation' in e)) e.stopPropagation();
+            if (!('continuePropagation' in e) || 'continuePropagation' in e && !e.isPropagationStopped()) e.stopPropagation();
+            state.current.search += ' ';
+            if (keyboardDelegate.getKeyForSearch != null) {
+                // Use the delegate to find a key to focus.
+                // Prioritize items after the currently focused item, falling back to searching the whole list.
+                let key = keyboardDelegate.getKeyForSearch(state.current.search, selectionManager.focusedKey);
+                // If no key found, search from the top.
+                if (key == null) key = keyboardDelegate.getKeyForSearch(state.current.search);
+                if (key != null) {
+                    selectionManager.setFocusedKey(key);
+                    if (onTypeSelect) onTypeSelect(key);
+                }
+            }
+            clearTimeout(state.current.timeout);
+            state.current.timeout = setTimeout(()=>{
+                state.current.search = '';
+            }, $f5a4a9a3486154da$var$TYPEAHEAD_DEBOUNCE_WAIT_MS);
         }
-        state.search += character;
+    };
+    let onKeyDown = (e)=>{
+        let character = $f5a4a9a3486154da$var$getStringForKey(e.key);
+        if (!character || e.ctrlKey || e.metaKey || e.altKey || !(0, $23f2114a1b82827e$export$4282f70798064fe0)(e.currentTarget, (0, $23f2114a1b82827e$export$e58f029f0fbfdb29)(e)) || state.current.search.length === 0 && character === ' ') return;
+        state.current.search += character;
         if (keyboardDelegate.getKeyForSearch != null) {
             // Use the delegate to find a key to focus.
             // Prioritize items after the currently focused item, falling back to searching the whole list.
-            let key = keyboardDelegate.getKeyForSearch(state.search, selectionManager.focusedKey);
-            // If no key found, search from the top.
-            if (key == null) key = keyboardDelegate.getKeyForSearch(state.search);
+            let key = keyboardDelegate.getKeyForSearch(state.current.search, selectionManager.focusedKey);
+            if (key == null) key = keyboardDelegate.getKeyForSearch(state.current.search);
             if (key != null) {
                 selectionManager.setFocusedKey(key);
                 if (onTypeSelect) onTypeSelect(key);
+                e.preventDefault();
+                if (!('continuePropagation' in e)) e.stopPropagation();
+            } else {
+                // if still nothing then the type to select is done and everything is reset
+                state.current.search = '';
+                clearTimeout(state.current.timeout);
+                state.current.timeout = undefined;
+                return;
             }
         }
-        clearTimeout(state.timeout);
-        state.timeout = setTimeout(()=>{
-            state.search = '';
+        clearTimeout(state.current.timeout);
+        state.current.timeout = setTimeout(()=>{
+            state.current.search = '';
         }, $f5a4a9a3486154da$var$TYPEAHEAD_DEBOUNCE_WAIT_MS);
     };
+    (0, $dLAPo$useEffect)(()=>{
+        let timeout = state.current.timeout;
+        return ()=>{
+            clearTimeout(timeout);
+        };
+    }, [
+        state
+    ]);
     return {
         typeSelectProps: {
             // Using a capturing listener to catch the keydown event before
             // other hooks in order to handle the Spacebar event.
-            onKeyDownCapture: keyboardDelegate.getKeyForSearch ? onKeyDown : undefined
+            onKeyDownCapture: keyboardDelegate.getKeyForSearch ? onKeyDownCapture : undefined,
+            onKeyDown: keyboardDelegate.getKeyForSearch ? onKeyDown : undefined
         }
     };
 }

package/dist/private/selection/useTypeSelect.mjs.map

@@ -1 +1 @@
-{"mappings":";;;AAAA;;;;;;;;;;CAUC;;AAOD;;CAEC,GACD,MAAM,mDAA6B,MAAM,WAAW;AA2B7C,SAAS,0CAAc,OAA8B;IAC1D,IAAI,oBAAC,gBAAgB,oBAAE,gBAAgB,gBAAE,YAAY,EAAC,GAAG;IACzD,IAAI,QAAQ,CAAA,GAAA,aAAK,EAAwE;QACvF,QAAQ;QACR,SAAS;IACX,GAAG,OAAO;IAEV,IAAI,YAAY,CAAC;QACf,IAAI,YAAY,sCAAgB,EAAE,GAAG;QACrC,IAAI,CAAC,aAAa,EAAE,OAAO,IAAI,EAAE,OAAO,IAAI,CAAC,CAAA,GAAA,yCAAW,EAAE,EAAE,aAAa,EAAE,CAAA,GAAA,yCAAa,EAAE,OAAuB,MAAM,MAAM,CAAC,MAAM,KAAK,KAAK,cAAc,KAC1J;QAGF,8EAA8E;QAC9E,8EAA8E;QAC9E,+EAA+E;QAC/E,4EAA4E;QAC5E,IAAI,cAAc,OAAO,MAAM,MAAM,CAAC,IAAI,GAAG,MAAM,GAAG,GAAG;YACvD,EAAE,cAAc;YAChB,IAAI,CAAE,CAAA,yBAAyB,CAAA,GAC7B,EAAE,eAAe;QAErB;QAEA,MAAM,MAAM,IAAI;QAEhB,IAAI,iBAAiB,eAAe,IAAI,MAAM;YAC5C,2CAA2C;YAC3C,+FAA+F;YAC/F,IAAI,MAAM,iBAAiB,eAAe,CAAC,MAAM,MAAM,EAAE,iBAAiB,UAAU;YAEpF,wCAAwC;YACxC,IAAI,OAAO,MACT,MAAM,iBAAiB,eAAe,CAAC,MAAM,MAAM;YAGrD,IAAI,OAAO,MAAM;gBACf,iBAAiB,aAAa,CAAC;gBAC/B,IAAI,cACF,aAAa;YAEjB;QACF;QAEA,aAAa,MAAM,OAAO;QAC1B,MAAM,OAAO,GAAG,WAAW;YACzB,MAAM,MAAM,GAAG;QACjB,GAAG;IACL;IAEA,OAAO;QACL,iBAAiB;YACf,+DAA+D;YAC/D,qDAAqD;YACrD,kBAAkB,iBAAiB,eAAe,GAAG,YAAY;QACnE;IACF;AACF;AAEA,SAAS,sCAAgB,GAAW;IAClC,mDAAmD;IACnD,+DAA+D;IAC/D,6BAA6B;IAC7B,0CAA0C;IAC1C,IAAI,IAAI,MAAM,KAAK,KAAK,CAAC,UAAU,IAAI,CAAC,MACtC,OAAO;IAGT,OAAO;AACT","sources":["packages/react-aria/src/selection/useTypeSelect.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {DOMAttributes, Key, KeyboardDelegate} from '@react-types/shared';\nimport {getEventTarget, nodeContains} from '../utils/shadowdom/DOMFunctions';\nimport {KeyboardEvent, useRef} from 'react';\nimport {MultipleSelectionManager} from 'react-stately/useMultipleSelectionState';\n\n/**\n * Controls how long to wait before clearing the typeahead buffer.\n */\nconst TYPEAHEAD_DEBOUNCE_WAIT_MS = 1000; // 1 second\n\nexport interface AriaTypeSelectOptions {\n  /**\n   * A delegate that returns collection item keys with respect to visual layout.\n   */\n  keyboardDelegate: KeyboardDelegate,\n  /**\n   * An interface for reading and updating multiple selection state.\n   */\n  selectionManager: MultipleSelectionManager,\n  /**\n   * Called when an item is focused by typing.\n   */\n  onTypeSelect?: (key: Key) => void\n}\n\nexport interface TypeSelectAria {\n  /**\n   * Props to be spread on the owner of the options.\n   */\n  typeSelectProps: DOMAttributes\n}\n\n/**\n * Handles typeahead interactions with collections.\n */\nexport function useTypeSelect(options: AriaTypeSelectOptions): TypeSelectAria {\n  let {keyboardDelegate, selectionManager, onTypeSelect} = options;\n  let state = useRef<{search: string, timeout: ReturnType<typeof setTimeout> | undefined}>({\n    search: '',\n    timeout: undefined\n  }).current;\n\n  let onKeyDown = (e: KeyboardEvent) => {\n    let character = getStringForKey(e.key);\n    if (!character || e.ctrlKey || e.metaKey || !nodeContains(e.currentTarget, getEventTarget(e) as HTMLElement) || (state.search.length === 0 && character === ' ')) {\n      return;\n    }\n\n    // Do not propagate the Spacebar event if it's meant to be part of the search.\n    // When we time out, the search term becomes empty, hence the check on length.\n    // Trimming is to account for the case of pressing the Spacebar more than once,\n    // which should cycle through the selection/deselection of the focused item.\n    if (character === ' ' && state.search.trim().length > 0) {\n      e.preventDefault();\n      if (!('continuePropagation' in e)) {\n        e.stopPropagation();\n      }\n    }\n\n    state.search += character;\n\n    if (keyboardDelegate.getKeyForSearch != null) {\n      // Use the delegate to find a key to focus.\n      // Prioritize items after the currently focused item, falling back to searching the whole list.\n      let key = keyboardDelegate.getKeyForSearch(state.search, selectionManager.focusedKey);\n\n      // If no key found, search from the top.\n      if (key == null) {\n        key = keyboardDelegate.getKeyForSearch(state.search);\n      }\n\n      if (key != null) {\n        selectionManager.setFocusedKey(key);\n        if (onTypeSelect) {\n          onTypeSelect(key);\n        }\n      }\n    }\n\n    clearTimeout(state.timeout);\n    state.timeout = setTimeout(() => {\n      state.search = '';\n    }, TYPEAHEAD_DEBOUNCE_WAIT_MS);\n  };\n\n  return {\n    typeSelectProps: {\n      // Using a capturing listener to catch the keydown event before\n      // other hooks in order to handle the Spacebar event.\n      onKeyDownCapture: keyboardDelegate.getKeyForSearch ? onKeyDown : undefined\n    }\n  };\n}\n\nfunction getStringForKey(key: string) {\n  // If the key is of length 1, it is an ASCII value.\n  // Otherwise, if there are no ASCII characters in the key name,\n  // it is a Unicode character.\n  // See https://www.w3.org/TR/uievents-key/\n  if (key.length === 1 || !/^[A-Z]/i.test(key)) {\n    return key;\n  }\n\n  return '';\n}\n"],"names":[],"version":3,"file":"useTypeSelect.mjs.map"}
+{"mappings":"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","sources":["packages/react-aria/src/selection/useTypeSelect.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {DOMAttributes, Key, KeyboardDelegate} from '@react-types/shared';\nimport {getEventTarget, nodeContains} from '../utils/shadowdom/DOMFunctions';\nimport {KeyboardEvent, useEffect, useRef} from 'react';\nimport {MultipleSelectionManager} from 'react-stately/useMultipleSelectionState';\n\n/**\n * Controls how long to wait before clearing the typeahead buffer.\n */\nconst TYPEAHEAD_DEBOUNCE_WAIT_MS = 1000; // 1 second\n\nexport interface AriaTypeSelectOptions {\n  /**\n   * A delegate that returns collection item keys with respect to visual layout.\n   */\n  keyboardDelegate: KeyboardDelegate;\n  /**\n   * An interface for reading and updating multiple selection state.\n   */\n  selectionManager: MultipleSelectionManager;\n  /**\n   * Called when an item is focused by typing.\n   */\n  onTypeSelect?: (key: Key) => void;\n}\n\nexport interface TypeSelectAria {\n  /**\n   * Props to be spread on the owner of the options.\n   */\n  typeSelectProps: DOMAttributes;\n}\n\n/**\n * Handles typeahead interactions with collections.\n */\nexport function useTypeSelect(options: AriaTypeSelectOptions): TypeSelectAria {\n  let {keyboardDelegate, selectionManager, onTypeSelect} = options;\n  let state = useRef<{search: string; timeout: ReturnType<typeof setTimeout> | undefined}>({\n    search: '',\n    timeout: undefined\n  });\n\n  let onKeyDownCapture = (e: KeyboardEvent) => {\n    // if we're in the middle of a search, then a spacebar should be treated as a search and we should not propagate the event\n    // since we handle this one in a capture phase, we should ignore it in the bubble phase\n    if (state.current.search.length > 0 && e.key === ' ') {\n      e.preventDefault();\n      if (\n        !('continuePropagation' in e) ||\n        ('continuePropagation' in e && !e.isPropagationStopped())\n      ) {\n        e.stopPropagation();\n      }\n      state.current.search += ' ';\n\n      if (keyboardDelegate.getKeyForSearch != null) {\n        // Use the delegate to find a key to focus.\n        // Prioritize items after the currently focused item, falling back to searching the whole list.\n        let key = keyboardDelegate.getKeyForSearch(\n          state.current.search,\n          selectionManager.focusedKey\n        );\n\n        // If no key found, search from the top.\n        if (key == null) {\n          key = keyboardDelegate.getKeyForSearch(state.current.search);\n        }\n\n        if (key != null) {\n          selectionManager.setFocusedKey(key);\n          if (onTypeSelect) {\n            onTypeSelect(key);\n          }\n        }\n      }\n\n      clearTimeout(state.current.timeout);\n      state.current.timeout = setTimeout(() => {\n        state.current.search = '';\n      }, TYPEAHEAD_DEBOUNCE_WAIT_MS);\n    }\n  };\n\n  let onKeyDown = (e: KeyboardEvent) => {\n    let character = getStringForKey(e.key);\n    if (\n      !character ||\n      e.ctrlKey ||\n      e.metaKey ||\n      e.altKey ||\n      !nodeContains(e.currentTarget, getEventTarget(e) as HTMLElement) ||\n      (state.current.search.length === 0 && character === ' ')\n    ) {\n      return;\n    }\n\n    state.current.search += character;\n\n    if (keyboardDelegate.getKeyForSearch != null) {\n      // Use the delegate to find a key to focus.\n      // Prioritize items after the currently focused item, falling back to searching the whole list.\n      let key = keyboardDelegate.getKeyForSearch(state.current.search, selectionManager.focusedKey);\n\n      if (key == null) {\n        key = keyboardDelegate.getKeyForSearch(state.current.search);\n      }\n\n      if (key != null) {\n        selectionManager.setFocusedKey(key);\n        if (onTypeSelect) {\n          onTypeSelect(key);\n        }\n        e.preventDefault();\n        if (!('continuePropagation' in e)) {\n          e.stopPropagation();\n        }\n      } else {\n        // if still nothing then the type to select is done and everything is reset\n        state.current.search = '';\n        clearTimeout(state.current.timeout);\n        state.current.timeout = undefined;\n        return;\n      }\n    }\n\n    clearTimeout(state.current.timeout);\n    state.current.timeout = setTimeout(() => {\n      state.current.search = '';\n    }, TYPEAHEAD_DEBOUNCE_WAIT_MS);\n  };\n\n  useEffect(() => {\n    let timeout = state.current.timeout;\n    return () => {\n      clearTimeout(timeout);\n    };\n  }, [state]);\n\n  return {\n    typeSelectProps: {\n      // Using a capturing listener to catch the keydown event before\n      // other hooks in order to handle the Spacebar event.\n      onKeyDownCapture: keyboardDelegate.getKeyForSearch ? onKeyDownCapture : undefined,\n      onKeyDown: keyboardDelegate.getKeyForSearch ? onKeyDown : undefined\n    }\n  };\n}\n\nfunction getStringForKey(key: string) {\n  // If the key is of length 1, it is an ASCII value.\n  // Otherwise, if there are no ASCII characters in the key name,\n  // it is a Unicode character.\n  // See https://www.w3.org/TR/uievents-key/\n  if (key.length === 1 || !/^[A-Z]/i.test(key)) {\n    return key;\n  }\n\n  return '';\n}\n"],"names":[],"version":3,"file":"useTypeSelect.mjs.map"}

package/dist/private/selection/utils.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;AAaM,SAAS,0CAAiC,CAAQ;IACvD,qFAAqF;IACrF,gEAAgE;IAChE,OAAO,CAAA,GAAA,uCAAY,MAAM,EAAE,MAAM,GAAG,EAAE,OAAO;AAC/C;AAEO,SAAS,0CAAe,aAA4C,EAAE,GAAQ;IACnF,IAAI,WAAW,CAAC,WAAW,EAAE,IAAI,MAAM,CAAC,OAAO,MAAM,EAAE,CAAC;IACxD,IAAI,aAAa,cAAc,OAAO,EAAE,QAAQ;IAChD,IAAI,YACF,WAAW,CAAC,kBAAkB,EAAE,IAAI,MAAM,CAAC,YAAY,EAAE,EAAE,UAAU;IAEvE,OAAO,cAAc,OAAO,EAAE,cAAc;AAC9C;AAEA,MAAM,sCAAgB,IAAI;AACnB,SAAS,0CAAgB,UAA2B;IACzD,IAAI,KAAK,CAAA,GAAA,+BAAI;IACb,oCAAc,GAAG,CAAC,YAAY;IAC9B,OAAO;AACT;AAEO,SAAS,0CAAgB,UAA2B;IACzD,OAAO,oCAAc,GAAG,CAAC;AAC3B","sources":["packages/react-aria/src/selection/utils.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, Key} from '@react-types/shared';\nimport {isAppleDevice} from '../utils/platform';\nimport {RefObject} from 'react';\nimport {useId} from '../utils/useId';\n\ninterface Event {\n  altKey: boolean,\n  ctrlKey: boolean,\n  metaKey: boolean\n}\n\nexport function isNonContiguousSelectionModifier(e: Event): boolean {\n  // Ctrl + Arrow Up/Arrow Down has a system wide meaning on macOS, so use Alt instead.\n  // On Windows and Ubuntu, Alt + Space has a system wide meaning.\n  return isAppleDevice() ? e.altKey : e.ctrlKey;\n}\n\nexport function getItemElement(collectionRef: RefObject<HTMLElement | null>, key: Key): Element | null | undefined {\n  let selector = `[data-key=\"${CSS.escape(String(key))}\"]`;\n  let collection = collectionRef.current?.dataset.collection;\n  if (collection) {\n    selector = `[data-collection=\"${CSS.escape(collection)}\"]${selector}`;\n  }\n  return collectionRef.current?.querySelector(selector);\n}\n\nconst collectionMap = new WeakMap<Collection<any>, string>();\nexport function useCollectionId(collection: Collection<any>): string {\n  let id = useId();\n  collectionMap.set(collection, id);\n  return id;\n}\n\nexport function getCollectionId(collection: Collection<any>): string {\n  return collectionMap.get(collection)!;\n}\n"],"names":[],"version":3,"file":"utils.cjs.map"}
+{"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;AAaM,SAAS,0CAAiC,CAAQ;IACvD,qFAAqF;IACrF,gEAAgE;IAChE,OAAO,CAAA,GAAA,uCAAY,MAAM,EAAE,MAAM,GAAG,EAAE,OAAO;AAC/C;AAEO,SAAS,0CACd,aAA4C,EAC5C,GAAQ;IAER,IAAI,WAAW,CAAC,WAAW,EAAE,IAAI,MAAM,CAAC,OAAO,MAAM,EAAE,CAAC;IACxD,IAAI,aAAa,cAAc,OAAO,EAAE,QAAQ;IAChD,IAAI,YACF,WAAW,CAAC,kBAAkB,EAAE,IAAI,MAAM,CAAC,YAAY,EAAE,EAAE,UAAU;IAEvE,OAAO,cAAc,OAAO,EAAE,cAAc;AAC9C;AAEA,MAAM,sCAAgB,IAAI;AACnB,SAAS,0CAAgB,UAA2B;IACzD,IAAI,KAAK,CAAA,GAAA,+BAAI;IACb,oCAAc,GAAG,CAAC,YAAY;IAC9B,OAAO;AACT;AAEO,SAAS,0CAAgB,UAA2B;IACzD,OAAO,oCAAc,GAAG,CAAC;AAC3B","sources":["packages/react-aria/src/selection/utils.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, Key} from '@react-types/shared';\nimport {isAppleDevice} from '../utils/platform';\nimport {RefObject} from 'react';\nimport {useId} from '../utils/useId';\n\ninterface Event {\n  altKey: boolean;\n  ctrlKey: boolean;\n  metaKey: boolean;\n}\n\nexport function isNonContiguousSelectionModifier(e: Event): boolean {\n  // Ctrl + Arrow Up/Arrow Down has a system wide meaning on macOS, so use Alt instead.\n  // On Windows and Ubuntu, Alt + Space has a system wide meaning.\n  return isAppleDevice() ? e.altKey : e.ctrlKey;\n}\n\nexport function getItemElement(\n  collectionRef: RefObject<HTMLElement | null>,\n  key: Key\n): Element | null | undefined {\n  let selector = `[data-key=\"${CSS.escape(String(key))}\"]`;\n  let collection = collectionRef.current?.dataset.collection;\n  if (collection) {\n    selector = `[data-collection=\"${CSS.escape(collection)}\"]${selector}`;\n  }\n  return collectionRef.current?.querySelector(selector);\n}\n\nconst collectionMap = new WeakMap<Collection<any>, string>();\nexport function useCollectionId(collection: Collection<any>): string {\n  let id = useId();\n  collectionMap.set(collection, id);\n  return id;\n}\n\nexport function getCollectionId(collection: Collection<any>): string {\n  return collectionMap.get(collection)!;\n}\n"],"names":[],"version":3,"file":"utils.cjs.map"}

package/dist/private/selection/utils.js.map

@@ -1 +1 @@
-{"mappings":";;;AAAA;;;;;;;;;;CAUC;;AAaM,SAAS,0CAAiC,CAAQ;IACvD,qFAAqF;IACrF,gEAAgE;IAChE,OAAO,CAAA,GAAA,yCAAY,MAAM,EAAE,MAAM,GAAG,EAAE,OAAO;AAC/C;AAEO,SAAS,0CAAe,aAA4C,EAAE,GAAQ;QAElE,wBAIV;IALP,IAAI,WAAW,CAAC,WAAW,EAAE,IAAI,MAAM,CAAC,OAAO,MAAM,EAAE,CAAC;IACxD,IAAI,cAAa,yBAAA,cAAc,OAAO,cAArB,6CAAA,uBAAuB,OAAO,CAAC,UAAU;IAC1D,IAAI,YACF,WAAW,CAAC,kBAAkB,EAAE,IAAI,MAAM,CAAC,YAAY,EAAE,EAAE,UAAU;IAEvE,QAAO,0BAAA,cAAc,OAAO,cAArB,8CAAA,wBAAuB,aAAa,CAAC;AAC9C;AAEA,MAAM,sCAAgB,IAAI;AACnB,SAAS,0CAAgB,UAA2B;IACzD,IAAI,KAAK,CAAA,GAAA,yCAAI;IACb,oCAAc,GAAG,CAAC,YAAY;IAC9B,OAAO;AACT;AAEO,SAAS,0CAAgB,UAA2B;IACzD,OAAO,oCAAc,GAAG,CAAC;AAC3B","sources":["packages/react-aria/src/selection/utils.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, Key} from '@react-types/shared';\nimport {isAppleDevice} from '../utils/platform';\nimport {RefObject} from 'react';\nimport {useId} from '../utils/useId';\n\ninterface Event {\n  altKey: boolean,\n  ctrlKey: boolean,\n  metaKey: boolean\n}\n\nexport function isNonContiguousSelectionModifier(e: Event): boolean {\n  // Ctrl + Arrow Up/Arrow Down has a system wide meaning on macOS, so use Alt instead.\n  // On Windows and Ubuntu, Alt + Space has a system wide meaning.\n  return isAppleDevice() ? e.altKey : e.ctrlKey;\n}\n\nexport function getItemElement(collectionRef: RefObject<HTMLElement | null>, key: Key): Element | null | undefined {\n  let selector = `[data-key=\"${CSS.escape(String(key))}\"]`;\n  let collection = collectionRef.current?.dataset.collection;\n  if (collection) {\n    selector = `[data-collection=\"${CSS.escape(collection)}\"]${selector}`;\n  }\n  return collectionRef.current?.querySelector(selector);\n}\n\nconst collectionMap = new WeakMap<Collection<any>, string>();\nexport function useCollectionId(collection: Collection<any>): string {\n  let id = useId();\n  collectionMap.set(collection, id);\n  return id;\n}\n\nexport function getCollectionId(collection: Collection<any>): string {\n  return collectionMap.get(collection)!;\n}\n"],"names":[],"version":3,"file":"utils.js.map"}
+{"mappings":";;;AAAA;;;;;;;;;;CAUC;;AAaM,SAAS,0CAAiC,CAAQ;IACvD,qFAAqF;IACrF,gEAAgE;IAChE,OAAO,CAAA,GAAA,yCAAY,MAAM,EAAE,MAAM,GAAG,EAAE,OAAO;AAC/C;AAEO,SAAS,0CACd,aAA4C,EAC5C,GAAQ;QAGS,wBAIV;IALP,IAAI,WAAW,CAAC,WAAW,EAAE,IAAI,MAAM,CAAC,OAAO,MAAM,EAAE,CAAC;IACxD,IAAI,cAAa,yBAAA,cAAc,OAAO,cAArB,6CAAA,uBAAuB,OAAO,CAAC,UAAU;IAC1D,IAAI,YACF,WAAW,CAAC,kBAAkB,EAAE,IAAI,MAAM,CAAC,YAAY,EAAE,EAAE,UAAU;IAEvE,QAAO,0BAAA,cAAc,OAAO,cAArB,8CAAA,wBAAuB,aAAa,CAAC;AAC9C;AAEA,MAAM,sCAAgB,IAAI;AACnB,SAAS,0CAAgB,UAA2B;IACzD,IAAI,KAAK,CAAA,GAAA,yCAAI;IACb,oCAAc,GAAG,CAAC,YAAY;IAC9B,OAAO;AACT;AAEO,SAAS,0CAAgB,UAA2B;IACzD,OAAO,oCAAc,GAAG,CAAC;AAC3B","sources":["packages/react-aria/src/selection/utils.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, Key} from '@react-types/shared';\nimport {isAppleDevice} from '../utils/platform';\nimport {RefObject} from 'react';\nimport {useId} from '../utils/useId';\n\ninterface Event {\n  altKey: boolean;\n  ctrlKey: boolean;\n  metaKey: boolean;\n}\n\nexport function isNonContiguousSelectionModifier(e: Event): boolean {\n  // Ctrl + Arrow Up/Arrow Down has a system wide meaning on macOS, so use Alt instead.\n  // On Windows and Ubuntu, Alt + Space has a system wide meaning.\n  return isAppleDevice() ? e.altKey : e.ctrlKey;\n}\n\nexport function getItemElement(\n  collectionRef: RefObject<HTMLElement | null>,\n  key: Key\n): Element | null | undefined {\n  let selector = `[data-key=\"${CSS.escape(String(key))}\"]`;\n  let collection = collectionRef.current?.dataset.collection;\n  if (collection) {\n    selector = `[data-collection=\"${CSS.escape(collection)}\"]${selector}`;\n  }\n  return collectionRef.current?.querySelector(selector);\n}\n\nconst collectionMap = new WeakMap<Collection<any>, string>();\nexport function useCollectionId(collection: Collection<any>): string {\n  let id = useId();\n  collectionMap.set(collection, id);\n  return id;\n}\n\nexport function getCollectionId(collection: Collection<any>): string {\n  return collectionMap.get(collection)!;\n}\n"],"names":[],"version":3,"file":"utils.js.map"}

package/dist/private/selection/utils.mjs.map

@@ -1 +1 @@
-{"mappings":";;;AAAA;;;;;;;;;;CAUC;;AAaM,SAAS,0CAAiC,CAAQ;IACvD,qFAAqF;IACrF,gEAAgE;IAChE,OAAO,CAAA,GAAA,yCAAY,MAAM,EAAE,MAAM,GAAG,EAAE,OAAO;AAC/C;AAEO,SAAS,0CAAe,aAA4C,EAAE,GAAQ;IACnF,IAAI,WAAW,CAAC,WAAW,EAAE,IAAI,MAAM,CAAC,OAAO,MAAM,EAAE,CAAC;IACxD,IAAI,aAAa,cAAc,OAAO,EAAE,QAAQ;IAChD,IAAI,YACF,WAAW,CAAC,kBAAkB,EAAE,IAAI,MAAM,CAAC,YAAY,EAAE,EAAE,UAAU;IAEvE,OAAO,cAAc,OAAO,EAAE,cAAc;AAC9C;AAEA,MAAM,sCAAgB,IAAI;AACnB,SAAS,0CAAgB,UAA2B;IACzD,IAAI,KAAK,CAAA,GAAA,yCAAI;IACb,oCAAc,GAAG,CAAC,YAAY;IAC9B,OAAO;AACT;AAEO,SAAS,0CAAgB,UAA2B;IACzD,OAAO,oCAAc,GAAG,CAAC;AAC3B","sources":["packages/react-aria/src/selection/utils.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, Key} from '@react-types/shared';\nimport {isAppleDevice} from '../utils/platform';\nimport {RefObject} from 'react';\nimport {useId} from '../utils/useId';\n\ninterface Event {\n  altKey: boolean,\n  ctrlKey: boolean,\n  metaKey: boolean\n}\n\nexport function isNonContiguousSelectionModifier(e: Event): boolean {\n  // Ctrl + Arrow Up/Arrow Down has a system wide meaning on macOS, so use Alt instead.\n  // On Windows and Ubuntu, Alt + Space has a system wide meaning.\n  return isAppleDevice() ? e.altKey : e.ctrlKey;\n}\n\nexport function getItemElement(collectionRef: RefObject<HTMLElement | null>, key: Key): Element | null | undefined {\n  let selector = `[data-key=\"${CSS.escape(String(key))}\"]`;\n  let collection = collectionRef.current?.dataset.collection;\n  if (collection) {\n    selector = `[data-collection=\"${CSS.escape(collection)}\"]${selector}`;\n  }\n  return collectionRef.current?.querySelector(selector);\n}\n\nconst collectionMap = new WeakMap<Collection<any>, string>();\nexport function useCollectionId(collection: Collection<any>): string {\n  let id = useId();\n  collectionMap.set(collection, id);\n  return id;\n}\n\nexport function getCollectionId(collection: Collection<any>): string {\n  return collectionMap.get(collection)!;\n}\n"],"names":[],"version":3,"file":"utils.mjs.map"}
+{"mappings":";;;AAAA;;;;;;;;;;CAUC;;AAaM,SAAS,0CAAiC,CAAQ;IACvD,qFAAqF;IACrF,gEAAgE;IAChE,OAAO,CAAA,GAAA,yCAAY,MAAM,EAAE,MAAM,GAAG,EAAE,OAAO;AAC/C;AAEO,SAAS,0CACd,aAA4C,EAC5C,GAAQ;IAER,IAAI,WAAW,CAAC,WAAW,EAAE,IAAI,MAAM,CAAC,OAAO,MAAM,EAAE,CAAC;IACxD,IAAI,aAAa,cAAc,OAAO,EAAE,QAAQ;IAChD,IAAI,YACF,WAAW,CAAC,kBAAkB,EAAE,IAAI,MAAM,CAAC,YAAY,EAAE,EAAE,UAAU;IAEvE,OAAO,cAAc,OAAO,EAAE,cAAc;AAC9C;AAEA,MAAM,sCAAgB,IAAI;AACnB,SAAS,0CAAgB,UAA2B;IACzD,IAAI,KAAK,CAAA,GAAA,yCAAI;IACb,oCAAc,GAAG,CAAC,YAAY;IAC9B,OAAO;AACT;AAEO,SAAS,0CAAgB,UAA2B;IACzD,OAAO,oCAAc,GAAG,CAAC;AAC3B","sources":["packages/react-aria/src/selection/utils.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, Key} from '@react-types/shared';\nimport {isAppleDevice} from '../utils/platform';\nimport {RefObject} from 'react';\nimport {useId} from '../utils/useId';\n\ninterface Event {\n  altKey: boolean;\n  ctrlKey: boolean;\n  metaKey: boolean;\n}\n\nexport function isNonContiguousSelectionModifier(e: Event): boolean {\n  // Ctrl + Arrow Up/Arrow Down has a system wide meaning on macOS, so use Alt instead.\n  // On Windows and Ubuntu, Alt + Space has a system wide meaning.\n  return isAppleDevice() ? e.altKey : e.ctrlKey;\n}\n\nexport function getItemElement(\n  collectionRef: RefObject<HTMLElement | null>,\n  key: Key\n): Element | null | undefined {\n  let selector = `[data-key=\"${CSS.escape(String(key))}\"]`;\n  let collection = collectionRef.current?.dataset.collection;\n  if (collection) {\n    selector = `[data-collection=\"${CSS.escape(collection)}\"]${selector}`;\n  }\n  return collectionRef.current?.querySelector(selector);\n}\n\nconst collectionMap = new WeakMap<Collection<any>, string>();\nexport function useCollectionId(collection: Collection<any>): string {\n  let id = useId();\n  collectionMap.set(collection, id);\n  return id;\n}\n\nexport function getCollectionId(collection: Collection<any>): string {\n  return collectionMap.get(collection)!;\n}\n"],"names":[],"version":3,"file":"utils.mjs.map"}

package/dist/private/separator/useSeparator.cjs.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;AAyBM,SAAS,0CAAa,KAAqB;IAChD,IAAI,WAAW,CAAA,GAAA,wCAAa,EAAE,OAAO;QAAC,WAAW;IAAI;IACrD,IAAI;IACJ,iGAAiG;IACjG,0CAA0C;IAC1C,IAAI,MAAM,WAAW,KAAK,YACxB,kBAAkB;IAEpB,4EAA4E;IAC5E,IAAI,MAAM,WAAW,KAAK,MACxB,OAAO;QACL,gBAAgB;YACd,GAAG,QAAQ;YACX,MAAM;YACN,oBAAoB;QACtB;IACF;IAEF,OAAO;QAAC,gBAAgB;IAAQ;AAClC","sources":["packages/react-aria/src/separator/useSeparator.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMAttributes, DOMProps, Orientation} from '@react-types/shared';\nimport {filterDOMProps} from '../utils/filterDOMProps';\n\nexport interface SeparatorProps extends DOMProps, AriaLabelingProps {\n  /**\n   * The orientation of the separator.\n   * @default 'horizontal'\n   */\n  orientation?: Orientation,\n  /** The HTML element type that will be used to render the separator. */\n  elementType?: string\n}\n\nexport interface SeparatorAria {\n  /** Props for the separator element. */\n  separatorProps: DOMAttributes\n}\n\n/**\n * Provides the accessibility implementation for a separator.\n * A separator is a visual divider between two groups of content,\n * e.g. groups of menu items or sections of a page.\n */\nexport function useSeparator(props: SeparatorProps): SeparatorAria {\n  let domProps = filterDOMProps(props, {labelable: true});\n  let ariaOrientation;\n  // if orientation is horizontal, aria-orientation default is horizontal, so we leave it undefined\n  // if it's vertical, we need to specify it\n  if (props.orientation === 'vertical') {\n    ariaOrientation = 'vertical';\n  }\n  // hr elements implicitly have role = separator and a horizontal orientation\n  if (props.elementType !== 'hr') {\n    return {\n      separatorProps: {\n        ...domProps,\n        role: 'separator',\n        'aria-orientation': ariaOrientation\n      }\n    };\n  }\n  return {separatorProps: domProps};\n}\n"],"names":[],"version":3,"file":"useSeparator.cjs.map"}
+{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC;AA0BM,SAAS,0CAAa,KAAqB;IAChD,IAAI,WAAW,CAAA,GAAA,wCAAa,EAAE,OAAO;QAAC,WAAW;IAAI;IACrD,IAAI;IACJ,iGAAiG;IACjG,0CAA0C;IAC1C,IAAI,MAAM,WAAW,KAAK,YACxB,kBAAkB;IAEpB,4EAA4E;IAC5E,IAAI,MAAM,WAAW,KAAK,MACxB,OAAO;QACL,gBAAgB;YACd,GAAG,QAAQ;YACX,MAAM;YACN,oBAAoB;QACtB;IACF;IAEF,OAAO;QAAC,gBAAgB;IAAQ;AAClC","sources":["packages/react-aria/src/separator/useSeparator.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMAttributes, DOMProps, Orientation} from '@react-types/shared';\nimport {filterDOMProps} from '../utils/filterDOMProps';\n\nexport interface SeparatorProps extends DOMProps, AriaLabelingProps {\n  /**\n   * The orientation of the separator.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation;\n  /** The HTML element type that will be used to render the separator. */\n  elementType?: string;\n}\n\nexport interface SeparatorAria {\n  /** Props for the separator element. */\n  separatorProps: DOMAttributes;\n}\n\n/**\n * Provides the accessibility implementation for a separator.\n * A separator is a visual divider between two groups of content,\n * e.g. groups of menu items or sections of a page.\n */\nexport function useSeparator(props: SeparatorProps): SeparatorAria {\n  let domProps = filterDOMProps(props, {labelable: true});\n  let ariaOrientation;\n  // if orientation is horizontal, aria-orientation default is horizontal, so we leave it undefined\n  // if it's vertical, we need to specify it\n  if (props.orientation === 'vertical') {\n    ariaOrientation = 'vertical';\n  }\n  // hr elements implicitly have role = separator and a horizontal orientation\n  if (props.elementType !== 'hr') {\n    return {\n      separatorProps: {\n        ...domProps,\n        role: 'separator',\n        'aria-orientation': ariaOrientation\n      }\n    };\n  }\n  return {separatorProps: domProps};\n}\n"],"names":[],"version":3,"file":"useSeparator.cjs.map"}

package/dist/private/separator/useSeparator.js.map

@@ -1 +1 @@
-{"mappings":";;AAAA;;;;;;;;;;CAUC;AAyBM,SAAS,0CAAa,KAAqB;IAChD,IAAI,WAAW,CAAA,GAAA,yCAAa,EAAE,OAAO;QAAC,WAAW;IAAI;IACrD,IAAI;IACJ,iGAAiG;IACjG,0CAA0C;IAC1C,IAAI,MAAM,WAAW,KAAK,YACxB,kBAAkB;IAEpB,4EAA4E;IAC5E,IAAI,MAAM,WAAW,KAAK,MACxB,OAAO;QACL,gBAAgB;YACd,GAAG,QAAQ;YACX,MAAM;YACN,oBAAoB;QACtB;IACF;IAEF,OAAO;QAAC,gBAAgB;IAAQ;AAClC","sources":["packages/react-aria/src/separator/useSeparator.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMAttributes, DOMProps, Orientation} from '@react-types/shared';\nimport {filterDOMProps} from '../utils/filterDOMProps';\n\nexport interface SeparatorProps extends DOMProps, AriaLabelingProps {\n  /**\n   * The orientation of the separator.\n   * @default 'horizontal'\n   */\n  orientation?: Orientation,\n  /** The HTML element type that will be used to render the separator. */\n  elementType?: string\n}\n\nexport interface SeparatorAria {\n  /** Props for the separator element. */\n  separatorProps: DOMAttributes\n}\n\n/**\n * Provides the accessibility implementation for a separator.\n * A separator is a visual divider between two groups of content,\n * e.g. groups of menu items or sections of a page.\n */\nexport function useSeparator(props: SeparatorProps): SeparatorAria {\n  let domProps = filterDOMProps(props, {labelable: true});\n  let ariaOrientation;\n  // if orientation is horizontal, aria-orientation default is horizontal, so we leave it undefined\n  // if it's vertical, we need to specify it\n  if (props.orientation === 'vertical') {\n    ariaOrientation = 'vertical';\n  }\n  // hr elements implicitly have role = separator and a horizontal orientation\n  if (props.elementType !== 'hr') {\n    return {\n      separatorProps: {\n        ...domProps,\n        role: 'separator',\n        'aria-orientation': ariaOrientation\n      }\n    };\n  }\n  return {separatorProps: domProps};\n}\n"],"names":[],"version":3,"file":"useSeparator.js.map"}
+{"mappings":";;AAAA;;;;;;;;;;CAUC;AA0BM,SAAS,0CAAa,KAAqB;IAChD,IAAI,WAAW,CAAA,GAAA,yCAAa,EAAE,OAAO;QAAC,WAAW;IAAI;IACrD,IAAI;IACJ,iGAAiG;IACjG,0CAA0C;IAC1C,IAAI,MAAM,WAAW,KAAK,YACxB,kBAAkB;IAEpB,4EAA4E;IAC5E,IAAI,MAAM,WAAW,KAAK,MACxB,OAAO;QACL,gBAAgB;YACd,GAAG,QAAQ;YACX,MAAM;YACN,oBAAoB;QACtB;IACF;IAEF,OAAO;QAAC,gBAAgB;IAAQ;AAClC","sources":["packages/react-aria/src/separator/useSeparator.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMAttributes, DOMProps, Orientation} from '@react-types/shared';\nimport {filterDOMProps} from '../utils/filterDOMProps';\n\nexport interface SeparatorProps extends DOMProps, AriaLabelingProps {\n  /**\n   * The orientation of the separator.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation;\n  /** The HTML element type that will be used to render the separator. */\n  elementType?: string;\n}\n\nexport interface SeparatorAria {\n  /** Props for the separator element. */\n  separatorProps: DOMAttributes;\n}\n\n/**\n * Provides the accessibility implementation for a separator.\n * A separator is a visual divider between two groups of content,\n * e.g. groups of menu items or sections of a page.\n */\nexport function useSeparator(props: SeparatorProps): SeparatorAria {\n  let domProps = filterDOMProps(props, {labelable: true});\n  let ariaOrientation;\n  // if orientation is horizontal, aria-orientation default is horizontal, so we leave it undefined\n  // if it's vertical, we need to specify it\n  if (props.orientation === 'vertical') {\n    ariaOrientation = 'vertical';\n  }\n  // hr elements implicitly have role = separator and a horizontal orientation\n  if (props.elementType !== 'hr') {\n    return {\n      separatorProps: {\n        ...domProps,\n        role: 'separator',\n        'aria-orientation': ariaOrientation\n      }\n    };\n  }\n  return {separatorProps: domProps};\n}\n"],"names":[],"version":3,"file":"useSeparator.js.map"}

package/dist/private/separator/useSeparator.mjs.map

@@ -1 +1 @@
-{"mappings":";;AAAA;;;;;;;;;;CAUC;AAyBM,SAAS,0CAAa,KAAqB;IAChD,IAAI,WAAW,CAAA,GAAA,yCAAa,EAAE,OAAO;QAAC,WAAW;IAAI;IACrD,IAAI;IACJ,iGAAiG;IACjG,0CAA0C;IAC1C,IAAI,MAAM,WAAW,KAAK,YACxB,kBAAkB;IAEpB,4EAA4E;IAC5E,IAAI,MAAM,WAAW,KAAK,MACxB,OAAO;QACL,gBAAgB;YACd,GAAG,QAAQ;YACX,MAAM;YACN,oBAAoB;QACtB;IACF;IAEF,OAAO;QAAC,gBAAgB;IAAQ;AAClC","sources":["packages/react-aria/src/separator/useSeparator.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMAttributes, DOMProps, Orientation} from '@react-types/shared';\nimport {filterDOMProps} from '../utils/filterDOMProps';\n\nexport interface SeparatorProps extends DOMProps, AriaLabelingProps {\n  /**\n   * The orientation of the separator.\n   * @default 'horizontal'\n   */\n  orientation?: Orientation,\n  /** The HTML element type that will be used to render the separator. */\n  elementType?: string\n}\n\nexport interface SeparatorAria {\n  /** Props for the separator element. */\n  separatorProps: DOMAttributes\n}\n\n/**\n * Provides the accessibility implementation for a separator.\n * A separator is a visual divider between two groups of content,\n * e.g. groups of menu items or sections of a page.\n */\nexport function useSeparator(props: SeparatorProps): SeparatorAria {\n  let domProps = filterDOMProps(props, {labelable: true});\n  let ariaOrientation;\n  // if orientation is horizontal, aria-orientation default is horizontal, so we leave it undefined\n  // if it's vertical, we need to specify it\n  if (props.orientation === 'vertical') {\n    ariaOrientation = 'vertical';\n  }\n  // hr elements implicitly have role = separator and a horizontal orientation\n  if (props.elementType !== 'hr') {\n    return {\n      separatorProps: {\n        ...domProps,\n        role: 'separator',\n        'aria-orientation': ariaOrientation\n      }\n    };\n  }\n  return {separatorProps: domProps};\n}\n"],"names":[],"version":3,"file":"useSeparator.mjs.map"}
+{"mappings":";;AAAA;;;;;;;;;;CAUC;AA0BM,SAAS,0CAAa,KAAqB;IAChD,IAAI,WAAW,CAAA,GAAA,yCAAa,EAAE,OAAO;QAAC,WAAW;IAAI;IACrD,IAAI;IACJ,iGAAiG;IACjG,0CAA0C;IAC1C,IAAI,MAAM,WAAW,KAAK,YACxB,kBAAkB;IAEpB,4EAA4E;IAC5E,IAAI,MAAM,WAAW,KAAK,MACxB,OAAO;QACL,gBAAgB;YACd,GAAG,QAAQ;YACX,MAAM;YACN,oBAAoB;QACtB;IACF;IAEF,OAAO;QAAC,gBAAgB;IAAQ;AAClC","sources":["packages/react-aria/src/separator/useSeparator.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMAttributes, DOMProps, Orientation} from '@react-types/shared';\nimport {filterDOMProps} from '../utils/filterDOMProps';\n\nexport interface SeparatorProps extends DOMProps, AriaLabelingProps {\n  /**\n   * The orientation of the separator.\n   *\n   * @default 'horizontal'\n   */\n  orientation?: Orientation;\n  /** The HTML element type that will be used to render the separator. */\n  elementType?: string;\n}\n\nexport interface SeparatorAria {\n  /** Props for the separator element. */\n  separatorProps: DOMAttributes;\n}\n\n/**\n * Provides the accessibility implementation for a separator.\n * A separator is a visual divider between two groups of content,\n * e.g. groups of menu items or sections of a page.\n */\nexport function useSeparator(props: SeparatorProps): SeparatorAria {\n  let domProps = filterDOMProps(props, {labelable: true});\n  let ariaOrientation;\n  // if orientation is horizontal, aria-orientation default is horizontal, so we leave it undefined\n  // if it's vertical, we need to specify it\n  if (props.orientation === 'vertical') {\n    ariaOrientation = 'vertical';\n  }\n  // hr elements implicitly have role = separator and a horizontal orientation\n  if (props.elementType !== 'hr') {\n    return {\n      separatorProps: {\n        ...domProps,\n        role: 'separator',\n        'aria-orientation': ariaOrientation\n      }\n    };\n  }\n  return {separatorProps: domProps};\n}\n"],"names":[],"version":3,"file":"useSeparator.mjs.map"}

package/dist/private/slider/useSlider.cjs

@@ -91,8 +91,10 @@ function $0c3fa8b49a5ed605$export$56b2c08e277f365(props, state, trackRef) {
             // to find the closet thumb we split the array based on the first thumb position to the "right/end" of the click.
             let closestThumb;
             let split = state.values.findIndex((v)=>value - v < 0);
-            if (split === 0) closestThumb = split;
-            else if (split === -1) closestThumb = state.values.length - 1;
+            if (split === 0) // If the index is zero then the closetThumb is the first one
+            closestThumb = split;
+            else if (split === -1) // If no index is found they've clicked past all the thumbs
+            closestThumb = state.values.length - 1;
             else {
                 let lastLeft = state.values[split - 1];
                 let firstRight = state.values[split];

package/dist/private/slider/useSlider.cjs.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/react-aria/src/slider/useSlider.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMAttributes, DOMProps, RefObject} from '@react-types/shared';\nimport {clamp} from 'react-stately/private/utils/number';\nimport {getSliderThumbId, sliderData} from './utils';\nimport {mergeProps} from '../utils/mergeProps';\nimport React, {LabelHTMLAttributes, OutputHTMLAttributes, useRef} from 'react';\nimport {setInteractionModality} from '../interactions/useFocusVisible';\nimport {SliderProps, SliderState} from 'react-stately/useSliderState';\nimport {useGlobalListeners} from '../utils/useGlobalListeners';\nimport {useLabel} from '../label/useLabel';\nimport {useLocale} from '../i18n/I18nProvider';\nimport {useMove} from '../interactions/useMove';\n\nexport interface AriaSliderProps<T = number | number[]> extends SliderProps<T>, DOMProps, AriaLabelingProps {}\n\nexport interface SliderAria {\n  /** Props for the label element. */\n  labelProps: LabelHTMLAttributes<HTMLLabelElement>,\n\n  /** Props for the root element of the slider component; groups slider inputs. */\n  groupProps: DOMAttributes,\n\n  /** Props for the track element. */\n  trackProps: DOMAttributes,\n\n  /** Props for the output element, displaying the value of the slider thumbs. */\n  outputProps: OutputHTMLAttributes<HTMLOutputElement>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a slider component representing one or more values.\n *\n * @param props Props for the slider.\n * @param state State for the slider, as returned by `useSliderState`.\n * @param trackRef Ref for the \"track\" element.  The width of this element provides the \"length\"\n * of the track -- the span of one dimensional space that the slider thumb can be.  It also\n * accepts click and drag motions, so that the closest thumb will follow clicks and drags on\n * the track.\n */\nexport function useSlider<T extends number | number[]>(\n  props: AriaSliderProps<T>,\n  state: SliderState,\n  trackRef: RefObject<Element | null>\n): SliderAria {\n  let {labelProps, fieldProps} = useLabel(props);\n\n  let isVertical = props.orientation === 'vertical';\n\n  // Attach id of the label to the state so it can be accessed by useSliderThumb.\n  sliderData.set(state, {\n    id: (labelProps.id ?? fieldProps.id)!,\n    'aria-describedby': props['aria-describedby'],\n    'aria-details': props['aria-details']\n  });\n\n  let {direction} = useLocale();\n\n  let {addGlobalListener, removeGlobalListener} = useGlobalListeners();\n\n  // When the user clicks or drags the track, we want the motion to set and drag the\n  // closest thumb.  Hence we also need to install useMove() on the track element.\n  // Here, we keep track of which index is the \"closest\" to the drag start point.\n  // It is set onMouseDown/onTouchDown; see trackProps below.\n  const realTimeTrackDraggingIndex = useRef<number | null>(null);\n\n  const reverseX = direction === 'rtl';\n  const currentPosition = useRef<number | null>(null);\n  const {moveProps} = useMove({\n    onMoveStart() {\n      currentPosition.current = null;\n    },\n    onMove({deltaX, deltaY}) {\n      if (!trackRef.current) {\n        return;\n      }\n      let {height, width} = trackRef.current.getBoundingClientRect();\n      let size = isVertical ? height : width;\n\n      if (currentPosition.current == null && realTimeTrackDraggingIndex.current != null) {\n        currentPosition.current = state.getThumbPercent(realTimeTrackDraggingIndex.current) * size;\n      }\n\n      let delta = isVertical ? deltaY : deltaX;\n      if (isVertical || reverseX) {\n        delta = -delta;\n      }\n\n      currentPosition.current! += delta;\n\n      if (realTimeTrackDraggingIndex.current != null && trackRef.current) {\n        const percent = clamp(currentPosition.current! / size, 0, 1);\n        state.setThumbPercent(realTimeTrackDraggingIndex.current, percent);\n      }\n    },\n    onMoveEnd() {\n      if (realTimeTrackDraggingIndex.current != null) {\n        state.setThumbDragging(realTimeTrackDraggingIndex.current, false);\n        realTimeTrackDraggingIndex.current = null;\n      }\n    }\n  });\n\n  let currentPointer = useRef<number | null | undefined>(undefined);\n  let onDownTrack = (e: React.UIEvent, id: number | undefined, clientX: number, clientY: number) => {\n    // We only trigger track-dragging if the user clicks on the track itself and nothing is currently being dragged.\n    if (trackRef.current && !props.isDisabled && state.values.every((_, i) => !state.isThumbDragging(i))) {\n      let {height, width, top, left} = trackRef.current.getBoundingClientRect();\n      let size = isVertical ? height : width;\n      // Find the closest thumb\n      const trackPosition = isVertical ? top : left;\n      const clickPosition = isVertical ? clientY : clientX;\n      const offset = clickPosition - trackPosition;\n      let percent = offset / size;\n      if (direction === 'rtl' || isVertical) {\n        percent = 1 - percent;\n      }\n      let value = state.getPercentValue(percent);\n\n      // to find the closet thumb we split the array based on the first thumb position to the \"right/end\" of the click.\n      let closestThumb;\n      let split = state.values.findIndex(v => value - v < 0);\n      if (split === 0) { // If the index is zero then the closetThumb is the first one\n        closestThumb = split;\n      } else if (split === -1) { // If no index is found they've clicked past all the thumbs\n        closestThumb = state.values.length - 1;\n      } else {\n        let lastLeft = state.values[split - 1];\n        let firstRight = state.values[split];\n        // Pick the last left/start thumb, unless they are stacked on top of each other, then pick the right/end one\n        if (Math.abs(lastLeft - value) < Math.abs(firstRight - value)) {\n          closestThumb = split - 1;\n        } else {\n          closestThumb = split;\n        }\n      }\n\n      // Confirm that the found closest thumb is editable, not disabled, and move it\n      if (closestThumb >= 0 && state.isThumbEditable(closestThumb)) {\n        // Don't unfocus anything\n        e.preventDefault();\n\n        realTimeTrackDraggingIndex.current = closestThumb;\n        state.setFocusedThumb(closestThumb);\n        currentPointer.current = id;\n\n        state.setThumbDragging(realTimeTrackDraggingIndex.current!, true);\n        state.setThumbValue(closestThumb, value);\n\n        addGlobalListener(window, 'mouseup', onUpTrack, false);\n        addGlobalListener(window, 'touchend', onUpTrack, false);\n        addGlobalListener(window, 'pointerup', onUpTrack, false);\n      } else {\n        realTimeTrackDraggingIndex.current = null;\n      }\n    }\n  };\n\n  let onUpTrack = (e) => {\n    let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n    if (id === currentPointer.current) {\n      if (realTimeTrackDraggingIndex.current != null) {\n        state.setThumbDragging(realTimeTrackDraggingIndex.current, false);\n        realTimeTrackDraggingIndex.current = null;\n      }\n\n      removeGlobalListener(window, 'mouseup', onUpTrack, false);\n      removeGlobalListener(window, 'touchend', onUpTrack, false);\n      removeGlobalListener(window, 'pointerup', onUpTrack, false);\n    }\n  };\n\n  if ('htmlFor' in labelProps && labelProps.htmlFor) {\n    // Ideally the `for` attribute should point to the first thumb, but VoiceOver on iOS\n    // causes this to override the `aria-labelledby` on the thumb. This causes the first\n    // thumb to only be announced as the slider label rather than its individual name as well.\n    // See https://bugs.webkit.org/show_bug.cgi?id=172464.\n    delete labelProps.htmlFor;\n    labelProps.onClick = () => {\n      // Safari does not focus <input type=\"range\"> elements when clicking on an associated <label>,\n      // so do it manually. In addition, make sure we show the focus ring.\n      document.getElementById(getSliderThumbId(state, 0))?.focus();\n      setInteractionModality('keyboard');\n    };\n  }\n\n  return {\n    labelProps,\n    // The root element of the Slider will have role=\"group\" to group together\n    // all the thumb inputs in the Slider.  The label of the Slider will\n    // be used to label the group.\n    groupProps: {\n      role: 'group',\n      ...fieldProps\n    },\n    trackProps: mergeProps({\n      onMouseDown(e: React.MouseEvent) {\n        if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n          return;\n        }\n        onDownTrack(e, undefined, e.clientX, e.clientY);\n      },\n      onPointerDown(e: React.PointerEvent) {\n        if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n          return;\n        }\n        onDownTrack(e, e.pointerId, e.clientX, e.clientY);\n      },\n      onTouchStart(e: React.TouchEvent) { onDownTrack(e, e.changedTouches[0].identifier, e.changedTouches[0].clientX, e.changedTouches[0].clientY); },\n      style: {\n        position: 'relative',\n        touchAction: 'none'\n      }\n    }, moveProps),\n    outputProps: {\n      htmlFor: state.values.map((_, index) => getSliderThumbId(state, index)).join(' '),\n      'aria-live': 'off'\n    }\n  };\n}\n"],"names":[],"version":3,"file":"useSlider.cjs.map"}
+{"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;AA0CM,SAAS,yCACd,KAAyB,EACzB,KAAkB,EAClB,QAAmC;IAEnC,IAAI,cAAC,UAAU,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,kCAAO,EAAE;IAExC,IAAI,aAAa,MAAM,WAAW,KAAK;IAEvC,+EAA+E;IAC/E,CAAA,GAAA,oCAAS,EAAE,GAAG,CAAC,OAAO;QACpB,IAAK,WAAW,EAAE,IAAI,WAAW,EAAE;QACnC,oBAAoB,KAAK,CAAC,mBAAmB;QAC7C,gBAAgB,KAAK,CAAC,eAAe;IACvC;IAEA,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,mCAAQ;IAE1B,IAAI,qBAAC,iBAAiB,wBAAE,oBAAoB,EAAC,GAAG,CAAA,GAAA,4CAAiB;IAEjE,kFAAkF;IAClF,gFAAgF;IAChF,+EAA+E;IAC/E,2DAA2D;IAC3D,MAAM,6BAA6B,CAAA,GAAA,mBAAK,EAAiB;IAEzD,MAAM,WAAW,cAAc;IAC/B,MAAM,kBAAkB,CAAA,GAAA,mBAAK,EAAiB;IAC9C,MAAM,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,iCAAM,EAAE;QAC1B;YACE,gBAAgB,OAAO,GAAG;QAC5B;QACA,QAAO,UAAC,MAAM,UAAE,MAAM,EAAC;YACrB,IAAI,CAAC,SAAS,OAAO,EACnB;YAEF,IAAI,UAAC,MAAM,SAAE,KAAK,EAAC,GAAG,SAAS,OAAO,CAAC,qBAAqB;YAC5D,IAAI,OAAO,aAAa,SAAS;YAEjC,IAAI,gBAAgB,OAAO,IAAI,QAAQ,2BAA2B,OAAO,IAAI,MAC3E,gBAAgB,OAAO,GAAG,MAAM,eAAe,CAAC,2BAA2B,OAAO,IAAI;YAGxF,IAAI,QAAQ,aAAa,SAAS;YAClC,IAAI,cAAc,UAChB,QAAQ,CAAC;YAGX,gBAAgB,OAAO,IAAK;YAE5B,IAAI,2BAA2B,OAAO,IAAI,QAAQ,SAAS,OAAO,EAAE;gBAClE,MAAM,UAAU,CAAA,GAAA,2CAAI,EAAE,gBAAgB,OAAO,GAAI,MAAM,GAAG;gBAC1D,MAAM,eAAe,CAAC,2BAA2B,OAAO,EAAE;YAC5D;QACF;QACA;YACE,IAAI,2BAA2B,OAAO,IAAI,MAAM;gBAC9C,MAAM,gBAAgB,CAAC,2BAA2B,OAAO,EAAE;gBAC3D,2BAA2B,OAAO,GAAG;YACvC;QACF;IACF;IAEA,IAAI,iBAAiB,CAAA,GAAA,mBAAK,EAA6B;IACvD,IAAI,cAAc,CAChB,GACA,IACA,SACA;QAEA,gHAAgH;QAChH,IACE,SAAS,OAAO,IAChB,CAAC,MAAM,UAAU,IACjB,MAAM,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,IAAM,CAAC,MAAM,eAAe,CAAC,KACpD;YACA,IAAI,UAAC,MAAM,SAAE,KAAK,OAAE,GAAG,QAAE,IAAI,EAAC,GAAG,SAAS,OAAO,CAAC,qBAAqB;YACvE,IAAI,OAAO,aAAa,SAAS;YACjC,yBAAyB;YACzB,MAAM,gBAAgB,aAAa,MAAM;YACzC,MAAM,gBAAgB,aAAa,UAAU;YAC7C,MAAM,SAAS,gBAAgB;YAC/B,IAAI,UAAU,SAAS;YACvB,IAAI,cAAc,SAAS,YACzB,UAAU,IAAI;YAEhB,IAAI,QAAQ,MAAM,eAAe,CAAC;YAElC,iHAAiH;YACjH,IAAI;YACJ,IAAI,QAAQ,MAAM,MAAM,CAAC,SAAS,CAAC,CAAA,IAAK,QAAQ,IAAI;YACpD,IAAI,UAAU,GACZ,6DAA6D;YAC7D,eAAe;iBACV,IAAI,UAAU,IACnB,2DAA2D;YAC3D,eAAe,MAAM,MAAM,CAAC,MAAM,GAAG;iBAChC;gBACL,IAAI,WAAW,MAAM,MAAM,CAAC,QAAQ,EAAE;gBACtC,IAAI,aAAa,MAAM,MAAM,CAAC,MAAM;gBACpC,4GAA4G;gBAC5G,IAAI,KAAK,GAAG,CAAC,WAAW,SAAS,KAAK,GAAG,CAAC,aAAa,QACrD,eAAe,QAAQ;qBAEvB,eAAe;YAEnB;YAEA,8EAA8E;YAC9E,IAAI,gBAAgB,KAAK,MAAM,eAAe,CAAC,eAAe;gBAC5D,yBAAyB;gBACzB,EAAE,cAAc;gBAEhB,2BAA2B,OAAO,GAAG;gBACrC,MAAM,eAAe,CAAC;gBACtB,eAAe,OAAO,GAAG;gBAEzB,MAAM,gBAAgB,CAAC,2BAA2B,OAAO,EAAG;gBAC5D,MAAM,aAAa,CAAC,cAAc;gBAElC,kBAAkB,QAAQ,WAAW,WAAW;gBAChD,kBAAkB,QAAQ,YAAY,WAAW;gBACjD,kBAAkB,QAAQ,aAAa,WAAW;YACpD,OACE,2BAA2B,OAAO,GAAG;QAEzC;IACF;IAEA,IAAI,YAAY,CAAA;QACd,IAAI,KAAK,EAAE,SAAS,IAAI,EAAE,cAAc,EAAE,CAAC,EAAE,CAAC;QAC9C,IAAI,OAAO,eAAe,OAAO,EAAE;YACjC,IAAI,2BAA2B,OAAO,IAAI,MAAM;gBAC9C,MAAM,gBAAgB,CAAC,2BAA2B,OAAO,EAAE;gBAC3D,2BAA2B,OAAO,GAAG;YACvC;YAEA,qBAAqB,QAAQ,WAAW,WAAW;YACnD,qBAAqB,QAAQ,YAAY,WAAW;YACpD,qBAAqB,QAAQ,aAAa,WAAW;QACvD;IACF;IAEA,IAAI,aAAa,cAAc,WAAW,OAAO,EAAE;QACjD,oFAAoF;QACpF,oFAAoF;QACpF,0FAA0F;QAC1F,sDAAsD;QACtD,OAAO,WAAW,OAAO;QACzB,WAAW,OAAO,GAAG;YACnB,8FAA8F;YAC9F,oEAAoE;YACpE,SAAS,cAAc,CAAC,CAAA,GAAA,0CAAe,EAAE,OAAO,KAAK;YACrD,CAAA,GAAA,gDAAqB,EAAE;QACzB;IACF;IAEA,OAAO;oBACL;QACA,0EAA0E;QAC1E,oEAAoE;QACpE,8BAA8B;QAC9B,YAAY;YACV,MAAM;YACN,GAAG,UAAU;QACf;QACA,YAAY,CAAA,GAAA,oCAAS,EACnB;YACE,aAAY,CAAmB;gBAC7B,IAAI,EAAE,MAAM,KAAK,KAAK,EAAE,MAAM,IAAI,EAAE,OAAO,IAAI,EAAE,OAAO,EACtD;gBAEF,YAAY,GAAG,WAAW,EAAE,OAAO,EAAE,EAAE,OAAO;YAChD;YACA,eAAc,CAAqB;gBACjC,IAAI,EAAE,WAAW,KAAK,WAAY,CAAA,EAAE,MAAM,KAAK,KAAK,EAAE,MAAM,IAAI,EAAE,OAAO,IAAI,EAAE,OAAO,AAAD,GACnF;gBAEF,YAAY,GAAG,EAAE,SAAS,EAAE,EAAE,OAAO,EAAE,EAAE,OAAO;YAClD;YACA,cAAa,CAAmB;gBAC9B,YACE,GACA,EAAE,cAAc,CAAC,EAAE,CAAC,UAAU,EAC9B,EAAE,cAAc,CAAC,EAAE,CAAC,OAAO,EAC3B,EAAE,cAAc,CAAC,EAAE,CAAC,OAAO;YAE/B;YACA,OAAO;gBACL,UAAU;gBACV,aAAa;YACf;QACF,GACA;QAEF,aAAa;YACX,SAAS,MAAM,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,QAAU,CAAA,GAAA,0CAAe,EAAE,OAAO,QAAQ,IAAI,CAAC;YAC7E,aAAa;QACf;IACF;AACF","sources":["packages/react-aria/src/slider/useSlider.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMAttributes, DOMProps, RefObject} from '@react-types/shared';\nimport {clamp} from 'react-stately/private/utils/number';\nimport {getSliderThumbId, sliderData} from './utils';\nimport {mergeProps} from '../utils/mergeProps';\nimport React, {LabelHTMLAttributes, OutputHTMLAttributes, useRef} from 'react';\nimport {setInteractionModality} from '../interactions/useFocusVisible';\nimport {SliderProps, SliderState} from 'react-stately/useSliderState';\nimport {useGlobalListeners} from '../utils/useGlobalListeners';\nimport {useLabel} from '../label/useLabel';\nimport {useLocale} from '../i18n/I18nProvider';\nimport {useMove} from '../interactions/useMove';\n\nexport interface AriaSliderProps<T = number | number[]>\n  extends SliderProps<T>, DOMProps, AriaLabelingProps {}\n\nexport interface SliderAria {\n  /** Props for the label element. */\n  labelProps: LabelHTMLAttributes<HTMLLabelElement>;\n\n  /** Props for the root element of the slider component; groups slider inputs. */\n  groupProps: DOMAttributes;\n\n  /** Props for the track element. */\n  trackProps: DOMAttributes;\n\n  /** Props for the output element, displaying the value of the slider thumbs. */\n  outputProps: OutputHTMLAttributes<HTMLOutputElement>;\n}\n\n/**\n * Provides the behavior and accessibility implementation for a slider component representing one or\n * more values.\n *\n * @param props Props for the slider.\n * @param state State for the slider, as returned by `useSliderState`.\n * @param trackRef Ref for the \"track\" element.  The width of this element provides the \"length\"\n *   of the track -- the span of one dimensional space that the slider thumb can be.  It also\n *   accepts click and drag motions, so that the closest thumb will follow clicks and drags on\n *   the track.\n */\nexport function useSlider<T extends number | number[]>(\n  props: AriaSliderProps<T>,\n  state: SliderState,\n  trackRef: RefObject<Element | null>\n): SliderAria {\n  let {labelProps, fieldProps} = useLabel(props);\n\n  let isVertical = props.orientation === 'vertical';\n\n  // Attach id of the label to the state so it can be accessed by useSliderThumb.\n  sliderData.set(state, {\n    id: (labelProps.id ?? fieldProps.id)!,\n    'aria-describedby': props['aria-describedby'],\n    'aria-details': props['aria-details']\n  });\n\n  let {direction} = useLocale();\n\n  let {addGlobalListener, removeGlobalListener} = useGlobalListeners();\n\n  // When the user clicks or drags the track, we want the motion to set and drag the\n  // closest thumb.  Hence we also need to install useMove() on the track element.\n  // Here, we keep track of which index is the \"closest\" to the drag start point.\n  // It is set onMouseDown/onTouchDown; see trackProps below.\n  const realTimeTrackDraggingIndex = useRef<number | null>(null);\n\n  const reverseX = direction === 'rtl';\n  const currentPosition = useRef<number | null>(null);\n  const {moveProps} = useMove({\n    onMoveStart() {\n      currentPosition.current = null;\n    },\n    onMove({deltaX, deltaY}) {\n      if (!trackRef.current) {\n        return;\n      }\n      let {height, width} = trackRef.current.getBoundingClientRect();\n      let size = isVertical ? height : width;\n\n      if (currentPosition.current == null && realTimeTrackDraggingIndex.current != null) {\n        currentPosition.current = state.getThumbPercent(realTimeTrackDraggingIndex.current) * size;\n      }\n\n      let delta = isVertical ? deltaY : deltaX;\n      if (isVertical || reverseX) {\n        delta = -delta;\n      }\n\n      currentPosition.current! += delta;\n\n      if (realTimeTrackDraggingIndex.current != null && trackRef.current) {\n        const percent = clamp(currentPosition.current! / size, 0, 1);\n        state.setThumbPercent(realTimeTrackDraggingIndex.current, percent);\n      }\n    },\n    onMoveEnd() {\n      if (realTimeTrackDraggingIndex.current != null) {\n        state.setThumbDragging(realTimeTrackDraggingIndex.current, false);\n        realTimeTrackDraggingIndex.current = null;\n      }\n    }\n  });\n\n  let currentPointer = useRef<number | null | undefined>(undefined);\n  let onDownTrack = (\n    e: React.UIEvent,\n    id: number | undefined,\n    clientX: number,\n    clientY: number\n  ) => {\n    // We only trigger track-dragging if the user clicks on the track itself and nothing is currently being dragged.\n    if (\n      trackRef.current &&\n      !props.isDisabled &&\n      state.values.every((_, i) => !state.isThumbDragging(i))\n    ) {\n      let {height, width, top, left} = trackRef.current.getBoundingClientRect();\n      let size = isVertical ? height : width;\n      // Find the closest thumb\n      const trackPosition = isVertical ? top : left;\n      const clickPosition = isVertical ? clientY : clientX;\n      const offset = clickPosition - trackPosition;\n      let percent = offset / size;\n      if (direction === 'rtl' || isVertical) {\n        percent = 1 - percent;\n      }\n      let value = state.getPercentValue(percent);\n\n      // to find the closet thumb we split the array based on the first thumb position to the \"right/end\" of the click.\n      let closestThumb;\n      let split = state.values.findIndex(v => value - v < 0);\n      if (split === 0) {\n        // If the index is zero then the closetThumb is the first one\n        closestThumb = split;\n      } else if (split === -1) {\n        // If no index is found they've clicked past all the thumbs\n        closestThumb = state.values.length - 1;\n      } else {\n        let lastLeft = state.values[split - 1];\n        let firstRight = state.values[split];\n        // Pick the last left/start thumb, unless they are stacked on top of each other, then pick the right/end one\n        if (Math.abs(lastLeft - value) < Math.abs(firstRight - value)) {\n          closestThumb = split - 1;\n        } else {\n          closestThumb = split;\n        }\n      }\n\n      // Confirm that the found closest thumb is editable, not disabled, and move it\n      if (closestThumb >= 0 && state.isThumbEditable(closestThumb)) {\n        // Don't unfocus anything\n        e.preventDefault();\n\n        realTimeTrackDraggingIndex.current = closestThumb;\n        state.setFocusedThumb(closestThumb);\n        currentPointer.current = id;\n\n        state.setThumbDragging(realTimeTrackDraggingIndex.current!, true);\n        state.setThumbValue(closestThumb, value);\n\n        addGlobalListener(window, 'mouseup', onUpTrack, false);\n        addGlobalListener(window, 'touchend', onUpTrack, false);\n        addGlobalListener(window, 'pointerup', onUpTrack, false);\n      } else {\n        realTimeTrackDraggingIndex.current = null;\n      }\n    }\n  };\n\n  let onUpTrack = e => {\n    let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n    if (id === currentPointer.current) {\n      if (realTimeTrackDraggingIndex.current != null) {\n        state.setThumbDragging(realTimeTrackDraggingIndex.current, false);\n        realTimeTrackDraggingIndex.current = null;\n      }\n\n      removeGlobalListener(window, 'mouseup', onUpTrack, false);\n      removeGlobalListener(window, 'touchend', onUpTrack, false);\n      removeGlobalListener(window, 'pointerup', onUpTrack, false);\n    }\n  };\n\n  if ('htmlFor' in labelProps && labelProps.htmlFor) {\n    // Ideally the `for` attribute should point to the first thumb, but VoiceOver on iOS\n    // causes this to override the `aria-labelledby` on the thumb. This causes the first\n    // thumb to only be announced as the slider label rather than its individual name as well.\n    // See https://bugs.webkit.org/show_bug.cgi?id=172464.\n    delete labelProps.htmlFor;\n    labelProps.onClick = () => {\n      // Safari does not focus <input type=\"range\"> elements when clicking on an associated <label>,\n      // so do it manually. In addition, make sure we show the focus ring.\n      document.getElementById(getSliderThumbId(state, 0))?.focus();\n      setInteractionModality('keyboard');\n    };\n  }\n\n  return {\n    labelProps,\n    // The root element of the Slider will have role=\"group\" to group together\n    // all the thumb inputs in the Slider.  The label of the Slider will\n    // be used to label the group.\n    groupProps: {\n      role: 'group',\n      ...fieldProps\n    },\n    trackProps: mergeProps(\n      {\n        onMouseDown(e: React.MouseEvent) {\n          if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n            return;\n          }\n          onDownTrack(e, undefined, e.clientX, e.clientY);\n        },\n        onPointerDown(e: React.PointerEvent) {\n          if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n            return;\n          }\n          onDownTrack(e, e.pointerId, e.clientX, e.clientY);\n        },\n        onTouchStart(e: React.TouchEvent) {\n          onDownTrack(\n            e,\n            e.changedTouches[0].identifier,\n            e.changedTouches[0].clientX,\n            e.changedTouches[0].clientY\n          );\n        },\n        style: {\n          position: 'relative',\n          touchAction: 'none'\n        }\n      },\n      moveProps\n    ),\n    outputProps: {\n      htmlFor: state.values.map((_, index) => getSliderThumbId(state, index)).join(' '),\n      'aria-live': 'off'\n    }\n  };\n}\n"],"names":[],"version":3,"file":"useSlider.cjs.map"}

package/dist/private/slider/useSlider.js

@@ -86,8 +86,10 @@ function $da0bbb7d9303a211$export$56b2c08e277f365(props, state, trackRef) {
             // to find the closet thumb we split the array based on the first thumb position to the "right/end" of the click.
             let closestThumb;
             let split = state.values.findIndex((v)=>value - v < 0);
-            if (split === 0) closestThumb = split;
-            else if (split === -1) closestThumb = state.values.length - 1;
+            if (split === 0) // If the index is zero then the closetThumb is the first one
+            closestThumb = split;
+            else if (split === -1) // If no index is found they've clicked past all the thumbs
+            closestThumb = state.values.length - 1;
             else {
                 let lastLeft = state.values[split - 1];
                 let firstRight = state.values[split];

package/dist/private/slider/useSlider.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/react-aria/src/slider/useSlider.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMAttributes, DOMProps, RefObject} from '@react-types/shared';\nimport {clamp} from 'react-stately/private/utils/number';\nimport {getSliderThumbId, sliderData} from './utils';\nimport {mergeProps} from '../utils/mergeProps';\nimport React, {LabelHTMLAttributes, OutputHTMLAttributes, useRef} from 'react';\nimport {setInteractionModality} from '../interactions/useFocusVisible';\nimport {SliderProps, SliderState} from 'react-stately/useSliderState';\nimport {useGlobalListeners} from '../utils/useGlobalListeners';\nimport {useLabel} from '../label/useLabel';\nimport {useLocale} from '../i18n/I18nProvider';\nimport {useMove} from '../interactions/useMove';\n\nexport interface AriaSliderProps<T = number | number[]> extends SliderProps<T>, DOMProps, AriaLabelingProps {}\n\nexport interface SliderAria {\n  /** Props for the label element. */\n  labelProps: LabelHTMLAttributes<HTMLLabelElement>,\n\n  /** Props for the root element of the slider component; groups slider inputs. */\n  groupProps: DOMAttributes,\n\n  /** Props for the track element. */\n  trackProps: DOMAttributes,\n\n  /** Props for the output element, displaying the value of the slider thumbs. */\n  outputProps: OutputHTMLAttributes<HTMLOutputElement>\n}\n\n/**\n * Provides the behavior and accessibility implementation for a slider component representing one or more values.\n *\n * @param props Props for the slider.\n * @param state State for the slider, as returned by `useSliderState`.\n * @param trackRef Ref for the \"track\" element.  The width of this element provides the \"length\"\n * of the track -- the span of one dimensional space that the slider thumb can be.  It also\n * accepts click and drag motions, so that the closest thumb will follow clicks and drags on\n * the track.\n */\nexport function useSlider<T extends number | number[]>(\n  props: AriaSliderProps<T>,\n  state: SliderState,\n  trackRef: RefObject<Element | null>\n): SliderAria {\n  let {labelProps, fieldProps} = useLabel(props);\n\n  let isVertical = props.orientation === 'vertical';\n\n  // Attach id of the label to the state so it can be accessed by useSliderThumb.\n  sliderData.set(state, {\n    id: (labelProps.id ?? fieldProps.id)!,\n    'aria-describedby': props['aria-describedby'],\n    'aria-details': props['aria-details']\n  });\n\n  let {direction} = useLocale();\n\n  let {addGlobalListener, removeGlobalListener} = useGlobalListeners();\n\n  // When the user clicks or drags the track, we want the motion to set and drag the\n  // closest thumb.  Hence we also need to install useMove() on the track element.\n  // Here, we keep track of which index is the \"closest\" to the drag start point.\n  // It is set onMouseDown/onTouchDown; see trackProps below.\n  const realTimeTrackDraggingIndex = useRef<number | null>(null);\n\n  const reverseX = direction === 'rtl';\n  const currentPosition = useRef<number | null>(null);\n  const {moveProps} = useMove({\n    onMoveStart() {\n      currentPosition.current = null;\n    },\n    onMove({deltaX, deltaY}) {\n      if (!trackRef.current) {\n        return;\n      }\n      let {height, width} = trackRef.current.getBoundingClientRect();\n      let size = isVertical ? height : width;\n\n      if (currentPosition.current == null && realTimeTrackDraggingIndex.current != null) {\n        currentPosition.current = state.getThumbPercent(realTimeTrackDraggingIndex.current) * size;\n      }\n\n      let delta = isVertical ? deltaY : deltaX;\n      if (isVertical || reverseX) {\n        delta = -delta;\n      }\n\n      currentPosition.current! += delta;\n\n      if (realTimeTrackDraggingIndex.current != null && trackRef.current) {\n        const percent = clamp(currentPosition.current! / size, 0, 1);\n        state.setThumbPercent(realTimeTrackDraggingIndex.current, percent);\n      }\n    },\n    onMoveEnd() {\n      if (realTimeTrackDraggingIndex.current != null) {\n        state.setThumbDragging(realTimeTrackDraggingIndex.current, false);\n        realTimeTrackDraggingIndex.current = null;\n      }\n    }\n  });\n\n  let currentPointer = useRef<number | null | undefined>(undefined);\n  let onDownTrack = (e: React.UIEvent, id: number | undefined, clientX: number, clientY: number) => {\n    // We only trigger track-dragging if the user clicks on the track itself and nothing is currently being dragged.\n    if (trackRef.current && !props.isDisabled && state.values.every((_, i) => !state.isThumbDragging(i))) {\n      let {height, width, top, left} = trackRef.current.getBoundingClientRect();\n      let size = isVertical ? height : width;\n      // Find the closest thumb\n      const trackPosition = isVertical ? top : left;\n      const clickPosition = isVertical ? clientY : clientX;\n      const offset = clickPosition - trackPosition;\n      let percent = offset / size;\n      if (direction === 'rtl' || isVertical) {\n        percent = 1 - percent;\n      }\n      let value = state.getPercentValue(percent);\n\n      // to find the closet thumb we split the array based on the first thumb position to the \"right/end\" of the click.\n      let closestThumb;\n      let split = state.values.findIndex(v => value - v < 0);\n      if (split === 0) { // If the index is zero then the closetThumb is the first one\n        closestThumb = split;\n      } else if (split === -1) { // If no index is found they've clicked past all the thumbs\n        closestThumb = state.values.length - 1;\n      } else {\n        let lastLeft = state.values[split - 1];\n        let firstRight = state.values[split];\n        // Pick the last left/start thumb, unless they are stacked on top of each other, then pick the right/end one\n        if (Math.abs(lastLeft - value) < Math.abs(firstRight - value)) {\n          closestThumb = split - 1;\n        } else {\n          closestThumb = split;\n        }\n      }\n\n      // Confirm that the found closest thumb is editable, not disabled, and move it\n      if (closestThumb >= 0 && state.isThumbEditable(closestThumb)) {\n        // Don't unfocus anything\n        e.preventDefault();\n\n        realTimeTrackDraggingIndex.current = closestThumb;\n        state.setFocusedThumb(closestThumb);\n        currentPointer.current = id;\n\n        state.setThumbDragging(realTimeTrackDraggingIndex.current!, true);\n        state.setThumbValue(closestThumb, value);\n\n        addGlobalListener(window, 'mouseup', onUpTrack, false);\n        addGlobalListener(window, 'touchend', onUpTrack, false);\n        addGlobalListener(window, 'pointerup', onUpTrack, false);\n      } else {\n        realTimeTrackDraggingIndex.current = null;\n      }\n    }\n  };\n\n  let onUpTrack = (e) => {\n    let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n    if (id === currentPointer.current) {\n      if (realTimeTrackDraggingIndex.current != null) {\n        state.setThumbDragging(realTimeTrackDraggingIndex.current, false);\n        realTimeTrackDraggingIndex.current = null;\n      }\n\n      removeGlobalListener(window, 'mouseup', onUpTrack, false);\n      removeGlobalListener(window, 'touchend', onUpTrack, false);\n      removeGlobalListener(window, 'pointerup', onUpTrack, false);\n    }\n  };\n\n  if ('htmlFor' in labelProps && labelProps.htmlFor) {\n    // Ideally the `for` attribute should point to the first thumb, but VoiceOver on iOS\n    // causes this to override the `aria-labelledby` on the thumb. This causes the first\n    // thumb to only be announced as the slider label rather than its individual name as well.\n    // See https://bugs.webkit.org/show_bug.cgi?id=172464.\n    delete labelProps.htmlFor;\n    labelProps.onClick = () => {\n      // Safari does not focus <input type=\"range\"> elements when clicking on an associated <label>,\n      // so do it manually. In addition, make sure we show the focus ring.\n      document.getElementById(getSliderThumbId(state, 0))?.focus();\n      setInteractionModality('keyboard');\n    };\n  }\n\n  return {\n    labelProps,\n    // The root element of the Slider will have role=\"group\" to group together\n    // all the thumb inputs in the Slider.  The label of the Slider will\n    // be used to label the group.\n    groupProps: {\n      role: 'group',\n      ...fieldProps\n    },\n    trackProps: mergeProps({\n      onMouseDown(e: React.MouseEvent) {\n        if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n          return;\n        }\n        onDownTrack(e, undefined, e.clientX, e.clientY);\n      },\n      onPointerDown(e: React.PointerEvent) {\n        if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n          return;\n        }\n        onDownTrack(e, e.pointerId, e.clientX, e.clientY);\n      },\n      onTouchStart(e: React.TouchEvent) { onDownTrack(e, e.changedTouches[0].identifier, e.changedTouches[0].clientX, e.changedTouches[0].clientY); },\n      style: {\n        position: 'relative',\n        touchAction: 'none'\n      }\n    }, moveProps),\n    outputProps: {\n      htmlFor: state.values.map((_, index) => getSliderThumbId(state, index)).join(' '),\n      'aria-live': 'off'\n    }\n  };\n}\n"],"names":[],"version":3,"file":"useSlider.js.map"}
+{"mappings":"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","sources":["packages/react-aria/src/slider/useSlider.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaLabelingProps, DOMAttributes, DOMProps, RefObject} from '@react-types/shared';\nimport {clamp} from 'react-stately/private/utils/number';\nimport {getSliderThumbId, sliderData} from './utils';\nimport {mergeProps} from '../utils/mergeProps';\nimport React, {LabelHTMLAttributes, OutputHTMLAttributes, useRef} from 'react';\nimport {setInteractionModality} from '../interactions/useFocusVisible';\nimport {SliderProps, SliderState} from 'react-stately/useSliderState';\nimport {useGlobalListeners} from '../utils/useGlobalListeners';\nimport {useLabel} from '../label/useLabel';\nimport {useLocale} from '../i18n/I18nProvider';\nimport {useMove} from '../interactions/useMove';\n\nexport interface AriaSliderProps<T = number | number[]>\n  extends SliderProps<T>, DOMProps, AriaLabelingProps {}\n\nexport interface SliderAria {\n  /** Props for the label element. */\n  labelProps: LabelHTMLAttributes<HTMLLabelElement>;\n\n  /** Props for the root element of the slider component; groups slider inputs. */\n  groupProps: DOMAttributes;\n\n  /** Props for the track element. */\n  trackProps: DOMAttributes;\n\n  /** Props for the output element, displaying the value of the slider thumbs. */\n  outputProps: OutputHTMLAttributes<HTMLOutputElement>;\n}\n\n/**\n * Provides the behavior and accessibility implementation for a slider component representing one or\n * more values.\n *\n * @param props Props for the slider.\n * @param state State for the slider, as returned by `useSliderState`.\n * @param trackRef Ref for the \"track\" element.  The width of this element provides the \"length\"\n *   of the track -- the span of one dimensional space that the slider thumb can be.  It also\n *   accepts click and drag motions, so that the closest thumb will follow clicks and drags on\n *   the track.\n */\nexport function useSlider<T extends number | number[]>(\n  props: AriaSliderProps<T>,\n  state: SliderState,\n  trackRef: RefObject<Element | null>\n): SliderAria {\n  let {labelProps, fieldProps} = useLabel(props);\n\n  let isVertical = props.orientation === 'vertical';\n\n  // Attach id of the label to the state so it can be accessed by useSliderThumb.\n  sliderData.set(state, {\n    id: (labelProps.id ?? fieldProps.id)!,\n    'aria-describedby': props['aria-describedby'],\n    'aria-details': props['aria-details']\n  });\n\n  let {direction} = useLocale();\n\n  let {addGlobalListener, removeGlobalListener} = useGlobalListeners();\n\n  // When the user clicks or drags the track, we want the motion to set and drag the\n  // closest thumb.  Hence we also need to install useMove() on the track element.\n  // Here, we keep track of which index is the \"closest\" to the drag start point.\n  // It is set onMouseDown/onTouchDown; see trackProps below.\n  const realTimeTrackDraggingIndex = useRef<number | null>(null);\n\n  const reverseX = direction === 'rtl';\n  const currentPosition = useRef<number | null>(null);\n  const {moveProps} = useMove({\n    onMoveStart() {\n      currentPosition.current = null;\n    },\n    onMove({deltaX, deltaY}) {\n      if (!trackRef.current) {\n        return;\n      }\n      let {height, width} = trackRef.current.getBoundingClientRect();\n      let size = isVertical ? height : width;\n\n      if (currentPosition.current == null && realTimeTrackDraggingIndex.current != null) {\n        currentPosition.current = state.getThumbPercent(realTimeTrackDraggingIndex.current) * size;\n      }\n\n      let delta = isVertical ? deltaY : deltaX;\n      if (isVertical || reverseX) {\n        delta = -delta;\n      }\n\n      currentPosition.current! += delta;\n\n      if (realTimeTrackDraggingIndex.current != null && trackRef.current) {\n        const percent = clamp(currentPosition.current! / size, 0, 1);\n        state.setThumbPercent(realTimeTrackDraggingIndex.current, percent);\n      }\n    },\n    onMoveEnd() {\n      if (realTimeTrackDraggingIndex.current != null) {\n        state.setThumbDragging(realTimeTrackDraggingIndex.current, false);\n        realTimeTrackDraggingIndex.current = null;\n      }\n    }\n  });\n\n  let currentPointer = useRef<number | null | undefined>(undefined);\n  let onDownTrack = (\n    e: React.UIEvent,\n    id: number | undefined,\n    clientX: number,\n    clientY: number\n  ) => {\n    // We only trigger track-dragging if the user clicks on the track itself and nothing is currently being dragged.\n    if (\n      trackRef.current &&\n      !props.isDisabled &&\n      state.values.every((_, i) => !state.isThumbDragging(i))\n    ) {\n      let {height, width, top, left} = trackRef.current.getBoundingClientRect();\n      let size = isVertical ? height : width;\n      // Find the closest thumb\n      const trackPosition = isVertical ? top : left;\n      const clickPosition = isVertical ? clientY : clientX;\n      const offset = clickPosition - trackPosition;\n      let percent = offset / size;\n      if (direction === 'rtl' || isVertical) {\n        percent = 1 - percent;\n      }\n      let value = state.getPercentValue(percent);\n\n      // to find the closet thumb we split the array based on the first thumb position to the \"right/end\" of the click.\n      let closestThumb;\n      let split = state.values.findIndex(v => value - v < 0);\n      if (split === 0) {\n        // If the index is zero then the closetThumb is the first one\n        closestThumb = split;\n      } else if (split === -1) {\n        // If no index is found they've clicked past all the thumbs\n        closestThumb = state.values.length - 1;\n      } else {\n        let lastLeft = state.values[split - 1];\n        let firstRight = state.values[split];\n        // Pick the last left/start thumb, unless they are stacked on top of each other, then pick the right/end one\n        if (Math.abs(lastLeft - value) < Math.abs(firstRight - value)) {\n          closestThumb = split - 1;\n        } else {\n          closestThumb = split;\n        }\n      }\n\n      // Confirm that the found closest thumb is editable, not disabled, and move it\n      if (closestThumb >= 0 && state.isThumbEditable(closestThumb)) {\n        // Don't unfocus anything\n        e.preventDefault();\n\n        realTimeTrackDraggingIndex.current = closestThumb;\n        state.setFocusedThumb(closestThumb);\n        currentPointer.current = id;\n\n        state.setThumbDragging(realTimeTrackDraggingIndex.current!, true);\n        state.setThumbValue(closestThumb, value);\n\n        addGlobalListener(window, 'mouseup', onUpTrack, false);\n        addGlobalListener(window, 'touchend', onUpTrack, false);\n        addGlobalListener(window, 'pointerup', onUpTrack, false);\n      } else {\n        realTimeTrackDraggingIndex.current = null;\n      }\n    }\n  };\n\n  let onUpTrack = e => {\n    let id = e.pointerId ?? e.changedTouches?.[0].identifier;\n    if (id === currentPointer.current) {\n      if (realTimeTrackDraggingIndex.current != null) {\n        state.setThumbDragging(realTimeTrackDraggingIndex.current, false);\n        realTimeTrackDraggingIndex.current = null;\n      }\n\n      removeGlobalListener(window, 'mouseup', onUpTrack, false);\n      removeGlobalListener(window, 'touchend', onUpTrack, false);\n      removeGlobalListener(window, 'pointerup', onUpTrack, false);\n    }\n  };\n\n  if ('htmlFor' in labelProps && labelProps.htmlFor) {\n    // Ideally the `for` attribute should point to the first thumb, but VoiceOver on iOS\n    // causes this to override the `aria-labelledby` on the thumb. This causes the first\n    // thumb to only be announced as the slider label rather than its individual name as well.\n    // See https://bugs.webkit.org/show_bug.cgi?id=172464.\n    delete labelProps.htmlFor;\n    labelProps.onClick = () => {\n      // Safari does not focus <input type=\"range\"> elements when clicking on an associated <label>,\n      // so do it manually. In addition, make sure we show the focus ring.\n      document.getElementById(getSliderThumbId(state, 0))?.focus();\n      setInteractionModality('keyboard');\n    };\n  }\n\n  return {\n    labelProps,\n    // The root element of the Slider will have role=\"group\" to group together\n    // all the thumb inputs in the Slider.  The label of the Slider will\n    // be used to label the group.\n    groupProps: {\n      role: 'group',\n      ...fieldProps\n    },\n    trackProps: mergeProps(\n      {\n        onMouseDown(e: React.MouseEvent) {\n          if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {\n            return;\n          }\n          onDownTrack(e, undefined, e.clientX, e.clientY);\n        },\n        onPointerDown(e: React.PointerEvent) {\n          if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {\n            return;\n          }\n          onDownTrack(e, e.pointerId, e.clientX, e.clientY);\n        },\n        onTouchStart(e: React.TouchEvent) {\n          onDownTrack(\n            e,\n            e.changedTouches[0].identifier,\n            e.changedTouches[0].clientX,\n            e.changedTouches[0].clientY\n          );\n        },\n        style: {\n          position: 'relative',\n          touchAction: 'none'\n        }\n      },\n      moveProps\n    ),\n    outputProps: {\n      htmlFor: state.values.map((_, index) => getSliderThumbId(state, index)).join(' '),\n      'aria-live': 'off'\n    }\n  };\n}\n"],"names":[],"version":3,"file":"useSlider.js.map"}

package/dist/private/slider/useSlider.mjs

@@ -85,8 +85,10 @@ function $4b964a467b2bc7ea$export$56b2c08e277f365(props, state, trackRef) {
             // to find the closet thumb we split the array based on the first thumb position to the "right/end" of the click.
             let closestThumb;
             let split = state.values.findIndex((v)=>value - v < 0);
-            if (split === 0) closestThumb = split;
-            else if (split === -1) closestThumb = state.values.length - 1;
+            if (split === 0) // If the index is zero then the closetThumb is the first one
+            closestThumb = split;
+            else if (split === -1) // If no index is found they've clicked past all the thumbs
+            closestThumb = state.values.length - 1;
             else {
                 let lastLeft = state.values[split - 1];
                 let firstRight = state.values[split];