@ringcentral/juno 3.0.0-alpha.7 → 3.0.0-alpha.9

package/components/Toolbar/Toolbar.d.ts

@@ -1,6 +1,7 @@
+import React from 'react';
 import { ToolbarProps as MuiToolbarProps } from '@material-ui/core/Toolbar';
 type RcToolbarProps = MuiToolbarProps;
 /** @release */
-declare const RcToolbar: any;
+declare const RcToolbar: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Omit<RcToolbarProps, "ref"> & React.RefAttributes<any>>, import("../../foundation").RcTheme, {}, never>;
 export { RcToolbar };
 export type { RcToolbarProps };

package/components/Tooltip/Tooltip.d.ts

@@ -1,4 +1,4 @@
-import { ComponentProps } from 'react';
+import React, { ComponentProps } from 'react';
 import MuiTooltip from '@material-ui/core/Tooltip';
 import { RcBaseProps, RcBaseSize, RcPaletteProp } from '../../foundation';
 import { Mask } from './styles';
@@ -28,6 +28,6 @@ type RcTooltipProps = {
     injectGlobalStyle?: boolean;
 } & RcBaseProps<ComponentProps<typeof MuiTooltip>, 'color' | 'arrow' | 'className'>;
 /** @release */
-declare const RcTooltip: any;
+declare const RcTooltip: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Omit<RcTooltipProps, "ref"> & React.RefAttributes<any>>, import("../../foundation").RcTheme, {}, never>;
 export { RcTooltip };
 export type { RcTooltipProps, RcTooltipSize };

package/components/Tooltip/styles/Mask.d.ts

@@ -1 +1 @@
-export declare const Mask: any;
+export declare const Mask: import("styled-components").StyledComponent<"span", import("../../../foundation").RcTheme, {}, never>;

package/components/Tooltip/withTooltip/withTooltip.d.ts

