utopia-ui 3.0.82 → 3.0.84

package/dist/index.d.ts

@@ -1,40 +1,71 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { GeoJsonObject, Geometry, Point } from 'geojson';
 export { Point } from 'geojson';
-import { LatLng } from 'leaflet';
-export { Popup } from 'leaflet';
+import * as react from 'react';
 import { Key } from 'react';
 export { default as SVG } from 'react-inlinesvg';
+export { Popup } from 'leaflet';
 
 /**
- * @category Types
- */
-interface Tag {
-  color: string
-  id: string
-  name: string
-  offer_or_need?: boolean
-}
-
-interface UtopiaMapProps {
-  height?: string
-  width?: string
-  center?: [number, number]
-  zoom?: number
-  tags?: Tag[]
-  children?: React.ReactNode
-  geo?: GeoJsonObject
-  showFilterControl?: boolean
-  showLayerControl?: boolean
-  showGratitudeControl?: boolean
-  infoText?: string
-  donationWidget?: boolean
-}
-
-/**
+ * This component creates the map.
+ * ```tsx
+ *   <UtopiaMap center={[50.6, 9.5]} zoom={5} height="100dvh" width="100dvw" />
+ *  ```
+ * You can define its {@link Layer | `Layers`}  as supcomponents.
+ * ```tsx
+ *     <UtopiaMap center={[50.6, 15.5]} zoom={5} height="100dvh" width="100dvw">
+ *       <Layer
+ *         name="events"
+ *         markerIcon="calendar"
+ *         markerShape="square"
+ *         markerDefaultColor="#700"
+ *         data={events}
+ *       />
+ *       <Layer
+ *         name="places"
+ *         markerIcon="point"
+ *         markerShape="circle"
+ *         markerDefaultColor="#007"
+ *         data={places}
+ *       />
+ *     </UtopiaMap>
+ *  ```
+ * You can also pass {@link Tags | `Tags`}  or {@link Permissions | `Permissions`}  as subcomponents.
+ * ```tsx
+ *     <UtopiaMap center={[50.6, 15.5]} zoom={5} height="100dvh" width="100dvw">
+ *       ...
+ *       <Tags data={tags} />
+ *       <Permissions data={permissions} />
+ *     </UtopiaMap>
+ * ```
  * @category Map
  */
-declare function UtopiaMap({ height, width, center, zoom, children, geo, showFilterControl, showGratitudeControl, showLayerControl, infoText, donationWidget, }: UtopiaMapProps): react_jsx_runtime.JSX.Element;
+declare function UtopiaMap({ height, width, center, zoom, children, geo, showFilterControl, showGratitudeControl, showLayerControl, showThemeControl, defaultTheme, donationWidget, }: {
+    /** height of the map (default '500px') */
+    height?: string;
+    /** width of the map (default '100%') */
+    width?: string;
+    /** initial centered position of the map (default [50.6, 9.5]) */
+    center?: [number, number];
+    /** initial zoom level of the map (default 10) */
+    zoom?: number;
+    /** React child-components */
+    children?: React.ReactNode;
+    /** GeoJSON to display on the map */
+    geo?: GeoJsonObject;
+    /** show the filter control widget (default false) */
+    showFilterControl?: boolean;
+    /** show the gratitude control widget (default false) */
+    showLayerControl?: boolean;
+    /** show the layer control widget (default true) */
+    showGratitudeControl?: boolean;
+    /** show a widget to switch the theme */
+    showThemeControl?: boolean;
+    /** the defaut theme */
+    defaultTheme?: string;
+    /** ask to donate to the Utopia Project OpenCollective campaign (default false) */
+    donationWidget?: boolean;
+}): react_jsx_runtime.JSX.Element;
 
 /**
  * @category Types
@@ -125,6 +156,7 @@ interface Item {
   telephone?: string
   next_appointment?: string
   gallery?: GalleryItem[]
+  openCollectiveSlug?: string
 
   // {
   // coordinates: [number, number]
@@ -145,14 +177,6 @@ interface Item {
   } */
 }
 
