@basic-ui/material 1.0.0-alpha.44 → 1.0.0-alpha.45

package/build/esm/RadioButton/RadioButtonIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioButtonIcon.js","names":["forwardRef","Box","EASING_STANDARD","RadioButtonIcon","props","forwardedRef","checked","otherProps","borderColor","borderStyle","borderRadius","borderWidth","width","height","p","backgroundColor","transition","transform"],"sources":["../../../src/RadioButton/RadioButtonIcon.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\r\nimport { forwardRef } from 'react';\r\nimport { rem } from 'polished';\r\n\r\nimport { Box } from '../Box';\r\nimport { EASING_STANDARD } from '../motion';\r\n\r\nexport interface RadioButtonIconProps extends HTMLAttributes<HTMLDivElement> {\r\n  checked?: boolean;\r\n  disabled?: boolean;\r\n}\r\n\r\nexport const RadioButtonIcon = forwardRef<HTMLDivElement, RadioButtonIconProps>(\r\n  function RadioButtonIcon(props, forwardedRef) {\r\n    const { checked, ...otherProps } = props;\r\n\r\n    return (\r\n      <Box\r\n        ref={forwardedRef}\r\n        __css={{\r\n          borderColor: 'currentColor',\r\n          borderStyle: 'solid',\r\n          borderRadius: 'full',\r\n          borderWidth: rem(2),\r\n          width: '100%',\r\n          height: '100%',\r\n          p: rem(3),\r\n        }}\r\n        {...otherProps}\r\n      >\r\n        <Box\r\n          __css={{\r\n            backgroundColor: 'currentColor',\r\n            borderRadius: 'full',\r\n            width: '100%',\r\n            height: '100%',\r\n            transition: `transform .12s ${EASING_STANDARD} 0ms,background-color .12s ${EASING_STANDARD} 0ms`,\r\n            transform: checked ? 'scale(1)' : 'scale(0)',\r\n          }}\r\n        />\r\n      </Box>\r\n    );\r\n  }\r\n);\r\n"],"mappings":";;;AACA,SAASA,UAAT,QAA2B,OAA3B;AAGA,SAASC,GAAT,QAAoB,QAApB;AACA,SAASC,eAAT,QAAgC,WAAhC;;AAOA,OAAO,IAAMC,eAAe,gBAAGH,UAAU,CACvC,SAASG,eAAT,CAAyBC,KAAzB,EAAgCC,YAAhC,EAA8C;EAC5C,IAAQC,OAAR,GAAmCF,KAAnC,CAAQE,OAAR;EAAA,IAAoBC,UAApB,4BAAmCH,KAAnC;;EAEA,oBACE,KAAC,GAAD;IACE,GAAG,EAAEC,YADP;IAEE,KAAK,EAAE;MACLG,WAAW,EAAE,cADR;MAELC,WAAW,EAAE,OAFR;MAGLC,YAAY,EAAE,MAHT;MAILC,WAAW,YAJN;MAKLC,KAAK,EAAE,MALF;MAMLC,MAAM,EAAE,MANH;MAOLC,CAAC;IAPI;EAFT,GAWMP,UAXN;IAAA,uBAaE,KAAC,GAAD;MACE,KAAK,EAAE;QACLQ,eAAe,EAAE,cADZ;QAELL,YAAY,EAAE,MAFT;QAGLE,KAAK,EAAE,MAHF;QAILC,MAAM,EAAE,MAJH;QAKLG,UAAU,2BAAoBd,eAApB,wCAAiEA,eAAjE,SALL;QAMLe,SAAS,EAAEX,OAAO,GAAG,UAAH,GAAgB;MAN7B;IADT;EAbF,GADF;AA0BD,CA9BsC,CAAlC"}
+{"version":3,"file":"RadioButtonIcon.js","names":["forwardRef","Box","EASING_STANDARD","RadioButtonIcon","props","forwardedRef","checked","otherProps","borderColor","borderStyle","borderRadius","borderWidth","width","height","p","backgroundColor","transition","transform"],"sources":["../../../src/RadioButton/RadioButtonIcon.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\nimport { rem } from 'polished';\n\nimport { Box } from '../Box';\nimport { EASING_STANDARD } from '../motion';\n\nexport interface RadioButtonIconProps extends HTMLAttributes<HTMLDivElement> {\n  checked?: boolean;\n  disabled?: boolean;\n}\n\nexport const RadioButtonIcon = forwardRef<HTMLDivElement, RadioButtonIconProps>(\n  function RadioButtonIcon(props, forwardedRef) {\n    const { checked, ...otherProps } = props;\n\n    return (\n      <Box\n        ref={forwardedRef}\n        __css={{\n          borderColor: 'currentColor',\n          borderStyle: 'solid',\n          borderRadius: 'full',\n          borderWidth: rem(2),\n          width: '100%',\n          height: '100%',\n          p: rem(3),\n        }}\n        {...otherProps}\n      >\n        <Box\n          __css={{\n            backgroundColor: 'currentColor',\n            borderRadius: 'full',\n            width: '100%',\n            height: '100%',\n            transition: `transform .12s ${EASING_STANDARD} 0ms,background-color .12s ${EASING_STANDARD} 0ms`,\n            transform: checked ? 'scale(1)' : 'scale(0)',\n          }}\n        />\n      </Box>\n    );\n  }\n);\n"],"mappings":";;;AACA,SAASA,UAAT,QAA2B,OAA3B;AAGA,SAASC,GAAT,QAAoB,QAApB;AACA,SAASC,eAAT,QAAgC,WAAhC;;AAOA,OAAO,IAAMC,eAAe,gBAAGH,UAAU,CACvC,SAASG,eAAT,CAAyBC,KAAzB,EAAgCC,YAAhC,EAA8C;EAC5C,IAAQC,OAAR,GAAmCF,KAAnC,CAAQE,OAAR;EAAA,IAAoBC,UAApB,4BAAmCH,KAAnC;;EAEA,oBACE,KAAC,GAAD;IACE,GAAG,EAAEC,YADP;IAEE,KAAK,EAAE;MACLG,WAAW,EAAE,cADR;MAELC,WAAW,EAAE,OAFR;MAGLC,YAAY,EAAE,MAHT;MAILC,WAAW,YAJN;MAKLC,KAAK,EAAE,MALF;MAMLC,MAAM,EAAE,MANH;MAOLC,CAAC;IAPI;EAFT,GAWMP,UAXN;IAAA,uBAaE,KAAC,GAAD;MACE,KAAK,EAAE;QACLQ,eAAe,EAAE,cADZ;QAELL,YAAY,EAAE,MAFT;QAGLE,KAAK,EAAE,MAHF;QAILC,MAAM,EAAE,MAJH;QAKLG,UAAU,2BAAoBd,eAApB,wCAAiEA,eAAjE,SALL;QAMLe,SAAS,EAAEX,OAAO,GAAG,UAAH,GAAgB;MAN7B;IADT;EAbF,GADF;AA0BD,CA9BsC,CAAlC"}

package/build/esm/RadioButton/RadioGroup.d.ts

@@ -1,5 +1,5 @@
-/// <reference types="react" />
-import type { RadioGroupProps as RadioGroupCoreProps } from '@basic-ui/core';
-import type { BoxProps } from '../Box';
-export declare type RadioGroupProps = Omit<BoxProps, 'onChange' | 'value' | 'defaultValue'> & RadioGroupCoreProps;
-export declare const RadioGroup: import("react").ForwardRefExoticComponent<Pick<RadioGroupProps, "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "bg" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "variant" | "size" | "hidden" | "as" | "sx" | "__css" | "tx" | "theme" | "borderX" | "borderY" | "gridGap" | "gridColumnGap" | "gridRowGap" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "value" | "name" | "innerAs"> & import("react").RefAttributes<HTMLDivElement>>;
+/// <reference types="react" />
+import type { RadioGroupProps as RadioGroupCoreProps } from '@basic-ui/core';
+import type { BoxProps } from '../Box';
+export declare type RadioGroupProps = Omit<BoxProps, 'onChange' | 'value' | 'defaultValue'> & RadioGroupCoreProps;
+export declare const RadioGroup: import("react").ForwardRefExoticComponent<Pick<RadioGroupProps, "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "backgroundImage" | "backgroundPosition" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "bottom" | "color" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "textAlign" | "textShadow" | "top" | "translate" | "verticalAlign" | "width" | "background" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "flex" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "bg" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "variant" | "size" | "hidden" | "as" | "sx" | "__css" | "tx" | "theme" | "borderX" | "borderY" | "gridGap" | "gridColumnGap" | "gridRowGap" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "value" | "name" | "innerAs"> & import("react").RefAttributes<HTMLDivElement>>;

package/build/esm/RadioButton/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","names":["forwardRef","RadioGroup","RadioGroupCore","Box","props","forwardedRef","as","otherProps"],"sources":["../../../src/RadioButton/RadioGroup.tsx"],"sourcesContent":["import { forwardRef } from 'react';\r\nimport type { RadioGroupProps as RadioGroupCoreProps } from '@basic-ui/core';\r\nimport { RadioGroup as RadioGroupCore } from '@basic-ui/core';\r\n\r\nimport type { BoxProps } from '../Box';\r\nimport { Box } from '../Box';\r\n\r\nexport type RadioGroupProps = Omit<\r\n  BoxProps,\r\n  'onChange' | 'value' | 'defaultValue'\r\n> &\r\n  RadioGroupCoreProps;\r\n\r\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\r\n  function RadioGroup(props, forwardedRef) {\r\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\r\n    const { as, ...otherProps } = props;\r\n\r\n    return (\r\n      <Box<RadioGroupProps>\r\n        as={RadioGroupCore}\r\n        ref={forwardedRef}\r\n        {...otherProps}\r\n      />\r\n    );\r\n  }\r\n);\r\n"],"mappings":";;;AAAA,SAASA,UAAT,QAA2B,OAA3B;AAEA,SAASC,UAAU,IAAIC,cAAvB,QAA6C,gBAA7C;AAGA,SAASC,GAAT,QAAoB,QAApB;;AAQA,OAAO,IAAMF,UAAU,gBAAGD,UAAU,CAClC,SAASC,UAAT,CAAoBG,KAApB,EAA2BC,YAA3B,EAAyC;EACvC;EACA,IAAQC,EAAR,GAA8BF,KAA9B,CAAQE,EAAR;EAAA,IAAeC,UAAf,4BAA8BH,KAA9B;;EAEA,oBACE,KAAC,GAAD;IACE,EAAE,EAAEF,cADN;IAEE,GAAG,EAAEG;EAFP,GAGME,UAHN,EADF;AAOD,CAZiC,CAA7B"}
+{"version":3,"file":"RadioGroup.js","names":["forwardRef","RadioGroup","RadioGroupCore","Box","props","forwardedRef","as","otherProps"],"sources":["../../../src/RadioButton/RadioGroup.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport type { RadioGroupProps as RadioGroupCoreProps } from '@basic-ui/core';\nimport { RadioGroup as RadioGroupCore } from '@basic-ui/core';\n\nimport type { BoxProps } from '../Box';\nimport { Box } from '../Box';\n\nexport type RadioGroupProps = Omit<\n  BoxProps,\n  'onChange' | 'value' | 'defaultValue'\n> &\n  RadioGroupCoreProps;\n\nexport const RadioGroup = forwardRef<HTMLDivElement, RadioGroupProps>(\n  function RadioGroup(props, forwardedRef) {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { as, ...otherProps } = props;\n\n    return (\n      <Box<RadioGroupProps>\n        as={RadioGroupCore}\n        ref={forwardedRef}\n        {...otherProps}\n      />\n    );\n  }\n);\n"],"mappings":";;;AAAA,SAASA,UAAT,QAA2B,OAA3B;AAEA,SAASC,UAAU,IAAIC,cAAvB,QAA6C,gBAA7C;AAGA,SAASC,GAAT,QAAoB,QAApB;;AAQA,OAAO,IAAMF,UAAU,gBAAGD,UAAU,CAClC,SAASC,UAAT,CAAoBG,KAApB,EAA2BC,YAA3B,EAAyC;EACvC;EACA,IAAQC,EAAR,GAA8BF,KAA9B,CAAQE,EAAR;EAAA,IAAeC,UAAf,4BAA8BH,KAA9B;;EAEA,oBACE,KAAC,GAAD;IACE,EAAE,EAAEF,cADN;IAEE,GAAG,EAAEG;EAFP,GAGME,UAHN,EADF;AAOD,CAZiC,CAA7B"}