@@ -1,4 +1,5 @@
-import React, { ComponentType } from 'react';
+import React from 'react';
+import type { ComponentType } from 'react';
 import { RcTooltipProps } from '../Tooltip';
 type WithTooltipProps<P extends {} = {}> = {
     /** title on list root */
@@ -13,6 +14,6 @@ type WithTooltipProps<P extends {} = {}> = {
 /**
  * Make a component can be use with `RcTooltip` and Tooltip Props
  */
-declare function withTooltip<T extends object>(Component: ComponentType<T>): React.ForwardRefExoticComponent<React.PropsWithoutRef<WithTooltipProps<T>> & React.RefAttributes<any>>;
+declare function withTooltip<C extends ComponentType<unknown>>(Component: C): React.ForwardRefExoticComponent<React.PropsWithoutRef<WithTooltipProps<React.ComponentPropsWithoutRef<C> extends object ? React.ComponentPropsWithoutRef<C> : {}>> & React.RefAttributes<React.ElementRef<C>>> & React.ComponentType<WithTooltipProps<React.ComponentPropsWithoutRef<C> extends object ? React.ComponentPropsWithoutRef<C> : {}>>;
 export { withTooltip };
 export type { WithTooltipProps };

package/components/Tooltip/withTooltip/withTooltip.js

@@ -8,13 +8,16 @@ var Tooltip_1 = require("../Tooltip");
  * Make a component can be use with `RcTooltip` and Tooltip Props
  */
 function withTooltip(Component) {
-    return (0, react_1.forwardRef)(function (props, ref) {
+    var WithTooltip = (0, react_1.forwardRef)(function (props, ref) {
         var title = props.title, useRcTooltip = props.useRcTooltip, TooltipProps = props.TooltipProps, rest = tslib_1.__rest(props, ["title", "useRcTooltip", "TooltipProps"]);
+        var restProps = rest;
+        var ComponentWithRef = Component;
         if (title && useRcTooltip) {
             return (react_1.default.createElement(Tooltip_1.RcTooltip, tslib_1.__assign({ title: title }, TooltipProps),
-                react_1.default.createElement(Component, tslib_1.__assign({}, rest, { ref: ref }))));
+                react_1.default.createElement(ComponentWithRef, tslib_1.__assign({}, restProps, { ref: ref }))));
         }
-        return react_1.default.createElement(Component, tslib_1.__assign({ title: title }, rest, { ref: ref }));
+        return (react_1.default.createElement(ComponentWithRef, tslib_1.__assign({}, tslib_1.__assign(tslib_1.__assign({}, restProps), { title: title }), { ref: ref })));
     });
+    return WithTooltip;
 }
 exports.withTooltip = withTooltip;

package/components/Typography/Typography.d.ts

@@ -1,4 +1,4 @@
-import { ComponentProps, ElementType } from 'react';
+import React, { ComponentProps, ElementType } from 'react';
 import MuiTypography from '@material-ui/core/Typography';
 import { RcBaseProps, RcTextPaletteKeys, RcTypographyKeys } from '../../foundation';
 import { WithTooltipProps } from '../Tooltip';
@@ -19,6 +19,10 @@ type RcTypographyProps = {
     weight?: RcTypographyWeight;
 } & RcBaseProps<ComponentProps<typeof MuiTypography>, 'variant' | 'variantMapping' | 'classes' | 'color' | 'title'> & WithTooltipProps;
 /** @release */
-declare const RcTypography: any;
+declare const RcTypography: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<{
+    title?: NonNullable<React.ReactNode> | undefined;
+    useRcTooltip?: boolean | undefined;
+    TooltipProps?: Partial<import("../Tooltip/Tooltip").RcTooltipProps> | undefined;
+} & Omit<Omit<Omit<RcTypographyProps, "ref"> & React.RefAttributes<any>, "ref">, "title"> & React.RefAttributes<any>> & React.ComponentType<WithTooltipProps<Omit<Omit<RcTypographyProps, "ref"> & React.RefAttributes<any>, "ref">>>, import("../../foundation").RcTheme, {}, never>;
 export { RcTypography };
 export type { RcTypographyProps, RcTypographyVariant, RcTypographyWeight };

package/components/VirtualizedMenu/VirtualizedDivider/VirtualizedDivider.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { RcDividerProps } from '../../Divider';
 type RcVirtualizedDividerProps = {} & RcDividerProps;
 /**
@@ -6,6 +7,13 @@ type RcVirtualizedDividerProps = {} & RcDividerProps;
  * use padding inside to prevent dynamic container height error calculate
  * and make that not be focusable
  */
-declare const RcVirtualizedDivider: any;
+declare const RcVirtualizedDivider: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<{
+    vertical?: boolean | undefined;
+    size?: "bold" | "default" | undefined;
+    color?: import("../../../foundation").RcPaletteProp | undefined;
+    title?: string | undefined;
+    titleBgColor?: import("../../../foundation").RcPaletteProp | undefined;
+    component?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
+} & React.HTMLAttributes<HTMLHRElement> & React.RefAttributes<any>>, import("../../../foundation").RcTheme, {}, never>;
 export { RcVirtualizedDivider };
 export type { RcVirtualizedDividerProps };

package/components/VirtualizedMenu/VirtualizedMenu.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { RcBaseProps } from '../../foundation';
 import { RcMenuProps } from '../Menu';
 import { RcVirtualizedMenuListProps } from './VirtualizedMenuList';
@@ -5,6 +6,6 @@ type RcVirtualizedMenuProps = {
     /** props for apply on inner `MenuList` */
     MenuListProps?: RcVirtualizedMenuListProps;
 } & RcBaseProps<RcMenuProps, 'MenuListProps'>;
-declare const RcVirtualizedMenu: any;
+declare const RcVirtualizedMenu: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Omit<RcVirtualizedMenuProps, "ref"> & React.RefAttributes<any>>, import("../../foundation").RcTheme, {}, never>;
 export { RcVirtualizedMenu };
 export type { RcVirtualizedMenuProps };

package/components/VirtualizedMenu/VirtualizedMenuList.d.ts

@@ -31,6 +31,6 @@ type RcVirtualizedMenuListProps = {
      */
     VirtuosoProps?: RcBaseProps<ComponentProps<typeof Virtuoso>, 'data' | 'itemContent' | 'totalCount' | 'components' | 'overscan'>;
 } & RcMenuListProps;
-declare const RcVirtualizedMenuList: any;
+declare const RcVirtualizedMenuList: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Omit<RcVirtualizedMenuListProps, "ref"> & React.RefAttributes<any>>, import("../../foundation").RcTheme, {}, never>;
 export { RcVirtualizedMenuList };
 export type { RcVirtualizedMenuListProps, RcVirtualizedMenuListRef };

package/components/VirtualizedMenu/styles/StyledMenuPadding.d.ts

@@ -1,2 +1,7 @@
 export declare const menuListBoundaryPadding = 8;
-export declare const StyledMenuListPadding: any;
+type StyledMenuListPaddingProps = {
+    /** that element height */
+    height: number;
+};
+export declare const StyledMenuListPadding: import("styled-components").StyledComponent<"div", import("../../../foundation").RcTheme, StyledMenuListPaddingProps, never>;
+export {};

package/components/VisuallyHidden/VisuallyHidden.d.ts

@@ -1,2 +1,2 @@
-declare const RcVisuallyHidden: any;
+declare const RcVisuallyHidden: import("styled-components").StyledComponent<"span", import("../../foundation").RcTheme, {}, never>;
 export { RcVisuallyHidden };

package/es6/components/Tooltip/withTooltip/withTooltip.js

@@ -5,13 +5,16 @@ import { RcTooltip } from '../Tooltip';
  * Make a component can be use with `RcTooltip` and Tooltip Props
  */
 function withTooltip(Component) {
-    return forwardRef(function (props, ref) {
+    var WithTooltip = forwardRef(function (props, ref) {
         var title = props.title, useRcTooltip = props.useRcTooltip, TooltipProps = props.TooltipProps, rest = __rest(props, ["title", "useRcTooltip", "TooltipProps"]);
+        var restProps = rest;
+        var ComponentWithRef = Component;
         if (title && useRcTooltip) {
             return (React.createElement(RcTooltip, __assign({ title: title }, TooltipProps),
-                React.createElement(Component, __assign({}, rest, { ref: ref }))));
+                React.createElement(ComponentWithRef, __assign({}, restProps, { ref: ref }))));
         }
-        return React.createElement(Component, __assign({ title: title }, rest, { ref: ref }));
+        return (React.createElement(ComponentWithRef, __assign({}, __assign(__assign({}, restProps), { title: title }), { ref: ref })));
     });
+    return WithTooltip;
 }
 export { withTooltip };

package/es6/foundation/styled-components.js

@@ -1,10 +1,15 @@
 /* eslint-disable import/no-duplicates */
-// @ts-ignore - styled-components 5.x type import workaround
 import * as styledComponents from 'styled-components';
 import { useTheme } from '@material-ui/core/styles';
-var _a = styledComponents, styled = _a.default, css = _a.css, keyframes = _a.keyframes, createGlobalStyle = _a.createGlobalStyle, withTheme = _a.withTheme, 
-// @ts-ignore
-StyleSheetManager = _a.StyleSheetManager, ThemeProvider = _a.ThemeProvider, ThemeConsumer = _a.ThemeConsumer;
+var styledModule = styledComponents;
+var styled = styledModule.default;
+var css = styledModule.css;
+var keyframes = styledModule.keyframes;
+var createGlobalStyle = styledModule.createGlobalStyle;
+var withTheme = styledModule.withTheme;
+var StyleSheetManager = styledComponents.StyleSheetManager;
+var ThemeProvider = styledModule.ThemeProvider;
+var ThemeConsumer = styledModule.ThemeConsumer;
 var RcUseTheme = function () { return useTheme(); };
 export { createGlobalStyle, css, keyframes, RcUseTheme as useTheme, StyleSheetManager, ThemeConsumer, ThemeProvider, withTheme, };
 export default styled;

package/foundation/hooks/useFocusInside/useFocusInside.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 /**
  * non size for just render hidden element
  */
-export declare const RcFocusInside: any;
+export declare const RcFocusInside: import("styled-components").StyledComponent<"span", import("../..").RcTheme, React.HTMLAttributes<HTMLSpanElement>, never>;
 export type useFocusInsideParams = {
     /**
      * the container that should move focus inside witch `[data-focusable="true"]`

package/foundation/styled-components.d.ts

@@ -1,10 +1,21 @@
-/// <reference types="react" />
-import type { FlattenInterpolation, Interpolation, InterpolationValue, Keyframes, ThemedStyledProps, ThemeProps as StyledThemeProps } from 'styled-components';
+import type { ComponentType, ReactNode } from 'react';
+import type { FlattenInterpolation, Interpolation, InterpolationValue, Keyframes, ThemedCssFunction, ThemedStyledComponentsModule, ThemedStyledInterface, ThemedStyledProps, ThemeProps as StyledThemeProps } from 'styled-components';
+import * as styledComponents from 'styled-components';
 import { RcTheme } from './theme/theme.type';
 type ThemeProps = StyledThemeProps<RcTheme>;
-declare const styled: ThemedStyledComponentsModule<RcTheme>, css: ThemedStyledComponentsModule<RcTheme>, keyframes: ThemedStyledComponentsModule<RcTheme>, createGlobalStyle: ThemedStyledComponentsModule<RcTheme>, withTheme: ThemedStyledComponentsModule<RcTheme>, StyleSheetManager: ThemedStyledComponentsModule<RcTheme>, ThemeProvider: ThemedStyledComponentsModule<RcTheme>, ThemeConsumer: ThemedStyledComponentsModule<RcTheme>;
+declare const styledModule: ThemedStyledComponentsModule<RcTheme, RcTheme>;
+declare const styled: ThemedStyledInterface<RcTheme>;
+declare const css: ThemedCssFunction<RcTheme>;
+declare const keyframes: typeof styledModule.keyframes;
+declare const createGlobalStyle: typeof styledModule.createGlobalStyle;
+declare const withTheme: typeof styledModule.withTheme;
+declare const StyleSheetManager: typeof styledComponents.StyleSheetManager & ComponentType<{
+    children?: ReactNode;
+}>;
+declare const ThemeProvider: typeof styledModule.ThemeProvider;
+declare const ThemeConsumer: typeof styledModule.ThemeConsumer;
 type Dependencies = {
-    dependencies?: (React.ComponentType | ((props: any) => JSX.Element))[];
+    dependencies?: (ComponentType | ((props: unknown) => JSX.Element))[];
 };
 declare const RcUseTheme: <T = RcTheme>() => T;
 export { createGlobalStyle, css, keyframes, RcUseTheme as useTheme, StyleSheetManager, ThemeConsumer, ThemeProvider, withTheme, };

package/foundation/styled-components.js

@@ -3,18 +3,23 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.withTheme = exports.ThemeProvider = exports.ThemeConsumer = exports.StyleSheetManager = exports.useTheme = exports.keyframes = exports.css = exports.createGlobalStyle = void 0;
 var tslib_1 = require("tslib");
 /* eslint-disable import/no-duplicates */
-// @ts-ignore - styled-components 5.x type import workaround
 var styledComponents = tslib_1.__importStar(require("styled-components"));
 var styles_1 = require("@material-ui/core/styles");
-var _a = styledComponents, styled = _a.default, css = _a.css, keyframes = _a.keyframes, createGlobalStyle = _a.createGlobalStyle, withTheme = _a.withTheme, 
-// @ts-ignore
-StyleSheetManager = _a.StyleSheetManager, ThemeProvider = _a.ThemeProvider, ThemeConsumer = _a.ThemeConsumer;
+var styledModule = styledComponents;
+var styled = styledModule.default;
+var css = styledModule.css;
 exports.css = css;
+var keyframes = styledModule.keyframes;
 exports.keyframes = keyframes;
+var createGlobalStyle = styledModule.createGlobalStyle;
 exports.createGlobalStyle = createGlobalStyle;
+var withTheme = styledModule.withTheme;
 exports.withTheme = withTheme;
+var StyleSheetManager = styledComponents.StyleSheetManager;
 exports.StyleSheetManager = StyleSheetManager;
+var ThemeProvider = styledModule.ThemeProvider;
 exports.ThemeProvider = ThemeProvider;
+var ThemeConsumer = styledModule.ThemeConsumer;
 exports.ThemeConsumer = ThemeConsumer;
 var RcUseTheme = function () { return (0, styles_1.useTheme)(); };
 exports.useTheme = RcUseTheme;

package/foundation/styles/GlobalScrollBarStyle/GlobalScrollBarStyle.d.ts

@@ -1,2 +1,2 @@
 /** Provide you to change whole app scrollBar color */
-export declare const RcGlobalScrollBarStyle: any;
+export declare const RcGlobalScrollBarStyle: import("styled-components").GlobalStyleComponent<{}, import("../..").RcTheme>;

package/foundation/styles/ellipsis.d.ts

@@ -8,4 +8,4 @@
  * text-overflow: ellipsis;
  * ```
  */
-export declare function ellipsis(): any;
+export declare function ellipsis(): import("styled-components").FlattenSimpleInterpolation;

package/foundation/styles/fakeBorder.d.ts

@@ -19,5 +19,5 @@ export type FakeBorderOption = {
 };
 export declare const fakeBorder: ({ pseudo, inset, radius, size, color, allowTransparent, }?: FakeBorderOption) => ({ theme }: {
     theme?: RcTheme | undefined;
-}) => any;
+}) => import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<RcTheme>> | undefined;
 export {};

package/foundation/styles/flexCenter.d.ts

@@ -7,4 +7,4 @@
  * // align-items: center;
  * ```
  */
-export declare const flexCenterStyle: any;
+export declare const flexCenterStyle: import("styled-components").FlattenSimpleInterpolation;

package/foundation/styles/flexWidth.d.ts

@@ -17,4 +17,4 @@ import { LiteralUnion } from '../typings';
  * // max-width: 500px
  * ```
  */
-export declare const flexWidth: (width: LiteralUnion<'auto'>) => any;
+export declare const flexWidth: (width: LiteralUnion<'auto'>) => import("styled-components").FlattenSimpleInterpolation;

package/foundation/styles/focusRing.d.ts

@@ -26,4 +26,4 @@ export type FocusRingOptions = {
      */
     gapColor?: RcPaletteProp;
 };
-export declare const focusRing: (variant: FocusRingVariant, options?: FocusRingOptions) => any;
+export declare const focusRing: (variant: FocusRingVariant, options?: FocusRingOptions) => import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<import("../theme").RcTheme>>;

package/foundation/styles/focusVisible.d.ts

@@ -2,5 +2,5 @@ import { radius } from './radius';
 export declare const focusVisible = "&.focus-visible, &[data-focus-visible-added]";
 export declare const focusWithin = "&:hover, &:focus-within";
 export declare const focusVisibleColor: import("./newPalette").PaletteReturnType;
-export declare const shadowBorder: (r?: Parameters<typeof radius>[0], color?: any, inset?: boolean, size?: number) => any;
-export declare const focusVisibleShadowStyle: (r?: Parameters<typeof radius>[0], color?: any, inset?: boolean, size?: number) => any;
+export declare const shadowBorder: (r?: Parameters<typeof radius>[0], color?: any, inset?: boolean, size?: number) => import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<import("..").RcTheme>>;
+export declare const focusVisibleShadowStyle: (r?: Parameters<typeof radius>[0], color?: any, inset?: boolean, size?: number) => import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<import("..").RcTheme>>;

package/foundation/styles/lineClamp.d.ts

@@ -1,2 +1,2 @@
 /** lineClamp helper */
-export declare function lineClamp(lineNumber: number, maxHeight: number): any;
+export declare function lineClamp(lineNumber: number, maxHeight: number): import("styled-components").FlattenSimpleInterpolation;

package/foundation/styles/nonStyleButton.d.ts

@@ -1,2 +1,2 @@
 /** reset browser button style */
-export declare function nonStyleButton(): any;
+export declare function nonStyleButton(): import("styled-components").FlattenSimpleInterpolation;

package/foundation/styles/rippleEnter.d.ts

@@ -1,2 +1,2 @@
 import { RcTheme } from '../theme/theme.type';
-export declare const rippleEnter: (theme: RcTheme) => any;
+export declare const rippleEnter: (theme: RcTheme) => import("styled-components").Keyframes;

package/foundation/styles/rippleStyle.d.ts

@@ -1,3 +1,3 @@
 import { RcThemedStyled } from '../theme/theme.type';
 export declare const backgroundTransition: RcThemedStyled<{}, string>;
-export declare const rippleStyle: any;
+export declare const rippleStyle: import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<import("../theme/theme.type").RcTheme>>;

package/foundation/styles/typography.d.ts

@@ -21,5 +21,5 @@ declare function typography(
 /** name of token */
 name: RcTypographyKeys, 
 /** not contain `line-hight` style */
-fontOnly?: boolean): any;
+fontOnly?: boolean): import("styled-components").FlattenInterpolation<import("styled-components").ThemeProps<import("../theme/theme.type").RcTheme>>;
 export { typography, typographyProp };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ringcentral/juno",
-  "version": "3.0.0-alpha.7",
+  "version": "3.0.0-alpha.9",
   "author": "RingCentral",
   "license": "MIT",
   "main": "./index.js",