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.
Files changed (53) hide show
  1. package/dist/base.d.ts +2 -3
  2. package/dist/constructors/constructWithOptions.d.ts +2 -2
  3. package/dist/index.d.ts +1 -1
  4. package/dist/models/ComponentStyle.d.ts +0 -1
  5. package/dist/models/StyleSheetManager.d.ts +6 -7
  6. package/dist/models/ThemeProvider.d.ts +1 -0
  7. package/dist/native/index.d.ts +25 -26
  8. package/dist/sheet/GroupedTag.d.ts +1 -1
  9. package/dist/styled-components.browser.cjs.js +1 -1862
  10. package/dist/styled-components.browser.cjs.js.map +1 -1
  11. package/dist/styled-components.browser.esm.js +1 -1836
  12. package/dist/styled-components.browser.esm.js.map +1 -1
  13. package/dist/styled-components.cjs.js +1 -1886
  14. package/dist/styled-components.cjs.js.map +1 -1
  15. package/dist/styled-components.esm.js +1 -1860
  16. package/dist/styled-components.esm.js.map +1 -1
  17. package/dist/styled-components.js +199 -197
  18. package/dist/styled-components.js.map +1 -1
  19. package/dist/styled-components.min.js +1 -1
  20. package/dist/styled-components.min.js.map +1 -1
  21. package/dist/test/types.d.ts +9 -1
  22. package/dist/tsconfig.tsbuildinfo +1 -1
  23. package/dist/types.d.ts +16 -18
  24. package/dist/utils/determineTheme.d.ts +4 -2
  25. package/dist/utils/domElements.d.ts +1 -1
  26. package/dist/utils/flatten.d.ts +1 -1
  27. package/dist/utils/isFunction.d.ts +1 -1
  28. package/dist/utils/isPlainObject.d.ts +1 -1
  29. package/dist/utils/isStatelessFunction.d.ts +1 -1
  30. package/dist/utils/joinStrings.d.ts +2 -1
  31. package/native/dist/base.d.ts +2 -3
  32. package/native/dist/constructors/constructWithOptions.d.ts +2 -2
  33. package/native/dist/index.d.ts +1 -1
  34. package/native/dist/models/ComponentStyle.d.ts +0 -1
  35. package/native/dist/models/StyleSheetManager.d.ts +6 -7
  36. package/native/dist/models/ThemeProvider.d.ts +1 -0
  37. package/native/dist/native/index.d.ts +25 -26
  38. package/native/dist/sheet/GroupedTag.d.ts +1 -1
  39. package/native/dist/styled-components.native.cjs.js +1 -1324
  40. package/native/dist/styled-components.native.cjs.js.map +1 -1
  41. package/native/dist/styled-components.native.esm.js +1 -1306
  42. package/native/dist/styled-components.native.esm.js.map +1 -1
  43. package/native/dist/test/types.d.ts +9 -1
  44. package/native/dist/types.d.ts +16 -18
  45. package/native/dist/utils/determineTheme.d.ts +4 -2
  46. package/native/dist/utils/domElements.d.ts +1 -1
  47. package/native/dist/utils/flatten.d.ts +1 -1
  48. package/native/dist/utils/isFunction.d.ts +1 -1
  49. package/native/dist/utils/isPlainObject.d.ts +1 -1
  50. package/native/dist/utils/isStatelessFunction.d.ts +1 -1
  51. package/native/dist/utils/joinStrings.d.ts +2 -1
  52. package/package.json +2 -1
  53. 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 { AttrsArg as Attrs, DefaultTheme, ShouldForwardProp } from './types';
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, AttrsArg, ExecutionProps, Interpolation, IStyledComponent, IStyledComponentFactory, KnownTarget, Runtime, StyledOptions, StyledTarget, Styles } from '../types';
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: AttrsArg<T extends (...args: any) => infer P ? OuterProps & P : OuterProps & T>) => Styled<R, TTarget, PropsSatisfiedByAttrs<T, OuterProps>, OuterStatics, Omit<RuntimeInjectedProps, keyof TResult> & TResult>;
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?: 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 const mainSheet: StyleSheet;
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
- disableVendorPrefixes?: boolean;
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
  */
@@ -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 '../hooks/useTheme';
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, object, object, object>;
11
- Button: Styled<"native", typeof import("react-native").Button, object, object, object>;
12
- DatePickerIOS: Styled<"native", typeof import("react-native").DatePickerIOS, object, object, object>;
13
- DrawerLayoutAndroid: Styled<"native", typeof import("react-native").DrawerLayoutAndroid, object, object, object>;
14
- FlatList: Styled<"native", typeof import("react-native").FlatList, object, object, object>;
15
- Image: Styled<"native", typeof import("react-native").Image, object, object, object>;
16
- ImageBackground: Styled<"native", typeof import("react-native").ImageBackground, object, object, object>;
17
- KeyboardAvoidingView: Styled<"native", typeof import("react-native").KeyboardAvoidingView, object, object, object>;
18
- Modal: Styled<"native", typeof import("react-native").Modal, object, object, object>;
19
- Pressable: Styled<"native", import("react").ForwardRefExoticComponent<import("react-native").PressableProps & import("react").RefAttributes<import("react-native").View>>, object, object, object>;
20
- ProgressBarAndroid: Styled<"native", typeof import("react-native").ProgressBarAndroid, object, object, object>;
21
- ProgressViewIOS: Styled<"native", typeof import("react-native").ProgressViewIOS, object, object, object>;
22
- RefreshControl: Styled<"native", typeof import("react-native").RefreshControl, object, object, object>;
23
- SafeAreaView: Styled<"native", typeof import("react-native").SafeAreaView, object, object, object>;
24
- ScrollView: Styled<"native", typeof import("react-native").ScrollView, object, object, object>;
25
- SectionList: Styled<"native", typeof import("react-native").SectionList, object, object, object>;
26
- Slider: Styled<"native", typeof import("react-native").Slider, object, object, object>;
27
- Switch: Styled<"native", typeof import("react-native").Switch, object, object, object>;
28
- Text: Styled<"native", typeof import("react-native").Text, object, object, object>;
29
- TextInput: Styled<"native", typeof import("react-native").TextInput, object, object, object>;
30
- TouchableHighlight: Styled<"native", typeof import("react-native").TouchableHighlight, object, object, object>;
31
- TouchableOpacity: Styled<"native", typeof import("react-native").TouchableOpacity, object, object, object>;
32
- View: Styled<"native", typeof import("react-native").View, object, object, object>;
33
- VirtualizedList: Styled<"native", typeof import("react-native").VirtualizedList, object, object, object>;
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 | string[]): void;
8
+ insertRules(group: number, rules: string[]): void;
9
9
  clearGroup(group: number): void;
10
10
  getGroup(group: number): string;
11
11
  };