create-nextjs-cms 0.9.30 → 0.9.32

package/templates/default/components/layout/sidebar-dropdown-item.tsx

@@ -1,83 +1,83 @@
-import Link from 'next/link'
-import classNames from 'classnames'
-import { useState } from 'react'
-import { SidebarItemProps } from 'nextjs-cms/core/types'
-import { useAutoAnimate } from '@formkit/auto-animate/react'
-import { ChevronDownIcon, ChevronUpIcon, FolderIcon, PlusIcon } from 'lucide-react'
-import { useI18n } from 'nextjs-cms/translations/client'
-import SectionIcon from '@/components/sections/section-icon'
-
-export default function SidebarDropdownItem({ item, closeSideBar }: SidebarItemProps) {
-    const t = useI18n()
-    const [parent] = useAutoAnimate()
-    const [open, setOpen] = useState(false)
-    return (
-        <div ref={parent}>
-            <div
-                className={classNames({
-                    'flex cursor-pointer text-white hover:bg-indigo-900 dark:hover:bg-emerald-600': true, //colors
-                    'transition-colors duration-100': false, //animation
-                    'gap-4 rounded-md p-2': true,
-                    'rounded-b-none bg-indigo-700 dark:bg-emerald-600': open,
-                })}
-                onClick={() => setOpen((prev) => !prev)}
-            >
-                <li className='relative flex w-full items-center justify-between gap-2'>
-                    <span className='flex items-center gap-2 text-start'>
-                        {item.icon && <SectionIcon name={item.icon} className='size-4' />}
-                        <span>{item.title}</span>
-                    </span>
-                    <span>
-                        {open ? (
-                            <ChevronUpIcon className='h-5 w-5' />
-                        ) : (
-                            <ChevronDownIcon className='h-5 w-5' />
-                        )}
-                    </span>
-                </li>
-            </div>
-            {open && (
-                <div
-                    className={classNames({
-                        'rounded border border-t-0 border-indigo-700/50 text-white dark:border-emerald-600/50': true, //colors
-                        'transition-colors duration-100': false, //animation
-                        'flex flex-col items-stretch rounded-md rounded-t-none py-2': true,
-                    })}
-                >
-                    <Link
-                        onClick={closeSideBar}
-                        href={`/new${item.path}`}
-                        className={classNames({
-                            'flex rounded text-white hover:underline': true, //colors
-                            'transition-colors duration-100': false, //animation
-                            'mx-3 gap-4 p-2': true,
-                        })}
-                    >
-                        <li className='flex flex-row items-center gap-1'>
-                            <span>
-                                <PlusIcon className='size-4' />
-                            </span>
-                            <span>{t('new')}</span>
-                        </li>
-                    </Link>
-                    <Link
-                        onClick={closeSideBar}
-                        href={`/browse${item.path}`}
-                        className={classNames({
-                            'flex rounded text-white hover:underline': true, //colors
-                            'transition-colors duration-100': false, //animation
-                            'mx-3 gap-4 p-2': true,
-                        })}
-                    >
-                        <li className='flex flex-row items-center gap-1'>
-                            <span>
-                                <FolderIcon className='size-4' />
-                            </span>
-                            <span>{t('browse')}</span>
-                        </li>
-                    </Link>
-                </div>
-            )}
-        </div>
-    )
-}
+import Link from 'next/link'
+import classNames from 'classnames'
+import { useState } from 'react'
+import { SidebarItemProps } from 'nextjs-cms/core/types'
+import { useAutoAnimate } from '@formkit/auto-animate/react'
+import { ChevronDownIcon, ChevronUpIcon, FolderIcon, PlusIcon } from 'lucide-react'
+import { useI18n } from 'nextjs-cms/translations/client'
+import SectionIcon from '@/components/sections/section-icon'
+
+export default function SidebarDropdownItem({ item, closeSideBar }: SidebarItemProps) {
+    const t = useI18n()
+    const [parent] = useAutoAnimate()
+    const [open, setOpen] = useState(false)
+    return (
+        <div ref={parent}>
+            <div
+                className={classNames({
+                    'flex cursor-pointer text-white hover:bg-indigo-900 dark:hover:bg-emerald-600': true, //colors
+                    'transition-colors duration-100': false, //animation
+                    'gap-4 rounded-md p-2': true,
+                    'rounded-b-none bg-indigo-700 dark:bg-emerald-600': open,
+                })}
+                onClick={() => setOpen((prev) => !prev)}
+            >
+                <li className='relative flex w-full items-center justify-between gap-2'>
+                    <span className='flex items-center gap-2 text-start'>
+                        {item.icon && <SectionIcon name={item.icon} className='size-4' />}
+                        <span>{item.title}</span>
+                    </span>
+                    <span>
+                        {open ? (
+                            <ChevronUpIcon className='h-5 w-5' />
+                        ) : (
+                            <ChevronDownIcon className='h-5 w-5' />
+                        )}
+                    </span>
+                </li>
+            </div>
+            {open && (
+                <div
+                    className={classNames({
+                        'rounded border border-t-0 border-indigo-700/50 text-white dark:border-emerald-600/50': true, //colors
+                        'transition-colors duration-100': false, //animation
+                        'flex flex-col items-stretch rounded-md rounded-t-none py-2': true,
+                    })}
+                >
+                    <Link
+                        onClick={closeSideBar}
+                        href={`/new${item.path}`}
+                        className={classNames({
+                            'flex rounded text-white hover:underline': true, //colors
+                            'transition-colors duration-100': false, //animation
+                            'mx-3 gap-4 p-2': true,
+                        })}
+                    >
+                        <li className='flex flex-row items-center gap-1'>
+                            <span>
+                                <PlusIcon className='size-4' />
+                            </span>
+                            <span>{t('new')}</span>
+                        </li>
+                    </Link>
+                    <Link
+                        onClick={closeSideBar}
+                        href={`/browse${item.path}`}
+                        className={classNames({
+                            'flex rounded text-white hover:underline': true, //colors
+                            'transition-colors duration-100': false, //animation
+                            'mx-3 gap-4 p-2': true,
+                        })}
+                    >
+                        <li className='flex flex-row items-center gap-1'>
+                            <span>
+                                <FolderIcon className='size-4' />
+                            </span>
+                            <span>{t('browse')}</span>
+                        </li>
+                    </Link>
+                </div>
+            )}
+        </div>
+    )
+}

