Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(svg): remove some of the icons to not use React.FC #315

Merged
merged 2 commits into from
Nov 12, 2023
Merged

fix(svg): remove some of the icons to not use React.FC #315

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
822671a
refactor(svg): refactor IconProps to use React.SVGProps
nebula-aac Nov 11, 2023
697e2f7
fix(svg): fix iconprops
nebula-aac Nov 12, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 7 additions & 8 deletions packages/svg/src/icons/Close/closeIcon.tsx → packages/svg/src/icons/Close/CloseIcon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,18 @@
import React from 'react';
import { CARIBBEAN_GREEN_FILL, DEFAULT_HEIGHT, DEFAULT_WIDTH } from '../../constants/constants';
import { DEFAULT_HEIGHT, DEFAULT_WIDTH } from 'src/constants/constants';
import { IconProps } from '../types';

const CloseIcon: React.FC<React.SVGProps<SVGSVGElement>> = ({
export const CloseIcon = ({
width = DEFAULT_WIDTH,
height = DEFAULT_HEIGHT,
fill = CARIBBEAN_GREEN_FILL,
...props
}) => {
}: IconProps): JSX.Element => {
return (
<svg
width={width}
height={height}
fill={fill}
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
width={width}
height={height}
fill={props.fill}
{...props}
>
<path d="M0 0h24v24H0z" fill="none" />
Expand Down
2 changes: 1 addition & 1 deletion packages/svg/src/icons/Close/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1 +1 @@
export { default as CloseIcon } from './closeIcon';
export { default as CloseIcon } from './CloseIcon';
12 changes: 8 additions & 4 deletions packages/svg/src/icons/Delete/DeleteIcon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,17 @@
import { FC } from 'react';
import { DEFAULT_HEIGHT, DEFAULT_WIDTH } from 'src/constants/constants';
import { IconProps } from '../types';

export const DeleteIcon: FC<IconProps> = ({ width, height, ...props }) => {
export const DeleteIcon = ({
width = DEFAULT_WIDTH,
height = DEFAULT_HEIGHT,
...props
}: IconProps): JSX.Element => {
return (
<svg
width={width}
height={height}
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
width={width}
height={height}
{...props}
>
<path d="M0 0h24v24H0z" fill="none" />
Expand Down
8 changes: 6 additions & 2 deletions packages/svg/src/icons/Favorite/FavoriteIcon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,11 @@
import { FC } from 'react';
import { DEFAULT_HEIGHT, DEFAULT_WIDTH } from 'src/constants/constants';
import { IconProps } from '../types';

export const FavoriteIcon: FC<IconProps> = ({ width, height, ...props }) => {
export const FavoriteIcon = ({
width = DEFAULT_WIDTH,
height = DEFAULT_HEIGHT,
...props
}: IconProps): JSX.Element => {
return (
<svg
width={width}
Expand Down
16 changes: 8 additions & 8 deletions packages/svg/src/icons/Filter/FilterIcon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
import React from 'react';
import { CARIBBEAN_GREEN_FILL, DEFAULT_HEIGHT, DEFAULT_WIDTH } from '../../constants/constants';
import { DEFAULT_HEIGHT, DEFAULT_WIDTH } from 'src/constants/constants';
import { IconProps } from '../types';

const FilterIcon: React.FC<React.SVGProps<SVGSVGElement>> = ({
export const FilterIcon = ({
width = DEFAULT_WIDTH,
height = DEFAULT_HEIGHT,
fill = CARIBBEAN_GREEN_FILL,
...props
}) => {
}: IconProps): JSX.Element => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
width={width}
height={height}
fill={fill}
viewBox="0 0 24 24"
xmlns="http://www.w3.org/2000/svg"
fill={props.fill}
fill-opacity={props.fillOpacity}
{...props}
>
<path d="M0 0h24v24H0z" fill="none" />
Expand Down
8 changes: 6 additions & 2 deletions packages/svg/src/icons/Save/SaveAsIcon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,11 @@
import { FC } from 'react';
import { DEFAULT_HEIGHT, DEFAULT_WIDTH } from 'src/constants/constants';
import { IconProps } from '../types';

export const SaveAsIcon: FC<IconProps> = ({ width, height, ...props }) => {
export const SaveAsIcon = ({
width = DEFAULT_WIDTH,
height = DEFAULT_HEIGHT,
...props
}: IconProps): JSX.Element => {
return (
<svg
width={width}
Expand Down
13 changes: 6 additions & 7 deletions packages/svg/src/icons/Search/searchicon.tsx → packages/svg/src/icons/Search/SearchIcon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,18 @@
import React from 'react';
import { CARIBBEAN_GREEN_FILL, DEFAULT_HEIGHT, DEFAULT_WIDTH } from '../../constants/constants';
import { DEFAULT_HEIGHT, DEFAULT_WIDTH } from '../../constants/constants';
import { IconProps } from '../types';

const SearchIcon: React.FC<React.SVGProps<SVGSVGElement>> = ({
const SearchIcon = ({
width = DEFAULT_WIDTH,
height = DEFAULT_HEIGHT,
fill = CARIBBEAN_GREEN_FILL,
...props
}) => {
}: IconProps): JSX.Element => {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
height={height}
viewBox="0 -960 960 960"
width={width}
fill={fill}
height={height}
fill={props.fill}
{...props}
>
<path d="M796-121 533-384q-30 26-69.959 40.5T378-329q-108.162 0-183.081-75Q120-479 120-585t75-181q75-75 181.5-75t181 75Q632-691 632-584.85 632-542 618-502q-14 40-42 75l264 262-44 44ZM377-389q81.25 0 138.125-57.5T572-585q0-81-56.875-138.5T377-781q-82.083 0-139.542 57.5Q180-666 180-585t57.458 138.5Q294.917-389 377-389Z" />
Expand Down
2 changes: 1 addition & 1 deletion packages/svg/src/icons/Search/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1 +1 @@
export { default as SearchIcon } from './searchicon';
export { default as SearchIcon } from './SearchIcon';
34 changes: 34 additions & 0 deletions packages/svg/src/icons/Wasm/WasmIcon.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
import { DEFAULT_HEIGHT, DEFAULT_WIDTH } from '../../constants/constants';
import { IconProps } from '../types';

const WasmIcon = ({
width = DEFAULT_WIDTH,
height = DEFAULT_HEIGHT,
...props
}: IconProps): JSX.Element => {
return (
<svg
viewBox="0 0 100 100"
xmlns="http://www.w3.org/2000/svg"
width={width}
height={height}
fill={props.fill}
{...props}
>
<g>
<path d="M61.4379 0C61.4379 0.176471 61.4379 0.352941 61.4379 0.539216C61.4379 6.87255 56.3039 12.0049 49.9722 12.0049C43.6389 12.0049 38.5065 6.87092 38.5065 0.539216C38.5065 0.352941 38.5065 0.176471 38.5065 0L0 0V100H100V0H61.4379Z" />
<path
d="M23.2285 53.8905H29.856L34.3805 77.9869H34.4622L39.9001 53.8905H46.0994L51.0112 78.2827H51.1076L56.2644 53.8905H62.7644L54.3184 89.2974H47.7416L42.8707 65.201H42.7432L37.5292 89.2974H30.8298L23.2285 53.8905ZM70.2367 53.8905H80.6844L91.0602 89.2974H84.2236L81.9671 81.4183H70.0651L68.3233 89.2974H61.6648L70.2367 53.8905ZM74.2138 62.6176L71.3233 75.6078H80.32L77.0014 62.6176H74.2138Z"
fill="black"
/>
</g>
<defs>
<clipPath>
<rect width="100" height="100" fill="white" />
</clipPath>
</defs>
</svg>
);
};

export default WasmIcon;
1 change: 1 addition & 0 deletions packages/svg/src/icons/Wasm/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export { default as WasmIcon } from './WasmIcon';
7 changes: 5 additions & 2 deletions packages/svg/src/icons/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,10 @@
import { SVGAttributes } from 'react';
import React from 'react';

export type IconProps = {
children?: never;
color?: string;
title?: string;
} & SVGAttributes<SVGElement>;
width?: number | string;
height: number | string;
fill?: string;
} & React.SVGProps<SVGSVGElement>;
Loading