npm - @zag-js/tabs - Versions diffs - 0.51.1 → 0.52.0 - Mend

@zag-js/tabs 0.51.1 → 0.52.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/dist/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:true})};var __copyProps=(to,from,except,desc)=>{if(from&&typeof from==="object"||typeof from==="function"){for(let key of __getOwnPropNames(from))if(!__hasOwnProp.call(to,key)&&key!==except)__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable})}return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:true}),mod);var src_exports={};__export(src_exports,{anatomy:()=>anatomy,connect:()=>connect,contentProps:()=>contentProps,machine:()=>machine,props:()=>props,splitContentProps:()=>splitContentProps,splitProps:()=>splitProps,splitTriggerProps:()=>splitTriggerProps,triggerProps:()=>triggerProps});module.exports=__toCommonJS(src_exports);var import_anatomy=require("@zag-js/anatomy");var anatomy=(0,import_anatomy.createAnatomy)("tabs").parts("root","list","trigger","content","indicator");var parts=anatomy.build();var import_dom_event=require("@zag-js/dom-event");var import_dom_query2=require("@zag-js/dom-query");var import_dom_query=require("@zag-js/dom-query");var import_utils=require("@zag-js/utils");var dom=(0,import_dom_query.createScope)({getRootId:ctx=>ctx.ids?.root??`tabs:${ctx.id}`,getListId:ctx=>ctx.ids?.list??`tabs:${ctx.id}:list`,getContentId:(ctx,id)=>ctx.ids?.content??`tabs:${ctx.id}:content-${id}`,getTriggerId:(ctx,id)=>ctx.ids?.trigger??`tabs:${ctx.id}:trigger-${id}`,getIndicatorId:ctx=>ctx.ids?.indicator??`tabs:${ctx.id}:indicator`,getListEl:ctx=>dom.getById(ctx,dom.getListId(ctx)),getContentEl:(ctx,id)=>dom.getById(ctx,dom.getContentId(ctx,id)),getTriggerEl:(ctx,id)=>dom.getById(ctx,dom.getTriggerId(ctx,id)),getIndicatorEl:ctx=>dom.getById(ctx,dom.getIndicatorId(ctx)),getElements:ctx=>{const ownerId=CSS.escape(dom.getListId(ctx));const selector=`[role=tab][data-ownedby='${ownerId}']:not([disabled])`;return(0,import_dom_query.queryAll)(dom.getListEl(ctx),selector)},getFirstTriggerEl:ctx=>(0,import_utils.first)(dom.getElements(ctx)),getLastTriggerEl:ctx=>(0,import_utils.last)(dom.getElements(ctx)),getNextTriggerEl:(ctx,id)=>(0,import_dom_query.nextById)(dom.getElements(ctx),dom.getTriggerId(ctx,id),ctx.loopFocus),getPrevTriggerEl:(ctx,id)=>(0,import_dom_query.prevById)(dom.getElements(ctx),dom.getTriggerId(ctx,id),ctx.loopFocus),getSelectedContentEl:ctx=>{if(!ctx.value)return;return dom.getContentEl(ctx,ctx.value)},getSelectedTriggerEl:ctx=>{if(!ctx.value)return;return dom.getTriggerEl(ctx,ctx.value)},getOffsetRect:el=>{return{left:el?.offsetLeft??0,top:el?.offsetTop??0,width:el?.offsetWidth??0,height:el?.offsetHeight??0}},getRectById:(ctx,id)=>{const tab=(0,import_dom_query.itemById)(dom.getElements(ctx),dom.getTriggerId(ctx,id));return dom.resolveRect(dom.getOffsetRect(tab))},resolveRect:rect=>({width:`${rect.width}px`,height:`${rect.height}px`,left:`${rect.left}px`,top:`${rect.top}px`})});function connect(state,send,normalize){const translations=state.context.translations;const focused=state.matches("focused");const isVertical=state.context.orientation==="vertical";const isHorizontal=state.context.orientation==="horizontal";const composite=state.context.composite;const indicator=state.context.indicatorState;function getTriggerState(props2){return{selected:state.context.value===props2.value,focused:state.context.focusedValue===props2.value,disabled:!!props2.disabled}}return{value:state.context.value,focusedValue:state.context.focusedValue,setValue(value){send({type:"SET_VALUE",value})},clearValue(){send({type:"CLEAR_VALUE"})},setIndicatorRect(value){const id=dom.getTriggerId(state.context,value);send({type:"SET_INDICATOR_RECT",id})},syncTabIndex(){send("SYNC_TAB_INDEX")},selectNext(fromValue){send({type:"TAB_FOCUS",value:fromValue,src:"selectNext"});send({type:"ARROW_NEXT",src:"selectNext"})},selectPrev(fromValue){send({type:"TAB_FOCUS",value:fromValue,src:"selectPrev"});send({type:"ARROW_PREV",src:"selectPrev"})},focus(){dom.getSelectedTriggerEl(state.context)?.focus()},getTriggerState,rootProps:normalize.element({...parts.root.attrs,id:dom.getRootId(state.context),"data-orientation":state.context.orientation,"data-focus":(0,import_dom_query2.dataAttr)(focused),dir:state.context.dir}),listProps:normalize.element({...parts.list.attrs,id:dom.getListId(state.context),role:"tablist",dir:state.context.dir,"data-focus":(0,import_dom_query2.dataAttr)(focused),"aria-orientation":state.context.orientation,"data-orientation":state.context.orientation,"aria-label":translations?.listLabel,onKeyDown(event){if(event.defaultPrevented)return;const evt=(0,import_dom_event.getNativeEvent)(event);if(!(0,import_dom_query2.isSelfTarget)(evt))return;if(evt.isComposing)return;const keyMap={ArrowDown(){if(isHorizontal)return;send({type:"ARROW_NEXT",key:"ArrowDown"})},ArrowUp(){if(isHorizontal)return;send({type:"ARROW_PREV",key:"ArrowUp"})},ArrowLeft(){if(isVertical)return;send({type:"ARROW_PREV",key:"ArrowLeft"})},ArrowRight(){if(isVertical)return;send({type:"ARROW_NEXT",key:"ArrowRight"})},Home(){send("HOME")},End(){send("END")},Enter(){send({type:"ENTER"})}};let key=(0,import_dom_event.getEventKey)(event,state.context);const exec=keyMap[key];if(exec){event.preventDefault();exec(event)}}}),getTriggerProps(props2){const{value,disabled}=props2;const triggerState=getTriggerState(props2);return normalize.button({...parts.trigger.attrs,role:"tab",type:"button",disabled,dir:state.context.dir,"data-orientation":state.context.orientation,"data-disabled":(0,import_dom_query2.dataAttr)(disabled),"aria-disabled":disabled,"data-value":value,"aria-selected":triggerState.selected,"data-selected":(0,import_dom_query2.dataAttr)(triggerState.selected),"data-focus":(0,import_dom_query2.dataAttr)(triggerState.focused),"aria-controls":triggerState.selected?dom.getContentId(state.context,value):void 0,"data-ownedby":dom.getListId(state.context),id:dom.getTriggerId(state.context,value),tabIndex:triggerState.selected&&composite?0:-1,onFocus(){send({type:"TAB_FOCUS",value})},onBlur(event){const target=event.relatedTarget;if(target?.getAttribute("role")!=="tab"){send({type:"TAB_BLUR"})}},onClick(event){if(event.defaultPrevented)return;if(disabled)return;if((0,import_dom_query2.isSafari)()){event.currentTarget.focus()}send({type:"TAB_CLICK",value})}})},getContentProps(props2){const{value}=props2;const selected=state.context.value===value;return normalize.element({...parts.content.attrs,dir:state.context.dir,id:dom.getContentId(state.context,value),tabIndex:composite?0:-1,"aria-labelledby":dom.getTriggerId(state.context,value),role:"tabpanel","data-ownedby":dom.getListId(state.context),"data-selected":(0,import_dom_query2.dataAttr)(selected),"data-orientation":state.context.orientation,hidden:!selected})},indicatorProps:normalize.element({id:dom.getIndicatorId(state.context),...parts.indicator.attrs,dir:state.context.dir,"data-orientation":state.context.orientation,style:{"--transition-property":"left, right, top, bottom, width, height","--left":indicator.rect?.left,"--top":indicator.rect?.top,"--width":indicator.rect?.width,"--height":indicator.rect?.height,position:"absolute",willChange:"var(--transition-property)",transitionProperty:"var(--transition-property)",transitionDuration:indicator.transition?"var(--transition-duration, 150ms)":"0ms",transitionTimingFunction:"var(--transition-timing-function)",[isHorizontal?"left":"top"]:isHorizontal?"var(--left)":"var(--top)"}})}}var import_core=require("@zag-js/core");var import_dom_event2=require("@zag-js/dom-event");var import_dom_query3=require("@zag-js/dom-query");var import_element_rect=require("@zag-js/element-rect");var import_utils2=require("@zag-js/utils");var{not}=import_core.guards;function machine(userContext){const ctx=(0,import_utils2.compact)(userContext);return(0,import_core.createMachine)({initial:"idle",context:{dir:"ltr",orientation:"horizontal",activationMode:"automatic",value:null,loopFocus:true,composite:true,...ctx,focusedValue:ctx.value??null,indicatorState:{rendered:false,transition:false,rect:{left:"0px",top:"0px",width:"0px",height:"0px"}}},watch:{value:["allowIndicatorTransition","syncIndicatorRect","syncTabIndex","clickIfLink"],dir:["syncIndicatorRect"],orientation:["syncIndicatorRect"]},on:{SET_VALUE:{actions:"setValue"},CLEAR_VALUE:{actions:"clearValue"},SET_INDICATOR_RECT:{actions:"setIndicatorRect"},SYNC_TAB_INDEX:{actions:"syncTabIndex"}},created:["syncFocusedValue"],entry:["checkRenderedElements","syncIndicatorRect","syncTabIndex"],exit:["cleanupObserver"],states:{idle:{on:{TAB_FOCUS:{target:"focused",actions:"setFocusedValue"},TAB_CLICK:{target:"focused",actions:["setFocusedValue","setValue"]}}},focused:{on:{TAB_CLICK:{target:"focused",actions:["setFocusedValue","setValue"]},ARROW_PREV:[{guard:"selectOnFocus",actions:["focusPrevTab","selectFocusedTab"]},{actions:"focusPrevTab"}],ARROW_NEXT:[{guard:"selectOnFocus",actions:["focusNextTab","selectFocusedTab"]},{actions:"focusNextTab"}],HOME:[{guard:"selectOnFocus",actions:["focusFirstTab","selectFocusedTab"]},{actions:"focusFirstTab"}],END:[{guard:"selectOnFocus",actions:["focusLastTab","selectFocusedTab"]},{actions:"focusLastTab"}],ENTER:{guard:not("selectOnFocus"),actions:"selectFocusedTab"},TAB_FOCUS:{actions:["setFocusedValue"]},TAB_BLUR:{target:"idle",actions:"clearFocusedValue"}}}}},{guards:{selectOnFocus:ctx2=>ctx2.activationMode==="automatic"},actions:{syncFocusedValue(ctx2){if(ctx2.value!=null&&ctx2.focusedValue==null){ctx2.focusedValue=ctx2.value}},selectFocusedTab(ctx2){(0,import_dom_query3.raf)(()=>{set.value(ctx2,ctx2.focusedValue)})},setFocusedValue(ctx2,evt){if(evt.value==null)return;set.focusedValue(ctx2,evt.value)},clearFocusedValue(ctx2){set.focusedValue(ctx2,null)},setValue(ctx2,evt){set.value(ctx2,evt.value)},clearValue(ctx2){set.value(ctx2,null)},focusFirstTab(ctx2){(0,import_dom_query3.raf)(()=>{dom.getFirstTriggerEl(ctx2)?.focus()})},focusLastTab(ctx2){(0,import_dom_query3.raf)(()=>{dom.getLastTriggerEl(ctx2)?.focus()})},focusNextTab(ctx2){if(!ctx2.focusedValue)return;const triggerEl=dom.getNextTriggerEl(ctx2,ctx2.focusedValue);(0,import_dom_query3.raf)(()=>{if(ctx2.composite){triggerEl?.focus()}else if(triggerEl?.dataset.value!=null){set.focusedValue(ctx2,triggerEl.dataset.value)}})},focusPrevTab(ctx2){if(!ctx2.focusedValue)return;const triggerEl=dom.getPrevTriggerEl(ctx2,ctx2.focusedValue);(0,import_dom_query3.raf)(()=>{if(ctx2.composite){triggerEl?.focus()}else if(triggerEl?.dataset.value!=null){set.focusedValue(ctx2,triggerEl.dataset.value)}})},checkRenderedElements(ctx2){ctx2.indicatorState.rendered=!!dom.getIndicatorEl(ctx2)},syncTabIndex(ctx2){(0,import_dom_query3.raf)(()=>{const contentEl=dom.getSelectedContentEl(ctx2);if(!contentEl)return;const focusables=(0,import_dom_query3.getFocusables)(contentEl);if(focusables.length>0){contentEl.removeAttribute("tabindex")}else{contentEl.setAttribute("tabindex","0")}})},cleanupObserver(ctx2){ctx2.indicatorCleanup?.()},allowIndicatorTransition(ctx2){ctx2.indicatorState.transition=true},setIndicatorRect(ctx2,evt){const value=evt.id??ctx2.value;if(!ctx2.indicatorState.rendered||!value)return;const triggerEl=dom.getTriggerEl(ctx2,value);if(!triggerEl)return;ctx2.indicatorState.rect=dom.getRectById(ctx2,value);(0,import_dom_query3.nextTick)(()=>{ctx2.indicatorState.transition=false})},syncIndicatorRect(ctx2){ctx2.indicatorCleanup?.();const value=ctx2.value;if(!ctx2.indicatorState.rendered||!value)return;const triggerEl=dom.getSelectedTriggerEl(ctx2);if(!triggerEl)return;ctx2.indicatorCleanup=(0,import_element_rect.trackElementRect)(triggerEl,{getRect(el){return dom.getOffsetRect(el)},onChange(rect){ctx2.indicatorState.rect=dom.resolveRect(rect);(0,import_dom_query3.nextTick)(()=>{ctx2.indicatorState.transition=false})}})},clickIfLink(ctx2){(0,import_dom_event2.clickIfLink)(dom.getSelectedTriggerEl(ctx2))}}})}var invoke={change:ctx=>{if(ctx.value==null)return;ctx.onValueChange?.({value:ctx.value})},focusChange:ctx=>{if(ctx.focusedValue==null)return;ctx.onFocusChange?.({focusedValue:ctx.focusedValue})}};var set={value:(ctx,value)=>{if((0,import_utils2.isEqual)(value,ctx.value))return;ctx.value=value;invoke.change(ctx)},focusedValue:(ctx,value)=>{if((0,import_utils2.isEqual)(value,ctx.focusedValue))return;ctx.focusedValue=value;invoke.focusChange(ctx)}};var import_types=require("@zag-js/types");var import_utils3=require("@zag-js/utils");var props=(0,import_types.createProps)()(["activationMode","composite","dir","getRootNode","id","ids","loopFocus","onFocusChange","onValueChange","orientation","translations","value"]);var splitProps=(0,import_utils3.createSplitProps)(props);var triggerProps=(0,import_types.createProps)()(["disabled","value"]);var splitTriggerProps=(0,import_utils3.createSplitProps)(triggerProps);var contentProps=(0,import_types.createProps)()(["value"]);var splitContentProps=(0,import_utils3.createSplitProps)(contentProps);0&&(module.exports={anatomy,connect,contentProps,machine,props,splitContentProps,splitProps,splitTriggerProps,triggerProps});
+"use strict";var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:true})};var __copyProps=(to,from,except,desc)=>{if(from&&typeof from==="object"||typeof from==="function"){for(let key of __getOwnPropNames(from))if(!__hasOwnProp.call(to,key)&&key!==except)__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable})}return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:true}),mod);var src_exports={};__export(src_exports,{anatomy:()=>anatomy,connect:()=>connect,contentProps:()=>contentProps,machine:()=>machine,props:()=>props,splitContentProps:()=>splitContentProps,splitProps:()=>splitProps,splitTriggerProps:()=>splitTriggerProps,triggerProps:()=>triggerProps});module.exports=__toCommonJS(src_exports);var import_anatomy=require("@zag-js/anatomy");var anatomy=(0,import_anatomy.createAnatomy)("tabs").parts("root","list","trigger","content","indicator");var parts=anatomy.build();var import_dom_event=require("@zag-js/dom-event");var import_dom_query2=require("@zag-js/dom-query");var import_dom_query=require("@zag-js/dom-query");var import_utils=require("@zag-js/utils");var dom=(0,import_dom_query.createScope)({getRootId:ctx=>ctx.ids?.root??`tabs:${ctx.id}`,getListId:ctx=>ctx.ids?.list??`tabs:${ctx.id}:list`,getContentId:(ctx,id)=>ctx.ids?.content??`tabs:${ctx.id}:content-${id}`,getTriggerId:(ctx,id)=>ctx.ids?.trigger??`tabs:${ctx.id}:trigger-${id}`,getIndicatorId:ctx=>ctx.ids?.indicator??`tabs:${ctx.id}:indicator`,getListEl:ctx=>dom.getById(ctx,dom.getListId(ctx)),getContentEl:(ctx,id)=>dom.getById(ctx,dom.getContentId(ctx,id)),getTriggerEl:(ctx,id)=>dom.getById(ctx,dom.getTriggerId(ctx,id)),getIndicatorEl:ctx=>dom.getById(ctx,dom.getIndicatorId(ctx)),getElements:ctx=>{const ownerId=CSS.escape(dom.getListId(ctx));const selector=`[role=tab][data-ownedby='${ownerId}']:not([disabled])`;return(0,import_dom_query.queryAll)(dom.getListEl(ctx),selector)},getFirstTriggerEl:ctx=>(0,import_utils.first)(dom.getElements(ctx)),getLastTriggerEl:ctx=>(0,import_utils.last)(dom.getElements(ctx)),getNextTriggerEl:(ctx,id)=>(0,import_dom_query.nextById)(dom.getElements(ctx),dom.getTriggerId(ctx,id),ctx.loopFocus),getPrevTriggerEl:(ctx,id)=>(0,import_dom_query.prevById)(dom.getElements(ctx),dom.getTriggerId(ctx,id),ctx.loopFocus),getSelectedContentEl:ctx=>{if(!ctx.value)return;return dom.getContentEl(ctx,ctx.value)},getSelectedTriggerEl:ctx=>{if(!ctx.value)return;return dom.getTriggerEl(ctx,ctx.value)},getOffsetRect:el=>{return{left:el?.offsetLeft??0,top:el?.offsetTop??0,width:el?.offsetWidth??0,height:el?.offsetHeight??0}},getRectById:(ctx,id)=>{const tab=(0,import_dom_query.itemById)(dom.getElements(ctx),dom.getTriggerId(ctx,id));return dom.resolveRect(dom.getOffsetRect(tab))},resolveRect:rect=>({width:`${rect.width}px`,height:`${rect.height}px`,left:`${rect.left}px`,top:`${rect.top}px`})});function connect(state,send,normalize){const translations=state.context.translations;const focused=state.matches("focused");const isVertical=state.context.orientation==="vertical";const isHorizontal=state.context.orientation==="horizontal";const composite=state.context.composite;const indicator=state.context.indicatorState;function getTriggerState(props2){return{selected:state.context.value===props2.value,focused:state.context.focusedValue===props2.value,disabled:!!props2.disabled}}return{value:state.context.value,focusedValue:state.context.focusedValue,setValue(value){send({type:"SET_VALUE",value})},clearValue(){send({type:"CLEAR_VALUE"})},setIndicatorRect(value){const id=dom.getTriggerId(state.context,value);send({type:"SET_INDICATOR_RECT",id})},syncTabIndex(){send("SYNC_TAB_INDEX")},selectNext(fromValue){send({type:"TAB_FOCUS",value:fromValue,src:"selectNext"});send({type:"ARROW_NEXT",src:"selectNext"})},selectPrev(fromValue){send({type:"TAB_FOCUS",value:fromValue,src:"selectPrev"});send({type:"ARROW_PREV",src:"selectPrev"})},focus(){dom.getSelectedTriggerEl(state.context)?.focus()},getTriggerState,rootProps:normalize.element({...parts.root.attrs,id:dom.getRootId(state.context),"data-orientation":state.context.orientation,"data-focus":(0,import_dom_query2.dataAttr)(focused),dir:state.context.dir}),listProps:normalize.element({...parts.list.attrs,id:dom.getListId(state.context),role:"tablist",dir:state.context.dir,"data-focus":(0,import_dom_query2.dataAttr)(focused),"aria-orientation":state.context.orientation,"data-orientation":state.context.orientation,"aria-label":translations?.listLabel,onKeyDown(event){if(event.defaultPrevented)return;if(!(0,import_dom_query2.isSelfTarget)(event))return;if((0,import_dom_query2.isComposingEvent)(event))return;const keyMap={ArrowDown(){if(isHorizontal)return;send({type:"ARROW_NEXT",key:"ArrowDown"})},ArrowUp(){if(isHorizontal)return;send({type:"ARROW_PREV",key:"ArrowUp"})},ArrowLeft(){if(isVertical)return;send({type:"ARROW_PREV",key:"ArrowLeft"})},ArrowRight(){if(isVertical)return;send({type:"ARROW_NEXT",key:"ArrowRight"})},Home(){send("HOME")},End(){send("END")},Enter(){send({type:"ENTER"})}};let key=(0,import_dom_event.getEventKey)(event,state.context);const exec=keyMap[key];if(exec){event.preventDefault();exec(event)}}}),getTriggerProps(props2){const{value,disabled}=props2;const triggerState=getTriggerState(props2);return normalize.button({...parts.trigger.attrs,role:"tab",type:"button",disabled,dir:state.context.dir,"data-orientation":state.context.orientation,"data-disabled":(0,import_dom_query2.dataAttr)(disabled),"aria-disabled":disabled,"data-value":value,"aria-selected":triggerState.selected,"data-selected":(0,import_dom_query2.dataAttr)(triggerState.selected),"data-focus":(0,import_dom_query2.dataAttr)(triggerState.focused),"aria-controls":triggerState.selected?dom.getContentId(state.context,value):void 0,"data-ownedby":dom.getListId(state.context),id:dom.getTriggerId(state.context,value),tabIndex:triggerState.selected&&composite?0:-1,onFocus(){send({type:"TAB_FOCUS",value})},onBlur(event){const target=event.relatedTarget;if(target?.getAttribute("role")!=="tab"){send({type:"TAB_BLUR"})}},onClick(event){if(event.defaultPrevented)return;if(disabled)return;if((0,import_dom_query2.isSafari)()){event.currentTarget.focus()}send({type:"TAB_CLICK",value})}})},getContentProps(props2){const{value}=props2;const selected=state.context.value===value;return normalize.element({...parts.content.attrs,dir:state.context.dir,id:dom.getContentId(state.context,value),tabIndex:composite?0:-1,"aria-labelledby":dom.getTriggerId(state.context,value),role:"tabpanel","data-ownedby":dom.getListId(state.context),"data-selected":(0,import_dom_query2.dataAttr)(selected),"data-orientation":state.context.orientation,hidden:!selected})},indicatorProps:normalize.element({id:dom.getIndicatorId(state.context),...parts.indicator.attrs,dir:state.context.dir,"data-orientation":state.context.orientation,style:{"--transition-property":"left, right, top, bottom, width, height","--left":indicator.rect?.left,"--top":indicator.rect?.top,"--width":indicator.rect?.width,"--height":indicator.rect?.height,position:"absolute",willChange:"var(--transition-property)",transitionProperty:"var(--transition-property)",transitionDuration:indicator.transition?"var(--transition-duration, 150ms)":"0ms",transitionTimingFunction:"var(--transition-timing-function)",[isHorizontal?"left":"top"]:isHorizontal?"var(--left)":"var(--top)"}})}}var import_core=require("@zag-js/core");var import_dom_event2=require("@zag-js/dom-event");var import_dom_query3=require("@zag-js/dom-query");var import_element_rect=require("@zag-js/element-rect");var import_utils2=require("@zag-js/utils");var{not}=import_core.guards;function machine(userContext){const ctx=(0,import_utils2.compact)(userContext);return(0,import_core.createMachine)({initial:"idle",context:{dir:"ltr",orientation:"horizontal",activationMode:"automatic",value:null,loopFocus:true,composite:true,...ctx,focusedValue:ctx.value??null,indicatorState:{rendered:false,transition:false,rect:{left:"0px",top:"0px",width:"0px",height:"0px"}}},watch:{value:["allowIndicatorTransition","syncIndicatorRect","syncTabIndex","clickIfLink"],dir:["syncIndicatorRect"],orientation:["syncIndicatorRect"]},on:{SET_VALUE:{actions:"setValue"},CLEAR_VALUE:{actions:"clearValue"},SET_INDICATOR_RECT:{actions:"setIndicatorRect"},SYNC_TAB_INDEX:{actions:"syncTabIndex"}},created:["syncFocusedValue"],entry:["checkRenderedElements","syncIndicatorRect","syncTabIndex"],exit:["cleanupObserver"],states:{idle:{on:{TAB_FOCUS:{target:"focused",actions:"setFocusedValue"},TAB_CLICK:{target:"focused",actions:["setFocusedValue","setValue"]}}},focused:{on:{TAB_CLICK:{target:"focused",actions:["setFocusedValue","setValue"]},ARROW_PREV:[{guard:"selectOnFocus",actions:["focusPrevTab","selectFocusedTab"]},{actions:"focusPrevTab"}],ARROW_NEXT:[{guard:"selectOnFocus",actions:["focusNextTab","selectFocusedTab"]},{actions:"focusNextTab"}],HOME:[{guard:"selectOnFocus",actions:["focusFirstTab","selectFocusedTab"]},{actions:"focusFirstTab"}],END:[{guard:"selectOnFocus",actions:["focusLastTab","selectFocusedTab"]},{actions:"focusLastTab"}],ENTER:{guard:not("selectOnFocus"),actions:"selectFocusedTab"},TAB_FOCUS:{actions:["setFocusedValue"]},TAB_BLUR:{target:"idle",actions:"clearFocusedValue"}}}}},{guards:{selectOnFocus:ctx2=>ctx2.activationMode==="automatic"},actions:{syncFocusedValue(ctx2){if(ctx2.value!=null&&ctx2.focusedValue==null){ctx2.focusedValue=ctx2.value}},selectFocusedTab(ctx2){(0,import_dom_query3.raf)(()=>{set.value(ctx2,ctx2.focusedValue)})},setFocusedValue(ctx2,evt){if(evt.value==null)return;set.focusedValue(ctx2,evt.value)},clearFocusedValue(ctx2){set.focusedValue(ctx2,null)},setValue(ctx2,evt){set.value(ctx2,evt.value)},clearValue(ctx2){set.value(ctx2,null)},focusFirstTab(ctx2){(0,import_dom_query3.raf)(()=>{dom.getFirstTriggerEl(ctx2)?.focus()})},focusLastTab(ctx2){(0,import_dom_query3.raf)(()=>{dom.getLastTriggerEl(ctx2)?.focus()})},focusNextTab(ctx2){if(!ctx2.focusedValue)return;const triggerEl=dom.getNextTriggerEl(ctx2,ctx2.focusedValue);(0,import_dom_query3.raf)(()=>{if(ctx2.composite){triggerEl?.focus()}else if(triggerEl?.dataset.value!=null){set.focusedValue(ctx2,triggerEl.dataset.value)}})},focusPrevTab(ctx2){if(!ctx2.focusedValue)return;const triggerEl=dom.getPrevTriggerEl(ctx2,ctx2.focusedValue);(0,import_dom_query3.raf)(()=>{if(ctx2.composite){triggerEl?.focus()}else if(triggerEl?.dataset.value!=null){set.focusedValue(ctx2,triggerEl.dataset.value)}})},checkRenderedElements(ctx2){ctx2.indicatorState.rendered=!!dom.getIndicatorEl(ctx2)},syncTabIndex(ctx2){(0,import_dom_query3.raf)(()=>{const contentEl=dom.getSelectedContentEl(ctx2);if(!contentEl)return;const focusables=(0,import_dom_query3.getFocusables)(contentEl);if(focusables.length>0){contentEl.removeAttribute("tabindex")}else{contentEl.setAttribute("tabindex","0")}})},cleanupObserver(ctx2){ctx2.indicatorCleanup?.()},allowIndicatorTransition(ctx2){ctx2.indicatorState.transition=true},setIndicatorRect(ctx2,evt){const value=evt.id??ctx2.value;if(!ctx2.indicatorState.rendered||!value)return;const triggerEl=dom.getTriggerEl(ctx2,value);if(!triggerEl)return;ctx2.indicatorState.rect=dom.getRectById(ctx2,value);(0,import_dom_query3.nextTick)(()=>{ctx2.indicatorState.transition=false})},syncIndicatorRect(ctx2){ctx2.indicatorCleanup?.();const value=ctx2.value;if(!ctx2.indicatorState.rendered||!value)return;const triggerEl=dom.getSelectedTriggerEl(ctx2);if(!triggerEl)return;ctx2.indicatorCleanup=(0,import_element_rect.trackElementRect)(triggerEl,{getRect(el){return dom.getOffsetRect(el)},onChange(rect){ctx2.indicatorState.rect=dom.resolveRect(rect);(0,import_dom_query3.nextTick)(()=>{ctx2.indicatorState.transition=false})}})},clickIfLink(ctx2){(0,import_dom_event2.clickIfLink)(dom.getSelectedTriggerEl(ctx2))}}})}var invoke={change:ctx=>{if(ctx.value==null)return;ctx.onValueChange?.({value:ctx.value})},focusChange:ctx=>{if(ctx.focusedValue==null)return;ctx.onFocusChange?.({focusedValue:ctx.focusedValue})}};var set={value:(ctx,value)=>{if((0,import_utils2.isEqual)(value,ctx.value))return;ctx.value=value;invoke.change(ctx)},focusedValue:(ctx,value)=>{if((0,import_utils2.isEqual)(value,ctx.focusedValue))return;ctx.focusedValue=value;invoke.focusChange(ctx)}};var import_types=require("@zag-js/types");var import_utils3=require("@zag-js/utils");var props=(0,import_types.createProps)()(["activationMode","composite","dir","getRootNode","id","ids","loopFocus","onFocusChange","onValueChange","orientation","translations","value"]);var splitProps=(0,import_utils3.createSplitProps)(props);var triggerProps=(0,import_types.createProps)()(["disabled","value"]);var splitTriggerProps=(0,import_utils3.createSplitProps)(triggerProps);var contentProps=(0,import_types.createProps)()(["value"]);var splitContentProps=(0,import_utils3.createSplitProps)(contentProps);0&&(module.exports={anatomy,connect,contentProps,machine,props,splitContentProps,splitProps,splitTriggerProps,triggerProps});
 //# sourceMappingURL=index.js.map

