Convert CSS text to a React Native stylesheet object

Overview

css-to-react-native

Converts CSS text to a React Native stylesheet object.

Try it here

font-size: 18px;
line-height: 24px;
color: red;
{
  fontSize: 18,
  lineHeight: 24,
  color: 'red',
}

Converts all number-like values to numbers, and string-like to strings.

Automatically converts indirect values to their React Native equivalents.

text-shadow-offset: 10px 5px;
font-variant: small-caps;
transform: translate(10px, 5px) scale(5);
{
  textShadowOffset: { width: 10, height: 5 },
  fontVariant: ['small-caps'],
  // Fixes backwards transform order
  transform: [
    { translateY: 5 },
    { translateX: 10 },
    { scale: 5 },
  ]
}

Also allows shorthand values.

font: bold 14px/16px "Helvetica";
margin: 5px 7px 2px;
{
  fontFamily: 'Helvetica',
  fontSize: 14,
  fontWeight: 'bold',
  fontStyle: 'normal',
  fontVariant: [],
  lineHeight: 16,
  marginTop: 5,
  marginRight: 7,
  marginBottom: 2,
  marginLeft: 7,
}

Shorthands will only accept values that are supported in React, so background will only accept a colour, backgroundColor

There is also support for the box-shadow shorthand, and this converts into shadow- properties. Note that these only work on iOS.

Shorthand Notes

border{Top,Right,Bottom,Left} shorthands are not supported, because borderStyle cannot be applied to individual border sides.

API

The API is mostly for implementors. However, the main API may be useful for non-implementors. The main API is an array of [property, value] tuples.

import transform from 'css-to-react-native';
// or const transform = require('css-to-react-native').default;

transform([
  ['font', 'bold 14px/16px "Helvetica"'],
  ['margin', '5px 7px 2px'],
  ['border-left-width', '5px'],
]); // => { fontFamily: 'Helvetica', ... }

We don't provide a way to get these style tuples in this library, so you'll need to do that yourself. I expect most people will use postCSS or another CSS parser. You should try avoid getting these with string.split, as that has a lot of edge cases (colons and semi-colons apearing in comments etc.)

For implementors, there is also a few extra APIs available.

These are for specific use-cases, and most people should just be using the API above.

import { getPropertyName, getStylesForProperty } from 'css-to-react-native';

getPropertyName('border-width'); // => 'borderWidth'
getStylesForProperty('borderWidth', '1px 0px 2px 0px'); // => { borderTopWidth: 1, ... }

Should you wish to opt-out of transforming certain shorthands, an array of property names in camelCase can be passed as a second argument to transform.

transform([['border-radius', '50px']], ['borderRadius']);
// { borderRadius: 50 } rather than { borderTopLeft: ... }

This can also be done by passing a third argument, false to getStylesForProperty.

License

Licensed under the MIT License, Copyright © 2019 Krister Kari, Jacob Parker, and Maximilian Stoiber.

See LICENSE.md for more information.