package/build/esm/RadioButton/index.d.ts

@@ -1,2 +1,2 @@
-export * from './RadioButton';
-export * from './RadioGroup';
+export * from './RadioButton';
+export * from './RadioGroup';

package/build/esm/RadioButton/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/RadioButton/index.ts"],"sourcesContent":["export * from './RadioButton';\r\nexport * from './RadioGroup';\r\n"],"mappings":"AAAA,cAAc,eAAd;AACA,cAAc,cAAd"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/RadioButton/index.ts"],"sourcesContent":["export * from './RadioButton';\nexport * from './RadioGroup';\n"],"mappings":"AAAA,cAAc,eAAd;AACA,cAAc,cAAd"}

package/build/esm/Ripple/Ripple.d.ts

@@ -1,11 +1,11 @@
-/// <reference types="react" />
-import type { CSSObject } from '@emotion/react';
-export declare const rippleStyle: ({ animation, }: {
-    animation?: string | undefined;
-}) => CSSObject;
-export declare const Ripple: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & {
-    animation?: string | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+/// <reference types="react" />
+import type { CSSObject } from '@emotion/react';
+export declare const rippleStyle: ({ animation, }: {
+    animation?: string | undefined;
+}) => CSSObject;
+export declare const Ripple: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    animation?: string | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/build/esm/Ripple/Ripple.js

@@ -24,5 +24,5 @@ export var Ripple = _styled("div", process.env.NODE_ENV === "production" ? {
 } : {
   target: "ebk8cct0",
   label: "Ripple"
-})(rippleStyle, "pointer-events:none;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9SaXBwbGUvUmlwcGxlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE4QnNCIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9SaXBwbGUvUmlwcGxlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHR5cGUgeyBDU1NPYmplY3QgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XHJcblxyXG5pbXBvcnQge1xyXG4gIFJJUFBMRV9CQUNLR1JPVU5EX0NPTE9SLFxyXG4gIFJJUFBMRV9TSVpFLFxyXG4gIFJJUFBMRV9QT1NJVElPTixcclxufSBmcm9tICcuL2NvbnN0YW50cyc7XHJcblxyXG5leHBvcnQgY29uc3QgcmlwcGxlU3R5bGUgPSAoe1xyXG4gIGFuaW1hdGlvbixcclxufToge1xyXG4gIGFuaW1hdGlvbj86IHN0cmluZztcclxufSk6IENTU09iamVjdCA9PiAoe1xyXG4gIHBvc2l0aW9uOiAnYWJzb2x1dGUnLFxyXG4gIGJveFNpemluZzogJ2NvbnRlbnQtYm94JyxcclxuICBkaXNwbGF5OiAnYmxvY2snLFxyXG4gIGNvbnRlbnQ6ICdcIlwiJyxcclxuICB3aWR0aDogYHZhcigke1JJUFBMRV9TSVpFfSlgLFxyXG4gIGhlaWdodDogYHZhcigke1JJUFBMRV9TSVpFfSlgLFxyXG4gIHRvcDogYHZhcigke1JJUFBMRV9QT1NJVElPTn0pYCxcclxuICBsZWZ0OiBgdmFyKCR7UklQUExFX1BPU0lUSU9OfSlgLFxyXG4gIGJhY2tncm91bmRDb2xvcjogYHZhcigke1JJUFBMRV9CQUNLR1JPVU5EX0NPTE9SfSlgLFxyXG4gIHRyYW5zZm9ybU9yaWdpbjogJ2NlbnRlciBjZW50ZXInLFxyXG4gIG9wYWNpdHk6IDAsXHJcbiAgYm9yZGVyUmFkaXVzOiAnOTk5OTk5cHgnLFxyXG4gIGFuaW1hdGlvbixcclxuICB3aWxsQ2hhbmdlOiAnb3BhY2l0eSx0cmFuc2Zvcm0nLFxyXG59KTtcclxuXHJcbmV4cG9ydCBjb25zdCBSaXBwbGUgPSBzdHlsZWQuZGl2PHsgYW5pbWF0aW9uPzogc3RyaW5nIH0+KHJpcHBsZVN0eWxlLCB7XHJcbiAgcG9pbnRlckV2ZW50czogJ25vbmUnLFxyXG59KTtcclxuIl19 */"));
+})(rippleStyle, "pointer-events:none;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9SaXBwbGUvUmlwcGxlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE4QnNCIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9SaXBwbGUvUmlwcGxlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB0eXBlIHsgQ1NTT2JqZWN0IH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG5pbXBvcnQge1xuICBSSVBQTEVfQkFDS0dST1VORF9DT0xPUixcbiAgUklQUExFX1NJWkUsXG4gIFJJUFBMRV9QT1NJVElPTixcbn0gZnJvbSAnLi9jb25zdGFudHMnO1xuXG5leHBvcnQgY29uc3QgcmlwcGxlU3R5bGUgPSAoe1xuICBhbmltYXRpb24sXG59OiB7XG4gIGFuaW1hdGlvbj86IHN0cmluZztcbn0pOiBDU1NPYmplY3QgPT4gKHtcbiAgcG9zaXRpb246ICdhYnNvbHV0ZScsXG4gIGJveFNpemluZzogJ2NvbnRlbnQtYm94JyxcbiAgZGlzcGxheTogJ2Jsb2NrJyxcbiAgY29udGVudDogJ1wiXCInLFxuICB3aWR0aDogYHZhcigke1JJUFBMRV9TSVpFfSlgLFxuICBoZWlnaHQ6IGB2YXIoJHtSSVBQTEVfU0laRX0pYCxcbiAgdG9wOiBgdmFyKCR7UklQUExFX1BPU0lUSU9OfSlgLFxuICBsZWZ0OiBgdmFyKCR7UklQUExFX1BPU0lUSU9OfSlgLFxuICBiYWNrZ3JvdW5kQ29sb3I6IGB2YXIoJHtSSVBQTEVfQkFDS0dST1VORF9DT0xPUn0pYCxcbiAgdHJhbnNmb3JtT3JpZ2luOiAnY2VudGVyIGNlbnRlcicsXG4gIG9wYWNpdHk6IDAsXG4gIGJvcmRlclJhZGl1czogJzk5OTk5OXB4JyxcbiAgYW5pbWF0aW9uLFxuICB3aWxsQ2hhbmdlOiAnb3BhY2l0eSx0cmFuc2Zvcm0nLFxufSk7XG5cbmV4cG9ydCBjb25zdCBSaXBwbGUgPSBzdHlsZWQuZGl2PHsgYW5pbWF0aW9uPzogc3RyaW5nIH0+KHJpcHBsZVN0eWxlLCB7XG4gIHBvaW50ZXJFdmVudHM6ICdub25lJyxcbn0pO1xuIl19 */"));
 //# sourceMappingURL=Ripple.js.map

package/build/esm/Ripple/Ripple.js.map

@@ -1 +1 @@
-{"version":3,"file":"Ripple.js","names":["RIPPLE_BACKGROUND_COLOR","RIPPLE_SIZE","RIPPLE_POSITION","rippleStyle","animation","position","boxSizing","display","content","width","height","top","left","backgroundColor","transformOrigin","opacity","borderRadius","willChange","Ripple"],"sources":["../../../src/Ripple/Ripple.tsx"],"sourcesContent":["import styled from '@emotion/styled';\r\nimport type { CSSObject } from '@emotion/react';\r\n\r\nimport {\r\n  RIPPLE_BACKGROUND_COLOR,\r\n  RIPPLE_SIZE,\r\n  RIPPLE_POSITION,\r\n} from './constants';\r\n\r\nexport const rippleStyle = ({\r\n  animation,\r\n}: {\r\n  animation?: string;\r\n}): CSSObject => ({\r\n  position: 'absolute',\r\n  boxSizing: 'content-box',\r\n  display: 'block',\r\n  content: '\"\"',\r\n  width: `var(${RIPPLE_SIZE})`,\r\n  height: `var(${RIPPLE_SIZE})`,\r\n  top: `var(${RIPPLE_POSITION})`,\r\n  left: `var(${RIPPLE_POSITION})`,\r\n  backgroundColor: `var(${RIPPLE_BACKGROUND_COLOR})`,\r\n  transformOrigin: 'center center',\r\n  opacity: 0,\r\n  borderRadius: '999999px',\r\n  animation,\r\n  willChange: 'opacity,transform',\r\n});\r\n\r\nexport const Ripple = styled.div<{ animation?: string }>(rippleStyle, {\r\n  pointerEvents: 'none',\r\n});\r\n"],"mappings":";AAGA,SACEA,uBADF,EAEEC,WAFF,EAGEC,eAHF,QAIO,aAJP;AAMA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAc;EAAA,IACzBC,SADyB,QACzBA,SADyB;EAAA,OAIT;IAChBC,QAAQ,EAAE,UADM;IAEhBC,SAAS,EAAE,aAFK;IAGhBC,OAAO,EAAE,OAHO;IAIhBC,OAAO,EAAE,IAJO;IAKhBC,KAAK,gBAASR,WAAT,MALW;IAMhBS,MAAM,gBAAST,WAAT,MANU;IAOhBU,GAAG,gBAAST,eAAT,MAPa;IAQhBU,IAAI,gBAASV,eAAT,MARY;IAShBW,eAAe,gBAASb,uBAAT,MATC;IAUhBc,eAAe,EAAE,eAVD;IAWhBC,OAAO,EAAE,CAXO;IAYhBC,YAAY,EAAE,UAZE;IAahBZ,SAAS,EAATA,SAbgB;IAchBa,UAAU,EAAE;EAdI,CAJS;AAAA,CAApB;AAqBP,OAAO,IAAMC,MAAM,GAAG;EAAA;AAAA;EAAA;EAAA;AAAA,GAAmCf,WAAnC,g/CAAf"}
+{"version":3,"file":"Ripple.js","names":["RIPPLE_BACKGROUND_COLOR","RIPPLE_SIZE","RIPPLE_POSITION","rippleStyle","animation","position","boxSizing","display","content","width","height","top","left","backgroundColor","transformOrigin","opacity","borderRadius","willChange","Ripple"],"sources":["../../../src/Ripple/Ripple.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport type { CSSObject } from '@emotion/react';\n\nimport {\n  RIPPLE_BACKGROUND_COLOR,\n  RIPPLE_SIZE,\n  RIPPLE_POSITION,\n} from './constants';\n\nexport const rippleStyle = ({\n  animation,\n}: {\n  animation?: string;\n}): CSSObject => ({\n  position: 'absolute',\n  boxSizing: 'content-box',\n  display: 'block',\n  content: '\"\"',\n  width: `var(${RIPPLE_SIZE})`,\n  height: `var(${RIPPLE_SIZE})`,\n  top: `var(${RIPPLE_POSITION})`,\n  left: `var(${RIPPLE_POSITION})`,\n  backgroundColor: `var(${RIPPLE_BACKGROUND_COLOR})`,\n  transformOrigin: 'center center',\n  opacity: 0,\n  borderRadius: '999999px',\n  animation,\n  willChange: 'opacity,transform',\n});\n\nexport const Ripple = styled.div<{ animation?: string }>(rippleStyle, {\n  pointerEvents: 'none',\n});\n"],"mappings":";AAGA,SACEA,uBADF,EAEEC,WAFF,EAGEC,eAHF,QAIO,aAJP;AAMA,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAc;EAAA,IACzBC,SADyB,QACzBA,SADyB;EAAA,OAIT;IAChBC,QAAQ,EAAE,UADM;IAEhBC,SAAS,EAAE,aAFK;IAGhBC,OAAO,EAAE,OAHO;IAIhBC,OAAO,EAAE,IAJO;IAKhBC,KAAK,gBAASR,WAAT,MALW;IAMhBS,MAAM,gBAAST,WAAT,MANU;IAOhBU,GAAG,gBAAST,eAAT,MAPa;IAQhBU,IAAI,gBAASV,eAAT,MARY;IAShBW,eAAe,gBAASb,uBAAT,MATC;IAUhBc,eAAe,EAAE,eAVD;IAWhBC,OAAO,EAAE,CAXO;IAYhBC,YAAY,EAAE,UAZE;IAahBZ,SAAS,EAATA,SAbgB;IAchBa,UAAU,EAAE;EAdI,CAJS;AAAA,CAApB;AAqBP,OAAO,IAAMC,MAAM,GAAG;EAAA;AAAA;EAAA;EAAA;AAAA,GAAmCf,WAAnC,w5CAAf"}

