docs(site): update to nextra 3 (#2024)

packages/docs/next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.
+// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information.

packages/docs/next.config.mjs

@@ -0,0 +1,61 @@
+import nextra from 'nextra'
+
+const withNextra = nextra({
+  theme: 'nextra-theme-docs',
+  themeConfig: './theme.config.tsx',
+})
+
+export default withNextra({
+  images: {
+    remotePatterns: [
+      {
+        protocol: 'https',
+        hostname: 'avatars.githubusercontent.com',
+        port: '',
+        pathname: '/**/**',
+      },
+    ],
+  },
+})
+
+// // Injected content via Sentry wizard below
+
+// const { withSentryConfig } = require('@sentry/nextjs')
+
+// module.exports = withSentryConfig(
+//   module.exports,
+//   {
+//     // For all available options, see:
+//     // https://github.com/getsentry/sentry-webpack-plugin#options
+
+//     // Suppresses source map uploading logs during build
+//     silent: true,
+//     org: 'vtex',
+//     project: 'shoreline-docs',
+//   },
+//   {
+//     // For all available options, see:
+//     // https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/
+
+//     // Upload a larger set of source maps for prettier stack traces (increases build time)
+//     widenClientFileUpload: true,
+
+//     // Transpiles SDK to be compatible with IE11 (increases bundle size)
+//     transpileClientSDK: true,
+
+//     // Routes browser requests to Sentry through a Next.js rewrite to circumvent ad-blockers (increases server load)
+//     tunnelRoute: '/monitoring',
+
+//     // Hides source maps from generated client bundles
+//     hideSourceMaps: true,
+
+//     // Automatically tree-shake Sentry logger statements to reduce bundle size
+//     disableLogger: true,
+
+//     // Enables automatic instrumentation of Vercel Cron Monitors.
+//     // See the following for more information:
+//     // https://docs.sentry.io/product/crons/
+//     // https://vercel.com/docs/cron-jobs
+//     automaticVercelMonitors: true,
+//   }
+// )

packages/docs/package.json

@@ -2,6 +2,7 @@
   "name": "@shoreline/docs",
   "version": "1.0.7",
   "private": true,
+  "type": "module",
   "scripts": {
     "dev": "npm run gen:examples && npm run gen:props && next dev",
     "build-docs": "npm --prefix ../../ run build && npm run gen:contributors && npm run gen:examples && npm run gen:props && next build",
@@ -24,9 +25,9 @@
     "@vtex/shoreline-utils": "workspace:*",
     "fs-extra": "11.2.0",
     "google": "link:@next/third-parties/google",
-    "next": "13.5.6",
-    "nextra": "2.13.4",
-    "nextra-theme-docs": "2.13.4",
+    "next": "15.0.0",
+    "nextra": "3.0.15",
+    "nextra-theme-docs": "3.0.15",
     "prettier": "3.2.5",
     "react": "18.2.0",
     "react-dom": "18.2.0",

packages/docs/pages/_meta.ts

@@ -0,0 +1,31 @@
+export default {
+  index: {
+    title: 'Home',
+    type: 'page',
+    display: 'hidden',
+    theme: {
+      layout: 'full',
+    },
+  },
+  guides: {
+    title: 'Guides',
+    type: 'page',
+  },
+  components: {
+    title: 'Components',
+    type: 'page',
+  },
+  foundations: {
+    title: 'Foundations',
+    type: 'page',
+  },
+  'eng-onsite-2024': {
+    display: 'hidden',
+    theme: {
+      sidebar: false,
+      pagination: false,
+      toc: false,
+      breadcrumb: false,
+    },
+  },
+}

packages/docs/pages/components/_meta.ts

@@ -0,0 +1,62 @@
+export default {
+  index: { title: 'All Components', theme: { layout: 'full' } },
+  alert: 'Alert',
+  button: 'Button',
+  checkbox: 'Checkbox',
+  collection: 'Collection',
+  'confirmation-modal': 'ConfirmationModal',
+  'contextual-help': 'ContextualHelp',
+  divider: 'Divider',
+  drawer: 'Drawer',
+  'empty-state': 'EmptyState',
+  field: 'Field',
+  filter: 'Filter',
+  heading: 'Heading',
+  'icon-button': 'IconButton',
+  input: 'Input',
+  label: 'Label',
+  link: 'Link',
+  menu: 'Menu',
+  modal: 'Modal',
+  page: 'Page',
+  pagination: 'Pagination',
+  popover: 'Popover',
+  radio: 'Radio',
+  search: 'Search',
+  select: 'Select',
+  skeleton: 'Skeleton',
+  spinner: 'Spinner',
+  tab: 'Tab',
+  table: 'Table',
+  tag: 'Tag',
+  text: 'Text',
+  textarea: 'Textarea',
+  toast: 'Toast',
+  tooltip: 'Tooltip',
+
+  Date: { type: 'separator', title: 'Date' },
+  calendar: 'Calendar',
+  'date-field': 'DateField',
+  'date-picker': 'DatePicker',
+  'date-range-picker': 'DateRangePicker',
+  'date-segment': 'DateSegment',
+  'range-calendar': 'RangeCalendar',
+  'time-input': 'TimeInput',
+
+  Primitives: { type: 'separator', title: 'Primitives' },
+  'accessible-icon': 'AccessibleIcon',
+  clickable: 'Clickable',
+  combobox: 'Combobox',
+  compose: 'Compose',
+  'link-box': 'LinkBox',
+  'locale-provider': 'LocaleProvider',
+  'visually-hidden': 'VisuallyHidden',
+
+  Layout: { type: 'separator', title: 'Layout' },
+  bleed: 'Bleed',
+  center: 'Center',
+  content: 'Content',
+  flex: 'Flex',
+  grid: 'Grid',
+  stack: 'Stack',
+}

packages/docs/pages/components/calendar/_meta.ts

@@ -0,0 +1,7 @@
+export default {
+  'calendar-cell': 'CalendarCell',
+  'calendar-grid': 'CalendarGrid',
+  'calendar-header': 'CalendarHeader',
+  'calendar-provider': 'CalendarProvider',
+  'calendar-title': 'CalendarTitle',
+}

packages/docs/pages/components/checkbox/_meta.ts

@@ -0,0 +1,4 @@
+export default {
+  'best-practices': 'Best Practices',
+  'checkbox-group': 'CheckboxGroup',
+}

packages/docs/pages/components/clickable/_meta.ts

@@ -0,0 +1 @@
+export default { 'clickable-bubble': 'ClickableBubble' }

packages/docs/pages/components/collection/_meta.ts

@@ -0,0 +1,5 @@
+export default {
+  'best-practices': 'Best Practices',
+  'collection-view': 'CollectionView',
+  'collection-row': 'CollectionRow',
+}

packages/docs/pages/components/combobox/_meta.ts

@@ -0,0 +1,6 @@
+export default {
+  'combobox-input': 'ComboboxInput',
+  'combobox-item': 'ComboboxItem',
+  'combobox-list': 'ComboboxList',
+  'combobox-popover': 'ComboboxPopover',
+}