package/dist/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/index.ts","../src/tabs.anatomy.ts","../src/tabs.connect.ts","../src/tabs.dom.ts","../src/tabs.machine.ts","../src/tabs.props.ts"],"sourcesContent":["export { anatomy } from \"./tabs.anatomy\"\nexport { connect } from \"./tabs.connect\"\nexport { machine } from \"./tabs.machine\"\nexport * from \"./tabs.props\"\nexport type {\n MachineApi as Api,\n ContentProps,\n UserDefinedContext as Context,\n ElementIds,\n FocusChangeDetails,\n IntlTranslations,\n TriggerProps,\n ValueChangeDetails,\n} from \"./tabs.types\"\n","import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"tabs\").parts(\"root\", \"list\", \"trigger\", \"content\", \"indicator\")\nexport const parts = anatomy.build()\n","import { getEventKey, getNativeEvent, type EventKeyMap } from \"@zag-js/dom-event\"\nimport { dataAttr, isSafari, isSelfTarget } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { parts } from \"./tabs.anatomy\"\nimport { dom } from \"./tabs.dom\"\nimport type { MachineApi, Send, State, TriggerProps, TriggerState } from \"./tabs.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const translations = state.context.translations\n const focused = state.matches(\"focused\")\n\n const isVertical = state.context.orientation === \"vertical\"\n const isHorizontal = state.context.orientation === \"horizontal\"\n const composite = state.context.composite\n const indicator = state.context.indicatorState\n\n function getTriggerState(props: TriggerProps): TriggerState {\n return {\n selected: state.context.value === props.value,\n focused: state.context.focusedValue === props.value,\n disabled: !!props.disabled,\n }\n }\n\n return {\n value: state.context.value,\n focusedValue: state.context.focusedValue,\n setValue(value) {\n send({ type: \"SET_VALUE\", value })\n },\n clearValue() {\n send({ type: \"CLEAR_VALUE\" })\n },\n setIndicatorRect(value) {\n const id = dom.getTriggerId(state.context, value)\n send({ type: \"SET_INDICATOR_RECT\", id })\n },\n syncTabIndex() {\n send(\"SYNC_TAB_INDEX\")\n },\n selectNext(fromValue) {\n send({ type: \"TAB_FOCUS\", value: fromValue, src: \"selectNext\" })\n send({ type: \"ARROW_NEXT\", src: \"selectNext\" })\n },\n selectPrev(fromValue) {\n send({ type: \"TAB_FOCUS\", value: fromValue, src: \"selectPrev\" })\n send({ type: \"ARROW_PREV\", src: \"selectPrev\" })\n },\n focus() {\n dom.getSelectedTriggerEl(state.context)?.focus()\n },\n getTriggerState,\n\n rootProps: normalize.element({\n ...parts.root.attrs,\n id: dom.getRootId(state.context),\n \"data-orientation\": state.context.orientation,\n \"data-focus\": dataAttr(focused),\n dir: state.context.dir,\n }),\n\n listProps: normalize.element({\n ...parts.list.attrs,\n id: dom.getListId(state.context),\n role: \"tablist\",\n dir: state.context.dir,\n \"data-focus\": dataAttr(focused),\n \"aria-orientation\": state.context.orientation,\n \"data-orientation\": state.context.orientation,\n \"aria-label\": translations?.listLabel,\n onKeyDown(event) {\n if (event.defaultPrevented) return\n const evt = getNativeEvent(event)\n\n if (!isSelfTarget(evt)) return\n if (evt.isComposing) return\n\n const keyMap: EventKeyMap = {\n ArrowDown() {\n if (isHorizontal) return\n send({ type: \"ARROW_NEXT\", key: \"ArrowDown\" })\n },\n ArrowUp() {\n if (isHorizontal) return\n send({ type: \"ARROW_PREV\", key: \"ArrowUp\" })\n },\n ArrowLeft() {\n if (isVertical) return\n send({ type: \"ARROW_PREV\", key: \"ArrowLeft\" })\n },\n ArrowRight() {\n if (isVertical) return\n send({ type: \"ARROW_NEXT\", key: \"ArrowRight\" })\n },\n Home() {\n send(\"HOME\")\n },\n End() {\n send(\"END\")\n },\n Enter() {\n send({ type: \"ENTER\" })\n },\n }\n\n let key = getEventKey(event, state.context)\n const exec = keyMap[key]\n\n if (exec) {\n event.preventDefault()\n exec(event)\n }\n },\n }),\n\n getTriggerProps(props) {\n const { value, disabled } = props\n const triggerState = getTriggerState(props)\n\n return normalize.button({\n ...parts.trigger.attrs,\n role: \"tab\",\n type: \"button\",\n disabled,\n dir: state.context.dir,\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(disabled),\n \"aria-disabled\": disabled,\n \"data-value\": value,\n \"aria-selected\": triggerState.selected,\n \"data-selected\": dataAttr(triggerState.selected),\n \"data-focus\": dataAttr(triggerState.focused),\n \"aria-controls\": triggerState.selected ? dom.getContentId(state.context, value) : undefined,\n \"data-ownedby\": dom.getListId(state.context),\n id: dom.getTriggerId(state.context, value),\n tabIndex: triggerState.selected && composite ? 0 : -1,\n onFocus() {\n send({ type: \"TAB_FOCUS\", value })\n },\n onBlur(event) {\n const target = event.relatedTarget as HTMLElement \| null\n if (target?.getAttribute(\"role\") !== \"tab\") {\n send({ type: \"TAB_BLUR\" })\n }\n },\n onClick(event) {\n if (event.defaultPrevented) return\n if (disabled) return\n if (isSafari()) {\n event.currentTarget.focus()\n }\n send({ type: \"TAB_CLICK\", value })\n },\n })\n },\n\n getContentProps(props) {\n const { value } = props\n const selected = state.context.value === value\n return normalize.element({\n ...parts.content.attrs,\n dir: state.context.dir,\n id: dom.getContentId(state.context, value),\n tabIndex: composite ? 0 : -1,\n \"aria-labelledby\": dom.getTriggerId(state.context, value),\n role: \"tabpanel\",\n \"data-ownedby\": dom.getListId(state.context),\n \"data-selected\": dataAttr(selected),\n \"data-orientation\": state.context.orientation,\n hidden: !selected,\n })\n },\n\n indicatorProps: normalize.element({\n id: dom.getIndicatorId(state.context),\n ...parts.indicator.attrs,\n dir: state.context.dir,\n \"data-orientation\": state.context.orientation,\n style: {\n \"--transition-property\": \"left, right, top, bottom, width, height\",\n \"--left\": indicator.rect?.left,\n \"--top\": indicator.rect?.top,\n \"--width\": indicator.rect?.width,\n \"--height\": indicator.rect?.height,\n position: \"absolute\",\n willChange: \"var(--transition-property)\",\n transitionProperty: \"var(--transition-property)\",\n transitionDuration: indicator.transition ? \"var(--transition-duration, 150ms)\" : \"0ms\",\n transitionTimingFunction: \"var(--transition-timing-function)\",\n [isHorizontal ? \"left\" : \"top\"]: isHorizontal ? \"var(--left)\" : \"var(--top)\",\n },\n }),\n }\n}\n","import { createScope, itemById, nextById, prevById, queryAll } from \"@zag-js/dom-query\"\nimport { first, last } from \"@zag-js/utils\"\nimport type { MachineContext as Ctx } from \"./tabs.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `tabs:${ctx.id}`,\n getListId: (ctx: Ctx) => ctx.ids?.list ?? `tabs:${ctx.id}:list`,\n getContentId: (ctx: Ctx, id: string) => ctx.ids?.content ?? `tabs:${ctx.id}:content-${id}`,\n getTriggerId: (ctx: Ctx, id: string) => ctx.ids?.trigger ?? `tabs:${ctx.id}:trigger-${id}`,\n getIndicatorId: (ctx: Ctx) => ctx.ids?.indicator ?? `tabs:${ctx.id}:indicator`,\n\n getListEl: (ctx: Ctx) => dom.getById(ctx, dom.getListId(ctx)),\n getContentEl: (ctx: Ctx, id: string) => dom.getById(ctx, dom.getContentId(ctx, id)),\n getTriggerEl: (ctx: Ctx, id: string) => dom.getById(ctx, dom.getTriggerId(ctx, id)),\n getIndicatorEl: (ctx: Ctx) => dom.getById(ctx, dom.getIndicatorId(ctx)),\n\n getElements: (ctx: Ctx) => {\n const ownerId = CSS.escape(dom.getListId(ctx))\n const selector = `[role=tab][data-ownedby='${ownerId}']:not([disabled])`\n return queryAll(dom.getListEl(ctx), selector)\n },\n\n getFirstTriggerEl: (ctx: Ctx) => first(dom.getElements(ctx)),\n getLastTriggerEl: (ctx: Ctx) => last(dom.getElements(ctx)),\n getNextTriggerEl: (ctx: Ctx, id: string) => nextById(dom.getElements(ctx), dom.getTriggerId(ctx, id), ctx.loopFocus),\n getPrevTriggerEl: (ctx: Ctx, id: string) => prevById(dom.getElements(ctx), dom.getTriggerId(ctx, id), ctx.loopFocus),\n getSelectedContentEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getContentEl(ctx, ctx.value)\n },\n getSelectedTriggerEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getTriggerEl(ctx, ctx.value)\n },\n\n getOffsetRect: (el: HTMLElement \| undefined) => {\n return {\n left: el?.offsetLeft ?? 0,\n top: el?.offsetTop ?? 0,\n width: el?.offsetWidth ?? 0,\n height: el?.offsetHeight ?? 0,\n }\n },\n\n getRectById: (ctx: Ctx, id: string) => {\n const tab = itemById(dom.getElements(ctx), dom.getTriggerId(ctx, id))\n return dom.resolveRect(dom.getOffsetRect(tab))\n },\n\n resolveRect: (rect: Record<\"width\" \| \"height\" \| \"left\" \| \"top\", number>) => ({\n width: `${rect.width}px`,\n height: `${rect.height}px`,\n left: `${rect.left}px`,\n top: `${rect.top}px`,\n }),\n})\n","import { createMachine, guards } from \"@zag-js/core\"\nimport { clickIfLink } from \"@zag-js/dom-event\"\nimport { nextTick, raf, getFocusables } from \"@zag-js/dom-query\"\nimport { trackElementRect } from \"@zag-js/element-rect\"\nimport { compact, isEqual } from \"@zag-js/utils\"\nimport { dom } from \"./tabs.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./tabs.types\"\n\nconst { not } = guards\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n initial: \"idle\",\n\n context: {\n dir: \"ltr\",\n orientation: \"horizontal\",\n activationMode: \"automatic\",\n value: null,\n loopFocus: true,\n composite: true,\n ...ctx,\n focusedValue: ctx.value ?? null,\n indicatorState: {\n rendered: false,\n transition: false,\n rect: { left: \"0px\", top: \"0px\", width: \"0px\", height: \"0px\" },\n },\n },\n\n watch: {\n value: [\"allowIndicatorTransition\", \"syncIndicatorRect\", \"syncTabIndex\", \"clickIfLink\"],\n dir: [\"syncIndicatorRect\"],\n orientation: [\"syncIndicatorRect\"],\n },\n\n on: {\n SET_VALUE: {\n actions: \"setValue\",\n },\n CLEAR_VALUE: {\n actions: \"clearValue\",\n },\n SET_INDICATOR_RECT: {\n actions: \"setIndicatorRect\",\n },\n SYNC_TAB_INDEX: {\n actions: \"syncTabIndex\",\n },\n },\n\n created: [\"syncFocusedValue\"],\n entry: [\"checkRenderedElements\", \"syncIndicatorRect\", \"syncTabIndex\"],\n exit: [\"cleanupObserver\"],\n\n states: {\n idle: {\n on: {\n TAB_FOCUS: {\n target: \"focused\",\n actions: \"setFocusedValue\",\n },\n TAB_CLICK: {\n target: \"focused\",\n actions: [\"setFocusedValue\", \"setValue\"],\n },\n },\n },\n focused: {\n on: {\n TAB_CLICK: {\n target: \"focused\",\n actions: [\"setFocusedValue\", \"setValue\"],\n },\n ARROW_PREV: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusPrevTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusPrevTab\",\n },\n ],\n ARROW_NEXT: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusNextTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusNextTab\",\n },\n ],\n HOME: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusFirstTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusFirstTab\",\n },\n ],\n END: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusLastTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusLastTab\",\n },\n ],\n ENTER: {\n guard: not(\"selectOnFocus\"),\n actions: \"selectFocusedTab\",\n },\n TAB_FOCUS: {\n actions: [\"setFocusedValue\"],\n },\n TAB_BLUR: {\n target: \"idle\",\n actions: \"clearFocusedValue\",\n },\n },\n },\n },\n },\n {\n guards: {\n selectOnFocus: (ctx) => ctx.activationMode === \"automatic\",\n },\n\n actions: {\n syncFocusedValue(ctx) {\n if (ctx.value != null && ctx.focusedValue == null) {\n ctx.focusedValue = ctx.value\n }\n },\n selectFocusedTab(ctx) {\n raf(() => {\n set.value(ctx, ctx.focusedValue)\n })\n },\n setFocusedValue(ctx, evt) {\n if (evt.value == null) return\n set.focusedValue(ctx, evt.value)\n },\n clearFocusedValue(ctx) {\n set.focusedValue(ctx, null)\n },\n setValue(ctx, evt) {\n set.value(ctx, evt.value)\n },\n clearValue(ctx) {\n set.value(ctx, null)\n },\n focusFirstTab(ctx) {\n raf(() => {\n dom.getFirstTriggerEl(ctx)?.focus()\n })\n },\n focusLastTab(ctx) {\n raf(() => {\n dom.getLastTriggerEl(ctx)?.focus()\n })\n },\n focusNextTab(ctx) {\n if (!ctx.focusedValue) return\n const triggerEl = dom.getNextTriggerEl(ctx, ctx.focusedValue)\n raf(() => {\n if (ctx.composite) {\n triggerEl?.focus()\n } else if (triggerEl?.dataset.value != null) {\n set.focusedValue(ctx, triggerEl.dataset.value)\n }\n })\n },\n focusPrevTab(ctx) {\n if (!ctx.focusedValue) return\n const triggerEl = dom.getPrevTriggerEl(ctx, ctx.focusedValue)\n raf(() => {\n if (ctx.composite) {\n triggerEl?.focus()\n } else if (triggerEl?.dataset.value != null) {\n set.focusedValue(ctx, triggerEl.dataset.value)\n }\n })\n },\n checkRenderedElements(ctx) {\n ctx.indicatorState.rendered = !!dom.getIndicatorEl(ctx)\n },\n syncTabIndex(ctx) {\n raf(() => {\n const contentEl = dom.getSelectedContentEl(ctx)\n if (!contentEl) return\n const focusables = getFocusables(contentEl)\n if (focusables.length > 0) {\n contentEl.removeAttribute(\"tabindex\")\n } else {\n contentEl.setAttribute(\"tabindex\", \"0\")\n }\n })\n },\n cleanupObserver(ctx) {\n ctx.indicatorCleanup?.()\n },\n allowIndicatorTransition(ctx) {\n ctx.indicatorState.transition = true\n },\n setIndicatorRect(ctx, evt) {\n const value = evt.id ?? ctx.value\n if (!ctx.indicatorState.rendered \|\| !value) return\n\n const triggerEl = dom.getTriggerEl(ctx, value)\n if (!triggerEl) return\n\n ctx.indicatorState.rect = dom.getRectById(ctx, value)\n nextTick(() => {\n ctx.indicatorState.transition = false\n })\n },\n syncIndicatorRect(ctx) {\n ctx.indicatorCleanup?.()\n\n const value = ctx.value\n if (!ctx.indicatorState.rendered \|\| !value) return\n\n const triggerEl = dom.getSelectedTriggerEl(ctx)\n if (!triggerEl) return\n\n ctx.indicatorCleanup = trackElementRect(triggerEl, {\n getRect(el) {\n return dom.getOffsetRect(el)\n },\n onChange(rect) {\n ctx.indicatorState.rect = dom.resolveRect(rect)\n nextTick(() => {\n ctx.indicatorState.transition = false\n })\n },\n })\n },\n clickIfLink(ctx) {\n clickIfLink(dom.getSelectedTriggerEl(ctx))\n },\n },\n },\n )\n}\n\nconst invoke = {\n change: (ctx: MachineContext) => {\n if (ctx.value == null) return\n ctx.onValueChange?.({ value: ctx.value })\n },\n focusChange: (ctx: MachineContext) => {\n if (ctx.focusedValue == null) return\n ctx.onFocusChange?.({ focusedValue: ctx.focusedValue })\n },\n}\n\nconst set = {\n value: (ctx: MachineContext, value: string \| null) => {\n if (isEqual(value, ctx.value)) return\n ctx.value = value\n invoke.change(ctx)\n },\n focusedValue: (ctx: MachineContext, value: string \| null) => {\n if (isEqual(value, ctx.focusedValue)) return\n ctx.focusedValue = value\n invoke.focusChange(ctx)\n },\n}\n","import { createProps } from \"@zag-js/types\"\nimport { createSplitProps } from \"@zag-js/utils\"\nimport type { ContentProps, TriggerProps, UserDefinedContext } from \"./tabs.types\"\n\nexport const props = createProps<UserDefinedContext>()([\n \"activationMode\",\n \"composite\",\n \"dir\",\n \"getRootNode\",\n \"id\",\n \"ids\",\n \"loopFocus\",\n \"onFocusChange\",\n \"onValueChange\",\n \"orientation\",\n \"translations\",\n \"value\",\n])\n\nexport const splitProps = createSplitProps<Partial<UserDefinedContext>>(props)\n\nexport const triggerProps = createProps<TriggerProps>()([\"disabled\", \"value\"])\nexport const splitTriggerProps = createSplitProps<TriggerProps>(triggerProps)\n\nexport const contentProps = createProps<ContentProps>()([\"value\"])\nexport const splitContentProps = createSplitProps<ContentProps>(contentProps)\n"],"mappings":"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","names":["import_dom_query","props","import_dom_event","import_dom_query","import_utils","ctx","import_utils"]}
1	+ {"version":3,"sources":["../src/index.ts","../src/tabs.anatomy.ts","../src/tabs.connect.ts","../src/tabs.dom.ts","../src/tabs.machine.ts","../src/tabs.props.ts"],"sourcesContent":["export { anatomy } from \"./tabs.anatomy\"\nexport { connect } from \"./tabs.connect\"\nexport { machine } from \"./tabs.machine\"\nexport * from \"./tabs.props\"\nexport type {\n MachineApi as Api,\n ContentProps,\n UserDefinedContext as Context,\n ElementIds,\n FocusChangeDetails,\n IntlTranslations,\n TriggerProps,\n ValueChangeDetails,\n} from \"./tabs.types\"\n","import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"tabs\").parts(\"root\", \"list\", \"trigger\", \"content\", \"indicator\")\nexport const parts = anatomy.build()\n","import { getEventKey, type EventKeyMap } from \"@zag-js/dom-event\"\nimport { dataAttr, isComposingEvent, isSafari, isSelfTarget } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { parts } from \"./tabs.anatomy\"\nimport { dom } from \"./tabs.dom\"\nimport type { MachineApi, Send, State, TriggerProps, TriggerState } from \"./tabs.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const translations = state.context.translations\n const focused = state.matches(\"focused\")\n\n const isVertical = state.context.orientation === \"vertical\"\n const isHorizontal = state.context.orientation === \"horizontal\"\n const composite = state.context.composite\n const indicator = state.context.indicatorState\n\n function getTriggerState(props: TriggerProps): TriggerState {\n return {\n selected: state.context.value === props.value,\n focused: state.context.focusedValue === props.value,\n disabled: !!props.disabled,\n }\n }\n\n return {\n value: state.context.value,\n focusedValue: state.context.focusedValue,\n setValue(value) {\n send({ type: \"SET_VALUE\", value })\n },\n clearValue() {\n send({ type: \"CLEAR_VALUE\" })\n },\n setIndicatorRect(value) {\n const id = dom.getTriggerId(state.context, value)\n send({ type: \"SET_INDICATOR_RECT\", id })\n },\n syncTabIndex() {\n send(\"SYNC_TAB_INDEX\")\n },\n selectNext(fromValue) {\n send({ type: \"TAB_FOCUS\", value: fromValue, src: \"selectNext\" })\n send({ type: \"ARROW_NEXT\", src: \"selectNext\" })\n },\n selectPrev(fromValue) {\n send({ type: \"TAB_FOCUS\", value: fromValue, src: \"selectPrev\" })\n send({ type: \"ARROW_PREV\", src: \"selectPrev\" })\n },\n focus() {\n dom.getSelectedTriggerEl(state.context)?.focus()\n },\n getTriggerState,\n\n rootProps: normalize.element({\n ...parts.root.attrs,\n id: dom.getRootId(state.context),\n \"data-orientation\": state.context.orientation,\n \"data-focus\": dataAttr(focused),\n dir: state.context.dir,\n }),\n\n listProps: normalize.element({\n ...parts.list.attrs,\n id: dom.getListId(state.context),\n role: \"tablist\",\n dir: state.context.dir,\n \"data-focus\": dataAttr(focused),\n \"aria-orientation\": state.context.orientation,\n \"data-orientation\": state.context.orientation,\n \"aria-label\": translations?.listLabel,\n onKeyDown(event) {\n if (event.defaultPrevented) return\n\n if (!isSelfTarget(event)) return\n if (isComposingEvent(event)) return\n\n const keyMap: EventKeyMap = {\n ArrowDown() {\n if (isHorizontal) return\n send({ type: \"ARROW_NEXT\", key: \"ArrowDown\" })\n },\n ArrowUp() {\n if (isHorizontal) return\n send({ type: \"ARROW_PREV\", key: \"ArrowUp\" })\n },\n ArrowLeft() {\n if (isVertical) return\n send({ type: \"ARROW_PREV\", key: \"ArrowLeft\" })\n },\n ArrowRight() {\n if (isVertical) return\n send({ type: \"ARROW_NEXT\", key: \"ArrowRight\" })\n },\n Home() {\n send(\"HOME\")\n },\n End() {\n send(\"END\")\n },\n Enter() {\n send({ type: \"ENTER\" })\n },\n }\n\n let key = getEventKey(event, state.context)\n const exec = keyMap[key]\n\n if (exec) {\n event.preventDefault()\n exec(event)\n }\n },\n }),\n\n getTriggerProps(props) {\n const { value, disabled } = props\n const triggerState = getTriggerState(props)\n\n return normalize.button({\n ...parts.trigger.attrs,\n role: \"tab\",\n type: \"button\",\n disabled,\n dir: state.context.dir,\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(disabled),\n \"aria-disabled\": disabled,\n \"data-value\": value,\n \"aria-selected\": triggerState.selected,\n \"data-selected\": dataAttr(triggerState.selected),\n \"data-focus\": dataAttr(triggerState.focused),\n \"aria-controls\": triggerState.selected ? dom.getContentId(state.context, value) : undefined,\n \"data-ownedby\": dom.getListId(state.context),\n id: dom.getTriggerId(state.context, value),\n tabIndex: triggerState.selected && composite ? 0 : -1,\n onFocus() {\n send({ type: \"TAB_FOCUS\", value })\n },\n onBlur(event) {\n const target = event.relatedTarget as HTMLElement \| null\n if (target?.getAttribute(\"role\") !== \"tab\") {\n send({ type: \"TAB_BLUR\" })\n }\n },\n onClick(event) {\n if (event.defaultPrevented) return\n if (disabled) return\n if (isSafari()) {\n event.currentTarget.focus()\n }\n send({ type: \"TAB_CLICK\", value })\n },\n })\n },\n\n getContentProps(props) {\n const { value } = props\n const selected = state.context.value === value\n return normalize.element({\n ...parts.content.attrs,\n dir: state.context.dir,\n id: dom.getContentId(state.context, value),\n tabIndex: composite ? 0 : -1,\n \"aria-labelledby\": dom.getTriggerId(state.context, value),\n role: \"tabpanel\",\n \"data-ownedby\": dom.getListId(state.context),\n \"data-selected\": dataAttr(selected),\n \"data-orientation\": state.context.orientation,\n hidden: !selected,\n })\n },\n\n indicatorProps: normalize.element({\n id: dom.getIndicatorId(state.context),\n ...parts.indicator.attrs,\n dir: state.context.dir,\n \"data-orientation\": state.context.orientation,\n style: {\n \"--transition-property\": \"left, right, top, bottom, width, height\",\n \"--left\": indicator.rect?.left,\n \"--top\": indicator.rect?.top,\n \"--width\": indicator.rect?.width,\n \"--height\": indicator.rect?.height,\n position: \"absolute\",\n willChange: \"var(--transition-property)\",\n transitionProperty: \"var(--transition-property)\",\n transitionDuration: indicator.transition ? \"var(--transition-duration, 150ms)\" : \"0ms\",\n transitionTimingFunction: \"var(--transition-timing-function)\",\n [isHorizontal ? \"left\" : \"top\"]: isHorizontal ? \"var(--left)\" : \"var(--top)\",\n },\n }),\n }\n}\n","import { createScope, itemById, nextById, prevById, queryAll } from \"@zag-js/dom-query\"\nimport { first, last } from \"@zag-js/utils\"\nimport type { MachineContext as Ctx } from \"./tabs.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `tabs:${ctx.id}`,\n getListId: (ctx: Ctx) => ctx.ids?.list ?? `tabs:${ctx.id}:list`,\n getContentId: (ctx: Ctx, id: string) => ctx.ids?.content ?? `tabs:${ctx.id}:content-${id}`,\n getTriggerId: (ctx: Ctx, id: string) => ctx.ids?.trigger ?? `tabs:${ctx.id}:trigger-${id}`,\n getIndicatorId: (ctx: Ctx) => ctx.ids?.indicator ?? `tabs:${ctx.id}:indicator`,\n\n getListEl: (ctx: Ctx) => dom.getById(ctx, dom.getListId(ctx)),\n getContentEl: (ctx: Ctx, id: string) => dom.getById(ctx, dom.getContentId(ctx, id)),\n getTriggerEl: (ctx: Ctx, id: string) => dom.getById(ctx, dom.getTriggerId(ctx, id)),\n getIndicatorEl: (ctx: Ctx) => dom.getById(ctx, dom.getIndicatorId(ctx)),\n\n getElements: (ctx: Ctx) => {\n const ownerId = CSS.escape(dom.getListId(ctx))\n const selector = `[role=tab][data-ownedby='${ownerId}']:not([disabled])`\n return queryAll(dom.getListEl(ctx), selector)\n },\n\n getFirstTriggerEl: (ctx: Ctx) => first(dom.getElements(ctx)),\n getLastTriggerEl: (ctx: Ctx) => last(dom.getElements(ctx)),\n getNextTriggerEl: (ctx: Ctx, id: string) => nextById(dom.getElements(ctx), dom.getTriggerId(ctx, id), ctx.loopFocus),\n getPrevTriggerEl: (ctx: Ctx, id: string) => prevById(dom.getElements(ctx), dom.getTriggerId(ctx, id), ctx.loopFocus),\n getSelectedContentEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getContentEl(ctx, ctx.value)\n },\n getSelectedTriggerEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getTriggerEl(ctx, ctx.value)\n },\n\n getOffsetRect: (el: HTMLElement \| undefined) => {\n return {\n left: el?.offsetLeft ?? 0,\n top: el?.offsetTop ?? 0,\n width: el?.offsetWidth ?? 0,\n height: el?.offsetHeight ?? 0,\n }\n },\n\n getRectById: (ctx: Ctx, id: string) => {\n const tab = itemById(dom.getElements(ctx), dom.getTriggerId(ctx, id))\n return dom.resolveRect(dom.getOffsetRect(tab))\n },\n\n resolveRect: (rect: Record<\"width\" \| \"height\" \| \"left\" \| \"top\", number>) => ({\n width: `${rect.width}px`,\n height: `${rect.height}px`,\n left: `${rect.left}px`,\n top: `${rect.top}px`,\n }),\n})\n","import { createMachine, guards } from \"@zag-js/core\"\nimport { clickIfLink } from \"@zag-js/dom-event\"\nimport { nextTick, raf, getFocusables } from \"@zag-js/dom-query\"\nimport { trackElementRect } from \"@zag-js/element-rect\"\nimport { compact, isEqual } from \"@zag-js/utils\"\nimport { dom } from \"./tabs.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./tabs.types\"\n\nconst { not } = guards\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n initial: \"idle\",\n\n context: {\n dir: \"ltr\",\n orientation: \"horizontal\",\n activationMode: \"automatic\",\n value: null,\n loopFocus: true,\n composite: true,\n ...ctx,\n focusedValue: ctx.value ?? null,\n indicatorState: {\n rendered: false,\n transition: false,\n rect: { left: \"0px\", top: \"0px\", width: \"0px\", height: \"0px\" },\n },\n },\n\n watch: {\n value: [\"allowIndicatorTransition\", \"syncIndicatorRect\", \"syncTabIndex\", \"clickIfLink\"],\n dir: [\"syncIndicatorRect\"],\n orientation: [\"syncIndicatorRect\"],\n },\n\n on: {\n SET_VALUE: {\n actions: \"setValue\",\n },\n CLEAR_VALUE: {\n actions: \"clearValue\",\n },\n SET_INDICATOR_RECT: {\n actions: \"setIndicatorRect\",\n },\n SYNC_TAB_INDEX: {\n actions: \"syncTabIndex\",\n },\n },\n\n created: [\"syncFocusedValue\"],\n entry: [\"checkRenderedElements\", \"syncIndicatorRect\", \"syncTabIndex\"],\n exit: [\"cleanupObserver\"],\n\n states: {\n idle: {\n on: {\n TAB_FOCUS: {\n target: \"focused\",\n actions: \"setFocusedValue\",\n },\n TAB_CLICK: {\n target: \"focused\",\n actions: [\"setFocusedValue\", \"setValue\"],\n },\n },\n },\n focused: {\n on: {\n TAB_CLICK: {\n target: \"focused\",\n actions: [\"setFocusedValue\", \"setValue\"],\n },\n ARROW_PREV: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusPrevTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusPrevTab\",\n },\n ],\n ARROW_NEXT: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusNextTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusNextTab\",\n },\n ],\n HOME: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusFirstTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusFirstTab\",\n },\n ],\n END: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusLastTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusLastTab\",\n },\n ],\n ENTER: {\n guard: not(\"selectOnFocus\"),\n actions: \"selectFocusedTab\",\n },\n TAB_FOCUS: {\n actions: [\"setFocusedValue\"],\n },\n TAB_BLUR: {\n target: \"idle\",\n actions: \"clearFocusedValue\",\n },\n },\n },\n },\n },\n {\n guards: {\n selectOnFocus: (ctx) => ctx.activationMode === \"automatic\",\n },\n\n actions: {\n syncFocusedValue(ctx) {\n if (ctx.value != null && ctx.focusedValue == null) {\n ctx.focusedValue = ctx.value\n }\n },\n selectFocusedTab(ctx) {\n raf(() => {\n set.value(ctx, ctx.focusedValue)\n })\n },\n setFocusedValue(ctx, evt) {\n if (evt.value == null) return\n set.focusedValue(ctx, evt.value)\n },\n clearFocusedValue(ctx) {\n set.focusedValue(ctx, null)\n },\n setValue(ctx, evt) {\n set.value(ctx, evt.value)\n },\n clearValue(ctx) {\n set.value(ctx, null)\n },\n focusFirstTab(ctx) {\n raf(() => {\n dom.getFirstTriggerEl(ctx)?.focus()\n })\n },\n focusLastTab(ctx) {\n raf(() => {\n dom.getLastTriggerEl(ctx)?.focus()\n })\n },\n focusNextTab(ctx) {\n if (!ctx.focusedValue) return\n const triggerEl = dom.getNextTriggerEl(ctx, ctx.focusedValue)\n raf(() => {\n if (ctx.composite) {\n triggerEl?.focus()\n } else if (triggerEl?.dataset.value != null) {\n set.focusedValue(ctx, triggerEl.dataset.value)\n }\n })\n },\n focusPrevTab(ctx) {\n if (!ctx.focusedValue) return\n const triggerEl = dom.getPrevTriggerEl(ctx, ctx.focusedValue)\n raf(() => {\n if (ctx.composite) {\n triggerEl?.focus()\n } else if (triggerEl?.dataset.value != null) {\n set.focusedValue(ctx, triggerEl.dataset.value)\n }\n })\n },\n checkRenderedElements(ctx) {\n ctx.indicatorState.rendered = !!dom.getIndicatorEl(ctx)\n },\n syncTabIndex(ctx) {\n raf(() => {\n const contentEl = dom.getSelectedContentEl(ctx)\n if (!contentEl) return\n const focusables = getFocusables(contentEl)\n if (focusables.length > 0) {\n contentEl.removeAttribute(\"tabindex\")\n } else {\n contentEl.setAttribute(\"tabindex\", \"0\")\n }\n })\n },\n cleanupObserver(ctx) {\n ctx.indicatorCleanup?.()\n },\n allowIndicatorTransition(ctx) {\n ctx.indicatorState.transition = true\n },\n setIndicatorRect(ctx, evt) {\n const value = evt.id ?? ctx.value\n if (!ctx.indicatorState.rendered \|\| !value) return\n\n const triggerEl = dom.getTriggerEl(ctx, value)\n if (!triggerEl) return\n\n ctx.indicatorState.rect = dom.getRectById(ctx, value)\n nextTick(() => {\n ctx.indicatorState.transition = false\n })\n },\n syncIndicatorRect(ctx) {\n ctx.indicatorCleanup?.()\n\n const value = ctx.value\n if (!ctx.indicatorState.rendered \|\| !value) return\n\n const triggerEl = dom.getSelectedTriggerEl(ctx)\n if (!triggerEl) return\n\n ctx.indicatorCleanup = trackElementRect(triggerEl, {\n getRect(el) {\n return dom.getOffsetRect(el)\n },\n onChange(rect) {\n ctx.indicatorState.rect = dom.resolveRect(rect)\n nextTick(() => {\n ctx.indicatorState.transition = false\n })\n },\n })\n },\n clickIfLink(ctx) {\n clickIfLink(dom.getSelectedTriggerEl(ctx))\n },\n },\n },\n )\n}\n\nconst invoke = {\n change: (ctx: MachineContext) => {\n if (ctx.value == null) return\n ctx.onValueChange?.({ value: ctx.value })\n },\n focusChange: (ctx: MachineContext) => {\n if (ctx.focusedValue == null) return\n ctx.onFocusChange?.({ focusedValue: ctx.focusedValue })\n },\n}\n\nconst set = {\n value: (ctx: MachineContext, value: string \| null) => {\n if (isEqual(value, ctx.value)) return\n ctx.value = value\n invoke.change(ctx)\n },\n focusedValue: (ctx: MachineContext, value: string \| null) => {\n if (isEqual(value, ctx.focusedValue)) return\n ctx.focusedValue = value\n invoke.focusChange(ctx)\n },\n}\n","import { createProps } from \"@zag-js/types\"\nimport { createSplitProps } from \"@zag-js/utils\"\nimport type { ContentProps, TriggerProps, UserDefinedContext } from \"./tabs.types\"\n\nexport const props = createProps<UserDefinedContext>()([\n \"activationMode\",\n \"composite\",\n \"dir\",\n \"getRootNode\",\n \"id\",\n \"ids\",\n \"loopFocus\",\n \"onFocusChange\",\n \"onValueChange\",\n \"orientation\",\n \"translations\",\n \"value\",\n])\n\nexport const splitProps = createSplitProps<Partial<UserDefinedContext>>(props)\n\nexport const triggerProps = createProps<TriggerProps>()([\"disabled\", \"value\"])\nexport const splitTriggerProps = createSplitProps<TriggerProps>(triggerProps)\n\nexport const contentProps = createProps<ContentProps>()([\"value\"])\nexport const splitContentProps = createSplitProps<ContentProps>(contentProps)\n"],"mappings":"qqBAAA,sUCAA,mBAA8B,2BAEvB,IAAM,WAAU,8BAAc,MAAM,EAAE,MAAM,OAAQ,OAAQ,UAAW,UAAW,WAAW,EAC7F,IAAM,MAAQ,QAAQ,MAAM,ECHnC,qBAA8C,6BAC9C,IAAAA,kBAAmE,6BCDnE,qBAAoE,6BACpE,iBAA4B,yBAGrB,IAAM,OAAM,8BAAY,CAC7B,UAAY,KAAa,IAAI,KAAK,MAAQ,QAAQ,IAAI,EAAE,GACxD,UAAY,KAAa,IAAI,KAAK,MAAQ,QAAQ,IAAI,EAAE,QACxD,aAAc,CAAC,IAAU,KAAe,IAAI,KAAK,SAAW,QAAQ,IAAI,EAAE,YAAY,EAAE,GACxF,aAAc,CAAC,IAAU,KAAe,IAAI,KAAK,SAAW,QAAQ,IAAI,EAAE,YAAY,EAAE,GACxF,eAAiB,KAAa,IAAI,KAAK,WAAa,QAAQ,IAAI,EAAE,aAElE,UAAY,KAAa,IAAI,QAAQ,IAAK,IAAI,UAAU,GAAG,CAAC,EAC5D,aAAc,CAAC,IAAU,KAAe,IAAI,QAAQ,IAAK,IAAI,aAAa,IAAK,EAAE,CAAC,EAClF,aAAc,CAAC,IAAU,KAAe,IAAI,QAAQ,IAAK,IAAI,aAAa,IAAK,EAAE,CAAC,EAClF,eAAiB,KAAa,IAAI,QAAQ,IAAK,IAAI,eAAe,GAAG,CAAC,EAEtE,YAAc,KAAa,CACzB,MAAM,QAAU,IAAI,OAAO,IAAI,UAAU,GAAG,CAAC,EAC7C,MAAM,SAAW,4BAA4B,OAAO,qBACpD,SAAO,2BAAS,IAAI,UAAU,GAAG,EAAG,QAAQ,CAC9C,EAEA,kBAAoB,QAAa,oBAAM,IAAI,YAAY,GAAG,CAAC,EAC3D,iBAAmB,QAAa,mBAAK,IAAI,YAAY,GAAG,CAAC,EACzD,iBAAkB,CAAC,IAAU,QAAe,2BAAS,IAAI,YAAY,GAAG,EAAG,IAAI,aAAa,IAAK,EAAE,EAAG,IAAI,SAAS,EACnH,iBAAkB,CAAC,IAAU,QAAe,2BAAS,IAAI,YAAY,GAAG,EAAG,IAAI,aAAa,IAAK,EAAE,EAAG,IAAI,SAAS,EACnH,qBAAuB,KAAa,CAClC,GAAI,CAAC,IAAI,MAAO,OAChB,OAAO,IAAI,aAAa,IAAK,IAAI,KAAK,CACxC,EACA,qBAAuB,KAAa,CAClC,GAAI,CAAC,IAAI,MAAO,OAChB,OAAO,IAAI,aAAa,IAAK,IAAI,KAAK,CACxC,EAEA,cAAgB,IAAgC,CAC9C,MAAO,CACL,KAAM,IAAI,YAAc,EACxB,IAAK,IAAI,WAAa,EACtB,MAAO,IAAI,aAAe,EAC1B,OAAQ,IAAI,cAAgB,CAC9B,CACF,EAEA,YAAa,CAAC,IAAU,KAAe,CACrC,MAAM,OAAM,2BAAS,IAAI,YAAY,GAAG,EAAG,IAAI,aAAa,IAAK,EAAE,CAAC,EACpE,OAAO,IAAI,YAAY,IAAI,cAAc,GAAG,CAAC,CAC/C,EAEA,YAAc,OAA+D,CAC3E,MAAO,GAAG,KAAK,KAAK,KACpB,OAAQ,GAAG,KAAK,MAAM,KACtB,KAAM,GAAG,KAAK,IAAI,KAClB,IAAK,GAAG,KAAK,GAAG,IAClB,EACF,CAAC,EDhDM,SAAS,QAA6B,MAAc,KAAY,UAA6C,CAClH,MAAM,aAAe,MAAM,QAAQ,aACnC,MAAM,QAAU,MAAM,QAAQ,SAAS,EAEvC,MAAM,WAAa,MAAM,QAAQ,cAAgB,WACjD,MAAM,aAAe,MAAM,QAAQ,cAAgB,aACnD,MAAM,UAAY,MAAM,QAAQ,UAChC,MAAM,UAAY,MAAM,QAAQ,eAEhC,SAAS,gBAAgBC,OAAmC,CAC1D,MAAO,CACL,SAAU,MAAM,QAAQ,QAAUA,OAAM,MACxC,QAAS,MAAM,QAAQ,eAAiBA,OAAM,MAC9C,SAAU,CAAC,CAACA,OAAM,QACpB,CACF,CAEA,MAAO,CACL,MAAO,MAAM,QAAQ,MACrB,aAAc,MAAM,QAAQ,aAC5B,SAAS,MAAO,CACd,KAAK,CAAE,KAAM,YAAa,KAAM,CAAC,CACnC,EACA,YAAa,CACX,KAAK,CAAE,KAAM,aAAc,CAAC,CAC9B,EACA,iBAAiB,MAAO,CACtB,MAAM,GAAK,IAAI,aAAa,MAAM,QAAS,KAAK,EAChD,KAAK,CAAE,KAAM,qBAAsB,EAAG,CAAC,CACzC,EACA,cAAe,CACb,KAAK,gBAAgB,CACvB,EACA,WAAW,UAAW,CACpB,KAAK,CAAE,KAAM,YAAa,MAAO,UAAW,IAAK,YAAa,CAAC,EAC/D,KAAK,CAAE,KAAM,aAAc,IAAK,YAAa,CAAC,CAChD,EACA,WAAW,UAAW,CACpB,KAAK,CAAE,KAAM,YAAa,MAAO,UAAW,IAAK,YAAa,CAAC,EAC/D,KAAK,CAAE,KAAM,aAAc,IAAK,YAAa,CAAC,CAChD,EACA,OAAQ,CACN,IAAI,qBAAqB,MAAM,OAAO,GAAG,MAAM,CACjD,EACA,gBAEA,UAAW,UAAU,QAAQ,CAC3B,GAAG,MAAM,KAAK,MACd,GAAI,IAAI,UAAU,MAAM,OAAO,EAC/B,mBAAoB,MAAM,QAAQ,YAClC,gBAAc,4BAAS,OAAO,EAC9B,IAAK,MAAM,QAAQ,GACrB,CAAC,EAED,UAAW,UAAU,QAAQ,CAC3B,GAAG,MAAM,KAAK,MACd,GAAI,IAAI,UAAU,MAAM,OAAO,EAC/B,KAAM,UACN,IAAK,MAAM,QAAQ,IACnB,gBAAc,4BAAS,OAAO,EAC9B,mBAAoB,MAAM,QAAQ,YAClC,mBAAoB,MAAM,QAAQ,YAClC,aAAc,cAAc,UAC5B,UAAU,MAAO,CACf,GAAI,MAAM,iBAAkB,OAE5B,GAAI,IAAC,gCAAa,KAAK,EAAG,OAC1B,MAAI,oCAAiB,KAAK,EAAG,OAE7B,MAAM,OAAsB,CAC1B,WAAY,CACV,GAAI,aAAc,OAClB,KAAK,CAAE,KAAM,aAAc,IAAK,WAAY,CAAC,CAC/C,EACA,SAAU,CACR,GAAI,aAAc,OAClB,KAAK,CAAE,KAAM,aAAc,IAAK,SAAU,CAAC,CAC7C,EACA,WAAY,CACV,GAAI,WAAY,OAChB,KAAK,CAAE,KAAM,aAAc,IAAK,WAAY,CAAC,CAC/C,EACA,YAAa,CACX,GAAI,WAAY,OAChB,KAAK,CAAE,KAAM,aAAc,IAAK,YAAa,CAAC,CAChD,EACA,MAAO,CACL,KAAK,MAAM,CACb,EACA,KAAM,CACJ,KAAK,KAAK,CACZ,EACA,OAAQ,CACN,KAAK,CAAE,KAAM,OAAQ,CAAC,CACxB,CACF,EAEA,IAAI,OAAM,8BAAY,MAAO,MAAM,OAAO,EAC1C,MAAM,KAAO,OAAO,GAAG,EAEvB,GAAI,KAAM,CACR,MAAM,eAAe,EACrB,KAAK,KAAK,CACZ,CACF,CACF,CAAC,EAED,gBAAgBA,OAAO,CACrB,KAAM,CAAE,MAAO,QAAS,EAAIA,OAC5B,MAAM,aAAe,gBAAgBA,MAAK,EAE1C,OAAO,UAAU,OAAO,CACtB,GAAG,MAAM,QAAQ,MACjB,KAAM,MACN,KAAM,SACN,SACA,IAAK,MAAM,QAAQ,IACnB,mBAAoB,MAAM,QAAQ,YAClC,mBAAiB,4BAAS,QAAQ,EAClC,gBAAiB,SACjB,aAAc,MACd,gBAAiB,aAAa,SAC9B,mBAAiB,4BAAS,aAAa,QAAQ,EAC/C,gBAAc,4BAAS,aAAa,OAAO,EAC3C,gBAAiB,aAAa,SAAW,IAAI,aAAa,MAAM,QAAS,KAAK,EAAI,OAClF,eAAgB,IAAI,UAAU,MAAM,OAAO,EAC3C,GAAI,IAAI,aAAa,MAAM,QAAS,KAAK,EACzC,SAAU,aAAa,UAAY,UAAY,EAAI,GACnD,SAAU,CACR,KAAK,CAAE,KAAM,YAAa,KAAM,CAAC,CACnC,EACA,OAAO,MAAO,CACZ,MAAM,OAAS,MAAM,cACrB,GAAI,QAAQ,aAAa,MAAM,IAAM,MAAO,CAC1C,KAAK,CAAE,KAAM,UAAW,CAAC,CAC3B,CACF,EACA,QAAQ,MAAO,CACb,GAAI,MAAM,iBAAkB,OAC5B,GAAI,SAAU,OACd,MAAI,4BAAS,EAAG,CACd,MAAM,cAAc,MAAM,CAC5B,CACA,KAAK,CAAE,KAAM,YAAa,KAAM,CAAC,CACnC,CACF,CAAC,CACH,EAEA,gBAAgBA,OAAO,CACrB,KAAM,CAAE,KAAM,EAAIA,OAClB,MAAM,SAAW,MAAM,QAAQ,QAAU,MACzC,OAAO,UAAU,QAAQ,CACvB,GAAG,MAAM,QAAQ,MACjB,IAAK,MAAM,QAAQ,IACnB,GAAI,IAAI,aAAa,MAAM,QAAS,KAAK,EACzC,SAAU,UAAY,EAAI,GAC1B,kBAAmB,IAAI,aAAa,MAAM,QAAS,KAAK,EACxD,KAAM,WACN,eAAgB,IAAI,UAAU,MAAM,OAAO,EAC3C,mBAAiB,4BAAS,QAAQ,EAClC,mBAAoB,MAAM,QAAQ,YAClC,OAAQ,CAAC,QACX,CAAC,CACH,EAEA,eAAgB,UAAU,QAAQ,CAChC,GAAI,IAAI,eAAe,MAAM,OAAO,EACpC,GAAG,MAAM,UAAU,MACnB,IAAK,MAAM,QAAQ,IACnB,mBAAoB,MAAM,QAAQ,YAClC,MAAO,CACL,wBAAyB,0CACzB,SAAU,UAAU,MAAM,KAC1B,QAAS,UAAU,MAAM,IACzB,UAAW,UAAU,MAAM,MAC3B,WAAY,UAAU,MAAM,OAC5B,SAAU,WACV,WAAY,6BACZ,mBAAoB,6BACpB,mBAAoB,UAAU,WAAa,oCAAsC,MACjF,yBAA0B,oCAC1B,CAAC,aAAe,OAAS,KAAK,EAAG,aAAe,cAAgB,YAClE,CACF,CAAC,CACH,CACF,CEhMA,gBAAsC,wBACtC,IAAAC,kBAA4B,6BAC5B,IAAAC,kBAA6C,6BAC7C,wBAAiC,gCACjC,IAAAC,cAAiC,yBAIjC,GAAM,CAAE,GAAI,EAAI,mBAET,SAAS,QAAQ,YAAiC,CACvD,MAAM,OAAM,uBAAQ,WAAW,EAC/B,SAAO,2BACL,CACE,QAAS,OAET,QAAS,CACP,IAAK,MACL,YAAa,aACb,eAAgB,YAChB,MAAO,KACP,UAAW,KACX,UAAW,KACX,GAAG,IACH,aAAc,IAAI,OAAS,KAC3B,eAAgB,CACd,SAAU,MACV,WAAY,MACZ,KAAM,CAAE,KAAM,MAAO,IAAK,MAAO,MAAO,MAAO,OAAQ,KAAM,CAC/D,CACF,EAEA,MAAO,CACL,MAAO,CAAC,2BAA4B,oBAAqB,eAAgB,aAAa,EACtF,IAAK,CAAC,mBAAmB,EACzB,YAAa,CAAC,mBAAmB,CACnC,EAEA,GAAI,CACF,UAAW,CACT,QAAS,UACX,EACA,YAAa,CACX,QAAS,YACX,EACA,mBAAoB,CAClB,QAAS,kBACX,EACA,eAAgB,CACd,QAAS,cACX,CACF,EAEA,QAAS,CAAC,kBAAkB,EAC5B,MAAO,CAAC,wBAAyB,oBAAqB,cAAc,EACpE,KAAM,CAAC,iBAAiB,EAExB,OAAQ,CACN,KAAM,CACJ,GAAI,CACF,UAAW,CACT,OAAQ,UACR,QAAS,iBACX,EACA,UAAW,CACT,OAAQ,UACR,QAAS,CAAC,kBAAmB,UAAU,CACzC,CACF,CACF,EACA,QAAS,CACP,GAAI,CACF,UAAW,CACT,OAAQ,UACR,QAAS,CAAC,kBAAmB,UAAU,CACzC,EACA,WAAY,CACV,CACE,MAAO,gBACP,QAAS,CAAC,eAAgB,kBAAkB,CAC9C,EACA,CACE,QAAS,cACX,CACF,EACA,WAAY,CACV,CACE,MAAO,gBACP,QAAS,CAAC,eAAgB,kBAAkB,CAC9C,EACA,CACE,QAAS,cACX,CACF,EACA,KAAM,CACJ,CACE,MAAO,gBACP,QAAS,CAAC,gBAAiB,kBAAkB,CAC/C,EACA,CACE,QAAS,eACX,CACF,EACA,IAAK,CACH,CACE,MAAO,gBACP,QAAS,CAAC,eAAgB,kBAAkB,CAC9C,EACA,CACE,QAAS,cACX,CACF,EACA,MAAO,CACL,MAAO,IAAI,eAAe,EAC1B,QAAS,kBACX,EACA,UAAW,CACT,QAAS,CAAC,iBAAiB,CAC7B,EACA,SAAU,CACR,OAAQ,OACR,QAAS,mBACX,CACF,CACF,CACF,CACF,EACA,CACE,OAAQ,CACN,cAAgBC,MAAQA,KAAI,iBAAmB,WACjD,EAEA,QAAS,CACP,iBAAiBA,KAAK,CACpB,GAAIA,KAAI,OAAS,MAAQA,KAAI,cAAgB,KAAM,CACjDA,KAAI,aAAeA,KAAI,KACzB,CACF,EACA,iBAAiBA,KAAK,IACpB,uBAAI,IAAM,CACR,IAAI,MAAMA,KAAKA,KAAI,YAAY,CACjC,CAAC,CACH,EACA,gBAAgBA,KAAK,IAAK,CACxB,GAAI,IAAI,OAAS,KAAM,OACvB,IAAI,aAAaA,KAAK,IAAI,KAAK,CACjC,EACA,kBAAkBA,KAAK,CACrB,IAAI,aAAaA,KAAK,IAAI,CAC5B,EACA,SAASA,KAAK,IAAK,CACjB,IAAI,MAAMA,KAAK,IAAI,KAAK,CAC1B,EACA,WAAWA,KAAK,CACd,IAAI,MAAMA,KAAK,IAAI,CACrB,EACA,cAAcA,KAAK,IACjB,uBAAI,IAAM,CACR,IAAI,kBAAkBA,IAAG,GAAG,MAAM,CACpC,CAAC,CACH,EACA,aAAaA,KAAK,IAChB,uBAAI,IAAM,CACR,IAAI,iBAAiBA,IAAG,GAAG,MAAM,CACnC,CAAC,CACH,EACA,aAAaA,KAAK,CAChB,GAAI,CAACA,KAAI,aAAc,OACvB,MAAM,UAAY,IAAI,iBAAiBA,KAAKA,KAAI,YAAY,KAC5D,uBAAI,IAAM,CACR,GAAIA,KAAI,UAAW,CACjB,WAAW,MAAM,CACnB,SAAW,WAAW,QAAQ,OAAS,KAAM,CAC3C,IAAI,aAAaA,KAAK,UAAU,QAAQ,KAAK,CAC/C,CACF,CAAC,CACH,EACA,aAAaA,KAAK,CAChB,GAAI,CAACA,KAAI,aAAc,OACvB,MAAM,UAAY,IAAI,iBAAiBA,KAAKA,KAAI,YAAY,KAC5D,uBAAI,IAAM,CACR,GAAIA,KAAI,UAAW,CACjB,WAAW,MAAM,CACnB,SAAW,WAAW,QAAQ,OAAS,KAAM,CAC3C,IAAI,aAAaA,KAAK,UAAU,QAAQ,KAAK,CAC/C,CACF,CAAC,CACH,EACA,sBAAsBA,KAAK,CACzBA,KAAI,eAAe,SAAW,CAAC,CAAC,IAAI,eAAeA,IAAG,CACxD,EACA,aAAaA,KAAK,IAChB,uBAAI,IAAM,CACR,MAAM,UAAY,IAAI,qBAAqBA,IAAG,EAC9C,GAAI,CAAC,UAAW,OAChB,MAAM,cAAa,iCAAc,SAAS,EAC1C,GAAI,WAAW,OAAS,EAAG,CACzB,UAAU,gBAAgB,UAAU,CACtC,KAAO,CACL,UAAU,aAAa,WAAY,GAAG,CACxC,CACF,CAAC,CACH,EACA,gBAAgBA,KAAK,CACnBA,KAAI,mBAAmB,CACzB,EACA,yBAAyBA,KAAK,CAC5BA,KAAI,eAAe,WAAa,IAClC,EACA,iBAAiBA,KAAK,IAAK,CACzB,MAAM,MAAQ,IAAI,IAAMA,KAAI,MAC5B,GAAI,CAACA,KAAI,eAAe,UAAY,CAAC,MAAO,OAE5C,MAAM,UAAY,IAAI,aAAaA,KAAK,KAAK,EAC7C,GAAI,CAAC,UAAW,OAEhBA,KAAI,eAAe,KAAO,IAAI,YAAYA,KAAK,KAAK,KACpD,4BAAS,IAAM,CACbA,KAAI,eAAe,WAAa,KAClC,CAAC,CACH,EACA,kBAAkBA,KAAK,CACrBA,KAAI,mBAAmB,EAEvB,MAAM,MAAQA,KAAI,MAClB,GAAI,CAACA,KAAI,eAAe,UAAY,CAAC,MAAO,OAE5C,MAAM,UAAY,IAAI,qBAAqBA,IAAG,EAC9C,GAAI,CAAC,UAAW,OAEhBA,KAAI,oBAAmB,sCAAiB,UAAW,CACjD,QAAQ,GAAI,CACV,OAAO,IAAI,cAAc,EAAE,CAC7B,EACA,SAAS,KAAM,CACbA,KAAI,eAAe,KAAO,IAAI,YAAY,IAAI,KAC9C,4BAAS,IAAM,CACbA,KAAI,eAAe,WAAa,KAClC,CAAC,CACH,CACF,CAAC,CACH,EACA,YAAYA,KAAK,IACf,+BAAY,IAAI,qBAAqBA,IAAG,CAAC,CAC3C,CACF,CACF,CACF,CACF,CAEA,IAAM,OAAS,CACb,OAAS,KAAwB,CAC/B,GAAI,IAAI,OAAS,KAAM,OACvB,IAAI,gBAAgB,CAAE,MAAO,IAAI,KAAM,CAAC,CAC1C,EACA,YAAc,KAAwB,CACpC,GAAI,IAAI,cAAgB,KAAM,OAC9B,IAAI,gBAAgB,CAAE,aAAc,IAAI,YAAa,CAAC,CACxD,CACF,EAEA,IAAM,IAAM,CACV,MAAO,CAAC,IAAqB,QAAyB,CACpD,MAAI,uBAAQ,MAAO,IAAI,KAAK,EAAG,OAC/B,IAAI,MAAQ,MACZ,OAAO,OAAO,GAAG,CACnB,EACA,aAAc,CAAC,IAAqB,QAAyB,CAC3D,MAAI,uBAAQ,MAAO,IAAI,YAAY,EAAG,OACtC,IAAI,aAAe,MACnB,OAAO,YAAY,GAAG,CACxB,CACF,EChRA,iBAA4B,yBAC5B,IAAAC,cAAiC,yBAG1B,IAAM,SAAQ,0BAAgC,EAAE,CACrD,iBACA,YACA,MACA,cACA,KACA,MACA,YACA,gBACA,gBACA,cACA,eACA,OACF,CAAC,EAEM,IAAM,cAAa,gCAA8C,KAAK,EAEtE,IAAM,gBAAe,0BAA0B,EAAE,CAAC,WAAY,OAAO,CAAC,EACtE,IAAM,qBAAoB,gCAA+B,YAAY,EAErE,IAAM,gBAAe,0BAA0B,EAAE,CAAC,OAAO,CAAC,EAC1D,IAAM,qBAAoB,gCAA+B,YAAY","names":["import_dom_query","props","import_dom_event","import_dom_query","import_utils","ctx","import_utils"]}