package/build/esm/Ripple/RippleBox.d.ts

@@ -1,5 +1,5 @@
-import type { HTMLAttributes } from 'react';
-import type { UseRippleSurfaceOptions } from './useRippleSurface';
-import type { BoxProps } from '../Box';
-export declare type RippleBoxProps<H extends HTMLElement = HTMLDivElement, Attr = HTMLAttributes<H>> = BoxProps<H, Attr> & UseRippleSurfaceOptions<H>;
-export declare const RippleBox: <Props = RippleBoxProps<HTMLDivElement, HTMLAttributes<HTMLDivElement>>>(props: Props) => JSX.Element;
+import type { HTMLAttributes } from 'react';
+import type { UseRippleSurfaceOptions } from './useRippleSurface';
+import type { BoxProps } from '../Box';
+export declare type RippleBoxProps<H extends HTMLElement = HTMLDivElement, Attr = HTMLAttributes<H>> = BoxProps<H, Attr> & UseRippleSurfaceOptions<H>;
+export declare const RippleBox: <Props = RippleBoxProps<HTMLDivElement, HTMLAttributes<HTMLDivElement>>>(props: Props) => JSX.Element;

package/build/esm/Ripple/RippleBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"RippleBox.js","names":["forwardRef","useRippleSurface","Box","RippleBox","props","forwardedRef","as","__css","onKeyDown","onPointerDown","baseOpacity","hoverOpacity","focusOpacity","pressedOpacity","rippleColor","center","disabled","rippleEnabled","style","otherProps","rippleCss","rippleProps"],"sources":["../../../src/Ripple/RippleBox.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\r\nimport { forwardRef } from 'react';\r\n\r\nimport type { UseRippleSurfaceOptions } from './useRippleSurface';\r\nimport { useRippleSurface } from './useRippleSurface';\r\nimport type { BoxProps } from '../Box';\r\nimport { Box } from '../Box';\r\n\r\nexport type RippleBoxProps<\r\n  H extends HTMLElement = HTMLDivElement,\r\n  Attr = HTMLAttributes<H>\r\n> = BoxProps<H, Attr> & UseRippleSurfaceOptions<H>;\r\n\r\nexport const RippleBox: <\r\n  Props = RippleBoxProps<HTMLDivElement, HTMLAttributes<HTMLDivElement>>\r\n>(\r\n  props: Props\r\n) => JSX.Element = forwardRef<HTMLDivElement, RippleBoxProps>(\r\n  function RippleBox(props, forwardedRef) {\r\n    const {\r\n      as = 'div',\r\n      __css,\r\n      // Cherry picking the ripple props to prevent it from falling down to\r\n      // the Box component\r\n      onKeyDown, // eslint-disable-line @typescript-eslint/no-unused-vars\r\n      onPointerDown, // eslint-disable-line @typescript-eslint/no-unused-vars\r\n      baseOpacity, // eslint-disable-line @typescript-eslint/no-unused-vars\r\n      hoverOpacity, // eslint-disable-line @typescript-eslint/no-unused-vars\r\n      focusOpacity, // eslint-disable-line @typescript-eslint/no-unused-vars\r\n      pressedOpacity, // eslint-disable-line @typescript-eslint/no-unused-vars\r\n      rippleColor, // eslint-disable-line @typescript-eslint/no-unused-vars\r\n      center, // eslint-disable-line @typescript-eslint/no-unused-vars\r\n      disabled, // eslint-disable-line @typescript-eslint/no-unused-vars\r\n      rippleEnabled, // eslint-disable-line @typescript-eslint/no-unused-vars\r\n      style, // eslint-disable-line @typescript-eslint/no-unused-vars\r\n      ...otherProps\r\n    } = props;\r\n\r\n    const { __css: rippleCss, ...rippleProps } = useRippleSurface(props);\r\n\r\n    return (\r\n      <Box\r\n        as={as}\r\n        ref={forwardedRef}\r\n        __css={{ ...rippleCss, ...__css }}\r\n        {...{ disabled }}\r\n        {...otherProps}\r\n        {...rippleProps}\r\n      />\r\n    );\r\n  }\r\n) as any;\r\n"],"mappings":";;;;AACA,SAASA,UAAT,QAA2B,OAA3B;AAGA,SAASC,gBAAT,QAAiC,oBAAjC;AAEA,SAASC,GAAT,QAAoB,QAApB;;AAOA,OAAO,IAAMC,SAIG,gBAAGH,UAAU,CAC3B,SAASG,SAAT,CAAmBC,KAAnB,EAA0BC,YAA1B,EAAwC;EACtC,gBAiBID,KAjBJ,CACEE,EADF;EAAA,IACEA,EADF,0BACO,KADP;EAAA,IAEEC,KAFF,GAiBIH,KAjBJ,CAEEG,KAFF;EAAA,IAKEC,SALF,GAiBIJ,KAjBJ,CAKEI,SALF;EAAA,IAMEC,aANF,GAiBIL,KAjBJ,CAMEK,aANF;EAAA,IAOEC,WAPF,GAiBIN,KAjBJ,CAOEM,WAPF;EAAA,IAQEC,YARF,GAiBIP,KAjBJ,CAQEO,YARF;EAAA,IASEC,YATF,GAiBIR,KAjBJ,CASEQ,YATF;EAAA,IAUEC,cAVF,GAiBIT,KAjBJ,CAUES,cAVF;EAAA,IAWEC,WAXF,GAiBIV,KAjBJ,CAWEU,WAXF;EAAA,IAYEC,MAZF,GAiBIX,KAjBJ,CAYEW,MAZF;EAAA,IAaEC,QAbF,GAiBIZ,KAjBJ,CAaEY,QAbF;EAAA,IAcEC,aAdF,GAiBIb,KAjBJ,CAcEa,aAdF;EAAA,IAeEC,KAfF,GAiBId,KAjBJ,CAeEc,KAfF;EAAA,IAgBKC,UAhBL,4BAiBIf,KAjBJ;;EAmBA,wBAA6CH,gBAAgB,CAACG,KAAD,CAA7D;EAAA,IAAegB,SAAf,qBAAQb,KAAR;EAAA,IAA6Bc,WAA7B;;EAEA,oBACE,KAAC,GAAD;IACE,EAAE,EAAEf,EADN;IAEE,GAAG,EAAED,YAFP;IAGE,KAAK,wBAAOe,SAAP,GAAqBb,KAArB,CAHP;IAIQS,QAAQ,EAARA;EAJR,GAKMG,UALN,GAMME,WANN,EADF;AAUD,CAjC0B,CAJtB"}
+{"version":3,"file":"RippleBox.js","names":["forwardRef","useRippleSurface","Box","RippleBox","props","forwardedRef","as","__css","onKeyDown","onPointerDown","baseOpacity","hoverOpacity","focusOpacity","pressedOpacity","rippleColor","center","disabled","rippleEnabled","style","otherProps","rippleCss","rippleProps"],"sources":["../../../src/Ripple/RippleBox.tsx"],"sourcesContent":["import type { HTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\n\nimport type { UseRippleSurfaceOptions } from './useRippleSurface';\nimport { useRippleSurface } from './useRippleSurface';\nimport type { BoxProps } from '../Box';\nimport { Box } from '../Box';\n\nexport type RippleBoxProps<\n  H extends HTMLElement = HTMLDivElement,\n  Attr = HTMLAttributes<H>\n> = BoxProps<H, Attr> & UseRippleSurfaceOptions<H>;\n\nexport const RippleBox: <\n  Props = RippleBoxProps<HTMLDivElement, HTMLAttributes<HTMLDivElement>>\n>(\n  props: Props\n) => JSX.Element = forwardRef<HTMLDivElement, RippleBoxProps>(\n  function RippleBox(props, forwardedRef) {\n    const {\n      as = 'div',\n      __css,\n      // Cherry picking the ripple props to prevent it from falling down to\n      // the Box component\n      onKeyDown, // eslint-disable-line @typescript-eslint/no-unused-vars\n      onPointerDown, // eslint-disable-line @typescript-eslint/no-unused-vars\n      baseOpacity, // eslint-disable-line @typescript-eslint/no-unused-vars\n      hoverOpacity, // eslint-disable-line @typescript-eslint/no-unused-vars\n      focusOpacity, // eslint-disable-line @typescript-eslint/no-unused-vars\n      pressedOpacity, // eslint-disable-line @typescript-eslint/no-unused-vars\n      rippleColor, // eslint-disable-line @typescript-eslint/no-unused-vars\n      center, // eslint-disable-line @typescript-eslint/no-unused-vars\n      disabled, // eslint-disable-line @typescript-eslint/no-unused-vars\n      rippleEnabled, // eslint-disable-line @typescript-eslint/no-unused-vars\n      style, // eslint-disable-line @typescript-eslint/no-unused-vars\n      ...otherProps\n    } = props;\n\n    const { __css: rippleCss, ...rippleProps } = useRippleSurface(props);\n\n    return (\n      <Box\n        as={as}\n        ref={forwardedRef}\n        __css={{ ...rippleCss, ...__css }}\n        {...{ disabled }}\n        {...otherProps}\n        {...rippleProps}\n      />\n    );\n  }\n) as any;\n"],"mappings":";;;;AACA,SAASA,UAAT,QAA2B,OAA3B;AAGA,SAASC,gBAAT,QAAiC,oBAAjC;AAEA,SAASC,GAAT,QAAoB,QAApB;;AAOA,OAAO,IAAMC,SAIG,gBAAGH,UAAU,CAC3B,SAASG,SAAT,CAAmBC,KAAnB,EAA0BC,YAA1B,EAAwC;EACtC,gBAiBID,KAjBJ,CACEE,EADF;EAAA,IACEA,EADF,0BACO,KADP;EAAA,IAEEC,KAFF,GAiBIH,KAjBJ,CAEEG,KAFF;EAAA,IAKEC,SALF,GAiBIJ,KAjBJ,CAKEI,SALF;EAAA,IAMEC,aANF,GAiBIL,KAjBJ,CAMEK,aANF;EAAA,IAOEC,WAPF,GAiBIN,KAjBJ,CAOEM,WAPF;EAAA,IAQEC,YARF,GAiBIP,KAjBJ,CAQEO,YARF;EAAA,IASEC,YATF,GAiBIR,KAjBJ,CASEQ,YATF;EAAA,IAUEC,cAVF,GAiBIT,KAjBJ,CAUES,cAVF;EAAA,IAWEC,WAXF,GAiBIV,KAjBJ,CAWEU,WAXF;EAAA,IAYEC,MAZF,GAiBIX,KAjBJ,CAYEW,MAZF;EAAA,IAaEC,QAbF,GAiBIZ,KAjBJ,CAaEY,QAbF;EAAA,IAcEC,aAdF,GAiBIb,KAjBJ,CAcEa,aAdF;EAAA,IAeEC,KAfF,GAiBId,KAjBJ,CAeEc,KAfF;EAAA,IAgBKC,UAhBL,4BAiBIf,KAjBJ;;EAmBA,wBAA6CH,gBAAgB,CAACG,KAAD,CAA7D;EAAA,IAAegB,SAAf,qBAAQb,KAAR;EAAA,IAA6Bc,WAA7B;;EAEA,oBACE,KAAC,GAAD;IACE,EAAE,EAAEf,EADN;IAEE,GAAG,EAAED,YAFP;IAGE,KAAK,wBAAOe,SAAP,GAAqBb,KAArB,CAHP;IAIQS,QAAQ,EAARA;EAJR,GAKMG,UALN,GAMME,WANN,EADF;AAUD,CAjC0B,CAJtB"}

