fix(graph): add grayscale to technology icon (#23107)
<!-- Please make sure you have read the submission guidelines before posting an PR --> <!-- https://github.com/nrwl/nx/blob/master/CONTRIBUTING.md#-submitting-a-pr --> <!-- Please make sure that your commit message follows our format --> <!-- Example: `fix(nx): must begin with lowercase` --> ## Current Behavior <!-- This is the behavior we have today --> ## Expected Behavior <!-- This is the behavior we should expect with the changes in this PR --> ## Related Issue(s) <!-- Please link the issue being fixed so it gets closed when this is merged. --> Fixes #
This commit is contained in:
parent
7bd40bc9db
commit
f73d6530a1
14
graph/ui-icons/src/lib/technologies/angular.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/angular.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const AngularIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Angular</title>
|
||||
<path d="M16.712 17.711H7.288l-1.204 2.916L12 24l5.916-3.373-1.204-2.916ZM14.692 0l7.832 16.855.814-12.856L14.692 0ZM9.308 0 .662 3.999l.814 12.856L9.308 0Zm-.405 13.93h6.198L12 6.396 8.903 13.93Z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/cypress.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/cypress.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const CypressIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Cypress</title>
|
||||
<path d="M11.998.0195c-.8642 0-1.6816.1101-2.1445.1934v.002C4.1731 1.2283 0 6.1368 0 12.0018c0 1.1265.1573 2.2328.4648 3.3028.0387.1453.0915.2993.1368.4473 1.607 4.865 6.2245 8.226 11.3925 8.2285.0651 0 .2518-.0003.502-.0118.8564-.0353 1.6228-.5734 1.9512-1.369l.4736-1.1544L20.4258 8.043H18.621l-2.3164 5.871-2.334-5.871h-1.9082l3.2734 8.0117c-.8115 1.9702-1.6252 3.9395-2.4355 5.9101-.0808.1945-.2655.3284-.4727.336-.144.005-.285.0098-.4316.0098-4.5848 0-8.6672-3.0695-9.9277-7.4649a10.3058 10.3058 0 0 1-.3985-2.8437c0-5.0887 3.6521-9.3404 8.6035-10.164.2214-.037.8885-.1446 1.7246-.1446 4.4166 0 8.269 2.732 9.7305 6.8476.0558.144.0977.293.1465.4395.299.9746.4531 1.9887.4531 3.0215 0 4.5696-2.9413 8.5326-7.3164 9.8613l.4863 1.5996c5.085-1.546 8.4995-6.1518 8.502-11.459 0-1.5491-.2983-2.8706-.6504-3.8926-.0432-.1212-.0873-.2422-.1309-.3633h-.002C21.4577 3.0954 17.0444.0195 11.998.0195ZM8.4336 7.8906c-1.1999 0-2.1747.3852-2.9805 1.1758-.8007.7856-1.205 1.7736-1.205 2.9356 0 1.1544.4068 2.1368 1.205 2.9199.8058.7906 1.7806 1.1738 2.9805 1.1738 1.705 0 3.1556-.955 3.7871-2.4883l.0332-.082-1.6289-.5547c-.168.4563-.7552 1.4883-2.1914 1.4883-.6745 0-1.2437-.2344-1.6934-.6992-.4572-.4699-.6875-1.0632-.6875-1.7578 0-.6998.2253-1.2809.6875-1.7735.4522-.4648 1.019-.7012 1.6934-.7012 1.438 0 2.0238 1.0815 2.1934 1.4883l1.627-.5527-.0333-.084c-.629-1.5358-2.082-2.4883-3.7871-2.4883Z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/esbuild.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/esbuild.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const EsbuildIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>esbuild</title>
|
||||
<path d="M12 0A12 12 0 000 12a12 12 0 0012 12 12 12 0 0012-12A12 12 0 0012 0zM6.718 5.282L13.436 12l-6.718 6.718-2.036-2.036L9.364 12 4.682 7.318zm7.2 0L20.636 12l-6.718 6.718-2.036-2.036L16.564 12l-4.682-4.682z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/eslint.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/eslint.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const EslintIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>ESLint</title>
|
||||
<path d="M7.257 9.132L11.816 6.5a.369.369 0 0 1 .368 0l4.559 2.632a.369.369 0 0 1 .184.32v5.263a.37.37 0 0 1-.184.319l-4.559 2.632a.369.369 0 0 1-.368 0l-4.559-2.632a.369.369 0 0 1-.184-.32V9.452a.37.37 0 0 1 .184-.32M23.852 11.53l-5.446-9.475c-.198-.343-.564-.596-.96-.596H6.555c-.396 0-.762.253-.96.596L.149 11.509a1.127 1.127 0 0 0 0 1.117l5.447 9.398c.197.342.563.517.959.517h10.893c.395 0 .76-.17.959-.512l5.446-9.413a1.069 1.069 0 0 0 0-1.086m-4.51 4.556a.4.4 0 0 1-.204.338L12.2 20.426a.395.395 0 0 1-.392 0l-6.943-4.002a.4.4 0 0 1-.205-.338V8.08c0-.14.083-.269.204-.338L11.8 3.74c.12-.07.272-.07.392 0l6.943 4.003a.4.4 0 0 1 .206.338z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/expo.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/expo.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const ExpoIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Expo</title>
|
||||
<path d="M0 20.084c.043.53.23 1.063.718 1.778.58.849 1.576 1.315 2.303.567.49-.505 5.794-9.776 8.35-13.29a.761.761 0 011.248 0c2.556 3.514 7.86 12.785 8.35 13.29.727.748 1.723.282 2.303-.567.57-.835.728-1.42.728-2.046 0-.426-8.26-15.798-9.092-17.078-.8-1.23-1.044-1.498-2.397-1.542h-1.032c-1.353.044-1.597.311-2.398 1.542C8.267 3.991.33 18.758 0 19.77Z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/express.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/express.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const ExpressIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Express</title>
|
||||
<path d="M24 18.588a1.529 1.529 0 01-1.895-.72l-3.45-4.771-.5-.667-4.003 5.444a1.466 1.466 0 01-1.802.708l5.158-6.92-4.798-6.251a1.595 1.595 0 011.9.666l3.576 4.83 3.596-4.81a1.435 1.435 0 011.788-.668L21.708 7.9l-2.522 3.283a.666.666 0 000 .994l4.804 6.412zM.002 11.576l.42-2.075c1.154-4.103 5.858-5.81 9.094-3.27 1.895 1.489 2.368 3.597 2.275 5.973H1.116C.943 16.447 4.005 19.009 7.92 17.7a4.078 4.078 0 002.582-2.876c.207-.666.548-.78 1.174-.588a5.417 5.417 0 01-2.589 3.957 6.272 6.272 0 01-7.306-.933 6.575 6.575 0 01-1.64-3.858c0-.235-.08-.455-.134-.666A88.33 88.33 0 010 11.577zm1.127-.286h9.654c-.06-3.076-2.001-5.258-4.59-5.278-2.882-.04-4.944 2.094-5.071 5.264z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/gradle.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/gradle.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const GradleIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 512 512"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Gradle</title>
|
||||
<path d="M427 132.7a61 61 0 00-85-1a6 6 0 000 9l7 8a6 6 0 008 1a35 35 0 0146 53c-48 48-113 -87 -259 -17a20 20 0 00-9 28l25 43a20 20 0 0027 7l1 0l0 0l11-6a257 257 0 0035-26a6 6 0 018 0v0a6 6 0 010 9a263 263 0 01-37 28h0l-11 6a31 31 0 01-15 4a32 32 0 01-28-16L126 219C81 259 53 314 68.13 392.26a6 6 0 006 4.74H100.6a6 6 0 005.93-5.3a40 40 0 0178.62 0a6 6 0 005.72 5.08h26.2a6 6 0 005.7-5.1a40 40 0 0178.6 0a6 6 0 005.7 5h26a6 6 0 005.8-5.72c1-37 10 -79 38.7 -100c98-73 72 -136 49.4 -158.3zm-100 110l-19-9v0a12 12 0 1119 9z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/html5.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/html5.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const HTML5Icon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>HTML5</title>
|
||||
<path d="M1.5 0h21l-1.91 21.563L11.977 24l-8.564-2.438L1.5 0zm7.031 9.75l-.232-2.718 10.059.003.23-2.622L5.412 4.41l.698 8.01h9.126l-.326 3.426-2.91.804-2.955-.81-.188-2.11H6.248l.33 4.171L12 19.351l5.379-1.443.744-8.157H8.531z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/javascript.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/javascript.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const JavaScriptIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>JavaScript</title>
|
||||
<path d="M0 0h24v24H0V0zm22.034 18.276c-.175-1.095-.888-2.015-3.003-2.873-.736-.345-1.554-.585-1.797-1.14-.091-.33-.105-.51-.046-.705.15-.646.915-.84 1.515-.66.39.12.75.42.976.9 1.034-.676 1.034-.676 1.755-1.125-.27-.42-.404-.601-.586-.78-.63-.705-1.469-1.065-2.834-1.034l-.705.089c-.676.165-1.32.525-1.71 1.005-1.14 1.291-.811 3.541.569 4.471 1.365 1.02 3.361 1.244 3.616 2.205.24 1.17-.87 1.545-1.966 1.41-.811-.18-1.26-.586-1.755-1.336l-1.83 1.051c.21.48.45.689.81 1.109 1.74 1.756 6.09 1.666 6.871-1.004.029-.09.24-.705.074-1.65l.046.067zm-8.983-7.245h-2.248c0 1.938-.009 3.864-.009 5.805 0 1.232.063 2.363-.138 2.711-.33.689-1.18.601-1.566.48-.396-.196-.597-.466-.83-.855-.063-.105-.11-.196-.127-.196l-1.825 1.125c.305.63.75 1.172 1.324 1.517.855.51 2.004.675 3.207.405.783-.226 1.458-.691 1.811-1.411.51-.93.402-2.07.397-3.346.012-2.054 0-4.109 0-6.179l.004-.056z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/jest.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/jest.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const JestIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Jest</title>
|
||||
<path d="M22.251 11.82a3.117 3.117 0 0 0-2.328-3.01L22.911 0H8.104L11.1 8.838a3.116 3.116 0 0 0-2.244 2.988c0 1.043.52 1.967 1.313 2.536a8.279 8.279 0 0 1-1.084 1.244 8.14 8.14 0 0 1-2.55 1.647c-.834-.563-1.195-1.556-.869-2.446a3.11 3.11 0 0 0-.91-6.08 3.117 3.117 0 0 0-3.113 3.113c0 .848.347 1.626.903 2.182-.048.097-.097.195-.146.299-.465.959-.993 2.043-1.195 3.259-.403 2.432.257 4.384 1.849 5.489A5.093 5.093 0 0 0 5.999 24c1.827 0 3.682-.917 5.475-1.807 1.279-.632 2.599-1.292 3.898-1.612.48-.118.98-.187 1.508-.264 1.07-.153 2.175-.312 3.168-.89a4.482 4.482 0 0 0 2.182-3.091c.174-.994 0-1.994-.444-2.87.298-.48.465-1.042.465-1.647zm-1.355 0c0 .965-.785 1.75-1.75 1.75a1.753 1.753 0 0 1-1.085-3.126l.007-.007c.056-.042.118-.084.18-.125 0 0 .008 0 .008-.007.028-.014.055-.035.083-.05.007 0 .014-.006.021-.006.028-.014.063-.028.097-.042.035-.014.07-.027.098-.041.007 0 .013-.007.02-.007.028-.007.056-.021.084-.028.007 0 .02-.007.028-.007.034-.007.062-.014.097-.02h.007l.104-.022c.007 0 .02 0 .028-.007.028 0 .055-.007.083-.007h.035c.035 0 .07-.007.111-.007h.09c.028 0 .05 0 .077.007h.014c.055.007.111.014.167.028a1.766 1.766 0 0 1 1.396 1.723zM10.043 1.39h10.93l-2.509 7.4c-.104.02-.208.055-.312.09l-2.64-5.385-2.648 5.35c-.104-.034-.216-.055-.327-.076l-2.494-7.38zm4.968 9.825a3.083 3.083 0 0 0-.938-1.668l1.438-2.904 1.452 2.967c-.43.43-.743.98-.868 1.605H15.01zm-3.481-1.098c.034-.007.062-.014.097-.02h.02c.029-.008.056-.008.084-.015h.028c.028 0 .049-.007.076-.007h.271c.028 0 .049.007.07.007.014 0 .02 0 .035.007.027.007.048.007.076.014.007 0 .014 0 .028.007l.097.02h.007c.028.008.056.015.083.029.007 0 .014.007.028.007.021.007.049.014.07.027.007 0 .014.007.02.007.028.014.056.021.084.035h.007a.374.374 0 0 1 .09.049h.007c.028.014.056.034.084.048.007 0 .007.007.013.007.028.014.05.035.077.049l.007.007c.083.062.16.132.236.201l.007.007a1.747 1.747 0 0 1 .48 1.209 1.752 1.752 0 0 1-3.502 0 1.742 1.742 0 0 1 1.32-1.695zm-6.838-.049c.966 0 1.751.786 1.751 1.751s-.785 1.751-1.75 1.751-1.752-.785-1.752-1.75.786-1.752 1.751-1.752zm16.163 6.025a3.07 3.07 0 0 1-1.508 2.133c-.758.438-1.689.577-2.669.716a17.29 17.29 0 0 0-1.64.291c-1.445.355-2.834 1.05-4.182 1.717-1.724.854-3.35 1.66-4.857 1.66a3.645 3.645 0 0 1-2.154-.688c-1.529-1.056-1.453-3.036-1.272-4.12.167-1.015.632-1.966 1.077-2.877.028-.055.049-.104.077-.16.152.056.312.098.479.126-.264 1.473.486 2.994 1.946 3.745l.264.139.284-.104c1.216-.431 2.342-1.133 3.336-2.071a9.334 9.334 0 0 0 1.445-1.716c.16.027.32.034.48.034a3.117 3.117 0 0 0 3.008-2.327h1.167a3.109 3.109 0 0 0 3.01 2.327c.576 0 1.11-.16 1.57-.43.18.52.236 1.063.139 1.605z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/nestjs.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/nestjs.tsx
Normal file
File diff suppressed because one or more lines are too long
14
graph/ui-icons/src/lib/technologies/nextjs.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/nextjs.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const NextJSIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Next.js</title>
|
||||
<path d="M11.5725 0c-.1763 0-.3098.0013-.3584.0067-.0516.0053-.2159.021-.3636.0328-3.4088.3073-6.6017 2.1463-8.624 4.9728C1.1004 6.584.3802 8.3666.1082 10.255c-.0962.659-.108.8537-.108 1.7474s.012 1.0884.108 1.7476c.652 4.506 3.8591 8.2919 8.2087 9.6945.7789.2511 1.6.4223 2.5337.5255.3636.04 1.9354.04 2.299 0 1.6117-.1783 2.9772-.577 4.3237-1.2643.2065-.1056.2464-.1337.2183-.1573-.0188-.0139-.8987-1.1938-1.9543-2.62l-1.919-2.592-2.4047-3.5583c-1.3231-1.9564-2.4117-3.556-2.4211-3.556-.0094-.0026-.0187 1.5787-.0235 3.509-.0067 3.3802-.0093 3.5162-.0516 3.596-.061.115-.108.1618-.2064.2134-.075.0374-.1408.0445-.495.0445h-.406l-.1078-.068a.4383.4383 0 01-.1572-.1712l-.0493-.1056.0053-4.703.0067-4.7054.0726-.0915c.0376-.0493.1174-.1125.1736-.143.0962-.047.1338-.0517.5396-.0517.4787 0 .5584.0187.6827.1547.0353.0377 1.3373 1.9987 2.895 4.3608a10760.433 10760.433 0 004.7344 7.1706l1.9002 2.8782.096-.0633c.8518-.5536 1.7525-1.3418 2.4657-2.1627 1.5179-1.7429 2.4963-3.868 2.8247-6.134.0961-.6591.1078-.854.1078-1.7475 0-.8937-.012-1.0884-.1078-1.7476-.6522-4.506-3.8592-8.2919-8.2087-9.6945-.7672-.2487-1.5836-.42-2.4985-.5232-.169-.0176-1.0835-.0366-1.6123-.037zm4.0685 7.217c.3473 0 .4082.0053.4857.047.1127.0562.204.1642.237.2767.0186.061.0234 1.3653.0186 4.3044l-.0067 4.2175-.7436-1.14-.7461-1.14v-3.066c0-1.982.0093-3.0963.0234-3.1502.0375-.1313.1196-.2346.2323-.2955.0961-.0494.1313-.054.4997-.054z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/nodejs.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/nodejs.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const NodeIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Node.js</title>
|
||||
<path d="M11.998,24c-0.321,0-0.641-0.084-0.922-0.247l-2.936-1.737c-0.438-0.245-0.224-0.332-0.08-0.383 c0.585-0.203,0.703-0.25,1.328-0.604c0.065-0.037,0.151-0.023,0.218,0.017l2.256,1.339c0.082,0.045,0.197,0.045,0.272,0l8.795-5.076 c0.082-0.047,0.134-0.141,0.134-0.238V6.921c0-0.099-0.053-0.192-0.137-0.242l-8.791-5.072c-0.081-0.047-0.189-0.047-0.271,0 L3.075,6.68C2.99,6.729,2.936,6.825,2.936,6.921v10.15c0,0.097,0.054,0.189,0.139,0.235l2.409,1.392 c1.307,0.654,2.108-0.116,2.108-0.89V7.787c0-0.142,0.114-0.253,0.256-0.253h1.115c0.139,0,0.255,0.112,0.255,0.253v10.021 c0,1.745-0.95,2.745-2.604,2.745c-0.508,0-0.909,0-2.026-0.551L2.28,18.675c-0.57-0.329-0.922-0.945-0.922-1.604V6.921 c0-0.659,0.353-1.275,0.922-1.603l8.795-5.082c0.557-0.315,1.296-0.315,1.848,0l8.794,5.082c0.57,0.329,0.924,0.944,0.924,1.603 v10.15c0,0.659-0.354,1.273-0.924,1.604l-8.794,5.078C12.643,23.916,12.324,24,11.998,24z M19.099,13.993 c0-1.9-1.284-2.406-3.987-2.763c-2.731-0.361-3.009-0.548-3.009-1.187c0-0.528,0.235-1.233,2.258-1.233 c1.807,0,2.473,0.389,2.747,1.607c0.024,0.115,0.129,0.199,0.247,0.199h1.141c0.071,0,0.138-0.031,0.186-0.081 c0.048-0.054,0.074-0.123,0.067-0.196c-0.177-2.098-1.571-3.076-4.388-3.076c-2.508,0-4.004,1.058-4.004,2.833 c0,1.925,1.488,2.457,3.895,2.695c2.88,0.282,3.103,0.703,3.103,1.269c0,0.983-0.789,1.402-2.642,1.402 c-2.327,0-2.839-0.584-3.011-1.742c-0.02-0.124-0.126-0.215-0.253-0.215h-1.137c-0.141,0-0.254,0.112-0.254,0.253 c0,1.482,0.806,3.248,4.655,3.248C17.501,17.007,19.099,15.91,19.099,13.993z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/nuxtjs.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/nuxtjs.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const NuxtIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Nuxt</title>
|
||||
<path d="M13.4642 19.8295h8.9218c.2834 0 .5618-.0723.8072-.2098a1.5899 1.5899 0 0 0 .5908-.5732 1.5293 1.5293 0 0 0 .216-.783 1.529 1.529 0 0 0-.2167-.7828L17.7916 7.4142a1.5904 1.5904 0 0 0-.5907-.573 1.6524 1.6524 0 0 0-.807-.2099c-.2833 0-.5616.0724-.807.2098a1.5904 1.5904 0 0 0-.5907.5731L13.4642 9.99l-2.9954-5.0366a1.5913 1.5913 0 0 0-.591-.573 1.6533 1.6533 0 0 0-.8071-.2098c-.2834 0-.5617.0723-.8072.2097a1.5913 1.5913 0 0 0-.591.573L.2168 17.4808A1.5292 1.5292 0 0 0 0 18.2635c-.0001.2749.0744.545.216.783a1.59 1.59 0 0 0 .5908.5732c.2454.1375.5238.2098.8072.2098h5.6003c2.219 0 3.8554-.9454 4.9813-2.7899l2.7337-4.5922L16.3935 9.99l4.3944 7.382h-5.8586ZM7.123 17.3694l-3.9083-.0009 5.8586-9.8421 2.9232 4.921-1.9572 3.2892c-.7478 1.1967-1.5972 1.6328-2.9163 1.6328z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/playwright.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/playwright.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const PlaywrightIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Playwright</title>
|
||||
<path d="M23.996 7.462c-.056.837-.257 2.135-.716 3.85-.995 3.715-4.27 10.874-10.42 9.227-6.15-1.65-5.407-9.487-4.412-13.201.46-1.716.934-2.94 1.305-3.694.42-.853.846-.289 1.815.523.684.573 2.41 1.791 5.011 2.488 2.601.697 4.706.506 5.583.352 1.245-.219 1.897-.494 1.834.455Zm-9.807 3.863s-.127-1.819-1.773-2.286c-1.644-.467-2.613 1.04-2.613 1.04Zm4.058 4.539-7.769-2.172s.446 2.306 3.338 3.153c2.862.836 4.43-.98 4.43-.981Zm2.701-2.51s-.13-1.818-1.773-2.286c-1.644-.469-2.612 1.038-2.612 1.038ZM8.57 18.23c-4.749 1.279-7.261-4.224-8.021-7.08C.197 9.831.044 8.832.003 8.188c-.047-.73.455-.52 1.415-.354.677.118 2.3.261 4.308-.28a11.28 11.28 0 0 0 2.41-.956c-.058.197-.114.4-.17.61-.433 1.618-.827 4.055-.632 6.426-1.976.732-2.267 2.423-2.267 2.423l2.524-.715c.227 1.002.6 1.987 1.15 2.838a5.914 5.914 0 0 1-.171.049Zm-4.188-6.298c1.265-.333 1.363-1.631 1.363-1.631l-3.374.888s.745 1.076 2.01.743Z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/prettier.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/prettier.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const PrettierIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Prettier</title>
|
||||
<path d="M8.571 23.429A.571.571 0 0 1 8 24H2.286a.571.571 0 0 1 0-1.143H8c.316 0 .571.256.571.572zM8 20.57H6.857a.571.571 0 0 0 0 1.143H8a.571.571 0 0 0 0-1.143zm-5.714 1.143H4.57a.571.571 0 0 0 0-1.143H2.286a.571.571 0 0 0 0 1.143zM8 18.286H2.286a.571.571 0 0 0 0 1.143H8a.571.571 0 0 0 0-1.143zM16 16H5.714a.571.571 0 0 0 0 1.143H16A.571.571 0 0 0 16 16zM2.286 17.143h1.143a.571.571 0 0 0 0-1.143H2.286a.571.571 0 0 0 0 1.143zm17.143-3.429H16a.571.571 0 0 0 0 1.143h3.429a.571.571 0 0 0 0-1.143zM9.143 14.857h4.571a.571.571 0 0 0 0-1.143H9.143a.571.571 0 0 0 0 1.143zm-6.857 0h4.571a.571.571 0 0 0 0-1.143H2.286a.571.571 0 0 0 0 1.143zM20.57 11.43H11.43a.571.571 0 0 0 0 1.142h9.142a.571.571 0 0 0 0-1.142zM9.714 12a.571.571 0 0 0-.571-.571H5.714a.571.571 0 0 0 0 1.142h3.429A.571.571 0 0 0 9.714 12zm-7.428.571h1.143a.571.571 0 0 0 0-1.142H2.286a.571.571 0 0 0 0 1.142zm19.428-3.428H16a.571.571 0 0 0 0 1.143h5.714a.571.571 0 0 0 0-1.143zM2.286 10.286H8a.571.571 0 0 0 0-1.143H2.286a.571.571 0 0 0 0 1.143zm13.143-2.857c0 .315.255.571.571.571h5.714a.571.571 0 0 0 0-1.143H16a.571.571 0 0 0-.571.572zm-8.572-.572a.571.571 0 0 0 0 1.143H8a.571.571 0 0 0 0-1.143H6.857zM2.286 8H4.57a.571.571 0 0 0 0-1.143H2.286a.571.571 0 0 0 0 1.143zm16.571-2.857c0 .315.256.571.572.571h1.142a.571.571 0 0 0 0-1.143H19.43a.571.571 0 0 0-.572.572zm-1.143 0a.571.571 0 0 0-.571-.572H12.57a.571.571 0 0 0 0 1.143h4.572a.571.571 0 0 0 .571-.571zm-15.428.571h8a.571.571 0 0 0 0-1.143h-8a.571.571 0 0 0 0 1.143zm5.143-2.857c0 .316.255.572.571.572h11.429a.571.571 0 0 0 0-1.143H8a.571.571 0 0 0-.571.571zm-5.143.572h3.428a.571.571 0 0 0 0-1.143H2.286a.571.571 0 0 0 0 1.143zm0-2.286H16A.571.571 0 0 0 16 0H2.286a.571.571 0 0 0 0 1.143z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/react.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/react.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const ReactIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>React</title>
|
||||
<path d="M14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/remix.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/remix.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const RemixIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Remix</title>
|
||||
<path d="M21.511 18.508c.216 2.773.216 4.073.216 5.492H15.31c0-.309.006-.592.011-.878.018-.892.036-1.821-.109-3.698-.19-2.747-1.374-3.358-3.55-3.358H1.574v-5h10.396c2.748 0 4.122-.835 4.122-3.049 0-1.946-1.374-3.125-4.122-3.125H1.573V0h11.541c6.221 0 9.313 2.938 9.313 7.632 0 3.511-2.176 5.8-5.114 6.182 2.48.497 3.93 1.909 4.198 4.694ZM1.573 24v-3.727h6.784c1.133 0 1.379.84 1.379 1.342V24Z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/rollup.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/rollup.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const RollupIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Rollup</title>
|
||||
<path d="M3.42.0002a.37.37 0 00-.369.37V19.885c.577-1.488 1.557-3.6168 3.1378-6.5297C11.8885 2.876 12.6355 1.8191 15.6043 1.8191c1.56 0 3.1338.704 4.1518 1.9549A7.9616 7.9616 0 0013.1014.0002zM16.1393 2.544c-1.19.01-2.257.466-2.6979 1.498-.967 2.2558 1.624 4.7667 2.7569 4.5677 1.4419-.255-.255-3.5628-.255-3.5628 2.2049 4.1558 1.6969 2.8838-2.2899 6.6996C9.6666 15.5623 5.596 23.6188 5.002 23.9568a.477.477 0 01-.08.043H20.558a.373.373 0 00.33-.538l-4.0878-8.0915a.37.37 0 01.144-.488 7.9596 7.9596 0 004.0048-6.9126c0-1.4249-.373-2.7608-1.03-3.9198-.9269-.9519-2.4298-1.5159-3.7787-1.5059z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/rspack.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/rspack.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const RspackIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Rspack</title>
|
||||
<path d="M15.14 14.64c-.061 0-.013.073.128.23.184.184.394.262.473.183.08-.079-.052-.237-.316-.316-.15-.064-.242-.097-.285-.097zm.69-1.471c-.135-.003-.48.216-.826.515-.395.343-.632.632-.5.632.369 0 1.527-.974 1.37-1.132-.01-.01-.026-.015-.045-.015zm3.309-10.182c-.37-.015-.965.116-1.765.402-1.343.5-3.528 2.133-3.739 2.765-.263.79.026 1 1.58 1.184 1.185.158 1.448.29 1.448.685 0 .606-.21.606-.895.105-.869-.658-2.212-.5-3.028.37l-.711.763-.737-1.159c-.896-1.422-2.554-2.449-4.345-2.66-2.528-.289-5.319 1.686-6.24 4.45-.421 1.29-.21 2.318.5 2.318.184 0 .474.368.685.816.605 1.37 2.001 2.554 3.607 3.028 1.37.395 1.422.447 1.053.869-.527.579-.526 1.08-.026 1.08.237 0 .368.21.316.579-.053.474.079.605.553.553.58-.08.79.29.316.579-.316.184-.343 1.106-.053 1.29.105.053 1.264-.105 2.554-.395 1.632-.368 2.897-.5 4.081-.395l1.712.132-1.448-.264c-.79-.131-1.633-.394-1.87-.579-2.16-1.632-3.396-2.765-3.396-3.107 0-.237.368-.58.816-.763.447-.185 1.053-.738 1.369-1.185.527-.79.632-.843 1.106-.5.263.21.684.368.895.342.369 0 .369-.027.027-.158-.527-.21-1.317-.895-1.317-1.185 0-.105.29-.158.658-.053 1.58.395 3.028-1.132 3.028-3.16 0-.526.132-.947.29-.947.316 0 .21 2.87-.132 3.712-.105.211.08.79.422 1.317.842 1.211 2.027 1.369 2.975.342.369-.395.737-.632.842-.526.106.105.21.921.21 1.843 0 1.395-.104 1.79-.71 2.58-.395.5-1.211 1.185-1.843 1.5-.974.475-1.027.554-.448.554.369 0 1.29.184 2.054.421 1.106.316 1.475.343 1.712.08.21-.238.21-.264-.027-.133-.421.237-2.264-.553-2.054-.895.237-.395.948-.316 1.475.158.5.448 1.132.263.921-.29-.052-.184.027-.473.185-.631.21-.21.131-.448-.29-.895-.71-.764-.737-1.422-.052-1.633.921-.29 2.106-2.001 2.106-3.028 0-1.396-.843-2.554-2.08-2.923-.632-.184-1.132-.527-1.238-.816-.079-.264-.42-.658-.763-.895l-.606-.395.764-.764c1.237-1.21.816-2.37-.843-2.37-.579 0-.553-.052.237-.868.757-.79.773-1.22.159-1.245zm-.197.277c.232-.004.354.072.354.23 0 .132-.448.606-.974 1.054l-1 .816H18.4c1.264 0 1.948.579 1.5 1.264-.315.526-2.395 2.159-2.738 2.159-.447 0-.263-1.264.237-1.396.237-.079.08-.132-.368-.158-1.738-.053-3.265-.368-3.265-.658 0-.553 1.685-1.948 3.16-2.633.937-.444 1.628-.673 2.015-.678zM6.58 5.684c.475.01.965.088 1.472.233 2.027.553 3.844 2.922 3.87 4.976 0 2.37-1.105 4.16-3.054 4.898-1 .368-1.369.394-2.554.131-1.764-.395-2.949-1.106-3.607-2.185-.737-1.211-.658-1.685.316-2.027.448-.158.842-.264.869-.238 0 .053.131.422.29.87.289.92 1.21 1.132 3.212.684 1.053-.237 1.29-.21 1.58.184.342.422.368.395.263-.079-.106-.579-.369-.605-2.897-.263-1.632.21-1.606.237-2.159-1.527-.131-.421-.21-.448-1.132-.026-1.658.71-2.106.737-2.317.157-.237-.816.79-2.975 1.949-4.107C3.866 6.22 5.155 5.652 6.58 5.684Zm7.001 3.407c.051.001.104.005.158.012.58.079.685.237.764 1.027.053.658-.079 1.053-.474 1.421-.737.659-1.422.264-1.527-.895-.099-1.012.312-1.584 1.08-1.565zm4.349.65c.346.01.602.274.733.784.185.71-.474 1.948-1.027 1.948-1.026 0-1.343-1.817-.421-2.475.267-.178.507-.263.715-.257zm2.208.362c.158 0 .21.474.079 1.238-.184 1.369-.816 2.633-1.475 3.054-.579.369-1.738.026-2.08-.58-.237-.473-.184-.5.606-.368 1.237.184 2.264-.737 2.475-2.238.079-.605.263-1.106.395-1.106zm1.049.518c.23 0 .524.137.9.404 1.21.843 1.553 3.16.447 3.16-.29 0-.659.079-.764.184-.105.132 0 .21.237.21.632 0 .553.448-.105.817-.632.316-1.027-.027-1.027-.896 0-.263-.132-.737-.29-1.027-.158-.316-.21-1-.105-1.685.115-.79.323-1.168.707-1.167zM8.079 16.686c.448.026.369.105-.368.526-1.185.659-1.606.659-.816 0 .342-.29.868-.526 1.184-.526zm.58.79c.5 0 .895.052.895.131 0 .264-1.711 1.185-2.185 1.185-.422 0-.422-.052-.027-.658.316-.5.659-.658 1.317-.658zm12.062.362c.07.007.168.059.287.164.237.185.342.395.29.448-.185.184-.685-.184-.685-.5 0-.08.039-.119.108-.112zm-10.495.468c.36-.019.675.082.881.328.474.553-.421 1.422-1.87 1.87-1.342.395-1.737.21-1.29-.632.49-.905 1.488-1.524 2.279-1.566zm9.946.032c.072.007.204.112.44.323.29.263.527.579.527.71 0 .132-.237.106-.526-.052-.29-.158-.527-.474-.527-.711 0-.185.013-.276.086-.27z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/storybook.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/storybook.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const StorybookIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Storybook</title>
|
||||
<path d="M16.71.243l-.12 2.71a.18.18 0 00.29.15l1.06-.8.9.7a.18.18 0 00.28-.14l-.1-2.76 1.33-.1a1.2 1.2 0 011.279 1.2v21.596a1.2 1.2 0 01-1.26 1.2l-16.096-.72a1.2 1.2 0 01-1.15-1.16l-.75-19.797a1.2 1.2 0 011.13-1.27L16.7.222zM13.64 9.3c0 .47 3.16.24 3.59-.08 0-3.2-1.72-4.89-4.859-4.89-3.15 0-4.899 1.72-4.899 4.29 0 4.45 5.999 4.53 5.999 6.959 0 .7-.32 1.1-1.05 1.1-.96 0-1.35-.49-1.3-2.16 0-.36-3.649-.48-3.769 0-.27 4.03 2.23 5.2 5.099 5.2 2.79 0 4.969-1.49 4.969-4.18 0-4.77-6.099-4.64-6.099-6.999 0-.97.72-1.1 1.13-1.1.45 0 1.25.07 1.19 1.87z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/typescript.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/typescript.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const TypeScriptIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>TypeScript</title>
|
||||
<path d="M1.125 0C.502 0 0 .502 0 1.125v21.75C0 23.498.502 24 1.125 24h21.75c.623 0 1.125-.502 1.125-1.125V1.125C24 .502 23.498 0 22.875 0zm17.363 9.75c.612 0 1.154.037 1.627.111a6.38 6.38 0 0 1 1.306.34v2.458a3.95 3.95 0 0 0-.643-.361 5.093 5.093 0 0 0-.717-.26 5.453 5.453 0 0 0-1.426-.2c-.3 0-.573.028-.819.086a2.1 2.1 0 0 0-.623.242c-.17.104-.3.229-.393.374a.888.888 0 0 0-.14.49c0 .196.053.373.156.529.104.156.252.304.443.444s.423.276.696.41c.273.135.582.274.926.416.47.197.892.407 1.266.628.374.222.695.473.963.753.268.279.472.598.614.957.142.359.214.776.214 1.253 0 .657-.125 1.21-.373 1.656a3.033 3.033 0 0 1-1.012 1.085 4.38 4.38 0 0 1-1.487.596c-.566.12-1.163.18-1.79.18a9.916 9.916 0 0 1-1.84-.164 5.544 5.544 0 0 1-1.512-.493v-2.63a5.033 5.033 0 0 0 3.237 1.2c.333 0 .624-.03.872-.09.249-.06.456-.144.623-.25.166-.108.29-.234.373-.38a1.023 1.023 0 0 0-.074-1.089 2.12 2.12 0 0 0-.537-.5 5.597 5.597 0 0 0-.807-.444 27.72 27.72 0 0 0-1.007-.436c-.918-.383-1.602-.852-2.053-1.405-.45-.553-.676-1.222-.676-2.005 0-.614.123-1.141.369-1.582.246-.441.58-.804 1.004-1.089a4.494 4.494 0 0 1 1.47-.629 7.536 7.536 0 0 1 1.77-.201zm-15.113.188h9.563v2.166H9.506v9.646H6.789v-9.646H3.375z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/vite.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/vite.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const ViteIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Vite</title>
|
||||
<path d="m8.286 10.578.512-8.657a.306.306 0 0 1 .247-.282L17.377.006a.306.306 0 0 1 .353.385l-1.558 5.403a.306.306 0 0 0 .352.385l2.388-.46a.306.306 0 0 1 .332.438l-6.79 13.55-.123.19a.294.294 0 0 1-.252.14c-.177 0-.35-.152-.305-.369l1.095-5.301a.306.306 0 0 0-.388-.355l-1.433.435a.306.306 0 0 1-.389-.354l.69-3.375a.306.306 0 0 0-.37-.36l-2.32.536a.306.306 0 0 1-.374-.316zm14.976-7.926L17.284 3.74l-.544 1.887 2.077-.4a.8.8 0 0 1 .84.369.8.8 0 0 1 .034.783L12.9 19.93l-.013.025-.015.023-.122.19a.801.801 0 0 1-.672.37.826.826 0 0 1-.634-.302.8.8 0 0 1-.16-.67l1.029-4.981-1.12.34a.81.81 0 0 1-.86-.262.802.802 0 0 1-.165-.67l.63-3.08-2.027.468a.808.808 0 0 1-.768-.233.81.81 0 0 1-.217-.6l.389-6.57-7.44-1.33a.612.612 0 0 0-.64.906L11.58 23.691a.612.612 0 0 0 1.066-.004l11.26-20.135a.612.612 0 0 0-.644-.9z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/vitest.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/vitest.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const VitestIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Vitest</title>
|
||||
<path d="M13.74024 1.05293a.49504.49504 0 0 0-.1569.02512.49338.49338 0 0 0-.25056.1876L7.59513 9.56159a.4895.4895 0 0 0-.08373.22327.48846.48846 0 0 0 .03163.23629.4893.4893 0 0 0 .13985.19319.4927.4927 0 0 0 .2149.10481l3.70685.78609-.22947 4.58007a.48834.48834 0 0 0 .08466.30017.49205.49205 0 0 0 .24931.18854c.10157.03398.21174.03444.3135.00064a.49387.49387 0 0 0 .25056-.18761l5.73735-8.29594a.4884.4884 0 0 0 .08404-.22327c.009-.08015-.0016-.16137-.03163-.23629a.48835.48835 0 0 0-.13985-.19319.49318.49318 0 0 0-.2149-.1048l-3.70686-.7861.22947-4.58008a.48802.48802 0 0 0-.08466-.30017.4913.4913 0 0 0-.24931-.18853.49439.49439 0 0 0-.1566-.02574zM1.15697 9.78795c-.30647.0012-.60009.12378-.81679.34048a1.16107 1.16107 0 0 0-.34017.81648 1.162 1.162 0 0 0 .33366.81957l10.84241 10.8421a1.15762 1.15762 0 0 0 .37677.25211 1.1583 1.1583 0 0 0 .44467.08838c.00084 0 .0016-.00031.0025-.00031.00073 0 .0014.00031.0022.00031a1.15827 1.15827 0 0 0 .44467-.08838 1.15731 1.15731 0 0 0 .37677-.2521l10.84236-10.8421a1.16272 1.16272 0 0 0 .33397-.81958c-.0013-.30647-.12376-.59976-.34048-.81648a1.1616 1.1616 0 0 0-.81679-.34048 1.16114 1.16114 0 0 0-.81926.33366l-5.4012 5.4009c-.0078.0074-.01718.01255-.02482.02015L12 20.14011l-4.59776-4.59745c-.0074-.0074-.01659-.01238-.02419-.01954l-5.4015-5.40151a1.162 1.162 0 0 0-.81958-.33366Z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/vue.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/vue.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const VueIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Vue.js</title>
|
||||
<path d="M24,1.61H14.06L12,5.16,9.94,1.61H0L12,22.39ZM12,14.08,5.16,2.23H9.59L12,6.41l2.41-4.18h4.43Z" />
|
||||
</svg>
|
||||
);
|
||||
14
graph/ui-icons/src/lib/technologies/webpack.tsx
Normal file
14
graph/ui-icons/src/lib/technologies/webpack.tsx
Normal file
@ -0,0 +1,14 @@
|
||||
import { FC, SVGProps } from 'react';
|
||||
|
||||
export const WebpackIcon: FC<SVGProps<SVGSVGElement>> = (props) => (
|
||||
<svg
|
||||
role="img"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="currentColor"
|
||||
{...props}
|
||||
>
|
||||
<title>Webpack</title>
|
||||
<path d="M22.1987 18.498l-9.7699 5.5022v-4.2855l6.0872-3.3338 3.6826 2.117zm.6683-.6026V6.3884l-3.5752 2.0544v7.396zm-21.0657.6026l9.7699 5.5022v-4.2855L5.484 16.3809l-3.6826 2.117zm-.6683-.6026V6.3884l3.5751 2.0544v7.396zm.4183-12.2515l10.0199-5.644v4.1434L5.152 7.6586l-.0489.028zm20.8975 0l-10.02-5.644v4.1434l6.4192 3.5154.0489.028 3.5518-2.0427zm-10.8775 13.096l-6.0056-3.2873V8.9384l6.0054 3.4525v6.349zm.8575 0l6.0053-3.2873V8.9384l-6.0053 3.4525zM5.9724 8.1845l6.0287-3.3015L18.03 8.1845l-6.0288 3.4665z" />
|
||||
</svg>
|
||||
);
|
||||
@ -15,8 +15,44 @@ export const Simple: Story = {
|
||||
},
|
||||
};
|
||||
|
||||
export const SimpleLarge: Story = {
|
||||
args: {
|
||||
technology: 'react',
|
||||
className: 'h-8 w-8',
|
||||
},
|
||||
};
|
||||
|
||||
export const Monochromatic: Story = {
|
||||
args: {
|
||||
technology: 'react',
|
||||
monochromatic: true,
|
||||
},
|
||||
};
|
||||
|
||||
export const MonochromaticLarge: Story = {
|
||||
args: {
|
||||
technology: 'react',
|
||||
monochromatic: true,
|
||||
className: 'h-8 w-8',
|
||||
},
|
||||
};
|
||||
|
||||
export const UnknownTechnology: Story = {
|
||||
args: {
|
||||
technology: 'unknown',
|
||||
},
|
||||
};
|
||||
|
||||
export const UnknownTechnologyLarge: Story = {
|
||||
args: {
|
||||
technology: 'unknown',
|
||||
className: 'h-8 w-8',
|
||||
},
|
||||
};
|
||||
|
||||
export const MonochromaticUnknownTechnology: Story = {
|
||||
args: {
|
||||
technology: 'unknown',
|
||||
monochromatic: true,
|
||||
},
|
||||
};
|
||||
|
||||
@ -1,33 +1,128 @@
|
||||
import { HTMLProps } from 'react';
|
||||
import { twMerge } from 'tailwind-merge';
|
||||
import { Framework, frameworkIcons } from './framework-icons';
|
||||
import { MonochromaticTechnologyIconsMap } from './technology-icons-map-monochromatic';
|
||||
|
||||
export interface TechnologyIconProps {
|
||||
export interface TechnologyIconProps extends HTMLProps<HTMLDivElement> {
|
||||
technology?: string;
|
||||
showTooltip?: boolean;
|
||||
monochromatic?: boolean;
|
||||
}
|
||||
|
||||
export function TechnologyIcon({
|
||||
technology,
|
||||
showTooltip,
|
||||
monochromatic,
|
||||
...props
|
||||
}: TechnologyIconProps) {
|
||||
if (!technology) {
|
||||
return null;
|
||||
}
|
||||
if (monochromatic) {
|
||||
return (
|
||||
<TechnologyIconMonochromatic
|
||||
{...props}
|
||||
technology={technology}
|
||||
showTooltip={showTooltip}
|
||||
/>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<TechnologyIconColor
|
||||
{...props}
|
||||
technology={technology}
|
||||
showTooltip={showTooltip}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
function UnknownTechnologyIcon({
|
||||
technology,
|
||||
showTooltip,
|
||||
...props
|
||||
}: TechnologyIconProps) {
|
||||
if (!technology) {
|
||||
return null;
|
||||
}
|
||||
return (
|
||||
<div
|
||||
{...props}
|
||||
className={twMerge(
|
||||
'h-4 w-4',
|
||||
'flex items-center justify-center rounded border border-slate-400 text-sm text-slate-400',
|
||||
props.className
|
||||
)}
|
||||
data-tooltip={showTooltip ? technology : null}
|
||||
>
|
||||
{technology[0]}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function TechnologyIconMonochromatic({
|
||||
technology,
|
||||
showTooltip,
|
||||
...props
|
||||
}: TechnologyIconProps) {
|
||||
if (!technology) {
|
||||
return null;
|
||||
}
|
||||
const Icon = MonochromaticTechnologyIconsMap[technology as any]?.icon;
|
||||
|
||||
if (!Icon) {
|
||||
return (
|
||||
<UnknownTechnologyIcon
|
||||
{...props}
|
||||
technology={technology}
|
||||
showTooltip={showTooltip}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
{...props}
|
||||
className={twMerge('text-slate-400', 'h-4 w-4', props.className)}
|
||||
data-tooltip={showTooltip ? technology : null}
|
||||
>
|
||||
<Icon />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function TechnologyIconColor({
|
||||
technology,
|
||||
showTooltip,
|
||||
...props
|
||||
}: TechnologyIconProps) {
|
||||
if (!technology) {
|
||||
return null;
|
||||
}
|
||||
const image = frameworkIcons[technology as Framework]?.image;
|
||||
|
||||
if (!image) {
|
||||
return (
|
||||
<UnknownTechnologyIcon
|
||||
{...props}
|
||||
technology={technology}
|
||||
showTooltip={showTooltip}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
className={`h-4 w-4 ${
|
||||
{...props}
|
||||
className={twMerge(
|
||||
'h-4 w-4',
|
||||
frameworkIcons[technology as Framework]?.isAdaptiveIcon
|
||||
? 'adpative-icon'
|
||||
: ''
|
||||
} ${
|
||||
!image
|
||||
? 'flex items-center justify-center rounded bg-slate-800 text-sm text-slate-50 dark:bg-slate-50 dark:text-slate-800'
|
||||
: ''
|
||||
}`}
|
||||
? 'adaptive-icon'
|
||||
: '',
|
||||
props.className
|
||||
)}
|
||||
data-tooltip={showTooltip ? technology : null}
|
||||
>
|
||||
{image ?? technology[0]}
|
||||
{image}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@ -0,0 +1,27 @@
|
||||
import type { Meta, StoryObj } from '@storybook/react';
|
||||
import { MonochromaticTechnologyIconsMap } from './technology-icons-map-monochromatic';
|
||||
|
||||
const meta: Meta<typeof MonochromaticTechnologyIconsMap> = {
|
||||
component: () => (
|
||||
<>
|
||||
{Object.keys(MonochromaticTechnologyIconsMap).map((key) => {
|
||||
const Icon = MonochromaticTechnologyIconsMap[key].icon;
|
||||
return (
|
||||
<>
|
||||
<div>{key}</div>
|
||||
<div className="h-10 w-10">
|
||||
<Icon />
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
})}
|
||||
</>
|
||||
),
|
||||
title: 'MonochromaticTechnologyIconsMap',
|
||||
};
|
||||
export default meta;
|
||||
type Story = StoryObj<typeof MonochromaticTechnologyIconsMap>;
|
||||
|
||||
export const Primary: Story = {
|
||||
args: {},
|
||||
};
|
||||
@ -0,0 +1,61 @@
|
||||
import { FunctionComponent, SVGProps } from 'react';
|
||||
import { AngularIcon } from './technologies/angular';
|
||||
import { CypressIcon } from './technologies/cypress';
|
||||
import { EsbuildIcon } from './technologies/esbuild';
|
||||
import { EslintIcon } from './technologies/eslint';
|
||||
import { ExpoIcon } from './technologies/expo';
|
||||
import { ExpressIcon } from './technologies/express';
|
||||
import { GradleIcon } from './technologies/gradle';
|
||||
import { HTML5Icon } from './technologies/html5';
|
||||
import { JavaScriptIcon } from './technologies/javascript';
|
||||
import { JestIcon } from './technologies/jest';
|
||||
import { NestJSIcon } from './technologies/nestjs';
|
||||
import { NextJSIcon } from './technologies/nextjs';
|
||||
import { NodeIcon } from './technologies/nodejs';
|
||||
import { NuxtIcon } from './technologies/nuxtjs';
|
||||
import { PlaywrightIcon } from './technologies/playwright';
|
||||
import { PrettierIcon } from './technologies/prettier';
|
||||
import { ReactIcon } from './technologies/react';
|
||||
import { RemixIcon } from './technologies/remix';
|
||||
import { RollupIcon } from './technologies/rollup';
|
||||
import { RspackIcon } from './technologies/rspack';
|
||||
import { StorybookIcon } from './technologies/storybook';
|
||||
import { TypeScriptIcon } from './technologies/typescript';
|
||||
import { ViteIcon } from './technologies/vite';
|
||||
import { VitestIcon } from './technologies/vitest';
|
||||
import { VueIcon } from './technologies/vue';
|
||||
import { WebpackIcon } from './technologies/webpack';
|
||||
|
||||
export const MonochromaticTechnologyIconsMap: Record<
|
||||
string,
|
||||
{ icon: FunctionComponent<SVGProps<SVGSVGElement>> }
|
||||
> = {
|
||||
angular: { icon: AngularIcon },
|
||||
cypress: { icon: CypressIcon },
|
||||
detox: { icon: ReactIcon },
|
||||
esbuild: { icon: EsbuildIcon },
|
||||
eslint: { icon: EslintIcon },
|
||||
expo: { icon: ExpoIcon },
|
||||
express: { icon: ExpressIcon },
|
||||
gradle: { icon: GradleIcon },
|
||||
javascript: { icon: JavaScriptIcon },
|
||||
jest: { icon: JestIcon },
|
||||
nest: { icon: NestJSIcon },
|
||||
next: { icon: NextJSIcon },
|
||||
node: { icon: NodeIcon },
|
||||
nuxt: { icon: NuxtIcon },
|
||||
playwright: { icon: PlaywrightIcon },
|
||||
prettier: { icon: PrettierIcon },
|
||||
react: { icon: ReactIcon },
|
||||
reactnative: { icon: ReactIcon },
|
||||
remix: { icon: RemixIcon },
|
||||
rollup: { icon: RollupIcon },
|
||||
rspack: { icon: RspackIcon },
|
||||
storybook: { icon: StorybookIcon },
|
||||
typescript: { icon: TypeScriptIcon },
|
||||
vite: { icon: ViteIcon },
|
||||
vitest: { icon: VitestIcon },
|
||||
vue: { icon: VueIcon },
|
||||
webcomponents: { icon: HTML5Icon },
|
||||
webpack: { icon: WebpackIcon },
|
||||
};
|
||||
@ -83,6 +83,7 @@ export const ProjectDetails = ({
|
||||
<TargetTechnologies
|
||||
technologies={technologies}
|
||||
showTooltip={true}
|
||||
className="h-6 w-6"
|
||||
/>
|
||||
</div>
|
||||
<span>
|
||||
|
||||
@ -81,6 +81,7 @@ export const TargetConfigurationDetailsHeader = ({
|
||||
<TargetTechnologies
|
||||
technologies={targetConfiguration.metadata?.technologies}
|
||||
showTooltip={!isCollasped}
|
||||
className="h-4 w-4"
|
||||
/>
|
||||
{isCollasped &&
|
||||
targetConfiguration?.executor !== '@nx/js:release-publish' && (
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
import { TechnologyIcon } from '@nx/graph/ui-icons';
|
||||
import { HTMLProps } from 'react';
|
||||
|
||||
export interface TargetTechnologiesProps {
|
||||
export interface TargetTechnologiesProps extends HTMLProps<HTMLDivElement> {
|
||||
technologies?: string[];
|
||||
showTooltip?: boolean;
|
||||
}
|
||||
@ -8,6 +9,7 @@ export interface TargetTechnologiesProps {
|
||||
export function TargetTechnologies({
|
||||
technologies,
|
||||
showTooltip,
|
||||
...props
|
||||
}: TargetTechnologiesProps) {
|
||||
if (!technologies || technologies.length === 0) {
|
||||
return null;
|
||||
@ -19,6 +21,8 @@ export function TargetTechnologies({
|
||||
key={index}
|
||||
technology={technology}
|
||||
showTooltip={showTooltip}
|
||||
monochromatic={true}
|
||||
{...props}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { ChevronRightIcon } from '@heroicons/react/24/outline';
|
||||
import { frameworkIcons } from '@nx/graph/ui-icons';
|
||||
import { Framework, frameworkIcons } from '@nx/graph/ui-icons';
|
||||
|
||||
export function CallToAction({
|
||||
url,
|
||||
@ -18,7 +18,9 @@ export function CallToAction({
|
||||
<div className="w-2 bg-blue-500 dark:bg-sky-500"></div>
|
||||
|
||||
<div className="z-10 flex flex-grow items-center py-3">
|
||||
<div className="h-10 w-10">{icon && frameworkIcons[icon]?.image}</div>
|
||||
<div className="h-10 w-10">
|
||||
{icon && frameworkIcons[icon as Framework]?.image}
|
||||
</div>
|
||||
|
||||
<div className="mx-3">
|
||||
<p>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user