Skip to content

Commit fa81d2e

Browse files
author
Tomasz John
committed
- update: project environment
1 parent 7c43860 commit fa81d2e

File tree

10 files changed

+2119
-22
lines changed

10 files changed

+2119
-22
lines changed

‎__src-old/CIcon.css

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
.c-icon {
2+
display: inline-block;
3+
color: inherit;
4+
text-align: center;
5+
fill: currentColor;
6+
}
7+
8+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size) {
9+
width: 1rem;
10+
height: 1rem;
11+
font-size: 1rem;
12+
}
13+
14+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size).c-icon-2xl {
15+
width: 2rem;
16+
height: 2rem;
17+
font-size: 2rem;
18+
}
19+
20+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size).c-icon-3xl {
21+
width: 3rem;
22+
height: 3rem;
23+
font-size: 3rem;
24+
}
25+
26+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size).c-icon-4xl {
27+
width: 4rem;
28+
height: 4rem;
29+
font-size: 4rem;
30+
}
31+
32+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size).c-icon-5xl {
33+
width: 5rem;
34+
height: 5rem;
35+
font-size: 5rem;
36+
}
37+
38+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size).c-icon-6xl {
39+
width: 6rem;
40+
height: 6rem;
41+
font-size: 6rem;
42+
}
43+
44+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size).c-icon-7xl {
45+
width: 7rem;
46+
height: 7rem;
47+
font-size: 7rem;
48+
}
49+
50+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size).c-icon-8xl {
51+
width: 8rem;
52+
height: 8rem;
53+
font-size: 8rem;
54+
}
55+
56+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size).c-icon-9xl {
57+
width: 9rem;
58+
height: 9rem;
59+
font-size: 9rem;
60+
}
61+
62+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size).c-icon-xl {
63+
width: 1.5rem;
64+
height: 1.5rem;
65+
font-size: 1.5rem;
66+
}
67+
68+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size).c-icon-lg {
69+
width: 1.25rem;
70+
height: 1.25rem;
71+
font-size: 1.25rem;
72+
}
73+
74+
.c-icon:not(.c-icon-c-s):not(.c-icon-custom-size).c-icon-sm {
75+
width: 0.875rem;
76+
height: 0.875rem;
77+
font-size: 0.875rem;
78+
}

‎src/CIcon.js renamed to ‎__src-old/CIcon.js

File renamed without changes.

‎src/index.d.ts renamed to ‎__src-old/index.d.ts

File renamed without changes.

‎src/index.js renamed to ‎__src-old/index.js

File renamed without changes.

‎package.json

