styled-beautify-components 6.1.1
Sign up to get free protection for your applications and to get access to all the features.
Potentially problematic release.
This version of styled-beautify-components might be problematic. Click here for more details.
- package/LICENSE +21 -0
- package/README.md +187 -0
- package/dist/base.d.ts +12 -0
- package/dist/constants.d.ts +8 -0
- package/dist/constructors/constructWithOptions.d.ts +18 -0
- package/dist/constructors/createGlobalStyle.d.ts +3 -0
- package/dist/constructors/css.d.ts +4 -0
- package/dist/constructors/keyframes.d.ts +3 -0
- package/dist/constructors/styled.d.ts +138 -0
- package/dist/hoc/withTheme.d.ts +3 -0
- package/dist/hoc/withTheme.spec.d.ts +1 -0
- package/dist/index-standalone.d.ts +2 -0
- package/dist/index.d.ts +4 -0
- package/dist/models/ComponentStyle.d.ts +15 -0
- package/dist/models/GlobalStyle.d.ts +11 -0
- package/dist/models/InlineStyle.d.ts +6 -0
- package/dist/models/Keyframes.d.ts +10 -0
- package/dist/models/ServerStyleSheet.d.ts +16 -0
- package/dist/models/StyleSheetManager.d.ts +65 -0
- package/dist/models/StyledComponent.d.ts +3 -0
- package/dist/models/StyledNativeComponent.d.ts +3 -0
- package/dist/models/ThemeProvider.d.ts +47 -0
- package/dist/native/index.d.ts +36 -0
- package/dist/secretInternals.d.ts +5 -0
- package/dist/sheet/GroupIDAllocator.d.ts +4 -0
- package/dist/sheet/GroupedTag.d.ts +11 -0
- package/dist/sheet/Rehydration.d.ts +3 -0
- package/dist/sheet/Sheet.d.ts +38 -0
- package/dist/sheet/Tag.d.ts +54 -0
- package/dist/sheet/dom.d.ts +4 -0
- package/dist/sheet/index.d.ts +1 -0
- package/dist/sheet/types.d.ts +34 -0
- package/dist/styled-components.browser.cjs.js +2 -0
- package/dist/styled-components.browser.cjs.js.map +1 -0
- package/dist/styled-components.browser.esm.js +2 -0
- package/dist/styled-components.browser.esm.js.map +1 -0
- package/dist/styled-components.cjs.js +2 -0
- package/dist/styled-components.cjs.js.map +1 -0
- package/dist/styled-components.esm.js +2 -0
- package/dist/styled-components.esm.js.map +1 -0
- package/dist/styled-components.js +2041 -0
- package/dist/styled-components.js.map +1 -0
- package/dist/styled-components.min.js +2 -0
- package/dist/styled-components.min.js.map +1 -0
- package/dist/test/globals.d.ts +2 -0
- package/dist/test/utils.d.ts +144 -0
- package/dist/test/veryLargeUnionType.d.ts +1 -0
- package/dist/types.d.ts +183 -0
- package/dist/utils/addUnitIfNeeded.d.ts +1 -0
- package/dist/utils/checkDynamicCreation.d.ts +1 -0
- package/dist/utils/createWarnTooManyClasses.d.ts +3 -0
- package/dist/utils/determineTheme.d.ts +4 -0
- package/dist/utils/domElements.d.ts +4 -0
- package/dist/utils/empties.d.ts +3 -0
- package/dist/utils/error.d.ts +5 -0
- package/dist/utils/errors.d.ts +21 -0
- package/dist/utils/escape.d.ts +5 -0
- package/dist/utils/flatten.d.ts +4 -0
- package/dist/utils/generateAlphabeticName.d.ts +1 -0
- package/dist/utils/generateComponentId.d.ts +1 -0
- package/dist/utils/generateDisplayName.d.ts +2 -0
- package/dist/utils/getComponentName.d.ts +2 -0
- package/dist/utils/hash.d.ts +3 -0
- package/dist/utils/hoist.d.ts +51 -0
- package/dist/utils/hyphenateStyleName.d.ts +14 -0
- package/dist/utils/interleave.d.ts +2 -0
- package/dist/utils/isFunction.d.ts +1 -0
- package/dist/utils/isPlainObject.d.ts +1 -0
- package/dist/utils/isStatelessFunction.d.ts +1 -0
- package/dist/utils/isStaticRules.d.ts +2 -0
- package/dist/utils/isStyledComponent.d.ts +2 -0
- package/dist/utils/isTag.d.ts +2 -0
- package/dist/utils/joinStrings.d.ts +5 -0
- package/dist/utils/mixinDeep.d.ts +6 -0
- package/dist/utils/nonce.d.ts +1 -0
- package/dist/utils/setToString.d.ts +17 -0
- package/dist/utils/stylis.d.ts +10 -0
- package/native/dist/base.d.ts +12 -0
- package/native/dist/constants.d.ts +8 -0
- package/native/dist/constructors/constructWithOptions.d.ts +18 -0
- package/native/dist/constructors/createGlobalStyle.d.ts +3 -0
- package/native/dist/constructors/css.d.ts +4 -0
- package/native/dist/constructors/keyframes.d.ts +3 -0
- package/native/dist/constructors/styled.d.ts +138 -0
- package/native/dist/hoc/withTheme.d.ts +3 -0
- package/native/dist/hoc/withTheme.spec.d.ts +1 -0
- package/native/dist/index-standalone.d.ts +2 -0
- package/native/dist/index.d.ts +4 -0
- package/native/dist/macro/index.d.ts +2 -0
- package/native/dist/models/ComponentStyle.d.ts +15 -0
- package/native/dist/models/GlobalStyle.d.ts +11 -0
- package/native/dist/models/InlineStyle.d.ts +6 -0
- package/native/dist/models/Keyframes.d.ts +10 -0
- package/native/dist/models/ServerStyleSheet.d.ts +16 -0
- package/native/dist/models/StyleSheetManager.d.ts +65 -0
- package/native/dist/models/StyledComponent.d.ts +3 -0
- package/native/dist/models/StyledNativeComponent.d.ts +3 -0
- package/native/dist/models/ThemeProvider.d.ts +47 -0
- package/native/dist/native/index.d.ts +36 -0
- package/native/dist/secretInternals.d.ts +5 -0
- package/native/dist/sheet/GroupIDAllocator.d.ts +4 -0
- package/native/dist/sheet/GroupedTag.d.ts +11 -0
- package/native/dist/sheet/Rehydration.d.ts +3 -0
- package/native/dist/sheet/Sheet.d.ts +38 -0
- package/native/dist/sheet/Tag.d.ts +54 -0
- package/native/dist/sheet/dom.d.ts +4 -0
- package/native/dist/sheet/index.d.ts +1 -0
- package/native/dist/sheet/types.d.ts +34 -0
- package/native/dist/styled-components.native.cjs.js +2 -0
- package/native/dist/styled-components.native.cjs.js.map +1 -0
- package/native/dist/styled-components.native.esm.js +2 -0
- package/native/dist/styled-components.native.esm.js.map +1 -0
- package/native/dist/test/globals.d.ts +2 -0
- package/native/dist/test/utils.d.ts +144 -0
- package/native/dist/test/veryLargeUnionType.d.ts +1 -0
- package/native/dist/types.d.ts +183 -0
- package/native/dist/utils/addUnitIfNeeded.d.ts +1 -0
- package/native/dist/utils/checkDynamicCreation.d.ts +1 -0
- package/native/dist/utils/createWarnTooManyClasses.d.ts +3 -0
- package/native/dist/utils/determineTheme.d.ts +4 -0
- package/native/dist/utils/domElements.d.ts +4 -0
- package/native/dist/utils/empties.d.ts +3 -0
- package/native/dist/utils/error.d.ts +5 -0
- package/native/dist/utils/errors.d.ts +21 -0
- package/native/dist/utils/escape.d.ts +5 -0
- package/native/dist/utils/flatten.d.ts +4 -0
- package/native/dist/utils/generateAlphabeticName.d.ts +1 -0
- package/native/dist/utils/generateComponentId.d.ts +1 -0
- package/native/dist/utils/generateDisplayName.d.ts +2 -0
- package/native/dist/utils/getComponentName.d.ts +2 -0
- package/native/dist/utils/hash.d.ts +3 -0
- package/native/dist/utils/hoist.d.ts +51 -0
- package/native/dist/utils/hyphenateStyleName.d.ts +14 -0
- package/native/dist/utils/interleave.d.ts +2 -0
- package/native/dist/utils/isFunction.d.ts +1 -0
- package/native/dist/utils/isPlainObject.d.ts +1 -0
- package/native/dist/utils/isStatelessFunction.d.ts +1 -0
- package/native/dist/utils/isStaticRules.d.ts +2 -0
- package/native/dist/utils/isStyledComponent.d.ts +2 -0
- package/native/dist/utils/isTag.d.ts +2 -0
- package/native/dist/utils/joinStrings.d.ts +5 -0
- package/native/dist/utils/mixinDeep.d.ts +6 -0
- package/native/dist/utils/nonce.d.ts +1 -0
- package/native/dist/utils/setToString.d.ts +17 -0
- package/native/dist/utils/stylis.d.ts +10 -0
- package/native/package.json +8 -0
- package/package.json +140 -0
- package/test-utils/index.ts +39 -0
- package/test-utils/setupTestFramework.ts +26 -0
- package/test-utils/test-config.js +36 -0
package/LICENSE
ADDED
@@ -0,0 +1,21 @@
|
|
1
|
+
MIT License
|
2
|
+
|
3
|
+
Copyright (c) 2016-present Glen Maddern and Maximilian Stoiber
|
4
|
+
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
7
|
+
in the Software without restriction, including without limitation the rights
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
10
|
+
furnished to do so, subject to the following conditions:
|
11
|
+
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
13
|
+
copies or substantial portions of the Software.
|
14
|
+
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
@@ -0,0 +1,187 @@
|
|
1
|
+
<div align="center">
|
2
|
+
<a href="https://www.styled-components.com">
|
3
|
+
<img alt="styled-components" src="https://raw.githubusercontent.com/styled-components/brand/master/styled-components.png" height="150px" />
|
4
|
+
</a>
|
5
|
+
</div>
|
6
|
+
|
7
|
+
<br />
|
8
|
+
|
9
|
+
<div align="center">
|
10
|
+
<strong>Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅</strong>
|
11
|
+
<br />
|
12
|
+
<br />
|
13
|
+
<a href="https://www.npmjs.com/package/styled-components"><img src="https://www.styled-components.com/proxy/downloads.svg" alt="downloads: 600k/month"></a>
|
14
|
+
<a href="#backers" alt="sponsors on Open Collective"><img src="https://opencollective.com/styled-components/backers/badge.svg" /></a> <a href="#sponsors" alt="Sponsors on Open Collective"><img src="https://opencollective.com/styled-components/sponsors/badge.svg" /></a> <a href="https://discord.gg/hfGUrbrxaU">
|
15
|
+
<img alt="Discord" src="https://img.shields.io/discord/818449605409767454?logo=discord" /></a>
|
16
|
+
<a href="https://bundlephobia.com/result?p=styled-components" title="styled-components latest minified+gzip size"><img src="https://badgen.net/bundlephobia/minzip/styled-components" alt="gzip size"></a>
|
17
|
+
<a href="#alternative-installation-methods"><img src="https://img.shields.io/badge/module%20formats-umd%2C%20cjs%2C%20esm-green.svg" alt="module formats: umd, cjs, esm"></a>
|
18
|
+
<a href="https://codecov.io/gh/styled-components/styled-components"><img src="https://codecov.io/gh/styled-components/styled-components/coverage.svg?branch=main" alt="Code Coverage"></a>
|
19
|
+
</div>
|
20
|
+
|
21
|
+
---
|
22
|
+
|
23
|
+
## Looking for v5?
|
24
|
+
|
25
|
+
The `main` branch is under development of the upcoming v6 major version of styled-components. For changes targeting v5, please point your PRs at the `legacy-v5` branch.
|
26
|
+
|
27
|
+
---
|
28
|
+
|
29
|
+
Utilizing [tagged template literals](https://www.styled-components.com/docs/advanced#tagged-template-literals) (a recent addition to JavaScript) and the [power of CSS](https://www.styled-components.com/docs/api#supported-css), `styled-components` allow you to write actual CSS code to style your components. It also removes the mapping between components and styles – using components as a low-level styling construct could not be easier!
|
30
|
+
|
31
|
+
```jsx
|
32
|
+
const Button = styled.button`
|
33
|
+
color: grey;
|
34
|
+
`;
|
35
|
+
```
|
36
|
+
|
37
|
+
Alternatively, you may use [style objects](https://www.styled-components.com/docs/advanced#style-objects). This allows for easy porting of CSS from inline styles, while still supporting the more advanced styled-components capabilities like component selectors and media queries.
|
38
|
+
|
39
|
+
```jsx
|
40
|
+
const Button = styled.button({
|
41
|
+
color: 'grey',
|
42
|
+
});
|
43
|
+
```
|
44
|
+
|
45
|
+
Equivalent to:
|
46
|
+
|
47
|
+
```jsx
|
48
|
+
const Button = styled.button`
|
49
|
+
color: grey;
|
50
|
+
`;
|
51
|
+
```
|
52
|
+
|
53
|
+
`styled-components` is compatible with both React (for web) and React Native – meaning it's the perfect choice even for truly universal apps! See the [documentation about React Native](https://www.styled-components.com/docs/basics#react-native) for more information.
|
54
|
+
|
55
|
+
_Supported by [Front End Center](https://frontend.center). Thank you for making this possible!_
|
56
|
+
|
57
|
+
## Upgrading from v4
|
58
|
+
|
59
|
+
1. `npm install styled-components@^5.0.0 react@^16.8 react-dom@^16.8 react-is@^16.8`
|
60
|
+
1. ??
|
61
|
+
1. Profit!
|
62
|
+
|
63
|
+
> If you use jest-styled-components, make sure you update that too.
|
64
|
+
|
65
|
+
## [Docs](https://www.styled-components.com/docs)
|
66
|
+
|
67
|
+
**See the documentation at [styled-components.com/docs](https://www.styled-components.com/docs)** for more information about using `styled-components`!
|
68
|
+
|
69
|
+
Quicklinks to some of the most-visited pages:
|
70
|
+
|
71
|
+
- [**Getting started**](https://www.styled-components.com/docs/basics)
|
72
|
+
- [API Reference](https://styled-components.com/docs/api)
|
73
|
+
- [Theming](https://www.styled-components.com/docs/advanced#theming)
|
74
|
+
- [Server-side rendering](https://www.styled-components.com/docs/advanced#server-side-rendering)
|
75
|
+
- [Tagged Template Literals explained](https://www.styled-components.com/docs/advanced#tagged-template-literals)
|
76
|
+
|
77
|
+
## Example
|
78
|
+
|
79
|
+
<!-- prettier-ignore -->
|
80
|
+
```JSX
|
81
|
+
import React from 'react';
|
82
|
+
|
83
|
+
import styled from 'styled-components';
|
84
|
+
|
85
|
+
// Create a <Title> react component that renders an <h1> which is
|
86
|
+
// centered, palevioletred and sized at 1.5em
|
87
|
+
const Title = styled.h1`
|
88
|
+
font-size: 1.5em;
|
89
|
+
text-align: center;
|
90
|
+
color: palevioletred;
|
91
|
+
`;
|
92
|
+
|
93
|
+
// Create a <Wrapper> react component that renders a <section> with
|
94
|
+
// some padding and a papayawhip background
|
95
|
+
const Wrapper = styled.section`
|
96
|
+
padding: 4em;
|
97
|
+
background: papayawhip;
|
98
|
+
`;
|
99
|
+
|
100
|
+
// Use them like any other React component – except they're styled!
|
101
|
+
<Wrapper>
|
102
|
+
<Title>Hello World, this is my first styled component!</Title>
|
103
|
+
</Wrapper>
|
104
|
+
```
|
105
|
+
|
106
|
+
This is what you'll see in your browser:
|
107
|
+
|
108
|
+
<div align="center">
|
109
|
+
<a href="https://styled-components.com">
|
110
|
+
<img alt="Screenshot of the above code ran in a browser" src="http://i.imgur.com/wUJpcjY.jpg" />
|
111
|
+
</a>
|
112
|
+
</div>
|
113
|
+
|
114
|
+
## Babel Macro
|
115
|
+
|
116
|
+
If you're using tooling that has babel-plugin-macros set up, you can switch to the `styled-components/macro` import path instead to gain the effects of the babel plugin without further setup.
|
117
|
+
|
118
|
+
```js
|
119
|
+
import styled from 'styled-components/macro';
|
120
|
+
|
121
|
+
// A static className will be generated for Title (important for SSR)
|
122
|
+
const Title = styled.h1`
|
123
|
+
font-size: 1.5em;
|
124
|
+
text-align: center;
|
125
|
+
color: palevioletred;
|
126
|
+
`;
|
127
|
+
```
|
128
|
+
|
129
|
+
If you wish to provide configuration options to the babel plugin similar to how you would in a `.babelrc`, [see this guide](https://github.com/kentcdodds/babel-plugin-macros/blob/main/other/docs/author.md#config-experimental). The config name is `"styledComponents"`.
|
130
|
+
|
131
|
+
## Built with `styled-components`
|
132
|
+
|
133
|
+
A lot of hard work goes into community libraries, projects, and guides. A lot of them make it easier to get started or help you with your next project! There are also a whole lot of interesting apps and sites that people have built using styled-components.
|
134
|
+
|
135
|
+
Make sure to head over to [awesome-styled-components](https://github.com/styled-components/awesome-styled-components) to see them all! And please contribute and add your own work to the list so others can find it.
|
136
|
+
|
137
|
+
## Contributing
|
138
|
+
|
139
|
+
If you want to contribute to `styled-components` please see our [contributing and community guidelines](./CONTRIBUTING.md), they'll help you get set up locally and explain the whole process.
|
140
|
+
|
141
|
+
Please also note that all repositories under the `styled-components` organization follow our [Code of Conduct](./CODE_OF_CONDUCT.md), make sure to review and follow it.
|
142
|
+
|
143
|
+
## Badge
|
144
|
+
|
145
|
+
Let everyone know you're using _styled-components_ → [![style: styled-components](https://img.shields.io/badge/style-%F0%9F%92%85%20styled--components-orange.svg?colorB=daa357&colorA=db748e)](https://github.com/styled-components/styled-components)
|
146
|
+
|
147
|
+
```md
|
148
|
+
[![style: styled-components](https://img.shields.io/badge/style-%F0%9F%92%85%20styled--components-orange.svg?colorB=daa357&colorA=db748e)](https://github.com/styled-components/styled-components)
|
149
|
+
```
|
150
|
+
|
151
|
+
## Contributors
|
152
|
+
|
153
|
+
This project exists thanks to all the people who contribute. [[Contribute](CONTRIBUTING.md)].
|
154
|
+
<a href="https://github.com/styled-components/styled-components/graphs/contributors"><img src="https://opencollective.com/styled-components/contributors.svg?width=890" /></a>
|
155
|
+
|
156
|
+
## Backers
|
157
|
+
|
158
|
+
Thank you to all our backers! 🙏 [[Become a backer](https://opencollective.com/styled-components#backer)]
|
159
|
+
|
160
|
+
<a href="https://opencollective.com/styled-components#backers" target="_blank"><img src="https://opencollective.com/styled-components/backers.svg?width=890"></a>
|
161
|
+
|
162
|
+
## Sponsors
|
163
|
+
|
164
|
+
Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [[Become a sponsor](https://opencollective.com/styled-components#sponsor)]
|
165
|
+
|
166
|
+
<a href="https://opencollective.com/styled-components/sponsor/0/website" target="_blank"><img src="https://opencollective.com/styled-components/sponsor/0/avatar.svg"></a>
|
167
|
+
<a href="https://opencollective.com/styled-components/sponsor/1/website" target="_blank"><img src="https://opencollective.com/styled-components/sponsor/1/avatar.svg"></a>
|
168
|
+
<a href="https://opencollective.com/styled-components/sponsor/2/website" target="_blank"><img src="https://opencollective.com/styled-components/sponsor/2/avatar.svg"></a>
|
169
|
+
<a href="https://opencollective.com/styled-components/sponsor/3/website" target="_blank"><img src="https://opencollective.com/styled-components/sponsor/3/avatar.svg"></a>
|
170
|
+
<a href="https://opencollective.com/styled-components/sponsor/4/website" target="_blank"><img src="https://opencollective.com/styled-components/sponsor/4/avatar.svg"></a>
|
171
|
+
<a href="https://opencollective.com/styled-components/sponsor/5/website" target="_blank"><img src="https://opencollective.com/styled-components/sponsor/5/avatar.svg"></a>
|
172
|
+
<a href="https://opencollective.com/styled-components/sponsor/6/website" target="_blank"><img src="https://opencollective.com/styled-components/sponsor/6/avatar.svg"></a>
|
173
|
+
<a href="https://opencollective.com/styled-components/sponsor/7/website" target="_blank"><img src="https://opencollective.com/styled-components/sponsor/7/avatar.svg"></a>
|
174
|
+
<a href="https://opencollective.com/styled-components/sponsor/8/website" target="_blank"><img src="https://opencollective.com/styled-components/sponsor/8/avatar.svg"></a>
|
175
|
+
<a href="https://opencollective.com/styled-components/sponsor/9/website" target="_blank"><img src="https://opencollective.com/styled-components/sponsor/9/avatar.svg"></a>
|
176
|
+
|
177
|
+
## License
|
178
|
+
|
179
|
+
Licensed under the MIT License, Copyright © 2016-present Glen Maddern and Maximilian Stoiber.
|
180
|
+
|
181
|
+
See [LICENSE](./LICENSE) for more information.
|
182
|
+
|
183
|
+
## Acknowledgements
|
184
|
+
|
185
|
+
This project builds on a long line of earlier work by clever folks all around the world. We'd like to thank Charlie Somerville, Nik Graf, Sunil Pai, Michael Chan, Andrey Popp, Jed Watson & Andrey Sitnik who contributed ideas, code or inspiration.
|
186
|
+
|
187
|
+
Special thanks to [@okonet](https://github.com/okonet) for the fantastic logo.
|
package/dist/base.d.ts
ADDED
@@ -0,0 +1,12 @@
|
|
1
|
+
import { SC_VERSION } from './constants';
|
2
|
+
import createGlobalStyle from './constructors/createGlobalStyle';
|
3
|
+
import css from './constructors/css';
|
4
|
+
import keyframes from './constructors/keyframes';
|
5
|
+
import withTheme from './hoc/withTheme';
|
6
|
+
import ServerStyleSheet from './models/ServerStyleSheet';
|
7
|
+
import { IStyleSheetContext, IStyleSheetManager, IStylisContext, StyleSheetConsumer, StyleSheetContext, StyleSheetManager } from './models/StyleSheetManager';
|
8
|
+
import ThemeProvider, { ThemeConsumer, ThemeContext, useTheme } from './models/ThemeProvider';
|
9
|
+
import isStyledComponent from './utils/isStyledComponent';
|
10
|
+
export * from './secretInternals';
|
11
|
+
export { Attrs, DefaultTheme, ShouldForwardProp } from './types';
|
12
|
+
export { IStyleSheetContext, IStyleSheetManager, IStylisContext, ServerStyleSheet, StyleSheetConsumer, StyleSheetContext, StyleSheetManager, ThemeConsumer, ThemeContext, ThemeProvider, createGlobalStyle, css, isStyledComponent, keyframes, useTheme, SC_VERSION as version, withTheme, };
|
@@ -0,0 +1,8 @@
|
|
1
|
+
export declare const SC_ATTR: string;
|
2
|
+
export declare const SC_ATTR_ACTIVE = "active";
|
3
|
+
export declare const SC_ATTR_VERSION = "data-styled-version";
|
4
|
+
export declare const SC_VERSION: string;
|
5
|
+
export declare const SPLITTER = "/*!sc*/\n";
|
6
|
+
export declare const IS_BROWSER: boolean;
|
7
|
+
export declare const DISABLE_SPEEDY: boolean;
|
8
|
+
export declare const STATIC_EXECUTION_CONTEXT: {};
|
@@ -0,0 +1,18 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { Attrs, BaseObject, ExecutionProps, Interpolation, IStyledComponent, IStyledComponentFactory, KnownTarget, NoInfer, Runtime, StyledOptions, StyledTarget, Styles, Substitute } from '../types';
|
3
|
+
type AttrsResult<T extends Attrs<any>> = T extends (...args: any) => infer P ? P extends object ? P : never : T extends object ? T : never;
|
4
|
+
/**
|
5
|
+
* Based on Attrs being a simple object or function that returns
|
6
|
+
* a prop object, inspect the attrs result and attempt to extract
|
7
|
+
* any "as" prop usage to modify the runtime target.
|
8
|
+
*/
|
9
|
+
type AttrsTarget<R extends Runtime, T extends Attrs<any>, FallbackTarget extends StyledTarget<R>, Result extends ExecutionProps = AttrsResult<T>> = Result extends {
|
10
|
+
as: infer RuntimeTarget;
|
11
|
+
} ? RuntimeTarget extends KnownTarget ? RuntimeTarget : FallbackTarget : FallbackTarget;
|
12
|
+
export interface Styled<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object, OuterStatics extends object = BaseObject> {
|
13
|
+
<Props extends object = BaseObject, Statics extends object = BaseObject>(initialStyles: Styles<Substitute<OuterProps, NoInfer<Props>>>, ...interpolations: Interpolation<Substitute<OuterProps, NoInfer<Props>>>[]): IStyledComponent<R, Substitute<OuterProps, Props>> & OuterStatics & Statics & (R extends 'web' ? (Target extends string ? {} : Target) : {});
|
14
|
+
attrs: <Props extends object = BaseObject, PrivateMergedProps extends object = Substitute<OuterProps, Props>, PrivateAttrsArg extends Attrs<PrivateMergedProps> = Attrs<PrivateMergedProps>, PrivateResolvedTarget extends StyledTarget<R> = AttrsTarget<R, PrivateAttrsArg, Target>>(attrs: PrivateAttrsArg) => Styled<R, PrivateResolvedTarget, PrivateResolvedTarget extends KnownTarget ? Substitute<Substitute<OuterProps, React.ComponentPropsWithRef<PrivateResolvedTarget>>, Props> : PrivateMergedProps, OuterStatics>;
|
15
|
+
withConfig: (config: StyledOptions<R, OuterProps>) => Styled<R, Target, OuterProps, OuterStatics>;
|
16
|
+
}
|
17
|
+
export default function constructWithOptions<R extends Runtime, Target extends StyledTarget<R>, OuterProps extends object = Target extends KnownTarget ? React.ComponentPropsWithRef<Target> : BaseObject, OuterStatics extends object = BaseObject>(componentConstructor: IStyledComponentFactory<R, StyledTarget<R>, object, any>, tag: StyledTarget<R>, options?: StyledOptions<R, OuterProps>): Styled<R, Target, OuterProps, OuterStatics>;
|
18
|
+
export {};
|
@@ -0,0 +1,3 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { ExecutionProps, Interpolation, Styles } from '../types';
|
3
|
+
export default function createGlobalStyle<Props extends object>(strings: Styles<Props>, ...interpolations: Array<Interpolation<Props>>): React.NamedExoticComponent<ExecutionProps & Props>;
|
@@ -0,0 +1,4 @@
|
|
1
|
+
import { Interpolation, NoInfer, RuleSet, Styles } from '../types';
|
2
|
+
declare function css(styles: Styles<object>, ...interpolations: Interpolation<object>[]): RuleSet<object>;
|
3
|
+
declare function css<Props extends object>(styles: Styles<NoInfer<Props>>, ...interpolations: Interpolation<NoInfer<Props>>[]): RuleSet<NoInfer<Props>>;
|
4
|
+
export default css;
|
@@ -0,0 +1,138 @@
|
|
1
|
+
import { WebTarget } from '../types';
|
2
|
+
import { Styled } from './constructWithOptions';
|
3
|
+
declare const styled: (<Target extends WebTarget>(tag: Target) => Styled<"web", Target, Target extends import("../types").KnownTarget ? import("react").ComponentPropsWithRef<Target> : import("../types").BaseObject, import("../types").BaseObject>) & {
|
4
|
+
object: Styled<"web", "object", import("react").DetailedHTMLProps<import("react").ObjectHTMLAttributes<HTMLObjectElement>, HTMLObjectElement>, import("../types").BaseObject>;
|
5
|
+
a: Styled<"web", "a", import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, import("../types").BaseObject>;
|
6
|
+
abbr: Styled<"web", "abbr", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
7
|
+
address: Styled<"web", "address", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
8
|
+
area: Styled<"web", "area", import("react").DetailedHTMLProps<import("react").AreaHTMLAttributes<HTMLAreaElement>, HTMLAreaElement>, import("../types").BaseObject>;
|
9
|
+
article: Styled<"web", "article", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
10
|
+
aside: Styled<"web", "aside", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
11
|
+
audio: Styled<"web", "audio", import("react").DetailedHTMLProps<import("react").AudioHTMLAttributes<HTMLAudioElement>, HTMLAudioElement>, import("../types").BaseObject>;
|
12
|
+
b: Styled<"web", "b", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
13
|
+
base: Styled<"web", "base", import("react").DetailedHTMLProps<import("react").BaseHTMLAttributes<HTMLBaseElement>, HTMLBaseElement>, import("../types").BaseObject>;
|
14
|
+
bdi: Styled<"web", "bdi", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
15
|
+
bdo: Styled<"web", "bdo", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
16
|
+
big: Styled<"web", "big", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
17
|
+
blockquote: Styled<"web", "blockquote", import("react").DetailedHTMLProps<import("react").BlockquoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>, import("../types").BaseObject>;
|
18
|
+
body: Styled<"web", "body", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLBodyElement>, HTMLBodyElement>, import("../types").BaseObject>;
|
19
|
+
br: Styled<"web", "br", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLBRElement>, HTMLBRElement>, import("../types").BaseObject>;
|
20
|
+
button: Styled<"web", "button", import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, import("../types").BaseObject>;
|
21
|
+
canvas: Styled<"web", "canvas", import("react").DetailedHTMLProps<import("react").CanvasHTMLAttributes<HTMLCanvasElement>, HTMLCanvasElement>, import("../types").BaseObject>;
|
22
|
+
caption: Styled<"web", "caption", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
23
|
+
cite: Styled<"web", "cite", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
24
|
+
code: Styled<"web", "code", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
25
|
+
col: Styled<"web", "col", import("react").DetailedHTMLProps<import("react").ColHTMLAttributes<HTMLTableColElement>, HTMLTableColElement>, import("../types").BaseObject>;
|
26
|
+
colgroup: Styled<"web", "colgroup", import("react").DetailedHTMLProps<import("react").ColgroupHTMLAttributes<HTMLTableColElement>, HTMLTableColElement>, import("../types").BaseObject>;
|
27
|
+
data: Styled<"web", "data", import("react").DetailedHTMLProps<import("react").DataHTMLAttributes<HTMLDataElement>, HTMLDataElement>, import("../types").BaseObject>;
|
28
|
+
datalist: Styled<"web", "datalist", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDataListElement>, HTMLDataListElement>, import("../types").BaseObject>;
|
29
|
+
dd: Styled<"web", "dd", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
30
|
+
del: Styled<"web", "del", import("react").DetailedHTMLProps<import("react").DelHTMLAttributes<HTMLModElement>, HTMLModElement>, import("../types").BaseObject>;
|
31
|
+
details: Styled<"web", "details", import("react").DetailedHTMLProps<import("react").DetailsHTMLAttributes<HTMLDetailsElement>, HTMLDetailsElement>, import("../types").BaseObject>;
|
32
|
+
dfn: Styled<"web", "dfn", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
33
|
+
dialog: Styled<"web", "dialog", import("react").DetailedHTMLProps<import("react").DialogHTMLAttributes<HTMLDialogElement>, HTMLDialogElement>, import("../types").BaseObject>;
|
34
|
+
div: Styled<"web", "div", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import("../types").BaseObject>;
|
35
|
+
dl: Styled<"web", "dl", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDListElement>, HTMLDListElement>, import("../types").BaseObject>;
|
36
|
+
dt: Styled<"web", "dt", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
37
|
+
em: Styled<"web", "em", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
38
|
+
embed: Styled<"web", "embed", import("react").DetailedHTMLProps<import("react").EmbedHTMLAttributes<HTMLEmbedElement>, HTMLEmbedElement>, import("../types").BaseObject>;
|
39
|
+
fieldset: Styled<"web", "fieldset", import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, import("../types").BaseObject>;
|
40
|
+
figcaption: Styled<"web", "figcaption", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
41
|
+
figure: Styled<"web", "figure", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
42
|
+
footer: Styled<"web", "footer", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
43
|
+
form: Styled<"web", "form", import("react").DetailedHTMLProps<import("react").FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>, import("../types").BaseObject>;
|
44
|
+
h1: Styled<"web", "h1", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, import("../types").BaseObject>;
|
45
|
+
h2: Styled<"web", "h2", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, import("../types").BaseObject>;
|
46
|
+
h3: Styled<"web", "h3", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, import("../types").BaseObject>;
|
47
|
+
h4: Styled<"web", "h4", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, import("../types").BaseObject>;
|
48
|
+
h5: Styled<"web", "h5", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, import("../types").BaseObject>;
|
49
|
+
h6: Styled<"web", "h6", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, import("../types").BaseObject>;
|
50
|
+
header: Styled<"web", "header", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
51
|
+
hgroup: Styled<"web", "hgroup", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
52
|
+
hr: Styled<"web", "hr", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHRElement>, HTMLHRElement>, import("../types").BaseObject>;
|
53
|
+
html: Styled<"web", "html", import("react").DetailedHTMLProps<import("react").HtmlHTMLAttributes<HTMLHtmlElement>, HTMLHtmlElement>, import("../types").BaseObject>;
|
54
|
+
i: Styled<"web", "i", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
55
|
+
iframe: Styled<"web", "iframe", import("react").DetailedHTMLProps<import("react").IframeHTMLAttributes<HTMLIFrameElement>, HTMLIFrameElement>, import("../types").BaseObject>;
|
56
|
+
img: Styled<"web", "img", import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, import("../types").BaseObject>;
|
57
|
+
input: Styled<"web", "input", import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, import("../types").BaseObject>;
|
58
|
+
ins: Styled<"web", "ins", import("react").DetailedHTMLProps<import("react").InsHTMLAttributes<HTMLModElement>, HTMLModElement>, import("../types").BaseObject>;
|
59
|
+
kbd: Styled<"web", "kbd", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
60
|
+
keygen: Styled<"web", "keygen", import("react").DetailedHTMLProps<import("react").KeygenHTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
61
|
+
label: Styled<"web", "label", import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, import("../types").BaseObject>;
|
62
|
+
legend: Styled<"web", "legend", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, import("../types").BaseObject>;
|
63
|
+
li: Styled<"web", "li", import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, import("../types").BaseObject>;
|
64
|
+
link: Styled<"web", "link", import("react").DetailedHTMLProps<import("react").LinkHTMLAttributes<HTMLLinkElement>, HTMLLinkElement>, import("../types").BaseObject>;
|
65
|
+
main: Styled<"web", "main", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
66
|
+
map: Styled<"web", "map", import("react").DetailedHTMLProps<import("react").MapHTMLAttributes<HTMLMapElement>, HTMLMapElement>, import("../types").BaseObject>;
|
67
|
+
mark: Styled<"web", "mark", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
68
|
+
menu: Styled<"web", "menu", import("react").DetailedHTMLProps<import("react").MenuHTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
69
|
+
menuitem: Styled<"web", "menuitem", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
70
|
+
meta: Styled<"web", "meta", import("react").DetailedHTMLProps<import("react").MetaHTMLAttributes<HTMLMetaElement>, HTMLMetaElement>, import("../types").BaseObject>;
|
71
|
+
meter: Styled<"web", "meter", import("react").DetailedHTMLProps<import("react").MeterHTMLAttributes<HTMLMeterElement>, HTMLMeterElement>, import("../types").BaseObject>;
|
72
|
+
nav: Styled<"web", "nav", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
73
|
+
noscript: Styled<"web", "noscript", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
74
|
+
ol: Styled<"web", "ol", import("react").DetailedHTMLProps<import("react").OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, import("../types").BaseObject>;
|
75
|
+
optgroup: Styled<"web", "optgroup", import("react").DetailedHTMLProps<import("react").OptgroupHTMLAttributes<HTMLOptGroupElement>, HTMLOptGroupElement>, import("../types").BaseObject>;
|
76
|
+
option: Styled<"web", "option", import("react").DetailedHTMLProps<import("react").OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>, import("../types").BaseObject>;
|
77
|
+
output: Styled<"web", "output", import("react").DetailedHTMLProps<import("react").OutputHTMLAttributes<HTMLOutputElement>, HTMLOutputElement>, import("../types").BaseObject>;
|
78
|
+
p: Styled<"web", "p", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, import("../types").BaseObject>;
|
79
|
+
param: Styled<"web", "param", import("react").DetailedHTMLProps<import("react").ParamHTMLAttributes<HTMLParamElement>, HTMLParamElement>, import("../types").BaseObject>;
|
80
|
+
picture: Styled<"web", "picture", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
81
|
+
pre: Styled<"web", "pre", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLPreElement>, HTMLPreElement>, import("../types").BaseObject>;
|
82
|
+
progress: Styled<"web", "progress", import("react").DetailedHTMLProps<import("react").ProgressHTMLAttributes<HTMLProgressElement>, HTMLProgressElement>, import("../types").BaseObject>;
|
83
|
+
q: Styled<"web", "q", import("react").DetailedHTMLProps<import("react").QuoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>, import("../types").BaseObject>;
|
84
|
+
rp: Styled<"web", "rp", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
85
|
+
rt: Styled<"web", "rt", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
86
|
+
ruby: Styled<"web", "ruby", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
87
|
+
s: Styled<"web", "s", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
88
|
+
samp: Styled<"web", "samp", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
89
|
+
script: Styled<"web", "script", import("react").DetailedHTMLProps<import("react").ScriptHTMLAttributes<HTMLScriptElement>, HTMLScriptElement>, import("../types").BaseObject>;
|
90
|
+
section: Styled<"web", "section", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
91
|
+
select: Styled<"web", "select", import("react").DetailedHTMLProps<import("react").SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, import("../types").BaseObject>;
|
92
|
+
small: Styled<"web", "small", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
93
|
+
source: Styled<"web", "source", import("react").DetailedHTMLProps<import("react").SourceHTMLAttributes<HTMLSourceElement>, HTMLSourceElement>, import("../types").BaseObject>;
|
94
|
+
span: Styled<"web", "span", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, import("../types").BaseObject>;
|
95
|
+
strong: Styled<"web", "strong", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
96
|
+
style: Styled<"web", "style", import("react").DetailedHTMLProps<import("react").StyleHTMLAttributes<HTMLStyleElement>, HTMLStyleElement>, import("../types").BaseObject>;
|
97
|
+
sub: Styled<"web", "sub", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
98
|
+
summary: Styled<"web", "summary", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
99
|
+
sup: Styled<"web", "sup", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
100
|
+
table: Styled<"web", "table", import("react").DetailedHTMLProps<import("react").TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>, import("../types").BaseObject>;
|
101
|
+
tbody: Styled<"web", "tbody", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, import("../types").BaseObject>;
|
102
|
+
td: Styled<"web", "td", import("react").DetailedHTMLProps<import("react").TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, import("../types").BaseObject>;
|
103
|
+
textarea: Styled<"web", "textarea", import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, import("../types").BaseObject>;
|
104
|
+
tfoot: Styled<"web", "tfoot", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, import("../types").BaseObject>;
|
105
|
+
th: Styled<"web", "th", import("react").DetailedHTMLProps<import("react").ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, import("../types").BaseObject>;
|
106
|
+
thead: Styled<"web", "thead", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, import("../types").BaseObject>;
|
107
|
+
time: Styled<"web", "time", import("react").DetailedHTMLProps<import("react").TimeHTMLAttributes<HTMLTimeElement>, HTMLTimeElement>, import("../types").BaseObject>;
|
108
|
+
tr: Styled<"web", "tr", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, import("../types").BaseObject>;
|
109
|
+
track: Styled<"web", "track", import("react").DetailedHTMLProps<import("react").TrackHTMLAttributes<HTMLTrackElement>, HTMLTrackElement>, import("../types").BaseObject>;
|
110
|
+
u: Styled<"web", "u", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
111
|
+
ul: Styled<"web", "ul", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, import("../types").BaseObject>;
|
112
|
+
use: Styled<"web", "use", import("react").SVGProps<SVGUseElement>, import("../types").BaseObject>;
|
113
|
+
var: Styled<"web", "var", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
114
|
+
video: Styled<"web", "video", import("react").DetailedHTMLProps<import("react").VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, import("../types").BaseObject>;
|
115
|
+
wbr: Styled<"web", "wbr", import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, import("../types").BaseObject>;
|
116
|
+
circle: Styled<"web", "circle", import("react").SVGProps<SVGCircleElement>, import("../types").BaseObject>;
|
117
|
+
clipPath: Styled<"web", "clipPath", import("react").SVGProps<SVGClipPathElement>, import("../types").BaseObject>;
|
118
|
+
defs: Styled<"web", "defs", import("react").SVGProps<SVGDefsElement>, import("../types").BaseObject>;
|
119
|
+
ellipse: Styled<"web", "ellipse", import("react").SVGProps<SVGEllipseElement>, import("../types").BaseObject>;
|
120
|
+
foreignObject: Styled<"web", "foreignObject", import("react").SVGProps<SVGForeignObjectElement>, import("../types").BaseObject>;
|
121
|
+
g: Styled<"web", "g", import("react").SVGProps<SVGGElement>, import("../types").BaseObject>;
|
122
|
+
image: Styled<"web", "image", import("react").SVGProps<SVGImageElement>, import("../types").BaseObject>;
|
123
|
+
line: Styled<"web", "line", import("react").SVGLineElementAttributes<SVGLineElement>, import("../types").BaseObject>;
|
124
|
+
linearGradient: Styled<"web", "linearGradient", import("react").SVGProps<SVGLinearGradientElement>, import("../types").BaseObject>;
|
125
|
+
marker: Styled<"web", "marker", import("react").SVGProps<SVGMarkerElement>, import("../types").BaseObject>;
|
126
|
+
mask: Styled<"web", "mask", import("react").SVGProps<SVGMaskElement>, import("../types").BaseObject>;
|
127
|
+
path: Styled<"web", "path", import("react").SVGProps<SVGPathElement>, import("../types").BaseObject>;
|
128
|
+
pattern: Styled<"web", "pattern", import("react").SVGProps<SVGPatternElement>, import("../types").BaseObject>;
|
129
|
+
polygon: Styled<"web", "polygon", import("react").SVGProps<SVGPolygonElement>, import("../types").BaseObject>;
|
130
|
+
polyline: Styled<"web", "polyline", import("react").SVGProps<SVGPolylineElement>, import("../types").BaseObject>;
|
131
|
+
radialGradient: Styled<"web", "radialGradient", import("react").SVGProps<SVGRadialGradientElement>, import("../types").BaseObject>;
|
132
|
+
rect: Styled<"web", "rect", import("react").SVGProps<SVGRectElement>, import("../types").BaseObject>;
|
133
|
+
stop: Styled<"web", "stop", import("react").SVGProps<SVGStopElement>, import("../types").BaseObject>;
|
134
|
+
svg: Styled<"web", "svg", import("react").SVGProps<SVGSVGElement>, import("../types").BaseObject>;
|
135
|
+
text: Styled<"web", "text", import("react").SVGTextElementAttributes<SVGTextElement>, import("../types").BaseObject>;
|
136
|
+
tspan: Styled<"web", "tspan", import("react").SVGProps<SVGTSpanElement>, import("../types").BaseObject>;
|
137
|
+
};
|
138
|
+
export default styled;
|
@@ -0,0 +1,3 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { AnyComponent, ExecutionProps } from '../types';
|
3
|
+
export default function withTheme<T extends AnyComponent>(Component: T): React.ForwardRefExoticComponent<React.PropsWithoutRef<JSX.LibraryManagedAttributes<T, ExecutionProps>> & React.RefAttributes<T>> & { [key in Exclude<keyof T, T extends React.MemoExoticComponent<any> ? "defaultProps" | "displayName" | "$$typeof" | "propTypes" | "compare" | "type" : T extends React.ForwardRefExoticComponent<any> ? "defaultProps" | "displayName" | "$$typeof" | "propTypes" | "render" : "length" | "defaultProps" | "displayName" | "propTypes" | "contextType" | "contextTypes" | "childContextTypes" | "getDerivedStateFromProps" | "getDerivedStateFromError" | "type" | "getDefaultProps" | "mixins" | "name" | "prototype" | "caller" | "callee" | "arguments" | "arity">]: T[key]; };
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
package/dist/index.d.ts
ADDED
@@ -0,0 +1,4 @@
|
|
1
|
+
import styled from './constructors/styled';
|
2
|
+
export * from './base';
|
3
|
+
export { CSSKeyframes, CSSObject, CSSProp, CSSProperties, CSSPseudos, DataAttributes, DefaultTheme, ExecutionContext, ExecutionProps, IStyledComponent, IStyledComponentFactory, IStyledStatics, Interpolation, PolymorphicComponent, PolymorphicComponentProps, RuleSet, Runtime, StyleFunction, StyledObject, StyledOptions, SupportedHTMLElements, WebTarget, } from './types';
|
4
|
+
export { styled as default, styled };
|
@@ -0,0 +1,15 @@
|
|
1
|
+
import StyleSheet from '../sheet';
|
2
|
+
import { ExecutionContext, RuleSet, Stringifier } from '../types';
|
3
|
+
/**
|
4
|
+
* ComponentStyle is all the CSS-specific stuff, not the React-specific stuff.
|
5
|
+
*/
|
6
|
+
export default class ComponentStyle {
|
7
|
+
baseHash: number;
|
8
|
+
baseStyle: ComponentStyle | null | undefined;
|
9
|
+
componentId: string;
|
10
|
+
isStatic: boolean;
|
11
|
+
rules: RuleSet<any>;
|
12
|
+
staticRulesId: string;
|
13
|
+
constructor(rules: RuleSet<any>, componentId: string, baseStyle?: ComponentStyle | undefined);
|
14
|
+
generateAndInjectStyles(executionContext: ExecutionContext, styleSheet: StyleSheet, stylis: Stringifier): string;
|
15
|
+
}
|
@@ -0,0 +1,11 @@
|
|
1
|
+
import StyleSheet from '../sheet';
|
2
|
+
import { ExecutionContext, RuleSet, Stringifier } from '../types';
|
3
|
+
export default class GlobalStyle<Props extends object> {
|
4
|
+
componentId: string;
|
5
|
+
isStatic: boolean;
|
6
|
+
rules: RuleSet<Props>;
|
7
|
+
constructor(rules: RuleSet<Props>, componentId: string);
|
8
|
+
createStyles(instance: number, executionContext: ExecutionContext & Props, styleSheet: StyleSheet, stylis: Stringifier): void;
|
9
|
+
removeStyles(instance: number, styleSheet: StyleSheet): void;
|
10
|
+
renderStyles(instance: number, executionContext: ExecutionContext & Props, styleSheet: StyleSheet, stylis: Stringifier): void;
|
11
|
+
}
|
@@ -0,0 +1,6 @@
|
|
1
|
+
import { IInlineStyleConstructor, StyleSheet } from '../types';
|
2
|
+
export declare const resetStyleCache: () => void;
|
3
|
+
/**
|
4
|
+
* InlineStyle takes arbitrary CSS and generates a flat object
|
5
|
+
*/
|
6
|
+
export default function makeInlineStyleClass<Props extends object>(styleSheet: StyleSheet): IInlineStyleConstructor<Props>;
|
@@ -0,0 +1,10 @@
|
|
1
|
+
import StyleSheet from '../sheet';
|
2
|
+
import { Keyframes as KeyframesType, Stringifier } from '../types';
|
3
|
+
export default class Keyframes implements KeyframesType {
|
4
|
+
id: string;
|
5
|
+
name: string;
|
6
|
+
rules: string;
|
7
|
+
constructor(name: string, rules: string);
|
8
|
+
inject: (styleSheet: StyleSheet, stylisInstance?: Stringifier) => void;
|
9
|
+
getName(stylisInstance?: Stringifier): string;
|
10
|
+
}
|
@@ -0,0 +1,16 @@
|
|
1
|
+
/// <reference types="node" />
|
2
|
+
import React from 'react';
|
3
|
+
import type * as streamInternal from 'stream';
|
4
|
+
import { Readable } from 'stream';
|
5
|
+
import StyleSheet from '../sheet';
|
6
|
+
export default class ServerStyleSheet {
|
7
|
+
instance: StyleSheet;
|
8
|
+
sealed: boolean;
|
9
|
+
constructor();
|
10
|
+
_emitSheetCSS: () => string;
|
11
|
+
collectStyles(children: any): JSX.Element;
|
12
|
+
getStyleTags: () => string;
|
13
|
+
getStyleElement: () => React.JSX.Element[];
|
14
|
+
interleaveWithNodeStream(input: Readable): streamInternal.Transform;
|
15
|
+
seal: () => void;
|
16
|
+
}
|
@@ -0,0 +1,65 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import type stylis from 'stylis';
|
3
|
+
import StyleSheet from '../sheet';
|
4
|
+
import { ShouldForwardProp, Stringifier } from '../types';
|
5
|
+
export declare const mainSheet: StyleSheet;
|
6
|
+
export declare const mainStylis: Stringifier;
|
7
|
+
export type IStyleSheetContext = {
|
8
|
+
shouldForwardProp?: ShouldForwardProp<'web'> | undefined;
|
9
|
+
styleSheet: StyleSheet;
|
10
|
+
stylis: Stringifier;
|
11
|
+
};
|
12
|
+
export declare const StyleSheetContext: React.Context<IStyleSheetContext>;
|
13
|
+
export declare const StyleSheetConsumer: React.Consumer<IStyleSheetContext>;
|
14
|
+
export type IStylisContext = Stringifier | void;
|
15
|
+
export declare const StylisContext: React.Context<IStylisContext>;
|
16
|
+
export declare const StylisConsumer: React.Consumer<IStylisContext>;
|
17
|
+
export declare function useStyleSheetContext(): IStyleSheetContext;
|
18
|
+
export type IStyleSheetManager = React.PropsWithChildren<{
|
19
|
+
/**
|
20
|
+
* If desired, you can pass this prop to disable "speedy" insertion mode, which
|
21
|
+
* uses the browser [CSSOM APIs](https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet).
|
22
|
+
* When disabled, rules are inserted as simple text into style blocks.
|
23
|
+
*/
|
24
|
+
disableCSSOMInjection?: undefined | boolean;
|
25
|
+
/**
|
26
|
+
* If you are working exclusively with modern browsers, vendor prefixes can often be omitted
|
27
|
+
* to reduce the weight of CSS on the page.
|
28
|
+
*/
|
29
|
+
enableVendorPrefixes?: undefined | boolean;
|
30
|
+
/**
|
31
|
+
* Provide an optional selector to be prepended to all generated style rules.
|
32
|
+
*/
|
33
|
+
namespace?: undefined | string;
|
34
|
+
/**
|
35
|
+
* Create and provide your own `StyleSheet` if necessary for advanced SSR scenarios.
|
36
|
+
*/
|
37
|
+
sheet?: undefined | StyleSheet;
|
38
|
+
/**
|
39
|
+
* Starting in v6, styled-components no longer does its own prop validation
|
40
|
+
* and recommends use of transient props "$prop" to pass style-only props to
|
41
|
+
* components. If for some reason you are not able to use transient props, a
|
42
|
+
* prop validation function can be provided via `StyleSheetManager`, such as
|
43
|
+
* `@emotion/is-prop-valid`.
|
44
|
+
*
|
45
|
+
* When the return value is `true`, props will be forwarded to the DOM/underlying
|
46
|
+
* component. If return value is `false`, the prop will be discarded after styles
|
47
|
+
* are calculated.
|
48
|
+
*
|
49
|
+
* Manually composing `styled.{element}.withConfig({shouldForwardProp})` will
|
50
|
+
* override this default.
|
51
|
+
*/
|
52
|
+
shouldForwardProp?: undefined | IStyleSheetContext['shouldForwardProp'];
|
53
|
+
/**
|
54
|
+
* An array of plugins to be run by stylis (style processor) during compilation.
|
55
|
+
* Check out [what's available on npm*](https://www.npmjs.com/search?q=keywords%3Astylis).
|
56
|
+
*
|
57
|
+
* \* The plugin(s) must be compatible with stylis v4 or above.
|
58
|
+
*/
|
59
|
+
stylisPlugins?: undefined | stylis.Middleware[];
|
60
|
+
/**
|
61
|
+
* Provide an alternate DOM node to host generated styles; useful for iframes.
|
62
|
+
*/
|
63
|
+
target?: undefined | HTMLElement;
|
64
|
+
}>;
|
65
|
+
export declare function StyleSheetManager(props: IStyleSheetManager): JSX.Element;
|
@@ -0,0 +1,3 @@
|
|
1
|
+
import type { BaseObject, IStyledComponentFactory, RuleSet, StyledOptions, WebTarget } from '../types';
|
2
|
+
declare function createStyledComponent<Target extends WebTarget, OuterProps extends object, Statics extends object = BaseObject>(target: Target, options: StyledOptions<'web', OuterProps>, rules: RuleSet<OuterProps>): ReturnType<IStyledComponentFactory<'web', Target, OuterProps, Statics>>;
|
3
|
+
export default createStyledComponent;
|
@@ -0,0 +1,3 @@
|
|
1
|
+
import type { BaseObject, ExecutionProps, IInlineStyleConstructor, IStyledComponent, IStyledComponentFactory, NativeTarget, RuleSet, StyledOptions } from '../types';
|
2
|
+
declare const _default: (InlineStyle: IInlineStyleConstructor<any>) => <Target extends NativeTarget, OuterProps extends ExecutionProps, Statics extends object = BaseObject>(target: Target, options: StyledOptions<"native", OuterProps>, rules: RuleSet<OuterProps>) => IStyledComponent<"native", import("../types").Substitute<OuterProps, object>> & Statics & object;
|
3
|
+
export default _default;
|