@visa/nova-react/use-tabs/index.js

Visa Product Design System Nova React library

/**
 *              Copyright (c) 2025 Visa, Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *         http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 **/
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react");const t={autoSelect:!1,defaultSelected:-1,arrowKeyNavigation:null},r=r=>{const{defaultSelected:n,...a}={...t,...r},l=e.useRef([]),[o,u]=e.useState(n),[s,c]=e.useState(n),[i,f]=e.useState([]),[d,v]=e.useState("horizontal"),p=-1===s?0:i.indexOf(s),S=e.useRef(null),g=i.length,w=g-1,y=a?.ref||l;return e.useEffect((()=>{f(y.current?.map(((e,t)=>!e?.disabled&&t)).filter((e=>!1!==e)))}),[y]),e.useEffect((()=>{(()=>{if(null===a.arrowKeyNavigation){if(y.current&&y.current[0]instanceof HTMLElement){const e=y.current[0].parentElement?.parentElement;e&&e.classList.contains("v-tabs-vertical")&&v("vertical")}}else v(a.arrowKeyNavigation)})()}),[]),{getTabIndex:(e,t=!1)=>(t||null!==S.current||(S.current=e),o===e||-1===o&&S.current===e?0:-1),onIndexChange:(e,t=!1)=>{t||(u(e),c(e))},onKeyNavigation:e=>{const t=e.key;let r=null;if("ArrowRight"===t&&"vertical"!==d&&"none"!==d||"ArrowDown"===t&&"horizontal"!==d&&"none"!==d?r=(p+1)%g:"ArrowLeft"===t&&"vertical"!==d&&"none"!==d||"ArrowUp"===t&&"horizontal"!==d&&"none"!==d?r=p-1<0?w:p-1:"End"===t?r=w:"Home"===t&&(r=0),"Tab"===t&&c(o),y.current&&null!==r&&g){e.preventDefault();const t=i[r];a.autoSelect&&u(t),c(t),y.current[t]?.focus()}},ref:y,selectedIndex:o}};r.displayName="useTabs",r.defaultProps={autoSelect:!1,defaultSelected:-1,arrowKeyNavigation:null},exports.default=r,exports.useTabs=r;