package/build/esm/Ripple/constants.d.ts

@@ -1,7 +1,7 @@
-export declare const RIPPLE_BACKGROUND_COLOR: string;
-export declare const RIPPLE_TRANSLATE_START: string;
-export declare const RIPPLE_TRANSLATE_END: string;
-export declare const RIPPLE_SCALE_END: string;
-export declare const RIPPLE_OPACITY_END: string;
-export declare const RIPPLE_SIZE: string;
-export declare const RIPPLE_POSITION: string;
+export declare const RIPPLE_BACKGROUND_COLOR: string;
+export declare const RIPPLE_TRANSLATE_START: string;
+export declare const RIPPLE_TRANSLATE_END: string;
+export declare const RIPPLE_SCALE_END: string;
+export declare const RIPPLE_OPACITY_END: string;
+export declare const RIPPLE_SIZE: string;
+export declare const RIPPLE_POSITION: string;

package/build/esm/Ripple/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","names":["hash","RIPPLE_BACKGROUND_COLOR","RIPPLE_TRANSLATE_START","RIPPLE_TRANSLATE_END","RIPPLE_SCALE_END","RIPPLE_OPACITY_END","RIPPLE_SIZE","RIPPLE_POSITION"],"sources":["../../../src/Ripple/constants.ts"],"sourcesContent":["import hash from '@emotion/hash';\r\n\r\nexport const RIPPLE_BACKGROUND_COLOR = `--css-${hash(\r\n  'basic-ui-ripple-fg-bg-color'\r\n)}`;\r\nexport const RIPPLE_TRANSLATE_START = `--css-${hash(\r\n  'basic-ui-ripple-fg-translate-start'\r\n)}`;\r\nexport const RIPPLE_TRANSLATE_END = `--css-${hash(\r\n  'basic-ui-ripple-fg-translate-end'\r\n)}`;\r\nexport const RIPPLE_SCALE_END = `--css-${hash('basic-ui-ripple-fg-scale')}`;\r\nexport const RIPPLE_OPACITY_END = `--css-${hash('basic-ui-ripple-fg-opacity')}`;\r\nexport const RIPPLE_SIZE = `--css-${hash('basic-ui-ripple-fg-size')}`;\r\nexport const RIPPLE_POSITION = `--css-${hash('basic-ui-ripple-fg-position')}`;\r\n"],"mappings":"AAAA,OAAOA,IAAP,MAAiB,eAAjB;AAEA,OAAO,IAAMC,uBAAuB,mBAAYD,IAAI,CAClD,6BADkD,CAAhB,CAA7B;AAGP,OAAO,IAAME,sBAAsB,mBAAYF,IAAI,CACjD,oCADiD,CAAhB,CAA5B;AAGP,OAAO,IAAMG,oBAAoB,mBAAYH,IAAI,CAC/C,kCAD+C,CAAhB,CAA1B;AAGP,OAAO,IAAMI,gBAAgB,mBAAYJ,IAAI,CAAC,0BAAD,CAAhB,CAAtB;AACP,OAAO,IAAMK,kBAAkB,mBAAYL,IAAI,CAAC,4BAAD,CAAhB,CAAxB;AACP,OAAO,IAAMM,WAAW,mBAAYN,IAAI,CAAC,yBAAD,CAAhB,CAAjB;AACP,OAAO,IAAMO,eAAe,mBAAYP,IAAI,CAAC,6BAAD,CAAhB,CAArB"}
+{"version":3,"file":"constants.js","names":["hash","RIPPLE_BACKGROUND_COLOR","RIPPLE_TRANSLATE_START","RIPPLE_TRANSLATE_END","RIPPLE_SCALE_END","RIPPLE_OPACITY_END","RIPPLE_SIZE","RIPPLE_POSITION"],"sources":["../../../src/Ripple/constants.ts"],"sourcesContent":["import hash from '@emotion/hash';\n\nexport const RIPPLE_BACKGROUND_COLOR = `--css-${hash(\n  'basic-ui-ripple-fg-bg-color'\n)}`;\nexport const RIPPLE_TRANSLATE_START = `--css-${hash(\n  'basic-ui-ripple-fg-translate-start'\n)}`;\nexport const RIPPLE_TRANSLATE_END = `--css-${hash(\n  'basic-ui-ripple-fg-translate-end'\n)}`;\nexport const RIPPLE_SCALE_END = `--css-${hash('basic-ui-ripple-fg-scale')}`;\nexport const RIPPLE_OPACITY_END = `--css-${hash('basic-ui-ripple-fg-opacity')}`;\nexport const RIPPLE_SIZE = `--css-${hash('basic-ui-ripple-fg-size')}`;\nexport const RIPPLE_POSITION = `--css-${hash('basic-ui-ripple-fg-position')}`;\n"],"mappings":"AAAA,OAAOA,IAAP,MAAiB,eAAjB;AAEA,OAAO,IAAMC,uBAAuB,mBAAYD,IAAI,CAClD,6BADkD,CAAhB,CAA7B;AAGP,OAAO,IAAME,sBAAsB,mBAAYF,IAAI,CACjD,oCADiD,CAAhB,CAA5B;AAGP,OAAO,IAAMG,oBAAoB,mBAAYH,IAAI,CAC/C,kCAD+C,CAAhB,CAA1B;AAGP,OAAO,IAAMI,gBAAgB,mBAAYJ,IAAI,CAAC,0BAAD,CAAhB,CAAtB;AACP,OAAO,IAAMK,kBAAkB,mBAAYL,IAAI,CAAC,4BAAD,CAAhB,CAAxB;AACP,OAAO,IAAMM,WAAW,mBAAYN,IAAI,CAAC,yBAAD,CAAhB,CAAjB;AACP,OAAO,IAAMO,eAAe,mBAAYP,IAAI,CAAC,6BAAD,CAAhB,CAArB"}

package/build/esm/Ripple/index.d.ts

@@ -1,5 +1,5 @@
-export * from './Ripple';
-export * from './RippleBox';
-export * from './useRipple';
-export * from './useRippleHandlers';
-export * from './useRippleSurface';
+export * from './Ripple';
+export * from './RippleBox';
+export * from './useRipple';
+export * from './useRippleHandlers';
+export * from './useRippleSurface';

package/build/esm/Ripple/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/Ripple/index.ts"],"sourcesContent":["export * from './Ripple';\r\nexport * from './RippleBox';\r\nexport * from './useRipple';\r\nexport * from './useRippleHandlers';\r\nexport * from './useRippleSurface';\r\n"],"mappings":"AAAA,cAAc,UAAd;AACA,cAAc,aAAd;AACA,cAAc,aAAd;AACA,cAAc,qBAAd;AACA,cAAc,oBAAd"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/Ripple/index.ts"],"sourcesContent":["export * from './Ripple';\nexport * from './RippleBox';\nexport * from './useRipple';\nexport * from './useRippleHandlers';\nexport * from './useRippleSurface';\n"],"mappings":"AAAA,cAAc,UAAd;AACA,cAAc,aAAd;AACA,cAAc,aAAd;AACA,cAAc,qBAAd;AACA,cAAc,oBAAd"}

package/build/esm/Ripple/keyframes.d.ts

@@ -1,4 +1,4 @@
-import type { Keyframes } from '@emotion/serialize';
-export declare const radiusIn: Keyframes;
-export declare const opacityIn: Keyframes;
-export declare const opacityOut: Keyframes;
+import type { Keyframes } from '@emotion/serialize';
+export declare const radiusIn: Keyframes;
+export declare const opacityIn: Keyframes;
+export declare const opacityOut: Keyframes;

package/build/esm/Ripple/keyframes.js.map

