Skip to content

Commit cf2ac0c

Browse files
lsagetlethiaslsagetlethias
committed
chore: avoid multiline types
1 parent 8ae53c6 commit cf2ac0c

File tree

1 file changed

+117
-110
lines changed

1 file changed

+117
-110
lines changed

‎src/Tag.tsx‎

Lines changed: 117 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -98,122 +98,129 @@ export namespace TagProps {
9898

9999
/** @see <https://components.react-dsfr.codegouv.studio/?path=/docs/components-tag> */
100100
export const Tag = memo(
101-
forwardRef<TagProps.HTMLElement, TagProps>((props, ref) => {
102-
const {
103-
id: id_props,
104-
className: prop_className,
105-
children,
106-
title,
107-
iconId,
108-
small = false,
109-
pressed,
110-
dismissible = false,
111-
linkProps,
112-
nativeButtonProps,
113-
nativeParagraphProps,
114-
nativeSpanProps,
115-
style,
116-
onClick,
117-
as: AsTag = "p",
118-
...rest
119-
} = props;
101+
forwardRef<TagProps.HTMLElement, TagProps>(
102+
// -- (lint hack) to keep same indent as before
103+
(props, ref) => {
104+
const {
105+
id: id_props,
106+
className: prop_className,
107+
children,
108+
title,
109+
iconId,
110+
small = false,
111+
pressed,
112+
dismissible = false,
113+
linkProps,
114+
nativeButtonProps,
115+
nativeParagraphProps,
116+
nativeSpanProps,
117+
style,
118+
onClick,
119+
as: AsTag = "p",
120+
...rest
121+
} = props;
120122

121-
assert<Equals<keyof typeof rest, never>>();
123+
assert<Equals<keyof typeof rest, never>>();
122124

123-
const id = useAnalyticsId({
124-
"defaultIdPrefix": "fr-tag",
125-
"explicitlyProvidedId": id_props
126-
});
125+
const id = useAnalyticsId({
126+
"defaultIdPrefix": "fr-tag",
127+
"explicitlyProvidedId": id_props
128+
});
127129

128-
const { Link } = getLink();
130+
const { Link } = getLink();
129131

130-
const className = cx(
131-
fr.cx(
132-
"fr-tag",
133-
small && `fr-tag--sm`,
134-
iconId,
135-
iconId && "fr-tag--icon-left", // actually, it's always left but we need it in order to have the icon rendering
136-
dismissible && "fr-tag--dismiss"
137-
),
138-
linkProps !== undefined && linkProps.className,
139-
prop_className
140-
);
132+
const className = cx(
133+
fr.cx(
134+
"fr-tag",
135+
small && `fr-tag--sm`,
136+
iconId,
137+
iconId && "fr-tag--icon-left", // actually, it's always left but we need it in order to have the icon rendering
138+
dismissible && "fr-tag--dismiss"
139+
),
140+
linkProps !== undefined && linkProps.className,
141+
prop_className
142+
);
141143

142-
// to support old usage
143-
const nativeParagraphOrSpanProps = nativeParagraphProps ?? nativeSpanProps;
144+
// to support old usage
145+
const nativeParagraphOrSpanProps = nativeParagraphProps ?? nativeSpanProps;
144146

145-
return (
146-
<>
147-
{linkProps !== undefined && (
148-
<Link
149-
{...linkProps}
150-
id={id_props ?? linkProps.id ?? id}
151-
title={title ?? linkProps.title}
152-
className={cx(linkProps?.className, className)}
153-
style={{
154-
...linkProps?.style,
155-
...style
156-
}}
157-
ref={ref as React.ForwardedRef<HTMLAnchorElement>}
158-
{...rest}
159-
>
160-
{children}
161-
</Link>
162-
)}
163-
{nativeButtonProps !== undefined && (
164-
<button
165-
{...nativeButtonProps}
166-
id={id_props ?? nativeButtonProps.id ?? id}
167-
className={cx(nativeButtonProps?.className, className)}
168-
style={{
169-
...nativeButtonProps?.style,
170-
...style
171-
}}
172-
title={title ?? nativeButtonProps?.title}
173-
onClick={onClick ?? nativeButtonProps?.onClick}
174-
disabled={nativeButtonProps?.disabled}
175-
ref={ref as React.ForwardedRef<HTMLButtonElement>}
176-
aria-pressed={pressed}
177-
{...rest}
178-
>
179-
{children}
180-
</button>
181-
)}
182-
{linkProps === undefined && nativeButtonProps === undefined && AsTag === "p" && (
183-
<p
184-
{...nativeParagraphOrSpanProps}
185-
id={id_props ?? nativeParagraphOrSpanProps?.id ?? id}
186-
className={cx(nativeParagraphOrSpanProps?.className, className)}
187-
style={{
188-
...nativeParagraphOrSpanProps?.style,
189-
...style
190-
}}
191-
title={title ?? nativeParagraphOrSpanProps?.title}
192-
ref={ref as React.ForwardedRef<HTMLParagraphElement>}
193-
{...rest}
194-
>
195-
{children}
196-
</p>
197-
)}
198-
{linkProps === undefined && nativeButtonProps === undefined && AsTag === "span" && (
199-
<span
200-
{...nativeParagraphOrSpanProps}
201-
id={id_props ?? nativeParagraphOrSpanProps?.id ?? id}
202-
className={cx(nativeParagraphOrSpanProps?.className, className)}
203-
style={{
204-
...nativeParagraphOrSpanProps?.style,
205-
...style
206-
}}
207-
title={title ?? nativeParagraphOrSpanProps?.title}
208-
ref={ref as React.ForwardedRef<HTMLSpanElement>}
209-
{...rest}
210-
>
211-
{children}
212-
</span>
213-
)}
214-
</>
215-
);
216-
})
147+
return (
148+
<>
149+
{linkProps !== undefined && (
150+
<Link
151+
{...linkProps}
152+
id={id_props ?? linkProps.id ?? id}
153+
title={title ?? linkProps.title}
154+
className={cx(linkProps?.className, className)}
155+
style={{
156+
...linkProps?.style,
157+
...style
158+
}}
159+
ref={ref as React.ForwardedRef<HTMLAnchorElement>}
160+
{...rest}
161+
>
162+
{children}
163+
</Link>
164+
)}
165+
{nativeButtonProps !== undefined && (
166+
<button
167+
{...nativeButtonProps}
168+
id={id_props ?? nativeButtonProps.id ?? id}
169+
className={cx(nativeButtonProps?.className, className)}
170+
style={{
171+
...nativeButtonProps?.style,
172+
...style
173+
}}
174+
title={title ?? nativeButtonProps?.title}
175+
onClick={onClick ?? nativeButtonProps?.onClick}
176+
disabled={nativeButtonProps?.disabled}
177+
ref={ref as React.ForwardedRef<HTMLButtonElement>}
178+
aria-pressed={pressed}
179+
{...rest}
180+
>
181+
{children}
182+
</button>
183+
)}
184+
{linkProps === undefined &&
185+
nativeButtonProps === undefined &&
186+
AsTag === "p" && (
187+
<p
188+
{...nativeParagraphOrSpanProps}
189+
id={id_props ?? nativeParagraphOrSpanProps?.id ?? id}
190+
className={cx(nativeParagraphOrSpanProps?.className, className)}
191+
style={{
192+
...nativeParagraphOrSpanProps?.style,
193+
...style
194+
}}
195+
title={title ?? nativeParagraphOrSpanProps?.title}
196+
ref={ref as React.ForwardedRef<HTMLParagraphElement>}
197+
{...rest}
198+
>
199+
{children}
200+
</p>
201+
)}
202+
{linkProps === undefined &&
203+
nativeButtonProps === undefined &&
204+
AsTag === "span" && (
205+
<span
206+
{...nativeParagraphOrSpanProps}
207+
id={id_props ?? nativeParagraphOrSpanProps?.id ?? id}
208+
className={cx(nativeParagraphOrSpanProps?.className, className)}
209+
style={{
210+
...nativeParagraphOrSpanProps?.style,
211+
...style
212+
}}
213+
title={title ?? nativeParagraphOrSpanProps?.title}
214+
ref={ref as React.ForwardedRef<HTMLSpanElement>}
215+
{...rest}
216+
>
217+
{children}
218+
</span>
219+
)}
220+
</>
221+
);
222+
}
223+
)
217224
) as MemoExoticComponent<
218225
ForwardRefExoticComponent<
219226
TagProps.Common &

0 commit comments

Comments
 (0)