jareware / css-ns Goto Github PK

error [email protected]: The engine "node" is incompatible with this module. Expected version ">=9.3.0 <10". Got "10.7.0"
error Found incompatible module

  "engines": {
    "node": ">=9.3.0 <10",
    "npm": ">=5.5.1 <6"
  },

import R from 'react'
import { createCssNs } from 'css-ns'
const { React } = createCssNs({
   'Example',
    React: R,
    glue: '-',
    globalPrefix: '~'
  })

class Example extends React.Component {
  render () {
    return (
      <div className='this'>
		<div className='title'></div>
                <div className='~global-class-name'
      </div>)
  }
}

<div className='Example'>
        <div className='Example-title'></div>
        <div className='global-class-name'
</div>

Warning: Invalid prop `className` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.
    in Fragment (created by Example)
    in Connect(App)
    in Provider

const { React } = require('./path/to/css-ns')('Exemple');

class Example extends React.Component {
  render () {
   const items = [
       'item-1',
       'item-2',
       'item-3'
    ];

    return (
      <div className='outer'>
           {items.map(item => (

              // This is the Fragment that receive the className prop
              <React.Fragment key={item}> 
                  {item !== 'item-1' && <div className='separator'></div>}
                  <div className='item'>{item}</div>
              </React.Fragment>

            ))}
      </div>
    )
  }
}

return Object.create(opt.React, { // inherit everything from standard React
    createElement: { // ...except hijack createElement()
      value: function(_, props) {
        if (props && _.toString() !== 'Symbol(react.fragment)') props.className = ns(props.className);
        
        return opt.React.createElement.apply(opt.React, arguments);
      }
    }
  });