Comments
  • Unitless shorthands

    Unitless shorthands

    So on SC we've seen some complaints about properties being able to be unitless, e.g. padding-top: 2, but not shorthands: padding: 2px.

    This probably comes from the difference here: https://github.com/styled-components/css-to-react-native/blob/master/src/index.js#L8

    And here: https://github.com/styled-components/css-to-react-native/blob/master/src/tokenTypes.js#L31

    Since most directions don't expect unitless numbers: https://github.com/styled-components/css-to-react-native/blob/master/src/transforms/util.js#L6

    The question is, since this seems like an inconsistency, do we want to change this? :)

    cc @mxstbr @jacobp100

    discussion 
    opened by kitten 46
  • :hover with react-native and react-native-web

    :hover with react-native and react-native-web

    Hi, i'm using styled-components in react-native app lets say i have Link component:

        import styled from 'styled-components/native';
    
        const Link = styled.Text`
          color: 'red';
    
          &:hover {
            color: 'blue';
          }
        `
    

    then i 'compile' my RN code with react-native-web

    all is great expect that hover is not working (text color remains red on hover)

    my guess is that css-to-react-native is removing the hover definition

    any idea how to fix this?

    opened by achtan 26
  • Units?

    Units?

    RN now to supports percentages now. I.e. { height: "50%" }. We actually mostly support this, so you can write height: 50 or height: 50%, and both will work.

    This makes it a little inconsistent, where sometimes you include a unit, and sometimes you don’t. We should try and achieve more consistency by forcing a unit when the value is a length. In the previous example, you would have to write height: 50px.

    This would remove ambiguities in the flex shorthand, and would allow us to accept line-heights as a multiple of font-size in the font shorthand.

    Not only that, but you could sort of share code between web and native.

    const Component = isWeb ? 'div' : View;
    const StyledComponent = styled(Component)`
      height: 50px;
    `;
    

    This is obviously a breaking change, so we should look towards v2.

    opened by jacobp100 18
  • aggressive color checking

    aggressive color checking

    Hi, first of all. Thank you for this library.

    I've build a little styled-components replacement for react-native for our company, that adds some features like direct access to theme variables by name.

    The heavy lifting is provided by this library. Now in 3a3a596b4d60abcb76242a45f12cd8d846ff16db you made the check for color variables on borderColor much more aggressive. Before it would simply give me an object with whatever I had entered (like a color name from my scheme) and I could then resolve that name to the actual color with my library. Now I get an error.

    Is there a chance to allow normal words again as color values, or would you accept a PR that would allow adding valid color values via a configuration function.

    opened by MrLoh 16
  • Background issue with React native 0.61-rc3

    Background issue with React native 0.61-rc3

    Hello

    After investigating with @Trobyss we found an issue with styled-components after migrating on 0.61-rc3 to test on ANDROID.

    ANDROID ONLY
    "react": "16.9.0",
    "react-native": "0.61.0-rc.3",
    "styled-components": "^4.3.2"
    

    You can freely switch between Bug and BuggingView to see the difference. The text is correctly displaying above the background in absolute, but not the background of the text container.

    Without styled-components, this works.

    import React from "react";
    import { Text, View } from "react-native";
    import styled from "styled-components/native";
    
    const Bug = () => {
      return (
        <View style={{ flex: 1 }}>
          <BuggingView />
          <PageWrapper>
            <Text>
              This should appear above backgroundThis should appear above background This should appear above background This should appear
              above above background This should appear above background This should appear above background This should appear above background
              This This should appear above background This should appear above background This should appear above background This should
              appear above background This should appear above background This should appear above background This should appear above
              background This should appear above background This should appear above background This should appear above background This should
              appear above background This should appear above background This should appear above background This should appear above
              background This should appear above background This should appear above background This should appear above background This should
              appear above background This should appear above background This should appear above background This should appear above
              background This should appear above background
            </Text>
          </PageWrapper>
        </View>
      );
    };
    
    const BuggingView = styled.View`
      height: 200;
      position: absolute;
      background-color: blue;
      top: 0;
      right: 0;
      left: 0;
    `;
    const PageWrapper = styled.View`
      background-color: red;
      padding: 20px; 
      border-radius: 8px;
      flex: 1;
      margin: 20px;
    `;
    
    const NotBug = () => (
      <View style={{ flex: 1 }}>
        <View style={{ height: 200, backgroundColor: 'blue', position: "absolute", top: 0, right: 0, left: 0 }} />
        <View style={{ backgroundColor: "red", padding: 20, flex: 1, margin: 20 }}>
          <Text>
            This should appear above backgroundThis should appear above background This should appear above background This should appear above
            above background This should appear above background This should appear above background This should appear above background This
            This should appear above background This should appear above background This should appear above background This should appear above
            background This should appear above background This should appear above background This should appear above background This should
            appear above background This should appear above background This should appear above background This should appear above background
            This should appear above background This should appear above background This should appear above background This should appear above
            background This should appear above background This should appear above background This should appear above background This should
            appear above background This should appear above background This should appear above background This should appear above background
          </Text>
        </View>
      </View>
    );
    
    export default Bug;
    

    Any idea what would cause that ? as you can see this works with latest expo version : https://snack.expo.io/@afigueiredo/1fe053

    Best regards

    opened by ScreamZ 16
  • Using stylelint to lint known properties

    Using stylelint to lint known properties

    I have been experimenting with the idea of using stylelint to verify that you can only use the CSS properties that css-to-react-native supports, like the standard stylelint rule https://github.com/stylelint/stylelint/tree/master/lib/rules/property-no-unknown.

    I have though of creating a couple of tools to help with this.

    First thing I was thinking of would be to create a new repo that would list all properties that css-to-react-native supports. The same idea as https://github.com/betit/known-css-properties, but with a simpler implementation. Those props could then be updated whenever there are new properties supported or old ones deprecated.

    Next thing would be to create a stylelint plugin, e.g. react-native/no-unknown-css-properties. The rule would clearly state that it is meant to be used with tools that use this CSS parser.

    There could also be a rule called react-native/no-unknown-style-properties, which would only allow properties that are supported by React Native by default.

    What do you think @jacobp100 @mxstbr ?

    opened by kristerkari 15
  • Allow CSS custom properties to be used without converting to camel case

    Allow CSS custom properties to be used without converting to camel case

    Currently the parser turns any CSS property names to camel case.

    There is however a use case for implementing support for CSS Custom properties. Here's an example of how custom props can be used: https://github.com/kristerkari/react-native-stylus-transformer/issues/3#issuecomment-397918744

    So if we just don't turn the custom property to camel case, everything works like it did before, but implementations of updating custom properties with Javascript are now possible.

    ping @jacobp100

    opened by kristerkari 11
  • API

    API

    Not sure how much or little this module should do.

    It could do the whole CSS string -> ReactNative object thing, but it could also just be responsible for the ReactNative specific styles:

    import transform from 'css-to-react-native';
    
    // ...
    
    declarations.forEach(decl => { styles[decl.property] = transform(decl.value) })
    

    In this case it would just check if it's one of the special reactnative declarations and then transform just those, otherwise return the value unchanged.

    What do you think?

    opened by mxstbr 10
  • Handle null and undefined values

    Handle null and undefined values

    transformRawValue expects a string as input. When it receives '1', for example, it's currently transforming to 1.

    But null and undefined are also valid values on react native styles (e.g. I've seen width: null being used sometimes as a workaround to some issues)

    If we pass getStylesForProperty('width', null) it will crash and if we pass getStylesForProperty('width', 'null') it will return { width: 'null' } which is not a valid value.

    opened by brunolemos 9
  • [feature request] Add support to do reverse

    [feature request] Add support to do reverse

    Usecase: I have a custom styled component, where I want to use third-party styles (which are in style object form) alongside my styles and functions:

    const MyComponent = styled(SomeComponent)`
      font-size: 16px;
      ${({ color }) => color && `color: ${color}`}
    `
    
    Text.defaultProps = {
      style: thirdPartyStyleObject,
      color: '#FAFAFA', // doesn't work if color is defined inside `thirdPartyStyleObject`
    }
    

    The solution would be to be able to convert thirdPartyStyleObject to css string, which could be used inside my styled component.

    Is there any other solution that I'm unaware of?

    opened by selrond 8
  • Allow unsupported length units to be used

    Allow unsupported length units to be used

    This PR adds support to allow valid CSS length units to be passed through the parser.

    The supported units are based on the list in MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/length

    Why?

    I'm planning on adding support for CSS viewport units to React Native. Viewport units need to be parsed to pixels at runtime, so I need the raw value from the parser, e.g. 20vw.

    Currently css-to-react-native only supports parsing values with pixels and throws for any other unit. By removing that restriction we can allow valid CSS units and let React Native throw an error if the unit is not supported.

    By allowing the use of other CSS length units, anyone who uses this parser can easily build custom support for other units in react-native, e.g. rem unit.

    ping @jacobp100

    opened by kristerkari 8
  • Bump tmpl from 1.0.4 to 1.0.5

    Bump tmpl from 1.0.4 to 1.0.5

    Bumps tmpl from 1.0.4 to 1.0.5.

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • Bump tar from 4.4.13 to 4.4.19

    Bump tar from 4.4.13 to 4.4.19

    Bumps tar from 4.4.13 to 4.4.19.

    Commits
    • 9a6faa0 4.4.19
    • 70ef812 drop dirCache for symlink on all platforms
    • 3e35515 4.4.18
    • 52b09e3 fix: prevent path escape using drive-relative paths
    • bb93ba2 fix: reserve paths properly for unicode, windows
    • 2f1bca0 fix: prune dirCache properly for unicode, windows
    • 9bf70a8 4.4.17
    • 6aafff0 fix: skip extract if linkpath is stripped entirely
    • 5c5059a fix: reserve paths case-insensitively
    • fd6accb 4.4.16
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • Bump path-parse from 1.0.6 to 1.0.7

    Bump path-parse from 1.0.6 to 1.0.7

    Bumps path-parse from 1.0.6 to 1.0.7.

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • Bump browserslist from 4.7.0 to 4.16.6

    Bump browserslist from 4.7.0 to 4.16.6

    Bumps browserslist from 4.7.0 to 4.16.6.

    Changelog

    Sourced from browserslist's changelog.

    4.16.6

    • Fixed npm-shrinkwrap.json support in --update-db (by Geoff Newman).

    4.16.5

    • Fixed unsafe RegExp (by Yeting Li).

    4.16.4

    • Fixed unsafe RegExp.
    • Added artifactory support to --update-db (by Ittai Baratz).

    4.16.3

    • Fixed --update-db.

    4.16.2

    4.16.1

    • Fixed Chrome 4 with mobileToDesktop (by Aron Woost).

    4.16

    • Add browserslist config query.

    4.15

    • Add TypeScript types (by Dmitry Semigradsky).

    4.14.7

    • Fixed Yarn Workspaces support to --update-db (by Fausto Núñez Alberro).
    • Added browser changes to --update-db (by @​AleksandrSl).
    • Added color output to --update-db.
    • Updated package.funding to have link to our Open Collective.

    4.14.6

    • Fixed Yarn support in --update-db (by Ivan Storck).
    • Fixed npm 7 support in --update-db.

    4.14.5

    • Fixed last 2 electron versions query (by Sergey Melyukov).

    4.14.4

    • Fixed Unknown version 59 of op_mob error.

    4.14.3

    • Update Firefox ESR.

    4.14.2

    • Fixed --update-db on Windows (by James Ross).
    • Improved --update-db output.

    4.14.1

    • Added --update-db explanation (by Justin Zelinsky).

    ... (truncated)

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • Bump hosted-git-info from 2.8.4 to 2.8.9

    Bump hosted-git-info from 2.8.4 to 2.8.9

    Bumps hosted-git-info from 2.8.4 to 2.8.9.

    Changelog

    Sourced from hosted-git-info's changelog.

    2.8.9 (2021-04-07)

    Bug Fixes

    2.8.8 (2020-02-29)

    Bug Fixes

    • #61 & #65 addressing issues w/ url.URL implmentation which regressed node 6 support (5038b18), closes #66

    2.8.7 (2020-02-26)

    Bug Fixes

    • Do not attempt to use url.URL when unavailable (2d0bb66), closes #61 #62
    • Do not pass scp-style URLs to the WhatWG url.URL (f2cdfcf), closes #60

    2.8.6 (2020-02-25)

    2.8.5 (2019-10-07)

    Bug Fixes

    • updated pathmatch for gitlab (e8325b5), closes #51
    • updated pathmatch for gitlab (ffe056f)

    Commits
    • 8d4b369 chore(release): 2.8.9
    • 29adfe5 fix: backport regex fix from #76
    • afeaefd chore(release): 2.8.8
    • 5038b18 fix: #61 & #65 addressing issues w/ url.URL implmentation which regressed nod...
    • 7440afa chore(release): 2.8.7
    • 2d0bb66 fix: Do not attempt to use url.URL when unavailable
    • f2cdfcf fix: Do not pass scp-style URLs to the WhatWG url.URL
    • e1b83df chore(release): 2.8.6
    • ff259a6 Ensure passwords in hosted Git URLs are correctly escaped
    • 624fd6f chore(release): 2.8.5
    • Additional commits viewable in compare view
    Maintainer changes

    This version was pushed to npm by nlf, a new releaser for hosted-git-info since your current version.


    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • Bump lodash from 4.17.19 to 4.17.21

    Bump lodash from 4.17.19 to 4.17.21

    Bumps lodash from 4.17.19 to 4.17.21.

    Commits
    • f299b52 Bump to v4.17.21
    • c4847eb Improve performance of toNumber, trim and trimEnd on large input strings
    • 3469357 Prevent command injection through _.template's variable option
    • ded9bc6 Bump to v4.17.20.
    • 63150ef Documentation fixes.
    • 00f0f62 test.js: Remove trailing comma.
    • 846e434 Temporarily use a custom fork of lodash-cli.
    • 5d046f3 Re-enable Travis tests on 4.17 branch.
    • aa816b3 Remove /npm-package.
    • See full diff in compare view
    Maintainer changes

    This version was pushed to npm by bnjmnt4n, a new releaser for lodash since your current version.


    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
Releases(v3.0.0)
  • v3.0.0(Oct 22, 2019)

    • Will now console.warn when omitting units on properties that require them (top, width etc.)
    • Fixed issue with percentage flex basis in flex shorthand
    • Removed support for unitless line height in font shorthand
    Source code(tar.gz)
    Source code(zip)
Owner
styled-components
Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅
styled-components
React frontend and nodejs backend servers for media feed, text talk, and group text talk.

mediafeed talk group React frontend and nodejs backend servers for web application of media feed, text talk, and group text talk. The project is based

null 2 Sep 15, 2022
React Native: Native Bottom Sheet - Text View

ReactNative: Native Bottom Sheet Text View (Android/iOS): Deprecated Due to time constraint, this library is deprecated and not maintained anymore, Y

Pranav Raj Singh Chauhan 22 Jul 4, 2021
Open a web address or call, email, text or iMessage (iOS only) someone in React Native

react-native-communications Release Notes Open a web address, easily call, email, text, iMessage (iOS only) someone in React Native Installation React

null 1k Sep 21, 2022
This is a react native module that sends a basic sms text message to a phone number for android.

react-native-sms-android This is a react native module that sends a sms message to a phone number. There are two options for sending a sms: 1) directl