@@ -1 +1 @@
-{"version":3,"file":"keyframes.js","names":["keyframes","RIPPLE_TRANSLATE_START","RIPPLE_TRANSLATE_END","RIPPLE_OPACITY_END","RIPPLE_SCALE_END","radiusIn","from","transform","to","opacityIn","opacity","opacityOut"],"sources":["../../../src/Ripple/keyframes.ts"],"sourcesContent":["import { keyframes } from '@emotion/react';\r\nimport type { Keyframes } from '@emotion/serialize';\r\n\r\nimport {\r\n  RIPPLE_TRANSLATE_START,\r\n  RIPPLE_TRANSLATE_END,\r\n  RIPPLE_OPACITY_END,\r\n  RIPPLE_SCALE_END,\r\n} from './constants';\r\n\r\nexport const radiusIn: Keyframes = keyframes({\r\n  from: {\r\n    transform: `translate(var(${RIPPLE_TRANSLATE_START}, 0)) scale(1)`,\r\n  },\r\n  to: {\r\n    transform: `translate(var(${RIPPLE_TRANSLATE_END}, 0)) scale(var(${RIPPLE_SCALE_END}, 1))`,\r\n  },\r\n});\r\n\r\nexport const opacityIn: Keyframes = keyframes({\r\n  from: {\r\n    opacity: '0',\r\n  },\r\n  to: {\r\n    opacity: `var(${RIPPLE_OPACITY_END})`,\r\n  },\r\n});\r\n\r\nexport const opacityOut: Keyframes = keyframes({\r\n  from: {\r\n    opacity: `var(${RIPPLE_OPACITY_END})`,\r\n  },\r\n  to: {\r\n    opacity: '0',\r\n  },\r\n});\r\n"],"mappings":"AAAA,SAASA,SAAT,QAA0B,gBAA1B;AAGA,SACEC,sBADF,EAEEC,oBAFF,EAGEC,kBAHF,EAIEC,gBAJF,QAKO,aALP;AAOA,OAAO,IAAMC,QAAmB,GAAGL,SAAS,CAAC;EAC3CM,IAAI,EAAE;IACJC,SAAS,0BAAmBN,sBAAnB;EADL,CADqC;EAI3CO,EAAE,EAAE;IACFD,SAAS,0BAAmBL,oBAAnB,6BAA0DE,gBAA1D;EADP;AAJuC,CAAD,CAArC;AASP,OAAO,IAAMK,SAAoB,GAAGT,SAAS,CAAC;EAC5CM,IAAI,EAAE;IACJI,OAAO,EAAE;EADL,CADsC;EAI5CF,EAAE,EAAE;IACFE,OAAO,gBAASP,kBAAT;EADL;AAJwC,CAAD,CAAtC;AASP,OAAO,IAAMQ,UAAqB,GAAGX,SAAS,CAAC;EAC7CM,IAAI,EAAE;IACJI,OAAO,gBAASP,kBAAT;EADH,CADuC;EAI7CK,EAAE,EAAE;IACFE,OAAO,EAAE;EADP;AAJyC,CAAD,CAAvC"}
+{"version":3,"file":"keyframes.js","names":["keyframes","RIPPLE_TRANSLATE_START","RIPPLE_TRANSLATE_END","RIPPLE_OPACITY_END","RIPPLE_SCALE_END","radiusIn","from","transform","to","opacityIn","opacity","opacityOut"],"sources":["../../../src/Ripple/keyframes.ts"],"sourcesContent":["import { keyframes } from '@emotion/react';\nimport type { Keyframes } from '@emotion/serialize';\n\nimport {\n  RIPPLE_TRANSLATE_START,\n  RIPPLE_TRANSLATE_END,\n  RIPPLE_OPACITY_END,\n  RIPPLE_SCALE_END,\n} from './constants';\n\nexport const radiusIn: Keyframes = keyframes({\n  from: {\n    transform: `translate(var(${RIPPLE_TRANSLATE_START}, 0)) scale(1)`,\n  },\n  to: {\n    transform: `translate(var(${RIPPLE_TRANSLATE_END}, 0)) scale(var(${RIPPLE_SCALE_END}, 1))`,\n  },\n});\n\nexport const opacityIn: Keyframes = keyframes({\n  from: {\n    opacity: '0',\n  },\n  to: {\n    opacity: `var(${RIPPLE_OPACITY_END})`,\n  },\n});\n\nexport const opacityOut: Keyframes = keyframes({\n  from: {\n    opacity: `var(${RIPPLE_OPACITY_END})`,\n  },\n  to: {\n    opacity: '0',\n  },\n});\n"],"mappings":"AAAA,SAASA,SAAT,QAA0B,gBAA1B;AAGA,SACEC,sBADF,EAEEC,oBAFF,EAGEC,kBAHF,EAIEC,gBAJF,QAKO,aALP;AAOA,OAAO,IAAMC,QAAmB,GAAGL,SAAS,CAAC;EAC3CM,IAAI,EAAE;IACJC,SAAS,0BAAmBN,sBAAnB;EADL,CADqC;EAI3CO,EAAE,EAAE;IACFD,SAAS,0BAAmBL,oBAAnB,6BAA0DE,gBAA1D;EADP;AAJuC,CAAD,CAArC;AASP,OAAO,IAAMK,SAAoB,GAAGT,SAAS,CAAC;EAC5CM,IAAI,EAAE;IACJI,OAAO,EAAE;EADL,CADsC;EAI5CF,EAAE,EAAE;IACFE,OAAO,gBAASP,kBAAT;EADL;AAJwC,CAAD,CAAtC;AASP,OAAO,IAAMQ,UAAqB,GAAGX,SAAS,CAAC;EAC7CM,IAAI,EAAE;IACJI,OAAO,gBAASP,kBAAT;EADH,CADuC;EAI7CK,EAAE,EAAE;IACFE,OAAO,EAAE;EADP;AAJyC,CAAD,CAAvC"}

package/build/esm/Ripple/useRipple.d.ts

@@ -1,14 +1,14 @@
-export interface RippleOptions {
-    opacity: number;
-    backgroundColor: string;
-    enterDuration?: number;
-    leaveDuration?: number;
-    center?: boolean;
-    disabled?: boolean;
-}
-export declare const useRipple: (opts: RippleOptions) => {
-    activate: (rect: ClientRect, clientX: number, clientY: number, center?: boolean) => void;
-    deactivate: () => void;
-    style: {};
-    animation: string | undefined;
-};
+export interface RippleOptions {
+    opacity: number;
+    backgroundColor: string;
+    enterDuration?: number;
+    leaveDuration?: number;
+    center?: boolean;
+    disabled?: boolean;
+}
+export declare const useRipple: (opts: RippleOptions) => {
+    activate: (rect: ClientRect, clientX: number, clientY: number, center?: boolean) => void;
+    deactivate: () => void;
+    style: {};
+    animation: string | undefined;
+};