package/dist/index.mjs CHANGED Viewed

@@ -1,2 +1,2 @@
-import{createAnatomy}from"@zag-js/anatomy";var anatomy=createAnatomy("tabs").parts("root","list","trigger","content","indicator");var parts=anatomy.build();import{getEventKey,getNativeEvent}from"@zag-js/dom-event";import{dataAttr,isSafari,isSelfTarget}from"@zag-js/dom-query";import{createScope,itemById,nextById,prevById,queryAll}from"@zag-js/dom-query";import{first,last}from"@zag-js/utils";var dom=createScope({getRootId:ctx=>ctx.ids?.root??`tabs:${ctx.id}`,getListId:ctx=>ctx.ids?.list??`tabs:${ctx.id}:list`,getContentId:(ctx,id)=>ctx.ids?.content??`tabs:${ctx.id}:content-${id}`,getTriggerId:(ctx,id)=>ctx.ids?.trigger??`tabs:${ctx.id}:trigger-${id}`,getIndicatorId:ctx=>ctx.ids?.indicator??`tabs:${ctx.id}:indicator`,getListEl:ctx=>dom.getById(ctx,dom.getListId(ctx)),getContentEl:(ctx,id)=>dom.getById(ctx,dom.getContentId(ctx,id)),getTriggerEl:(ctx,id)=>dom.getById(ctx,dom.getTriggerId(ctx,id)),getIndicatorEl:ctx=>dom.getById(ctx,dom.getIndicatorId(ctx)),getElements:ctx=>{const ownerId=CSS.escape(dom.getListId(ctx));const selector=`[role=tab][data-ownedby='${ownerId}']:not([disabled])`;return queryAll(dom.getListEl(ctx),selector)},getFirstTriggerEl:ctx=>first(dom.getElements(ctx)),getLastTriggerEl:ctx=>last(dom.getElements(ctx)),getNextTriggerEl:(ctx,id)=>nextById(dom.getElements(ctx),dom.getTriggerId(ctx,id),ctx.loopFocus),getPrevTriggerEl:(ctx,id)=>prevById(dom.getElements(ctx),dom.getTriggerId(ctx,id),ctx.loopFocus),getSelectedContentEl:ctx=>{if(!ctx.value)return;return dom.getContentEl(ctx,ctx.value)},getSelectedTriggerEl:ctx=>{if(!ctx.value)return;return dom.getTriggerEl(ctx,ctx.value)},getOffsetRect:el=>{return{left:el?.offsetLeft??0,top:el?.offsetTop??0,width:el?.offsetWidth??0,height:el?.offsetHeight??0}},getRectById:(ctx,id)=>{const tab=itemById(dom.getElements(ctx),dom.getTriggerId(ctx,id));return dom.resolveRect(dom.getOffsetRect(tab))},resolveRect:rect=>({width:`${rect.width}px`,height:`${rect.height}px`,left:`${rect.left}px`,top:`${rect.top}px`})});function connect(state,send,normalize){const translations=state.context.translations;const focused=state.matches("focused");const isVertical=state.context.orientation==="vertical";const isHorizontal=state.context.orientation==="horizontal";const composite=state.context.composite;const indicator=state.context.indicatorState;function getTriggerState(props2){return{selected:state.context.value===props2.value,focused:state.context.focusedValue===props2.value,disabled:!!props2.disabled}}return{value:state.context.value,focusedValue:state.context.focusedValue,setValue(value){send({type:"SET_VALUE",value})},clearValue(){send({type:"CLEAR_VALUE"})},setIndicatorRect(value){const id=dom.getTriggerId(state.context,value);send({type:"SET_INDICATOR_RECT",id})},syncTabIndex(){send("SYNC_TAB_INDEX")},selectNext(fromValue){send({type:"TAB_FOCUS",value:fromValue,src:"selectNext"});send({type:"ARROW_NEXT",src:"selectNext"})},selectPrev(fromValue){send({type:"TAB_FOCUS",value:fromValue,src:"selectPrev"});send({type:"ARROW_PREV",src:"selectPrev"})},focus(){dom.getSelectedTriggerEl(state.context)?.focus()},getTriggerState,rootProps:normalize.element({...parts.root.attrs,id:dom.getRootId(state.context),"data-orientation":state.context.orientation,"data-focus":dataAttr(focused),dir:state.context.dir}),listProps:normalize.element({...parts.list.attrs,id:dom.getListId(state.context),role:"tablist",dir:state.context.dir,"data-focus":dataAttr(focused),"aria-orientation":state.context.orientation,"data-orientation":state.context.orientation,"aria-label":translations?.listLabel,onKeyDown(event){if(event.defaultPrevented)return;const evt=getNativeEvent(event);if(!isSelfTarget(evt))return;if(evt.isComposing)return;const keyMap={ArrowDown(){if(isHorizontal)return;send({type:"ARROW_NEXT",key:"ArrowDown"})},ArrowUp(){if(isHorizontal)return;send({type:"ARROW_PREV",key:"ArrowUp"})},ArrowLeft(){if(isVertical)return;send({type:"ARROW_PREV",key:"ArrowLeft"})},ArrowRight(){if(isVertical)return;send({type:"ARROW_NEXT",key:"ArrowRight"})},Home(){send("HOME")},End(){send("END")},Enter(){send({type:"ENTER"})}};let key=getEventKey(event,state.context);const exec=keyMap[key];if(exec){event.preventDefault();exec(event)}}}),getTriggerProps(props2){const{value,disabled}=props2;const triggerState=getTriggerState(props2);return normalize.button({...parts.trigger.attrs,role:"tab",type:"button",disabled,dir:state.context.dir,"data-orientation":state.context.orientation,"data-disabled":dataAttr(disabled),"aria-disabled":disabled,"data-value":value,"aria-selected":triggerState.selected,"data-selected":dataAttr(triggerState.selected),"data-focus":dataAttr(triggerState.focused),"aria-controls":triggerState.selected?dom.getContentId(state.context,value):void 0,"data-ownedby":dom.getListId(state.context),id:dom.getTriggerId(state.context,value),tabIndex:triggerState.selected&&composite?0:-1,onFocus(){send({type:"TAB_FOCUS",value})},onBlur(event){const target=event.relatedTarget;if(target?.getAttribute("role")!=="tab"){send({type:"TAB_BLUR"})}},onClick(event){if(event.defaultPrevented)return;if(disabled)return;if(isSafari()){event.currentTarget.focus()}send({type:"TAB_CLICK",value})}})},getContentProps(props2){const{value}=props2;const selected=state.context.value===value;return normalize.element({...parts.content.attrs,dir:state.context.dir,id:dom.getContentId(state.context,value),tabIndex:composite?0:-1,"aria-labelledby":dom.getTriggerId(state.context,value),role:"tabpanel","data-ownedby":dom.getListId(state.context),"data-selected":dataAttr(selected),"data-orientation":state.context.orientation,hidden:!selected})},indicatorProps:normalize.element({id:dom.getIndicatorId(state.context),...parts.indicator.attrs,dir:state.context.dir,"data-orientation":state.context.orientation,style:{"--transition-property":"left, right, top, bottom, width, height","--left":indicator.rect?.left,"--top":indicator.rect?.top,"--width":indicator.rect?.width,"--height":indicator.rect?.height,position:"absolute",willChange:"var(--transition-property)",transitionProperty:"var(--transition-property)",transitionDuration:indicator.transition?"var(--transition-duration, 150ms)":"0ms",transitionTimingFunction:"var(--transition-timing-function)",[isHorizontal?"left":"top"]:isHorizontal?"var(--left)":"var(--top)"}})}}import{createMachine,guards}from"@zag-js/core";import{clickIfLink}from"@zag-js/dom-event";import{nextTick,raf,getFocusables}from"@zag-js/dom-query";import{trackElementRect}from"@zag-js/element-rect";import{compact,isEqual}from"@zag-js/utils";var{not}=guards;function machine(userContext){const ctx=compact(userContext);return createMachine({initial:"idle",context:{dir:"ltr",orientation:"horizontal",activationMode:"automatic",value:null,loopFocus:true,composite:true,...ctx,focusedValue:ctx.value??null,indicatorState:{rendered:false,transition:false,rect:{left:"0px",top:"0px",width:"0px",height:"0px"}}},watch:{value:["allowIndicatorTransition","syncIndicatorRect","syncTabIndex","clickIfLink"],dir:["syncIndicatorRect"],orientation:["syncIndicatorRect"]},on:{SET_VALUE:{actions:"setValue"},CLEAR_VALUE:{actions:"clearValue"},SET_INDICATOR_RECT:{actions:"setIndicatorRect"},SYNC_TAB_INDEX:{actions:"syncTabIndex"}},created:["syncFocusedValue"],entry:["checkRenderedElements","syncIndicatorRect","syncTabIndex"],exit:["cleanupObserver"],states:{idle:{on:{TAB_FOCUS:{target:"focused",actions:"setFocusedValue"},TAB_CLICK:{target:"focused",actions:["setFocusedValue","setValue"]}}},focused:{on:{TAB_CLICK:{target:"focused",actions:["setFocusedValue","setValue"]},ARROW_PREV:[{guard:"selectOnFocus",actions:["focusPrevTab","selectFocusedTab"]},{actions:"focusPrevTab"}],ARROW_NEXT:[{guard:"selectOnFocus",actions:["focusNextTab","selectFocusedTab"]},{actions:"focusNextTab"}],HOME:[{guard:"selectOnFocus",actions:["focusFirstTab","selectFocusedTab"]},{actions:"focusFirstTab"}],END:[{guard:"selectOnFocus",actions:["focusLastTab","selectFocusedTab"]},{actions:"focusLastTab"}],ENTER:{guard:not("selectOnFocus"),actions:"selectFocusedTab"},TAB_FOCUS:{actions:["setFocusedValue"]},TAB_BLUR:{target:"idle",actions:"clearFocusedValue"}}}}},{guards:{selectOnFocus:ctx2=>ctx2.activationMode==="automatic"},actions:{syncFocusedValue(ctx2){if(ctx2.value!=null&&ctx2.focusedValue==null){ctx2.focusedValue=ctx2.value}},selectFocusedTab(ctx2){raf(()=>{set.value(ctx2,ctx2.focusedValue)})},setFocusedValue(ctx2,evt){if(evt.value==null)return;set.focusedValue(ctx2,evt.value)},clearFocusedValue(ctx2){set.focusedValue(ctx2,null)},setValue(ctx2,evt){set.value(ctx2,evt.value)},clearValue(ctx2){set.value(ctx2,null)},focusFirstTab(ctx2){raf(()=>{dom.getFirstTriggerEl(ctx2)?.focus()})},focusLastTab(ctx2){raf(()=>{dom.getLastTriggerEl(ctx2)?.focus()})},focusNextTab(ctx2){if(!ctx2.focusedValue)return;const triggerEl=dom.getNextTriggerEl(ctx2,ctx2.focusedValue);raf(()=>{if(ctx2.composite){triggerEl?.focus()}else if(triggerEl?.dataset.value!=null){set.focusedValue(ctx2,triggerEl.dataset.value)}})},focusPrevTab(ctx2){if(!ctx2.focusedValue)return;const triggerEl=dom.getPrevTriggerEl(ctx2,ctx2.focusedValue);raf(()=>{if(ctx2.composite){triggerEl?.focus()}else if(triggerEl?.dataset.value!=null){set.focusedValue(ctx2,triggerEl.dataset.value)}})},checkRenderedElements(ctx2){ctx2.indicatorState.rendered=!!dom.getIndicatorEl(ctx2)},syncTabIndex(ctx2){raf(()=>{const contentEl=dom.getSelectedContentEl(ctx2);if(!contentEl)return;const focusables=getFocusables(contentEl);if(focusables.length>0){contentEl.removeAttribute("tabindex")}else{contentEl.setAttribute("tabindex","0")}})},cleanupObserver(ctx2){ctx2.indicatorCleanup?.()},allowIndicatorTransition(ctx2){ctx2.indicatorState.transition=true},setIndicatorRect(ctx2,evt){const value=evt.id??ctx2.value;if(!ctx2.indicatorState.rendered||!value)return;const triggerEl=dom.getTriggerEl(ctx2,value);if(!triggerEl)return;ctx2.indicatorState.rect=dom.getRectById(ctx2,value);nextTick(()=>{ctx2.indicatorState.transition=false})},syncIndicatorRect(ctx2){ctx2.indicatorCleanup?.();const value=ctx2.value;if(!ctx2.indicatorState.rendered||!value)return;const triggerEl=dom.getSelectedTriggerEl(ctx2);if(!triggerEl)return;ctx2.indicatorCleanup=trackElementRect(triggerEl,{getRect(el){return dom.getOffsetRect(el)},onChange(rect){ctx2.indicatorState.rect=dom.resolveRect(rect);nextTick(()=>{ctx2.indicatorState.transition=false})}})},clickIfLink(ctx2){clickIfLink(dom.getSelectedTriggerEl(ctx2))}}})}var invoke={change:ctx=>{if(ctx.value==null)return;ctx.onValueChange?.({value:ctx.value})},focusChange:ctx=>{if(ctx.focusedValue==null)return;ctx.onFocusChange?.({focusedValue:ctx.focusedValue})}};var set={value:(ctx,value)=>{if(isEqual(value,ctx.value))return;ctx.value=value;invoke.change(ctx)},focusedValue:(ctx,value)=>{if(isEqual(value,ctx.focusedValue))return;ctx.focusedValue=value;invoke.focusChange(ctx)}};import{createProps}from"@zag-js/types";import{createSplitProps}from"@zag-js/utils";var props=createProps()(["activationMode","composite","dir","getRootNode","id","ids","loopFocus","onFocusChange","onValueChange","orientation","translations","value"]);var splitProps=createSplitProps(props);var triggerProps=createProps()(["disabled","value"]);var splitTriggerProps=createSplitProps(triggerProps);var contentProps=createProps()(["value"]);var splitContentProps=createSplitProps(contentProps);export{anatomy,connect,contentProps,machine,props,splitContentProps,splitProps,splitTriggerProps,triggerProps};
+import{createAnatomy}from"@zag-js/anatomy";var anatomy=createAnatomy("tabs").parts("root","list","trigger","content","indicator");var parts=anatomy.build();import{getEventKey}from"@zag-js/dom-event";import{dataAttr,isComposingEvent,isSafari,isSelfTarget}from"@zag-js/dom-query";import{createScope,itemById,nextById,prevById,queryAll}from"@zag-js/dom-query";import{first,last}from"@zag-js/utils";var dom=createScope({getRootId:ctx=>ctx.ids?.root??`tabs:${ctx.id}`,getListId:ctx=>ctx.ids?.list??`tabs:${ctx.id}:list`,getContentId:(ctx,id)=>ctx.ids?.content??`tabs:${ctx.id}:content-${id}`,getTriggerId:(ctx,id)=>ctx.ids?.trigger??`tabs:${ctx.id}:trigger-${id}`,getIndicatorId:ctx=>ctx.ids?.indicator??`tabs:${ctx.id}:indicator`,getListEl:ctx=>dom.getById(ctx,dom.getListId(ctx)),getContentEl:(ctx,id)=>dom.getById(ctx,dom.getContentId(ctx,id)),getTriggerEl:(ctx,id)=>dom.getById(ctx,dom.getTriggerId(ctx,id)),getIndicatorEl:ctx=>dom.getById(ctx,dom.getIndicatorId(ctx)),getElements:ctx=>{const ownerId=CSS.escape(dom.getListId(ctx));const selector=`[role=tab][data-ownedby='${ownerId}']:not([disabled])`;return queryAll(dom.getListEl(ctx),selector)},getFirstTriggerEl:ctx=>first(dom.getElements(ctx)),getLastTriggerEl:ctx=>last(dom.getElements(ctx)),getNextTriggerEl:(ctx,id)=>nextById(dom.getElements(ctx),dom.getTriggerId(ctx,id),ctx.loopFocus),getPrevTriggerEl:(ctx,id)=>prevById(dom.getElements(ctx),dom.getTriggerId(ctx,id),ctx.loopFocus),getSelectedContentEl:ctx=>{if(!ctx.value)return;return dom.getContentEl(ctx,ctx.value)},getSelectedTriggerEl:ctx=>{if(!ctx.value)return;return dom.getTriggerEl(ctx,ctx.value)},getOffsetRect:el=>{return{left:el?.offsetLeft??0,top:el?.offsetTop??0,width:el?.offsetWidth??0,height:el?.offsetHeight??0}},getRectById:(ctx,id)=>{const tab=itemById(dom.getElements(ctx),dom.getTriggerId(ctx,id));return dom.resolveRect(dom.getOffsetRect(tab))},resolveRect:rect=>({width:`${rect.width}px`,height:`${rect.height}px`,left:`${rect.left}px`,top:`${rect.top}px`})});function connect(state,send,normalize){const translations=state.context.translations;const focused=state.matches("focused");const isVertical=state.context.orientation==="vertical";const isHorizontal=state.context.orientation==="horizontal";const composite=state.context.composite;const indicator=state.context.indicatorState;function getTriggerState(props2){return{selected:state.context.value===props2.value,focused:state.context.focusedValue===props2.value,disabled:!!props2.disabled}}return{value:state.context.value,focusedValue:state.context.focusedValue,setValue(value){send({type:"SET_VALUE",value})},clearValue(){send({type:"CLEAR_VALUE"})},setIndicatorRect(value){const id=dom.getTriggerId(state.context,value);send({type:"SET_INDICATOR_RECT",id})},syncTabIndex(){send("SYNC_TAB_INDEX")},selectNext(fromValue){send({type:"TAB_FOCUS",value:fromValue,src:"selectNext"});send({type:"ARROW_NEXT",src:"selectNext"})},selectPrev(fromValue){send({type:"TAB_FOCUS",value:fromValue,src:"selectPrev"});send({type:"ARROW_PREV",src:"selectPrev"})},focus(){dom.getSelectedTriggerEl(state.context)?.focus()},getTriggerState,rootProps:normalize.element({...parts.root.attrs,id:dom.getRootId(state.context),"data-orientation":state.context.orientation,"data-focus":dataAttr(focused),dir:state.context.dir}),listProps:normalize.element({...parts.list.attrs,id:dom.getListId(state.context),role:"tablist",dir:state.context.dir,"data-focus":dataAttr(focused),"aria-orientation":state.context.orientation,"data-orientation":state.context.orientation,"aria-label":translations?.listLabel,onKeyDown(event){if(event.defaultPrevented)return;if(!isSelfTarget(event))return;if(isComposingEvent(event))return;const keyMap={ArrowDown(){if(isHorizontal)return;send({type:"ARROW_NEXT",key:"ArrowDown"})},ArrowUp(){if(isHorizontal)return;send({type:"ARROW_PREV",key:"ArrowUp"})},ArrowLeft(){if(isVertical)return;send({type:"ARROW_PREV",key:"ArrowLeft"})},ArrowRight(){if(isVertical)return;send({type:"ARROW_NEXT",key:"ArrowRight"})},Home(){send("HOME")},End(){send("END")},Enter(){send({type:"ENTER"})}};let key=getEventKey(event,state.context);const exec=keyMap[key];if(exec){event.preventDefault();exec(event)}}}),getTriggerProps(props2){const{value,disabled}=props2;const triggerState=getTriggerState(props2);return normalize.button({...parts.trigger.attrs,role:"tab",type:"button",disabled,dir:state.context.dir,"data-orientation":state.context.orientation,"data-disabled":dataAttr(disabled),"aria-disabled":disabled,"data-value":value,"aria-selected":triggerState.selected,"data-selected":dataAttr(triggerState.selected),"data-focus":dataAttr(triggerState.focused),"aria-controls":triggerState.selected?dom.getContentId(state.context,value):void 0,"data-ownedby":dom.getListId(state.context),id:dom.getTriggerId(state.context,value),tabIndex:triggerState.selected&&composite?0:-1,onFocus(){send({type:"TAB_FOCUS",value})},onBlur(event){const target=event.relatedTarget;if(target?.getAttribute("role")!=="tab"){send({type:"TAB_BLUR"})}},onClick(event){if(event.defaultPrevented)return;if(disabled)return;if(isSafari()){event.currentTarget.focus()}send({type:"TAB_CLICK",value})}})},getContentProps(props2){const{value}=props2;const selected=state.context.value===value;return normalize.element({...parts.content.attrs,dir:state.context.dir,id:dom.getContentId(state.context,value),tabIndex:composite?0:-1,"aria-labelledby":dom.getTriggerId(state.context,value),role:"tabpanel","data-ownedby":dom.getListId(state.context),"data-selected":dataAttr(selected),"data-orientation":state.context.orientation,hidden:!selected})},indicatorProps:normalize.element({id:dom.getIndicatorId(state.context),...parts.indicator.attrs,dir:state.context.dir,"data-orientation":state.context.orientation,style:{"--transition-property":"left, right, top, bottom, width, height","--left":indicator.rect?.left,"--top":indicator.rect?.top,"--width":indicator.rect?.width,"--height":indicator.rect?.height,position:"absolute",willChange:"var(--transition-property)",transitionProperty:"var(--transition-property)",transitionDuration:indicator.transition?"var(--transition-duration, 150ms)":"0ms",transitionTimingFunction:"var(--transition-timing-function)",[isHorizontal?"left":"top"]:isHorizontal?"var(--left)":"var(--top)"}})}}import{createMachine,guards}from"@zag-js/core";import{clickIfLink}from"@zag-js/dom-event";import{nextTick,raf,getFocusables}from"@zag-js/dom-query";import{trackElementRect}from"@zag-js/element-rect";import{compact,isEqual}from"@zag-js/utils";var{not}=guards;function machine(userContext){const ctx=compact(userContext);return createMachine({initial:"idle",context:{dir:"ltr",orientation:"horizontal",activationMode:"automatic",value:null,loopFocus:true,composite:true,...ctx,focusedValue:ctx.value??null,indicatorState:{rendered:false,transition:false,rect:{left:"0px",top:"0px",width:"0px",height:"0px"}}},watch:{value:["allowIndicatorTransition","syncIndicatorRect","syncTabIndex","clickIfLink"],dir:["syncIndicatorRect"],orientation:["syncIndicatorRect"]},on:{SET_VALUE:{actions:"setValue"},CLEAR_VALUE:{actions:"clearValue"},SET_INDICATOR_RECT:{actions:"setIndicatorRect"},SYNC_TAB_INDEX:{actions:"syncTabIndex"}},created:["syncFocusedValue"],entry:["checkRenderedElements","syncIndicatorRect","syncTabIndex"],exit:["cleanupObserver"],states:{idle:{on:{TAB_FOCUS:{target:"focused",actions:"setFocusedValue"},TAB_CLICK:{target:"focused",actions:["setFocusedValue","setValue"]}}},focused:{on:{TAB_CLICK:{target:"focused",actions:["setFocusedValue","setValue"]},ARROW_PREV:[{guard:"selectOnFocus",actions:["focusPrevTab","selectFocusedTab"]},{actions:"focusPrevTab"}],ARROW_NEXT:[{guard:"selectOnFocus",actions:["focusNextTab","selectFocusedTab"]},{actions:"focusNextTab"}],HOME:[{guard:"selectOnFocus",actions:["focusFirstTab","selectFocusedTab"]},{actions:"focusFirstTab"}],END:[{guard:"selectOnFocus",actions:["focusLastTab","selectFocusedTab"]},{actions:"focusLastTab"}],ENTER:{guard:not("selectOnFocus"),actions:"selectFocusedTab"},TAB_FOCUS:{actions:["setFocusedValue"]},TAB_BLUR:{target:"idle",actions:"clearFocusedValue"}}}}},{guards:{selectOnFocus:ctx2=>ctx2.activationMode==="automatic"},actions:{syncFocusedValue(ctx2){if(ctx2.value!=null&&ctx2.focusedValue==null){ctx2.focusedValue=ctx2.value}},selectFocusedTab(ctx2){raf(()=>{set.value(ctx2,ctx2.focusedValue)})},setFocusedValue(ctx2,evt){if(evt.value==null)return;set.focusedValue(ctx2,evt.value)},clearFocusedValue(ctx2){set.focusedValue(ctx2,null)},setValue(ctx2,evt){set.value(ctx2,evt.value)},clearValue(ctx2){set.value(ctx2,null)},focusFirstTab(ctx2){raf(()=>{dom.getFirstTriggerEl(ctx2)?.focus()})},focusLastTab(ctx2){raf(()=>{dom.getLastTriggerEl(ctx2)?.focus()})},focusNextTab(ctx2){if(!ctx2.focusedValue)return;const triggerEl=dom.getNextTriggerEl(ctx2,ctx2.focusedValue);raf(()=>{if(ctx2.composite){triggerEl?.focus()}else if(triggerEl?.dataset.value!=null){set.focusedValue(ctx2,triggerEl.dataset.value)}})},focusPrevTab(ctx2){if(!ctx2.focusedValue)return;const triggerEl=dom.getPrevTriggerEl(ctx2,ctx2.focusedValue);raf(()=>{if(ctx2.composite){triggerEl?.focus()}else if(triggerEl?.dataset.value!=null){set.focusedValue(ctx2,triggerEl.dataset.value)}})},checkRenderedElements(ctx2){ctx2.indicatorState.rendered=!!dom.getIndicatorEl(ctx2)},syncTabIndex(ctx2){raf(()=>{const contentEl=dom.getSelectedContentEl(ctx2);if(!contentEl)return;const focusables=getFocusables(contentEl);if(focusables.length>0){contentEl.removeAttribute("tabindex")}else{contentEl.setAttribute("tabindex","0")}})},cleanupObserver(ctx2){ctx2.indicatorCleanup?.()},allowIndicatorTransition(ctx2){ctx2.indicatorState.transition=true},setIndicatorRect(ctx2,evt){const value=evt.id??ctx2.value;if(!ctx2.indicatorState.rendered||!value)return;const triggerEl=dom.getTriggerEl(ctx2,value);if(!triggerEl)return;ctx2.indicatorState.rect=dom.getRectById(ctx2,value);nextTick(()=>{ctx2.indicatorState.transition=false})},syncIndicatorRect(ctx2){ctx2.indicatorCleanup?.();const value=ctx2.value;if(!ctx2.indicatorState.rendered||!value)return;const triggerEl=dom.getSelectedTriggerEl(ctx2);if(!triggerEl)return;ctx2.indicatorCleanup=trackElementRect(triggerEl,{getRect(el){return dom.getOffsetRect(el)},onChange(rect){ctx2.indicatorState.rect=dom.resolveRect(rect);nextTick(()=>{ctx2.indicatorState.transition=false})}})},clickIfLink(ctx2){clickIfLink(dom.getSelectedTriggerEl(ctx2))}}})}var invoke={change:ctx=>{if(ctx.value==null)return;ctx.onValueChange?.({value:ctx.value})},focusChange:ctx=>{if(ctx.focusedValue==null)return;ctx.onFocusChange?.({focusedValue:ctx.focusedValue})}};var set={value:(ctx,value)=>{if(isEqual(value,ctx.value))return;ctx.value=value;invoke.change(ctx)},focusedValue:(ctx,value)=>{if(isEqual(value,ctx.focusedValue))return;ctx.focusedValue=value;invoke.focusChange(ctx)}};import{createProps}from"@zag-js/types";import{createSplitProps}from"@zag-js/utils";var props=createProps()(["activationMode","composite","dir","getRootNode","id","ids","loopFocus","onFocusChange","onValueChange","orientation","translations","value"]);var splitProps=createSplitProps(props);var triggerProps=createProps()(["disabled","value"]);var splitTriggerProps=createSplitProps(triggerProps);var contentProps=createProps()(["value"]);var splitContentProps=createSplitProps(contentProps);export{anatomy,connect,contentProps,machine,props,splitContentProps,splitProps,splitTriggerProps,triggerProps};
 //# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/tabs.anatomy.ts","../src/tabs.connect.ts","../src/tabs.dom.ts","../src/tabs.machine.ts","../src/tabs.props.ts"],"sourcesContent":["import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"tabs\").parts(\"root\", \"list\", \"trigger\", \"content\", \"indicator\")\nexport const parts = anatomy.build()\n","import { getEventKey, getNativeEvent, type EventKeyMap } from \"@zag-js/dom-event\"\nimport { dataAttr, isSafari, isSelfTarget } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { parts } from \"./tabs.anatomy\"\nimport { dom } from \"./tabs.dom\"\nimport type { MachineApi, Send, State, TriggerProps, TriggerState } from \"./tabs.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const translations = state.context.translations\n const focused = state.matches(\"focused\")\n\n const isVertical = state.context.orientation === \"vertical\"\n const isHorizontal = state.context.orientation === \"horizontal\"\n const composite = state.context.composite\n const indicator = state.context.indicatorState\n\n function getTriggerState(props: TriggerProps): TriggerState {\n return {\n selected: state.context.value === props.value,\n focused: state.context.focusedValue === props.value,\n disabled: !!props.disabled,\n }\n }\n\n return {\n value: state.context.value,\n focusedValue: state.context.focusedValue,\n setValue(value) {\n send({ type: \"SET_VALUE\", value })\n },\n clearValue() {\n send({ type: \"CLEAR_VALUE\" })\n },\n setIndicatorRect(value) {\n const id = dom.getTriggerId(state.context, value)\n send({ type: \"SET_INDICATOR_RECT\", id })\n },\n syncTabIndex() {\n send(\"SYNC_TAB_INDEX\")\n },\n selectNext(fromValue) {\n send({ type: \"TAB_FOCUS\", value: fromValue, src: \"selectNext\" })\n send({ type: \"ARROW_NEXT\", src: \"selectNext\" })\n },\n selectPrev(fromValue) {\n send({ type: \"TAB_FOCUS\", value: fromValue, src: \"selectPrev\" })\n send({ type: \"ARROW_PREV\", src: \"selectPrev\" })\n },\n focus() {\n dom.getSelectedTriggerEl(state.context)?.focus()\n },\n getTriggerState,\n\n rootProps: normalize.element({\n ...parts.root.attrs,\n id: dom.getRootId(state.context),\n \"data-orientation\": state.context.orientation,\n \"data-focus\": dataAttr(focused),\n dir: state.context.dir,\n }),\n\n listProps: normalize.element({\n ...parts.list.attrs,\n id: dom.getListId(state.context),\n role: \"tablist\",\n dir: state.context.dir,\n \"data-focus\": dataAttr(focused),\n \"aria-orientation\": state.context.orientation,\n \"data-orientation\": state.context.orientation,\n \"aria-label\": translations?.listLabel,\n onKeyDown(event) {\n if (event.defaultPrevented) return\n const evt = getNativeEvent(event)\n\n if (!isSelfTarget(evt)) return\n if (evt.isComposing) return\n\n const keyMap: EventKeyMap = {\n ArrowDown() {\n if (isHorizontal) return\n send({ type: \"ARROW_NEXT\", key: \"ArrowDown\" })\n },\n ArrowUp() {\n if (isHorizontal) return\n send({ type: \"ARROW_PREV\", key: \"ArrowUp\" })\n },\n ArrowLeft() {\n if (isVertical) return\n send({ type: \"ARROW_PREV\", key: \"ArrowLeft\" })\n },\n ArrowRight() {\n if (isVertical) return\n send({ type: \"ARROW_NEXT\", key: \"ArrowRight\" })\n },\n Home() {\n send(\"HOME\")\n },\n End() {\n send(\"END\")\n },\n Enter() {\n send({ type: \"ENTER\" })\n },\n }\n\n let key = getEventKey(event, state.context)\n const exec = keyMap[key]\n\n if (exec) {\n event.preventDefault()\n exec(event)\n }\n },\n }),\n\n getTriggerProps(props) {\n const { value, disabled } = props\n const triggerState = getTriggerState(props)\n\n return normalize.button({\n ...parts.trigger.attrs,\n role: \"tab\",\n type: \"button\",\n disabled,\n dir: state.context.dir,\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(disabled),\n \"aria-disabled\": disabled,\n \"data-value\": value,\n \"aria-selected\": triggerState.selected,\n \"data-selected\": dataAttr(triggerState.selected),\n \"data-focus\": dataAttr(triggerState.focused),\n \"aria-controls\": triggerState.selected ? dom.getContentId(state.context, value) : undefined,\n \"data-ownedby\": dom.getListId(state.context),\n id: dom.getTriggerId(state.context, value),\n tabIndex: triggerState.selected && composite ? 0 : -1,\n onFocus() {\n send({ type: \"TAB_FOCUS\", value })\n },\n onBlur(event) {\n const target = event.relatedTarget as HTMLElement \| null\n if (target?.getAttribute(\"role\") !== \"tab\") {\n send({ type: \"TAB_BLUR\" })\n }\n },\n onClick(event) {\n if (event.defaultPrevented) return\n if (disabled) return\n if (isSafari()) {\n event.currentTarget.focus()\n }\n send({ type: \"TAB_CLICK\", value })\n },\n })\n },\n\n getContentProps(props) {\n const { value } = props\n const selected = state.context.value === value\n return normalize.element({\n ...parts.content.attrs,\n dir: state.context.dir,\n id: dom.getContentId(state.context, value),\n tabIndex: composite ? 0 : -1,\n \"aria-labelledby\": dom.getTriggerId(state.context, value),\n role: \"tabpanel\",\n \"data-ownedby\": dom.getListId(state.context),\n \"data-selected\": dataAttr(selected),\n \"data-orientation\": state.context.orientation,\n hidden: !selected,\n })\n },\n\n indicatorProps: normalize.element({\n id: dom.getIndicatorId(state.context),\n ...parts.indicator.attrs,\n dir: state.context.dir,\n \"data-orientation\": state.context.orientation,\n style: {\n \"--transition-property\": \"left, right, top, bottom, width, height\",\n \"--left\": indicator.rect?.left,\n \"--top\": indicator.rect?.top,\n \"--width\": indicator.rect?.width,\n \"--height\": indicator.rect?.height,\n position: \"absolute\",\n willChange: \"var(--transition-property)\",\n transitionProperty: \"var(--transition-property)\",\n transitionDuration: indicator.transition ? \"var(--transition-duration, 150ms)\" : \"0ms\",\n transitionTimingFunction: \"var(--transition-timing-function)\",\n [isHorizontal ? \"left\" : \"top\"]: isHorizontal ? \"var(--left)\" : \"var(--top)\",\n },\n }),\n }\n}\n","import { createScope, itemById, nextById, prevById, queryAll } from \"@zag-js/dom-query\"\nimport { first, last } from \"@zag-js/utils\"\nimport type { MachineContext as Ctx } from \"./tabs.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `tabs:${ctx.id}`,\n getListId: (ctx: Ctx) => ctx.ids?.list ?? `tabs:${ctx.id}:list`,\n getContentId: (ctx: Ctx, id: string) => ctx.ids?.content ?? `tabs:${ctx.id}:content-${id}`,\n getTriggerId: (ctx: Ctx, id: string) => ctx.ids?.trigger ?? `tabs:${ctx.id}:trigger-${id}`,\n getIndicatorId: (ctx: Ctx) => ctx.ids?.indicator ?? `tabs:${ctx.id}:indicator`,\n\n getListEl: (ctx: Ctx) => dom.getById(ctx, dom.getListId(ctx)),\n getContentEl: (ctx: Ctx, id: string) => dom.getById(ctx, dom.getContentId(ctx, id)),\n getTriggerEl: (ctx: Ctx, id: string) => dom.getById(ctx, dom.getTriggerId(ctx, id)),\n getIndicatorEl: (ctx: Ctx) => dom.getById(ctx, dom.getIndicatorId(ctx)),\n\n getElements: (ctx: Ctx) => {\n const ownerId = CSS.escape(dom.getListId(ctx))\n const selector = `[role=tab][data-ownedby='${ownerId}']:not([disabled])`\n return queryAll(dom.getListEl(ctx), selector)\n },\n\n getFirstTriggerEl: (ctx: Ctx) => first(dom.getElements(ctx)),\n getLastTriggerEl: (ctx: Ctx) => last(dom.getElements(ctx)),\n getNextTriggerEl: (ctx: Ctx, id: string) => nextById(dom.getElements(ctx), dom.getTriggerId(ctx, id), ctx.loopFocus),\n getPrevTriggerEl: (ctx: Ctx, id: string) => prevById(dom.getElements(ctx), dom.getTriggerId(ctx, id), ctx.loopFocus),\n getSelectedContentEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getContentEl(ctx, ctx.value)\n },\n getSelectedTriggerEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getTriggerEl(ctx, ctx.value)\n },\n\n getOffsetRect: (el: HTMLElement \| undefined) => {\n return {\n left: el?.offsetLeft ?? 0,\n top: el?.offsetTop ?? 0,\n width: el?.offsetWidth ?? 0,\n height: el?.offsetHeight ?? 0,\n }\n },\n\n getRectById: (ctx: Ctx, id: string) => {\n const tab = itemById(dom.getElements(ctx), dom.getTriggerId(ctx, id))\n return dom.resolveRect(dom.getOffsetRect(tab))\n },\n\n resolveRect: (rect: Record<\"width\" \| \"height\" \| \"left\" \| \"top\", number>) => ({\n width: `${rect.width}px`,\n height: `${rect.height}px`,\n left: `${rect.left}px`,\n top: `${rect.top}px`,\n }),\n})\n","import { createMachine, guards } from \"@zag-js/core\"\nimport { clickIfLink } from \"@zag-js/dom-event\"\nimport { nextTick, raf, getFocusables } from \"@zag-js/dom-query\"\nimport { trackElementRect } from \"@zag-js/element-rect\"\nimport { compact, isEqual } from \"@zag-js/utils\"\nimport { dom } from \"./tabs.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./tabs.types\"\n\nconst { not } = guards\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n initial: \"idle\",\n\n context: {\n dir: \"ltr\",\n orientation: \"horizontal\",\n activationMode: \"automatic\",\n value: null,\n loopFocus: true,\n composite: true,\n ...ctx,\n focusedValue: ctx.value ?? null,\n indicatorState: {\n rendered: false,\n transition: false,\n rect: { left: \"0px\", top: \"0px\", width: \"0px\", height: \"0px\" },\n },\n },\n\n watch: {\n value: [\"allowIndicatorTransition\", \"syncIndicatorRect\", \"syncTabIndex\", \"clickIfLink\"],\n dir: [\"syncIndicatorRect\"],\n orientation: [\"syncIndicatorRect\"],\n },\n\n on: {\n SET_VALUE: {\n actions: \"setValue\",\n },\n CLEAR_VALUE: {\n actions: \"clearValue\",\n },\n SET_INDICATOR_RECT: {\n actions: \"setIndicatorRect\",\n },\n SYNC_TAB_INDEX: {\n actions: \"syncTabIndex\",\n },\n },\n\n created: [\"syncFocusedValue\"],\n entry: [\"checkRenderedElements\", \"syncIndicatorRect\", \"syncTabIndex\"],\n exit: [\"cleanupObserver\"],\n\n states: {\n idle: {\n on: {\n TAB_FOCUS: {\n target: \"focused\",\n actions: \"setFocusedValue\",\n },\n TAB_CLICK: {\n target: \"focused\",\n actions: [\"setFocusedValue\", \"setValue\"],\n },\n },\n },\n focused: {\n on: {\n TAB_CLICK: {\n target: \"focused\",\n actions: [\"setFocusedValue\", \"setValue\"],\n },\n ARROW_PREV: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusPrevTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusPrevTab\",\n },\n ],\n ARROW_NEXT: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusNextTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusNextTab\",\n },\n ],\n HOME: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusFirstTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusFirstTab\",\n },\n ],\n END: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusLastTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusLastTab\",\n },\n ],\n ENTER: {\n guard: not(\"selectOnFocus\"),\n actions: \"selectFocusedTab\",\n },\n TAB_FOCUS: {\n actions: [\"setFocusedValue\"],\n },\n TAB_BLUR: {\n target: \"idle\",\n actions: \"clearFocusedValue\",\n },\n },\n },\n },\n },\n {\n guards: {\n selectOnFocus: (ctx) => ctx.activationMode === \"automatic\",\n },\n\n actions: {\n syncFocusedValue(ctx) {\n if (ctx.value != null && ctx.focusedValue == null) {\n ctx.focusedValue = ctx.value\n }\n },\n selectFocusedTab(ctx) {\n raf(() => {\n set.value(ctx, ctx.focusedValue)\n })\n },\n setFocusedValue(ctx, evt) {\n if (evt.value == null) return\n set.focusedValue(ctx, evt.value)\n },\n clearFocusedValue(ctx) {\n set.focusedValue(ctx, null)\n },\n setValue(ctx, evt) {\n set.value(ctx, evt.value)\n },\n clearValue(ctx) {\n set.value(ctx, null)\n },\n focusFirstTab(ctx) {\n raf(() => {\n dom.getFirstTriggerEl(ctx)?.focus()\n })\n },\n focusLastTab(ctx) {\n raf(() => {\n dom.getLastTriggerEl(ctx)?.focus()\n })\n },\n focusNextTab(ctx) {\n if (!ctx.focusedValue) return\n const triggerEl = dom.getNextTriggerEl(ctx, ctx.focusedValue)\n raf(() => {\n if (ctx.composite) {\n triggerEl?.focus()\n } else if (triggerEl?.dataset.value != null) {\n set.focusedValue(ctx, triggerEl.dataset.value)\n }\n })\n },\n focusPrevTab(ctx) {\n if (!ctx.focusedValue) return\n const triggerEl = dom.getPrevTriggerEl(ctx, ctx.focusedValue)\n raf(() => {\n if (ctx.composite) {\n triggerEl?.focus()\n } else if (triggerEl?.dataset.value != null) {\n set.focusedValue(ctx, triggerEl.dataset.value)\n }\n })\n },\n checkRenderedElements(ctx) {\n ctx.indicatorState.rendered = !!dom.getIndicatorEl(ctx)\n },\n syncTabIndex(ctx) {\n raf(() => {\n const contentEl = dom.getSelectedContentEl(ctx)\n if (!contentEl) return\n const focusables = getFocusables(contentEl)\n if (focusables.length > 0) {\n contentEl.removeAttribute(\"tabindex\")\n } else {\n contentEl.setAttribute(\"tabindex\", \"0\")\n }\n })\n },\n cleanupObserver(ctx) {\n ctx.indicatorCleanup?.()\n },\n allowIndicatorTransition(ctx) {\n ctx.indicatorState.transition = true\n },\n setIndicatorRect(ctx, evt) {\n const value = evt.id ?? ctx.value\n if (!ctx.indicatorState.rendered \|\| !value) return\n\n const triggerEl = dom.getTriggerEl(ctx, value)\n if (!triggerEl) return\n\n ctx.indicatorState.rect = dom.getRectById(ctx, value)\n nextTick(() => {\n ctx.indicatorState.transition = false\n })\n },\n syncIndicatorRect(ctx) {\n ctx.indicatorCleanup?.()\n\n const value = ctx.value\n if (!ctx.indicatorState.rendered \|\| !value) return\n\n const triggerEl = dom.getSelectedTriggerEl(ctx)\n if (!triggerEl) return\n\n ctx.indicatorCleanup = trackElementRect(triggerEl, {\n getRect(el) {\n return dom.getOffsetRect(el)\n },\n onChange(rect) {\n ctx.indicatorState.rect = dom.resolveRect(rect)\n nextTick(() => {\n ctx.indicatorState.transition = false\n })\n },\n })\n },\n clickIfLink(ctx) {\n clickIfLink(dom.getSelectedTriggerEl(ctx))\n },\n },\n },\n )\n}\n\nconst invoke = {\n change: (ctx: MachineContext) => {\n if (ctx.value == null) return\n ctx.onValueChange?.({ value: ctx.value })\n },\n focusChange: (ctx: MachineContext) => {\n if (ctx.focusedValue == null) return\n ctx.onFocusChange?.({ focusedValue: ctx.focusedValue })\n },\n}\n\nconst set = {\n value: (ctx: MachineContext, value: string \| null) => {\n if (isEqual(value, ctx.value)) return\n ctx.value = value\n invoke.change(ctx)\n },\n focusedValue: (ctx: MachineContext, value: string \| null) => {\n if (isEqual(value, ctx.focusedValue)) return\n ctx.focusedValue = value\n invoke.focusChange(ctx)\n },\n}\n","import { createProps } from \"@zag-js/types\"\nimport { createSplitProps } from \"@zag-js/utils\"\nimport type { ContentProps, TriggerProps, UserDefinedContext } from \"./tabs.types\"\n\nexport const props = createProps<UserDefinedContext>()([\n \"activationMode\",\n \"composite\",\n \"dir\",\n \"getRootNode\",\n \"id\",\n \"ids\",\n \"loopFocus\",\n \"onFocusChange\",\n \"onValueChange\",\n \"orientation\",\n \"translations\",\n \"value\",\n])\n\nexport const splitProps = createSplitProps<Partial<UserDefinedContext>>(props)\n\nexport const triggerProps = createProps<TriggerProps>()([\"disabled\", \"value\"])\nexport const splitTriggerProps = createSplitProps<TriggerProps>(triggerProps)\n\nexport const contentProps = createProps<ContentProps>()([\"value\"])\nexport const splitContentProps = createSplitProps<ContentProps>(contentProps)\n"],"mappings":"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","names":["props","ctx"]}