G. Haker 52 Feb 9, 2022
This simple React Native module for Android Text To Speech functionality.

React Native Android Text To Speech A react native android wrapper for Text To speech Purpose Currently , React Native doesn't have inbuilt support fo

Mihir Soni 47 Nov 10, 2020
Fully customizable, animated text input for React Native with beautiful and elegant design

Installation Add the dependency: npm i react-native-text-input-interactive Peer Dependencies Zero Dependency! Usage Import import InteractiveTextInput

FreakyCoder 28 Aug 31, 2022
Fully customizable preview of the URL extracted from the provided text.

React Native Link Preview Fully customizable preview of the URL extracted from the provided text. Getting Started yarn add @flyerhq/react-native-link-

Flyer Chat 88 Aug 25, 2022
Alarm clock functionality for react native ios and android using react-native-push-notification and react-native-community/async-storage

react-native-simple-alarm Alarm clock functionality for react native ios and android built using react-native-push-notification and react-native-commu

Jordan Daniels 65 Sep 7, 2022
A barcode scanner component for react native - not maintained anymore - use react-native-camera

react-native-barcodescanner - not maintained anymore - use react-native-camera Version 0.4.0 of react-native-camera includes barcode scanning for andr

Idea Creation / E-GUMA 537 Sep 17, 2022
React Native CallKit utilises a brand new iOS 10 framework CallKit to make the life easier for VoIP developers using React Native.