package/build/esm/Ripple/useRipple.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRipple.js","names":["useState","useRef","useEffect","radiusIn","opacityIn","opacityOut","RIPPLE_TRANSLATE_START","RIPPLE_TRANSLATE_END","RIPPLE_OPACITY_END","RIPPLE_SCALE_END","RIPPLE_SIZE","RIPPLE_BACKGROUND_COLOR","RIPPLE_POSITION","defaultRipple","x","y","size","scale","centerX","centerY","getBoundedRadius","rect","padding","hypotenuse","Math","sqrt","pow","width","height","getScale","maxDim","max","initialOriginScale","maxRadius","initialSize","floor","calculateRipplePosition","clientX","clientY","center","rippleStart","left","top","state","useRipple","opts","opacity","backgroundColor","enterDuration","leaveDuration","rippleState","ripple","setRipple","leavingTimeout","enteringTimeout","restartTimeout","shouldLeave","current","cancelAnimationFrame","clearTimeout","setLeft","setLeaving","window","setTimeout","setEntered","deactivate","activate","requestAnimationFrame","animation","undefined","style"],"sources":["../../../src/Ripple/useRipple.ts"],"sourcesContent":["import { useState, useRef, useEffect } from 'react';\r\n\r\nimport { radiusIn, opacityIn, opacityOut } from './keyframes';\r\nimport {\r\n  RIPPLE_TRANSLATE_START,\r\n  RIPPLE_TRANSLATE_END,\r\n  RIPPLE_OPACITY_END,\r\n  RIPPLE_SCALE_END,\r\n  RIPPLE_SIZE,\r\n  RIPPLE_BACKGROUND_COLOR,\r\n  RIPPLE_POSITION,\r\n} from './constants';\r\n\r\nconst defaultRipple = {\r\n  x: 0,\r\n  y: 0,\r\n  size: 0,\r\n  scale: 0,\r\n  centerX: 0,\r\n  centerY: 0,\r\n};\r\n\r\n// Surface diameter is treated differently for unbounded vs. bounded ripples.\r\n// Unbounded ripple diameter is calculated smaller since the surface is expected to already be padded appropriately\r\n// to extend the hitbox, and the ripple is expected to meet the edges of the padded hitbox (which is typically\r\n// square). Bounded ripples, on the other hand, are fully expected to expand beyond the surface's longest diameter\r\n// (calculated based on the diagonal plus a constant padding), and are clipped at the surface's border via\r\n// `overflow: hidden`.\r\nconst getBoundedRadius = (rect: ClientRect, padding: number) => {\r\n  const hypotenuse = Math.sqrt(\r\n    Math.pow(rect.width, 2) + Math.pow(rect.height, 2)\r\n  );\r\n  return hypotenuse + padding;\r\n};\r\n\r\nfunction getScale(rect: ClientRect) {\r\n  const maxDim = Math.max(rect.height, rect.width);\r\n  const padding = 10;\r\n  const initialOriginScale = 0.6;\r\n  const maxRadius = getBoundedRadius(rect, padding);\r\n\r\n  // Ripple is sized as a fraction of the largest dimension of the surface, then scales up using a CSS scale transform\r\n  const initialSize = Math.floor(maxDim * initialOriginScale);\r\n\r\n  return {\r\n    size: initialSize,\r\n    scale: maxRadius / initialSize,\r\n    centerX: rect.width / 2,\r\n    centerY: rect.height / 2,\r\n  };\r\n}\r\n\r\nfunction calculateRipplePosition(\r\n  rect: ClientRect,\r\n  clientX: number,\r\n  clientY: number,\r\n  center = false\r\n) {\r\n  const rippleStart = center\r\n    ? {\r\n        x: rect.width / 2,\r\n        y: rect.height / 2,\r\n      }\r\n    : {\r\n        x: clientX - rect.left,\r\n        y: clientY - rect.top,\r\n      };\r\n\r\n  return {\r\n    state: 'entering' as const,\r\n    ...rippleStart,\r\n    ...getScale(rect),\r\n  };\r\n}\r\n\r\nexport interface RippleOptions {\r\n  opacity: number;\r\n  backgroundColor: string;\r\n  enterDuration?: number;\r\n  leaveDuration?: number;\r\n  center?: boolean;\r\n  disabled?: boolean;\r\n}\r\n\r\nexport const useRipple = (opts: RippleOptions) => {\r\n  const {\r\n    opacity,\r\n    backgroundColor,\r\n    enterDuration = 225,\r\n    leaveDuration = 150,\r\n  } = opts;\r\n\r\n  // rippleState must be a ref, because it accesses the current value\r\n  // inside closures... if we use state, it's gonna recapture\r\n  // the state variable and won't work correctly\r\n  const rippleState = useRef(\r\n    'left' as 'entering' | 'entered' | 'leaving' | 'left' | 'restart'\r\n  );\r\n  const [ripple, setRipple] = useState(defaultRipple);\r\n  const leavingTimeout = useRef<number>();\r\n  const enteringTimeout = useRef<number>();\r\n  const restartTimeout = useRef<number>();\r\n\r\n  const shouldLeave = useRef(false);\r\n\r\n  // clear timeouts to avoid setting state on unmounted component\r\n  useEffect(() => {\r\n    return () => {\r\n      restartTimeout.current && cancelAnimationFrame(restartTimeout.current);\r\n      clearTimeout(enteringTimeout.current);\r\n      clearTimeout(leavingTimeout.current);\r\n    };\r\n  }, []);\r\n\r\n  // State handling\r\n  const setLeft = () => {\r\n    rippleState.current = 'left';\r\n    setRipple({ ...defaultRipple });\r\n  };\r\n\r\n  const setLeaving = () => {\r\n    clearTimeout(enteringTimeout.current);\r\n    rippleState.current = 'leaving';\r\n    setRipple((ripple) => ({\r\n      ...ripple,\r\n    }));\r\n\r\n    leavingTimeout.current = window.setTimeout(setLeft, leaveDuration);\r\n  };\r\n\r\n  const setEntered = () => {\r\n    rippleState.current = 'entered';\r\n    setRipple((ripple) => ({\r\n      ...ripple,\r\n    }));\r\n\r\n    if (shouldLeave.current) {\r\n      setLeaving();\r\n    }\r\n  };\r\n\r\n  const deactivate = () => {\r\n    shouldLeave.current = true;\r\n    if (rippleState.current === 'entered') {\r\n      setLeaving();\r\n    }\r\n  };\r\n\r\n  const activate = (\r\n    rect: ClientRect,\r\n    clientX: number,\r\n    clientY: number,\r\n    center = false\r\n  ) => {\r\n    clearTimeout(leavingTimeout.current);\r\n    clearTimeout(enteringTimeout.current);\r\n    shouldLeave.current = false;\r\n\r\n    rippleState.current = 'restart';\r\n    setRipple({ ...defaultRipple });\r\n    restartTimeout.current = requestAnimationFrame(() => {\r\n      rippleState.current = 'entering';\r\n      setRipple(calculateRipplePosition(rect, clientX, clientY, center));\r\n\r\n      enteringTimeout.current = window.setTimeout(setEntered, enterDuration);\r\n    });\r\n  };\r\n\r\n  // Styling\r\n  let animation: string | undefined = undefined;\r\n  switch (rippleState.current) {\r\n    case 'entering':\r\n    case 'entered':\r\n      animation =\r\n        `${radiusIn} ${enterDuration}ms forwards,` +\r\n        `${opacityIn} ${enterDuration / 3}ms forwards`;\r\n      break;\r\n    case 'leaving':\r\n      animation =\r\n        `${radiusIn} ${enterDuration}ms forwards,` +\r\n        `${opacityOut} ${leaveDuration}ms forwards`;\r\n      break;\r\n  }\r\n\r\n  let style = {};\r\n  switch (rippleState.current) {\r\n    case 'entering':\r\n    case 'entered':\r\n    case 'leaving':\r\n      style = {\r\n        [RIPPLE_SIZE]: `${ripple.size}px`,\r\n        [RIPPLE_POSITION]: `${-ripple.size / 2}px`,\r\n        [RIPPLE_BACKGROUND_COLOR]: backgroundColor,\r\n        [RIPPLE_TRANSLATE_START]: `${ripple.x}px, ${ripple.y}px`,\r\n        [RIPPLE_TRANSLATE_END]: `${ripple.centerX}px, ${ripple.centerY}px`,\r\n        [RIPPLE_OPACITY_END]: opacity,\r\n        [RIPPLE_SCALE_END]: `${ripple.scale}`,\r\n      };\r\n      break;\r\n  }\r\n\r\n  return {\r\n    activate,\r\n    deactivate,\r\n    style,\r\n    animation,\r\n    // key: counter,\r\n  };\r\n};\r\n"],"mappings":";;;AAAA,SAASA,QAAT,EAAmBC,MAAnB,EAA2BC,SAA3B,QAA4C,OAA5C;AAEA,SAASC,QAAT,EAAmBC,SAAnB,EAA8BC,UAA9B,QAAgD,aAAhD;AACA,SACEC,sBADF,EAEEC,oBAFF,EAGEC,kBAHF,EAIEC,gBAJF,EAKEC,WALF,EAMEC,uBANF,EAOEC,eAPF,QAQO,aARP;AAUA,IAAMC,aAAa,GAAG;EACpBC,CAAC,EAAE,CADiB;EAEpBC,CAAC,EAAE,CAFiB;EAGpBC,IAAI,EAAE,CAHc;EAIpBC,KAAK,EAAE,CAJa;EAKpBC,OAAO,EAAE,CALW;EAMpBC,OAAO,EAAE;AANW,CAAtB,C,CASA;AACA;AACA;AACA;AACA;AACA;;AACA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,IAAD,EAAmBC,OAAnB,EAAuC;EAC9D,IAAMC,UAAU,GAAGC,IAAI,CAACC,IAAL,CACjBD,IAAI,CAACE,GAAL,CAASL,IAAI,CAACM,KAAd,EAAqB,CAArB,IAA0BH,IAAI,CAACE,GAAL,CAASL,IAAI,CAACO,MAAd,EAAsB,CAAtB,CADT,CAAnB;EAGA,OAAOL,UAAU,GAAGD,OAApB;AACD,CALD;;AAOA,SAASO,QAAT,CAAkBR,IAAlB,EAAoC;EAClC,IAAMS,MAAM,GAAGN,IAAI,CAACO,GAAL,CAASV,IAAI,CAACO,MAAd,EAAsBP,IAAI,CAACM,KAA3B,CAAf;EACA,IAAML,OAAO,GAAG,EAAhB;EACA,IAAMU,kBAAkB,GAAG,GAA3B;EACA,IAAMC,SAAS,GAAGb,gBAAgB,CAACC,IAAD,EAAOC,OAAP,CAAlC,CAJkC,CAMlC;;EACA,IAAMY,WAAW,GAAGV,IAAI,CAACW,KAAL,CAAWL,MAAM,GAAGE,kBAApB,CAApB;EAEA,OAAO;IACLhB,IAAI,EAAEkB,WADD;IAELjB,KAAK,EAAEgB,SAAS,GAAGC,WAFd;IAGLhB,OAAO,EAAEG,IAAI,CAACM,KAAL,GAAa,CAHjB;IAILR,OAAO,EAAEE,IAAI,CAACO,MAAL,GAAc;EAJlB,CAAP;AAMD;;AAED,SAASQ,uBAAT,CACEf,IADF,EAEEgB,OAFF,EAGEC,OAHF,EAKE;EAAA,IADAC,MACA,uEADS,KACT;EACA,IAAMC,WAAW,GAAGD,MAAM,GACtB;IACEzB,CAAC,EAAEO,IAAI,CAACM,KAAL,GAAa,CADlB;IAEEZ,CAAC,EAAEM,IAAI,CAACO,MAAL,GAAc;EAFnB,CADsB,GAKtB;IACEd,CAAC,EAAEuB,OAAO,GAAGhB,IAAI,CAACoB,IADpB;IAEE1B,CAAC,EAAEuB,OAAO,GAAGjB,IAAI,CAACqB;EAFpB,CALJ;EAUA;IACEC,KAAK,EAAE;EADT,GAEKH,WAFL,GAGKX,QAAQ,CAACR,IAAD,CAHb;AAKD;;AAWD,OAAO,IAAMuB,SAAS,GAAG,SAAZA,SAAY,CAACC,IAAD,EAAyB;EAAA;;EAChD,IACEC,OADF,GAKID,IALJ,CACEC,OADF;EAAA,IAEEC,eAFF,GAKIF,IALJ,CAEEE,eAFF;EAAA,0BAKIF,IALJ,CAGEG,aAHF;EAAA,IAGEA,aAHF,oCAGkB,GAHlB;EAAA,0BAKIH,IALJ,CAIEI,aAJF;EAAA,IAIEA,aAJF,oCAIkB,GAJlB,uBADgD,CAQhD;EACA;EACA;;EACA,IAAMC,WAAW,GAAGjD,MAAM,CACxB,MADwB,CAA1B;;EAGA,gBAA4BD,QAAQ,CAACa,aAAD,CAApC;EAAA;EAAA,IAAOsC,MAAP;EAAA,IAAeC,SAAf;;EACA,IAAMC,cAAc,GAAGpD,MAAM,EAA7B;EACA,IAAMqD,eAAe,GAAGrD,MAAM,EAA9B;EACA,IAAMsD,cAAc,GAAGtD,MAAM,EAA7B;EAEA,IAAMuD,WAAW,GAAGvD,MAAM,CAAC,KAAD,CAA1B,CAnBgD,CAqBhD;;EACAC,SAAS,CAAC,YAAM;IACd,OAAO,YAAM;MACXqD,cAAc,CAACE,OAAf,IAA0BC,oBAAoB,CAACH,cAAc,CAACE,OAAhB,CAA9C;MACAE,YAAY,CAACL,eAAe,CAACG,OAAjB,CAAZ;MACAE,YAAY,CAACN,cAAc,CAACI,OAAhB,CAAZ;IACD,CAJD;EAKD,CANQ,EAMN,EANM,CAAT,CAtBgD,CA8BhD;;EACA,IAAMG,OAAO,GAAG,SAAVA,OAAU,GAAM;IACpBV,WAAW,CAACO,OAAZ,GAAsB,MAAtB;IACAL,SAAS,cAAMvC,aAAN,EAAT;EACD,CAHD;;EAKA,IAAMgD,UAAU,GAAG,SAAbA,UAAa,GAAM;IACvBF,YAAY,CAACL,eAAe,CAACG,OAAjB,CAAZ;IACAP,WAAW,CAACO,OAAZ,GAAsB,SAAtB;IACAL,SAAS,CAAC,UAACD,MAAD;MAAA,oBACLA,MADK;IAAA,CAAD,CAAT;IAIAE,cAAc,CAACI,OAAf,GAAyBK,MAAM,CAACC,UAAP,CAAkBH,OAAlB,EAA2BX,aAA3B,CAAzB;EACD,CARD;;EAUA,IAAMe,UAAU,GAAG,SAAbA,UAAa,GAAM;IACvBd,WAAW,CAACO,OAAZ,GAAsB,SAAtB;IACAL,SAAS,CAAC,UAACD,MAAD;MAAA,oBACLA,MADK;IAAA,CAAD,CAAT;;IAIA,IAAIK,WAAW,CAACC,OAAhB,EAAyB;MACvBI,UAAU;IACX;EACF,CATD;;EAWA,IAAMI,UAAU,GAAG,SAAbA,UAAa,GAAM;IACvBT,WAAW,CAACC,OAAZ,GAAsB,IAAtB;;IACA,IAAIP,WAAW,CAACO,OAAZ,KAAwB,SAA5B,EAAuC;MACrCI,UAAU;IACX;EACF,CALD;;EAOA,IAAMK,QAAQ,GAAG,SAAXA,QAAW,CACf7C,IADe,EAEfgB,OAFe,EAGfC,OAHe,EAKZ;IAAA,IADHC,MACG,uEADM,KACN;IACHoB,YAAY,CAACN,cAAc,CAACI,OAAhB,CAAZ;IACAE,YAAY,CAACL,eAAe,CAACG,OAAjB,CAAZ;IACAD,WAAW,CAACC,OAAZ,GAAsB,KAAtB;IAEAP,WAAW,CAACO,OAAZ,GAAsB,SAAtB;IACAL,SAAS,cAAMvC,aAAN,EAAT;IACA0C,cAAc,CAACE,OAAf,GAAyBU,qBAAqB,CAAC,YAAM;MACnDjB,WAAW,CAACO,OAAZ,GAAsB,UAAtB;MACAL,SAAS,CAAChB,uBAAuB,CAACf,IAAD,EAAOgB,OAAP,EAAgBC,OAAhB,EAAyBC,MAAzB,CAAxB,CAAT;MAEAe,eAAe,CAACG,OAAhB,GAA0BK,MAAM,CAACC,UAAP,CAAkBC,UAAlB,EAA8BhB,aAA9B,CAA1B;IACD,CAL6C,CAA9C;EAMD,CAlBD,CAhEgD,CAoFhD;;;EACA,IAAIoB,SAA6B,GAAGC,SAApC;;EACA,QAAQnB,WAAW,CAACO,OAApB;IACE,KAAK,UAAL;IACA,KAAK,SAAL;MACEW,SAAS,GACP,UAAGjE,QAAH,cAAe6C,aAAf,8BACG5C,SADH,cACgB4C,aAAa,GAAG,CADhC,gBADF;MAGA;;IACF,KAAK,SAAL;MACEoB,SAAS,GACP,UAAGjE,QAAH,cAAe6C,aAAf,8BACG3C,UADH,cACiB4C,aADjB,gBADF;MAGA;EAXJ;;EAcA,IAAIqB,KAAK,GAAG,EAAZ;;EACA,QAAQpB,WAAW,CAACO,OAApB;IACE,KAAK,UAAL;IACA,KAAK,SAAL;IACA,KAAK,SAAL;MACEa,KAAK,yCACF5D,WADE,YACeyC,MAAM,CAACnC,IADtB,kCAEFJ,eAFE,YAEmB,CAACuC,MAAM,CAACnC,IAAR,GAAe,CAFlC,kCAGFL,uBAHE,EAGwBoC,eAHxB,2BAIFzC,sBAJE,YAI0B6C,MAAM,CAACrC,CAJjC,iBAIyCqC,MAAM,CAACpC,CAJhD,kCAKFR,oBALE,YAKwB4C,MAAM,CAACjC,OAL/B,iBAK6CiC,MAAM,CAAChC,OALpD,kCAMFX,kBANE,EAMmBsC,OANnB,2BAOFrC,gBAPE,YAOoB0C,MAAM,CAAClC,KAP3B,WAAL;MASA;EAbJ;;EAgBA,OAAO;IACLiD,QAAQ,EAARA,QADK;IAELD,UAAU,EAAVA,UAFK;IAGLK,KAAK,EAALA,KAHK;IAILF,SAAS,EAATA,SAJK,CAKL;;EALK,CAAP;AAOD,CA5HM"}
+{"version":3,"file":"useRipple.js","names":["useState","useRef","useEffect","radiusIn","opacityIn","opacityOut","RIPPLE_TRANSLATE_START","RIPPLE_TRANSLATE_END","RIPPLE_OPACITY_END","RIPPLE_SCALE_END","RIPPLE_SIZE","RIPPLE_BACKGROUND_COLOR","RIPPLE_POSITION","defaultRipple","x","y","size","scale","centerX","centerY","getBoundedRadius","rect","padding","hypotenuse","Math","sqrt","pow","width","height","getScale","maxDim","max","initialOriginScale","maxRadius","initialSize","floor","calculateRipplePosition","clientX","clientY","center","rippleStart","left","top","state","useRipple","opts","opacity","backgroundColor","enterDuration","leaveDuration","rippleState","ripple","setRipple","leavingTimeout","enteringTimeout","restartTimeout","shouldLeave","current","cancelAnimationFrame","clearTimeout","setLeft","setLeaving","window","setTimeout","setEntered","deactivate","activate","requestAnimationFrame","animation","undefined","style"],"sources":["../../../src/Ripple/useRipple.ts"],"sourcesContent":["import { useState, useRef, useEffect } from 'react';\n\nimport { radiusIn, opacityIn, opacityOut } from './keyframes';\nimport {\n  RIPPLE_TRANSLATE_START,\n  RIPPLE_TRANSLATE_END,\n  RIPPLE_OPACITY_END,\n  RIPPLE_SCALE_END,\n  RIPPLE_SIZE,\n  RIPPLE_BACKGROUND_COLOR,\n  RIPPLE_POSITION,\n} from './constants';\n\nconst defaultRipple = {\n  x: 0,\n  y: 0,\n  size: 0,\n  scale: 0,\n  centerX: 0,\n  centerY: 0,\n};\n\n// Surface diameter is treated differently for unbounded vs. bounded ripples.\n// Unbounded ripple diameter is calculated smaller since the surface is expected to already be padded appropriately\n// to extend the hitbox, and the ripple is expected to meet the edges of the padded hitbox (which is typically\n// square). Bounded ripples, on the other hand, are fully expected to expand beyond the surface's longest diameter\n// (calculated based on the diagonal plus a constant padding), and are clipped at the surface's border via\n// `overflow: hidden`.\nconst getBoundedRadius = (rect: ClientRect, padding: number) => {\n  const hypotenuse = Math.sqrt(\n    Math.pow(rect.width, 2) + Math.pow(rect.height, 2)\n  );\n  return hypotenuse + padding;\n};\n\nfunction getScale(rect: ClientRect) {\n  const maxDim = Math.max(rect.height, rect.width);\n  const padding = 10;\n  const initialOriginScale = 0.6;\n  const maxRadius = getBoundedRadius(rect, padding);\n\n  // Ripple is sized as a fraction of the largest dimension of the surface, then scales up using a CSS scale transform\n  const initialSize = Math.floor(maxDim * initialOriginScale);\n\n  return {\n    size: initialSize,\n    scale: maxRadius / initialSize,\n    centerX: rect.width / 2,\n    centerY: rect.height / 2,\n  };\n}\n\nfunction calculateRipplePosition(\n  rect: ClientRect,\n  clientX: number,\n  clientY: number,\n  center = false\n) {\n  const rippleStart = center\n    ? {\n        x: rect.width / 2,\n        y: rect.height / 2,\n      }\n    : {\n        x: clientX - rect.left,\n        y: clientY - rect.top,\n      };\n\n  return {\n    state: 'entering' as const,\n    ...rippleStart,\n    ...getScale(rect),\n  };\n}\n\nexport interface RippleOptions {\n  opacity: number;\n  backgroundColor: string;\n  enterDuration?: number;\n  leaveDuration?: number;\n  center?: boolean;\n  disabled?: boolean;\n}\n\nexport const useRipple = (opts: RippleOptions) => {\n  const {\n    opacity,\n    backgroundColor,\n    enterDuration = 225,\n    leaveDuration = 150,\n  } = opts;\n\n  // rippleState must be a ref, because it accesses the current value\n  // inside closures... if we use state, it's gonna recapture\n  // the state variable and won't work correctly\n  const rippleState = useRef(\n    'left' as 'entering' | 'entered' | 'leaving' | 'left' | 'restart'\n  );\n  const [ripple, setRipple] = useState(defaultRipple);\n  const leavingTimeout = useRef<number>();\n  const enteringTimeout = useRef<number>();\n  const restartTimeout = useRef<number>();\n\n  const shouldLeave = useRef(false);\n\n  // clear timeouts to avoid setting state on unmounted component\n  useEffect(() => {\n    return () => {\n      restartTimeout.current && cancelAnimationFrame(restartTimeout.current);\n      clearTimeout(enteringTimeout.current);\n      clearTimeout(leavingTimeout.current);\n    };\n  }, []);\n\n  // State handling\n  const setLeft = () => {\n    rippleState.current = 'left';\n    setRipple({ ...defaultRipple });\n  };\n\n  const setLeaving = () => {\n    clearTimeout(enteringTimeout.current);\n    rippleState.current = 'leaving';\n    setRipple((ripple) => ({\n      ...ripple,\n    }));\n\n    leavingTimeout.current = window.setTimeout(setLeft, leaveDuration);\n  };\n\n  const setEntered = () => {\n    rippleState.current = 'entered';\n    setRipple((ripple) => ({\n      ...ripple,\n    }));\n\n    if (shouldLeave.current) {\n      setLeaving();\n    }\n  };\n\n  const deactivate = () => {\n    shouldLeave.current = true;\n    if (rippleState.current === 'entered') {\n      setLeaving();\n    }\n  };\n\n  const activate = (\n    rect: ClientRect,\n    clientX: number,\n    clientY: number,\n    center = false\n  ) => {\n    clearTimeout(leavingTimeout.current);\n    clearTimeout(enteringTimeout.current);\n    shouldLeave.current = false;\n\n    rippleState.current = 'restart';\n    setRipple({ ...defaultRipple });\n    restartTimeout.current = requestAnimationFrame(() => {\n      rippleState.current = 'entering';\n      setRipple(calculateRipplePosition(rect, clientX, clientY, center));\n\n      enteringTimeout.current = window.setTimeout(setEntered, enterDuration);\n    });\n  };\n\n  // Styling\n  let animation: string | undefined = undefined;\n  switch (rippleState.current) {\n    case 'entering':\n    case 'entered':\n      animation =\n        `${radiusIn} ${enterDuration}ms forwards,` +\n        `${opacityIn} ${enterDuration / 3}ms forwards`;\n      break;\n    case 'leaving':\n      animation =\n        `${radiusIn} ${enterDuration}ms forwards,` +\n        `${opacityOut} ${leaveDuration}ms forwards`;\n      break;\n  }\n\n  let style = {};\n  switch (rippleState.current) {\n    case 'entering':\n    case 'entered':\n    case 'leaving':\n      style = {\n        [RIPPLE_SIZE]: `${ripple.size}px`,\n        [RIPPLE_POSITION]: `${-ripple.size / 2}px`,\n        [RIPPLE_BACKGROUND_COLOR]: backgroundColor,\n        [RIPPLE_TRANSLATE_START]: `${ripple.x}px, ${ripple.y}px`,\n        [RIPPLE_TRANSLATE_END]: `${ripple.centerX}px, ${ripple.centerY}px`,\n        [RIPPLE_OPACITY_END]: opacity,\n        [RIPPLE_SCALE_END]: `${ripple.scale}`,\n      };\n      break;\n  }\n\n  return {\n    activate,\n    deactivate,\n    style,\n    animation,\n    // key: counter,\n  };\n};\n"],"mappings":"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"}