package/templates/default/components/layout/sidebar-item.tsx

@@ -1,24 +1,24 @@
-import Link from 'next/link'
-import classNames from 'classnames'
-import { SidebarItemProps } from 'nextjs-cms/core/types'
-import SectionIcon from '@/components/sections/section-icon'
-
-export default function SidebarItem({ item, closeSideBar }: SidebarItemProps) {
-    return (
-        <Link
-            onClick={closeSideBar}
-            href={item.path}
-            className={classNames({
-                'rounded-lg text-white hover:bg-indigo-900 dark:hover:bg-emerald-600': true, //colors
-                'transition-colors duration-100': false, //animation
-                'gap-4 p-2': true,
-                'text-start': true, // RTL support
-            })}
-        >
-            <span className='flex items-center gap-2'>
-                {item.icon && <SectionIcon name={item.icon} className='size-4' />}
-                <span>{item.title}</span>
-            </span>
-        </Link>
-    )
-}
+import Link from 'next/link'
+import classNames from 'classnames'
+import { SidebarItemProps } from 'nextjs-cms/core/types'
+import SectionIcon from '@/components/sections/section-icon'
+
+export default function SidebarItem({ item, closeSideBar }: SidebarItemProps) {
+    return (
+        <Link
+            onClick={closeSideBar}
+            href={item.path}
+            className={classNames({
+                'rounded-lg text-white hover:bg-indigo-900 dark:hover:bg-emerald-600': true, //colors
+                'transition-colors duration-100': false, //animation
+                'gap-4 p-2': true,
+                'text-start': true, // RTL support
+            })}
+        >
+            <span className='flex items-center gap-2'>
+                {item.icon && <SectionIcon name={item.icon} className='size-4' />}
+                <span>{item.title}</span>
+            </span>
+        </Link>
+    )
+}