Merged in fix/strokewidth-warning (pull request #3343)

fix: change to camelCase strokewidth warning

* fix: change to camelCase strokewidth warning


Approved-by: Anton Gunnarsson
Approved-by: Matilda Landström
This commit is contained in:
Bianca Widstam
2025-12-12 11:47:00 +00:00
parent 3e3b15940f
commit ee16d2ef6d
15 changed files with 82 additions and 78 deletions

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function BathroomCabinet2(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -17,7 +17,7 @@ function BathroomCabinet2(props: NucleoIconProps) {
width="17.999"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x="3.001"
y="15"
/>
@@ -25,12 +25,12 @@ function BathroomCabinet2(props: NucleoIconProps) {
d="M9,11a2,2,0,0,1,4,0h0v4"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="7.999"
x2="19.999"
y1="19"
@@ -39,7 +39,7 @@ function BathroomCabinet2(props: NucleoIconProps) {
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="8"
x2="7.999"
y1="15"
@@ -49,7 +49,7 @@ function BathroomCabinet2(props: NucleoIconProps) {
fill="none"
points="5 11 1 11 1 1 23 1 23 11 17 11"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
</g>
</svg>

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function ConferenceRoom(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -17,7 +17,7 @@ function ConferenceRoom(props: NucleoIconProps) {
width="10"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x="7"
y="3"
/>
@@ -33,7 +33,7 @@ function ConferenceRoom(props: NucleoIconProps) {
fill="none"
r="1"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<circle
cx="2"
@@ -41,7 +41,7 @@ function ConferenceRoom(props: NucleoIconProps) {
fill="none"
r="1"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<circle
cx="2"
@@ -49,7 +49,7 @@ function ConferenceRoom(props: NucleoIconProps) {
fill="none"
r="1"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<circle
cx="22"
@@ -57,7 +57,7 @@ function ConferenceRoom(props: NucleoIconProps) {
fill="none"
r="1"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<circle
cx="22"
@@ -65,7 +65,7 @@ function ConferenceRoom(props: NucleoIconProps) {
fill="none"
r="1"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<circle
cx="22"
@@ -73,7 +73,7 @@ function ConferenceRoom(props: NucleoIconProps) {
fill="none"
r="1"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
</g>
</svg>

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function Door2(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -17,7 +17,7 @@ function Door2(props: NucleoIconProps) {
width="16"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x="4"
y="1"
/>
@@ -26,14 +26,14 @@ function Door2(props: NucleoIconProps) {
width="8"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x="8"
y="5"
/>
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="8"
x2="8"
y1="15"

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function Hairdresser1(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -15,7 +15,7 @@ function Hairdresser1(props: NucleoIconProps) {
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="16"
x2="19"
y1="5"
@@ -24,7 +24,7 @@ function Hairdresser1(props: NucleoIconProps) {
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="16"
x2="19"
y1="9"
@@ -33,7 +33,7 @@ function Hairdresser1(props: NucleoIconProps) {
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="12"
x2="6"
y1="1"
@@ -42,7 +42,7 @@ function Hairdresser1(props: NucleoIconProps) {
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="4"
x2="10"
y1="1"
@@ -52,7 +52,7 @@ function Hairdresser1(props: NucleoIconProps) {
d="M16,13h.79a2,2,0,0,1,1.99,2.2L18,23h5V3a2,2,0,0,0-2-2H16"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<rect
height="7"
@@ -60,7 +60,7 @@ function Hairdresser1(props: NucleoIconProps) {
fill="none"
rx="2.5"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x="1"
y="16"
/>
@@ -70,7 +70,7 @@ function Hairdresser1(props: NucleoIconProps) {
fill="none"
rx="2.5"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
transform="translate(25 39) rotate(180)"
x="10"
y="16"

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function RecordPlayer3(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -16,19 +16,19 @@ function RecordPlayer3(props: NucleoIconProps) {
d="M18 9V14L16.5 16"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M2 6L2 18C2 19.1046 2.89543 20 4 20L20 20C21.1046 20 22 19.1046 22 18L22 6C22 4.89543 21.1046 4 20 4L4 4C2.89543 4 2 4.89543 2 6Z"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M10 16C12.2091 16 14 14.2091 14 12C14 9.79086 12.2091 8 10 8C7.79086 8 6 9.79086 6 12C6 14.2091 7.79086 16 10 16Z"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M10 13C10.5523 13 11 12.5523 11 12C11 11.4477 10.5523 11 10 11C9.44772 11 9 11.4477 9 12C9 12.5523 9.44772 13 10 13Z"

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function Toilet2(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -16,18 +16,18 @@ function Toilet2(props: NucleoIconProps) {
d="M6,8V3A2.006,2.006,0,0,1,8,1h8a2.006,2.006,0,0,1,2,2V8"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M21,12H3v2a6.018,6.018,0,0,0,6,6H9v3h6V20h0a6.018,6.018,0,0,0,6-6Z"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="3.1"
x2="20.9"
y1="15"

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function UserPolice2(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -16,31 +16,31 @@ function UserPolice2(props: NucleoIconProps) {
d="m4,22.429l3.549-1.014c.859-.245,1.451-1.03,1.451-1.923v-1.239"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="m20,22.429l-3.549-1.014c-.859-.245-1.451-1.03-1.451-1.923v-1.239"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="m18.473,8.408c.091.509.124,1.038.09,1.578l-.189,3.025c-.21,3.366-3.002,5.988-6.374,5.988h0c-3.373,0-6.164-2.622-6.374-5.988l-.189-3.025c-.034-.541-.001-1.069.09-1.579"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="m12,12c-6.406,0-6.576-4-6.576-4h13.153s-.17,4-6.576,4Z"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="m18.576,8l1.495-3.109c.238-.494.039-1.098-.456-1.334-2.349-1.12-4.885-1.893-7.616-2.307-2.73.414-5.267,1.187-7.616,2.307-.495.236-.693.84-.456,1.334l1.495,3.109"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<circle cx="12" cy="4.75" fill={fill} r="1.5" strokeWidth="0" />
</g>

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function Bouquet(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -16,31 +16,31 @@ function Bouquet(props: NucleoIconProps) {
d="M20.45,11.5a1.707,1.707,0,0,0-2.415,0,1.706,1.706,0,0,1-2.414,0,1.706,1.706,0,0,0-2.414,0,1.706,1.706,0,0,1-2.414,0,1.706,1.706,0,0,0-2.414,0,1.706,1.706,0,0,1-2.414,0,1.707,1.707,0,0,0-2.415,0L10,19h4Z"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M11.378,2.877A6.631,6.631,0,0,1,16,1V4A4,4,0,0,1,8,4V1a4,4,0,0,1,4,4"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M6,8a2.528,2.528,0,0,1,.5-5H8"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M18,8a2.528,2.528,0,0,0-.5-5H16"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<polyline
fill="none"
points="10 19 9 23 15 23 14 19"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
</g>
</svg>

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function Discount22(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -16,12 +16,12 @@ function Discount22(props: NucleoIconProps) {
fill="none"
points="19,15 22,12 19,9 19,5 15,5 12,2 9,5 5,5 5,9 2,12 5,15 5,19 9,19 12,22 15,19 19,19 "
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="15"
x2="9"
y1="9"

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function BowlingPins(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -16,13 +16,13 @@ function BowlingPins(props: NucleoIconProps) {
d="M18.575,23A13.8,13.8,0,0,0,20,16.5c0-4-2-6-2-9,0-2.5.5-2.5.5-4a2.5,2.5,0,0,0-5,0c0,1.5.5,1.5.5,4,0,3-2,5-2,9A13.8,13.8,0,0,0,13.425,23Z"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M9.952,11.247a7.883,7.883,0,0,1-.7-2.929c0-2.045.438-2.045.438-3.273A2.121,2.121,0,0,0,7.5,3,2.121,2.121,0,0,0,5.312,5.045c0,1.228.438,1.228.438,3.273C5.75,10.773,4,12.409,4,15.682A10.7,10.7,0,0,0,5.247,21H10"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
</g>
</svg>

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function PalmTree2(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -16,36 +16,36 @@ function PalmTree2(props: NucleoIconProps) {
d="M11.4,23a21.14,21.14,0,0,0,1.594-8.059A21.111,21.111,0,0,0,11,6"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M4,15l7-9C6,6,2,9,4,15Z"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M21,12,11,6S20,2,21,12Z"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M11,6,3,5S7-1,11,6Z"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M11,6l9-3S11.971-2.161,11,6Z"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="1"
x2="23"
y1="23"

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function Chips3(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -16,24 +16,24 @@ function Chips3(props: NucleoIconProps) {
fill="none"
points="4,9 4,3 8,3 "
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<polyline
fill="none"
points="16,9 16,2 20,2 20,9 "
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<polyline
fill="none"
points="8,9 8,1 12,1 12,9 "
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="12"
x2="16"
y1="5"
@@ -43,7 +43,7 @@ function Chips3(props: NucleoIconProps) {
fill="none"
points="19,23 5,23 2,9 22,9 "
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<circle
cx="12"
@@ -51,7 +51,7 @@ function Chips3(props: NucleoIconProps) {
fill="none"
r="3"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
</g>
</svg>

View File

@@ -2,7 +2,7 @@ import type { NucleoIconProps } from '../../icon'
import { getNucleoIconProps } from '../utils'
function Popcorn2(props: NucleoIconProps) {
const { fill, strokewidth, ...iconProps } = getNucleoIconProps(props)
const { fill, strokeWidth, ...iconProps } = getNucleoIconProps(props)
return (
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...iconProps}>
@@ -16,18 +16,18 @@ function Popcorn2(props: NucleoIconProps) {
fill="none"
points="21 7 3 7 5 23 19 23 21 7"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<path
d="M19,5a3,3,0,0,0-3-3,2.97,2.97,0,0,0-1.47.4,2.986,2.986,0,0,0-5.06,0A2.97,2.97,0,0,0,8,2,3,3,0,0,0,5,5"
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
/>
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="9"
x2="8"
y1="23"
@@ -36,7 +36,7 @@ function Popcorn2(props: NucleoIconProps) {
<line
fill="none"
stroke={fill}
strokeWidth={strokewidth}
strokeWidth={strokeWidth}
x1="15"
x2="16"
y1="23"

View File

@@ -4,10 +4,10 @@ import { colorVariants } from './colorVariants'
export function getNucleoIconProps(props: NucleoIconProps) {
const fill = props.color ? colorVariants[props.color] : 'currentColor'
const strokewidth = props.strokewidth || 2
const strokeWidth = props.strokeWidth || 2
const width = props.size || '1em'
const height = props.size || '1em'
const ariaProps = getIconAriaProps(props)
return { fill, strokewidth, width, height, ...ariaProps }
return { fill, strokeWidth, width, height, ...ariaProps }
}

View File

@@ -2,24 +2,28 @@ import type { VariantProps } from 'class-variance-authority'
import { iconVariants } from './variants'
export interface IconProps
extends Omit<React.SVGAttributes<HTMLOrSVGElement>, 'color'>,
extends
Omit<React.SVGAttributes<HTMLOrSVGElement>, 'color'>,
VariantProps<typeof iconVariants> {
size?: number
}
export interface IllustrationProps
extends Omit<React.SVGAttributes<HTMLOrSVGElement>, 'color'>,
extends
Omit<React.SVGAttributes<HTMLOrSVGElement>, 'color'>,
Omit<VariantProps<typeof iconVariants>, 'color'> {
width?: string | number
height?: string | number
}
export interface LogoProps
extends Omit<React.SVGAttributes<HTMLOrSVGElement>, 'color'> {
export interface LogoProps extends Omit<
React.SVGAttributes<HTMLOrSVGElement>,
'color'
> {
width?: string | number
height?: string | number
}
export interface NucleoIconProps extends IconProps {
strokewidth?: number
strokeWidth?: number | string
}