@loke/ui
Version:
2 lines (1 loc) • 10.5 kB
JavaScript
var __create=Object.create;var{getPrototypeOf:__getProtoOf,defineProperty:__defProp,getOwnPropertyNames:__getOwnPropNames,getOwnPropertyDescriptor:__getOwnPropDesc}=Object,__hasOwnProp=Object.prototype.hasOwnProperty;function __accessProp(key){return this[key]}var __toESMCache_node,__toESMCache_esm,__toESM=(mod,isNodeMode,target)=>{var canCache=mod!=null&&typeof mod==="object";if(canCache){var cache=isNodeMode?__toESMCache_node??=new WeakMap:__toESMCache_esm??=new WeakMap,cached=cache.get(mod);if(cached)return cached}target=mod!=null?__create(__getProtoOf(mod)):{};let to=isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target;for(let key of __getOwnPropNames(mod))if(!__hasOwnProp.call(to,key))__defProp(to,key,{get:__accessProp.bind(mod,key),enumerable:!0});if(canCache)cache.set(mod,to);return to},__toCommonJS=(from)=>{var entry=(__moduleCache??=new WeakMap).get(from),desc;if(entry)return entry;if(entry=__defProp({},"__esModule",{value:!0}),from&&typeof from==="object"||typeof from==="function"){for(var key of __getOwnPropNames(from))if(!__hasOwnProp.call(entry,key))__defProp(entry,key,{get:__accessProp.bind(from,key),enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable})}return __moduleCache.set(from,entry),entry},__moduleCache;var __returnValue=(v)=>v;function __exportSetter(name,newValue){this[name]=__returnValue.bind(null,newValue)}var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0,configurable:!0,set:__exportSetter.bind(all,name)})};var exports_accordion={};__export(exports_accordion,{createAccordionScope:()=>createAccordionScope,Trigger:()=>Trigger,Root:()=>Root,Item:()=>Item,Header:()=>Header,Content:()=>Content,AccordionTrigger:()=>AccordionTrigger,AccordionItem:()=>AccordionItem,AccordionHeader:()=>AccordionHeader,AccordionContent:()=>AccordionContent,Accordion:()=>Accordion});module.exports=__toCommonJS(exports_accordion);var import_collapsible=require("@loke/ui/collapsible"),import_collection=require("@loke/ui/collection"),import_compose_events=require("@loke/ui/compose-events"),import_compose_refs=require("@loke/ui/compose-refs"),import_context=require("@loke/ui/context"),import_primitive=require("@loke/ui/primitive"),import_use_controllable_state=require("@loke/ui/use-controllable-state"),import_use_direction=require("@loke/ui/use-direction"),import_use_id=require("@loke/ui/use-id"),import_react=__toESM(require("react")),jsx_runtime=require("react/jsx-runtime"),ACCORDION_NAME="Accordion",ACCORDION_KEYS=["Home","End","ArrowDown","ArrowUp","ArrowLeft","ArrowRight"],[Collection,useCollection,createCollectionScope]=import_collection.createCollection(ACCORDION_NAME),[createAccordionContext,createAccordionScope]=import_context.createContextScope(ACCORDION_NAME,[createCollectionScope,import_collapsible.createCollapsibleScope]),useCollapsibleScope=import_collapsible.createCollapsibleScope(),Accordion=import_react.default.forwardRef((props,forwardedRef)=>{let{type,...accordionProps}=props,singleProps=accordionProps,multipleProps=accordionProps;return jsx_runtime.jsx(Collection.Provider,{scope:props.__scopeAccordion,children:type==="multiple"?jsx_runtime.jsx(AccordionImplMultiple,{...multipleProps,ref:forwardedRef}):jsx_runtime.jsx(AccordionImplSingle,{...singleProps,ref:forwardedRef})})});Accordion.displayName=ACCORDION_NAME;var[AccordionValueProvider,useAccordionValueContext]=createAccordionContext(ACCORDION_NAME),[AccordionCollapsibleProvider,useAccordionCollapsibleContext]=createAccordionContext(ACCORDION_NAME,{collapsible:!1}),AccordionImplSingle=import_react.default.forwardRef((props,forwardedRef)=>{let{value:valueProp,defaultValue,onValueChange=()=>{},collapsible=!1,...accordionSingleProps}=props,[value,setValue]=import_use_controllable_state.useControllableState({caller:ACCORDION_NAME,defaultProp:defaultValue??"",onChange:onValueChange,prop:valueProp});return jsx_runtime.jsx(AccordionValueProvider,{onItemClose:import_react.default.useCallback(()=>collapsible&&setValue(""),[collapsible,setValue]),onItemOpen:setValue,scope:props.__scopeAccordion,value:import_react.default.useMemo(()=>value?[value]:[],[value]),children:jsx_runtime.jsx(AccordionCollapsibleProvider,{collapsible,scope:props.__scopeAccordion,children:jsx_runtime.jsx(AccordionImpl,{...accordionSingleProps,ref:forwardedRef})})})}),AccordionImplMultiple=import_react.default.forwardRef((props,forwardedRef)=>{let{value:valueProp,defaultValue,onValueChange=()=>{},...accordionMultipleProps}=props,[value,setValue]=import_use_controllable_state.useControllableState({caller:ACCORDION_NAME,defaultProp:defaultValue??[],onChange:onValueChange,prop:valueProp}),handleItemOpen=import_react.default.useCallback((itemValue)=>setValue((prevValue=[])=>[...prevValue,itemValue]),[setValue]),handleItemClose=import_react.default.useCallback((itemValue)=>setValue((prevValue=[])=>prevValue.filter((v)=>v!==itemValue)),[setValue]);return jsx_runtime.jsx(AccordionValueProvider,{onItemClose:handleItemClose,onItemOpen:handleItemOpen,scope:props.__scopeAccordion,value,children:jsx_runtime.jsx(AccordionCollapsibleProvider,{collapsible:!0,scope:props.__scopeAccordion,children:jsx_runtime.jsx(AccordionImpl,{...accordionMultipleProps,ref:forwardedRef})})})}),[AccordionImplProvider,useAccordionContext]=createAccordionContext(ACCORDION_NAME),AccordionImpl=import_react.default.forwardRef((props,forwardedRef)=>{let{__scopeAccordion,disabled,dir,orientation="vertical",...accordionProps}=props,accordionRef=import_react.default.useRef(null),composedRefs=import_compose_refs.useComposedRefs(accordionRef,forwardedRef),getItems=useCollection(__scopeAccordion),isDirectionLTR=import_use_direction.useDirection(dir)==="ltr",handleKeyDown=import_compose_events.composeEventHandlers(props.onKeyDown,(event)=>{if(!ACCORDION_KEYS.includes(event.key))return;let target=event.target,triggerCollection=getItems().filter((item)=>!item.ref.current?.disabled),triggerIndex=triggerCollection.findIndex((item)=>item.ref.current===target),triggerCount=triggerCollection.length;if(triggerIndex===-1)return;event.preventDefault();let nextIndex=triggerIndex,homeIndex=0,endIndex=triggerCount-1,moveNext=()=>{if(nextIndex=triggerIndex+1,nextIndex>endIndex)nextIndex=homeIndex},movePrev=()=>{if(nextIndex=triggerIndex-1,nextIndex<homeIndex)nextIndex=endIndex};switch(event.key){case"Home":nextIndex=homeIndex;break;case"End":nextIndex=endIndex;break;case"ArrowRight":if(orientation==="horizontal")if(isDirectionLTR)moveNext();else movePrev();break;case"ArrowDown":if(orientation==="vertical")moveNext();break;case"ArrowLeft":if(orientation==="horizontal")if(isDirectionLTR)movePrev();else moveNext();break;case"ArrowUp":if(orientation==="vertical")movePrev();break}let clampedIndex=nextIndex%triggerCount;triggerCollection[clampedIndex].ref.current?.focus()});return jsx_runtime.jsx(AccordionImplProvider,{direction:dir,disabled,orientation,scope:__scopeAccordion,children:jsx_runtime.jsx(Collection.Slot,{scope:__scopeAccordion,children:jsx_runtime.jsx(import_primitive.Primitive.div,{...accordionProps,"data-orientation":orientation,onKeyDown:disabled?void 0:handleKeyDown,ref:composedRefs})})})}),ITEM_NAME="AccordionItem",[AccordionItemProvider,useAccordionItemContext]=createAccordionContext(ITEM_NAME),AccordionItem=import_react.default.forwardRef((props,forwardedRef)=>{let{__scopeAccordion,value,...accordionItemProps}=props,accordionContext=useAccordionContext(ITEM_NAME,__scopeAccordion),valueContext=useAccordionValueContext(ITEM_NAME,__scopeAccordion),collapsibleScope=useCollapsibleScope(__scopeAccordion),triggerId=import_use_id.useId(),open=Boolean(value&&valueContext.value.includes(value)),disabled=accordionContext.disabled||props.disabled;return jsx_runtime.jsx(AccordionItemProvider,{disabled,open,scope:__scopeAccordion,triggerId,children:jsx_runtime.jsx(import_collapsible.Collapsible,{"data-orientation":accordionContext.orientation,"data-state":getState(open),...collapsibleScope,...accordionItemProps,disabled,onOpenChange:(o)=>{if(o)valueContext.onItemOpen(value);else valueContext.onItemClose(value)},open,ref:forwardedRef})})});AccordionItem.displayName=ITEM_NAME;var HEADER_NAME="AccordionHeader",AccordionHeader=import_react.default.forwardRef((props,forwardedRef)=>{let{__scopeAccordion,...headerProps}=props,accordionContext=useAccordionContext(ACCORDION_NAME,__scopeAccordion),itemContext=useAccordionItemContext(HEADER_NAME,__scopeAccordion);return jsx_runtime.jsx(import_primitive.Primitive.h3,{"data-disabled":itemContext.disabled?"":void 0,"data-orientation":accordionContext.orientation,"data-state":getState(itemContext.open),...headerProps,ref:forwardedRef})});AccordionHeader.displayName=HEADER_NAME;var TRIGGER_NAME="AccordionTrigger",AccordionTrigger=import_react.default.forwardRef((props,forwardedRef)=>{let{__scopeAccordion,...triggerProps}=props,accordionContext=useAccordionContext(ACCORDION_NAME,__scopeAccordion),itemContext=useAccordionItemContext(TRIGGER_NAME,__scopeAccordion),collapsibleContext=useAccordionCollapsibleContext(TRIGGER_NAME,__scopeAccordion),collapsibleScope=useCollapsibleScope(__scopeAccordion);return jsx_runtime.jsx(Collection.ItemSlot,{scope:__scopeAccordion,children:jsx_runtime.jsx(import_collapsible.CollapsibleTrigger,{"aria-disabled":itemContext.open&&!collapsibleContext.collapsible||void 0,"data-orientation":accordionContext.orientation,id:itemContext.triggerId,...collapsibleScope,...triggerProps,ref:forwardedRef})})});AccordionTrigger.displayName=TRIGGER_NAME;var CONTENT_NAME="AccordionContent",AccordionContent=import_react.default.forwardRef((props,forwardedRef)=>{let{__scopeAccordion,...contentProps}=props,accordionContext=useAccordionContext(ACCORDION_NAME,__scopeAccordion),itemContext=useAccordionItemContext(CONTENT_NAME,__scopeAccordion),collapsibleScope=useCollapsibleScope(__scopeAccordion);return jsx_runtime.jsx(import_collapsible.CollapsibleContent,{"aria-labelledby":itemContext.triggerId,"data-orientation":accordionContext.orientation,role:"region",...collapsibleScope,...contentProps,ref:forwardedRef,style:{"--loke-accordion-content-height":"var(--loke-collapsible-content-height)","--loke-accordion-content-width":"var(--loke-collapsible-content-width)",...props.style}})});AccordionContent.displayName=CONTENT_NAME;function getState(open){return open?"open":"closed"}var Root=Accordion,Item=AccordionItem,Header=AccordionHeader,Trigger=AccordionTrigger,Content=AccordionContent;