1	+ {"version":3,"sources":["../src/tabs.anatomy.ts","../src/tabs.connect.ts","../src/tabs.dom.ts","../src/tabs.machine.ts","../src/tabs.props.ts"],"sourcesContent":["import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"tabs\").parts(\"root\", \"list\", \"trigger\", \"content\", \"indicator\")\nexport const parts = anatomy.build()\n","import { getEventKey, type EventKeyMap } from \"@zag-js/dom-event\"\nimport { dataAttr, isComposingEvent, isSafari, isSelfTarget } from \"@zag-js/dom-query\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { parts } from \"./tabs.anatomy\"\nimport { dom } from \"./tabs.dom\"\nimport type { MachineApi, Send, State, TriggerProps, TriggerState } from \"./tabs.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): MachineApi<T> {\n const translations = state.context.translations\n const focused = state.matches(\"focused\")\n\n const isVertical = state.context.orientation === \"vertical\"\n const isHorizontal = state.context.orientation === \"horizontal\"\n const composite = state.context.composite\n const indicator = state.context.indicatorState\n\n function getTriggerState(props: TriggerProps): TriggerState {\n return {\n selected: state.context.value === props.value,\n focused: state.context.focusedValue === props.value,\n disabled: !!props.disabled,\n }\n }\n\n return {\n value: state.context.value,\n focusedValue: state.context.focusedValue,\n setValue(value) {\n send({ type: \"SET_VALUE\", value })\n },\n clearValue() {\n send({ type: \"CLEAR_VALUE\" })\n },\n setIndicatorRect(value) {\n const id = dom.getTriggerId(state.context, value)\n send({ type: \"SET_INDICATOR_RECT\", id })\n },\n syncTabIndex() {\n send(\"SYNC_TAB_INDEX\")\n },\n selectNext(fromValue) {\n send({ type: \"TAB_FOCUS\", value: fromValue, src: \"selectNext\" })\n send({ type: \"ARROW_NEXT\", src: \"selectNext\" })\n },\n selectPrev(fromValue) {\n send({ type: \"TAB_FOCUS\", value: fromValue, src: \"selectPrev\" })\n send({ type: \"ARROW_PREV\", src: \"selectPrev\" })\n },\n focus() {\n dom.getSelectedTriggerEl(state.context)?.focus()\n },\n getTriggerState,\n\n rootProps: normalize.element({\n ...parts.root.attrs,\n id: dom.getRootId(state.context),\n \"data-orientation\": state.context.orientation,\n \"data-focus\": dataAttr(focused),\n dir: state.context.dir,\n }),\n\n listProps: normalize.element({\n ...parts.list.attrs,\n id: dom.getListId(state.context),\n role: \"tablist\",\n dir: state.context.dir,\n \"data-focus\": dataAttr(focused),\n \"aria-orientation\": state.context.orientation,\n \"data-orientation\": state.context.orientation,\n \"aria-label\": translations?.listLabel,\n onKeyDown(event) {\n if (event.defaultPrevented) return\n\n if (!isSelfTarget(event)) return\n if (isComposingEvent(event)) return\n\n const keyMap: EventKeyMap = {\n ArrowDown() {\n if (isHorizontal) return\n send({ type: \"ARROW_NEXT\", key: \"ArrowDown\" })\n },\n ArrowUp() {\n if (isHorizontal) return\n send({ type: \"ARROW_PREV\", key: \"ArrowUp\" })\n },\n ArrowLeft() {\n if (isVertical) return\n send({ type: \"ARROW_PREV\", key: \"ArrowLeft\" })\n },\n ArrowRight() {\n if (isVertical) return\n send({ type: \"ARROW_NEXT\", key: \"ArrowRight\" })\n },\n Home() {\n send(\"HOME\")\n },\n End() {\n send(\"END\")\n },\n Enter() {\n send({ type: \"ENTER\" })\n },\n }\n\n let key = getEventKey(event, state.context)\n const exec = keyMap[key]\n\n if (exec) {\n event.preventDefault()\n exec(event)\n }\n },\n }),\n\n getTriggerProps(props) {\n const { value, disabled } = props\n const triggerState = getTriggerState(props)\n\n return normalize.button({\n ...parts.trigger.attrs,\n role: \"tab\",\n type: \"button\",\n disabled,\n dir: state.context.dir,\n \"data-orientation\": state.context.orientation,\n \"data-disabled\": dataAttr(disabled),\n \"aria-disabled\": disabled,\n \"data-value\": value,\n \"aria-selected\": triggerState.selected,\n \"data-selected\": dataAttr(triggerState.selected),\n \"data-focus\": dataAttr(triggerState.focused),\n \"aria-controls\": triggerState.selected ? dom.getContentId(state.context, value) : undefined,\n \"data-ownedby\": dom.getListId(state.context),\n id: dom.getTriggerId(state.context, value),\n tabIndex: triggerState.selected && composite ? 0 : -1,\n onFocus() {\n send({ type: \"TAB_FOCUS\", value })\n },\n onBlur(event) {\n const target = event.relatedTarget as HTMLElement \| null\n if (target?.getAttribute(\"role\") !== \"tab\") {\n send({ type: \"TAB_BLUR\" })\n }\n },\n onClick(event) {\n if (event.defaultPrevented) return\n if (disabled) return\n if (isSafari()) {\n event.currentTarget.focus()\n }\n send({ type: \"TAB_CLICK\", value })\n },\n })\n },\n\n getContentProps(props) {\n const { value } = props\n const selected = state.context.value === value\n return normalize.element({\n ...parts.content.attrs,\n dir: state.context.dir,\n id: dom.getContentId(state.context, value),\n tabIndex: composite ? 0 : -1,\n \"aria-labelledby\": dom.getTriggerId(state.context, value),\n role: \"tabpanel\",\n \"data-ownedby\": dom.getListId(state.context),\n \"data-selected\": dataAttr(selected),\n \"data-orientation\": state.context.orientation,\n hidden: !selected,\n })\n },\n\n indicatorProps: normalize.element({\n id: dom.getIndicatorId(state.context),\n ...parts.indicator.attrs,\n dir: state.context.dir,\n \"data-orientation\": state.context.orientation,\n style: {\n \"--transition-property\": \"left, right, top, bottom, width, height\",\n \"--left\": indicator.rect?.left,\n \"--top\": indicator.rect?.top,\n \"--width\": indicator.rect?.width,\n \"--height\": indicator.rect?.height,\n position: \"absolute\",\n willChange: \"var(--transition-property)\",\n transitionProperty: \"var(--transition-property)\",\n transitionDuration: indicator.transition ? \"var(--transition-duration, 150ms)\" : \"0ms\",\n transitionTimingFunction: \"var(--transition-timing-function)\",\n [isHorizontal ? \"left\" : \"top\"]: isHorizontal ? \"var(--left)\" : \"var(--top)\",\n },\n }),\n }\n}\n","import { createScope, itemById, nextById, prevById, queryAll } from \"@zag-js/dom-query\"\nimport { first, last } from \"@zag-js/utils\"\nimport type { MachineContext as Ctx } from \"./tabs.types\"\n\nexport const dom = createScope({\n getRootId: (ctx: Ctx) => ctx.ids?.root ?? `tabs:${ctx.id}`,\n getListId: (ctx: Ctx) => ctx.ids?.list ?? `tabs:${ctx.id}:list`,\n getContentId: (ctx: Ctx, id: string) => ctx.ids?.content ?? `tabs:${ctx.id}:content-${id}`,\n getTriggerId: (ctx: Ctx, id: string) => ctx.ids?.trigger ?? `tabs:${ctx.id}:trigger-${id}`,\n getIndicatorId: (ctx: Ctx) => ctx.ids?.indicator ?? `tabs:${ctx.id}:indicator`,\n\n getListEl: (ctx: Ctx) => dom.getById(ctx, dom.getListId(ctx)),\n getContentEl: (ctx: Ctx, id: string) => dom.getById(ctx, dom.getContentId(ctx, id)),\n getTriggerEl: (ctx: Ctx, id: string) => dom.getById(ctx, dom.getTriggerId(ctx, id)),\n getIndicatorEl: (ctx: Ctx) => dom.getById(ctx, dom.getIndicatorId(ctx)),\n\n getElements: (ctx: Ctx) => {\n const ownerId = CSS.escape(dom.getListId(ctx))\n const selector = `[role=tab][data-ownedby='${ownerId}']:not([disabled])`\n return queryAll(dom.getListEl(ctx), selector)\n },\n\n getFirstTriggerEl: (ctx: Ctx) => first(dom.getElements(ctx)),\n getLastTriggerEl: (ctx: Ctx) => last(dom.getElements(ctx)),\n getNextTriggerEl: (ctx: Ctx, id: string) => nextById(dom.getElements(ctx), dom.getTriggerId(ctx, id), ctx.loopFocus),\n getPrevTriggerEl: (ctx: Ctx, id: string) => prevById(dom.getElements(ctx), dom.getTriggerId(ctx, id), ctx.loopFocus),\n getSelectedContentEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getContentEl(ctx, ctx.value)\n },\n getSelectedTriggerEl: (ctx: Ctx) => {\n if (!ctx.value) return\n return dom.getTriggerEl(ctx, ctx.value)\n },\n\n getOffsetRect: (el: HTMLElement \| undefined) => {\n return {\n left: el?.offsetLeft ?? 0,\n top: el?.offsetTop ?? 0,\n width: el?.offsetWidth ?? 0,\n height: el?.offsetHeight ?? 0,\n }\n },\n\n getRectById: (ctx: Ctx, id: string) => {\n const tab = itemById(dom.getElements(ctx), dom.getTriggerId(ctx, id))\n return dom.resolveRect(dom.getOffsetRect(tab))\n },\n\n resolveRect: (rect: Record<\"width\" \| \"height\" \| \"left\" \| \"top\", number>) => ({\n width: `${rect.width}px`,\n height: `${rect.height}px`,\n left: `${rect.left}px`,\n top: `${rect.top}px`,\n }),\n})\n","import { createMachine, guards } from \"@zag-js/core\"\nimport { clickIfLink } from \"@zag-js/dom-event\"\nimport { nextTick, raf, getFocusables } from \"@zag-js/dom-query\"\nimport { trackElementRect } from \"@zag-js/element-rect\"\nimport { compact, isEqual } from \"@zag-js/utils\"\nimport { dom } from \"./tabs.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./tabs.types\"\n\nconst { not } = guards\n\nexport function machine(userContext: UserDefinedContext) {\n const ctx = compact(userContext)\n return createMachine<MachineContext, MachineState>(\n {\n initial: \"idle\",\n\n context: {\n dir: \"ltr\",\n orientation: \"horizontal\",\n activationMode: \"automatic\",\n value: null,\n loopFocus: true,\n composite: true,\n ...ctx,\n focusedValue: ctx.value ?? null,\n indicatorState: {\n rendered: false,\n transition: false,\n rect: { left: \"0px\", top: \"0px\", width: \"0px\", height: \"0px\" },\n },\n },\n\n watch: {\n value: [\"allowIndicatorTransition\", \"syncIndicatorRect\", \"syncTabIndex\", \"clickIfLink\"],\n dir: [\"syncIndicatorRect\"],\n orientation: [\"syncIndicatorRect\"],\n },\n\n on: {\n SET_VALUE: {\n actions: \"setValue\",\n },\n CLEAR_VALUE: {\n actions: \"clearValue\",\n },\n SET_INDICATOR_RECT: {\n actions: \"setIndicatorRect\",\n },\n SYNC_TAB_INDEX: {\n actions: \"syncTabIndex\",\n },\n },\n\n created: [\"syncFocusedValue\"],\n entry: [\"checkRenderedElements\", \"syncIndicatorRect\", \"syncTabIndex\"],\n exit: [\"cleanupObserver\"],\n\n states: {\n idle: {\n on: {\n TAB_FOCUS: {\n target: \"focused\",\n actions: \"setFocusedValue\",\n },\n TAB_CLICK: {\n target: \"focused\",\n actions: [\"setFocusedValue\", \"setValue\"],\n },\n },\n },\n focused: {\n on: {\n TAB_CLICK: {\n target: \"focused\",\n actions: [\"setFocusedValue\", \"setValue\"],\n },\n ARROW_PREV: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusPrevTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusPrevTab\",\n },\n ],\n ARROW_NEXT: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusNextTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusNextTab\",\n },\n ],\n HOME: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusFirstTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusFirstTab\",\n },\n ],\n END: [\n {\n guard: \"selectOnFocus\",\n actions: [\"focusLastTab\", \"selectFocusedTab\"],\n },\n {\n actions: \"focusLastTab\",\n },\n ],\n ENTER: {\n guard: not(\"selectOnFocus\"),\n actions: \"selectFocusedTab\",\n },\n TAB_FOCUS: {\n actions: [\"setFocusedValue\"],\n },\n TAB_BLUR: {\n target: \"idle\",\n actions: \"clearFocusedValue\",\n },\n },\n },\n },\n },\n {\n guards: {\n selectOnFocus: (ctx) => ctx.activationMode === \"automatic\",\n },\n\n actions: {\n syncFocusedValue(ctx) {\n if (ctx.value != null && ctx.focusedValue == null) {\n ctx.focusedValue = ctx.value\n }\n },\n selectFocusedTab(ctx) {\n raf(() => {\n set.value(ctx, ctx.focusedValue)\n })\n },\n setFocusedValue(ctx, evt) {\n if (evt.value == null) return\n set.focusedValue(ctx, evt.value)\n },\n clearFocusedValue(ctx) {\n set.focusedValue(ctx, null)\n },\n setValue(ctx, evt) {\n set.value(ctx, evt.value)\n },\n clearValue(ctx) {\n set.value(ctx, null)\n },\n focusFirstTab(ctx) {\n raf(() => {\n dom.getFirstTriggerEl(ctx)?.focus()\n })\n },\n focusLastTab(ctx) {\n raf(() => {\n dom.getLastTriggerEl(ctx)?.focus()\n })\n },\n focusNextTab(ctx) {\n if (!ctx.focusedValue) return\n const triggerEl = dom.getNextTriggerEl(ctx, ctx.focusedValue)\n raf(() => {\n if (ctx.composite) {\n triggerEl?.focus()\n } else if (triggerEl?.dataset.value != null) {\n set.focusedValue(ctx, triggerEl.dataset.value)\n }\n })\n },\n focusPrevTab(ctx) {\n if (!ctx.focusedValue) return\n const triggerEl = dom.getPrevTriggerEl(ctx, ctx.focusedValue)\n raf(() => {\n if (ctx.composite) {\n triggerEl?.focus()\n } else if (triggerEl?.dataset.value != null) {\n set.focusedValue(ctx, triggerEl.dataset.value)\n }\n })\n },\n checkRenderedElements(ctx) {\n ctx.indicatorState.rendered = !!dom.getIndicatorEl(ctx)\n },\n syncTabIndex(ctx) {\n raf(() => {\n const contentEl = dom.getSelectedContentEl(ctx)\n if (!contentEl) return\n const focusables = getFocusables(contentEl)\n if (focusables.length > 0) {\n contentEl.removeAttribute(\"tabindex\")\n } else {\n contentEl.setAttribute(\"tabindex\", \"0\")\n }\n })\n },\n cleanupObserver(ctx) {\n ctx.indicatorCleanup?.()\n },\n allowIndicatorTransition(ctx) {\n ctx.indicatorState.transition = true\n },\n setIndicatorRect(ctx, evt) {\n const value = evt.id ?? ctx.value\n if (!ctx.indicatorState.rendered \|\| !value) return\n\n const triggerEl = dom.getTriggerEl(ctx, value)\n if (!triggerEl) return\n\n ctx.indicatorState.rect = dom.getRectById(ctx, value)\n nextTick(() => {\n ctx.indicatorState.transition = false\n })\n },\n syncIndicatorRect(ctx) {\n ctx.indicatorCleanup?.()\n\n const value = ctx.value\n if (!ctx.indicatorState.rendered \|\| !value) return\n\n const triggerEl = dom.getSelectedTriggerEl(ctx)\n if (!triggerEl) return\n\n ctx.indicatorCleanup = trackElementRect(triggerEl, {\n getRect(el) {\n return dom.getOffsetRect(el)\n },\n onChange(rect) {\n ctx.indicatorState.rect = dom.resolveRect(rect)\n nextTick(() => {\n ctx.indicatorState.transition = false\n })\n },\n })\n },\n clickIfLink(ctx) {\n clickIfLink(dom.getSelectedTriggerEl(ctx))\n },\n },\n },\n )\n}\n\nconst invoke = {\n change: (ctx: MachineContext) => {\n if (ctx.value == null) return\n ctx.onValueChange?.({ value: ctx.value })\n },\n focusChange: (ctx: MachineContext) => {\n if (ctx.focusedValue == null) return\n ctx.onFocusChange?.({ focusedValue: ctx.focusedValue })\n },\n}\n\nconst set = {\n value: (ctx: MachineContext, value: string \| null) => {\n if (isEqual(value, ctx.value)) return\n ctx.value = value\n invoke.change(ctx)\n },\n focusedValue: (ctx: MachineContext, value: string \| null) => {\n if (isEqual(value, ctx.focusedValue)) return\n ctx.focusedValue = value\n invoke.focusChange(ctx)\n },\n}\n","import { createProps } from \"@zag-js/types\"\nimport { createSplitProps } from \"@zag-js/utils\"\nimport type { ContentProps, TriggerProps, UserDefinedContext } from \"./tabs.types\"\n\nexport const props = createProps<UserDefinedContext>()([\n \"activationMode\",\n \"composite\",\n \"dir\",\n \"getRootNode\",\n \"id\",\n \"ids\",\n \"loopFocus\",\n \"onFocusChange\",\n \"onValueChange\",\n \"orientation\",\n \"translations\",\n \"value\",\n])\n\nexport const splitProps = createSplitProps<Partial<UserDefinedContext>>(props)\n\nexport const triggerProps = createProps<TriggerProps>()([\"disabled\", \"value\"])\nexport const splitTriggerProps = createSplitProps<TriggerProps>(triggerProps)\n\nexport const contentProps = createProps<ContentProps>()([\"value\"])\nexport const splitContentProps = createSplitProps<ContentProps>(contentProps)\n"],"mappings":"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","names":["props","ctx"]}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/tabs",
-  "version": "0.51.1",
+  "version": "0.52.0",
   "description": "Core logic for the tabs widget implemented as a state machine",
   "keywords": [
     "js",
@@ -27,13 +27,13 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/anatomy": "0.51.1",
-    "@zag-js/dom-query": "0.51.1",
-    "@zag-js/dom-event": "0.51.1",
-    "@zag-js/element-rect": "0.51.1",
-    "@zag-js/utils": "0.51.1",
-    "@zag-js/core": "0.51.1",
-    "@zag-js/types": "0.51.1"
+    "@zag-js/anatomy": "0.52.0",
+    "@zag-js/dom-query": "0.52.0",
+    "@zag-js/dom-event": "0.52.0",
+    "@zag-js/element-rect": "0.52.0",
+    "@zag-js/utils": "0.52.0",
+    "@zag-js/core": "0.52.0",
+    "@zag-js/types": "0.52.0"
   },
   "devDependencies": {
     "clean-package": "2.2.0"

package/src/tabs.connect.ts CHANGED Viewed

@@ -1,5 +1,5 @@
-import { getEventKey, getNativeEvent, type EventKeyMap } from "@zag-js/dom-event"
-import { dataAttr, isSafari, isSelfTarget } from "@zag-js/dom-query"
+import { getEventKey, type EventKeyMap } from "@zag-js/dom-event"
+import { dataAttr, isComposingEvent, isSafari, isSelfTarget } from "@zag-js/dom-query"
 import type { NormalizeProps, PropTypes } from "@zag-js/types"
 import { parts } from "./tabs.anatomy"
 import { dom } from "./tabs.dom"
@@ -70,10 +70,9 @@ export function connect<T extends PropTypes>(state: State, send: Send, normalize
       "aria-label": translations?.listLabel,
       onKeyDown(event) {
         if (event.defaultPrevented) return
-        const evt = getNativeEvent(event)
-        if (!isSelfTarget(evt)) return
-        if (evt.isComposing) return
+        if (!isSelfTarget(event)) return
+        if (isComposingEvent(event)) return
         const keyMap: EventKeyMap = {
           ArrowDown() {