UNPKG

@loke/ui

Version:
2 lines (1 loc) 9.18 kB
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_radio_group={};__export(exports_radio_group,{createRadioScope:()=>createRadioScope,createRadioGroupScope:()=>createRadioGroupScope,Root:()=>Root2,RadioIndicator:()=>RadioIndicator,RadioGroupItem:()=>RadioGroupItem,RadioGroupIndicator:()=>RadioGroupIndicator,RadioGroup:()=>RadioGroup,Radio:()=>Radio,Item:()=>Item2,Indicator:()=>Indicator});module.exports=__toCommonJS(exports_radio_group);var import_compose_events=require("@loke/ui/compose-events"),import_compose_refs=require("@loke/ui/compose-refs"),import_context=require("@loke/ui/context"),import_presence=require("@loke/ui/presence"),import_primitive=require("@loke/ui/primitive"),import_use_previous=require("@loke/ui/use-previous"),import_use_size=require("@loke/ui/use-size"),import_react=require("react"),jsx_runtime=require("react/jsx-runtime"),RADIO_NAME="Radio",[createRadioContext,createRadioScope]=import_context.createContextScope(RADIO_NAME),[RadioProvider,useRadioContext]=createRadioContext(RADIO_NAME),Radio=import_react.forwardRef((props,forwardedRef)=>{let{__scopeRadio,name,checked=!1,required,disabled,value="on",onCheck,form,...radioProps}=props,[button,setButton]=import_react.useState(null),composedRefs=import_compose_refs.useComposedRefs(forwardedRef,(node)=>setButton(node)),hasConsumerStoppedPropagationRef=import_react.useRef(!1),isFormControl=button?form||!!button.closest("form"):!0;return jsx_runtime.jsxs(RadioProvider,{checked,disabled,scope:__scopeRadio,children:[jsx_runtime.jsx(import_primitive.Primitive.button,{"aria-checked":checked,"data-disabled":disabled?"":void 0,"data-state":getState(checked),disabled,role:"radio",type:"button",value,...radioProps,onClick:import_compose_events.composeEventHandlers(props.onClick,(event)=>{if(!checked)onCheck?.();if(isFormControl){if(hasConsumerStoppedPropagationRef.current=event.isPropagationStopped(),!hasConsumerStoppedPropagationRef.current)event.stopPropagation()}}),ref:composedRefs}),isFormControl&&jsx_runtime.jsx(RadioBubbleInput,{bubbles:!hasConsumerStoppedPropagationRef.current,checked,control:button,disabled,form,name,required,style:{transform:"translateX(-100%)"},value})]})});Radio.displayName=RADIO_NAME;var INDICATOR_NAME="RadioIndicator",RadioIndicator=import_react.forwardRef((props,forwardedRef)=>{let{__scopeRadio,forceMount,...indicatorProps}=props,context=useRadioContext(INDICATOR_NAME,__scopeRadio);return jsx_runtime.jsx(import_presence.Presence,{present:forceMount||context.checked,children:jsx_runtime.jsx(import_primitive.Primitive.span,{"data-disabled":context.disabled?"":void 0,"data-state":getState(context.checked),...indicatorProps,ref:forwardedRef})})});RadioIndicator.displayName=INDICATOR_NAME;var BUBBLE_INPUT_NAME="RadioBubbleInput",RadioBubbleInput=import_react.forwardRef(({__scopeRadio,control,checked,bubbles=!0,...props},forwardedRef)=>{let ref=import_react.useRef(null),composedRefs=import_compose_refs.useComposedRefs(ref,forwardedRef),prevChecked=import_use_previous.usePrevious(checked),controlSize=import_use_size.useSize(control);return import_react.useEffect(()=>{let input=ref.current;if(!input)return;let inputProto=window.HTMLInputElement.prototype,setChecked=Object.getOwnPropertyDescriptor(inputProto,"checked").set;if(prevChecked!==checked&&setChecked){let event=new Event("click",{bubbles});setChecked.call(input,checked),input.dispatchEvent(event)}},[prevChecked,checked,bubbles]),jsx_runtime.jsx("input",{"aria-hidden":!0,defaultChecked:checked,type:"radio",...props,ref:composedRefs,style:{...props.style,...controlSize,margin:0,opacity:0,pointerEvents:"none",position:"absolute"},tabIndex:-1})});RadioBubbleInput.displayName=BUBBLE_INPUT_NAME;function getState(checked){return checked?"checked":"unchecked"}var import_compose_events2=require("@loke/ui/compose-events"),import_compose_refs2=require("@loke/ui/compose-refs"),import_context2=require("@loke/ui/context"),import_primitive2=require("@loke/ui/primitive"),RovingFocusGroup=__toESM(require("@loke/ui/roving-focus")),import_roving_focus=require("@loke/ui/roving-focus"),import_use_controllable_state=require("@loke/ui/use-controllable-state"),import_use_direction=require("@loke/ui/use-direction"),import_react2=require("react");var jsx_runtime2=require("react/jsx-runtime"),ARROW_KEYS=["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"],RADIO_GROUP_NAME="RadioGroup",[createRadioGroupContext,createRadioGroupScope]=import_context2.createContextScope(RADIO_GROUP_NAME,[import_roving_focus.createRovingFocusGroupScope,createRadioScope]),useRovingFocusGroupScope=import_roving_focus.createRovingFocusGroupScope(),useRadioScope=createRadioScope(),[RadioGroupProvider,useRadioGroupContext]=createRadioGroupContext(RADIO_GROUP_NAME),RadioGroup=import_react2.forwardRef((props,forwardedRef)=>{let{__scopeRadioGroup,name,defaultValue,value:valueProp,required=!1,disabled=!1,orientation,dir,loop=!0,onValueChange,...groupProps}=props,rovingFocusGroupScope=useRovingFocusGroupScope(__scopeRadioGroup),direction=import_use_direction.useDirection(dir),[value,setValue]=import_use_controllable_state.useControllableState({caller:RADIO_GROUP_NAME,defaultProp:defaultValue??null,onChange:onValueChange,prop:valueProp});return jsx_runtime2.jsx(RadioGroupProvider,{disabled,name,onValueChange:setValue,required,scope:__scopeRadioGroup,value,children:jsx_runtime2.jsx(RovingFocusGroup.Root,{asChild:!0,...rovingFocusGroupScope,dir:direction,loop,orientation,children:jsx_runtime2.jsx(import_primitive2.Primitive.div,{"aria-orientation":orientation,"aria-required":required,"data-disabled":disabled?"":void 0,dir:direction,role:"radiogroup",...groupProps,ref:forwardedRef})})})});RadioGroup.displayName=RADIO_GROUP_NAME;var ITEM_NAME="RadioGroupItem",RadioGroupItem=import_react2.forwardRef((props,forwardedRef)=>{let{__scopeRadioGroup,disabled,...itemProps}=props,context=useRadioGroupContext(ITEM_NAME,__scopeRadioGroup),isDisabled=context.disabled||disabled,rovingFocusGroupScope=useRovingFocusGroupScope(__scopeRadioGroup),radioScope=useRadioScope(__scopeRadioGroup),ref=import_react2.useRef(null),composedRefs=import_compose_refs2.useComposedRefs(forwardedRef,ref),checked=context.value===itemProps.value,isArrowKeyPressedRef=import_react2.useRef(!1);return import_react2.useEffect(()=>{let handleKeyDown=(event)=>{if(ARROW_KEYS.includes(event.key))isArrowKeyPressedRef.current=!0},handleKeyUp=()=>isArrowKeyPressedRef.current=!1;return document.addEventListener("keydown",handleKeyDown),document.addEventListener("keyup",handleKeyUp),()=>{document.removeEventListener("keydown",handleKeyDown),document.removeEventListener("keyup",handleKeyUp)}},[]),jsx_runtime2.jsx(RovingFocusGroup.Item,{asChild:!0,...rovingFocusGroupScope,active:checked,focusable:!isDisabled,children:jsx_runtime2.jsx(Radio,{checked,disabled:isDisabled,required:context.required,...radioScope,...itemProps,name:context.name,onCheck:()=>context.onValueChange(itemProps.value),onFocus:import_compose_events2.composeEventHandlers(itemProps.onFocus,()=>{if(isArrowKeyPressedRef.current)ref.current?.click()}),onKeyDown:import_compose_events2.composeEventHandlers((event)=>{if(event.key==="Enter")event.preventDefault()}),ref:composedRefs})})});RadioGroupItem.displayName=ITEM_NAME;var INDICATOR_NAME2="RadioGroupIndicator",RadioGroupIndicator=import_react2.forwardRef((props,forwardedRef)=>{let{__scopeRadioGroup,...indicatorProps}=props,radioScope=useRadioScope(__scopeRadioGroup);return jsx_runtime2.jsx(RadioIndicator,{...radioScope,...indicatorProps,ref:forwardedRef})});RadioGroupIndicator.displayName=INDICATOR_NAME2;var Root2=RadioGroup,Item2=RadioGroupItem,Indicator=RadioGroupIndicator;