initial commit
This commit is contained in:
1 parent
6d8d5fcd6c
commit
8484a534db
3361 files changed
+493837
No files matched your search
+70
@@ -0,0 +1,70 @@
|
||||
import React, { ElementType, Ref } from 'react';
|
||||
import { Props } from '../../types.js';
|
||||
import { PropsForFeatures, RefProp, HasDisplayName } from '../../utils/render.js';
|
||||
declare let DEFAULT_TABS_TAG: React.ExoticComponent<{
|
||||
children?: React.ReactNode;
|
||||
}>;
|
||||
interface TabsRenderPropArg {
|
||||
selectedIndex: number;
|
||||
}
|
||||
export type TabGroupProps<TTag extends ElementType> = Props<TTag, TabsRenderPropArg, never, {
|
||||
defaultIndex?: number;
|
||||
onChange?: (index: number) => void;
|
||||
selectedIndex?: number;
|
||||
vertical?: boolean;
|
||||
manual?: boolean;
|
||||
}>;
|
||||
declare function GroupFn<TTag extends ElementType = typeof DEFAULT_TABS_TAG>(props: TabGroupProps<TTag>, ref: Ref<HTMLElement>): JSX.Element;
|
||||
declare let DEFAULT_LIST_TAG: "div";
|
||||
interface ListRenderPropArg {
|
||||
selectedIndex: number;
|
||||
}
|
||||
type ListPropsWeControl = 'aria-orientation' | 'role';
|
||||
export type TabListProps<TTag extends ElementType> = Props<TTag, ListRenderPropArg, ListPropsWeControl, {}>;
|
||||
declare function ListFn<TTag extends ElementType = typeof DEFAULT_LIST_TAG>(props: TabListProps<TTag>, ref: Ref<HTMLElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
||||
declare let DEFAULT_TAB_TAG: "button";
|
||||
interface TabRenderPropArg {
|
||||
selected: boolean;
|
||||
}
|
||||
type TabPropsWeControl = 'aria-controls' | 'aria-selected' | 'role' | 'tabIndex';
|
||||
export type TabProps<TTag extends ElementType> = Props<TTag, TabRenderPropArg, TabPropsWeControl> & {};
|
||||
declare function TabFn<TTag extends ElementType = typeof DEFAULT_TAB_TAG>(props: TabProps<TTag>, ref: Ref<HTMLElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
||||
declare let DEFAULT_PANELS_TAG: "div";
|
||||
interface PanelsRenderPropArg {
|
||||
selectedIndex: number;
|
||||
}
|
||||
export type TabPanelsProps<TTag extends ElementType> = Props<TTag, PanelsRenderPropArg>;
|
||||
declare function PanelsFn<TTag extends ElementType = typeof DEFAULT_PANELS_TAG>(props: TabPanelsProps<TTag>, ref: Ref<HTMLElement>): React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
||||
declare let DEFAULT_PANEL_TAG: "div";
|
||||
interface PanelRenderPropArg {
|
||||
selected: boolean;
|
||||
}
|
||||
type PanelPropsWeControl = 'role' | 'aria-labelledby';
|
||||
declare let PanelRenderFeatures: number;
|
||||
export type TabPanelProps<TTag extends ElementType> = Props<TTag, PanelRenderPropArg, PanelPropsWeControl, PropsForFeatures<typeof PanelRenderFeatures> & {
|
||||
id?: string;
|
||||
tabIndex?: number;
|
||||
}>;
|
||||
declare function PanelFn<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(props: TabPanelProps<TTag>, ref: Ref<HTMLElement>): JSX.Element | null;
|
||||
interface ComponentTab extends HasDisplayName {
|
||||
<TTag extends ElementType = typeof DEFAULT_TAB_TAG>(props: TabProps<TTag> & RefProp<typeof TabFn>): JSX.Element;
|
||||
}
|
||||
interface ComponentTabGroup extends HasDisplayName {
|
||||
<TTag extends ElementType = typeof DEFAULT_TABS_TAG>(props: TabGroupProps<TTag> & RefProp<typeof GroupFn>): JSX.Element;
|
||||
}
|
||||
interface ComponentTabList extends HasDisplayName {
|
||||
<TTag extends ElementType = typeof DEFAULT_LIST_TAG>(props: TabListProps<TTag> & RefProp<typeof ListFn>): JSX.Element;
|
||||
}
|
||||
interface ComponentTabPanels extends HasDisplayName {
|
||||
<TTag extends ElementType = typeof DEFAULT_PANELS_TAG>(props: TabPanelsProps<TTag> & RefProp<typeof PanelsFn>): JSX.Element;
|
||||
}
|
||||
interface ComponentTabPanel extends HasDisplayName {
|
||||
<TTag extends ElementType = typeof DEFAULT_PANEL_TAG>(props: TabPanelProps<TTag> & RefProp<typeof PanelFn>): JSX.Element;
|
||||
}
|
||||
export declare let Tab: ComponentTab & {
|
||||
Group: ComponentTabGroup;
|
||||
List: ComponentTabList;
|
||||
Panels: ComponentTabPanels;
|
||||
Panel: ComponentTabPanel;
|
||||
};
|
||||
export {};
|
||||
+1
@@ -0,0 +1 @@
|
||||
import _,{Fragment as ne,createContext as V,useContext as Q,useMemo as F,useReducer as re,useRef as K}from"react";import{render as w,Features as Y,forwardRefWithAs as v}from'../../utils/render.js';import{useId as Z}from'../../hooks/use-id.js';import{match as G}from'../../utils/match.js';import{Keys as P}from'../../components/keyboard.js';import{focusIn as h,Focus as x,sortByDomNode as H,FocusResult as k}from'../../utils/focus-management.js';import{useIsoMorphicEffect as O}from'../../hooks/use-iso-morphic-effect.js';import{useSyncRefs as U}from'../../hooks/use-sync-refs.js';import{useResolveButtonType as ae}from'../../hooks/use-resolve-button-type.js';import{useLatestValue as J}from'../../hooks/use-latest-value.js';import{FocusSentinel as le}from'../../internal/focus-sentinel.js';import{useEvent as S}from'../../hooks/use-event.js';import{microTask as oe}from'../../utils/micro-task.js';import{Hidden as se}from'../../internal/hidden.js';import{getOwnerDocument as ie}from'../../utils/owner.js';import{StableCollection as pe,useStableCollectionIndex as ee}from'../../utils/stable-collection.js';var ue=(t=>(t[t.Forwards=0]="Forwards",t[t.Backwards=1]="Backwards",t))(ue||{}),Te=(o=>(o[o.Less=-1]="Less",o[o.Equal=0]="Equal",o[o.Greater=1]="Greater",o))(Te||{}),de=(r=>(r[r.SetSelectedIndex=0]="SetSelectedIndex",r[r.RegisterTab=1]="RegisterTab",r[r.UnregisterTab=2]="UnregisterTab",r[r.RegisterPanel=3]="RegisterPanel",r[r.UnregisterPanel=4]="UnregisterPanel",r))(de||{});let ce={[0](e,n){var u;let t=H(e.tabs,T=>T.current),o=H(e.panels,T=>T.current),s=t.filter(T=>{var l;return!((l=T.current)!=null&&l.hasAttribute("disabled"))}),r={...e,tabs:t,panels:o};if(n.index<0||n.index>t.length-1){let T=G(Math.sign(n.index-e.selectedIndex),{[-1]:()=>1,[0]:()=>G(Math.sign(n.index),{[-1]:()=>0,[0]:()=>0,[1]:()=>1}),[1]:()=>0});if(s.length===0)return r;let l=G(T,{[0]:()=>t.indexOf(s[0]),[1]:()=>t.indexOf(s[s.length-1])});return{...r,selectedIndex:l===-1?e.selectedIndex:l}}let i=t.slice(0,n.index),b=[...t.slice(n.index),...i].find(T=>s.includes(T));if(!b)return r;let c=(u=t.indexOf(b))!=null?u:e.selectedIndex;return c===-1&&(c=e.selectedIndex),{...r,selectedIndex:c}},[1](e,n){var r;if(e.tabs.includes(n.tab))return e;let t=e.tabs[e.selectedIndex],o=H([...e.tabs,n.tab],i=>i.current),s=(r=o.indexOf(t))!=null?r:e.selectedIndex;return s===-1&&(s=e.selectedIndex),{...e,tabs:o,selectedIndex:s}},[2](e,n){return{...e,tabs:e.tabs.filter(t=>t!==n.tab)}},[3](e,n){return e.panels.includes(n.panel)?e:{...e,panels:H([...e.panels,n.panel],t=>t.current)}},[4](e,n){return{...e,panels:e.panels.filter(t=>t!==n.panel)}}},X=V(null);X.displayName="TabsDataContext";function M(e){let n=Q(X);if(n===null){let t=new Error(`<${e} /> is missing a parent <Tab.Group /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(t,M),t}return n}let $=V(null);$.displayName="TabsActionsContext";function q(e){let n=Q($);if(n===null){let t=new Error(`<${e} /> is missing a parent <Tab.Group /> component.`);throw Error.captureStackTrace&&Error.captureStackTrace(t,q),t}return n}function fe(e,n){return G(n.type,ce,e,n)}let be=ne;function me(e,n){let{defaultIndex:t=0,vertical:o=!1,manual:s=!1,onChange:r,selectedIndex:i=null,...R}=e;const b=o?"vertical":"horizontal",c=s?"manual":"auto";let u=i!==null,T=U(n),[l,d]=re(fe,{selectedIndex:i!=null?i:t,tabs:[],panels:[]}),g=F(()=>({selectedIndex:l.selectedIndex}),[l.selectedIndex]),m=J(r||(()=>{})),y=J(l.tabs),E=F(()=>({orientation:b,activation:c,...l}),[b,c,l]),I=S(p=>(d({type:1,tab:p}),()=>d({type:2,tab:p}))),A=S(p=>(d({type:3,panel:p}),()=>d({type:4,panel:p}))),L=S(p=>{C.current!==p&&m.current(p),u||d({type:0,index:p})}),C=J(u?e.selectedIndex:l.selectedIndex),N=F(()=>({registerTab:I,registerPanel:A,change:L}),[]);O(()=>{d({type:0,index:i!=null?i:t})},[i]),O(()=>{if(C.current===void 0||l.tabs.length<=0)return;let p=H(l.tabs,a=>a.current);p.some((a,f)=>l.tabs[f]!==a)&&L(p.indexOf(l.tabs[C.current]))});let B={ref:T};return _.createElement(pe,null,_.createElement($.Provider,{value:N},_.createElement(X.Provider,{value:E},E.tabs.length<=0&&_.createElement(le,{onFocus:()=>{var p,D;for(let a of y.current)if(((p=a.current)==null?void 0:p.tabIndex)===0)return(D=a.current)==null||D.focus(),!0;return!1}}),w({ourProps:B,theirProps:R,slot:g,defaultTag:be,name:"Tabs"}))))}let Pe="div";function xe(e,n){let{orientation:t,selectedIndex:o}=M("Tab.List"),s=U(n);return w({ourProps:{ref:s,role:"tablist","aria-orientation":t},theirProps:e,slot:{selectedIndex:o},defaultTag:Pe,name:"Tabs.List"})}let ge="button";function ye(e,n){var p,D;let t=Z(),{id:o=`headlessui-tabs-tab-${t}`,...s}=e,{orientation:r,activation:i,selectedIndex:R,tabs:b,panels:c}=M("Tab"),u=q("Tab"),T=M("Tab"),l=K(null),d=U(l,n);O(()=>u.registerTab(l),[u,l]);let g=ee("tabs"),m=b.indexOf(l);m===-1&&(m=g);let y=m===R,E=S(a=>{var j;let f=a();if(f===k.Success&&i==="auto"){let W=(j=ie(l))==null?void 0:j.activeElement,z=T.tabs.findIndex(te=>te.current===W);z!==-1&&u.change(z)}return f}),I=Line truncated
|
||||
Reference in new issue
Block a user