package/build/esm/Ripple/useRippleHandlers.d.ts

@@ -1,8 +1,8 @@
-import type { KeyboardEvent as ReactKeyboardEvent, PointerEvent } from 'react';
-import type { RippleOptions } from './useRipple';
-export declare function useRippleHandlers<T extends HTMLElement>(opts: RippleOptions): {
-    style: {};
-    animation: string | undefined;
-    handleKeyDown: (e: ReactKeyboardEvent<T>) => void;
-    handlePointerDown: (e: PointerEvent<T>) => void;
-};
+import type { KeyboardEvent as ReactKeyboardEvent, PointerEvent } from 'react';
+import type { RippleOptions } from './useRipple';
+export declare function useRippleHandlers<T extends HTMLElement>(opts: RippleOptions): {
+    style: {};
+    animation: string | undefined;
+    handleKeyDown: (e: ReactKeyboardEvent<T>) => void;
+    handlePointerDown: (e: PointerEvent<T>) => void;
+};

package/build/esm/Ripple/useRippleHandlers.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRippleHandlers.js","names":["useRef","useRipple","disabledHandler","useRippleHandlers","opts","activate","deactivate","rest","handlePointerUp","window","removeEventListener","handlePointerDown","e","rect","currentTarget","getBoundingClientRect","clientX","clientY","center","addEventListener","keyReleased","handleKeyUp","key","current","handleKeyDown","disabled"],"sources":["../../../src/Ripple/useRippleHandlers.ts"],"sourcesContent":["import type { KeyboardEvent as ReactKeyboardEvent, PointerEvent } from 'react';\r\nimport { useRef } from 'react';\r\n\r\nimport type { RippleOptions } from './useRipple';\r\nimport { useRipple } from './useRipple';\r\n\r\nconst disabledHandler = () => {\r\n  /* When disabled, we don't wanna handle neither keyDown, nor pointerDown */\r\n};\r\n\r\nexport function useRippleHandlers<T extends HTMLElement>(opts: RippleOptions) {\r\n  const { activate, deactivate, ...rest } = useRipple(opts);\r\n\r\n  // Pointer activation\r\n  const handlePointerUp = () => {\r\n    window.removeEventListener('pointerup', handlePointerUp);\r\n    window.removeEventListener('pointercancel', handlePointerUp);\r\n    deactivate();\r\n  };\r\n\r\n  const handlePointerDown = (e: PointerEvent<T>) => {\r\n    const rect = e.currentTarget.getBoundingClientRect();\r\n    activate(rect, e.clientX, e.clientY, opts.center);\r\n    window.addEventListener('pointerup', handlePointerUp);\r\n    window.addEventListener('pointercancel', handlePointerUp);\r\n  };\r\n\r\n  // Keyboard activation\r\n  const keyReleased = useRef(true);\r\n  const handleKeyUp = (e: KeyboardEvent) => {\r\n    if (e.key !== ' ') {\r\n      return;\r\n    }\r\n    window.removeEventListener('keyup', handleKeyUp);\r\n    keyReleased.current = true;\r\n    deactivate();\r\n  };\r\n\r\n  const handleKeyDown = (e: ReactKeyboardEvent<T>) => {\r\n    if (e.key !== ' ' || !keyReleased.current) {\r\n      return;\r\n    }\r\n    const rect = e.currentTarget.getBoundingClientRect();\r\n    keyReleased.current = false;\r\n    activate(rect, 0, 0, true);\r\n    window.addEventListener('keyup', handleKeyUp);\r\n  };\r\n\r\n  return {\r\n    handleKeyDown: opts.disabled ? disabledHandler : handleKeyDown,\r\n    handlePointerDown: opts.disabled ? disabledHandler : handlePointerDown,\r\n    ...rest,\r\n  };\r\n}\r\n"],"mappings":";;;AACA,SAASA,MAAT,QAAuB,OAAvB;AAGA,SAASC,SAAT,QAA0B,aAA1B;;AAEA,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,GAAM;EAC5B;AACD,CAFD;;AAIA,OAAO,SAASC,iBAAT,CAAkDC,IAAlD,EAAuE;EAC5E,iBAA0CH,SAAS,CAACG,IAAD,CAAnD;EAAA,IAAQC,QAAR,cAAQA,QAAR;EAAA,IAAkBC,UAAlB,cAAkBA,UAAlB;EAAA,IAAiCC,IAAjC,mDAD4E,CAG5E;;;EACA,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,GAAM;IAC5BC,MAAM,CAACC,mBAAP,CAA2B,WAA3B,EAAwCF,eAAxC;IACAC,MAAM,CAACC,mBAAP,CAA2B,eAA3B,EAA4CF,eAA5C;IACAF,UAAU;EACX,CAJD;;EAMA,IAAMK,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,CAAD,EAAwB;IAChD,IAAMC,IAAI,GAAGD,CAAC,CAACE,aAAF,CAAgBC,qBAAhB,EAAb;IACAV,QAAQ,CAACQ,IAAD,EAAOD,CAAC,CAACI,OAAT,EAAkBJ,CAAC,CAACK,OAApB,EAA6Bb,IAAI,CAACc,MAAlC,CAAR;IACAT,MAAM,CAACU,gBAAP,CAAwB,WAAxB,EAAqCX,eAArC;IACAC,MAAM,CAACU,gBAAP,CAAwB,eAAxB,EAAyCX,eAAzC;EACD,CALD,CAV4E,CAiB5E;;;EACA,IAAMY,WAAW,GAAGpB,MAAM,CAAC,IAAD,CAA1B;;EACA,IAAMqB,WAAW,GAAG,SAAdA,WAAc,CAACT,CAAD,EAAsB;IACxC,IAAIA,CAAC,CAACU,GAAF,KAAU,GAAd,EAAmB;MACjB;IACD;;IACDb,MAAM,CAACC,mBAAP,CAA2B,OAA3B,EAAoCW,WAApC;IACAD,WAAW,CAACG,OAAZ,GAAsB,IAAtB;IACAjB,UAAU;EACX,CAPD;;EASA,IAAMkB,aAAa,GAAG,SAAhBA,aAAgB,CAACZ,CAAD,EAA8B;IAClD,IAAIA,CAAC,CAACU,GAAF,KAAU,GAAV,IAAiB,CAACF,WAAW,CAACG,OAAlC,EAA2C;MACzC;IACD;;IACD,IAAMV,IAAI,GAAGD,CAAC,CAACE,aAAF,CAAgBC,qBAAhB,EAAb;IACAK,WAAW,CAACG,OAAZ,GAAsB,KAAtB;IACAlB,QAAQ,CAACQ,IAAD,EAAO,CAAP,EAAU,CAAV,EAAa,IAAb,CAAR;IACAJ,MAAM,CAACU,gBAAP,CAAwB,OAAxB,EAAiCE,WAAjC;EACD,CARD;;EAUA;IACEG,aAAa,EAAEpB,IAAI,CAACqB,QAAL,GAAgBvB,eAAhB,GAAkCsB,aADnD;IAEEb,iBAAiB,EAAEP,IAAI,CAACqB,QAAL,GAAgBvB,eAAhB,GAAkCS;EAFvD,GAGKJ,IAHL;AAKD"}
+{"version":3,"file":"useRippleHandlers.js","names":["useRef","useRipple","disabledHandler","useRippleHandlers","opts","activate","deactivate","rest","handlePointerUp","window","removeEventListener","handlePointerDown","e","rect","currentTarget","getBoundingClientRect","clientX","clientY","center","addEventListener","keyReleased","handleKeyUp","key","current","handleKeyDown","disabled"],"sources":["../../../src/Ripple/useRippleHandlers.ts"],"sourcesContent":["import type { KeyboardEvent as ReactKeyboardEvent, PointerEvent } from 'react';\nimport { useRef } from 'react';\n\nimport type { RippleOptions } from './useRipple';\nimport { useRipple } from './useRipple';\n\nconst disabledHandler = () => {\n  /* When disabled, we don't wanna handle neither keyDown, nor pointerDown */\n};\n\nexport function useRippleHandlers<T extends HTMLElement>(opts: RippleOptions) {\n  const { activate, deactivate, ...rest } = useRipple(opts);\n\n  // Pointer activation\n  const handlePointerUp = () => {\n    window.removeEventListener('pointerup', handlePointerUp);\n    window.removeEventListener('pointercancel', handlePointerUp);\n    deactivate();\n  };\n\n  const handlePointerDown = (e: PointerEvent<T>) => {\n    const rect = e.currentTarget.getBoundingClientRect();\n    activate(rect, e.clientX, e.clientY, opts.center);\n    window.addEventListener('pointerup', handlePointerUp);\n    window.addEventListener('pointercancel', handlePointerUp);\n  };\n\n  // Keyboard activation\n  const keyReleased = useRef(true);\n  const handleKeyUp = (e: KeyboardEvent) => {\n    if (e.key !== ' ') {\n      return;\n    }\n    window.removeEventListener('keyup', handleKeyUp);\n    keyReleased.current = true;\n    deactivate();\n  };\n\n  const handleKeyDown = (e: ReactKeyboardEvent<T>) => {\n    if (e.key !== ' ' || !keyReleased.current) {\n      return;\n    }\n    const rect = e.currentTarget.getBoundingClientRect();\n    keyReleased.current = false;\n    activate(rect, 0, 0, true);\n    window.addEventListener('keyup', handleKeyUp);\n  };\n\n  return {\n    handleKeyDown: opts.disabled ? disabledHandler : handleKeyDown,\n    handlePointerDown: opts.disabled ? disabledHandler : handlePointerDown,\n    ...rest,\n  };\n}\n"],"mappings":";;;AACA,SAASA,MAAT,QAAuB,OAAvB;AAGA,SAASC,SAAT,QAA0B,aAA1B;;AAEA,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,GAAM;EAC5B;AACD,CAFD;;AAIA,OAAO,SAASC,iBAAT,CAAkDC,IAAlD,EAAuE;EAC5E,iBAA0CH,SAAS,CAACG,IAAD,CAAnD;EAAA,IAAQC,QAAR,cAAQA,QAAR;EAAA,IAAkBC,UAAlB,cAAkBA,UAAlB;EAAA,IAAiCC,IAAjC,mDAD4E,CAG5E;;;EACA,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,GAAM;IAC5BC,MAAM,CAACC,mBAAP,CAA2B,WAA3B,EAAwCF,eAAxC;IACAC,MAAM,CAACC,mBAAP,CAA2B,eAA3B,EAA4CF,eAA5C;IACAF,UAAU;EACX,CAJD;;EAMA,IAAMK,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,CAAD,EAAwB;IAChD,IAAMC,IAAI,GAAGD,CAAC,CAACE,aAAF,CAAgBC,qBAAhB,EAAb;IACAV,QAAQ,CAACQ,IAAD,EAAOD,CAAC,CAACI,OAAT,EAAkBJ,CAAC,CAACK,OAApB,EAA6Bb,IAAI,CAACc,MAAlC,CAAR;IACAT,MAAM,CAACU,gBAAP,CAAwB,WAAxB,EAAqCX,eAArC;IACAC,MAAM,CAACU,gBAAP,CAAwB,eAAxB,EAAyCX,eAAzC;EACD,CALD,CAV4E,CAiB5E;;;EACA,IAAMY,WAAW,GAAGpB,MAAM,CAAC,IAAD,CAA1B;;EACA,IAAMqB,WAAW,GAAG,SAAdA,WAAc,CAACT,CAAD,EAAsB;IACxC,IAAIA,CAAC,CAACU,GAAF,KAAU,GAAd,EAAmB;MACjB;IACD;;IACDb,MAAM,CAACC,mBAAP,CAA2B,OAA3B,EAAoCW,WAApC;IACAD,WAAW,CAACG,OAAZ,GAAsB,IAAtB;IACAjB,UAAU;EACX,CAPD;;EASA,IAAMkB,aAAa,GAAG,SAAhBA,aAAgB,CAACZ,CAAD,EAA8B;IAClD,IAAIA,CAAC,CAACU,GAAF,KAAU,GAAV,IAAiB,CAACF,WAAW,CAACG,OAAlC,EAA2C;MACzC;IACD;;IACD,IAAMV,IAAI,GAAGD,CAAC,CAACE,aAAF,CAAgBC,qBAAhB,EAAb;IACAK,WAAW,CAACG,OAAZ,GAAsB,KAAtB;IACAlB,QAAQ,CAACQ,IAAD,EAAO,CAAP,EAAU,CAAV,EAAa,IAAb,CAAR;IACAJ,MAAM,CAACU,gBAAP,CAAwB,OAAxB,EAAiCE,WAAjC;EACD,CARD;;EAUA;IACEG,aAAa,EAAEpB,IAAI,CAACqB,QAAL,GAAgBvB,eAAhB,GAAkCsB,aADnD;IAEEb,iBAAiB,EAAEP,IAAI,CAACqB,QAAL,GAAgBvB,eAAhB,GAAkCS;EAFvD,GAGKJ,IAHL;AAKD"}