feat: add Forward and Rewind icons with SVG and React components by kosiken · Pull Request #20 · risevest/sigil

kosiken · 2025-06-24T23:53:44Z

No description provided.

Copilot

Pull Request Overview

This PR introduces two new SVG React icon components—Forward and Rewind—and exports them in the central rds.ts index.

Adds Forward and Rewind icon exports to rds.ts
Implements icon-pack/rds/forward.tsx with the Forward icon
Implements icon-pack/rds/rewind.tsx with the Rewind icon

Reviewed Changes

Copilot reviewed 3 out of 5 changed files in this pull request and generated 5 comments.

File	Description
rds.ts	Export the new Forward and Rewind icons
icon-pack/rds/rewind.tsx	Add Rewind component with SVG paths
icon-pack/rds/forward.tsx	Add Forward component with SVG paths

Comments suppressed due to low confidence (1)

rds.ts:37

[nitpick] Align the indentation of this export with the surrounding lines (add leading spaces) for consistent formatting.

export { Forward } from './icon-pack/rds/forward'

Copilot · 2025-06-24T23:55:05Z

icon-pack/rds/rewind.tsx

+  const { color = 'black', size = 24, ...otherProps } = props
+  return (
+    <Svg
+      color="white"


[nitpick] The hardcoded color="white" on the <Svg> element overrides dynamic color props; remove it so fill={color} controls the icon color.

Suggested change

color="white"

Copilot · 2025-06-24T23:55:06Z

icon-pack/rds/rewind.tsx

+        color="white"
+      />
+      <Path
+        fill={color}
+        d="M15.3712 7.77546C15.4873 7.53374 15.7318 7.38 16 7.38C16.684 7.38 17.3527 7.44879 17.9993 7.58003C22.564 8.50663 26 12.5413 26 17.38C26 22.9029 21.5229 27.38 16 27.38C10.4772 27.38 6 22.9029 6 17.38C6 13.2783 8.46939 9.75487 11.9997 8.2124C12.3528 8.05813 12.7641 8.2193 12.9184 8.57239C13.0727 8.92547 12.9115 9.33676 12.5584 9.49103C9.51794 10.8195 7.39535 13.8526 7.39535 17.38C7.39535 22.1322 11.2478 25.9847 16 25.9847C20.7522 25.9847 24.6047 22.1322 24.6047 17.38C24.6047 13.5191 22.0612 10.2509 18.5581 9.16181V10.4033C18.5581 10.6996 18.371 10.9635 18.0914 11.0616C17.8118 11.1597 17.5007 11.0705 17.3156 10.8391L15.4552 8.51351C15.2876 8.30409 15.255 8.01718 15.3712 7.77546Z"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        color="white"


[nitpick] This color="white" on the <Path> is redundant since fill={color} defines the fill; it can be removed to avoid confusion.

Suggested change

color="white"

/>

<Path

fill={color}

d="M15.3712 7.77546C15.4873 7.53374 15.7318 7.38 16 7.38C16.684 7.38 17.3527 7.44879 17.9993 7.58003C22.564 8.50663 26 12.5413 26 17.38C26 22.9029 21.5229 27.38 16 27.38C10.4772 27.38 6 22.9029 6 17.38C6 13.2783 8.46939 9.75487 11.9997 8.2124C12.3528 8.05813 12.7641 8.2193 12.9184 8.57239C13.0727 8.92547 12.9115 9.33676 12.5584 9.49103C9.51794 10.8195 7.39535 13.8526 7.39535 17.38C7.39535 22.1322 11.2478 25.9847 16 25.9847C20.7522 25.9847 24.6047 22.1322 24.6047 17.38C24.6047 13.5191 22.0612 10.2509 18.5581 9.16181V10.4033C18.5581 10.6996 18.371 10.9635 18.0914 11.0616C17.8118 11.1597 17.5007 11.0705 17.3156 10.8391L15.4552 8.51351C15.2876 8.30409 15.255 8.01718 15.3712 7.77546Z"

fillRule="evenodd"

clipRule="evenodd"

color="white"

/>

<Path

fill={color}

d="M15.3712 7.77546C15.4873 7.53374 15.7318 7.38 16 7.38C16.684 7.38 17.3527 7.44879 17.9993 7.58003C22.564 8.50663 26 12.5413 26 17.38C26 22.9029 21.5229 27.38 16 27.38C10.4772 27.38 6 22.9029 6 17.38C6 13.2783 8.46939 9.75487 11.9997 8.2124C12.3528 8.05813 12.7641 8.2193 12.9184 8.57239C13.0727 8.92547 12.9115 9.33676 12.5584 9.49103C9.51794 10.8195 7.39535 13.8526 7.39535 17.38C7.39535 22.1322 11.2478 25.9847 16 25.9847C20.7522 25.9847 24.6047 22.1322 24.6047 17.38C24.6047 13.5191 22.0612 10.2509 18.5581 9.16181V10.4033C18.5581 10.6996 18.371 10.9635 18.0914 11.0616C17.8118 11.1597 17.5007 11.0705 17.3156 10.8391L15.4552 8.51351C15.2876 8.30409 15.255 8.01718 15.3712 7.77546Z"

fillRule="evenodd"

clipRule="evenodd"

Copilot · 2025-06-24T23:55:06Z

icon-pack/rds/forward.tsx

+const Icon = (props: IconProps) => {
+  const { color = 'black', size = 24, ...otherProps } = props
+  return (
+    <Svg viewBox="0 0 32 33" color="white" height={size} width={size} {...otherProps}>


[nitpick] Remove the hardcoded color="white" on <Svg> so the fill={color} prop can correctly control the icon color.

Suggested change

<Svg viewBox="0 0 32 33" color="white" height={size} width={size} {...otherProps}>

<Svg viewBox="0 0 32 33" height={size} width={size} {...otherProps}>

Copilot · 2025-06-24T23:55:06Z

icon-pack/rds/forward.tsx

+const Icon = (props: IconProps) => {
+  const { color = 'black', size = 24, ...otherProps } = props
+  return (
+    <Svg viewBox="0 0 32 33" color="white" height={size} width={size} {...otherProps}>


[nitpick] For consistency with the Rewind icon, consider adding fill="none" to this <Svg> to explicitly set a transparent background.

Suggested change

<Svg viewBox="0 0 32 33" color="white" height={size} width={size} {...otherProps}>

<Svg viewBox="0 0 32 33" fill="none" color="white" height={size} width={size} {...otherProps}>

Copilot · 2025-06-24T23:55:07Z

icon-pack/rds/forward.tsx

+        color="white"
+      />
+      <Path
+        d="M16.6288 7.77546C16.5127 7.53374 16.2682 7.38 16 7.38C15.316 7.38 14.6473 7.44879 14.0007 7.58003C9.43597 8.50663 6 12.5413 6 17.38C6 22.9029 10.4772 27.38 16 27.38C21.5229 27.38 26 22.9029 26 17.38C26 13.2783 23.5306 9.75487 20.0003 8.2124C19.6472 8.05813 19.2359 8.2193 19.0816 8.57239C18.9273 8.92547 19.0886 9.33676 19.4416 9.49103C22.482 10.8195 24.6047 13.8526 24.6047 17.38C24.6047 22.1322 20.7522 25.9847 16 25.9847C11.2478 25.9847 7.39535 22.1322 7.39535 17.38C7.39535 13.5191 9.9388 10.2509 13.4419 9.16181V10.4033C13.4419 10.6996 13.629 10.9635 13.9086 11.0616C14.1882 11.1597 14.4993 11.0705 14.6844 10.8391L16.5448 8.51351C16.7124 8.30409 16.745 8.01718 16.6288 7.77546Z"
+        fill={color}
+        fillRule="evenodd"
+        clipRule="evenodd"
+        color="white"


[nitpick] The color="white" on this <Path> is redundant—remove it and rely on fill={color} for consistency.

Suggested change

color="white"

/>

<Path

d="M16.6288 7.77546C16.5127 7.53374 16.2682 7.38 16 7.38C15.316 7.38 14.6473 7.44879 14.0007 7.58003C9.43597 8.50663 6 12.5413 6 17.38C6 22.9029 10.4772 27.38 16 27.38C21.5229 27.38 26 22.9029 26 17.38C26 13.2783 23.5306 9.75487 20.0003 8.2124C19.6472 8.05813 19.2359 8.2193 19.0816 8.57239C18.9273 8.92547 19.0886 9.33676 19.4416 9.49103C22.482 10.8195 24.6047 13.8526 24.6047 17.38C24.6047 22.1322 20.7522 25.9847 16 25.9847C11.2478 25.9847 7.39535 22.1322 7.39535 17.38C7.39535 13.5191 9.9388 10.2509 13.4419 9.16181V10.4033C13.4419 10.6996 13.629 10.9635 13.9086 11.0616C14.1882 11.1597 14.4993 11.0705 14.6844 10.8391L16.5448 8.51351C16.7124 8.30409 16.745 8.01718 16.6288 7.77546Z"

fill={color}

fillRule="evenodd"

clipRule="evenodd"

color="white"

/>

<Path

d="M16.6288 7.77546C16.5127 7.53374 16.2682 7.38 16 7.38C15.316 7.38 14.6473 7.44879 14.0007 7.58003C9.43597 8.50663 6 12.5413 6 17.38C6 22.9029 10.4772 27.38 16 27.38C21.5229 27.38 26 22.9029 26 17.38C26 13.2783 23.5306 9.75487 20.0003 8.2124C19.6472 8.05813 19.2359 8.2193 19.0816 8.57239C18.9273 8.92547 19.0886 9.33676 19.4416 9.49103C22.482 10.8195 24.6047 13.8526 24.6047 17.38C24.6047 22.1322 20.7522 25.9847 16 25.9847C11.2478 25.9847 7.39535 22.1322 7.39535 17.38C7.39535 13.5191 9.9388 10.2509 13.4419 9.16181V10.4033C13.4419 10.6996 13.629 10.9635 13.9086 11.0616C14.1882 11.1597 14.4993 11.0705 14.6844 10.8391L16.5448 8.51351C16.7124 8.30409 16.745 8.01718 16.6288 7.77546Z"

fill={color}

fillRule="evenodd"

clipRule="evenodd"

BalogunofAfrica · 2025-07-23T02:23:36Z

icons/rds/forward.svg

Is this always supposed to be white?

BalogunofAfrica · 2025-07-23T02:23:44Z

icons/rds/rewind.svg

This as well

feat: add Forward and Rewind icons with SVG and React components

36e2d4a

Copilot AI review requested due to automatic review settings June 24, 2025 23:53

Copilot AI reviewed Jun 24, 2025

View reviewed changes

fix: reorder exports for consistency in rds.ts

ee6ca24

BalogunofAfrica reviewed Jul 23, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: add Forward and Rewind icons with SVG and React components#20

feat: add Forward and Rewind icons with SVG and React components#20
kosiken wants to merge 2 commits intomasterfrom
feat/add-video-icons

kosiken commented Jun 24, 2025

Uh oh!

Copilot AI left a comment

Uh oh!

Copilot AI Jun 24, 2025

Uh oh!

Copilot AI Jun 24, 2025

Uh oh!

Copilot AI Jun 24, 2025

Uh oh!

Copilot AI Jun 24, 2025

Uh oh!

Copilot AI Jun 24, 2025

Uh oh!

BalogunofAfrica Jul 23, 2025

Uh oh!

BalogunofAfrica Jul 23, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

	<Svg viewBox="0 0 32 33" color="white" height={size} width={size} {...otherProps}>
	<Svg viewBox="0 0 32 33" height={size} width={size} {...otherProps}>

	<Svg viewBox="0 0 32 33" color="white" height={size} width={size} {...otherProps}>
	<Svg viewBox="0 0 32 33" fill="none" color="white" height={size} width={size} {...otherProps}>

Conversation

kosiken commented Jun 24, 2025

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Copilot AI Jun 24, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jun 24, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jun 24, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jun 24, 2025

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jun 24, 2025

Choose a reason for hiding this comment

Uh oh!

BalogunofAfrica Jul 23, 2025

Choose a reason for hiding this comment

Uh oh!

BalogunofAfrica Jul 23, 2025

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants