fix(source): type export via rollup plugin by using the correct input (#122)

* fix typeexport via rollup plugin by using the correct input

The rollup plugin dts requires a d.ts tree as input not the txs sources.

This change points the plugin into the right direction and removes the
type export hacks.

* corrected types path

apparently this was not properly adjusted accross the board when moving
the folder

* fix rollup config

properly export types

* use export * where needed

Since we now export types alongside with defintions we use the `export *
from` syntax to simplify things

* export types alongside with interfaces

export types so we can properly use them in external projects alongside
the exported function/module/...

* fix type-problems uncovered by utopia-map

When including types properly in the utopia-map several missing typings
showed up.

* fix typing

fix an inhereted type

* dummy restructure code

to properly be able to compile things we are not allowed to have unsed
parameters/props

* assigne types to category types

package.json

@@ -113,8 +113,8 @@
   "imports": {
     "#components/*": "./src/Components/*",
     "#utils/*": "./src/Utils/*",
+    "#types/*": "./src/types/*",
     "#src/*": "./src/*",
-    "#types/*": "./types/*",
     "#root/*": "./*"
   }
 }

rollup.config.js

@@ -76,17 +76,16 @@ export default [
     ],
   },
   {
-    input: 'src/index.tsx',
+    input: 'dist/types/src/index.d.ts',
     output: [{ file: 'dist/index.d.ts', format: 'es' }],
     plugins: [
       aliasConfig,
       dts({
-        respectExternal: true,
         compilerOptions: {
           skipLibCheck: true,
         },
       }),
     ],
-    external: [/\.css$/, /\.d\.ts$/], // ✅ `.d.ts` als extern behandeln
+    external: [/\.css$/], //, /\.d\.ts$/
   },
 ]

src/Components/AppShell/AppShell.tsx

@@ -4,6 +4,8 @@ import { SetAppState } from './SetAppState'
 
 import type { AssetsApi } from '#types/AssetsApi'
 
+export type { AssetsApi } from '#types/AssetsApi'
+
 /**
  * @category AppShell
  */

src/Components/AppShell/NavBar.tsx

@@ -3,7 +3,7 @@ import { useEffect, useRef, useState } from 'react'
 import { Link, useLocation } from 'react-router-dom'
 import { toast } from 'react-toastify'
 
-import { useAuth } from '#components/Auth'
+import { useAuth } from '#components/Auth/useAuth'
 import { useItems } from '#components/Map/hooks/useItems'
 
 import type { Item } from '#types/Item'

src/Components/AppShell/index.tsx

@@ -1,4 +1,4 @@
-export { AppShell } from './AppShell'
+export * from './AppShell'
 export { SideBar } from './SideBar'
 export { Content } from './Content'
 export { Sitemap } from './Sitemap'

src/Components/Auth/index.tsx

@@ -1,4 +1,4 @@
-export { AuthProvider, useAuth } from './useAuth'
+export { AuthProvider, UserApi, UserItem } from './useAuth'
 export { LoginPage } from './LoginPage'
 export { SignupPage } from './SignupPage'
 export { RequestPasswordPage } from './RequestPasswordPage'

src/Components/Auth/useAuth.tsx

@@ -8,6 +8,9 @@ import { createContext, useState, useContext, useEffect } from 'react'
 import type { UserApi } from '#types/UserApi'
 import type { UserItem } from '#types/UserItem'
 
+export type { UserApi } from '#types/UserApi'
+export type { UserItem } from '#types/UserItem'
+
 interface AuthProviderProps {
   userApi: UserApi
   children?: React.ReactNode

src/Components/Gaming/Quests.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react'
 
-import { useAuth } from '#components/Auth'
+import { useAuth } from '#components/Auth/useAuth'
 import { useItems } from '#components/Map/hooks/useItems'
 
 import { useQuestsOpen, useSetQuestOpen } from './hooks/useQuests'

src/Components/Map/Layer.tsx

@@ -27,6 +27,11 @@ import type { Tag } from '#types/Tag'
 import type { Popup } from 'leaflet'
 import type { ReactElement, ReactNode } from 'react'
 
+export type { Item } from '#types/Item'
+export type { LayerProps } from '#types/LayerProps'
+export type { Tag } from '#types/Tag'
+export type { Popup } from 'leaflet'
+
 /**
  * @category Map
  */

src/Components/Map/Permissions.tsx

@@ -1,6 +1,6 @@
 import { useEffect } from 'react'
 
-import { useAuth } from '#components/Auth'
+import { useAuth } from '#components/Auth/useAuth'
 
 import { useSetPermissionData, useSetPermissionApi, useSetAdminRole } from './hooks/usePermissions'
 
@@ -8,17 +8,20 @@ import type { ItemsApi } from '#types/ItemsApi'
 import type { Permission } from '#types/Permission'
 
 /**
- * @category Map
+ * @category Types
  */
-export function Permissions({
+export interface PermissionsProps {
-  data,
-  api,
-  adminRole,
-}: {
   data?: Permission[]
   api?: ItemsApi<Permission>
   adminRole?: string
-}) {
+}
+export type { Permission } from '#types/Permission'
+export type { ItemsApi } from '#types/ItemsApi'
+
+/**
+ * @category Map
+ */
+export function Permissions({ data, api, adminRole }: PermissionsProps) {
   const setPermissionData = useSetPermissionData()
   const setPermissionApi = useSetPermissionApi()
   const setAdminRole = useSetAdminRole()

src/Components/Map/Subcomponents/Controls/GratitudeControl.tsx

@@ -1,6 +1,6 @@
 import { useNavigate } from 'react-router-dom'
 
-import { useAuth } from '#components/Auth'
+import { useAuth } from '#components/Auth/useAuth'
 
 export const GratitudeControl = () => {
   const navigate = useNavigate()

src/Components/Map/Subcomponents/ItemPopupComponents/TextView.tsx

@@ -27,12 +27,14 @@ export const TextView = ({
   text,
   truncate = false,
   rawText,
+  itemTextField,
 }: {
   item?: Item
-  itemId: string
+  itemId?: string
   text?: string
   truncate?: boolean
   rawText?: string
+  itemTextField?: string
 }) => {
   if (item) {
     text = item.text
@@ -40,6 +42,8 @@ export const TextView = ({
   }
   const tags = useTags()
   const addFilterTag = useAddFilterTag()
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  const itemTextFieldDummy = itemTextField
 
   let innerText = ''
   let replacedText = ''
@@ -125,7 +129,7 @@ export const TextView = ({
   }: {
     children: string
     tag: Tag
-    itemId: string
+    itemId?: string
   }) => {
     return (
       <a

src/Components/Map/index.tsx

@@ -1,7 +1,7 @@
 export { UtopiaMap } from './UtopiaMap'
-export { Layer } from './Layer'
+export * from './Layer'
 export { Tags } from './Tags'
-export { Permissions } from './Permissions'
+export * from './Permissions'
 export { ItemForm } from './ItemForm'
 export { ItemView } from './ItemView'
 export { PopupTextAreaInput } from './Subcomponents/ItemPopupComponents/PopupTextAreaInput'

src/Components/Profile/ProfileForm.tsx

@@ -5,7 +5,7 @@ import { useEffect, useState } from 'react'
 import { useLocation, useNavigate } from 'react-router-dom'
 
 import { useAppState } from '#components/AppShell/hooks/useAppState'
-import { useAuth } from '#components/Auth'
+import { useAuth } from '#components/Auth/useAuth'
 import { useItems, useUpdateItem, useAddItem } from '#components/Map/hooks/useItems'
 import { useLayers } from '#components/Map/hooks/useLayers'
 import { useHasUserPermission } from '#components/Map/hooks/usePermissions'

src/Components/Profile/UserSettings.tsx

@@ -4,7 +4,7 @@ import { useEffect, useState } from 'react'
 import { useNavigate } from 'react-router-dom'
 import { toast } from 'react-toastify'
 
-import { useAuth } from '#components/Auth'
+import { useAuth } from '#components/Auth/useAuth'
 import { TextInput } from '#components/Input'
 import { MapOverlayPage } from '#components/Templates'
 

src/Components/Profile/index.tsx

@@ -1,4 +1,4 @@
 export { UserSettings } from './UserSettings'
-export { PlusButton } from './Subcomponents/PlusButton'
+// export { PlusButton } from './Subcomponents/PlusButton'
 export { ProfileView } from './ProfileView'
 export { ProfileForm } from './ProfileForm'

src/Components/Templates/OverlayItemsIndexPage.tsx

@@ -33,14 +33,18 @@ import type { Item } from '#types/Item'
 export const OverlayItemsIndexPage = ({
   url,
   layerName,
+  parameterField,
   plusButton = true,
 }: {
   layerName: string
   url: string
+  parameterField?: string
   plusButton?: boolean
 }) => {
   const [loading, setLoading] = useState<boolean>(false)
   const [addItemPopupType, setAddItemPopupType] = useState<string>('')
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  const parameterFieldDummy = parameterField
 
   const tabRef = useRef<HTMLFormElement>(null)
 

src/index.tsx

@@ -1,43 +1,12 @@
 import './index.css'
 
-export {
+export * from './Components/Map'
-  UtopiaMap,
+export * from './Components/AppShell'
-  Layer,
+export * from './Components/Auth'
-  Tags,
+export * from './Components/Profile'
-  Permissions,
+export * from './Components/Gaming'
-  ItemForm,
+export * from './Components/Templates'
-  ItemView,
+export * from './Components/Input'
-  PopupTextAreaInput,
-  PopupStartEndInput,
-  PopupTextInput,
-  PopupButton,
-  TextView,
-  StartEndView,
-  PopupCheckboxInput,
-} from './Components/Map'
-export { AppShell, Content, SideBar, Sitemap } from './Components/AppShell'
-export {
-  AuthProvider,
-  LoginPage,
-  SignupPage,
-  RequestPasswordPage,
-  SetNewPasswordPage,
-} from './Components/Auth'
-export { UserSettings, ProfileView, ProfileForm } from './Components/Profile'
-export { Quests, Modal } from './Components/Gaming'
-export {
-  TitleCard,
-  CardPage,
-  MapOverlayPage,
-  OverlayItemsIndexPage,
-  MoonCalendar,
-  SelectUser,
-  AttestationForm,
-  MarketView,
-} from './Components/Templates'
-export { TextInput, TextAreaInput, SelectBox } from './Components/Input'
-
-export * from './types'
 
 declare global {
   interface Window {

src/types/AssetsApi.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @category Types
+ */
 export interface AssetsApi {
   upload(file: Blob, title: string): Promise<{ id: string }>
   url: string

src/types/Item.d.ts

@@ -15,6 +15,9 @@ interface GalleryItem {
   }
 }
 
+/**
+ * @category Types
+ */
 export interface Item {
   id: string
   name: string

src/types/ItemType.d.ts

@@ -2,14 +2,18 @@ import type { Key } from 'react'
 
 export interface ItemType {
   name: string
+  show_name_input: boolean
+  show_profile_button: boolean
   show_start_end: boolean
+  show_start_end_input: boolean
   show_text: boolean
+  show_text_input: boolean
+  custom_text: string
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   profileTemplate: { collection: string | number; id: Key | null | undefined; item: any }[]
   offers_and_needs: boolean
   icon_as_labels: unknown
   relations: boolean
   template: string
-  show_start_end_input: boolean
   questlog: boolean
 }

src/types/ItemsApi.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @category Types
+ */
 export interface ItemsApi<T> {
   getItems(): Promise<T[]>
   getItem?(id: string): Promise<T>

src/types/LayerProps.d.ts

@@ -3,6 +3,9 @@ import type { ItemFormPopupProps } from './ItemFormPopupProps'
 import type { ItemsApi } from './ItemsApi'
 import type { ItemType } from './ItemType'
 
+/**
+ * @category Types
+ */
 export interface LayerProps {
   id?: string
   data?: Item[]

src/types/Permission.d.ts

@@ -1,6 +1,9 @@
 import type { PermissionAction } from './PermissionAction'
 import type { PermissionCondition } from './PermissionCondition'
 
+/**
+ * @category Types
+ */
 export interface Permission {
   id?: string
   policy?: { name: string }

src/types/Tag.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @category Types
+ */
 export interface Tag {
   color: string
   id: string

src/types/UserApi.d.ts

@@ -1,5 +1,8 @@
 import type { UserItem } from './UserItem'
 
+/**
+ * @category Types
+ */
 export interface UserApi {
   register(email: string, password: string, userName: string): Promise<void>
   login(email: string, password: string): Promise<UserItem | undefined>

src/types/UserItem.d.ts

@@ -1,5 +1,8 @@
 import type { Profile } from './Profile'
 
+/**
+ * @category Types
+ */
 export interface UserItem {
   id?: string
   // eslint-disable-next-line @typescript-eslint/no-explicit-any

src/types/index.ts

@@ -1,9 +0,0 @@
-export type { ItemsApi } from './ItemsApi'
-export type { Tag } from './Tag'
-export type { Item } from './Item'
-export type { Permission } from './Permission'
-export type { LayerProps } from './LayerProps'
-export type { UserApi } from './UserApi'
-export type { UserItem } from './UserItem'
-export type { UtopiaMapProps } from './UtopiaMapProps'
-export type { AssetsApi } from './AssetsApi'

tsconfig.json

@@ -22,15 +22,15 @@
       "paths": {
         "#components/*": ["./src/Components/*"],
         "#utils/*": ["./src/Utils/*"],
-        "#src/*": ["./src/*"],
         "#types/*": ["./src/types/*"],
+        "#src/*": ["./src/*"],
         "#root/*": ["./*"]
       }
     },
   "include": ["src", "vite.config.ts", "setupTest.ts", "cypress.config.ts", "cypress/support/commands.ts", "cypress/support/component.ts"],
   "exclude": ["node_modules", "dist", "example", "rollup.config.mjss"],
   "typeRoots": [
-    "./types",
+    "./src/types",
     "./node_modules/@types/"
   ]
 }