-interface ItemFormPopupProps {
-  position: LatLng
-  layer: LayerProps
-  item?: Item
-  children?: React.ReactNode
-  setItemFormPopup?: React.Dispatch<React.SetStateAction<ItemFormPopupProps | null>>
-}
-
 interface ItemType {
   name: string
   show_name_input: boolean
@@ -194,20 +218,79 @@ interface LayerProps {
   public_edit_items?: boolean
   listed?: boolean
   item_presets?: Record<string, unknown>
-  setItemFormPopup?: React.Dispatch<React.SetStateAction<ItemFormPopupProps | null>>
-  itemFormPopup?: ItemFormPopupProps | null
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  clusterRef?: any
 }
 
 /**
- * @category Map
+ * Tags are used to tag items within the app and the map and to filter by keywords. Every tag has a color.
+ * @example
+ * ```ts
+ * export const tags: Tag[] = [
+ *  { 
+ *   "id": "e19f46a7-77a4-4a50-99a2-a942dce843a3",
+ *   "name": "nature",
+ *   "color": "#9bc53d"
+ * },
+ * {
+ *   "id": "2c2099a6-23ac-4308-b91c-86eefeff3a1d",
+ *   "name": "utopia",
+ *   "color": "#c3423f"
+ * },
+ * {
+ *   "id": "48b2de97-2b9e-432b-b230-7bdc9a5fb6c0",
+ *   "name": "map",
+ *   "color": "#5bc0eb"
+ * },
+ * {
+ *   "id": "c88f52e6-357b-45fb-a171-9c2b1dceeb8e",
+ *   "name": "food",
+ *   "color": "#6761a8"
+ * },
+ * {
+ *   "id": "8928cb92-a3c1-4d83-9495-c2eb4fac0bbe",
+ *   "name": "permaculture",
+ *   "color": "#44344f"
+ * },
+ *];
+```
+ * @category Types
  */
-declare const Layer: ({ data, children, name, menuIcon, menuText, menuColor, markerIcon, markerShape, markerDefaultColor, markerDefaultColor2, api, itemType, userProfileLayer, customEditLink, customEditParameter, public_edit_items, listed, setItemFormPopup, itemFormPopup, clusterRef, }: LayerProps) => react_jsx_runtime.JSX.Element;
+interface Tag {
+  color: string
+  id: string
+  name: string
+  offer_or_need?: boolean
+}
 
 /**
  * @category Map
  */
+declare const Layer: ({ data, children, name, menuIcon, menuText, menuColor, markerIcon, markerShape, markerDefaultColor, markerDefaultColor2, api, itemType, userProfileLayer, customEditLink, customEditParameter, public_edit_items, listed, }: LayerProps) => react_jsx_runtime.JSX.Element;
+
+/**
+ * This Components injects Tags comming from an {@link ItemsApi | `API`}
+ * ```tsx
+ * <Tags api={tagsApi} />
+ * ```
+ * or from on {@link Tag| `Array`}
+ * ```tsx
+ * <Tags data={tags} />
+ * ```
+ * Can be child of {@link AppShell | `AppShell`}
+ * ```tsx
+ * <AppShell>
+ *     ...
+ *     <Tags api={tagsApi} />
+ * </AppShell>
+ *  ```
+ * Or child of {@link UtopiaMap | `UtopiaMap`}
+ * ```tsx
+ * <UtopiaMap>
+ *     ...
+ *     <Tags api={tagsApi} />
+ * </UtopiaMap>
+ * ```
+ * @category Map
+ */
 declare function Tags({ data, api }: {
     data?: Tag[];
     api?: ItemsApi<Tag>;
@@ -239,111 +322,38 @@ interface Permission {
 }
 
 /**
- * @category Types
+ * This Components injects Permissions comming from an {@link ItemsApi | `API`}
+ * ```tsx
+ * <Permissions api={itemsApiInstance} adminRole="8141dee8-8e10-48d0-baf1-680aea271298" />
+ * ```
+ * or from on {@link Permission| `Array`}
+ * ```tsx
+ * <Permissions data={permissions} adminRole="8141dee8-8e10-48d0-baf1-680aea271298" />
+ * ```
+ * Can be child of {@link AppShell | `AppShell`}
+ * ```tsx
+ * <AppShell>
+ *     ...
+ *     <Permissions api={itemsApiInstance} adminRole="8141dee8-8e10-48d0-baf1-680aea271298" />
+ * </AppShell>
+ *  ```
+ * Or child of {@link UtopiaMap | `UtopiaMap`}
+ * ```tsx
+ * <UtopiaMap>
+ *     ...
+ *     <Permissions api={itemsApiInstance} adminRole="8141dee8-8e10-48d0-baf1-680aea271298" />
+ * </UtopiaMap>
+ * ```
+ * @category Map
  */
-interface PermissionsProps {
+declare function Permissions({ data, api, adminRole, }: {
+    /** Array with all the permissions inside */
     data?: Permission[];
+    /** API to fetch all the permissions from a server */
     api?: ItemsApi<Permission>;
+    /** UUID of the admin role which has always all the permissions */
     adminRole?: string;
-}
-
-/**
- * @category Map
- */
-declare function Permissions({ data, api, adminRole }: PermissionsProps): react_jsx_runtime.JSX.Element;
-
-/**
- * @category Map
- */
-declare const ItemForm: {
-    ({ children, item, title, setPopupTitle, }: {
-        children?: React.ReactNode;
-        item?: Item;
-        title?: string;
-        setPopupTitle?: React.Dispatch<React.SetStateAction<string>>;
-    }): react_jsx_runtime.JSX.Element;
-    __TYPE: string;
-};
-
-/**
- * @category Map
- */
-declare const ItemView: {
-    ({ children, item }: {
-        children?: React.ReactNode;
-        item?: Item;
-    }): react_jsx_runtime.JSX.Element;
-    __TYPE: string;
-};
-
-/**
- * @category Map
- */
-declare const PopupTextAreaInput: ({ dataField, placeholder, style, item, }: {
-    dataField: string;
-    placeholder: string;
-    style?: string;
-    item?: Item;
-}) => react_jsx_runtime.JSX.Element;
-
-interface StartEndInputProps {
-    item?: Item;
-    showLabels?: boolean;
-    updateStartValue?: (value: string) => void;
-    updateEndValue?: (value: string) => void;
-}
-/**
- * @category Map
- */
-declare const PopupStartEndInput: ({ item, showLabels, updateStartValue, updateEndValue, }: StartEndInputProps) => react_jsx_runtime.JSX.Element;
-
-/**
- * @category Map
- */
-declare const PopupTextInput: ({ dataField, placeholder, style, item, }: {
-    dataField: string;
-    placeholder: string;
-    style?: string;
-    item?: Item;
-}) => react_jsx_runtime.JSX.Element;
-
-/**
- * @category Map
- */
-declare const PopupCheckboxInput: ({ dataField, label, item, }: {
-    dataField: string;
-    label: string;
-    item?: Item;
-}) => react_jsx_runtime.JSX.Element;
-
-/**
- * @category Map
- */
-declare const TextView: ({ item, itemId, text, truncate, rawText, itemTextField, }: {
-    item?: Item;
-    itemId?: string;
-    text?: string;
-    truncate?: boolean;
-    rawText?: string;
-    itemTextField?: string;
-}) => react_jsx_runtime.JSX.Element;
-
-/**
- * @category Map
- */
-declare const StartEndView: ({ item }: {
-    item?: Item;
-}) => react_jsx_runtime.JSX.Element;
-
-/**
- * @category Map
- */
-declare const PopupButton: ({ url, parameterField, text, item, }: {
-    url: string;
-    parameterField?: string;
-    text: string;
-    item?: Item;
-}) => react_jsx_runtime.JSX.Element;
+}): react_jsx_runtime.JSX.Element;
 
 /**
  * @category Types
@@ -356,11 +366,12 @@ interface AssetsApi {
 /**
  * @category AppShell
  */
-declare function AppShell({ appName, children, assetsApi, embedded, }: {
+declare function AppShell({ appName, children, assetsApi, embedded, openCollectiveApiKey, }: {
     appName: string;
     children: React.ReactNode;
     assetsApi: AssetsApi;
     embedded?: boolean;
+    openCollectiveApiKey?: string;
 }): react_jsx_runtime.JSX.Element;
 
 interface Route {
@@ -559,6 +570,63 @@ interface InputTextProps {
  */
 declare function TextInput({ labelTitle, labelStyle, type, dataField, containerStyle, inputStyle, defaultValue, placeholder, autocomplete, pattern, required, updateFormValue, }: InputTextProps): react_jsx_runtime.JSX.Element;
 
+interface StartEndInputProps {
+    item?: Item;
+    showLabels?: boolean;
+    updateStartValue?: (value: string) => void;
+    updateEndValue?: (value: string) => void;
+}
+
+/**
+ * @category Item
+ */
+declare const PopupForm: ({ children }: {
+    children?: React.ReactNode;
+}) => react_jsx_runtime.JSX.Element;
+
+/**
+ * @category Item
+ */
+declare const PopupView: ({ children }: {
+    children?: React.ReactNode;
+}) => (react_jsx_runtime.JSX.Element | null)[];
+
+declare const TextView: react.ComponentType<Omit<{
+    item?: Item;
+    itemId?: string;
+    text?: string;
+    truncate?: boolean;
+    rawText?: string;
+    itemTextField?: string;
+}, "item">>;
+declare const StartEndView: react.ComponentType<Omit<{
+    item?: Item;
+}, "item">>;
+declare const PopupTextInput: react.ComponentType<Omit<{
+    dataField: string;
+    placeholder: string;
+    style?: string;
+    item?: Item;
+}, "item">>;
+declare const PopupButton: react.ComponentType<Omit<{
+    url: string;
+    parameterField?: string;
+    text: string;
+    item?: Item;
+}, "item">>;
+declare const PopupCheckboxInput: react.ComponentType<Omit<{
+    dataField: string;
+    label: string;
+    item?: Item;
+}, "item">>;
+declare const PopupTextAreaInput: react.ComponentType<Omit<{
+    dataField: string;
+    placeholder: string;
+    style?: string;
+    item?: Item;
+}, "item">>;
+declare const PopupStartEndInput: react.ComponentType<Omit<StartEndInputProps, "item">>;
+
 declare global {
     interface Window {
         my_modal_3: {
@@ -567,4 +635,4 @@ declare global {
     }
 }
 
-export { AppShell, type AssetsApi, AttestationForm, AuthProvider, CardPage, Content, type Item, ItemForm, ItemView, type ItemsApi, Layer, type LayerProps, LoginPage, MapOverlayPage, MarketView, Modal, OverlayItemsIndexPage, type Permission, Permissions, type PermissionsProps, PopupButton, PopupCheckboxInput, PopupStartEndInput, PopupTextAreaInput, PopupTextInput, ProfileForm, ProfileView, Quests, RequestPasswordPage, SelectUser, SetNewPasswordPage, SideBar, SignupPage, StartEndView, type Tag, Tags, TextAreaInput, TextInput, TextView, TitleCard, type UserApi, type UserItem, UserSettings, UtopiaMap };
+export { AppShell, type AssetsApi, AttestationForm, AuthProvider, CardPage, Content, type Item, type ItemsApi, Layer, type LayerProps, LoginPage, MapOverlayPage, MarketView, Modal, OverlayItemsIndexPage, type Permission, Permissions, PopupButton, PopupCheckboxInput, PopupForm, PopupStartEndInput, PopupTextAreaInput, PopupTextInput, PopupView, ProfileForm, ProfileView, Quests, RequestPasswordPage, SelectUser, SetNewPasswordPage, SideBar, SignupPage, StartEndView, type Tag, Tags, TextAreaInput, TextInput, TextView, TitleCard, type UserApi, type UserItem, UserSettings, UtopiaMap };