11 |
16 | )
17 | }
18 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/CalendarDemo.tsx:
--------------------------------------------------------------------------------
1 | import { BsCalendar } from '@workspace/ui/components/Calendar'
2 |
3 | export function CalendarDemo() {
4 | return
13 | {value ? JSON.stringify(value) : 'No value'}
14 |
15 |
9 | Apple
10 | Banana
11 | Orange
12 |
13 |
7 |
8 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/DatePickerDemo.tsx:
--------------------------------------------------------------------------------
1 | import { BsDatePicker } from '@workspace/ui/components/DatePicker'
2 |
3 | export function DatePickerDemo() {
4 | return
9 |
10 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/DateRangePickerDemo.tsx:
--------------------------------------------------------------------------------
1 | import { BsDateRangePicker } from '@workspace/ui/components/DatePicker'
2 |
3 | export function DateRangePickerDemo() {
4 | return
9 |
10 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/InputDemo.tsx:
--------------------------------------------------------------------------------
1 | import { Input } from '@workspace/ui/components/Textfield'
2 |
3 | export function InputDemo() {
4 | return
5 | }
6 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/InputDisabled.tsx:
--------------------------------------------------------------------------------
1 | import { Input } from '@workspace/ui/components/Textfield'
2 |
3 | export function InputDisabled() {
4 | return
5 | }
6 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/InputFile.tsx:
--------------------------------------------------------------------------------
1 | import { Input } from '@workspace/ui/components/Textfield'
2 |
3 | export function InputFile() {
4 | return
5 | }
6 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/InputWithButton.tsx:
--------------------------------------------------------------------------------
1 | import { Button } from '@workspace/ui/components/Button'
2 | import { Input } from '@workspace/ui/components/Textfield'
3 |
4 | export function InputWithButton() {
5 | return (
6 |
7 |
8 |
9 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/InputWithLabel.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { Input } from '@workspace/ui/components/Textfield'
4 | import { Label } from '@workspace/ui/components/Field'
5 |
6 | export function InputWithLabel() {
7 | return (
8 |
9 |
10 |
11 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/MenuDemo.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { Button } from '@workspace/ui/components/Button'
4 | import { Menu, MenuItem, MenuPopover, MenuTrigger } from '@workspace/ui/components/Menu'
5 | import { MenuIcon } from 'lucide-react'
6 |
7 | export function MenuDemo() {
8 | return (
9 |
7 |
8 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/NumberFieldWithoutStepper.tsx:
--------------------------------------------------------------------------------
1 | import { BsNumberField } from '@workspace/ui/components/Numberfield'
2 |
3 | export function NumberFieldWithoutStepper() {
4 | return
8 |
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/RadioGroupDemo.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { Label } from '@workspace/ui/components/Field'
4 | import { RadioGroup, Radio } from '@workspace/ui/components/RadioGroup'
5 |
6 | export function RadioGroupDemo() {
7 | return (
8 |
11 |
16 | )
17 | }
18 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/RangeCalendarDefault.tsx:
--------------------------------------------------------------------------------
1 | import { BsRangeCalendar } from '@workspace/ui/components/Calendar'
2 |
3 | export function RangeCalendarDefault() {
4 | return
13 | {value ? JSON.stringify(value, null, 2) : 'No value'}
14 |
15 |
17 |
19 | )
20 | }
21 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/SelectDisabled.tsx:
--------------------------------------------------------------------------------
1 | import { BsSelect } from '@workspace/ui/components/Select'
2 |
3 | export function SelectDisabled() {
4 | return
15 |
17 | )
18 | }
19 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/SkeletonDemo.tsx:
--------------------------------------------------------------------------------
1 | import { Skeleton } from '@workspace/ui/components/Skeleton'
2 |
3 | export function SkeletonDemo() {
4 | return (
5 |
6 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/SpinnerDemo.tsx:
--------------------------------------------------------------------------------
1 | import { Spinner } from '@workspace/ui/components/Spinner'
2 |
3 | export function SpinnerDemo() {
4 | return (
5 |
8 |
11 |
6 |
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/SwitchDemo.tsx:
--------------------------------------------------------------------------------
1 | import { Switch } from '@workspace/ui/components/Switch'
2 |
3 | export function SwitchDemo() {
4 | return
7 |
8 |
9 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/TextAreaWithLabel.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { TextArea } from '@workspace/ui/components/Textfield'
4 | import { Label } from '@workspace/ui/components/Field'
5 |
6 | export function TextAreaWithLabel() {
7 | return (
8 |
9 |
10 |
11 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/TimeFieldDemo.tsx:
--------------------------------------------------------------------------------
1 | import { BsTimeField } from '@workspace/ui/components/Datefield'
2 |
3 | export function TimeFieldDemo() {
4 | return
7 |
8 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/TooltipBasic.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { Button } from '@workspace/ui/components/Button'
4 | import { Tooltip, TooltipTrigger } from '@workspace/ui/components/Tooltip'
5 |
6 | export function TooltipBasic() {
7 | return (
8 |
9 |
10 |
11 |
12 |
14 |
15 |
16 |
17 |
18 |
20 |
21 |
22 | )
23 | }
24 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/examples/TooltipDemo.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { Button } from '@workspace/ui/components/Button'
4 | import { Tooltip, TooltipTrigger } from '@workspace/ui/components/Tooltip'
5 | import { Pencil } from 'lucide-react'
6 |
7 | export function TooltipDemo() {
8 | return (
9 | Simple tooltip text
13 |Another simple tooltip
19 |
4 | 
5 |
6 | )
7 | }
8 |
--------------------------------------------------------------------------------
/apps/docs/shared/components/mdx-helpers/MdxTip.tsx:
--------------------------------------------------------------------------------
1 | import { InfoIcon } from 'lucide-react'
2 |
3 | interface MdxTipProps {
4 | children: React.ReactNode
5 | title: string
6 | }
7 |
8 | export function MdxTip({ children, title = 'Note' }: MdxTipProps) {
9 | return (
10 |
11 |
19 | )
20 | }
21 |
--------------------------------------------------------------------------------
/apps/docs/shared/consts/common.ts:
--------------------------------------------------------------------------------
1 | export const PROJECT_NAME = 'BaseStack'
2 | export const PROJECT_NAME_SLUG = 'base-stack'
3 | export const PROJECT_DESCRIPTION =
4 | 'A modern React starter kit with best practices and all the essentials to quickly launch your frontend.'
5 | export const GITHUB_URL = `https://github.com/henry-phm/${PROJECT_NAME_SLUG}`
6 | export const GITHUB_URL_AUTHOR = 'https://github.com/henry-phm'
7 |
--------------------------------------------------------------------------------
/apps/docs/shared/hooks/useMounted.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react'
2 |
3 | export function useMounted() {
4 | const [mounted, setMounted] = React.useState(false)
5 |
6 | React.useEffect(() => {
7 | setMounted(true)
8 | }, [])
9 |
10 | return mounted
11 | }
12 |
--------------------------------------------------------------------------------
/apps/docs/shared/layouts/DocsLayout/Icons.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react'
2 |
3 | export function CrossIcon({ className }: { className?: string }) {
4 | return (
5 |
16 | )
17 | }
18 |
--------------------------------------------------------------------------------
/apps/docs/shared/layouts/DocsLayout/SidebarHeader.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { Logo } from '@/shared/components/Logo'
3 |
4 | export function SidebarHeader() {
5 | return (
6 |
12 |
18 |
13 |
16 | {children}
17 |
7 |
9 | )
10 | }
11 |
--------------------------------------------------------------------------------
/apps/docs/shared/layouts/DocsSearch.tsx:
--------------------------------------------------------------------------------
1 | import { Button } from '@workspace/ui/components/Button'
2 | import { SearchIcon } from 'lucide-react'
3 |
4 | export function DocsSearch() {
5 | // TODO: Add search functionality
6 | return null
7 |
8 | return (
9 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/apps/docs/shared/layouts/HeaderIconButtons.tsx:
--------------------------------------------------------------------------------
1 | import { GithubIcon } from '@/shared/components/icons/GithubIcon'
2 | import { ThemeSwitcher } from '@/shared/components/ThemeSwitcher'
3 | import { GITHUB_URL } from '@/shared/consts/common'
4 | import { DocsSearch } from '@/shared/layouts/DocsSearch'
5 | import { Button } from '@workspace/ui/components/Button'
6 | import Link from 'next/link'
7 |
8 | export function HeaderIconButtons() {
9 | return (
10 |
11 |
19 | )
20 | }
21 |
--------------------------------------------------------------------------------
/apps/docs/shared/lib/composition.ts:
--------------------------------------------------------------------------------
1 | import { readFile } from 'node:fs/promises'
2 | import { resolve } from 'node:path'
3 |
4 | export const readExampleFile = async (name: string, ext = 'tsx') => {
5 | const filePath = resolve(`shared/components/examples`, `${name}.${ext}`)
6 |
7 | const fileContent = await readFile(filePath, 'utf-8')
8 |
9 | return fileContent
10 | }
11 |
--------------------------------------------------------------------------------
/apps/docs/shared/lib/highlight-code.ts:
--------------------------------------------------------------------------------
1 | import { codeToHtml } from 'shiki'
2 |
3 | export const highlightCode = (code: string, opts?: Partial
16 |
18 | )}
19 | ',
9 | })
10 |
11 | function useNProgress({ isFetching }: { isFetching: boolean }) {
12 | React.useEffect(() => {
13 | if (isFetching) {
14 | NProgressJs.start()
15 | } else {
16 | NProgressJs.done()
17 | }
18 | }, [isFetching])
19 | }
20 |
21 | export { useNProgress }
22 |
--------------------------------------------------------------------------------
/packages/ui/src/components/Separator.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { Separator as AriaSeparator, SeparatorProps as AriaSeparatorProps } from 'react-aria-components'
4 |
5 | import { cn } from '@workspace/ui/lib/utils'
6 |
7 | const Separator = ({ className, orientation = 'horizontal', ...props }: AriaSeparatorProps) => (
8 |
16 |
18 | )}
19 | ',
9 | })
10 |
11 | function useNProgress({ isFetching }: { isFetching: boolean }) {
12 | React.useEffect(() => {
13 | if (isFetching) {
14 | NProgressJs.start()
15 | } else {
16 | NProgressJs.done()
17 | }
18 | }, [isFetching])
19 | }
20 |
21 | export { useNProgress }
22 |
--------------------------------------------------------------------------------
/tooling/cli/templates/base/packages/ui/src/components/Separator.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { Separator as AriaSeparator, SeparatorProps as AriaSeparatorProps } from 'react-aria-components'
4 |
5 | import { cn } from '@workspace/ui/lib/utils'
6 |
7 | const Separator = ({ className, orientation = 'horizontal', ...props }: AriaSeparatorProps) => (
8 |
7 |
13 | )
14 | }
15 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/app/error.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import React from 'react'
4 |
5 | export default function Error({ error, reset }: { error: Error & { digest?: string }; reset: () => void }) {
6 | React.useEffect(() => {
7 | console.error(error)
8 | }, [error])
9 |
10 | return (
11 | Not Found
8 |Could not find document
9 | 12 |
12 |
15 | )
16 | }
17 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/app/layout-preview/dashboard/[id]/layout.tsx:
--------------------------------------------------------------------------------
1 | import { DashboardLayout } from './DashboardLayout'
2 | import { cookies } from 'next/headers'
3 |
4 | interface LayoutProps {
5 | children: React.ReactNode
6 | }
7 |
8 | export default async function Layout({ children }: LayoutProps) {
9 | const cookieStore = await cookies()
10 | const defaultOpen = cookieStore.get('sidebar_state')?.value !== 'false'
11 |
12 | return Something went wrong!
13 | 14 |
7 |
13 | )
14 | }
15 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/components.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://ui.shadcn.com/schema.json",
3 | "style": "new-york",
4 | "rsc": true,
5 | "tsx": true,
6 | "tailwind": {
7 | "config": "",
8 | "css": "../../packages/ui/src/styles/globals.css",
9 | "baseColor": "neutral",
10 | "cssVariables": true
11 | },
12 | "iconLibrary": "lucide",
13 | "aliases": {
14 | "components": "@/components",
15 | "hooks": "@/hooks",
16 | "lib": "@/lib",
17 | "utils": "@workspace/ui/lib/utils",
18 | "ui": "@workspace/ui/components"
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/content/docs/guide/form-basic.mdx:
--------------------------------------------------------------------------------
1 | ---
2 | title: Basic Form
3 | description: Learn how to create and use a basic form, including setup, input fields, and form submission handling.
4 | ---
5 |
6 | ## Usage
7 | Not Found
8 |Could not find requested resource
9 | 12 |
15 | {withName && (
16 | {PROJECT_NAME}
17 | )}
18 |
19 | )
20 | }
21 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/AvatarDemo.tsx:
--------------------------------------------------------------------------------
1 | import { Avatar, AvatarFallback, AvatarImage } from '@workspace/ui/components/Avatar'
2 |
3 | export function AvatarDemo() {
4 | return (
5 |
11 |
16 | )
17 | }
18 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/CalendarDemo.tsx:
--------------------------------------------------------------------------------
1 | import { BsCalendar } from '@workspace/ui/components/Calendar'
2 |
3 | export function CalendarDemo() {
4 | return
13 | {value ? JSON.stringify(value) : 'No value'}
14 |
15 |
9 | Apple
10 | Banana
11 | Orange
12 |
13 |
7 |
8 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/DatePickerDemo.tsx:
--------------------------------------------------------------------------------
1 | import { BsDatePicker } from '@workspace/ui/components/DatePicker'
2 |
3 | export function DatePickerDemo() {
4 | return
9 |
10 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/DateRangePickerDemo.tsx:
--------------------------------------------------------------------------------
1 | import { BsDateRangePicker } from '@workspace/ui/components/DatePicker'
2 |
3 | export function DateRangePickerDemo() {
4 | return
9 |
10 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/InputDemo.tsx:
--------------------------------------------------------------------------------
1 | import { Input } from '@workspace/ui/components/Textfield'
2 |
3 | export function InputDemo() {
4 | return
5 | }
6 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/InputDisabled.tsx:
--------------------------------------------------------------------------------
1 | import { Input } from '@workspace/ui/components/Textfield'
2 |
3 | export function InputDisabled() {
4 | return
5 | }
6 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/InputFile.tsx:
--------------------------------------------------------------------------------
1 | import { Input } from '@workspace/ui/components/Textfield'
2 |
3 | export function InputFile() {
4 | return
5 | }
6 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/InputWithButton.tsx:
--------------------------------------------------------------------------------
1 | import { Button } from '@workspace/ui/components/Button'
2 | import { Input } from '@workspace/ui/components/Textfield'
3 |
4 | export function InputWithButton() {
5 | return (
6 |
7 |
8 |
9 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/InputWithLabel.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { Input } from '@workspace/ui/components/Textfield'
4 | import { Label } from '@workspace/ui/components/Field'
5 |
6 | export function InputWithLabel() {
7 | return (
8 |
9 |
10 |
11 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/MenuDemo.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { Button } from '@workspace/ui/components/Button'
4 | import { Menu, MenuItem, MenuPopover, MenuTrigger } from '@workspace/ui/components/Menu'
5 | import { MenuIcon } from 'lucide-react'
6 |
7 | export function MenuDemo() {
8 | return (
9 |
7 |
8 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/NumberFieldWithoutStepper.tsx:
--------------------------------------------------------------------------------
1 | import { BsNumberField } from '@workspace/ui/components/Numberfield'
2 |
3 | export function NumberFieldWithoutStepper() {
4 | return
8 |
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/RadioGroupDemo.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { Label } from '@workspace/ui/components/Field'
4 | import { RadioGroup, Radio } from '@workspace/ui/components/RadioGroup'
5 |
6 | export function RadioGroupDemo() {
7 | return (
8 |
11 |
16 | )
17 | }
18 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/RangeCalendarDefault.tsx:
--------------------------------------------------------------------------------
1 | import { BsRangeCalendar } from '@workspace/ui/components/Calendar'
2 |
3 | export function RangeCalendarDefault() {
4 | return
13 | {value ? JSON.stringify(value, null, 2) : 'No value'}
14 |
15 |
17 |
19 | )
20 | }
21 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/SelectDisabled.tsx:
--------------------------------------------------------------------------------
1 | import { BsSelect } from '@workspace/ui/components/Select'
2 |
3 | export function SelectDisabled() {
4 | return
15 |
17 | )
18 | }
19 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/SkeletonDemo.tsx:
--------------------------------------------------------------------------------
1 | import { Skeleton } from '@workspace/ui/components/Skeleton'
2 |
3 | export function SkeletonDemo() {
4 | return (
5 |
6 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/SpinnerDemo.tsx:
--------------------------------------------------------------------------------
1 | import { Spinner } from '@workspace/ui/components/Spinner'
2 |
3 | export function SpinnerDemo() {
4 | return (
5 |
8 |
11 |
6 |
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/SwitchDemo.tsx:
--------------------------------------------------------------------------------
1 | import { Switch } from '@workspace/ui/components/Switch'
2 |
3 | export function SwitchDemo() {
4 | return
7 |
8 |
9 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/TextAreaWithLabel.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { TextArea } from '@workspace/ui/components/Textfield'
4 | import { Label } from '@workspace/ui/components/Field'
5 |
6 | export function TextAreaWithLabel() {
7 | return (
8 |
9 |
10 |
11 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/TimeFieldDemo.tsx:
--------------------------------------------------------------------------------
1 | import { BsTimeField } from '@workspace/ui/components/Datefield'
2 |
3 | export function TimeFieldDemo() {
4 | return
7 |
8 |
10 | )
11 | }
12 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/examples/TooltipDemo.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { Button } from '@workspace/ui/components/Button'
4 | import { Tooltip, TooltipTrigger } from '@workspace/ui/components/Tooltip'
5 | import { Pencil } from 'lucide-react'
6 |
7 | export function TooltipDemo() {
8 | return (
9 |
4 |
5 |
6 | )
7 | }
8 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/components/mdx-helpers/MdxTip.tsx:
--------------------------------------------------------------------------------
1 | import { InfoIcon } from 'lucide-react'
2 |
3 | interface MdxTipProps {
4 | children: React.ReactNode
5 | title: string
6 | }
7 |
8 | export function MdxTip({ children, title = 'Note' }: MdxTipProps) {
9 | return (
10 |
11 |
19 | )
20 | }
21 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/consts/common.ts:
--------------------------------------------------------------------------------
1 | export const PROJECT_NAME = 'BaseStack'
2 | export const PROJECT_NAME_SLUG = 'base-stack'
3 | export const PROJECT_DESCRIPTION =
4 | 'A modern React starter kit with best practices and all the essentials to quickly launch your frontend.'
5 | export const GITHUB_URL = `https://github.com/henry-phm/${PROJECT_NAME_SLUG}`
6 | export const GITHUB_URL_AUTHOR = 'https://github.com/henry-phm'
7 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/hooks/useMounted.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react'
2 |
3 | export function useMounted() {
4 | const [mounted, setMounted] = React.useState(false)
5 |
6 | React.useEffect(() => {
7 | setMounted(true)
8 | }, [])
9 |
10 | return mounted
11 | }
12 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/layouts/DocsLayout/Icons.tsx:
--------------------------------------------------------------------------------
1 | import * as React from 'react'
2 |
3 | export function CrossIcon({ className }: { className?: string }) {
4 | return (
5 |
16 | )
17 | }
18 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/layouts/DocsLayout/SidebarHeader.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react'
2 | import { Logo } from '@/shared/components/Logo'
3 |
4 | export function SidebarHeader() {
5 | return (
6 |
12 |
18 |
13 |
16 | {children}
17 |
7 |
9 | )
10 | }
11 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/layouts/DocsSearch.tsx:
--------------------------------------------------------------------------------
1 | import { Button } from '@workspace/ui/components/Button'
2 | import { SearchIcon } from 'lucide-react'
3 |
4 | export function DocsSearch() {
5 | // TODO: Add search functionality
6 | return null
7 |
8 | return (
9 |
12 | )
13 | }
14 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/layouts/HeaderIconButtons.tsx:
--------------------------------------------------------------------------------
1 | import { GithubIcon } from '@/shared/components/icons/GithubIcon'
2 | import { ThemeSwitcher } from '@/shared/components/ThemeSwitcher'
3 | import { GITHUB_URL } from '@/shared/consts/common'
4 | import { DocsSearch } from '@/shared/layouts/DocsSearch'
5 | import { Button } from '@workspace/ui/components/Button'
6 | import Link from 'next/link'
7 |
8 | export function HeaderIconButtons() {
9 | return (
10 |
11 |
19 | )
20 | }
21 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/lib/composition.ts:
--------------------------------------------------------------------------------
1 | import { readFile } from 'node:fs/promises'
2 | import { resolve } from 'node:path'
3 |
4 | export const readExampleFile = async (name: string, ext = 'tsx') => {
5 | const filePath = resolve(`shared/components/examples`, `${name}.${ext}`)
6 |
7 | const fileContent = await readFile(filePath, 'utf-8')
8 |
9 | return fileContent
10 | }
11 |
--------------------------------------------------------------------------------
/tooling/cli/templates/extras/apps/docs/shared/lib/highlight-code.ts:
--------------------------------------------------------------------------------
1 | import { codeToHtml } from 'shiki'
2 |
3 | export const highlightCode = (code: string, opts?: Partial