Skip to content

Commit 0eaab06

Browse files
chore: fix eslint warnings and errors
1 parent be98998 commit 0eaab06

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

63 files changed

+2841
-171
lines changed

Diff for: .eslintrc.json

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": ["next/core-web-vitals", "next/typescript"]
3+
}

Diff for: app/easings/easings.tsx

+3-4
Original file line numberDiff line numberDiff line change
@@ -265,8 +265,7 @@ const AnimatedSquare = ({
265265
export default function Easings({ easings }: EasingsProps) {
266266
const [duration, setDuration] = useState(defaultConfig.animationDuration);
267267
const [tempDuration, setTempDuration] = useState(defaultConfig.animationDuration);
268-
const [pauseDuration, setPauseDuration] = useState(defaultConfig.pauseDuration);
269-
const [tempPauseDuration, setTempPauseDuration] = useState(defaultConfig.pauseDuration);
268+
const pauseDuration = defaultConfig.pauseDuration;
270269
const [animationType, setAnimationType] = useState<AnimationType>("translate");
271270
const [easingFilter, setEasingFilter] = useState<EasingFilter>("all");
272271

@@ -431,8 +430,8 @@ export default function Easings({ easings }: EasingsProps) {
431430
<code className="font-mono text-[13px] text-foreground">
432431
ease-&#91;cubic-bezier(...)&#93;
433432
</code>{" "}
434-
as recommended in the Tailwind CSS documentation, because the latter won't work with the
435-
tailwindcss-animate plugin. See{" "}
433+
as recommended in the Tailwind CSS documentation, because the latter won&lsquo;t work
434+
with the tailwindcss-animate plugin. See{" "}
436435
<a
437436
href="https://github.com/jamiebuilds/tailwindcss-animate/pull/46"
438437
className="underline hover:no-underline"

Diff for: app/inputs/page.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -101,8 +101,8 @@ export default function Page() {
101101
<div className="px-4 sm:px-6">
102102
<div className="mx-auto w-full max-w-6xl">
103103
<PageHeader title="Input and Textarea">
104-
A growing collection of {files.length} input and textarea components built with Next.js and
105-
TailwindCSS.
104+
A growing collection of {files.length} input and textarea components built with Next.js
105+
and TailwindCSS.
106106
</PageHeader>
107107

108108
<div className="grid max-w-6xl grid-cols-1 overflow-hidden sm:grid-cols-2 lg:grid-cols-3 [&>*]:relative [&>*]:px-1 [&>*]:py-12 [&>*]:before:absolute [&>*]:before:bg-border/70 [&>*]:before:[block-size:100vh] [&>*]:before:[inline-size:1px] [&>*]:before:[inset-block-start:0] [&>*]:before:[inset-inline-start:-1px] [&>*]:after:absolute [&>*]:after:bg-border/70 [&>*]:after:[block-size:1px] [&>*]:after:[inline-size:100vw] [&>*]:after:[inset-block-start:-1px] [&>*]:after:[inset-inline-start:0] sm:[&>*]:px-8 xl:[&>*]:px-12">

Diff for: app/page.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,8 @@ export default function Page() {
3838
</h1>
3939
<p className="text-lg text-muted-foreground">
4040
Origin UI is an extensive collection of copy-and-paste components for quickly
41-
building app UIs. It's free, open-source, and ready to drop into your projects.
41+
building app UIs. It&lsquo;s free, open-source, and ready to drop into your
42+
projects.
4243
</p>
4344
</div>
4445

Diff for: components/buttons/button-48.tsx

+7-3
Original file line numberDiff line numberDiff line change
@@ -29,18 +29,22 @@ export default function Button48() {
2929
}, []);
3030

3131
const handleRemove = useCallback(() => {
32-
previewUrl && URL.revokeObjectURL(previewUrl);
32+
if (previewUrl) {
33+
URL.revokeObjectURL(previewUrl);
34+
}
3335
setFileName(null);
3436
setPreviewUrl(null);
3537
previewRef.current = null;
3638
if (fileInputRef.current) {
3739
fileInputRef.current.value = "";
3840
}
39-
}, []);
41+
}, [previewUrl]);
4042

4143
useEffect(() => {
4244
return () => {
43-
previewRef.current && URL.revokeObjectURL(previewRef.current);
45+
if (previewRef.current) {
46+
URL.revokeObjectURL(previewRef.current);
47+
}
4448
};
4549
}, []);
4650

Diff for: components/buttons/button-49.tsx

+7-3
Original file line numberDiff line numberDiff line change
@@ -29,18 +29,22 @@ export default function Button49() {
2929
}, []);
3030

3131
const handleRemove = useCallback(() => {
32-
previewUrl && URL.revokeObjectURL(previewUrl);
32+
if (previewUrl) {
33+
URL.revokeObjectURL(previewUrl);
34+
}
3335
setFileName(null);
3436
setPreviewUrl(null);
3537
previewRef.current = null;
3638
if (fileInputRef.current) {
3739
fileInputRef.current.value = "";
3840
}
39-
}, []);
41+
}, [previewUrl]);
4042

