@coopdigital/react 1.10.1 → 1.11.0

package/src/components/icons/CogIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,7 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const CogIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CogIcon = ({ alt, className, fill, id, ref, ...props }: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/CommunityFilledIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const CommunityFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CommunityFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/CommunityIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const CommunityIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CommunityIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/ComputerIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const ComputerIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ComputerIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/ContactFilledIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const ContactFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ContactFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/ContactIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const ContactIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ContactIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/ContactlessFilledIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const ContactlessFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ContactlessFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/ContactlessIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const ContactlessIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ContactlessIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/CoopLiveIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const CoopLiveIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CoopLiveIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/CoopLocationFilledIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const CoopLocationFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CoopLocationFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/CoopLogoIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const CoopLogoIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CoopLogoIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/CoopMembershipCardFilledIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -14,7 +15,7 @@ export const CoopMembershipCardFilledIcon = ({
   id,
   ref,
   ...props
-}: IconProps) => {
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,
@@ -31,9 +32,9 @@ export const CoopMembershipCardFilledIcon = ({
       {alt ? <title id={uid + "__title"}>{alt}</title> : null}
       <path d="M11.862 13.64a3 3 0 0 1 .97 0 1 1 0 0 1 .466.223 1 1 0 0 1 .275.426q.114.374.117.764-.003.38-.117.743c-.057.16-.153.305-.28.42a1 1 0 0 1-.472.25c-.32.062-.65.062-.97 0a.9.9 0 0 1-.46-.218.9.9 0 0 1-.276-.427 2.44 2.44 0 0 1 .011-1.516v-.022a1 1 0 0 1 .275-.415c.132-.112.29-.19.461-.228M19.11 6.817c.32-.057.65-.057.97 0a.95.95 0 0 1 .741.645 2.5 2.5 0 0 1 .011 1.507 1 1 0 0 1-.282.422c-.13.113-.288.192-.46.227-.32.057-.648.057-.969 0a.97.97 0 0 1-.466-.223.97.97 0 0 1-.276-.426 2.5 2.5 0 0 1-.01-1.507v-.006a1 1 0 0 1 .28-.415c.133-.11.291-.187.461-.224" />
       <path
-        clipRule="evenodd"
+        clip-rule="evenodd"
         d="M24 2a2 2 0 0 1 2 2v24a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm-2.484 10.278a5.8 5.8 0 0 0-3.768 0c-.311.09-.595.254-.826.478-.232.223-.4.5-.492.806a5.6 5.6 0 0 0-.207 1.558v4.463h2.04v-4.515c-.005-.25.03-.499.105-.738a1 1 0 0 1 .281-.42c.132-.113.291-.192.461-.23.32-.056.649-.056.97 0a1 1 0 0 1 .462.225c.13.115.227.261.28.425a2.5 2.5 0 0 1 0 1.507.981.981 0 0 1-.72.645 2.8 2.8 0 0 1-.976 0l-.111-.016h-.08l.7 1.865a6.2 6.2 0 0 0 1.88-.307c.305-.107.577-.285.795-.52.222-.23.384-.51.471-.815a5.56 5.56 0 0 0 0-3.087 2.1 2.1 0 0 0-.476-.804 2.1 2.1 0 0 0-.79-.52m-7.264-.11a5.8 5.8 0 0 0-3.768 0 2 2 0 0 0-.794.52c-.22.232-.381.512-.471.816a5.56 5.56 0 0 0 0 3.087c.096.3.259.578.476.81.22.23.49.408.79.52 1.218.42 2.548.42 3.767 0a2.01 2.01 0 0 0 1.26-1.34 5.56 5.56 0 0 0 0-3.087 2 2 0 0 0-.477-.806 2.1 2.1 0 0 0-.783-.52m.005-6.815a5.78 5.78 0 0 0-3.767 0 2.011 2.011 0 0 0-1.262 1.335 5.56 5.56 0 0 0 0 3.085c.094.299.256.573.472.801.22.226.488.404.784.52a5.8 5.8 0 0 0 1.881.3 6.5 6.5 0 0 0 1.886-.3c.3-.114.572-.291.795-.52.216-.233.376-.513.466-.816 0-.088.047-.177.074-.26l-1.923-.873q-.024.174-.074.344c-.057.16-.153.305-.28.42-.132.113-.29.191-.461.23-.32.056-.65.056-.97 0a1 1 0 0 1-.467-.224.97.97 0 0 1-.275-.426 2.52 2.52 0 0 1 0-1.507.977.977 0 0 1 .742-.645c.32-.057.65-.057.97 0a.925.925 0 0 1 .741.645q.094.366.1.743h2.04c0-.516-.07-1.03-.206-1.528a2.1 2.1 0 0 0-.477-.805 2.1 2.1 0 0 0-.79-.52m7.248-.038a5.8 5.8 0 0 0-3.772 0 2 2 0 0 0-.79.52c-.22.23-.382.507-.471.81a5.56 5.56 0 0 0 0 3.087c.091.313.255.601.477.842.218.226.484.404.778.52a5.3 5.3 0 0 0 1.886.3 6.5 6.5 0 0 0 1.887-.3c.3-.114.572-.291.795-.52.216-.233.375-.513.466-.816.14-.508.212-1.032.212-1.559s-.067-1.05-.201-1.558a2.1 2.1 0 0 0-.483-.806 2.06 2.06 0 0 0-.784-.52"
-        fillRule="evenodd"
+        fill-rule="evenodd"
       />
     </svg>
   )

package/src/components/icons/CreditCardFilledIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const CreditCardFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CreditCardFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,
@@ -22,7 +30,7 @@ export const CreditCardFilledIcon = ({ alt, className, fill, id, ref, ...props }
   return (
     <svg {...componentProps} ref={ref}>
       {alt ? <title id={uid + "__title"}>{alt}</title> : null}
-      <g clipPath="url(#a)">
+      <g clip-path="url(#a)">
         <mask id="b">
           <path d="M28 6a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2zM6 18v4h5.979v-4zm-2-8v4h24v-4z" />
         </mask>

package/src/components/icons/CreditCardIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const CreditCardIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CreditCardIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/CrossIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,7 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const CrossIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CrossIcon = ({ alt, className, fill, id, ref, ...props }: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/DocumentIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const DocumentIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const DocumentIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/DownloadIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const DownloadIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const DownloadIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/EnterStoreIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const EnterStoreIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const EnterStoreIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/ExitStoreIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const ExitStoreIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ExitStoreIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/EyeFilledIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const EyeFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const EyeFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/EyeIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,7 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const EyeIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const EyeIcon = ({ alt, className, fill, id, ref, ...props }: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/EyeStrikeFilledIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const EyeStrikeFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const EyeStrikeFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/EyeStrikeIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const EyeStrikeIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const EyeStrikeIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/FeedbackFilledIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const FeedbackFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const FeedbackFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/FeedbackIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const FeedbackIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const FeedbackIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/FilterIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,7 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const FilterIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const FilterIcon = ({ alt, className, fill, id, ref, ...props }: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/GiftCardFilledIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const GiftCardFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const GiftCardFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,

package/src/components/icons/GiftCardIcon.tsx

@@ -1,5 +1,6 @@
+import type { JSX, SVGProps } from "react"
+
 import clsx from "clsx"
-import { type SVGProps } from "react"
 
 import { useId } from "../../hooks/useId"
 
@@ -7,7 +8,14 @@ interface IconProps extends SVGProps<SVGSVGElement> {
   alt?: string
 }
 
-export const GiftCardIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const GiftCardIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,