Lines changed: 22 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@coreui/icons-react",
3-
"version": "1.1.0",
3+
"version": "2.0.0-alpha.0",
44
"description": "CoreUI Icons React component",
55
"license": "MIT",
66
"homepage": "https://coreui.io",
@@ -23,38 +23,38 @@
2323
"bugs": {
2424
"url": "https://github.com/coreui/coreui-icons-react/issues"
2525
},
26-
"main": "lib/index.js",
27-
"module": "es/index.js",
28-
"types": "src/index.d.ts",
26+
"main": "dist/index.js",
27+
"module": "dist/index.es.js",
28+
"jsnext:main": "dist/index.es.js",
2929
"files": [
30-
"es/",
31-
"lib/",
32-
"src/",
33-
"umd/",
30+
"dist/",
3431
"README.md"
3532
],
3633
"scripts": {
37-
"build": "nwb build-react-component --copy-files --no-demo",
38-
"clean": "nwb clean-module && nwb clean-demo",
39-
"test": "nwb test-react",
40-
"test:coverage": "nwb test-react --coverage",
41-
"lint": "eslint src"
34+
"build": "rollup -c"
4235
},
4336
"dependencies": {
44-
"classnames": "^2.2.6",
45-
"prop-types": "^15.7.2"
4637
},
4738
"peerDependencies": {
48-
"react": "^17.0.1"
39+
"react": "^17.0.2"
4940
},
5041
"devDependencies": {
42+
"@rollup/plugin-commonjs": "^19.0.0",
43+
"@rollup/plugin-node-resolve": "^13.0.0",
44+
"@types/lodash": "^4.14.169",
45+
"@types/react": "^17.0.5",
5146
"babel-eslint": "^10.1.0",
52-
"eslint": "^7.21.0",
53-
"eslint-plugin-import": "^2.22.1",
54-
"eslint-plugin-react": "^7.22.0",
55-
"nwb": "^0.25.2",
56-
"react": "^17.0.1",
57-
"react-dom": "^17.0.1"
47+
"classnames": "^2.3.1",
48+
"eslint": "^7.26.0",
49+
"eslint-plugin-import": "^2.23.2",
50+
"eslint-plugin-react": "^7.23.2",
51+
"eslint-plugin-react-hooks": "^4.2.0",
52+
"lodash": "^4.17.21",
53+
"prop-types": "^15.7.2",
54+
"rollup": "^2.48.0",
55+
"rollup-plugin-peer-deps-external": "^2.2.4",
56+
"rollup-plugin-typescript2": "^0.30.0",
57+
"typescript": "^4.2.4"
5858
},
5959
"keywords": [
6060
"coreui",

‎rollup.config.js

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import typescript from 'rollup-plugin-typescript2'
2+
import commonjs from '@rollup/plugin-commonjs'
3+
import external from 'rollup-plugin-peer-deps-external'
4+
import resolve from '@rollup/plugin-node-resolve'
5+
import pkg from './package.json'
6+
export default {
7+
input: 'src/index.ts',
8+
output: [
9+
{
10+
file: pkg.main,
11+
format: 'cjs',
12+
exports: 'named',
13+
sourcemap: true,
14+
},
15+
{
16+
file: pkg.module,
17+
format: 'es',
18+
exports: 'named',
19+
sourcemap: true,
20+
},
21+
],
22+
plugins: [
23+
external(),
24+
resolve(),
25+
typescript({
26+
rollupCommonJSResolveHack: true,
27+
exclude: ['**/__tests__/**'],
28+
clean: true,
29+
}),
30+
commonjs({
31+
include: ['node_modules/**'],
32+
namedExports: {
33+
'node_modules/react/react.js': ['Children', 'Component', 'PropTypes', 'createElement'],
34+
'node_modules/react-dom/index.js': ['render'],
35+
},
36+
}),
37+
],
38+
}

‎src/CIcon.tsx

Lines changed: 140 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,140 @@
1+
import React, { useMemo, useState } from 'react'
2+
import PropTypes from 'prop-types'
3+
import classNames from 'classnames'
4+
import './CIcon.css'
5+
6+
let warned = {}
7+
const colog = (msg, icon) => {
8+
if (!warned[icon] && process && process.env && process.env.NODE_ENV === 'development') {
9+
warned[icon] = true
10+
console.error(msg)
11+
}
12+
}
13+
14+
const toCamelCase = (str) => {
15+
return str.replace(/([-_][a-z0-9])/ig, ($1) => {
16+
return $1.toUpperCase()
17+
}).replace(/-/ig, '')
18+
}
19+
20+
//component - CoreUI / CIcon
21+
const CIcon = props => {
22+
23+
const {
24+
className,
25+
name,
26+
content,
27+
customClasses,
28+
size,
29+
src,
30+
title,
31+
use,
32+
...attributes
33+
} = props
34+
35+
const [change, setChange] = useState(0)
36+
37+
useMemo(() => setChange(change + 1), [name, JSON.stringify[content]])
38+
39+
const iconName = useMemo(()=>{
40+
const iconNameIsKebabCase = name && name.includes('-')
41+
return iconNameIsKebabCase ? toCamelCase(name) : name
42+
}, [change])
43+
44+
const titleCode = title ? `<title>${title}</title>` : ''
45+
46+
const code = useMemo(() => {
47+
if (content) {
48+
return content
49+
} else if (name && React.icons) {
50+
return React.icons[iconName] ? React.icons[iconName] :
51+
colog(`CIcon component: icon name '${iconName}' does not exist in React.icons object. ` +
52+
`To use icons by 'name' prop you need to make them available globally ` +
53+
`by adding them to React.icons object. CIcon component docs: https://coreui.io/react/docs/components/CIcon \n`,
54+
iconName
55+
)
56+
}
57+
}, [change])
58+
59+
const iconCode = useMemo(()=>{
60+
return Array.isArray(code) ? code[1] || code[0] : code
61+
}, [change])
62+
63+
const scale = (()=>{
64+
return Array.isArray(code) && code.length > 1 ? code[0] : '64 64'
65+
})()
66+
67+
const viewBox = (()=>{
68+
return attributes.viewBox || `0 0 ${scale}`
69+
})()
70+
71+
const computedSize = (()=>{
72+
const addCustom = !size && (attributes.width || attributes.height)
73+
return size === 'custom' || addCustom ? 'custom-size' : size
74+
})()
75+
76+
//render
77+
const computedClasses = classNames(
78+
'c-icon',
79+
computedSize && `c-icon-${computedSize}`,
80+
className
81+
)
82+
83+
const classes = customClasses || computedClasses
84+
85+
return (
86+
<React.Fragment>
87+
{ !src && !use &&
88+
<svg
89+
{...attributes}
90+
xmlns="http://www.w3.org/2000/svg"
91+
viewBox={viewBox}
92+
className={classes}
93+
role="img"
94+
dangerouslySetInnerHTML={{__html: titleCode + iconCode}}
95+
/>
96+
}
97+
{ src && !use &&
98+
<img
99+
{...attributes}
100+
className={className}
101+
src={src}
102+
role="img"
103+
/>
104+
}
105+
{ !src && use &&
106+
<svg
107+
{...attributes}
108+
xmlns="http://www.w3.org/2000/svg"
109+
className={classes}
110+
role="img"
111+
>
112+
<use href={use}></use>
113+
</svg>
114+
}
115+
</React.Fragment>
116+
)
117+
}
118+
119+
CIcon.propTypes = {
120+
className: PropTypes.string,
121+
name: PropTypes.string,
122+
content: PropTypes.oneOfType([PropTypes.string, PropTypes.array]),
123+
size: PropTypes.oneOf([
124+
'custom', 'custom-size', 'sm', 'lg', 'xl',
125+
'2xl', '3xl', '4xl', '5xl', '6xl', '7xl', '8xl', '9xl'
126+
]),
127+
customClasses: PropTypes.oneOfType([PropTypes.string, PropTypes.array, PropTypes.object]),
128+
src: PropTypes.string,
129+
title: PropTypes.string,
130+
use: PropTypes.string
131+
}
132+
133+
export default CIcon
134+
135+
export const CIconWarn = props => {
136+
colog(
137+
'@coreui/icons-react: Please use default export since named exports are deprecated'
138+
)
139+
return <CIcon {...props}/>
140+
}

‎src/index.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import {default as CIcon, CIconWarn} from './CIcon'
2+
3+
export default CIcon
4+
5+
export {
6+
CIconWarn as CIcon,
7+
CIconWarn as CIconRaw
8+
}

‎tsconfig.json

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
{
2+
"compilerOptions": {
3+
"jsx": "react",
4+
"outDir": "dist",
5+
"module": "esnext",
6+
"target": "es5",
7+
"lib": ["es6", "dom", "es2016", "es2017"],
8+
"sourceMap": true,
9+
"allowJs": false,
10+
"declaration": true,
11+
"moduleResolution": "node",
12+
"forceConsistentCasingInFileNames": true,
13+
"noImplicitReturns": true,
14+
"noImplicitThis": true,
15+
"noImplicitAny": true,
16+
"strictNullChecks": true,
17+
"suppressImplicitAnyIndexErrors": true,
18+
"noUnusedLocals": true,
19+
"noUnusedParameters": true,
20+
"esModuleInterop": true
21+
},
22+
"include": ["src"],
23+
"exclude": ["node_modules", "dist"]
24+
}

0 commit comments

Comments
 (0)