diff --git a/src/app/docs/pages/waysofuse/devapixreact/page.tsx b/src/app/docs/pages/waysofuse/devapixreact/page.tsx index 66d302d..085f983 100644 --- a/src/app/docs/pages/waysofuse/devapixreact/page.tsx +++ b/src/app/docs/pages/waysofuse/devapixreact/page.tsx @@ -1,35 +1,31 @@ import Code from '@/app/components/Code' import Docs from '@/app/docs/components/Docs' import ReqResExample from '@/app/docs/components/ReqResExample' +import Image from 'next/image' +import responseStyle from '@/app/docs/components/ReqResExample/index.module.css' export default function Page() { return (

- To use React element with React you just need to install npm package. + To use React elements you just need to install npm package.

- After installation, the next step is to import the module to your project file. -

- -

- Then call React element into file, like in the example below. + After installation, the next step is to import the modules you want to your or file, like in the example below.

Example

page.jsx

JavaScript logo

- + ) } @@ -39,17 +35,56 @@ export default function Page() { title={false} reqs={['javascript']} />
+ +

Element name

- The properties expected by are the same of API request. + All React element names follow this pattern: '} />, see the examples below.

+ javascript: + typescript: + java: + ruby: + `} /> - // Optional properties - release: string +

Release

+

+ To select a specific release you just have to specify the release number when importing. +

+ +

+ This is equivalent to the latest release of icon. +

+ +

+ While this example below. +

+ +

+ Is equivalent to icon of release. +

+ +

+ ⚠️ Notice that this library only works with released icons, that is, it will not work with icons that are still under branch of project. +

+

Other properties

+

+ The other properties are optional attributes and the same as API request, take a look at the list below. +

+

- Here we have two more examples using the rest of properties. + Here we have more examples using the rest of properties.

-

Twitter icon

+

Icons

page.jsx
+ + + + + + ) + } + `} /> + +
+ i + i + i + i +
+
+ +

Twitter@2.8 icon

+
page.jsx
+ -

Twitter logo

- + size={80}/> ) } `} /> + reqs={['twitter&r=2.8&v=p&c=c7bd2b&s=80']} />
-

ChakraUI icon

+ +

Twitter@latest icon

page.jsx
-

ChakraUI logo

- + color='#c7bd2b' + size={80}/> ) } `} /> + reqs={['twitter&v=p&c=c7bd2b&s=80']} /> +
+ + +
) } diff --git a/src/functions/literalStringTab.ts b/src/functions/literalStringTab.ts index 7981a00..573368b 100644 --- a/src/functions/literalStringTab.ts +++ b/src/functions/literalStringTab.ts @@ -5,7 +5,7 @@ export default function literalStringTab(str: string) { const nStr = arrStr.map(e => e.replace(/^(\s*).+?$/, '$1').length).filter(e => e > 0) let cStr = nStr.length > 0 ? Math.min(...nStr) : null - if (nStr.every(e => e === cStr) && cStr && nStr.length > 1) + if (nStr.every(e => e === cStr) && cStr && nStr.length > 1 && arrStr[0].match(/^<.+/)) cStr -= 2 if (cStr)