{"ast":null,"code":"import _defineProperty from \"@babel/runtime/helpers/defineProperty\";\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\nimport { usePress } from '@react-native-aria/interactions';\nimport { useSelectableItem } from '@react-aria/selection';\nimport { useMapDomPropsToRN } from '@react-native-aria/utils';\nvar tabsIds = new WeakMap();\nexport function useTab(props, state, ref) {\n  var item = props.item,\n    propsDisabled = props.isDisabled;\n  var key = item.key;\n  var manager = state.selectionManager,\n    selectedKey = state.selectedKey;\n  var isSelected = key === selectedKey;\n  var _useSelectableItem = useSelectableItem({\n      selectionManager: manager,\n      key: key,\n      ref: ref\n    }),\n    itemProps = _useSelectableItem.itemProps;\n  var isDisabled = propsDisabled || state.disabledKeys.has(key);\n  var _usePress = usePress(_objectSpread(_objectSpread({}, itemProps), {}, {\n      isDisabled: isDisabled\n    })),\n    pressProps = _usePress.pressProps;\n  var tabId = generateId(state, key, 'tab');\n  var tabPanelId = generateId(state, key, 'tabpanel');\n  var tabIndex = pressProps.tabIndex;\n  if (isSelected && !isDisabled) {\n    tabIndex = 0;\n  }\n  var onMouseDown = function onMouseDown(e) {\n    return e.stopPropagation();\n  };\n  var tabPropsTemp = _objectSpread(_objectSpread({}, pressProps), {}, {\n    onMouseDown: onMouseDown,\n    'id': tabId,\n    'aria-selected': isSelected,\n    'aria-disabled': isDisabled || undefined,\n    'aria-controls': isSelected ? tabPanelId : undefined,\n    'tabIndex': isDisabled ? undefined : tabIndex,\n    'role': 'tab'\n  });\n  var tabProps = useMapDomPropsToRN(tabPropsTemp, ref);\n  return {\n    tabProps: tabProps\n  };\n}\nfunction generateId(state, key, role) {\n  if (typeof key === 'string') {\n    key = key.replace(/\\s+/g, '');\n  }\n  var baseId = tabsIds.get(state);\n  return baseId + \"-\" + role + \"-\" + key;\n}","map":{"version":3,"sources":["useTab.web.ts"],"names":["usePress","useSelectableItem","useMapDomPropsToRN","tabsIds","WeakMap","useTab","props","state","ref","item","isDisabled","propsDisabled","key","selectionManager","manager","selectedKey","isSelected","itemProps","disabledKeys","has","pressProps","tabId","generateId","tabPanelId","tabIndex","onMouseDown","e","stopPropagation","tabPropsTemp","undefined","tabProps","role","replace","baseId","get"],"mappings":";;;AAGA,SAASA,QAAT,QAAyB,iCAAzB;AACA,SACEC,iBADF,QAEO,uBAFP;AAGA,SAASC,kBAAT,QAAmC,0BAAnC;AAGA,IAAMC,OAAO,GAAG,IAAIC,OAAJ,CAAA,CAAhB;AAOA,OAAO,SAASC,MAAT,CACLC,KADK,EAELC,KAFK,EAGLC,GAHK,EAII;EACT,IAAMC,IAAF,GAAsCH,KAA1C,CAAMG,IAAF;IAAoBE,aAAAA,GAAkBL,KAA1C,CAAYI,UAAU;EACtB,IAAME,GAAAA,GAAQH,IAAd,CAAMG,GAAAA;EACN,IAAwBE,OAApB,GAA6CP,KAAjD,CAAMM,gBAAgB;IAAWE,WAAAA,GAAgBR,KAAjD,CAAiCQ,WAAAA;EAEjC,IAAIC,UAAU,GAAGJ,GAAG,KAAKG,WAAzB;EAEA,IAAA,kBAAA,GAAoBd,iBAAiB,CAAC;MACpCY,gBAAgB,EAAEC,OADkB;MAEpCF,GAFoC,EAEpCA,GAFoC;MAGpCJ,GAAAA,EAAAA;IAHoC,CAAD,CAArC;IAAMS,SAAAA,GAAAA,kBAAAA,CAAAA,SAAAA;EAKN,IAAIP,UAAU,GAAGC,aAAa,IAAIJ,KAAK,CAACW,YAANX,CAAmBY,GAAnBZ,CAAuBK,GAAvBL,CAAlC;EAEA,IAAA,SAAA,GAAqBP,QAAQ,CAAA,aAAA,CAAA,aAAA,KAAMiB,SAAL;MAAgBP,UAAAA,EAAAA;IAAAA,EAAjB,CAA7B;IAAMU,UAAAA,GAAAA,SAAAA,CAAAA,UAAAA;EACN,IAAIC,KAAK,GAAGC,UAAU,CAACf,KAAD,EAAQK,GAAR,EAAa,KAAb,CAAtB;EACA,IAAIW,UAAU,GAAGD,UAAU,CAACf,KAAD,EAAQK,GAAR,EAAa,UAAb,CAA3B;EACA,IAAMY,QAAAA,GAAaJ,UAjBV,CAiBHI,QAAAA;EAGN,IAAIR,UAAU,IAAI,CAACN,UAAnB,EAA+B;IAC7Bc,QAAQ,GAAG,CAAXA;EArBO;EA8BT,IAAMC,WAAW,GAAMC,SAAjBD,WAAW,CAAMC,CAAD;IAAA,OAAWA,CAAC,CAACC,eAAFD,CAAAA,CAAjC;EAAA;EAEA,IAAME,YAAY,GAAA,aAAA,CAAA,aAAA,KACbR,UADiB;IAEpBK,WAFoB,EAEpBA,WAFoB;IAGpB,IAAA,EAAMJ,KAHc;IAIpB,eAAA,EAAiBL,UAJG;IAKpB,eAAA,EAAiBN,UAAU,IAAImB,SALX;IAMpB,eAAA,EAAiBb,UAAU,GAAGO,UAAH,GAAgBM,SANvB;IAOpB,UAAA,EAAYnB,UAAU,GAAGmB,SAAH,GAAeL,QAPjB;IAQpB,MAAA,EAAQ;EAAA,EARV;EAWA,IAAMM,QAAQ,GAAG5B,kBAAkB,CAAC0B,YAAD,EAAepB,GAAf,CAAnC;EAEA,OAAO;IACLsB,QAAAA,EAAAA;EADK,CAAP;AAGD;AAED,SAASR,UAAT,CACEf,KADF,EAEEK,GAFF,EAGEmB,IAHF,EAIE;EACA,IAAI,OAAOnB,GAAP,KAAe,QAAnB,EAA6B;IAC3BA,GAAG,GAAGA,GAAG,CAACoB,OAAJpB,CAAY,MAAZA,EAAoB,EAApBA,CAANA;EACD;EAED,IAAIqB,MAAM,GAAG9B,OAAO,CAAC+B,GAAR/B,CAAYI,KAAZJ,CAAb;EACA,OAAU8B,MAAO,SAAGF,IAAK,SAAGnB,GAA5B;AACD","sourcesContent":["import { AriaTabProps } from '@react-types/tabs';\nimport { HTMLAttributes, Key, RefObject } from 'react';\nimport { SingleSelectListState } from '@react-stately/list';\nimport { usePress } from '@react-native-aria/interactions';\nimport {\n  useSelectableItem,\n} from '@react-aria/selection';\nimport { useMapDomPropsToRN } from '@react-native-aria/utils';\n\n\nconst tabsIds = new WeakMap<SingleSelectListState<unknown>, string>();\n\ninterface TabAria {\n  /** Props for the tab element. */\n  tabProps: HTMLAttributes<HTMLElement>;\n}\n\nexport function useTab<T>(\n  props: AriaTabProps<T>,\n  state: SingleSelectListState<T>,\n  ref: RefObject<HTMLElement>\n): TabAria {\n  let { item, isDisabled: propsDisabled } = props;\n  let { key } = item;\n  let { selectionManager: manager, selectedKey } = state;\n\n  let isSelected = key === selectedKey;\n\n  let { itemProps } = useSelectableItem({\n    selectionManager: manager,\n    key,\n    ref,\n  });\n  let isDisabled = propsDisabled || state.disabledKeys.has(key);\n\n  let { pressProps } = usePress({ ...itemProps, isDisabled });\n  let tabId = generateId(state, key, 'tab');\n  let tabPanelId = generateId(state, key, 'tabpanel');\n  let { tabIndex } = pressProps;\n\n  // selected tab should have tabIndex=0, when it initializes\n  if (isSelected && !isDisabled) {\n    tabIndex = 0;\n  }\n\n  \n  // Putting this as a last resort, after several hours of debugging.\n  // Why?\n  // tabListProps adds onMouseDown with preventDefault in useSelectableCollection.ts (React Aria) and react-native-web uses onClick for onPress.\n  // This results in tab button not getting focused when clicked\n  // See this example - https://codesandbox.io/s/issue-i-know-but-dont-know-why-1-ydyw5?file=/src/App.js\n  const onMouseDown  =  (e:any) => e.stopPropagation();\n\n  const tabPropsTemp  = {\n    ...pressProps,\n    onMouseDown,\n    'id': tabId,\n    'aria-selected': isSelected,\n    'aria-disabled': isDisabled || undefined,\n    'aria-controls': isSelected ? tabPanelId : undefined,\n    'tabIndex': isDisabled ? undefined : tabIndex,\n    'role': 'tab',\n  }\n  \n  const tabProps = useMapDomPropsToRN(tabPropsTemp, ref)\n\n  return {\n    tabProps\n  };\n}\n\nfunction generateId<T>(\n  state: SingleSelectListState<T>,\n  key: Key,\n  role: string\n) {\n  if (typeof key === 'string') {\n    key = key.replace(/\\s+/g, '');\n  }\n\n  let baseId = tabsIds.get(state);\n  return `${baseId}-${role}-${key}`;\n}\n"]},"metadata":{},"sourceType":"module"}