@coopdigital/react 1.10.2 → 1.11.0

package/src/components/icons/ArrowLeftIcon.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 ArrowLeftIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ArrowLeftIcon = ({
+  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/ArrowRightIcon.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 ArrowRightIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ArrowRightIcon = ({
+  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/ArrowUpIcon.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 ArrowUpIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ArrowUpIcon = ({
+  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/BackspaceFilledIcon.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 BackspaceFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const BackspaceFilledIcon = ({
+  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/BackspaceIcon.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 BackspaceIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const BackspaceIcon = ({
+  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/BasketFilledIcon.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 BasketFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const BasketFilledIcon = ({
+  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/BasketIcon.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 BasketIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const BasketIcon = ({ 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/BellFilledIcon.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 BellFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const BellFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,
@@ -23,7 +31,7 @@ export const BellFilledIcon = ({ alt, className, fill, id, ref, ...props }: Icon
     <svg {...componentProps} ref={ref}>
       {alt ? <title id={uid + "__title"}>{alt}</title> : null}
       <path d="M27 26a1 1 0 0 0 0-2H5a1 1 0 1 0 0 2zM19 27a3 3 0 1 1-6 0zM13 5a3 3 0 1 1 6 0z" />
-      <path d="M16 5a9 9 0 0 1 9 9v11H7V14l.012-.463A9 9 0 0 1 16 5Z" strokeWidth="2" />
+      <path d="M16 5a9 9 0 0 1 9 9v11H7V14l.012-.463A9 9 0 0 1 16 5Z" stroke-width="2" />
     </svg>
   )
 }

package/src/components/icons/BellIcon.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 BellIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const BellIcon = ({ 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/BroomIcon.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 BroomIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const BroomIcon = ({ 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/CalendarFilledIcon.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 CalendarFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CalendarFilledIcon = ({
+  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/CalendarIcon.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 CalendarIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CalendarIcon = ({
+  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/CashFilledIcon.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 CashFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CashFilledIcon = ({
+  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/CashIcon.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 CashIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CashIcon = ({ alt, className, fill, id, ref, ...props }: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,
@@ -24,9 +25,9 @@ export const CashIcon = ({ alt, className, fill, id, ref, ...props }: IconProps)
       {alt ? <title id={uid + "__title"}>{alt}</title> : null}
       <path d="M15.5 13q.352 0 .665.054a1 1 0 0 1-.33 1.972A2 2 0 0 0 15.5 15c-.551 0-.904.162-1.115.367-.206.2-.385.546-.385 1.133v.5h1a1 1 0 1 1 0 2h-1v2h2a1 1 0 1 1 0 2h-4.5a1 1 0 1 1 0-2h.5v-2h-.5a1 1 0 1 1 0-2h.5v-.5c0-1.013.322-1.918.99-2.567.664-.646 1.562-.933 2.51-.933" />
       <path
-        clipRule="evenodd"
+        clip-rule="evenodd"
         d="M28 6a2 2 0 0 1 2 2v12a2 2 0 0 1-1.796 1.99L28 22h-2v2a2 2 0 0 1-1.796 1.99L24 26H4l-.204-.01A2 2 0 0 1 2 24V12a2 2 0 0 1 2-2h2V8a2 2 0 0 1 2-2zM4 24h20V12H4zm4-14h16a2 2 0 0 1 2 2v8h2V8H8z"
-        fillRule="evenodd"
+        fill-rule="evenodd"
       />
     </svg>
   )

package/src/components/icons/ChevronDownIcon.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 ChevronDownIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ChevronDownIcon = ({
+  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/ChevronLeftIcon.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 ChevronLeftIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ChevronLeftIcon = ({
+  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/ChevronRightIcon.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 ChevronRightIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ChevronRightIcon = ({
+  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/ChevronUpIcon.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 ChevronUpIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ChevronUpIcon = ({
+  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/CircleBurgerFilledIcon.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 CircleBurgerFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CircleBurgerFilledIcon = ({
+  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/CircleBurgerIcon.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 CircleBurgerIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CircleBurgerIcon = ({
+  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/ClipboardFilledIcon.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 ClipboardFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ClipboardFilledIcon = ({
+  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/ClipboardIcon.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 ClipboardIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ClipboardIcon = ({
+  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/ClockFilledIcon.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 ClockFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ClockFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,
@@ -23,9 +31,9 @@ export const ClockFilledIcon = ({ alt, className, fill, id, ref, ...props }: Ico
     <svg {...componentProps} ref={ref}>
       {alt ? <title id={uid + "__title"}>{alt}</title> : null}
       <path
-        clipRule="evenodd"
+        clip-rule="evenodd"
         d="M16 30c7.732 0 14-6.268 14-14S23.732 2 16 2 2 8.268 2 16s6.268 14 14 14m0-21a1 1 0 0 0-1 1v6a1 1 0 0 0 .293.707l4 4a1 1 0 1 0 1.414-1.414L17 15.586V10a1 1 0 0 0-1-1"
-        fillRule="evenodd"
+        fill-rule="evenodd"
       />
     </svg>
   )

package/src/components/icons/ClockIcon.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 ClockIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const ClockIcon = ({ 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/CloseAltFilledIcon.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 CloseAltFilledIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CloseAltFilledIcon = ({
+  alt,
+  className,
+  fill,
+  id,
+  ref,
+  ...props
+}: IconProps): JSX.Element => {
   const uid = useId(id)
   const componentProps = {
     "aria-labelledby": alt ? uid + "__title" : undefined,
@@ -23,9 +31,9 @@ export const CloseAltFilledIcon = ({ alt, className, fill, id, ref, ...props }:
     <svg {...componentProps} ref={ref}>
       {alt ? <title id={uid + "__title"}>{alt}</title> : null}
       <path
-        clipRule="evenodd"
+        clip-rule="evenodd"
         d="M16 30c7.732 0 14-6.268 14-14S23.732 2 16 2 2 8.268 2 16s6.268 14 14 14m5.407-19.407a1 1 0 0 0-1.414 0L16 14.586l-3.993-3.993a1 1 0 0 0-1.414 1.414L14.586 16l-3.993 3.993a1 1 0 0 0 1.414 1.414L16 17.414l3.991 3.991a1 1 0 1 0 1.414-1.414l-3.99-3.99 3.992-3.994a1 1 0 0 0 0-1.414"
-        fillRule="evenodd"
+        fill-rule="evenodd"
       />
     </svg>
   )

package/src/components/icons/CloseAltIcon.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 CloseAltIcon = ({ alt, className, fill, id, ref, ...props }: IconProps) => {
+export const CloseAltIcon = ({
+  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/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,