Skip to content

Commit 3382e92

Browse files
Merge pull request #168 from laravel/prettier-print-width
Change Prettier print width from 150 to 80
2 parents 01aaed4 + 75c546a commit 3382e92

Some content is hidden

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

43 files changed

+753
-179
lines changed

.prettierrc

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,15 @@
33
"singleQuote": true,
44
"singleAttributePerLine": false,
55
"htmlWhitespaceSensitivity": "css",
6-
"printWidth": 150,
7-
"plugins": ["prettier-plugin-organize-imports", "prettier-plugin-tailwindcss"],
8-
"tailwindFunctions": ["clsx", "cn"],
6+
"printWidth": 80,
7+
"plugins": [
8+
"prettier-plugin-organize-imports",
9+
"prettier-plugin-tailwindcss"
10+
],
11+
"tailwindFunctions": [
12+
"clsx",
13+
"cn"
14+
],
915
"tailwindStylesheet": "resources/css/app.css",
1016
"tabWidth": 4,
1117
"overrides": [

resources/css/app.css

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,9 @@
99

1010
@theme {
1111
--font-sans:
12-
'Instrument Sans', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
12+
'Instrument Sans', ui-sans-serif, system-ui, sans-serif,
13+
'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
14+
'Noto Color Emoji';
1315

1416
--radius-lg: var(--radius);
1517
--radius-md: calc(var(--radius) - 2px);

resources/js/app.tsx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,12 @@ import { initializeTheme } from './hooks/use-appearance';
88
const appName = import.meta.env.VITE_APP_NAME || 'Laravel';
99

1010
createInertiaApp({
11-
title: (title) => title ? `${title} - ${appName}` : appName,
12-
resolve: (name) => resolvePageComponent(`./pages/${name}.tsx`, import.meta.glob('./pages/**/*.tsx')),
11+
title: (title) => (title ? `${title} - ${appName}` : appName),
12+
resolve: (name) =>
13+
resolvePageComponent(
14+
`./pages/${name}.tsx`,
15+
import.meta.glob('./pages/**/*.tsx'),
16+
),
1317
setup({ el, App, props }) {
1418
const root = createRoot(el);
1519

resources/js/components/app-content.tsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,20 @@ interface AppContentProps extends React.ComponentProps<'main'> {
55
variant?: 'header' | 'sidebar';
66
}
77

8-
export function AppContent({ variant = 'header', children, ...props }: AppContentProps) {
8+
export function AppContent({
9+
variant = 'header',
10+
children,
11+
...props
12+
}: AppContentProps) {
913
if (variant === 'sidebar') {
1014
return <SidebarInset {...props}>{children}</SidebarInset>;
1115
}
1216

1317
return (
14-
<main className="mx-auto flex h-full w-full max-w-7xl flex-1 flex-col gap-4 rounded-xl" {...props}>
18+
<main
19+
className="mx-auto flex h-full w-full max-w-7xl flex-1 flex-col gap-4 rounded-xl"
20+
{...props}
21+
>
1522
{children}
1623
</main>
1724
);

resources/js/components/app-header.tsx

Lines changed: 114 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,30 @@ import { Breadcrumbs } from '@/components/breadcrumbs';
22
import { Icon } from '@/components/icon';
33
import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
44
import { Button } from '@/components/ui/button';
5-
import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger } from '@/components/ui/dropdown-menu';
6-
import { NavigationMenu, NavigationMenuItem, NavigationMenuList, navigationMenuTriggerStyle } from '@/components/ui/navigation-menu';
7-
import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger } from '@/components/ui/sheet';
8-
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
5+
import {
6+
DropdownMenu,
7+
DropdownMenuContent,
8+
DropdownMenuTrigger,
9+
} from '@/components/ui/dropdown-menu';
10+
import {
11+
NavigationMenu,
12+
NavigationMenuItem,
13+
NavigationMenuList,
14+
navigationMenuTriggerStyle,
15+
} from '@/components/ui/navigation-menu';
16+
import {
17+
Sheet,
18+
SheetContent,
19+
SheetHeader,
20+
SheetTitle,
21+
SheetTrigger,
22+
} from '@/components/ui/sheet';
23+
import {
24+
Tooltip,
25+
TooltipContent,
26+
TooltipProvider,
27+
TooltipTrigger,
28+
} from '@/components/ui/tooltip';
929
import { UserMenuContent } from '@/components/user-menu-content';
1030
import { useInitials } from '@/hooks/use-initials';
1131
import { cn } from '@/lib/utils';
@@ -37,7 +57,8 @@ const rightNavItems: NavItem[] = [
3757
},
3858
];
3959

40-
const activeItemStyles = 'text-neutral-900 dark:bg-neutral-800 dark:text-neutral-100';
60+
const activeItemStyles =
61+
'text-neutral-900 dark:bg-neutral-800 dark:text-neutral-100';
4162

4263
interface AppHeaderProps {
4364
breadcrumbs?: BreadcrumbItem[];
@@ -55,21 +76,39 @@ export function AppHeader({ breadcrumbs = [] }: AppHeaderProps) {
5576
<div className="lg:hidden">
5677
<Sheet>
5778
<SheetTrigger asChild>
58-
<Button variant="ghost" size="icon" className="mr-2 h-[34px] w-[34px]">
79+
<Button
80+
variant="ghost"
81+
size="icon"
82+
className="mr-2 h-[34px] w-[34px]"
83+
>
5984
<Menu className="h-5 w-5" />
6085
</Button>
6186
</SheetTrigger>
62-
<SheetContent side="left" className="flex h-full w-64 flex-col items-stretch justify-between bg-sidebar">
63-
<SheetTitle className="sr-only">Navigation Menu</SheetTitle>
87+
<SheetContent
88+
side="left"
89+
className="flex h-full w-64 flex-col items-stretch justify-between bg-sidebar"
90+
>
91+
<SheetTitle className="sr-only">
92+
Navigation Menu
93+
</SheetTitle>
6494
<SheetHeader className="flex justify-start text-left">
6595
<AppLogoIcon className="h-6 w-6 fill-current text-black dark:text-white" />
6696
</SheetHeader>
6797
<div className="flex h-full flex-1 flex-col space-y-4 p-4">
6898
<div className="flex h-full flex-col justify-between text-sm">
6999
<div className="flex flex-col space-y-4">
70100
{mainNavItems.map((item) => (
71-
<Link key={item.title} href={item.href} className="flex items-center space-x-2 font-medium">
72-
{item.icon && <Icon iconNode={item.icon} className="h-5 w-5" />}
101+
<Link
102+
key={item.title}
103+
href={item.href}
104+
className="flex items-center space-x-2 font-medium"
105+
>
106+
{item.icon && (
107+
<Icon
108+
iconNode={item.icon}
109+
className="h-5 w-5"
110+
/>
111+
)}
73112
<span>{item.title}</span>
74113
</Link>
75114
))}
@@ -79,12 +118,22 @@ export function AppHeader({ breadcrumbs = [] }: AppHeaderProps) {
79118
{rightNavItems.map((item) => (
80119
<a
81120
key={item.title}
82-
href={typeof item.href === 'string' ? item.href : item.href.url}
121+
href={
122+
typeof item.href ===
123+
'string'
124+
? item.href
125+
: item.href.url
126+
}
83127
target="_blank"
84128
rel="noopener noreferrer"
85129
className="flex items-center space-x-2 font-medium"
86130
>
87-
{item.icon && <Icon iconNode={item.icon} className="h-5 w-5" />}
131+
{item.icon && (
132+
<Icon
133+
iconNode={item.icon}
134+
className="h-5 w-5"
135+
/>
136+
)}
88137
<span>{item.title}</span>
89138
</a>
90139
))}
@@ -95,7 +144,11 @@ export function AppHeader({ breadcrumbs = [] }: AppHeaderProps) {
95144
</Sheet>
96145
</div>
97146

98-
<Link href={dashboard()} prefetch className="flex items-center space-x-2">
147+
<Link
148+
href={dashboard()}
149+
prefetch
150+
className="flex items-center space-x-2"
151+
>
99152
<AppLogo />
100153
</Link>
101154

@@ -104,16 +157,29 @@ export function AppHeader({ breadcrumbs = [] }: AppHeaderProps) {
104157
<NavigationMenu className="flex h-full items-stretch">
105158
<NavigationMenuList className="flex h-full items-stretch space-x-2">
106159
{mainNavItems.map((item, index) => (
107-
<NavigationMenuItem key={index} className="relative flex h-full items-center">
160+
<NavigationMenuItem
161+
key={index}
162+
className="relative flex h-full items-center"
163+
>
108164
<Link
109165
href={item.href}
110166
className={cn(
111167
navigationMenuTriggerStyle(),
112-
page.url === (typeof item.href === 'string' ? item.href : item.href.url) && activeItemStyles,
168+
page.url ===
169+
(typeof item.href ===
170+
'string'
171+
? item.href
172+
: item.href.url) &&
173+
activeItemStyles,
113174
'h-9 cursor-pointer px-3',
114175
)}
115176
>
116-
{item.icon && <Icon iconNode={item.icon} className="mr-2 h-4 w-4" />}
177+
{item.icon && (
178+
<Icon
179+
iconNode={item.icon}
180+
className="mr-2 h-4 w-4"
181+
/>
182+
)}
117183
{item.title}
118184
</Link>
119185
{page.url === item.href && (
@@ -127,22 +193,41 @@ export function AppHeader({ breadcrumbs = [] }: AppHeaderProps) {
127193

128194
<div className="ml-auto flex items-center space-x-2">
129195
<div className="relative flex items-center space-x-1">
130-
<Button variant="ghost" size="icon" className="group h-9 w-9 cursor-pointer">
196+
<Button
197+
variant="ghost"
198+
size="icon"
199+
className="group h-9 w-9 cursor-pointer"
200+
>
131201
<Search className="!size-5 opacity-80 group-hover:opacity-100" />
132202
</Button>
133203
<div className="hidden lg:flex">
134204
{rightNavItems.map((item) => (
135-
<TooltipProvider key={item.title} delayDuration={0}>
205+
<TooltipProvider
206+
key={item.title}
207+
delayDuration={0}
208+
>
136209
<Tooltip>
137210
<TooltipTrigger>
138211
<a
139-
href={typeof item.href === 'string' ? item.href : item.href.url}
212+
href={
213+
typeof item.href ===
214+
'string'
215+
? item.href
216+
: item.href.url
217+
}
140218
target="_blank"
141219
rel="noopener noreferrer"
142220
className="group ml-1 inline-flex h-9 w-9 items-center justify-center rounded-md bg-transparent p-0 text-sm font-medium text-accent-foreground ring-offset-background transition-colors hover:bg-accent hover:text-accent-foreground focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50"
143221
>
144-
<span className="sr-only">{item.title}</span>
145-
{item.icon && <Icon iconNode={item.icon} className="size-5 opacity-80 group-hover:opacity-100" />}
222+
<span className="sr-only">
223+
{item.title}
224+
</span>
225+
{item.icon && (
226+
<Icon
227+
iconNode={item.icon}
228+
className="size-5 opacity-80 group-hover:opacity-100"
229+
/>
230+
)}
146231
</a>
147232
</TooltipTrigger>
148233
<TooltipContent>
@@ -155,9 +240,15 @@ export function AppHeader({ breadcrumbs = [] }: AppHeaderProps) {
155240
</div>
156241
<DropdownMenu>
157242
<DropdownMenuTrigger asChild>
158-
<Button variant="ghost" className="size-10 rounded-full p-1">
243+
<Button
244+
variant="ghost"
245+
className="size-10 rounded-full p-1"
246+
>
159247
<Avatar className="size-8 overflow-hidden rounded-full">
160-
<AvatarImage src={auth.user.avatar} alt={auth.user.name} />
248+
<AvatarImage
249+
src={auth.user.avatar}
250+
alt={auth.user.name}
251+
/>
161252
<AvatarFallback className="rounded-lg bg-neutral-200 text-black dark:bg-neutral-700 dark:text-white">
162253
{getInitials(auth.user.name)}
163254
</AvatarFallback>

resources/js/components/app-logo.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,9 @@ export default function AppLogo() {
77
<AppLogoIcon className="size-5 fill-current text-white dark:text-black" />
88
</div>
99
<div className="ml-1 grid flex-1 text-left text-sm">
10-
<span className="mb-0.5 truncate leading-tight font-semibold">Laravel Starter Kit</span>
10+
<span className="mb-0.5 truncate leading-tight font-semibold">
11+
Laravel Starter Kit
12+
</span>
1113
</div>
1214
</>
1315
);

resources/js/components/app-shell.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,9 @@ export function AppShell({ children, variant = 'header' }: AppShellProps) {
1111
const isOpen = usePage<SharedData>().props.sidebarOpen;
1212

1313
if (variant === 'header') {
14-
return <div className="flex min-h-screen w-full flex-col">{children}</div>;
14+
return (
15+
<div className="flex min-h-screen w-full flex-col">{children}</div>
16+
);
1517
}
1618

1719
return <SidebarProvider defaultOpen={isOpen}>{children}</SidebarProvider>;

resources/js/components/app-sidebar-header.tsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,11 @@ import { Breadcrumbs } from '@/components/breadcrumbs';
22
import { SidebarTrigger } from '@/components/ui/sidebar';
33
import { type BreadcrumbItem as BreadcrumbItemType } from '@/types';
44

5-
export function AppSidebarHeader({ breadcrumbs = [] }: { breadcrumbs?: BreadcrumbItemType[] }) {
5+
export function AppSidebarHeader({
6+
breadcrumbs = [],
7+
}: {
8+
breadcrumbs?: BreadcrumbItemType[];
9+
}) {
610
return (
711
<header className="flex h-16 shrink-0 items-center gap-2 border-b border-sidebar-border/50 px-6 transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-12 md:px-4">
812
<div className="flex items-center gap-2">

resources/js/components/app-sidebar.tsx

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,15 @@
11
import { NavFooter } from '@/components/nav-footer';
22
import { NavMain } from '@/components/nav-main';
33
import { NavUser } from '@/components/nav-user';
4-
import { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, SidebarMenu, SidebarMenuButton, SidebarMenuItem } from '@/components/ui/sidebar';
4+
import {
5+
Sidebar,
6+
SidebarContent,
7+
SidebarFooter,
8+
SidebarHeader,
9+
SidebarMenu,
10+
SidebarMenuButton,
11+
SidebarMenuItem,
12+
} from '@/components/ui/sidebar';
513
import { dashboard } from '@/routes';
614
import { type NavItem } from '@/types';
715
import { Link } from '@inertiajs/react';

0 commit comments

Comments
 (0)