styled-components 6.0.0-beta.13 → 6.0.0-beta.15
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/dist/base.d.ts +2 -3
- package/dist/constructors/constructWithOptions.d.ts +2 -2
- package/dist/index.d.ts +1 -1
- package/dist/models/ComponentStyle.d.ts +0 -1
- package/dist/models/StyleSheetManager.d.ts +6 -7
- package/dist/models/ThemeProvider.d.ts +1 -0
- package/dist/native/index.d.ts +25 -26
- package/dist/sheet/GroupedTag.d.ts +1 -1
- package/dist/styled-components.browser.cjs.js +1 -1862
- package/dist/styled-components.browser.cjs.js.map +1 -1
- package/dist/styled-components.browser.esm.js +1 -1836
- package/dist/styled-components.browser.esm.js.map +1 -1
- package/dist/styled-components.cjs.js +1 -1886
- package/dist/styled-components.cjs.js.map +1 -1
- package/dist/styled-components.esm.js +1 -1860
- package/dist/styled-components.esm.js.map +1 -1
- package/dist/styled-components.js +199 -197
- package/dist/styled-components.js.map +1 -1
- package/dist/styled-components.min.js +1 -1
- package/dist/styled-components.min.js.map +1 -1
- package/dist/test/types.d.ts +9 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/types.d.ts +16 -18
- package/dist/utils/determineTheme.d.ts +4 -2
- package/dist/utils/domElements.d.ts +1 -1
- package/dist/utils/flatten.d.ts +1 -1
- package/dist/utils/isFunction.d.ts +1 -1
- package/dist/utils/isPlainObject.d.ts +1 -1
- package/dist/utils/isStatelessFunction.d.ts +1 -1
- package/dist/utils/joinStrings.d.ts +2 -1
- package/native/dist/base.d.ts +2 -3
- package/native/dist/constructors/constructWithOptions.d.ts +2 -2
- package/native/dist/index.d.ts +1 -1
- package/native/dist/models/ComponentStyle.d.ts +0 -1
- package/native/dist/models/StyleSheetManager.d.ts +6 -7
- package/native/dist/models/ThemeProvider.d.ts +1 -0
- package/native/dist/native/index.d.ts +25 -26
- package/native/dist/sheet/GroupedTag.d.ts +1 -1
- package/native/dist/styled-components.native.cjs.js +1 -1324
- package/native/dist/styled-components.native.cjs.js.map +1 -1
- package/native/dist/styled-components.native.esm.js +1 -1306
- package/native/dist/styled-components.native.esm.js.map +1 -1
- package/native/dist/test/types.d.ts +9 -1
- package/native/dist/types.d.ts +16 -18
- package/native/dist/utils/determineTheme.d.ts +4 -2
- package/native/dist/utils/domElements.d.ts +1 -1
- package/native/dist/utils/flatten.d.ts +1 -1
- package/native/dist/utils/isFunction.d.ts +1 -1
- package/native/dist/utils/isPlainObject.d.ts +1 -1
- package/native/dist/utils/isStatelessFunction.d.ts +1 -1
- package/native/dist/utils/joinStrings.d.ts +2 -1
- package/package.json +2 -1
- package/dist/hooks/useTheme.d.ts +0 -3
package/dist/base.d.ts
CHANGED
|
@@ -3,11 +3,10 @@ import createGlobalStyle from './constructors/createGlobalStyle';
|
|
|
3
3
|
import css from './constructors/css';
|
|
4
4
|
import keyframes from './constructors/keyframes';
|
|
5
5
|
import withTheme from './hoc/withTheme';
|
|
6
|
-
import useTheme from './hooks/useTheme';
|
|
7
6
|
import ServerStyleSheet from './models/ServerStyleSheet';
|
|
8
7
|
import { IStyleSheetContext, IStyleSheetManager, IStylisContext, StyleSheetConsumer, StyleSheetContext, StyleSheetManager } from './models/StyleSheetManager';
|
|
9
|
-
import ThemeProvider, { ThemeConsumer, ThemeContext } from './models/ThemeProvider';
|
|
8
|
+
import ThemeProvider, { ThemeConsumer, ThemeContext, useTheme } from './models/ThemeProvider';
|
|
10
9
|
import isStyledComponent from './utils/isStyledComponent';
|
|
11
10
|
export * from './secretInternals';
|
|
12
|
-
export {
|
|
11
|
+
export { Attrs, DefaultTheme, ShouldForwardProp } from './types';
|
|
13
12
|
export { createGlobalStyle, css, isStyledComponent, IStyleSheetManager, IStyleSheetContext, IStylisContext, keyframes, ServerStyleSheet, StyleSheetConsumer, StyleSheetContext, StyleSheetManager, ThemeConsumer, ThemeContext, ThemeProvider, useTheme, SC_VERSION as version, withTheme, };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { Attrs,
|
|
2
|
+
import { Attrs, ExecutionProps, Interpolation, IStyledComponent, IStyledComponentFactory, KnownTarget, Runtime, StyledOptions, StyledTarget, Styles } from '../types';
|
|
3
3
|
/**
|
|
4
4
|
* for types a and b, if b shares a field with a, mark a's field as optional
|
|
5
5
|
*/
|
|
@@ -18,7 +18,7 @@ type PropsSatisfiedByAttrs<T extends Attrs, Props extends object, Result extends
|
|
|
18
18
|
export interface Styled<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object = object, OuterStatics extends object = object, RuntimeInjectedProps extends ExecutionProps = object> {
|
|
19
19
|
<Props extends object = object, Statics extends object = object>(initialStyles: Styles<OuterProps & RuntimeInjectedProps & Props>, ...interpolations: Interpolation<OuterProps & RuntimeInjectedProps & Props>[]): // @ts-expect-error KnownTarget is a subset of StyledTarget<R>
|
|
20
20
|
IStyledComponent<R, ExtractAttrsTarget<R, RuntimeInjectedProps, Target>, OuterProps & Props> & OuterStatics & Statics;
|
|
21
|
-
attrs: <T extends Attrs, TResult extends ExecutionProps = AttrsResult<T>, TTarget extends StyledTarget<R> = ExtractAttrsTarget<R, TResult, Target>>(attrs:
|
|
21
|
+
attrs: <T extends Attrs, TResult extends ExecutionProps = AttrsResult<T>, TTarget extends StyledTarget<R> = ExtractAttrsTarget<R, TResult, Target>>(attrs: Attrs<T extends (...args: any) => infer P ? OuterProps & P : OuterProps & T>) => Styled<R, TTarget, PropsSatisfiedByAttrs<T, OuterProps>, OuterStatics, Omit<RuntimeInjectedProps, keyof TResult> & TResult>;
|
|
22
22
|
withConfig: (config: StyledOptions<R, OuterProps>) => Styled<R, Target, OuterProps, OuterStatics>;
|
|
23
23
|
}
|
|
24
24
|
export default function constructWithOptions<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object = Target extends KnownTarget ? React.ComponentPropsWithRef<Target> : object, OuterStatics extends object = object>(componentConstructor: IStyledComponentFactory<R, Target, OuterProps, OuterStatics>, tag: Target, options?: StyledOptions<R, OuterProps>): Styled<R, Target, OuterProps, OuterStatics>;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import styled from './constructors/styled';
|
|
2
2
|
export * from './base';
|
|
3
|
-
export { CSSProp, DefaultTheme, ExecutionContext, ExecutionProps, IStyledComponent, IStyledComponentFactory, IStyledStatics, PolymorphicComponent, PolymorphicComponentProps, Runtime, StyledObject, StyledOptions, WebTarget, } from './types';
|
|
3
|
+
export { CSSProp, DefaultTheme, ExecutionContext, ExecutionProps, IStyledComponent, IStyledComponentFactory, IStyledStatics, PolymorphicComponent, PolymorphicComponentProps, RuleSet, Runtime, StyledObject, StyledOptions, WebTarget, } from './types';
|
|
4
4
|
export { styled, styled as default };
|
|
@@ -8,7 +8,6 @@ export default class ComponentStyle {
|
|
|
8
8
|
baseStyle: ComponentStyle | null | undefined;
|
|
9
9
|
componentId: string;
|
|
10
10
|
isStatic: boolean;
|
|
11
|
-
names: string[];
|
|
12
11
|
rules: RuleSet<any>;
|
|
13
12
|
staticRulesId: string;
|
|
14
13
|
constructor(rules: RuleSet<any>, componentId: string, baseStyle?: ComponentStyle);
|
|
@@ -1,20 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import StyleSheet from '../sheet';
|
|
3
3
|
import { ShouldForwardProp, Stringifier } from '../types';
|
|
4
|
+
export declare const mainSheet: StyleSheet;
|
|
5
|
+
export declare const mainStylis: Stringifier;
|
|
4
6
|
export type IStyleSheetContext = {
|
|
5
7
|
shouldForwardProp?: ShouldForwardProp<'web'>;
|
|
6
|
-
styleSheet
|
|
8
|
+
styleSheet: StyleSheet;
|
|
9
|
+
stylis: Stringifier;
|
|
7
10
|
};
|
|
8
11
|
export declare const StyleSheetContext: React.Context<IStyleSheetContext>;
|
|
9
12
|
export declare const StyleSheetConsumer: React.Consumer<IStyleSheetContext>;
|
|
10
13
|
export type IStylisContext = Stringifier | void;
|
|
11
14
|
export declare const StylisContext: React.Context<IStylisContext>;
|
|
12
15
|
export declare const StylisConsumer: React.Consumer<IStylisContext>;
|
|
13
|
-
export declare
|
|
14
|
-
export declare const mainStylis: Stringifier;
|
|
15
|
-
export declare function useShouldForwardProp(): ShouldForwardProp<"web"> | undefined;
|
|
16
|
-
export declare function useStyleSheet(): StyleSheet;
|
|
17
|
-
export declare function useStylis(): Stringifier;
|
|
16
|
+
export declare function useStyleSheetContext(): IStyleSheetContext;
|
|
18
17
|
export type IStyleSheetManager = React.PropsWithChildren<{
|
|
19
18
|
/**
|
|
20
19
|
* If desired, you can pass this prop to disable "speedy" insertion mode, which
|
|
@@ -26,7 +25,7 @@ export type IStyleSheetManager = React.PropsWithChildren<{
|
|
|
26
25
|
* If you are working exclusively with modern browsers, vendor prefixes can often be omitted
|
|
27
26
|
* to reduce the weight of CSS on the page.
|
|
28
27
|
*/
|
|
29
|
-
|
|
28
|
+
enableVendorPrefixes?: boolean;
|
|
30
29
|
/**
|
|
31
30
|
* Provide an optional selector to be prepended to all generated style rules.
|
|
32
31
|
*/
|
|
@@ -32,6 +32,7 @@ type Props = {
|
|
|
32
32
|
};
|
|
33
33
|
export declare const ThemeContext: React.Context<DefaultTheme | undefined>;
|
|
34
34
|
export declare const ThemeConsumer: React.Consumer<DefaultTheme | undefined>;
|
|
35
|
+
export declare function useTheme(): DefaultTheme | undefined;
|
|
35
36
|
/**
|
|
36
37
|
* Provide a theme to an entire react component tree via context
|
|
37
38
|
*/
|
package/dist/native/index.d.ts
CHANGED
|
@@ -2,35 +2,34 @@ import React from 'react';
|
|
|
2
2
|
import { Styled } from '../constructors/constructWithOptions';
|
|
3
3
|
import css from '../constructors/css';
|
|
4
4
|
import withTheme from '../hoc/withTheme';
|
|
5
|
-
import useTheme from '../
|
|
6
|
-
import ThemeProvider, { ThemeConsumer, ThemeContext } from '../models/ThemeProvider';
|
|
5
|
+
import ThemeProvider, { ThemeConsumer, ThemeContext, useTheme } from '../models/ThemeProvider';
|
|
7
6
|
import { NativeTarget } from '../types';
|
|
8
7
|
import isStyledComponent from '../utils/isStyledComponent';
|
|
9
8
|
declare const styled: (<Target extends NativeTarget>(tag: Target) => Styled<"native", Target, Target extends import("../types").KnownTarget ? React.ComponentPropsWithRef<Target> : object, object, object>) & {
|
|
10
|
-
ActivityIndicator: Styled<"native", typeof import("react-native").ActivityIndicator,
|
|
11
|
-
Button: Styled<"native", typeof import("react-native").Button,
|
|
12
|
-
DatePickerIOS: Styled<"native", typeof import("react-native").DatePickerIOS,
|
|
13
|
-
DrawerLayoutAndroid: Styled<"native", typeof import("react-native").DrawerLayoutAndroid,
|
|
14
|
-
FlatList: Styled<"native", typeof import("react-native").FlatList,
|
|
15
|
-
Image: Styled<"native", typeof import("react-native").Image,
|
|
16
|
-
ImageBackground: Styled<"native", typeof import("react-native").ImageBackground,
|
|
17
|
-
KeyboardAvoidingView: Styled<"native", typeof import("react-native").KeyboardAvoidingView,
|
|
18
|
-
Modal: Styled<"native", typeof import("react-native").Modal,
|
|
19
|
-
Pressable: Styled<"native", import("react").ForwardRefExoticComponent<import("react-native").PressableProps & import("react").RefAttributes<import("react-native").View>>,
|
|
20
|
-
ProgressBarAndroid: Styled<"native", typeof import("react-native").ProgressBarAndroid,
|
|
21
|
-
ProgressViewIOS: Styled<"native", typeof import("react-native").ProgressViewIOS,
|
|
22
|
-
RefreshControl: Styled<"native", typeof import("react-native").RefreshControl,
|
|
23
|
-
SafeAreaView: Styled<"native", typeof import("react-native").SafeAreaView,
|
|
24
|
-
ScrollView: Styled<"native", typeof import("react-native").ScrollView,
|
|
25
|
-
SectionList: Styled<"native", typeof import("react-native").SectionList,
|
|
26
|
-
Slider: Styled<"native", typeof import("react-native").Slider,
|
|
27
|
-
Switch: Styled<"native", typeof import("react-native").Switch,
|
|
28
|
-
Text: Styled<"native", typeof import("react-native").Text,
|
|
29
|
-
TextInput: Styled<"native", typeof import("react-native").TextInput,
|
|
30
|
-
TouchableHighlight: Styled<"native", typeof import("react-native").TouchableHighlight,
|
|
31
|
-
TouchableOpacity: Styled<"native", typeof import("react-native").TouchableOpacity,
|
|
32
|
-
View: Styled<"native", typeof import("react-native").View,
|
|
33
|
-
VirtualizedList: Styled<"native", typeof import("react-native").VirtualizedList,
|
|
9
|
+
ActivityIndicator: Styled<"native", typeof import("react-native").ActivityIndicator, import("react-native").ActivityIndicatorProps, object, object>;
|
|
10
|
+
Button: Styled<"native", typeof import("react-native").Button, import("react-native").ButtonProps, object, object>;
|
|
11
|
+
DatePickerIOS: Styled<"native", typeof import("react-native").DatePickerIOS, import("react-native").DatePickerIOSProps, object, object>;
|
|
12
|
+
DrawerLayoutAndroid: Styled<"native", typeof import("react-native").DrawerLayoutAndroid, import("react-native").DrawerLayoutAndroidProps, object, object>;
|
|
13
|
+
FlatList: Styled<"native", typeof import("react-native").FlatList, import("react-native").FlatListProps<unknown>, object, object>;
|
|
14
|
+
Image: Styled<"native", typeof import("react-native").Image, import("react-native").ImageProps, object, object>;
|
|
15
|
+
ImageBackground: Styled<"native", typeof import("react-native").ImageBackground, import("react-native").ImageBackgroundProps, object, object>;
|
|
16
|
+
KeyboardAvoidingView: Styled<"native", typeof import("react-native").KeyboardAvoidingView, import("react-native").KeyboardAvoidingViewProps, object, object>;
|
|
17
|
+
Modal: Styled<"native", typeof import("react-native").Modal, import("react-native").ModalBaseProps & import("react-native").ModalPropsIOS & import("react-native").ModalPropsAndroid & import("react-native").ViewProps, object, object>;
|
|
18
|
+
Pressable: Styled<"native", import("react").ForwardRefExoticComponent<import("react-native").PressableProps & import("react").RefAttributes<import("react-native").View>>, import("react-native").PressableProps & import("react").RefAttributes<import("react-native").View>, object, object>;
|
|
19
|
+
ProgressBarAndroid: Styled<"native", typeof import("react-native").ProgressBarAndroid, import("react-native").ProgressBarAndroidProps, object, object>;
|
|
20
|
+
ProgressViewIOS: Styled<"native", typeof import("react-native").ProgressViewIOS, import("react-native").ProgressViewIOSProps, object, object>;
|
|
21
|
+
RefreshControl: Styled<"native", typeof import("react-native").RefreshControl, import("react-native").RefreshControlProps, object, object>;
|
|
22
|
+
SafeAreaView: Styled<"native", typeof import("react-native").SafeAreaView, import("react-native").ViewProps, object, object>;
|
|
23
|
+
ScrollView: Styled<"native", typeof import("react-native").ScrollView, import("react-native").ScrollViewProps, object, object>;
|
|
24
|
+
SectionList: Styled<"native", typeof import("react-native").SectionList, import("react-native").SectionListProps<unknown, unknown>, object, object>;
|
|
25
|
+
Slider: Styled<"native", typeof import("react-native").Slider, import("react-native").SliderProps, object, object>;
|
|
26
|
+
Switch: Styled<"native", typeof import("react-native").Switch, import("react-native").SwitchProps, object, object>;
|
|
27
|
+
Text: Styled<"native", typeof import("react-native").Text, import("react-native").TextProps, object, object>;
|
|
28
|
+
TextInput: Styled<"native", typeof import("react-native").TextInput, import("react-native").TextInputProps, object, object>;
|
|
29
|
+
TouchableHighlight: Styled<"native", typeof import("react-native").TouchableHighlight, import("react-native").TouchableHighlightProps, object, object>;
|
|
30
|
+
TouchableOpacity: Styled<"native", typeof import("react-native").TouchableOpacity, import("react-native").TouchableOpacityProps, object, object>;
|
|
31
|
+
View: Styled<"native", typeof import("react-native").View, import("react-native").ViewProps, object, object>;
|
|
32
|
+
VirtualizedList: Styled<"native", typeof import("react-native").VirtualizedList, import("react-native").VirtualizedListProps<unknown>, object, object>;
|
|
34
33
|
};
|
|
35
34
|
export { DefaultTheme, ExecutionContext, ExecutionProps, IStyledComponent, IStyledComponentFactory, IStyledStatics, NativeTarget, PolymorphicComponent, PolymorphicComponentProps, Runtime, StyledObject, StyledOptions, } from '../types';
|
|
36
35
|
export { css, isStyledComponent, ThemeProvider, ThemeConsumer, ThemeContext, withTheme, useTheme };
|
|
@@ -5,7 +5,7 @@ export declare const makeGroupedTag: (tag: Tag) => {
|
|
|
5
5
|
length: number;
|
|
6
6
|
tag: Tag;
|
|
7
7
|
indexOfGroup(group: number): number;
|
|
8
|
-
insertRules(group: number, rules: string
|
|
8
|
+
insertRules(group: number, rules: string[]): void;
|
|
9
9
|
clearGroup(group: number): void;
|
|
10
10
|
getGroup(group: number): string;
|
|
11
11
|
};
|