diff --git a/CHANGELOG.md b/CHANGELOG.md index c2792c7..5a9ee7a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,11 +1,24 @@ -## [1.0.34](https://github.com/justdlabs/inertia.ts/compare/1.0.33...1.0.34) (2024-10-17) +## [1.1.1](https://github.com/justdlabs/inertia.ts/compare/1.1.0...1.1.1) (2024-10-22) + +## [1.1.0](https://github.com/justdlabs/inertia.ts/compare/1.0.34...1.1.0) (2024-10-22) + + +### Features + +* sync justd ([5ccf885](https://github.com/justdlabs/inertia.ts/commit/5ccf885ca9f09e85e004acc07b006a7b500c1c7c)) ### Bug Fixes -* add flash message to page props ([5693438](https://github.com/justdlabs/inertia.ts/commit/5693438f098252f157fc3edc8f8d285e7a7fe479)) +* bump ([9cd9ba5](https://github.com/justdlabs/inertia.ts/commit/9cd9ba563d2107e603e2f68e46aa120a7a02454b)) + +## [1.0.34](https://github.com/justdlabs/inertia.ts/compare/1.0.33...1.0.34) (2024-10-17) + +### Bug Fixes + +- add flash message to page props ([5693438](https://github.com/justdlabs/inertia.ts/commit/5693438f098252f157fc3edc8f8d285e7a7fe479)) ## [1.0.33](https://github.com/justdlabs/inertia.ts/compare/1.0.32...1.0.33) (2024-10-17) diff --git a/composer.json b/composer.json index f3f4a7a..6d95f7b 100644 --- a/composer.json +++ b/composer.json @@ -1,6 +1,6 @@ { "name": "justd/laravel", - "version": "1.0.34", + "version": "1.1.1", "type": "project", "description": "The skeleton application for the Laravel framework.", "keywords": [ diff --git a/composer.lock b/composer.lock index d37579f..299b2e6 100644 --- a/composer.lock +++ b/composer.lock @@ -4,7 +4,7 @@ "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies", "This file is @generated automatically" ], - "content-hash": "5eab4b8656f9f39e4e7ae7a2d0e00818", + "content-hash": "c8fb1386c8be35eb1505c869d23dee1a", "packages": [ { "name": "amphp/amp", @@ -6746,16 +6746,16 @@ }, { "name": "tightenco/ziggy", - "version": "v2.3.0", + "version": "v2.3.1", "source": { "type": "git", "url": "https://github.com/tighten/ziggy.git", - "reference": "5395ba7c6d6ea1709acf5435694c4732c2912b5e" + "reference": "ab39cd9647c3fbe2efc04407e078dfc4ff212ad1" }, "dist": { "type": "zip", - "url": "https://api.github.com/repos/tighten/ziggy/zipball/5395ba7c6d6ea1709acf5435694c4732c2912b5e", - "reference": "5395ba7c6d6ea1709acf5435694c4732c2912b5e", + "url": "https://api.github.com/repos/tighten/ziggy/zipball/ab39cd9647c3fbe2efc04407e078dfc4ff212ad1", + "reference": "ab39cd9647c3fbe2efc04407e078dfc4ff212ad1", "shasum": "" }, "require": { @@ -6801,9 +6801,9 @@ "keywords": ["Ziggy", "javascript", "laravel", "routes"], "support": { "issues": "https://github.com/tighten/ziggy/issues", - "source": "https://github.com/tighten/ziggy/tree/v2.3.0" + "source": "https://github.com/tighten/ziggy/tree/v2.3.1" }, - "time": "2024-07-21T16:18:39+00:00" + "time": "2024-10-17T15:36:15+00:00" }, { "name": "tijsverkoyen/css-to-inline-styles", @@ -8648,16 +8648,16 @@ }, { "name": "sebastian/comparator", - "version": "5.0.2", + "version": "5.0.3", "source": { "type": "git", "url": "https://github.com/sebastianbergmann/comparator.git", - "reference": "2d3e04c3b4c1e84a5e7382221ad8883c8fbc4f53" + "reference": "a18251eb0b7a2dcd2f7aa3d6078b18545ef0558e" }, "dist": { "type": "zip", - "url": "https://api.github.com/repos/sebastianbergmann/comparator/zipball/2d3e04c3b4c1e84a5e7382221ad8883c8fbc4f53", - "reference": "2d3e04c3b4c1e84a5e7382221ad8883c8fbc4f53", + "url": "https://api.github.com/repos/sebastianbergmann/comparator/zipball/a18251eb0b7a2dcd2f7aa3d6078b18545ef0558e", + "reference": "a18251eb0b7a2dcd2f7aa3d6078b18545ef0558e", "shasum": "" }, "require": { @@ -8668,7 +8668,7 @@ "sebastian/exporter": "^5.0" }, "require-dev": { - "phpunit/phpunit": "^10.4" + "phpunit/phpunit": "^10.5" }, "type": "library", "extra": { @@ -8705,7 +8705,7 @@ "support": { "issues": "https://github.com/sebastianbergmann/comparator/issues", "security": "https://github.com/sebastianbergmann/comparator/security/policy", - "source": "https://github.com/sebastianbergmann/comparator/tree/5.0.2" + "source": "https://github.com/sebastianbergmann/comparator/tree/5.0.3" }, "funding": [ { @@ -8713,7 +8713,7 @@ "type": "github" } ], - "time": "2024-08-12T06:03:08+00:00" + "time": "2024-10-18T14:56:07+00:00" }, { "name": "sebastian/complexity", diff --git a/package-lock.json b/package-lock.json index 95f4991..18375b4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,11 +1,11 @@ { "name": "inertia.ts", - "version": "1.0.34", + "version": "1.1.1", "lockfileVersion": 3, "requires": true, "packages": { "": { - "version": "1.0.34", + "version": "1.1.1", "dependencies": { "clsx": "^2.1.1", "framer-motion": "^11.11.9", @@ -24,10 +24,10 @@ "@release-it/bumper": "^6.0.1", "@release-it/conventional-changelog": "^8.0.2", "@tailwindcss/forms": "^0.5.9", - "@types/node": "^18.19.56", + "@types/node": "^18.19.58", "@types/react": "^18.3.11", "@types/react-dom": "^18.3.1", - "@vitejs/plugin-react": "^4.3.2", + "@vitejs/plugin-react": "^4.3.3", "autoprefixer": "^10.4.20", "axios": "^1.7.7", "husky": "^9.1.6", @@ -3715,9 +3715,9 @@ "license": "MIT" }, "node_modules/@types/node": { - "version": "18.19.56", - "resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.56.tgz", - "integrity": "sha512-4EMJlWwwGnVPflJAtM14p9eVSa6BOv5b92mCsh5zcM1UagNtEtrbbtaE6WE1tw2TabavatnwqXjlIpcAEuJJNg==", + "version": "18.19.58", + "resolved": "https://registry.npmjs.org/@types/node/-/node-18.19.58.tgz", + "integrity": "sha512-2ryJttbOAWCYuZMdk4rmZZ6oqE+GSL5LxbaTVe4PCs0FUrHObZZAQL4ihMw9/cH1Pn8lSQ9TXVhsM4LrnfZ0aA==", "dev": true, "license": "MIT", "dependencies": { @@ -3767,9 +3767,9 @@ "license": "MIT" }, "node_modules/@vitejs/plugin-react": { - "version": "4.3.2", - "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.3.2.tgz", - "integrity": "sha512-hieu+o05v4glEBucTcKMK3dlES0OeJlD9YVOAPraVMOInBCwzumaIFiUjr4bHK7NPgnAHgiskUoceKercrN8vg==", + "version": "4.3.3", + "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.3.3.tgz", + "integrity": "sha512-NooDe9GpHGqNns1i8XDERg0Vsg5SSYRhRxxyTGogUdkdNt47jal+fbuYi+Yfq6pzRCKXyoPcWisfxE6RIM3GKA==", "dev": true, "license": "MIT", "dependencies": { diff --git a/package.json b/package.json index 5068d84..6869d0a 100644 --- a/package.json +++ b/package.json @@ -15,10 +15,10 @@ "@release-it/bumper": "^6.0.1", "@release-it/conventional-changelog": "^8.0.2", "@tailwindcss/forms": "^0.5.9", - "@types/node": "^18.19.56", + "@types/node": "^18.19.58", "@types/react": "^18.3.11", "@types/react-dom": "^18.3.1", - "@vitejs/plugin-react": "^4.3.2", + "@vitejs/plugin-react": "^4.3.3", "autoprefixer": "^10.4.20", "axios": "^1.7.7", "husky": "^9.1.6", @@ -80,5 +80,5 @@ } } }, - "version": "1.0.34" + "version": "1.1.1" } diff --git a/resources/js/components/container.tsx b/resources/js/components/container.tsx deleted file mode 100644 index 8d7dc7f..0000000 --- a/resources/js/components/container.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import React from 'react'; - -import { cn } from 'ui'; - -const Container = React.forwardRef>( - ({ className, ...props }, ref) => ( -
- ) -); -Container.displayName = 'Container'; - -export { Container }; diff --git a/resources/js/components/header.tsx b/resources/js/components/header.tsx index ab39467..f4aad14 100644 --- a/resources/js/components/header.tsx +++ b/resources/js/components/header.tsx @@ -1,6 +1,5 @@ -import { Container } from 'components/container'; import * as React from 'react'; -import { cn } from 'ui'; +import { cn, Container } from 'ui'; const Header = React.forwardRef>( ({ className, ...props }, ref) => ( diff --git a/resources/js/components/ui/container.tsx b/resources/js/components/ui/container.tsx new file mode 100644 index 0000000..f6e800f --- /dev/null +++ b/resources/js/components/ui/container.tsx @@ -0,0 +1,28 @@ +import React from 'react'; + +import { tv } from 'tailwind-variants'; + +const containerStyles = tv({ + base: 'mx-auto w-full max-w-7xl', + variants: { + variant: { + constrained: 'container sm:px-6 lg:px-8', + 'padded-content': 'px-4 sm:px-6 lg:px-8' + } + }, + defaultVariants: { + variant: 'padded-content' + } +}); + +interface ContainerProps extends React.HTMLAttributes { + variant?: 'constrained' | 'padded-content'; +} + +const Container = React.forwardRef(({ className, variant, ...props }, ref) => ( +
+)); + +Container.displayName = 'Container'; + +export { Container }; diff --git a/resources/js/components/ui/index.ts b/resources/js/components/ui/index.ts index 1c3c6bf..579b17d 100644 --- a/resources/js/components/ui/index.ts +++ b/resources/js/components/ui/index.ts @@ -1,8 +1,8 @@ -export * from '../container'; export * from './avatar'; export * from './button'; export * from './card'; export * from './checkbox'; +export * from './container'; export * from './dialog'; export * from './dropdown'; export * from './field'; @@ -13,10 +13,12 @@ export * from './link'; export * from './list-box'; export * from './menu'; export * from './modal'; +export * from './navbar'; export * from './pagination'; export * from './popover'; export * from './primitive'; export * from './select'; +export * from './separator'; export * from './sheet'; export * from './table'; export * from './text-field'; diff --git a/resources/js/components/ui/navbar.tsx b/resources/js/components/ui/navbar.tsx new file mode 100644 index 0000000..4f04d52 --- /dev/null +++ b/resources/js/components/ui/navbar.tsx @@ -0,0 +1,305 @@ +import * as React from 'react'; + +import { LayoutGroup, motion } from 'framer-motion'; +import { IconHamburger } from 'justd-icons'; +import type { LinkProps } from 'react-aria-components'; +import { Link } from 'react-aria-components'; +import { tv } from 'tailwind-variants'; + +import { Button } from './button'; +import { Container } from './container'; +import { cn, cr, useMediaQuery } from './primitive'; +import { Sheet } from './sheet'; + +type NavbarOptions = { + side?: 'left' | 'right'; + isSticky?: boolean; + intent?: 'navbar' | 'floating' | 'inset'; +}; + +type NavbarContextProps = { + open: boolean; + setOpen: (open: boolean) => void; + openCompact: boolean; + setOpenCompact: (open: boolean) => void; + isCompact: boolean; + toggleNavbar: () => void; +} & NavbarOptions; + +const NavbarContext = React.createContext(null); + +function useNavbar() { + const context = React.useContext(NavbarContext); + if (!context) { + throw new Error('useNavbar must be used within a Navbar.'); + } + + return context; +} + +interface NavbarProviderProps extends React.ComponentProps<'header'>, NavbarOptions { + defaultOpen?: boolean; + isOpen?: boolean; + onOpenChange?: (open: boolean) => void; +} + +const navbarStyles = tv({ + base: 'relative isolate flex w-full min-h-svh flex-col', + variants: { + intent: { + floating: 'pt-2 px-2', + navbar: '', + inset: 'bg-secondary dark:bg-bg' + } + } +}); + +const Navbar = ({ + children, + isOpen: openProp, + onOpenChange: setOpenProp, + defaultOpen = false, + className, + side = 'left', + isSticky = false, + intent = 'navbar', + ...props +}: NavbarProviderProps) => { + const [openCompact, setOpenCompact] = React.useState(false); + const isCompact = useMediaQuery('(max-width: 600px)'); + const [_open, _setOpen] = React.useState(defaultOpen); + const open = openProp ?? _open; + + const setOpen = React.useCallback( + (value: boolean | ((value: boolean) => boolean)) => { + if (setOpenProp) { + return setOpenProp?.(typeof value === 'function' ? value(open) : value); + } + + _setOpen(value); + }, + [setOpenProp, open] + ); + + const toggleNavbar = React.useCallback(() => { + return isCompact ? setOpenCompact((open) => !open) : setOpen((open) => !open); + }, [isCompact, setOpen, setOpenCompact]); + const contextValue = React.useMemo( + () => ({ + open, + setOpen, + isCompact, + openCompact, + setOpenCompact, + toggleNavbar, + intent, + isSticky, + side + }), + [open, setOpen, isCompact, openCompact, setOpenCompact, toggleNavbar, intent, isSticky, side] + ); + return ( + +
+ {children} +
+ + ); +}; + +const navStyles = tv({ + base: 'hidden h-[--navbar-height] [--navbar-height:3.5rem] px-4 group peer lg:flex items-center w-full max-w-screen-2xl mx-auto', + variants: { + isSticky: { + true: 'sticky top-0' + }, + intent: { + floating: 'bg-tertiary shadow-sm border rounded-xl sm:px-4', + navbar: 'bg-tertiary shadow-sm border-b sm:px-6', + inset: 'bg-secondary dark:bg-bg sm:px-6' + } + } +}); + +interface NavbarProps extends React.ComponentProps<'div'> { + intent?: 'navbar' | 'floating' | 'inset'; + isSticky?: boolean; + side?: 'left' | 'right'; +} + +const Nav = ({ className, ...props }: NavbarProps) => { + const { isCompact, side, intent, isSticky, openCompact, setOpenCompact } = useNavbar(); + + if (isCompact) { + return ( + + button]:hidden' + }} + isStack={intent === 'floating'} + > + {props.children} + + + ); + } + + return ( +
+ {props.children} +
+ ); +}; + +const Trigger = ({ className, onPress, ...props }: React.ComponentProps) => { + const { toggleNavbar } = useNavbar(); + return ( + + ); +}; + +const Section = ({ className, ...props }: React.ComponentProps<'div'>) => { + const isCompact = useMediaQuery('(max-width: 600px)'); + const id = React.useId(); + return ( + +
+ {props.children} +
+ + ); +}; + +const linkStyles = tv({ + base: [ + 'relative text-sm px-2 flex items-center gap-x-2 [&>[data-slot=icon]]:-mx-0.5 text-muted-fg outline-none forced-colors:disabled:text-[GrayText] transition-colors', + 'disabled:opacity-60 disabled:cursor-default', + 'current:text-fg hover:text-fg focus:text-fg pressed:text-fg focus-visible:outline-1 focus-visible:outline-primary' + ], + variants: { + isCurrent: { + true: 'text-fg' + } + } +}); + +interface ItemProps extends LinkProps { + isCurrent?: boolean; +} + +const Item = ({ className, isCurrent, ...props }: ItemProps) => { + const { intent, isCompact } = useNavbar(); + return ( + + linkStyles({ ...renderProps, isCurrent, className }) + )} + {...props} + > + {(values) => ( + <> + {typeof props.children === 'function' ? props.children(values) : props.children} + + {(isCurrent || values.isCurrent) && !isCompact && intent !== 'floating' && ( + + )} + + )} + + ); +}; + +const Logo = ({ className, ...props }: LinkProps) => { + return ( + + ); +}; + +const Flex = ({ className, ...props }: React.ComponentProps<'div'>) => { + return
; +}; + +const compactStyles = tv({ + base: 'lg:hidden flex peer-has-[[data-intent=floating]]:border bg-tertiary justify-between', + variants: { + intent: { + floating: 'border h-12 rounded-lg px-3.5', + inset: 'h-14 px-4', + navbar: 'h-14 border-b px-4' + } + } +}); + +const Compact = ({ className, ...props }: React.ComponentProps<'div'>) => { + const { intent } = useNavbar(); + return
; +}; + +const insetStyles = tv({ + base: 'grow p-4 lg:py-10', + variants: { + intent: { + floating: '', + inset: 'min-h-svh bg-tertiary lg:rounded-lg lg:shadow-sm lg:ring-1 lg:ring-dark/5 lg:dark:ring-light/10', + navbar: '' + } + } +}); + +const Inset = ({ className, ...props }: React.ComponentProps<'div'>) => { + const { intent } = useNavbar(); + return ( +
+
+ {props.children} +
+
+ ); +}; + +Navbar.Nav = Nav; +Navbar.Inset = Inset; +Navbar.Compact = Compact; +Navbar.Flex = Flex; +Navbar.Trigger = Trigger; +Navbar.Logo = Logo; +Navbar.Item = Item; +Navbar.Section = Section; + +export { Navbar }; diff --git a/resources/js/components/ui/separator.tsx b/resources/js/components/ui/separator.tsx new file mode 100644 index 0000000..088dec6 --- /dev/null +++ b/resources/js/components/ui/separator.tsx @@ -0,0 +1,29 @@ +import { Separator as SeparatorPrimitive, type SeparatorProps } from 'react-aria-components'; +import { tv } from 'tailwind-variants'; + +const separatorStyles = tv({ + base: 'bg-border shrink-0 forced-colors:bg-[ButtonBorder]', + variants: { + orientation: { + horizontal: 'h-px w-full', + vertical: 'w-px' + } + }, + defaultVariants: { + orientation: 'horizontal' + } +}); + +export function Separator({ className, ...props }: SeparatorProps) { + return ( + + ); +} + +export type { SeparatorProps }; diff --git a/resources/js/layouts/app-layout.tsx b/resources/js/layouts/app-layout.tsx index b218714..3a27156 100644 --- a/resources/js/layouts/app-layout.tsx +++ b/resources/js/layouts/app-layout.tsx @@ -1,14 +1,13 @@ +import { AppNavbar } from '@/layouts/app-navbar'; import { FlashMessage } from 'components/flash-message'; import { Footer } from 'components/footer'; -import { Navbar } from 'components/navbar'; import { PropsWithChildren } from 'react'; export function AppLayout({ children }: PropsWithChildren) { return ( -
+
- -
{children}
+ {children}
); diff --git a/resources/js/components/navbar.tsx b/resources/js/layouts/app-navbar.tsx similarity index 52% rename from resources/js/components/navbar.tsx rename to resources/js/layouts/app-navbar.tsx index 924761b..ebfb334 100644 --- a/resources/js/components/navbar.tsx +++ b/resources/js/layouts/app-navbar.tsx @@ -1,22 +1,11 @@ import { PagePropsData } from '@/types'; import { usePage } from '@inertiajs/react'; -import { Container } from 'components/container'; -import { Logo } from 'components/logo'; import { useTheme } from 'components/theme-provider'; import { ThemeSwitcher } from 'components/theme-switcher'; -import { motion } from 'framer-motion'; -import { - IconBrandJustd, - IconBrandLaravel, - IconChevronDown, - IconColorSwatch, - IconHamburger, - IconSettings -} from 'justd-icons'; +import { IconBrandJustd, IconBrandLaravel, IconChevronDown, IconColorSwatch, IconSettings } from 'justd-icons'; import React from 'react'; -import { ListBox, ListBoxItem, ListBoxItemProps, Selection } from 'react-aria-components'; -import { tv } from 'tailwind-variants'; -import { Avatar, Button, Link, Menu, Sheet, useMediaQuery } from 'ui'; +import { Selection } from 'react-aria-components'; +import { Avatar, Button, Menu, Navbar, Separator } from 'ui'; const navigations = [ { @@ -55,80 +44,44 @@ const navigations = [ } ]; -export function Navbar() { +export function AppNavbar({ children, ...props }: React.ComponentProps) { + const page = usePage(); const { auth } = usePage().props; return ( - <> - - - - ); -} - -const navStyles = tv({ - base: 'text-sm relative py-0 sm:py-4 inline-flex focus:outline-none focus-visible:text-fg font-medium', - variants: { - isCurrent: { - true: 'text-fg', - false: 'text-muted-fg hover:text-fg' - } - } -}); + + + + + + + {navigations.map((item) => ( + + {item.name} + + ))} + + + {!auth.user && } + {auth.user ? : } + + -interface LinkProps extends ListBoxItemProps { - className?: string; - children: React.ReactNode; - target?: string; - href?: string; -} + + + + + + + + + + {!auth.user && } + {auth.user ? : } + + -function NavLink({ children, className, ...props }: LinkProps) { - const pathname = usePage().url; - const isCurrent = pathname === props.href; - return ( - {children} - {isCurrent && } - - ); -} - -function CurrentIndicator() { - return ( - - ); -} - -function LoginMenu() { - return ( - - - - Login - Register - - + ); } @@ -142,7 +95,7 @@ function UserMenu() { - +
{auth.user.name}
@@ -201,62 +154,17 @@ function UserMenu() { ); } -function ResponsiveNavbar() { - const { auth } = usePage().props; - return ( - - ); -} - -function NavContent() { - const isMobile = useMediaQuery('(max-width: 640px)'); +function LoginMenu() { return ( - - {(item) => ( - - {item.name} - - )} - + + + + Login + Register + + ); } diff --git a/resources/js/pages/about.tsx b/resources/js/pages/about.tsx index ee1feed..15fdeba 100644 --- a/resources/js/pages/about.tsx +++ b/resources/js/pages/about.tsx @@ -1,15 +1,17 @@ import { Head } from '@inertiajs/react'; -import { Container } from 'components/container'; import { Header } from 'components/header'; import { AppLayout } from 'layouts'; import React from 'react'; +import { Card, Container } from 'ui'; export default function About() { return ( <>
- {/* Your about page content goes here. */} + + Your about page content goes here. + ); } diff --git a/resources/js/pages/dashboard.tsx b/resources/js/pages/dashboard.tsx index 051b54f..e08ed14 100644 --- a/resources/js/pages/dashboard.tsx +++ b/resources/js/pages/dashboard.tsx @@ -1,8 +1,7 @@ -import { PagePropsData } from '@/types/index'; +import { PagePropsData } from '@/types'; import { Head } from '@inertiajs/react'; -import { Container } from 'components/container'; import { AppLayout } from 'layouts'; -import { Card } from 'ui'; +import { Card, Container } from 'ui'; export default function Dashboard({ auth }: PagePropsData) { return ( @@ -10,7 +9,7 @@ export default function Dashboard({ auth }: PagePropsData) { - Hello, {auth.user.name}! + Hello, {auth.user.name}! ); diff --git a/resources/js/pages/home.tsx b/resources/js/pages/home.tsx index 038650c..31583e2 100644 --- a/resources/js/pages/home.tsx +++ b/resources/js/pages/home.tsx @@ -1,5 +1,4 @@ import { Head } from '@inertiajs/react'; -import { Container } from 'components/container'; import { Header } from 'components/header'; import { Logo } from 'components/logo'; import { @@ -11,7 +10,7 @@ import { IconCube } from 'justd-icons'; import { AppLayout } from 'layouts'; -import { Card, Grid, Link } from 'ui'; +import { Card, Container, Grid, Link } from 'ui'; const items = [ { diff --git a/resources/js/pages/profile/edit.tsx b/resources/js/pages/profile/edit.tsx index 0e751a5..142820b 100644 --- a/resources/js/pages/profile/edit.tsx +++ b/resources/js/pages/profile/edit.tsx @@ -1,7 +1,7 @@ import { Head } from '@inertiajs/react'; -import { Container } from 'components/container'; import { Header } from 'components/header'; import { AppLayout } from 'layouts'; +import { Container } from 'ui'; import { DeleteUserForm, UpdatePasswordForm, UpdateProfileInformationForm } from './partials'; interface Props { diff --git a/resources/js/ssr.tsx b/resources/js/ssr.tsx index 3284260..f0de8ab 100644 --- a/resources/js/ssr.tsx +++ b/resources/js/ssr.tsx @@ -4,6 +4,7 @@ import createServer from '@inertiajs/react/server'; import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers'; import ReactDOMServer from 'react-dom/server'; import { route, type RouteName } from 'ziggy-js'; + const appName = import.meta.env.VITE_APP_NAME || 'Laravel'; createServer((page) => createInertiaApp({ diff --git a/tailwind.config.js b/tailwind.config.js index 6932378..fdd5bc0 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -11,13 +11,6 @@ const config = withTV({ './resources/js/**/*.{js,jsx,ts,tsx}' ], theme: { - container: { - center: true, - padding: '2rem', - screens: { - '2xl': '1400px' - } - }, extend: { fontFamily: { sans: ['Figtree', ...fontFamily.sans]