React Native CallKit utilises a brand new iOS 10 framework CallKit to make the life easier for VoIP developers using React Native.

React Native WebRTC 121 Jan 6, 2022
React-native-wordle - A simple re-implementation of wordle using react native

react native wordle A simple re-implementation of wordle. guess the randomly cho

Ananthu P Kanive 15 Sep 10, 2022
React-native-esbuild: The fastest bundler for React Native

Fast bundler and dev server for react-native using esbuild

Joel Arvidsson 449 Sep 26, 2022
React Native Firebase Authentication Starter, manage user authentication in React Native app with firebase

Sign up and sign in screens for mobile using React Native. This is an example of how to use Firebase Authentication in React Native application, how to let users create an account or log in to an existing account.

Maor 14 Sep 8, 2022
Native filesystem access for react-native

react-native-fs Native filesystem access for react-native IMPORTANT For RN < 0.57 and/or Gradle < 3 you MUST install react-native-fs at version @2.11.

Hagen Hübel 4.5k Sep 26, 2022
react-native native module for In App Purchase.

Announcement React Native IAP hook is out. You can see medium post on how to use it. The react-native-iap module hasn't been maintained well recently.

dooboolab 2.2k Sep 23, 2022
React Native authentication with the native Touch ID popup.

React Native Touch ID React Native Touch ID is a React Native library for authenticating users with biometric authentication methods like Face ID and

Naoufal Kadhom 1.4k Sep 27, 2022
Native sensors access for react-native

react-native-sensor-manager Wrapper for react-native. Accelerometer, Gyroscope, Magnetometer, Orientation, Step Counter, Thermometer, LightSensor, and

Kevin Primicerio 229 Aug 22, 2022
React Native Unofficial SDK for integrating MercadoPago PX Native UIs.

React Native Unofficial SDK for integrating MercadoPago PX Native UIs. Getting Started To integrate this SDK you can check out our docs. Add your App

BlackBox Vision 90 Sep 10, 2022
🔥 A well-tested feature-rich modular Firebase implementation for React Native. Supports both iOS & Android platforms for all Firebase services.

React Native Firebase React Native Firebase is a collection of official React Native modules connecting you to Firebase services; each module is a lig

Invertase 10.3k Sep 27, 2022