4143
useEffect(() => {
4244
return () => {
43-
previewRef.current && URL.revokeObjectURL(previewRef.current);
45+
if (previewRef.current) {
46+
URL.revokeObjectURL(previewRef.current);
47+
}
4448
};
4549
}, []);
4650

Diff for: components/checkbox-tree.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/**
22
* IMPORTANT: This component was built for demo purposes only and has not been tested in production.
33
* It serves as a proof of concept for a checkbox tree implementation.
4-
* If you're interested in collaborating to create a more robust, production-ready
4+
* If you&lsquo;re interested in collaborating to create a more robust, production-ready
55
* headless component, your contributions are welcome!
66
*/
77

Diff for: components/checkboxes/checkbox-18.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export default function Checkbox18() {
1818
{items.map((item) => (
1919
<label
2020
key={item.id}
21-
className="relative flex size-9 cursor-pointer flex-col items-center justify-center gap-3 rounded-full border border-input text-center shadow-sm shadow-black/5 transition-colors has-[[data-disabled]]:cursor-not-allowed has-[[data-state=checked]]:border-primary has-[[data-state=checked]]:bg-primary has-[[data-state=checked]]:text-primary-foreground has-[[data-disabled]]:opacity-50 outline-offset-2 has-[:focus-visible]:outline has-[:focus-visible]:outline-2 has-[:focus-visible]:outline-ring/70"
21+
className="relative flex size-9 cursor-pointer flex-col items-center justify-center gap-3 rounded-full border border-input text-center shadow-sm shadow-black/5 outline-offset-2 transition-colors has-[[data-disabled]]:cursor-not-allowed has-[[data-state=checked]]:border-primary has-[[data-state=checked]]:bg-primary has-[[data-state=checked]]:text-primary-foreground has-[[data-disabled]]:opacity-50 has-[:focus-visible]:outline has-[:focus-visible]:outline-2 has-[:focus-visible]:outline-ring/70"
2222
>
2323
<Checkbox
2424
id={item.id}

Diff for: components/inputs/input-03.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ export default function Input03() {
77
<Label htmlFor="input-03">Input with helper text</Label>
88
<Input id="input-03" placeholder="Email" type="email" />
99
<p className="mt-2 text-xs text-muted-foreground" role="region" aria-live="polite">
10-
We won't share your email with anyone
10+
We won&lsquo;t share your email with anyone
1111
</p>
1212
</div>
1313
);

Diff for: components/inputs/input-17.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ export default function Input17() {
1111
<div className="flex rounded-lg shadow-sm shadow-black/5">
1212
<div className="relative">
1313
<select
14-
className="peer inline-flex h-full appearance-none items-center rounded-none rounded-s-lg border border-input bg-background pe-8 ps-3 text-sm text-muted-foreground transition-shadow hover:bg-accent hover:text-accent-foreground focus:z-10 focus-visible:text-foreground focus-visible:border-ring focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/20 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
14+
className="peer inline-flex h-full appearance-none items-center rounded-none rounded-s-lg border border-input bg-background pe-8 ps-3 text-sm text-muted-foreground transition-shadow hover:bg-accent hover:text-accent-foreground focus:z-10 focus-visible:border-ring focus-visible:text-foreground focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/20 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
1515
aria-label="Protocol"
1616
>
1717
<option value="https://">https://</option>

Diff for: components/inputs/input-18.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export default function Input18() {
1717
/>
1818
<div className="relative inline-flex">
1919
<select
20-
className="peer inline-flex h-full appearance-none items-center rounded-none rounded-e-lg border border-input bg-background pe-8 ps-3 text-sm text-muted-foreground transition-shadow hover:bg-accent hover:text-accent-foreground focus:z-10 focus-visible:text-foreground focus-visible:border-ring focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/20 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
20+
className="peer inline-flex h-full appearance-none items-center rounded-none rounded-e-lg border border-input bg-background pe-8 ps-3 text-sm text-muted-foreground transition-shadow hover:bg-accent hover:text-accent-foreground focus:z-10 focus-visible:border-ring focus-visible:text-foreground focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/20 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
2121
aria-label="Domain suffix"
2222
>
2323
<option>.com</option>

Diff for: components/inputs/input-19.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ export default function Input19() {
1111
<div className="relative">
1212
<Input id="input-19" className="pe-9" placeholder="Email" type="email" />
1313
<button
14-
className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg border border-transparent text-muted-foreground/80 transition-colors hover:text-foreground focus-visible:outline outline-offset-2 focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
14+
className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg border border-transparent text-muted-foreground/80 outline-offset-2 transition-colors hover:text-foreground focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
1515
aria-label="Subscribe"
1616
>
1717
<Send size={16} strokeWidth={2} aria-hidden="true" />

Diff for: components/inputs/input-20.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ export default function Input20() {
1616
type="email"
1717
/>
1818
<button
19-
className="inline-flex w-9 items-center justify-center rounded-e-lg border border-input bg-background text-sm text-muted-foreground/80 transition-colors hover:bg-accent hover:text-accent-foreground focus:z-10 focus-visible:outline outline-offset-2 focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
19+
className="inline-flex w-9 items-center justify-center rounded-e-lg border border-input bg-background text-sm text-muted-foreground/80 outline-offset-2 transition-colors hover:bg-accent hover:text-accent-foreground focus:z-10 focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
2020
aria-label="Subscribe"
2121
>
2222
<Download size={16} strokeWidth={2} aria-hidden="true" />

Diff for: components/inputs/input-21.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export default function Input21() {
1212
placeholder="Email"
1313
type="email"
1414
/>
15-
<button className="inline-flex items-center rounded-e-lg border border-input bg-background px-3 text-sm font-medium text-foreground transition-colors hover:bg-accent hover:text-foreground focus:z-10 focus-visible:outline outline-offset-2 focus-visible:outline-2 focus-visible:outline-ring/70 disabled:cursor-not-allowed disabled:opacity-50">
15+
<button className="inline-flex items-center rounded-e-lg border border-input bg-background px-3 text-sm font-medium text-foreground outline-offset-2 transition-colors hover:bg-accent hover:text-foreground focus:z-10 focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring/70 disabled:cursor-not-allowed disabled:opacity-50">
1616
Send
1717
</button>
1818
</div>

Diff for: components/inputs/input-23.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ export default function Input23() {
2323
type={isVisible ? "text" : "password"}
2424
/>
2525
<button
26-
className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg text-muted-foreground/80 transition-colors hover:text-foreground focus:z-10 focus-visible:outline outline-offset-2 focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
26+
className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg text-muted-foreground/80 outline-offset-2 transition-colors hover:text-foreground focus:z-10 focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
2727
type="button"
2828
onClick={toggleVisibility}
2929
aria-label={isVisible ? "Hide password" : "Show password"}

Diff for: components/inputs/input-24.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ export default function Input24() {
3333
/>
3434
{inputValue && (
3535
<button
36-
className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg text-muted-foreground/80 transition-colors hover:text-foreground focus:z-10 focus-visible:outline outline-offset-2 focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
36+
className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg text-muted-foreground/80 outline-offset-2 transition-colors hover:text-foreground focus:z-10 focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
3737
aria-label="Clear input"
3838
onClick={handleClearInput}
3939
>

Diff for: components/inputs/input-26.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export default function Input26() {
1414
<Search size={16} strokeWidth={2} />
1515
</div>
1616
<button
17-
className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg text-muted-foreground/80 transition-colors hover:text-foreground focus:z-10 focus-visible:outline outline-offset-2 focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
17+
className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg text-muted-foreground/80 outline-offset-2 transition-colors hover:text-foreground focus:z-10 focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
1818
aria-label="Submit search"
1919
type="submit"
2020
>

Diff for: components/inputs/input-27.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ export default function Input27() {
4747
)}
4848
</div>
4949
<button
50-
className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg text-muted-foreground/80 transition-colors hover:text-foreground focus:z-10 focus-visible:outline outline-offset-2 focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
50+
className="absolute inset-y-0 end-0 flex h-full w-9 items-center justify-center rounded-e-lg text-muted-foreground/80 outline-offset-2 transition-colors hover:text-foreground focus:z-10 focus-visible:outline focus-visible:outline-2 focus-visible:outline-ring/70 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"
5151
aria-label="Press to speak"
5252
type="submit"
5353
>

Diff for: components/inputs/input-28.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export default function Input28() {
1212
<Label className="text-sm font-medium text-foreground">
1313
Number input with plus/minus buttons
1414
</Label>
15-
<Group className="relative inline-flex h-9 w-full items-center overflow-hidden whitespace-nowrap rounded-lg border border-input text-sm shadow-sm shadow-black/5 transition-shadow data-[focus-within]:border-ring data-[focus-within]:outline-none data-[focus-within]:ring-[3px] data-[focus-within]:ring-ring/20 data-[disabled]:opacity-50">
15+
<Group className="relative inline-flex h-9 w-full items-center overflow-hidden whitespace-nowrap rounded-lg border border-input text-sm shadow-sm shadow-black/5 transition-shadow data-[focus-within]:border-ring data-[disabled]:opacity-50 data-[focus-within]:outline-none data-[focus-within]:ring-[3px] data-[focus-within]:ring-ring/20">
1616
<Button
1717
slot="decrement"
1818
className="-ms-px flex aspect-square h-[inherit] items-center justify-center rounded-s-lg border border-input bg-background text-sm text-muted-foreground/80 transition-shadow hover:bg-accent hover:text-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50"

Diff for: components/inputs/input-29.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export default function Input29() {
1717
>
1818
<div className="space-y-2">
1919
<Label className="text-sm font-medium text-foreground">Number input with chevrons</Label>
20-
<Group className="relative inline-flex h-9 w-full items-center overflow-hidden whitespace-nowrap rounded-lg border border-input text-sm shadow-sm shadow-black/5 transition-shadow data-[focus-within]:border-ring data-[focus-within]:outline-none data-[focus-within]:ring-[3px] data-[focus-within]:ring-ring/20 data-[disabled]:opacity-50">
20+
<Group className="relative inline-flex h-9 w-full items-center overflow-hidden whitespace-nowrap rounded-lg border border-input text-sm shadow-sm shadow-black/5 transition-shadow data-[focus-within]:border-ring data-[disabled]:opacity-50 data-[focus-within]:outline-none data-[focus-within]:ring-[3px] data-[focus-within]:ring-ring/20">
2121
<Input className="flex-1 bg-background px-3 py-2 tabular-nums text-foreground focus:outline-none" />
2222
<div className="flex h-[calc(100%+2px)] flex-col">
2323
<Button

Diff for: components/inputs/input-36.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ export default function Input36() {
88
return (
99
<DateField className="space-y-2">
1010
<Label className="text-sm font-medium text-foreground">Date input</Label>
11-
<DateInput className="relative inline-flex h-9 w-full items-center overflow-hidden whitespace-nowrap rounded-lg border border-input bg-background px-3 py-2 text-sm shadow-sm shadow-black/5 transition-shadow data-[focus-within]:border-ring data-[focus-within]:outline-none data-[focus-within]:ring-[3px] data-[focus-within]:ring-ring/20 data-[disabled]:opacity-50">
11+
<DateInput className="relative inline-flex h-9 w-full items-center overflow-hidden whitespace-nowrap rounded-lg border border-input bg-background px-3 py-2 text-sm shadow-sm shadow-black/5 transition-shadow data-[focus-within]:border-ring data-[disabled]:opacity-50 data-[focus-within]:outline-none data-[focus-within]:ring-[3px] data-[focus-within]:ring-ring/20">
1212
{(segment) => (
1313
<DateSegment
1414
segment={segment}

Diff for: components/inputs/input-37.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ export default function Input37() {
88
return (
99
<TimeField className="space-y-2">
1010
<Label className="text-sm font-medium text-foreground">Time input</Label>
11-
<DateInput className="relative inline-flex h-9 w-full items-center overflow-hidden whitespace-nowrap rounded-lg border border-input bg-background px-3 py-2 text-sm shadow-sm shadow-black/5 transition-shadow data-[focus-within]:border-ring data-[focus-within]:outline-none data-[focus-within]:ring-[3px] data-[focus-within]:ring-ring/20 data-[disabled]:opacity-50">
11+
<DateInput className="relative inline-flex h-9 w-full items-center overflow-hidden whitespace-nowrap rounded-lg border border-input bg-background px-3 py-2 text-sm shadow-sm shadow-black/5 transition-shadow data-[focus-within]:border-ring data-[disabled]:opacity-50 data-[focus-within]:outline-none data-[focus-within]:ring-[3px] data-[focus-within]:ring-ring/20">
1212
{(segment) => (
1313
<DateSegment
1414
segment={segment}

0 commit comments

Comments
 (0)