@ringcentral/juno 2.3.7 → 2.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Downshift/SuggestionList/SuggestionList.js +4 -1
- package/components/Menu/SubMenu/styles/SubMenuStyle.d.ts +1 -1
- package/components/Menu/SubMenu/styles/SubMenuStyle.js +2 -2
- package/components/VirtualizedMenu/VirtualizedMenuList.js +1 -7
- package/components/Virtuoso/utils/useHighlightScroll.d.ts +4 -0
- package/components/Virtuoso/utils/useHighlightScroll.js +17 -0
- package/es6/components/Downshift/SuggestionList/SuggestionList.js +5 -2
- package/es6/components/Menu/SubMenu/styles/SubMenuStyle.js +2 -2
- package/es6/components/VirtualizedMenu/VirtualizedMenuList.js +2 -8
- package/es6/components/Virtuoso/utils/useHighlightScroll.js +16 -0
- package/es6/foundation/index.js +1 -0
- package/es6/foundation/isWebKit154.js +57 -0
- package/es6/foundation/theme/ThemeProvider.js +7 -3
- package/foundation/index.d.ts +1 -0
- package/foundation/index.js +1 -0
- package/foundation/isWebKit154.d.ts +20 -0
- package/foundation/isWebKit154.js +59 -0
- package/foundation/theme/ThemeProvider.d.ts +6 -0
- package/foundation/theme/ThemeProvider.js +7 -3
- package/foundation/theme/theme.type.d.ts +1 -1
- package/package.json +1 -1
|
@@ -168,7 +168,10 @@ var SuggestionList = react_1.forwardRef(function (inProps, ref) {
|
|
|
168
168
|
}, [componentsProp, PaddingComponent]);
|
|
169
169
|
return (react_1.default.createElement(SuggestionListContext.Provider, { value: listRef },
|
|
170
170
|
react_1.default.createElement(Virtuoso_1.Virtuoso, tslib_1.__assign({ ref: forkVlRef, totalCount: itemCount, data: itemData, className: className, components: components, itemContent: itemContent }, getMenuProps(), foundation_1.combineProps({
|
|
171
|
-
scrollerRef:
|
|
171
|
+
scrollerRef: function (scrollElm) {
|
|
172
|
+
scrollerRefFn(scrollElm);
|
|
173
|
+
Virtuoso_1.modifyVlScrollerStyle(scrollElm, position);
|
|
174
|
+
},
|
|
172
175
|
itemsRendered: itemsRendered,
|
|
173
176
|
totalListHeightChanged: totalListHeightChanged,
|
|
174
177
|
style: style,
|
|
@@ -5,7 +5,7 @@ import { RcSubMenuProps } from '../SubMenu';
|
|
|
5
5
|
export declare const StyledListItemSecondaryAction: import("styled-components").StyledComponentClass<Pick<Pick<import("@material-ui/core").ListItemSecondaryActionProps, "ref" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "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" | "slot" | "title" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "innerRef">, "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "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" | "slot" | "title" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "innerRef"> & import("react").RefAttributes<any>, import("../../../../foundation").RcTheme, Pick<Pick<Pick<import("@material-ui/core").ListItemSecondaryActionProps, "ref" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "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" | "slot" | "title" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "innerRef">, "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "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" | "slot" | "title" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "innerRef"> & import("react").RefAttributes<any>, "ref" | "key" | "className" | "color" | "id" | "lang" | "style" | "role" | "tabIndex" | "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" | "slot" | "title" | "classes" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "innerRef"> & {
|
|
6
6
|
theme?: import("../../../../foundation").RcTheme | undefined;
|
|
7
7
|
}>;
|
|
8
|
-
export declare const StyledGrow: import("styled-components").StyledComponentClass<import("@material-ui/core
|
|
8
|
+
export declare const StyledGrow: import("styled-components").StyledComponentClass<Pick<import("@material-ui/core").GrowProps, "style" | "in" | "children" | "mountOnEnter" | "unmountOnExit" | "timeout" | "addEndListener" | "onEnter" | "onEntering" | "onEntered" | "onExit" | "onExiting" | "onExited" | "appear" | "enter" | "exit" | "disableStrictModeCompat"> & import("react").RefAttributes<any>, import("../../../../foundation").RcTheme, Pick<Pick<import("@material-ui/core").GrowProps, "style" | "in" | "children" | "mountOnEnter" | "unmountOnExit" | "timeout" | "addEndListener" | "onEnter" | "onEntering" | "onEntered" | "onExit" | "onExiting" | "onExited" | "appear" | "enter" | "exit" | "disableStrictModeCompat"> & import("react").RefAttributes<any>, "ref" | "key" | "style" | "in" | "children" | "mountOnEnter" | "unmountOnExit" | "timeout" | "addEndListener" | "onEnter" | "onEntering" | "onEntered" | "onExit" | "onExiting" | "onExited" | "appear" | "enter" | "exit" | "disableStrictModeCompat"> & {
|
|
9
9
|
theme?: import("../../../../foundation").RcTheme | undefined;
|
|
10
10
|
}>;
|
|
11
11
|
export declare const SubMenuStyle: RcThemedStyled<RcSubMenuProps, any>;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
var tslib_1 = require("tslib");
|
|
4
|
-
var Grow_1 = tslib_1.__importDefault(require("@material-ui/core/Grow"));
|
|
5
4
|
var foundation_1 = require("../../../../foundation");
|
|
6
5
|
var ListItemSecondaryAction_1 = require("../../../List/ListItemSecondaryAction");
|
|
6
|
+
var Grow_1 = require("../../../Transitions/Grow");
|
|
7
7
|
exports.StyledListItemSecondaryAction = foundation_1.styled(ListItemSecondaryAction_1.RcListItemSecondaryAction)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n position: relative;\n transform: none;\n right: 0;\n top: 0;\n"], ["\n position: relative;\n transform: none;\n right: 0;\n top: 0;\n"])));
|
|
8
|
-
exports.StyledGrow = foundation_1.styled(Grow_1.
|
|
8
|
+
exports.StyledGrow = foundation_1.styled(Grow_1.RcGrow)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n transform-origin: center top;\n"], ["\n transform-origin: center top;\n"])));
|
|
9
9
|
exports.SubMenuStyle = function () {
|
|
10
10
|
return foundation_1.css(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject([""], [""])));
|
|
11
11
|
};
|
|
@@ -180,13 +180,7 @@ var _RcVirtualizedMenuList = react_1.forwardRef(function (inProps, ref) {
|
|
|
180
180
|
[]);
|
|
181
181
|
var combine = foundation_1.combineProps(tslib_1.__assign({ tabIndex: -1, scrollerRef: function (scrollElm) {
|
|
182
182
|
scrollerRefFn(scrollElm);
|
|
183
|
-
|
|
184
|
-
if (position && scrollElm) {
|
|
185
|
-
var viewPortElm = scrollElm.firstChild;
|
|
186
|
-
if (viewPortElm) {
|
|
187
|
-
viewPortElm.style.position = position;
|
|
188
|
-
}
|
|
189
|
-
}
|
|
183
|
+
Virtuoso_1.modifyVlScrollerStyle(scrollElm, position);
|
|
190
184
|
// * when not have scrollerRef mean that is first render
|
|
191
185
|
if (!isMountedRef.current) {
|
|
192
186
|
onMounted();
|
|
@@ -30,4 +30,8 @@ export declare function useHighlightScroll({ containerHeighRef, scrollToIndex, }
|
|
|
30
30
|
*/
|
|
31
31
|
itemsRendered: (e: ListItem<any>[]) => ListItem<any>[];
|
|
32
32
|
};
|
|
33
|
+
/**
|
|
34
|
+
* modify virtuoso style to fix safari scroll bug
|
|
35
|
+
*/
|
|
36
|
+
export declare function modifyVlScrollerStyle(scrollElm: HTMLElement, position?: 'absolute' | 'unset'): void;
|
|
33
37
|
export {};
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
var react_1 = require("react");
|
|
4
|
+
var foundation_1 = require("../../../foundation");
|
|
4
5
|
/**
|
|
5
6
|
* scroll into current highlight index
|
|
6
7
|
*/
|
|
@@ -101,3 +102,19 @@ function useHighlightScroll(_a) {
|
|
|
101
102
|
};
|
|
102
103
|
}
|
|
103
104
|
exports.useHighlightScroll = useHighlightScroll;
|
|
105
|
+
/**
|
|
106
|
+
* modify virtuoso style to fix safari scroll bug
|
|
107
|
+
*/
|
|
108
|
+
function modifyVlScrollerStyle(scrollElm, position) {
|
|
109
|
+
if (position === void 0) { position = 'absolute'; }
|
|
110
|
+
if (scrollElm) {
|
|
111
|
+
scrollElm.style.transition = foundation_1.fixWebKitTransitionStyle;
|
|
112
|
+
if (position) {
|
|
113
|
+
var viewPortElm = scrollElm.firstChild;
|
|
114
|
+
if (viewPortElm) {
|
|
115
|
+
viewPortElm.style.position = position;
|
|
116
|
+
}
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
exports.modifyVlScrollerStyle = modifyVlScrollerStyle;
|
|
@@ -7,7 +7,7 @@ import { RcBox } from '../../Box';
|
|
|
7
7
|
import { RcIconButton } from '../../Buttons/IconButton';
|
|
8
8
|
import { RcMenuItem } from '../../Menu/MenuItem';
|
|
9
9
|
import { menuListBoundaryPadding, StyledMenuListPadding, } from '../../VirtualizedMenu/styles';
|
|
10
|
-
import { useDynamicHeight, useHighlightScroll, Virtuoso, } from '../../Virtuoso';
|
|
10
|
+
import { modifyVlScrollerStyle, useDynamicHeight, useHighlightScroll, Virtuoso, } from '../../Virtuoso';
|
|
11
11
|
import { SuggestionListStyle } from './styles';
|
|
12
12
|
import { RcSuggestionListClasses } from './utils';
|
|
13
13
|
var SuggestionListContext = createContext(null);
|
|
@@ -166,7 +166,10 @@ var SuggestionList = forwardRef(function (inProps, ref) {
|
|
|
166
166
|
}, [componentsProp, PaddingComponent]);
|
|
167
167
|
return (React.createElement(SuggestionListContext.Provider, { value: listRef },
|
|
168
168
|
React.createElement(Virtuoso, __assign({ ref: forkVlRef, totalCount: itemCount, data: itemData, className: className, components: components, itemContent: itemContent }, getMenuProps(), combineProps({
|
|
169
|
-
scrollerRef:
|
|
169
|
+
scrollerRef: function (scrollElm) {
|
|
170
|
+
scrollerRefFn(scrollElm);
|
|
171
|
+
modifyVlScrollerStyle(scrollElm, position);
|
|
172
|
+
},
|
|
170
173
|
itemsRendered: itemsRendered,
|
|
171
174
|
totalListHeightChanged: totalListHeightChanged,
|
|
172
175
|
style: style,
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { __makeTemplateObject } from "tslib";
|
|
2
|
-
import MuiGrow from '@material-ui/core/Grow';
|
|
3
2
|
import { css, styled } from '../../../../foundation';
|
|
4
3
|
import { RcListItemSecondaryAction } from '../../../List/ListItemSecondaryAction';
|
|
4
|
+
import { RcGrow } from '../../../Transitions/Grow';
|
|
5
5
|
export var StyledListItemSecondaryAction = styled(RcListItemSecondaryAction)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: relative;\n transform: none;\n right: 0;\n top: 0;\n"], ["\n position: relative;\n transform: none;\n right: 0;\n top: 0;\n"])));
|
|
6
|
-
export var StyledGrow = styled(
|
|
6
|
+
export var StyledGrow = styled(RcGrow)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n transform-origin: center top;\n"], ["\n transform-origin: center top;\n"])));
|
|
7
7
|
export var SubMenuStyle = function () {
|
|
8
8
|
return css(templateObject_3 || (templateObject_3 = __makeTemplateObject([""], [""])));
|
|
9
9
|
};
|
|
@@ -3,7 +3,7 @@ import React, { forwardRef, useImperativeHandle, useMemo, useRef, } from 'react'
|
|
|
3
3
|
import { isFragment } from 'react-is';
|
|
4
4
|
import { combineProps, getScrollbarSize, isRcElement, logInDev, styled, useDebounce, useEventCallback, useForkRef, useHiddenTabindex, useKeyboardMoveFocus, useMountState, useOnlyOneFocusable, useRcPortalWindowContext, useTheme, useThemeProps, } from '../../foundation';
|
|
5
5
|
import { RcList } from '../List/List/List';
|
|
6
|
-
import { isOutOfRange, useDynamicHeight, useHighlightScroll, Virtuoso, } from '../Virtuoso';
|
|
6
|
+
import { isOutOfRange, modifyVlScrollerStyle, useDynamicHeight, useHighlightScroll, Virtuoso, } from '../Virtuoso';
|
|
7
7
|
import { RcVisuallyHidden } from '../VisuallyHidden';
|
|
8
8
|
import { StyledMenuListPadding } from './styles';
|
|
9
9
|
var _RcVirtualizedMenuList = forwardRef(function (inProps, ref) {
|
|
@@ -178,13 +178,7 @@ var _RcVirtualizedMenuList = forwardRef(function (inProps, ref) {
|
|
|
178
178
|
[]);
|
|
179
179
|
var combine = combineProps(__assign({ tabIndex: -1, scrollerRef: function (scrollElm) {
|
|
180
180
|
scrollerRefFn(scrollElm);
|
|
181
|
-
|
|
182
|
-
if (position && scrollElm) {
|
|
183
|
-
var viewPortElm = scrollElm.firstChild;
|
|
184
|
-
if (viewPortElm) {
|
|
185
|
-
viewPortElm.style.position = position;
|
|
186
|
-
}
|
|
187
|
-
}
|
|
181
|
+
modifyVlScrollerStyle(scrollElm, position);
|
|
188
182
|
// * when not have scrollerRef mean that is first render
|
|
189
183
|
if (!isMountedRef.current) {
|
|
190
184
|
onMounted();
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { useRef } from 'react';
|
|
2
|
+
import { fixWebKitTransitionStyle } from '../../../foundation';
|
|
2
3
|
/**
|
|
3
4
|
* scroll into current highlight index
|
|
4
5
|
*/
|
|
@@ -98,3 +99,18 @@ export function useHighlightScroll(_a) {
|
|
|
98
99
|
itemsRendered: function (e) { return (renderedItemsRef.current = e); },
|
|
99
100
|
};
|
|
100
101
|
}
|
|
102
|
+
/**
|
|
103
|
+
* modify virtuoso style to fix safari scroll bug
|
|
104
|
+
*/
|
|
105
|
+
export function modifyVlScrollerStyle(scrollElm, position) {
|
|
106
|
+
if (position === void 0) { position = 'absolute'; }
|
|
107
|
+
if (scrollElm) {
|
|
108
|
+
scrollElm.style.transition = fixWebKitTransitionStyle;
|
|
109
|
+
if (position) {
|
|
110
|
+
var viewPortElm = scrollElm.firstChild;
|
|
111
|
+
if (viewPortElm) {
|
|
112
|
+
viewPortElm.style.position = position;
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
}
|
|
116
|
+
}
|
package/es6/foundation/index.js
CHANGED
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { __makeTemplateObject } from "tslib";
|
|
2
|
+
import { createGlobalStyle } from 'styled-components';
|
|
3
|
+
import { RcClasses } from './utils/classes';
|
|
4
|
+
import { combineProps } from './utils/combineProps';
|
|
5
|
+
// * this whole file should be remove after webkit154 issue be fixed
|
|
6
|
+
/**
|
|
7
|
+
* Conditionally apply a workaround for the CSS transition bug in Safari 15.4 / WebKit browsers.
|
|
8
|
+
* Remove this workaround once the WebKit bug fix is released.
|
|
9
|
+
*
|
|
10
|
+
* follow up:
|
|
11
|
+
* https://github.com/mui/material-ui/pull/31975/files
|
|
12
|
+
* https://github.com/mui/material-ui/pull/32202/files
|
|
13
|
+
*/
|
|
14
|
+
export var isWebKit154 = typeof navigator !== 'undefined' &&
|
|
15
|
+
/^((?!chrome|android).)*(safari|mobile)/i.test(navigator.userAgent) &&
|
|
16
|
+
/(os |version\/)15(.|_)[4-9]/i.test(navigator.userAgent);
|
|
17
|
+
var FixWebKit154Classes = RcClasses(['paper'], 'RcFixWebKit154');
|
|
18
|
+
/**
|
|
19
|
+
* Conditionally apply a workaround for the CSS transition bug in Safari 15.4.
|
|
20
|
+
* Remove this workaround once the Safari bug is fixed.
|
|
21
|
+
*/
|
|
22
|
+
export var getWebKit154Theme = function (theme, enable) {
|
|
23
|
+
if (enable !== null && enable !== void 0 ? enable : isWebKit154) {
|
|
24
|
+
return combineProps({
|
|
25
|
+
props: {
|
|
26
|
+
// * set all grow related to only have one transition to make animation not shake after safari 15.4
|
|
27
|
+
MuiMenu: {
|
|
28
|
+
PopoverClasses: { paper: FixWebKit154Classes.paper },
|
|
29
|
+
},
|
|
30
|
+
RcVirtualizedMenu: {
|
|
31
|
+
PopoverClasses: { paper: FixWebKit154Classes.paper },
|
|
32
|
+
},
|
|
33
|
+
MuiPopover: {
|
|
34
|
+
PaperProps: { className: FixWebKit154Classes.paper },
|
|
35
|
+
},
|
|
36
|
+
// mui tooltip prop will cover all existing props
|
|
37
|
+
RcTooltip: {
|
|
38
|
+
classes: {
|
|
39
|
+
tooltip: FixWebKit154Classes.paper,
|
|
40
|
+
},
|
|
41
|
+
},
|
|
42
|
+
// mui grow not accept global prop
|
|
43
|
+
RcGrow: {
|
|
44
|
+
className: FixWebKit154Classes.paper,
|
|
45
|
+
},
|
|
46
|
+
},
|
|
47
|
+
}, theme);
|
|
48
|
+
}
|
|
49
|
+
return theme;
|
|
50
|
+
};
|
|
51
|
+
export var fixWebKitTransitionStyle = 'all 159ms cubic-bezier(0.4, 0, 0.2, 1) 0ms';
|
|
52
|
+
/**
|
|
53
|
+
* A global style that can be used to
|
|
54
|
+
* apply a workaround for the CSS transition bug after WebKit 15.4.
|
|
55
|
+
*/
|
|
56
|
+
export var GlobalFixWebKitStyle = createGlobalStyle(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n .", " {\n transition: ", " !important;\n }\n"], ["\n .", " {\n transition: ", " !important;\n }\n"])), FixWebKit154Classes.paper, fixWebKitTransitionStyle);
|
|
57
|
+
var templateObject_1;
|
|
@@ -3,6 +3,7 @@ import 'focus-visible';
|
|
|
3
3
|
import React, { createContext, useContext, } from 'react';
|
|
4
4
|
import { createGenerateClassName, MuiThemeProvider, StylesProvider, } from '@material-ui/core/styles';
|
|
5
5
|
import { useResultRef } from '../hooks';
|
|
6
|
+
import { getWebKit154Theme, GlobalFixWebKitStyle, isWebKit154, } from '../isWebKit154';
|
|
6
7
|
import { ThemeProvider as StyledThemeProvider, useTheme, } from '../styled-components';
|
|
7
8
|
import createTheme from './createTheme';
|
|
8
9
|
var NestedThemeContext = createContext(false);
|
|
@@ -12,14 +13,17 @@ var NestedThemeContext = createContext(false);
|
|
|
12
13
|
* that will user parent's theme when not set theme
|
|
13
14
|
*/
|
|
14
15
|
var SubThemeProvider = function (_a) {
|
|
15
|
-
var themeProp = _a.theme, children = _a.children;
|
|
16
|
+
var themeProp = _a.theme, children = _a.children, fixWebKit154 = _a.fixWebKit154;
|
|
16
17
|
var _b, _c;
|
|
17
18
|
var parentTheme = useTheme();
|
|
18
19
|
var isHaveParentRcTheme = (_c = (_b = parentTheme.palette) === null || _b === void 0 ? void 0 : _b.content) === null || _c === void 0 ? void 0 : _c.brand;
|
|
19
|
-
|
|
20
|
+
// TODO: can be remove after safari fix that bug, maybe after v16
|
|
21
|
+
var theme = getWebKit154Theme(!themeProp && isHaveParentRcTheme ? parentTheme : createTheme(themeProp), fixWebKit154);
|
|
20
22
|
return (React.createElement(MuiThemeProvider, { theme: theme },
|
|
21
23
|
React.createElement(StyledThemeProvider, { theme: theme },
|
|
22
|
-
React.createElement(React.Fragment, null,
|
|
24
|
+
React.createElement(React.Fragment, null,
|
|
25
|
+
(fixWebKit154 !== null && fixWebKit154 !== void 0 ? fixWebKit154 : isWebKit154) && React.createElement(GlobalFixWebKitStyle, null),
|
|
26
|
+
children))));
|
|
23
27
|
};
|
|
24
28
|
/**
|
|
25
29
|
* theme wrapper, apply in root,
|
package/foundation/index.d.ts
CHANGED
package/foundation/index.js
CHANGED
|
@@ -4,6 +4,7 @@ var tslib_1 = require("tslib");
|
|
|
4
4
|
var styled_components_1 = tslib_1.__importDefault(require("./styled-components"));
|
|
5
5
|
exports.styled = styled_components_1.default;
|
|
6
6
|
tslib_1.__exportStar(require("./config"), exports);
|
|
7
|
+
tslib_1.__exportStar(require("./isWebKit154"), exports);
|
|
7
8
|
tslib_1.__exportStar(require("./contexts"), exports);
|
|
8
9
|
tslib_1.__exportStar(require("./hoc"), exports);
|
|
9
10
|
tslib_1.__exportStar(require("./hooks"), exports);
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Conditionally apply a workaround for the CSS transition bug in Safari 15.4 / WebKit browsers.
|
|
3
|
+
* Remove this workaround once the WebKit bug fix is released.
|
|
4
|
+
*
|
|
5
|
+
* follow up:
|
|
6
|
+
* https://github.com/mui/material-ui/pull/31975/files
|
|
7
|
+
* https://github.com/mui/material-ui/pull/32202/files
|
|
8
|
+
*/
|
|
9
|
+
export declare const isWebKit154: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* Conditionally apply a workaround for the CSS transition bug in Safari 15.4.
|
|
12
|
+
* Remove this workaround once the Safari bug is fixed.
|
|
13
|
+
*/
|
|
14
|
+
export declare const getWebKit154Theme: (theme: any, enable?: boolean | undefined) => any;
|
|
15
|
+
export declare const fixWebKitTransitionStyle = "all 159ms cubic-bezier(0.4, 0, 0.2, 1) 0ms";
|
|
16
|
+
/**
|
|
17
|
+
* A global style that can be used to
|
|
18
|
+
* apply a workaround for the CSS transition bug after WebKit 15.4.
|
|
19
|
+
*/
|
|
20
|
+
export declare const GlobalFixWebKitStyle: import("styled-components").GlobalStyleClass<{}, import("styled-components").DefaultTheme>;
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
var tslib_1 = require("tslib");
|
|
4
|
+
var styled_components_1 = require("styled-components");
|
|
5
|
+
var classes_1 = require("./utils/classes");
|
|
6
|
+
var combineProps_1 = require("./utils/combineProps");
|
|
7
|
+
// * this whole file should be remove after webkit154 issue be fixed
|
|
8
|
+
/**
|
|
9
|
+
* Conditionally apply a workaround for the CSS transition bug in Safari 15.4 / WebKit browsers.
|
|
10
|
+
* Remove this workaround once the WebKit bug fix is released.
|
|
11
|
+
*
|
|
12
|
+
* follow up:
|
|
13
|
+
* https://github.com/mui/material-ui/pull/31975/files
|
|
14
|
+
* https://github.com/mui/material-ui/pull/32202/files
|
|
15
|
+
*/
|
|
16
|
+
exports.isWebKit154 = typeof navigator !== 'undefined' &&
|
|
17
|
+
/^((?!chrome|android).)*(safari|mobile)/i.test(navigator.userAgent) &&
|
|
18
|
+
/(os |version\/)15(.|_)[4-9]/i.test(navigator.userAgent);
|
|
19
|
+
var FixWebKit154Classes = classes_1.RcClasses(['paper'], 'RcFixWebKit154');
|
|
20
|
+
/**
|
|
21
|
+
* Conditionally apply a workaround for the CSS transition bug in Safari 15.4.
|
|
22
|
+
* Remove this workaround once the Safari bug is fixed.
|
|
23
|
+
*/
|
|
24
|
+
exports.getWebKit154Theme = function (theme, enable) {
|
|
25
|
+
if (enable !== null && enable !== void 0 ? enable : exports.isWebKit154) {
|
|
26
|
+
return combineProps_1.combineProps({
|
|
27
|
+
props: {
|
|
28
|
+
// * set all grow related to only have one transition to make animation not shake after safari 15.4
|
|
29
|
+
MuiMenu: {
|
|
30
|
+
PopoverClasses: { paper: FixWebKit154Classes.paper },
|
|
31
|
+
},
|
|
32
|
+
RcVirtualizedMenu: {
|
|
33
|
+
PopoverClasses: { paper: FixWebKit154Classes.paper },
|
|
34
|
+
},
|
|
35
|
+
MuiPopover: {
|
|
36
|
+
PaperProps: { className: FixWebKit154Classes.paper },
|
|
37
|
+
},
|
|
38
|
+
// mui tooltip prop will cover all existing props
|
|
39
|
+
RcTooltip: {
|
|
40
|
+
classes: {
|
|
41
|
+
tooltip: FixWebKit154Classes.paper,
|
|
42
|
+
},
|
|
43
|
+
},
|
|
44
|
+
// mui grow not accept global prop
|
|
45
|
+
RcGrow: {
|
|
46
|
+
className: FixWebKit154Classes.paper,
|
|
47
|
+
},
|
|
48
|
+
},
|
|
49
|
+
}, theme);
|
|
50
|
+
}
|
|
51
|
+
return theme;
|
|
52
|
+
};
|
|
53
|
+
exports.fixWebKitTransitionStyle = 'all 159ms cubic-bezier(0.4, 0, 0.2, 1) 0ms';
|
|
54
|
+
/**
|
|
55
|
+
* A global style that can be used to
|
|
56
|
+
* apply a workaround for the CSS transition bug after WebKit 15.4.
|
|
57
|
+
*/
|
|
58
|
+
exports.GlobalFixWebKitStyle = styled_components_1.createGlobalStyle(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n .", " {\n transition: ", " !important;\n }\n"], ["\n .", " {\n transition: ", " !important;\n }\n"])), FixWebKit154Classes.paper, exports.fixWebKitTransitionStyle);
|
|
59
|
+
var templateObject_1;
|
|
@@ -4,6 +4,12 @@ import { RcThemeInput } from './theme.type';
|
|
|
4
4
|
declare type SubThemeProviderProps = {
|
|
5
5
|
/** custom theme */
|
|
6
6
|
theme?: RcThemeInput;
|
|
7
|
+
/**
|
|
8
|
+
* workaround for fix safari 15.4~.9 bug
|
|
9
|
+
*
|
|
10
|
+
* use for when your environment need that fix but userAgent not have safari
|
|
11
|
+
*/
|
|
12
|
+
fixWebKit154?: boolean;
|
|
7
13
|
children?: ReactNode;
|
|
8
14
|
};
|
|
9
15
|
declare type RootThemeProviderProps = {
|
|
@@ -5,6 +5,7 @@ require("focus-visible");
|
|
|
5
5
|
var react_1 = tslib_1.__importStar(require("react"));
|
|
6
6
|
var styles_1 = require("@material-ui/core/styles");
|
|
7
7
|
var hooks_1 = require("../hooks");
|
|
8
|
+
var isWebKit154_1 = require("../isWebKit154");
|
|
8
9
|
var styled_components_1 = require("../styled-components");
|
|
9
10
|
var createTheme_1 = tslib_1.__importDefault(require("./createTheme"));
|
|
10
11
|
var NestedThemeContext = react_1.createContext(false);
|
|
@@ -14,14 +15,17 @@ var NestedThemeContext = react_1.createContext(false);
|
|
|
14
15
|
* that will user parent's theme when not set theme
|
|
15
16
|
*/
|
|
16
17
|
var SubThemeProvider = function (_a) {
|
|
17
|
-
var themeProp = _a.theme, children = _a.children;
|
|
18
|
+
var themeProp = _a.theme, children = _a.children, fixWebKit154 = _a.fixWebKit154;
|
|
18
19
|
var _b, _c;
|
|
19
20
|
var parentTheme = styled_components_1.useTheme();
|
|
20
21
|
var isHaveParentRcTheme = (_c = (_b = parentTheme.palette) === null || _b === void 0 ? void 0 : _b.content) === null || _c === void 0 ? void 0 : _c.brand;
|
|
21
|
-
|
|
22
|
+
// TODO: can be remove after safari fix that bug, maybe after v16
|
|
23
|
+
var theme = isWebKit154_1.getWebKit154Theme(!themeProp && isHaveParentRcTheme ? parentTheme : createTheme_1.default(themeProp), fixWebKit154);
|
|
22
24
|
return (react_1.default.createElement(styles_1.MuiThemeProvider, { theme: theme },
|
|
23
25
|
react_1.default.createElement(styled_components_1.ThemeProvider, { theme: theme },
|
|
24
|
-
react_1.default.createElement(react_1.default.Fragment, null,
|
|
26
|
+
react_1.default.createElement(react_1.default.Fragment, null,
|
|
27
|
+
(fixWebKit154 !== null && fixWebKit154 !== void 0 ? fixWebKit154 : isWebKit154_1.isWebKit154) && react_1.default.createElement(isWebKit154_1.GlobalFixWebKitStyle, null),
|
|
28
|
+
children))));
|
|
25
29
|
};
|
|
26
30
|
/**
|
|
27
31
|
* theme wrapper, apply in root,
|
|
@@ -203,7 +203,7 @@ export declare type RcTheme = {
|
|
|
203
203
|
RcZoomFrom?: RcZoomFromProps;
|
|
204
204
|
RcZoomInFadeOut?: RcZoomInFadeOutProps;
|
|
205
205
|
RcTypography?: RcTypographyProps;
|
|
206
|
-
RcVirtualizedDivider
|
|
206
|
+
RcVirtualizedDivider?: RcVirtualizedDividerProps;
|
|
207
207
|
RcVirtualizedMenu?: RcVirtualizedMenuProps;
|
|
208
208
|
RcVirtualizedMenuList?: RcVirtualizedMenuListProps;
|
|
209
209
|
};
|