utopia-ui 3.0.60 → 3.0.62

package/dist/index.cjs

@@ -434,6 +434,7 @@ function useItemsManager(initialItems) {
             },
         });
         result.map((item) => {
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
             dispatch({ type: 'ADD', item: { ...item, layer } });
             return null;
         });
@@ -582,6 +583,9 @@ const AuthContext = react.createContext({
     requestPasswordReset: () => Promise.reject(Error('Unimplemented')),
     passwordReset: () => Promise.reject(Error('Unimplemented')),
 });
+/**
+ * @category Auth
+ */
 const AuthProvider = ({ userApi, children }) => {
     const [user, setUser] = react.useState(null);
     const [token, setToken] = react.useState(null);
@@ -926,22 +930,6 @@ const useSetMapClicked = () => {
     return setMapClicked;
 };
 
-/* eslint-disable @typescript-eslint/no-unsafe-assignment */
-/* eslint-disable @typescript-eslint/no-unsafe-return */
-/* eslint-disable @typescript-eslint/no-unsafe-member-access */
-function getValue(obj, path) {
-    if (!obj || typeof path !== 'string')
-        return undefined;
-    const pathArray = path.split('.'); // Use a different variable for the split path
-    for (let i = 0, len = pathArray.length; i < len; i++) {
-        if (!obj)
-            return undefined; // Check if obj is falsy at each step
-        // eslint-disable-next-line security/detect-object-injection
-        obj = obj[pathArray[i]]; // Dive one level deeper
-    }
-    return obj; // Return the final value
-}
-
 const hashTagRegex = /(#+[a-zA-Z0-9À-ÖØ-öø-ʸ_-]{1,})/g;
 
 const TagContext = react.createContext({
@@ -1005,7 +993,7 @@ function useTagsManager(initialTags) {
         }
     };
     const getItemTags = react.useCallback((item) => {
-        const text = item.layer?.itemTextField && item ? getValue(item, item.layer.itemTextField) : undefined;
+        const text = item.text;
         const itemTagStrings = text?.match(hashTagRegex);
         const itemTags = [];
         itemTagStrings?.map((tag) => {
@@ -1014,18 +1002,15 @@ function useTagsManager(initialTags) {
             }
             return null;
         });
-        item.layer?.itemOffersField &&
-            getValue(item, item.layer.itemOffersField)?.map((o) => {
-                const offer = tags.find((t) => t.id === o.tags_id);
-                offer && itemTags.push(offer);
-                return null;
-            });
-        item.layer?.itemNeedsField &&
-            getValue(item, item.layer.itemNeedsField)?.map((n) => {
-                const need = tags.find((t) => t.id === n.tags_id);
-                need && itemTags.push(need);
-                return null;
-            });
+        // Could be refactored as it occurs in multiple places
+        item.offers?.forEach((o) => {
+            const offer = tags.find((t) => t.id === o.tags_id);
+            offer && itemTags.push(offer);
+        });
+        item.needs?.forEach((n) => {
+            const need = tags.find((t) => t.id === n.tags_id);
+            need && itemTags.push(need);
+        });
         return itemTags;
     }, [tags]);
     return { tags, addTag, setTagApi, setTagData, getItemTags, allTagsLoaded };
@@ -1185,6 +1170,9 @@ function FilterControl() {
                     }, children: jsxRuntime.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', fill: 'none', viewBox: '0 0 24 24', strokeWidth: 2.3, stroke: 'currentColor', className: 'size-6', children: jsxRuntime.jsx("path", { strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M12 3c2.755 0 5.455.232 8.083.678.533.09.917.556.917 1.096v1.044a2.25 2.25 0 0 1-.659 1.591l-5.432 5.432a2.25 2.25 0 0 0-.659 1.591v2.927a2.25 2.25 0 0 1-1.244 2.013L9.75 21v-6.568a2.25 2.25 0 0 0-.659-1.591L3.659 7.409A2.25 2.25 0 0 1 3 5.818V4.774c0-.54.384-1.006.917-1.096A48.32 48.32 0 0 1 12 3Z' }) }) })] })) }));
 }
 
+/**
+ * @category Templates
+ */
 function MapOverlayPage({ children, className, backdrop, card = true, }) {
     const closeScreen = () => {
         navigate(`/${window.location.search ? window.location.search : ''}`);
@@ -1206,6 +1194,9 @@ function MapOverlayPage({ children, className, backdrop, card = true, }) {
     return (jsxRuntime.jsx("div", { className: `tw-absolute tw-h-full tw-w-full tw-m-auto ${backdrop && 'tw-z-[2000]'}`, children: jsxRuntime.jsx("div", { ref: backdropRef, className: `${backdrop && 'tw-backdrop-brightness-75'} tw-h-full tw-w-full tw-grid tw-place-items-center tw-m-auto`, children: jsxRuntime.jsxs("div", { ref: overlayRef, className: `${card && 'tw-card tw-card-body'} tw-shadow-xl tw-bg-base-100 tw-p-6 ${className && className} ${!backdrop && 'tw-z-[2000]'} tw-absolute tw-top-0 tw-bottom-0 tw-right-0 tw-left-0 tw-m-auto`, children: [children, jsxRuntime.jsx("button", { className: 'tw-btn tw-btn-sm tw-btn-circle tw-btn-ghost tw-absolute tw-right-2 tw-top-2', onClick: () => closeScreen(), children: "\u2715" })] }) }) }));
 }
 
+/**
+ * @category Auth
+ */
 function LoginPage() {
     const [email, setEmail] = react.useState('');
     const [password, setPassword] = react.useState('');
@@ -1248,6 +1239,9 @@ function LoginPage() {
                         : 'tw-btn tw-btn-primary tw-btn-block', onClick: () => onLogin(), children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Login' }) })] }));
 }
 
+/**
+ * @category Auth
+ */
 function SignupPage() {
     const [email, setEmail] = react.useState('');
     const [userName, setUserName] = react.useState('');
@@ -1291,6 +1285,9 @@ function SignupPage() {
                         : 'tw-btn tw-btn-primary tw-btn-block', onClick: () => onRegister(), children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Sign Up' }) })] }));
 }
 
+/**
+ * @category Auth
+ */
 // eslint-disable-next-line react/prop-types
 function RequestPasswordPage({ resetUrl }) {
     const [email, setEmail] = react.useState('');
@@ -1319,6 +1316,9 @@ function RequestPasswordPage({ resetUrl }) {
                         : 'tw-btn tw-btn-primary tw-btn-block', onClick: () => onReset(), children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Send' }) })] }));
 }
 
+/**
+ * @category Auth
+ */
 function SetNewPasswordPage() {
     const [password, setPassword] = react.useState('');
     const { passwordReset, loading } = useAuth();
@@ -2519,13 +2519,9 @@ const SearchControl = () => {
         };
         searchGeo();
         setItemsResults(items.filter((item) => {
-            if (item.layer?.itemNameField)
-                item.name = getValue(item, item.layer.itemNameField);
-            if (item.layer?.itemTextField)
-                item.text = getValue(item, item.layer.itemTextField);
             return (value.length > 2 &&
                 ((item.layer?.listed && item.name.toLowerCase().includes(value.toLowerCase())) ||
-                    item.text.toLowerCase().includes(value.toLowerCase())));
+                    item.text?.toLowerCase().includes(value.toLowerCase())));
         }));
         let phrase = value;
         if (value.startsWith('#'))
@@ -2631,11 +2627,14 @@ const TagsControl = () => {
     return (jsxRuntime.jsx("div", { className: 'tw-flex tw-flex-wrap tw-mt-4 tw-w-[calc(100vw-2rem)] tw-max-w-xs', children: filterTags.map((tag) => (jsxRuntime.jsxs("div", { className: 'tw-rounded-2xl tw-text-white tw-p-2 tw-px-4 tw-shadow-xl tw-card tw-mr-2 tw-mb-2', style: { backgroundColor: tag.color }, children: [jsxRuntime.jsx("div", { className: 'tw-card-actions tw-justify-end', children: jsxRuntime.jsx("label", { className: 'tw-btn tw-btn-xs tw-btn-circle tw-absolute tw--right-2 tw--top-2 tw-bg-white tw-text-gray-600', onClick: () => removeFilterTag(tag.name), children: "\u2715" }) }), jsxRuntime.jsxs("b", { children: ["#", decodeTag(tag.name)] })] }, tag.id))) }));
 };
 
-const PopupButton = ({ url, parameterField, text, colorField, item, }) => {
+/**
+ * @category Map
+ */
+const PopupButton = ({ url, parameterField, text, item, }) => {
     const params = new URLSearchParams(window.location.search);
     const getItemTags = useGetItemTags();
-    return (jsxRuntime.jsx(reactRouterDom.Link, { to: `${url}/${parameterField ? getValue(item, parameterField) : ''}?${params}`, children: jsxRuntime.jsx("button", { style: {
-                backgroundColor: `${colorField && getValue(item, colorField) ? getValue(item, colorField) : item && getItemTags(item) && getItemTags(item)[0] && getItemTags(item)[0].color ? getItemTags(item)[0].color : item?.layer?.markerDefaultColor ? item?.layer?.markerDefaultColor : '#000'}`,
+    return (jsxRuntime.jsx(reactRouterDom.Link, { to: `${url}/${parameterField ? item?.id : ''}?${params}`, children: jsxRuntime.jsx("button", { style: {
+                backgroundColor: `${item?.color ?? (item && (getItemTags(item) && getItemTags(item)[0] && getItemTags(item)[0].color ? getItemTags(item)[0].color : (item?.layer?.markerDefaultColor ?? '#000')))}`,
             }, className: 'tw-btn tw-text-white tw-btn-sm tw-float-right tw-mt-1', children: text }) }));
 };
 
@@ -2654,24 +2653,28 @@ function fixUrls(message) {
     return message;
 }
 
-const TextView = ({ item, truncate = false, itemTextField, rawText, }) => {
+/**
+ * @category Map
+ */
+const TextView = ({ item, itemId, text, truncate = false, rawText, itemTextField, }) => {
+    if (item) {
+        text = item.text;
+        itemId = item.id;
+    }
     const tags = useTags();
     const addFilterTag = useAddFilterTag();
-    let text = '';
+    let innerText = '';
     let replacedText = '';
     if (rawText) {
-        text = replacedText = rawText;
-    }
-    else if (itemTextField && item) {
-        text = getValue(item, itemTextField);
+        innerText = replacedText = rawText;
     }
-    else {
-        text = item?.layer?.itemTextField && item ? getValue(item, item.layer.itemTextField) : '';
+    else if (text) {
+        innerText = text;
     }
-    if (item && text && truncate)
-        text = truncateText(removeMarkdownKeepLinksAndParagraphs(text), 100);
-    if (item && text)
-        replacedText = fixUrls(text);
+    if (innerText && truncate)
+        innerText = truncateText(removeMarkdownKeepLinksAndParagraphs(innerText), 100);
+    if (innerText)
+        replacedText = fixUrls(innerText);
     if (replacedText) {
         replacedText = replacedText.replace(/(?<!\]?\()https?:\/\/[^\s)]+(?!\))/g, (url) => {
             let shortUrl = url;
@@ -2707,11 +2710,11 @@ const TextView = ({ item, truncate = false, itemTextField, rawText, }) => {
     // eslint-disable-next-line react/prop-types
     const CustomImage = ({ alt, src, title }) => (jsxRuntime.jsx("img", { className: 'tw-max-w-full tw-rounded tw-shadow', src: src, alt: alt, title: title }));
     const CustomExternalLink = ({ href, children }) => (jsxRuntime.jsxs("a", { className: 'tw-font-bold tw-underline', href: href, target: '_blank', rel: 'noreferrer', children: [' ', children] }));
-    const CustomHashTagLink = ({ children, tag, item, }) => {
+    const CustomHashTagLink = ({ children, tag, itemId, }) => {
         return (jsxRuntime.jsx("a", { style: { color: tag ? tag.color : '#faa', fontWeight: 'bold', cursor: 'pointer' }, onClick: (e) => {
                 e.stopPropagation();
                 addFilterTag(tag);
-            }, children: decodeTag(children) }, tag ? tag.name + item?.id : item?.id));
+            }, children: decodeTag(children) }, tag ? tag.name + itemId : itemId));
     };
     // eslint-disable-next-line react/display-name
     const MemoizedVideoEmbed = react.memo(({ url }) => (jsxRuntime.jsx("iframe", { className: 'tw-w-full', src: url, allow: 'fullscreen;  picture-in-picture', allowFullScreen: true })));
@@ -2733,7 +2736,7 @@ const TextView = ({ item, truncate = false, itemTextField, rawText, }) => {
                     console.log(tags);
                     const tag = tags.find((t) => t.name.toLowerCase() === decodeURI(href).slice(1).toLowerCase());
                     if (tag)
-                        return (jsxRuntime.jsx(CustomHashTagLink, { tag: tag, item: item, children: children }));
+                        return (jsxRuntime.jsx(CustomHashTagLink, { tag: tag, itemId: itemId, children: children }));
                     else
                         return children;
                 }
@@ -2813,7 +2816,7 @@ function UtopiaMapInner({ children, geo, showFilterControl = false, showGratitud
         if (!init.current) {
             donationWidget &&
                 setTimeout(() => {
-                    reactToastify.toast(jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(TextView, { rawText: '## Do you like this Map?' }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(TextView, { rawText: 'Support us building free opensource maps and help us grow 🌱☀️' }), jsxRuntime.jsx(PopupButton, { url: 'https://opencollective.com/utopia-project', text: 'Donate' })] })] }), { autoClose: false });
+                    reactToastify.toast(jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(TextView, { itemId: '', rawText: '## Do you like this Map?' }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(TextView, { itemId: '', rawText: 'Support us building free opensource maps and help us grow 🌱☀️' }), jsxRuntime.jsx(PopupButton, { url: 'https://opencollective.com/utopia-project', text: 'Donate' })] })] }), { autoClose: false });
                 }, 600000);
             init.current = true;
         }
@@ -2844,8 +2847,6 @@ function UtopiaMapInner({ children, geo, showFilterControl = false, showGratitud
                 let title = '';
                 if (item?.name)
                     title = item.name;
-                else if (item?.layer?.itemNameField)
-                    title = getValue(item, item.layer.itemNameField);
                 document.title = `${document.title.split('-')[0]} - ${title}`;
             }
         },
@@ -2868,15 +2869,13 @@ function UtopiaMapInner({ children, geo, showFilterControl = false, showGratitud
                     let title = '';
                     if (ref.item.name)
                         title = ref.item.name;
-                    else if (ref.item.layer?.itemNameField)
-                        title = getValue(ref.item.name, ref.item.layer.itemNameField);
                     document.title = `${document.title.split('-')[0]} - ${title}`;
                     document
                         .querySelector('meta[property="og:title"]')
                         ?.setAttribute('content', ref.item.name);
                     document
                         .querySelector('meta[property="og:description"]')
-                        ?.setAttribute('content', ref.item.text);
+                        ?.setAttribute('content', ref.item.text ?? '');
                 }
             }
         }
@@ -2913,6 +2912,9 @@ function UtopiaMapInner({ children, geo, showFilterControl = false, showGratitud
                 } })), jsxRuntime.jsx(MapEventListener, {}), jsxRuntime.jsx(AddButton, { triggerAction: setSelectNewItemPosition }), selectNewItemPosition != null && (jsxRuntime.jsx(SelectPosition, { setSelectNewItemPosition: setSelectNewItemPosition }))] }));
 }
 
+/**
+ * @category Map
+ */
 function UtopiaMap({ height = '500px', width = '100%', center = [50.6, 9.5], zoom = 10, children, geo, showFilterControl = false, showGratitudeControl = false, showLayerControl = true, infoText, donationWidget, }) {
     return (jsxRuntime.jsx(ContextWrapper, { children: jsxRuntime.jsx(reactLeaflet.MapContainer, { style: { height, width }, center: new leaflet.LatLng(center[0], center[1]), zoom: zoom, zoomControl: false, maxZoom: 19, children: jsxRuntime.jsx(UtopiaMapInner, { geo: geo, showFilterControl: showFilterControl, showGratitudeControl: showGratitudeControl, showLayerControl: showLayerControl, infoText: infoText, donationWidget: donationWidget, children: children }) }) }));
 }
@@ -2975,6 +2977,9 @@ const rgbToHex = (r, g, b) => '#' +
     })
         .join('');
 
+/**
+ * @category Input
+ */
 function TextAreaInput({ labelTitle, dataField, labelStyle, containerStyle, inputStyle, defaultValue, placeholder, required = true, updateFormValue, }) {
     const ref = react.useRef(null);
     const [inputValue, setInputValue] = react.useState(defaultValue);
@@ -2996,6 +3001,9 @@ function TextAreaInput({ labelTitle, dataField, labelStyle, containerStyle, inpu
     return (jsxRuntime.jsxs("div", { className: `tw-form-control tw-w-full ${containerStyle || ''}`, children: [labelTitle ? (jsxRuntime.jsx("label", { className: 'tw-label', children: jsxRuntime.jsx("span", { className: `tw-label-text tw-text-base-content ${labelStyle}`, children: labelTitle }) })) : null, jsxRuntime.jsx("textarea", { required: required, ref: ref, value: inputValue, name: dataField, className: `tw-textarea tw-textarea-bordered tw-w-full tw-leading-5 ${inputStyle || ''}`, placeholder: placeholder || '', onChange: handleChange })] }));
 }
 
+/**
+ * @category Input
+ */
 function TextInput({ labelTitle, labelStyle, type, dataField, containerStyle, inputStyle, defaultValue, placeholder, autocomplete, pattern, required = true, updateFormValue, }) {
     const [inputValue, setInputValue] = react.useState(defaultValue || '');
     react.useEffect(() => {
@@ -3125,7 +3133,7 @@ function ItemFormPopup(props) {
                         key: props.position.toString(),
                         setPopupTitle,
                     })
-                    : '')) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(TextInput, { type: 'text', placeholder: 'Name', dataField: 'name', defaultValue: props.item ? props.item.name : '', inputStyle: '' }), jsxRuntime.jsx(TextAreaInput, { placeholder: 'Text', dataField: 'text', defaultValue: props.item ? props.item.text : '', inputStyle: 'tw-h-40 tw-mt-5' }, props.position.toString())] })), jsxRuntime.jsx("div", { className: 'tw-flex tw-justify-center', children: jsxRuntime.jsx("button", { className: spinner
+                    : '')) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(TextInput, { type: 'text', placeholder: 'Name', dataField: 'name', defaultValue: props.item ? props.item.name : '', inputStyle: '' }), jsxRuntime.jsx(TextAreaInput, { placeholder: 'Text', dataField: 'text', defaultValue: props.item?.text ?? '', inputStyle: 'tw-h-40 tw-mt-5' }, props.position.toString())] })), jsxRuntime.jsx("div", { className: 'tw-flex tw-justify-center', children: jsxRuntime.jsx("button", { className: spinner
                             ? 'tw-btn tw-btn-disabled tw-mt-5 tw-place-self-center'
                             : 'tw-btn tw-mt-5 tw-place-self-center', type: 'submit', children: spinner ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Save' }) })] }) }));
 }
@@ -3181,15 +3189,13 @@ const DialogModal = ({ title, isOpened, onClose, children, showCloseButton = tru
         }
     }, [isOpened]);
     if (isOpened) {
-        return (jsxRuntime.jsx("dialog", { className: `${className ?? ''} tw-card tw-shadow-xl tw-absolute tw-right-0 tw-top-0 tw-bottom-0 tw-left-0 tw-m-auto tw-transition-opacity tw-duration-300 tw-p-4 tw-max-w-xl tw-bg-base-100`, ref: ref, 
-            // eslint-disable-next-line react/no-unknown-property
-            onCancel: onClose, onClick: (e) => ref.current && !isClickInsideRectangle(e, ref.current) && closeOnClickOutside && onClose(), children: jsxRuntime.jsxs("div", { className: 'tw-card-body tw-p-2', children: [jsxRuntime.jsx("h2", { className: 'tw-text-2xl tw-font-semibold tw-mb-2 tw-text-center', children: title }), children, showCloseButton && (jsxRuntime.jsx("button", { className: 'tw-btn tw-btn-sm tw-btn-circle tw-btn-ghost tw-absolute tw-right-2 tw-top-2', onClick: onClose, children: "\u2715" }))] }) }));
+        return (jsxRuntime.jsx("dialog", { className: `${className ?? ''} tw-card tw-shadow-xl tw-absolute tw-right-0 tw-top-0 tw-bottom-0 tw-left-0 tw-m-auto tw-transition-opacity tw-duration-300 tw-p-4 tw-max-w-xl tw-bg-base-100`, ref: ref, onCancel: onClose, onClick: (e) => ref.current && !isClickInsideRectangle(e, ref.current) && closeOnClickOutside && onClose(), children: jsxRuntime.jsxs("div", { className: 'tw-card-body tw-p-2', children: [jsxRuntime.jsx("h2", { className: 'tw-text-2xl tw-font-semibold tw-mb-2 tw-text-center', children: title }), children, showCloseButton && (jsxRuntime.jsx("button", { className: 'tw-btn tw-btn-sm tw-btn-circle tw-btn-ghost tw-absolute tw-right-2 tw-top-2', onClick: onClose, children: "\u2715" }))] }) }));
     }
     else
         return jsxRuntime.jsx(jsxRuntime.Fragment, {});
 };
 
-function HeaderView({ item, api, editCallback, deleteCallback, setPositionCallback, itemNameField, itemSubnameField, itemAvatarField, loading, hideMenu = false, big = false, truncateSubname = true, hideSubname = false, showAddress = false, }) {
+function HeaderView({ item, api, editCallback, deleteCallback, setPositionCallback, loading, hideMenu = false, big = false, truncateSubname = true, hideSubname = false, showAddress = false, }) {
     const [modalOpen, setModalOpen] = react.useState(false);
     const hasUserPermission = useHasUserPermission();
     const navigate = reactRouterDom.useNavigate();
@@ -3198,22 +3204,10 @@ function HeaderView({ item, api, editCallback, deleteCallback, setPositionCallba
     react.useEffect(() => {
         setImageLoaded(false);
     }, [item]);
-    const avatar = itemAvatarField && getValue(item, itemAvatarField)
-        ? appState.assetsApi.url +
-            getValue(item, itemAvatarField) +
-            `${big ? '?width=160&heigth=160' : '?width=80&heigth=80'}`
-        : item.layer?.itemAvatarField &&
-            item &&
-            getValue(item, item.layer?.itemAvatarField) &&
-            appState.assetsApi.url +
-                getValue(item, item.layer?.itemAvatarField) +
-                `${big ? '?width=160&heigth=160' : '?width=80&heigth=80'}`;
-    const title = itemNameField
-        ? getValue(item, itemNameField)
-        : item.layer?.itemNameField && item && getValue(item, item.layer.itemNameField);
-    const subtitle = itemSubnameField
-        ? getValue(item, itemSubnameField)
-        : item.layer?.itemSubnameField && item && getValue(item, item.layer.itemSubnameField);
+    const avatar = item.image &&
+        appState.assetsApi.url + item.image + `${big ? '?width=160&heigth=160' : '?width=80&heigth=80'}`;
+    const title = item.name;
+    const subtitle = item.subname;
     const [address] = react.useState('');
     const params = new URLSearchParams(window.location.search);
     const openDeleteModal = async (event) => {
@@ -3226,7 +3220,7 @@ function HeaderView({ item, api, editCallback, deleteCallback, setPositionCallba
                             !hideMenu && (jsxRuntime.jsxs("div", { className: 'tw-dropdown tw-dropdown-bottom', children: [jsxRuntime.jsx("label", { tabIndex: 0, className: 'tw-bg-base-100 tw-btn tw-m-1 tw-leading-3 tw-border-none tw-min-h-0 tw-h-6', children: jsxRuntime.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', className: 'tw-h-5 tw-w-5', viewBox: '0 0 20 20', fill: 'currentColor', children: jsxRuntime.jsx("path", { d: 'M10 6a2 2 0 110-4 2 2 0 010 4zM10 12a2 2 0 110-4 2 2 0 010 4zM10 18a2 2 0 110-4 2 2 0 010 4z' }) }) }), jsxRuntime.jsxs("ul", { tabIndex: 0, className: 'tw-dropdown-content tw-menu tw-p-2 tw-shadow tw-bg-base-100 tw-rounded-box tw-z-1000', children: [api?.updateItem &&
                                             hasUserPermission(api.collectionName, 'update', item) &&
                                             editCallback && (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("a", { className: '!tw-text-base-content tw-cursor-pointer', onClick: (e) => item.layer?.customEditLink
-                                                    ? navigate(`${item.layer.customEditLink}${item.layer.customEditParameter ? `/${getValue(item, item.layer.customEditParameter)}${params && '?' + params}` : ''} `)
+                                                    ? navigate(`${item.layer.customEditLink}${item.layer.customEditParameter ? `/${item.id}${params && '?' + params}` : ''} `)
                                                     : editCallback(e), children: jsxRuntime.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', className: 'tw-h-5 tw-w-5', viewBox: '0 0 20 20', fill: 'currentColor', children: jsxRuntime.jsx("path", { d: 'M13.586 3.586a2 2 0 112.828 2.828l-.793.793-2.828-2.828.793-.793zM11.379 5.793L3 14.172V17h2.828l8.38-8.379-2.83-2.828z' }) }) }) })), api?.updateItem &&
                                             hasUserPermission(api.collectionName, 'update', item) &&
                                             setPositionCallback && (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("a", { className: '!tw-text-base-content tw-cursor-pointer', onClick: setPositionCallback, children: jsxRuntime.jsx("svg", { stroke: 'currentColor', fill: 'currentColor', strokeWidth: '0', viewBox: '0 0 512 512', className: 'tw-w-5 tw-h-5', xmlns: 'http://www.w3.org/2000/svg', children: jsxRuntime.jsx("path", { d: 'M256 0c17.7 0 32 14.3 32 32V42.4c93.7 13.9 167.7 88 181.6 181.6H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H469.6c-13.9 93.7-88 167.7-181.6 181.6V480c0 17.7-14.3 32-32 32s-32-14.3-32-32V469.6C130.3 455.7 56.3 381.7 42.4 288H32c-17.7 0-32-14.3-32-32s14.3-32 32-32H42.4C56.3 130.3 130.3 56.3 224 42.4V32c0-17.7 14.3-32 32-32zM107.4 288c12.5 58.3 58.4 104.1 116.6 116.6V384c0-17.7 14.3-32 32-32s32 14.3 32 32v20.6c58.3-12.5 104.1-58.4 116.6-116.6H384c-17.7 0-32-14.3-32-32s14.3-32 32-32h20.6C392.1 165.7 346.3 119.9 288 107.4V128c0 17.7-14.3 32-32 32s-32-14.3-32-32V107.4C165.7 119.9 119.9 165.7 107.4 224H128c17.7 0 32 14.3 32 32s-14.3 32-32 32H107.4zM256 224a32 32 0 1 1 0 64 32 32 0 1 1 0-64z' }) }) }) })), api?.deleteItem &&
@@ -3290,10 +3284,13 @@ const ItemViewPopup = react.forwardRef((props, ref) => {
                         navigate('/');
                     }, loading: loading }), jsxRuntime.jsx("div", { className: 'tw-overflow-y-auto tw-overflow-x-hidden tw-max-h-64 fade', children: props.children ? (react.Children.toArray(props.children).map((child) => react.isValidElement(child)
                         ? react.cloneElement(child, { item: props.item })
-                        : '')) : (jsxRuntime.jsx(TextView, { item: props.item })) }), jsxRuntime.jsxs("div", { className: 'tw-flex -tw-mb-1 tw-flex-row tw-mr-2 tw-mt-1', children: [infoExpanded ? (jsxRuntime.jsx("p", { className: 'tw-italic tw-min-h-[21px] !tw-my-0 tw-text-gray-500', children: `${props.item.date_updated && props.item.date_updated !== props.item.date_created ? 'updated' : 'posted'} ${props.item && props.item.user_created && props.item.user_created.first_name ? `by ${props.item.user_created.first_name}` : ''} ${props.item.date_updated ? timeAgo(props.item.date_updated) : timeAgo(props.item.date_created)}` })) : (jsxRuntime.jsx("p", { className: '!tw-my-0 tw-min-h-[21px] tw-font-bold tw-cursor-pointer tw-text-gray-500', onClick: () => setInfoExpanded(true), children: "\u24D8" })), jsxRuntime.jsx("div", { className: 'tw-grow' })] })] }) }));
+                        : '')) : (jsxRuntime.jsx(TextView, { text: props.item.text, itemId: props.item.id })) }), jsxRuntime.jsxs("div", { className: 'tw-flex -tw-mb-1 tw-flex-row tw-mr-2 tw-mt-1', children: [infoExpanded ? (jsxRuntime.jsx("p", { className: 'tw-italic tw-min-h-[21px] !tw-my-0 tw-text-gray-500', children: `${props.item.date_updated && props.item.date_updated !== props.item.date_created ? 'updated' : 'posted'} ${props.item && props.item.user_created && props.item.user_created.first_name ? `by ${props.item.user_created.first_name}` : ''} ${props.item.date_updated ? timeAgo(props.item.date_updated) : timeAgo(props.item.date_created)}` })) : (jsxRuntime.jsx("p", { className: '!tw-my-0 tw-min-h-[21px] tw-font-bold tw-cursor-pointer tw-text-gray-500', onClick: () => setInfoExpanded(true), children: "\u24D8" })), jsxRuntime.jsx("div", { className: 'tw-grow' })] })] }) }));
 });
 
-const Layer = ({ data, children, name = 'places', menuIcon = 'MapPinIcon', menuText = 'add new place', menuColor = '#2E7D32', markerIcon = 'point', markerShape = 'circle', markerDefaultColor = '#777', markerDefaultColor2 = 'RGBA(35, 31, 32, 0.2)', api, itemType, itemNameField = 'name', itemSubnameField, itemTextField = 'text', itemAvatarField, itemColorField, itemOwnerField, itemLatitudeField = 'position.coordinates.1', itemLongitudeField = 'position.coordinates.0', itemTagsField, itemOffersField, itemNeedsField, onlyOnePerOwner = false, customEditLink, customEditParameter, 
+/**
+ * @category Map
+ */
+const Layer = ({ data, children, name = 'places', menuIcon = 'MapPinIcon', menuText = 'add new place', menuColor = '#2E7D32', markerIcon = 'point', markerShape = 'circle', markerDefaultColor = '#777', markerDefaultColor2 = 'RGBA(35, 31, 32, 0.2)', api, itemType, onlyOnePerOwner = false, customEditLink, customEditParameter, 
 // eslint-disable-next-line camelcase
 public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }) => {
     const filterTags = useFilterTags();
@@ -3330,16 +3327,8 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
                 markerDefaultColor2,
                 api,
                 itemType,
-                itemNameField,
-                itemSubnameField,
-                itemTextField,
-                itemAvatarField,
-                itemColorField,
-                itemOwnerField,
-                itemTagsField,
-                itemOffersField,
-                itemNeedsField,
                 onlyOnePerOwner,
+                // Can we just use editCallback for all cases?
                 customEditLink,
                 customEditParameter,
                 // eslint-disable-next-line camelcase
@@ -3347,6 +3336,7 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
                 listed,
                 setItemFormPopup,
                 itemFormPopup,
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
                 clusterRef,
             });
         api &&
@@ -3363,15 +3353,6 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
                 markerDefaultColor2,
                 api,
                 itemType,
-                itemNameField,
-                itemSubnameField,
-                itemTextField,
-                itemAvatarField,
-                itemColorField,
-                itemOwnerField,
-                itemTagsField,
-                itemOffersField,
-                itemNeedsField,
                 onlyOnePerOwner,
                 customEditLink,
                 customEditParameter,
@@ -3380,6 +3361,7 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
                 listed,
                 setItemFormPopup,
                 itemFormPopup,
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
                 clusterRef,
             });
         // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -3407,29 +3389,18 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
                     .filter((item) => (item.group_type && isGroupTypeVisible(item.group_type)) ||
                     visibleGroupTypes.length === 0)
                     .map((item) => {
-                    if (getValue(item, itemLongitudeField) && getValue(item, itemLatitudeField)) {
-                        // eslint-disable-next-line security/detect-object-injection
-                        if (getValue(item, itemTextField))
-                            item[itemTextField] = getValue(item, itemTextField);
-                        // eslint-disable-next-line security/detect-object-injection
-                        else
-                            item[itemTextField] = '';
+                    if (item.position?.coordinates[0] && item.position?.coordinates[1]) {
                         if (item.tags) {
-                            // eslint-disable-next-line security/detect-object-injection
-                            item[itemTextField] = item[itemTextField] + '\n\n';
+                            item.text += '\n\n';
                             item.tags.map((tag) => {
-                                // eslint-disable-next-line security/detect-object-injection
-                                if (!item[itemTextField].includes(`#${encodeTag(tag)}`)) {
-                                    // eslint-disable-next-line security/detect-object-injection
-                                    return (item[itemTextField] = item[itemTextField] + `#${encodeTag(tag)} `);
+                                if (!item.text?.includes(`#${encodeTag(tag)}`)) {
+                                    item.text += `#${encodeTag(tag)}`;
                                 }
-                                // eslint-disable-next-line security/detect-object-injection
-                                return item[itemTextField];
+                                return item.text;
                             });
                         }
                         if (allTagsLoaded && allItemsLoaded) {
-                            // eslint-disable-next-line security/detect-object-injection
-                            item[itemTextField].match(hashTagRegex)?.map((tag) => {
+                            item.text?.match(hashTagRegex)?.map((tag) => {
                                 if (!tags.find((t) => t.name.toLocaleLowerCase() === tag.slice(1).toLocaleLowerCase()) &&
                                     !newTagsToAdd.find((t) => t.name.toLocaleLowerCase() === tag.slice(1).toLocaleLowerCase())) {
                                     const newTag = {
@@ -3444,18 +3415,20 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
                             !tagsReady && setTagsReady(true);
                         }
                         const itemTags = getItemTags(item);
-                        const latitude = itemLatitudeField && item ? getValue(item, itemLatitudeField) : undefined;
-                        const longitude = itemLongitudeField && item ? getValue(item, itemLongitudeField) : undefined;
+                        const latitude = item.position.coordinates[1];
+                        const longitude = item.position.coordinates[0];
                         let color1 = markerDefaultColor;
                         let color2 = markerDefaultColor2;
-                        if (itemColorField && getValue(item, itemColorField) != null)
-                            color1 = getValue(item, itemColorField);
-                        else if (itemTags && itemTags[0]) {
+                        if (item.color) {
+                            color1 = item.color;
+                        }
+                        else if (itemTags[0]) {
                             color1 = itemTags[0].color;
                         }
-                        if (itemTags && itemTags[0] && itemColorField)
+                        if (itemTags[0] && item.color) {
                             color2 = itemTags[0].color;
-                        else if (itemTags && itemTags[1]) {
+                        }
+                        else if (itemTags[1]) {
                             color2 = itemTags[1].color;
                         }
                         return (jsxRuntime.jsxs(reactLeaflet.Marker, { ref: (r) => {
@@ -3475,7 +3448,7 @@ public_edit_items, listed = true, setItemFormPopup, itemFormPopup, clusterRef, }
                                             if (!(item.id in leafletRefs && leafletRefs[item.id].popup === r)) {
                                                 r && addPopup(item, r);
                                             }
-                                        }, item: item, setItemFormPopup: setItemFormPopup }, item.id + item.name) })), jsxRuntime.jsx(reactLeaflet.Tooltip, { offset: [0, -38], direction: 'top', children: item.name ? item.name : getValue(item, itemNameField) })] }, item.id));
+                                        }, item: item, setItemFormPopup: setItemFormPopup }, item.id + item.name) })), jsxRuntime.jsx(reactLeaflet.Tooltip, { offset: [0, -38], direction: 'top', children: item.name })] }, item.id));
                     }
                     else
                         return null;
@@ -3488,6 +3461,9 @@ function isComponentWithType(node) {
     return react.isValidElement(node) && typeof node.type !== 'string' && '__TYPE' in node.type;
 }
 
+/**
+ * @category Map
+ */
 function Tags({ data, api }) {
     const setTagData = useSetTagData();
     const setTagApi = useSetTagApi();
@@ -3520,7 +3496,10 @@ function Tags({ data, api }) {
     return jsxRuntime.jsx(jsxRuntime.Fragment, {});
 }
 
-function Permissions({ data, api, adminRole, }) {
+/**
+ * @category Map
+ */
+function Permissions({ data, api, adminRole }) {
     const setPermissionData = useSetPermissionData();
     const setPermissionApi = useSetPermissionApi();
     const setAdminRole = useSetAdminRole();
@@ -3534,6 +3513,9 @@ function Permissions({ data, api, adminRole, }) {
     return jsxRuntime.jsx(jsxRuntime.Fragment, {});
 }
 
+/**
+ * @category Map
+ */
 const ItemForm = ({ children, item, title, setPopupTitle, }) => {
     react.useEffect(() => {
         setPopupTitle && title && setPopupTitle(title);
@@ -3547,6 +3529,9 @@ const ItemForm = ({ children, item, title, setPopupTitle, }) => {
 };
 ItemForm.__TYPE = 'ItemForm';
 
+/**
+ * @category Map
+ */
 const ItemView = ({ children, item }) => {
     return (jsxRuntime.jsx("div", { children: children
             ? react.Children.toArray(children).map((child) => react.isValidElement(child) ? react.cloneElement(child, { item }) : null)
@@ -3554,6 +3539,9 @@ const ItemView = ({ children, item }) => {
 };
 ItemView.__TYPE = 'ItemView';
 
+/**
+ * @category Input
+ */
 function SelectBox(props) {
     const { labelTitle, labelDescription, defaultValue, containerStyle, placeholder, labelStyle, options, updateFormValue, } = props;
     const [value, setValue] = react.useState(defaultValue || '');
@@ -3566,22 +3554,37 @@ function SelectBox(props) {
                     })] })] }));
 }
 
+/**
+ * @category Map
+ */
 const PopupTextAreaInput = ({ dataField, placeholder, style, item, }) => {
     return (jsxRuntime.jsx(TextAreaInput, { defaultValue: item?.text ? item.text : '', dataField: dataField, placeholder: placeholder, inputStyle: style }));
 };
 
+/**
+ * @category Map
+ */
 const PopupStartEndInput = ({ item, showLabels = true, updateStartValue, updateEndValue, }) => {
     return (jsxRuntime.jsxs("div", { className: 'tw-grid tw-grid-cols-2 tw-gap-2', children: [jsxRuntime.jsx(TextInput, { type: 'date', placeholder: 'start', dataField: 'start', inputStyle: 'tw-text-sm tw-px-2', labelTitle: showLabels ? 'start' : '', defaultValue: item && item.start ? item.start.substring(0, 10) : '', autocomplete: 'one-time-code', updateFormValue: updateStartValue }), jsxRuntime.jsx(TextInput, { type: 'date', placeholder: 'end', dataField: 'end', inputStyle: 'tw-text-sm tw-px-2', labelTitle: showLabels ? 'end' : '', defaultValue: item && item.end ? item.end.substring(0, 10) : '', autocomplete: 'one-time-code', updateFormValue: updateEndValue })] }));
 };
 
+/**
+ * @category Map
+ */
 const PopupTextInput = ({ dataField, placeholder, style, item, }) => {
     return (jsxRuntime.jsx(TextInput, { defaultValue: item?.name ? item.name : '', dataField: dataField, placeholder: placeholder, inputStyle: style, type: 'text', containerStyle: 'tw-mt-4' }));
 };
 
+/**
+ * @category Map
+ */
 const PopupCheckboxInput = ({ dataField, label, item, }) => {
     return (jsxRuntime.jsxs("label", { htmlFor: item?.id, className: 'tw-label tw-justify-normal tw-pt-1 tw-pb-1', children: [jsxRuntime.jsx("input", { id: item?.id, type: 'checkbox', name: dataField, className: 'tw-checkbox tw-checkbox-xs tw-checkbox-success', checked: item?.public_edit }), jsxRuntime.jsx("span", { className: 'tw-text-sm tw-label-text tw-mx-2 tw-cursor-pointer', children: label })] }));
 };
 
+/**
+ * @category Map
+ */
 const StartEndView = ({ item }) => {
     return (jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-row tw-mb-4 tw-mt-1', children: [jsxRuntime.jsxs("div", { className: 'tw-basis-2/5 tw-flex tw-flex-row', children: [jsxRuntime.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', className: 'tw-h-4 tw-w-4 tw-mr-2', fill: 'none', viewBox: '0 0 24 24', stroke: 'currentColor', strokeWidth: 2, children: jsxRuntime.jsx("path", { strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z' }) }), jsxRuntime.jsx("time", { className: 'tw-align-middle', dateTime: item && item.start ? item.start.substring(0, 10) : '', children: item && item.start ? new Date(item.start).toLocaleDateString() : '' })] }), jsxRuntime.jsx("div", { className: 'tw-basis-1/5 tw-place-content-center', children: jsxRuntime.jsx("span", { children: "-" }) }), jsxRuntime.jsxs("div", { className: 'tw-basis-2/5 tw-flex tw-flex-row', children: [jsxRuntime.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', className: 'tw-h-4 tw-w-4 tw-mr-2', fill: 'none', viewBox: '0 0 24 24', stroke: 'currentColor', strokeWidth: 2, children: jsxRuntime.jsx("path", { strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z' }) }), jsxRuntime.jsx("time", { className: 'tw-align-middle', dateTime: item && item.end ? item.end.substring(0, 10) : '', children: item && item.end ? new Date(item.end).toLocaleDateString() : '' })] })] }));
 };
@@ -3649,6 +3652,9 @@ const SetAppState = ({ assetsApi, userType, }) => {
     return jsxRuntime.jsx(jsxRuntime.Fragment, {});
 };
 
+/**
+ * @category AppShell
+ */
 function AppShell({ appName, children, assetsApi, userType, }) {
     return (jsxRuntime.jsx(ContextWrapper, { children: jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-col tw-h-full', children: [jsxRuntime.jsx(SetAppState, { assetsApi: assetsApi, userType: userType }), jsxRuntime.jsx(NavBar, { userType: userType, appName: appName }), jsxRuntime.jsx("div", { id: 'app-content', className: 'tw-flex-grow', children: children })] }) }));
 }
@@ -3670,6 +3676,9 @@ function SidebarSubmenu({ submenu, name, icon, }) {
                     }) }) })] }));
 }
 
+/**
+ * @category AppShell
+ */
 function SideBar({ routes, bottomRoutes }) {
     // prevent react18 from calling useEffect twice
     const init = react.useRef(false);
@@ -3712,10 +3721,16 @@ function SideBar({ routes, bottomRoutes }) {
                                     (!slim ? 'tw-rotate-180' : ''), onClick: () => toggleSlim() })] }) })] }) }));
 }
 
+/**
+ * @category AppShell
+ */
 function Content({ children }) {
     return (jsxRuntime.jsx("div", { className: 'tw-flex tw-flex-col tw-w-full tw-h-full tw-bg-base-200 tw-relative', children: children }));
 }
 
+/**
+ * @category AppShell
+ */
 const Sitemap = ({ url }) => {
     const [sitemap, setSitemap] = react.useState('');
     const items = useItems();
@@ -3743,6 +3758,9 @@ function Subtitle({ styleClass, children }) {
     return jsxRuntime.jsx("div", { className: `tw-text-xl tw-font-semibold ${styleClass}`, children: children });
 }
 
+/**
+ * @category Templates
+ */
 function TitleCard({ title, hideTitle, children, topMargin, TopSideButtons, className, }) {
     return (jsxRuntime.jsxs("div", { className: 'tw-card tw-w-full tw-p-6 tw-bg-base-100 tw-shadow-xl tw-h-fit tw-mb-4 ' +
             (className || '') +
@@ -3750,6 +3768,9 @@ function TitleCard({ title, hideTitle, children, topMargin, TopSideButtons, clas
             (topMargin || 'tw-mt-6'), children: [!hideTitle && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Subtitle, { styleClass: TopSideButtons ? 'tw-inline-block' : '', children: [title, TopSideButtons && (jsxRuntime.jsx("div", { className: 'tw-inline-block tw-float-right', children: TopSideButtons }))] }), jsxRuntime.jsx("div", { className: 'tw-divider tw-mt-2' })] })), jsxRuntime.jsx("div", { className: 'tw-h-full tw-bg-transparent tw-w-full tw-pb-6 tw-bg-base-100', children: children })] }));
 }
 
+/**
+ * @category Templates
+ */
 function CardPage({ title, hideTitle, children, parents, }) {
     return (jsxRuntime.jsx("main", { className: 'tw-flex-1 tw-overflow-y-auto tw-overflow-x-hidden tw-pt-2 tw-px-6 tw-min-w-80 tw-flex tw-justify-center', children: jsxRuntime.jsxs("div", { className: 'tw-w-full xl:tw-max-w-6xl ', children: [jsxRuntime.jsx("div", { className: 'tw-text-sm tw-breadcrumbs', children: jsxRuntime.jsxs("ul", { children: [jsxRuntime.jsx("li", { children: jsxRuntime.jsx(reactRouterDom.Link, { to: '/', children: "Home" }) }), parents?.map((b, i) => (jsxRuntime.jsx("li", { children: jsxRuntime.jsx(reactRouterDom.Link, { to: b.path, children: b.name }) }, i))), jsxRuntime.jsx("li", { children: title })] }) }), jsxRuntime.jsx(TitleCard, { hideTitle: hideTitle, title: title, topMargin: 'tw-my-2', className: ' tw-mb-4', children: children })] }) }));
 }
@@ -3802,6 +3823,9 @@ const CircleLayout = ({ items, radius, fontSize, }) => {
     return (jsxRuntime.jsx("div", { className: 'tw-absolute tw-mx-auto tw-flex tw-justify-center tw-items-center tw-h-full tw-w-full', ref: containerRef, children: items.map((item) => (jsxRuntime.jsx("div", { className: 'tw-absolute', style: { fontSize }, children: item }, item))) }));
 };
 
+/**
+ * @category Templates
+ */
 const MoonCalendar = () => {
     const today = dateFns.startOfToday();
     const [currMonth, setCurrMonth] = react.useState(() => dateFns.format(today, 'MMM-yyyy'));
@@ -3824,6 +3848,9 @@ const MoonCalendar = () => {
                         ], radius: 120, fontSize: '0.8em' })] }), jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-row', children: [jsxRuntime.jsx(outline.ChevronLeftIcon, { className: 'tw-w-6 tw-h-6 tw-cursor-pointer', onClick: getPrevMonth }), jsxRuntime.jsxs("p", { className: 'tw-text-center tw-p-1 tw-h-full tw-grow', children: ["from ", dateFns.format(getLastNewMoon(), 'dd.MM'), " - to ", dateFns.format(getNextNewMoon(), 'dd.MM')] }), jsxRuntime.jsx(outline.ChevronRightIcon, { className: 'tw-w-6 tw-h-6 tw-cursor-pointer', onClick: getNextMonth })] })] }));
 };
 
+/**
+ * @category Templates
+ */
 const SelectUser = () => {
     const appState = useAppState();
     const items = useItems();
@@ -3846,18 +3873,22 @@ const DateUserInfo = ({ item }) => {
     return (jsxRuntime.jsxs("div", { className: 'tw-flex -tw-mb-1 tw-flex-row tw-mr-2 -tw-mt-2', onClick: (e) => e.stopPropagation(), children: [infoExpanded ? (jsxRuntime.jsx("p", { className: 'tw-italic tw-min-h-[21px] !tw-my-0 tw-text-gray-500', onClick: () => setInfoExpanded(false), children: `${item.date_updated && item.date_updated !== item.date_created ? 'updated' : 'posted'} ${item && item.user_created && item.user_created.first_name ? `by ${item.user_created.first_name}` : ''} ${item.date_updated ? timeAgo(item.date_updated) : timeAgo(item.date_created)}` })) : (jsxRuntime.jsx("p", { className: '!tw-my-0 tw-min-h-[21px] tw-font-bold tw-cursor-pointer tw-text-gray-500', onClick: () => setInfoExpanded(true), children: "\u24D8" })), jsxRuntime.jsx("div", { className: 'tw-grow ' })] }));
 };
 
-const ItemCard = ({ i, loading, url, parameterField, deleteCallback, }) => {
+const ItemCard = ({ i, loading, url, deleteCallback, }) => {
     const navigate = reactRouterDom.useNavigate();
     const windowDimensions = useWindowDimensions();
     return (jsxRuntime.jsxs("div", { className: 'tw-cursor-pointer tw-card tw-border-[1px] tw-border-base-300 tw-card-body tw-shadow-xl tw-bg-base-100 tw-text-base-content tw-p-4 tw-mb-4 tw-h-fit', onClick: () => {
+            // We could have an onClick callback instead
             const params = new URLSearchParams(window.location.search);
             if (windowDimensions.width < 786 && i.position)
-                navigate('/' + getValue(i, parameterField) + `${params ? `?${params}` : ''}`);
+                navigate('/' + i.id + `${params ? `?${params}` : ''}`);
             else
-                navigate(url + getValue(i, parameterField) + `${params ? `?${params}` : ''}`);
-        }, children: [jsxRuntime.jsx(HeaderView, { loading: loading, item: i, api: i.layer?.api, itemAvatarField: i.layer?.itemAvatarField, itemNameField: i.layer?.itemNameField, itemSubnameField: i.layer?.itemSubnameField, editCallback: () => navigate('/edit-item/' + i.id), deleteCallback: () => deleteCallback(i) }), jsxRuntime.jsxs("div", { className: 'tw-overflow-y-auto tw-overflow-x-hidden tw-max-h-64 fade', children: [i.layer?.itemType.show_start_end && jsxRuntime.jsx(StartEndView, { item: i }), i.layer?.itemType.show_text && (jsxRuntime.jsx(TextView, { truncate: true, item: i, itemTextField: i.layer.itemTextField }))] }), jsxRuntime.jsx(DateUserInfo, { item: i })] }));
+                navigate(url + i.id + `${params ? `?${params}` : ''}`);
+        }, children: [jsxRuntime.jsx(HeaderView, { loading: loading, item: i, api: i.layer?.api, editCallback: () => navigate('/edit-item/' + i.id), deleteCallback: () => deleteCallback(i) }), jsxRuntime.jsxs("div", { className: 'tw-overflow-y-auto tw-overflow-x-hidden tw-max-h-64 fade', children: [i.layer?.itemType.show_start_end && jsxRuntime.jsx(StartEndView, { item: i }), i.layer?.itemType.show_text && jsxRuntime.jsx(TextView, { truncate: true, text: i.text, itemId: i.id })] }), jsxRuntime.jsx(DateUserInfo, { item: i })] }));
 };
 
+/**
+ * @category Templates
+ */
 const OverlayItemsIndexPage = ({ url, layerName, parameterField, plusButton = true, }) => {
     const [loading, setLoading] = react.useState(false);
     const [addItemPopupType, setAddItemPopupType] = react.useState('');
@@ -3953,7 +3984,7 @@ const OverlayItemsIndexPage = ({ url, layerName, parameterField, plusButton = tr
                                                 : 0;
                                         return dateB - dateA; // Subtracts milliseconds which are numbers
                                     })
-                                        .map((i, k) => (jsxRuntime.jsx("div", { className: 'tw-break-inside-avoid tw-mb-6', children: jsxRuntime.jsx(ItemCard, { i: i, loading: loading, url: url, parameterField: parameterField, deleteCallback: () => deleteItem(i) }) }, k))), addItemPopupType === 'place' && (jsxRuntime.jsx("form", { ref: tabRef, autoComplete: 'off', onSubmit: (e) => submitNewItem(e), children: jsxRuntime.jsxs("div", { className: 'tw-cursor-pointer tw-break-inside-avoid tw-card tw-border-[1px] tw-border-base-300 tw-card-body tw-shadow-xl tw-bg-base-100 tw-text-base-content tw-p-6 tw-mb-10', children: [jsxRuntime.jsx("label", { className: 'tw-btn tw-btn-sm tw-rounded-2xl tw-btn-circle tw-btn-ghost hover:tw-bg-transparent tw-absolute tw-right-0 tw-top-0 tw-text-gray-600', onClick: () => setAddItemPopupType(''), children: jsxRuntime.jsx("p", { className: 'tw-text-center', children: "\u2715" }) }), jsxRuntime.jsx(TextInput, { type: 'text', placeholder: 'Name', dataField: 'name', defaultValue: '', inputStyle: '' }), layer?.itemType.show_start_end_input && jsxRuntime.jsx(PopupStartEndInput, {}), jsxRuntime.jsx(TextAreaInput, { placeholder: 'Text', dataField: 'text', defaultValue: '', inputStyle: 'tw-h-40 tw-mt-5' }), jsxRuntime.jsx("div", { className: 'tw-flex tw-justify-center', children: jsxRuntime.jsx("button", { className: loading
+                                        .map((i, k) => (jsxRuntime.jsx("div", { className: 'tw-break-inside-avoid tw-mb-6', children: jsxRuntime.jsx(ItemCard, { i: i, loading: loading, url: url, deleteCallback: () => deleteItem(i) }) }, k))), addItemPopupType === 'place' && (jsxRuntime.jsx("form", { ref: tabRef, autoComplete: 'off', onSubmit: (e) => submitNewItem(e), children: jsxRuntime.jsxs("div", { className: 'tw-cursor-pointer tw-break-inside-avoid tw-card tw-border-[1px] tw-border-base-300 tw-card-body tw-shadow-xl tw-bg-base-100 tw-text-base-content tw-p-6 tw-mb-10', children: [jsxRuntime.jsx("label", { className: 'tw-btn tw-btn-sm tw-rounded-2xl tw-btn-circle tw-btn-ghost hover:tw-bg-transparent tw-absolute tw-right-0 tw-top-0 tw-text-gray-600', onClick: () => setAddItemPopupType(''), children: jsxRuntime.jsx("p", { className: 'tw-text-center', children: "\u2715" }) }), jsxRuntime.jsx(TextInput, { type: 'text', placeholder: 'Name', dataField: 'name', defaultValue: '', inputStyle: '' }), layer?.itemType.show_start_end_input && jsxRuntime.jsx(PopupStartEndInput, {}), jsxRuntime.jsx(TextAreaInput, { placeholder: 'Text', dataField: 'text', defaultValue: '', inputStyle: 'tw-h-40 tw-mt-5' }), jsxRuntime.jsx("div", { className: 'tw-flex tw-justify-center', children: jsxRuntime.jsx("button", { className: loading
                                                             ? 'tw-btn tw-btn-disabled tw-mt-5 tw-place-self-center'
                                                             : 'tw-btn tw-mt-5 tw-place-self-center', type: 'submit', children: loading ? jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner' }) : 'Save' }) })] }) }))] }) })] }) }), plusButton && (jsxRuntime.jsx(PlusButton, { layer: layer, triggerAction: () => {
                     setAddItemPopupType('place');
@@ -4034,6 +4065,9 @@ const EmojiPicker = ({ selectedEmoji, selectedColor, selectedShape, setSelectedE
     return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { onClick: toggleDropdown, className: `tw-cursor-pointer ${selectedEmoji === 'select badge' ? 'tw-text-sm !tw-p-9 tw-text-center ' : 'tw-text-6xl'} tw-mask tw-mask-${selectedShape} tw-p-6 tw-bg-[${selectedColor}]`, children: selectedEmoji }), isOpen && (jsxRuntime.jsxs("div", { className: 'tw-absolute tw-z-3000 tw-top-0 tw-left-1/2 tw-transform tw--translate-x-1/2 tw-mt-12 tw-bg-base-100 tw-rounded-2xl tw-shadow-lg tw-p-2 tw-w-full', children: [jsxRuntime.jsx("div", { className: 'tw-grid tw-grid-cols-6 tw-gap-2 tw-pb-2', children: emojis.map((emoji) => (jsxRuntime.jsx("button", { onClick: () => selectEmoji(emoji), className: `tw-cursor-pointer  tw-text-2xl tw-p-2 hover:tw-bg-base-200 tw-rounded-md ${emoji === selectedEmoji && 'tw-bg-base-300'}`, children: emoji }, emoji))) }), jsxRuntime.jsx("hr", {}), jsxRuntime.jsx("div", { className: 'tw-grid tw-grid-cols-3 tw-gap-2 tw-py-2', children: shapes.map((shape) => (jsxRuntime.jsx("div", { className: `tw-cursor-pointer hover:tw-bg-base-200 tw-rounded-md tw-p-2 ${shape === selectedShape && 'tw-bg-base-300'}`, onClick: () => selectShape(shape), children: jsxRuntime.jsx("div", { className: `tw-h-12 tw-mask tw-mask-${shape} tw-bg-neutral-content` }) }, shape))) }), jsxRuntime.jsx("hr", {}), jsxRuntime.jsx("div", { className: 'tw-grid tw-grid-cols-6 tw-gap-2 tw-py-2 tw-px-6', children: colors.map((color) => (jsxRuntime.jsx("div", { className: `tw-cursor-pointer hover:tw-bg-base-200 tw-rounded-md tw-p-2 tw-flex tw-justify-center tw-items-center  ${color === selectedColor && 'tw-bg-base-300'}`, onClick: () => selectColor(color), children: jsxRuntime.jsx("div", { className: `tw-h-8 tw-w-8 tw-rounded-full tw-bg-[${color}]` }) }, color))) })] }))] }));
 };
 
+/**
+ * @category Templates
+ */
 const AttestationForm = ({ api }) => {
     const items = useItems();
     const appState = useAppState();
@@ -4112,6 +4146,9 @@ function groupAndCount(arr) {
     }, []);
     return grouped.sort((a, b) => b.count - a.count);
 }
+/**
+ * @category Templates
+ */
 const MarketView = () => {
     const [offers, setOffers] = react.useState([]);
     const [needs, setNeeds] = react.useState([]);
@@ -4121,21 +4158,16 @@ const MarketView = () => {
     react.useEffect(() => {
         setOffers([]);
         setNeeds([]);
-        items.map((i) => {
-            i.layer?.itemOffersField &&
-                getValue(i, i.layer.itemOffersField)?.map((o) => {
-                    const tag = tags.find((t) => t.id === o.tags_id);
-                    tag && setOffers((current) => [...current, tag]);
-                    return null;
-                });
-            i.layer?.itemNeedsField &&
-                getValue(i, i.layer.itemNeedsField)?.map((n) => {
-                    const tag = tags.find((t) => t.id === n.tags_id);
-                    tag && setNeeds((current) => [...current, tag]);
-                    return null;
-                });
-            return null;
-        });
+        for (const item of items) {
+            item.offers?.forEach((o) => {
+                const tag = tags.find((t) => t.id === o.tags_id);
+                tag && setOffers((current) => [...current, tag]);
+            });
+            item.needs?.forEach((n) => {
+                const tag = tags.find((t) => t.id === n.tags_id);
+                tag && setNeeds((current) => [...current, tag]);
+            });
+        }
         // eslint-disable-next-line no-console
         console.log(offers);
         // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -4143,6 +4175,9 @@ const MarketView = () => {
     return (jsxRuntime.jsx(MapOverlayPage, { className: 'tw-rounded-none tw-overflow-y-auto tw-bg-base-200 !tw-p-4', children: jsxRuntime.jsxs("div", { className: 'tw-grid tw-grid-cols-1 md:tw-grid-cols-2', children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("p", { className: 'tw-text-lg tw-font-bold', children: "Offers" }), jsxRuntime.jsx("div", { className: 'tw-flex tw-flex-wrap', children: groupAndCount(offers).map((o) => (jsxRuntime.jsx(TagView, { onClick: () => navigate(`/?tags=${o.object.name}`), tag: o.object, count: o.count }, o.object.id))) })] }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("p", { className: 'tw-text-lg tw-font-bold', children: "Needs" }), jsxRuntime.jsx("div", { className: 'tw-flex tw-flex-wrap', children: groupAndCount(needs).map((o) => (jsxRuntime.jsx(TagView, { onClick: () => navigate(`/?tags=${o.object.name}`), tag: o.object, count: o.count }, o.object.id))) })] })] }) }));
 };
 
+/**
+ * @category Profile
+ */
 function UserSettings() {
     const { user, updateUser, loading /* token */ } = useAuth();
     const [id, setId] = react.useState('');
@@ -4400,7 +4435,7 @@ styleInject(css_248z$1);
 const GalleryView = ({ item }) => {
     const [index, setIndex] = react.useState(-1);
     const appState = useAppState();
-    const images = item.gallery.map((i, j) => {
+    const images = item.gallery?.map((i, j) => {
         return {
             src: appState.assetsApi.url + `${i.directus_files_id.id}.jpg`,
             width: i.directus_files_id.width,
@@ -4408,6 +4443,8 @@ const GalleryView = ({ item }) => {
             index: j,
         };
     });
+    if (!images)
+        throw new Error('GalleryView: images is undefined');
     return (jsxRuntime.jsxs("div", { className: 'tw-mx-6 tw-mb-6', children: [jsxRuntime.jsx(reactPhotoAlbum.RowsPhotoAlbum, { photos: images, targetRowHeight: 150, onClick: ({ index: current }) => setIndex(current) }), jsxRuntime.jsx(ReactLightbox, { index: index, slides: images, open: index >= 0, close: () => setIndex(-1) })] }));
 };
 
@@ -4489,8 +4526,30 @@ const ProfileStartEndView = ({ item }) => {
     return (jsxRuntime.jsx("div", { className: 'tw-mt-2 tw-px-6 tw-max-w-xs', children: jsxRuntime.jsx(StartEndView, { item: item }) }));
 };
 
-const ProfileTextView = ({ item, dataField, heading, hideWhenEmpty, }) => {
-    return (jsxRuntime.jsxs("div", { className: 'tw-my-10 tw-mt-2 tw-px-6', children: [!(getValue(item, dataField) === '' && hideWhenEmpty) && (jsxRuntime.jsx("h2", { className: 'tw-text-lg tw-font-semibold', children: heading })), jsxRuntime.jsx("div", { className: 'tw-mt-2 tw-text-sm', children: jsxRuntime.jsx(TextView, { rawText: dataField ? getValue(item, dataField) : getValue(item, 'text') }) })] }));
+const get = (value, path, defaultValue) => {
+  const segments = path.split(/[\.\[\]]/g);
+  let current = value;
+  for (const key of segments) {
+    if (current === null)
+      return defaultValue;
+    if (current === void 0)
+      return defaultValue;
+    const dequoted = key.replace(/['"]/g, "");
+    if (dequoted.trim() === "")
+      continue;
+    current = current[dequoted];
+  }
+  if (current === void 0)
+    return defaultValue;
+  return current;
+};
+
+const ProfileTextView = ({ item, dataField = 'text', heading, hideWhenEmpty, }) => {
+    const text = get(item, dataField);
+    if (typeof text !== 'string') {
+        throw new Error('ProfileTextView: text is not a string');
+    }
+    return (jsxRuntime.jsxs("div", { className: 'tw-my-10 tw-mt-2 tw-px-6', children: [!(text === '' && hideWhenEmpty) && (jsxRuntime.jsx("h2", { className: 'tw-text-lg tw-font-semibold', children: heading })), jsxRuntime.jsx("div", { className: 'tw-mt-2 tw-text-sm', children: jsxRuntime.jsx(TextView, { itemId: item.id, rawText: text }) })] }));
 };
 
 const componentMap$1 = {
@@ -4504,21 +4563,23 @@ const componentMap$1 = {
 const FlexView = ({ item }) => {
     // eslint-disable-next-line no-console
     console.log(item);
-    return (jsxRuntime.jsx("div", { className: 'tw-h-full tw-overflow-y-auto fade', children: item.layer?.itemType.profileTemplate.map((templateItem) => {
+    return (jsxRuntime.jsx("div", { className: 'tw-h-full tw-overflow-y-auto fade', children: item.layer?.itemType.profileTemplate.map(
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        (templateItem) => {
             const TemplateComponent = componentMap$1[templateItem.collection];
             return TemplateComponent ? (jsxRuntime.jsx(TemplateComponent, { item: item, ...templateItem.item }, templateItem.id)) : (jsxRuntime.jsx("div", { children: "Component not found" }, templateItem.id));
         }) }));
 };
 
 const OnepagerView = ({ item }) => {
-    return (jsxRuntime.jsxs("div", { className: 'tw-h-full tw-overflow-y-auto fade', children: [jsxRuntime.jsx(GroupSubHeaderView, { item: item, shareBaseUrl: `https://www.wuerdekompass.org/aktivitaeten/gruppensuche/#/gruppe/${item.slug}` }), item.user_created?.first_name && jsxRuntime.jsx(ContactInfoView, { heading: 'Du hast Fragen?', item: item }), jsxRuntime.jsx("div", { className: 'tw-my-10 tw-mt-2 tw-px-6 tw-text-sm ', children: jsxRuntime.jsx(TextView, { rawText: item.text || 'Keine Beschreibung vorhanden' }) }), item.next_appointment && (jsxRuntime.jsxs("div", { className: 'tw-my-10 tw-px-6', children: [jsxRuntime.jsx("h2", { className: 'tw-text-lg tw-font-semibold', children: "N\u00E4chste Termine" }), jsxRuntime.jsx("div", { className: 'tw-mt-2 tw-text-sm', children: jsxRuntime.jsx(TextView, { rawText: item.next_appointment }) })] })), ";"] }));
+    return (jsxRuntime.jsxs("div", { className: 'tw-h-full tw-overflow-y-auto fade', children: [jsxRuntime.jsx(GroupSubHeaderView, { item: item, shareBaseUrl: `https://www.wuerdekompass.org/aktivitaeten/gruppensuche/#/gruppe/${item.slug}` }), item.user_created?.first_name && jsxRuntime.jsx(ContactInfoView, { heading: 'Du hast Fragen?', item: item }), jsxRuntime.jsx("div", { className: 'tw-my-10 tw-mt-2 tw-px-6 tw-text-sm ', children: jsxRuntime.jsx(TextView, { itemId: item.id, rawText: item.text ?? 'Keine Beschreibung vorhanden' }) }), item.next_appointment && (jsxRuntime.jsxs("div", { className: 'tw-my-10 tw-px-6', children: [jsxRuntime.jsx("h2", { className: 'tw-text-lg tw-font-semibold', children: "N\u00E4chste Termine" }), jsxRuntime.jsx("div", { className: 'tw-mt-2 tw-text-sm', children: jsxRuntime.jsx(TextView, { itemId: item.id, rawText: item.next_appointment }) })] })), ";"] }));
 };
 
 const SimpleView = ({ item }) => {
-    return (jsxRuntime.jsx("div", { className: 'tw-mt-8 tw-h-full tw-overflow-y-auto fade tw-px-6', children: jsxRuntime.jsx(TextView, { item: item }) }));
+    return (jsxRuntime.jsx("div", { className: 'tw-mt-8 tw-h-full tw-overflow-y-auto fade tw-px-6', children: jsxRuntime.jsx(TextView, { text: item.text, itemId: item.id }) }));
 };
 
-function ActionButton({ item, triggerAddButton, triggerItemSelected, existingRelations, itemType, colorField, collection = 'items', customStyle, }) {
+function ActionButton({ item, triggerAddButton, triggerItemSelected, existingRelations, itemType, collection = 'items', customStyle, }) {
     const hasUserPermission = useHasUserPermission();
     const [modalOpen, setModalOpen] = react.useState(false);
     const [search, setSearch] = react.useState('');
@@ -4528,15 +4589,19 @@ function ActionButton({ item, triggerAddButton, triggerItemSelected, existingRel
         .filter((i) => !itemType || i.layer?.itemType.name === itemType)
         .filter((i) => !existingRelations.some((s) => s.id === i.id))
         .filter((i) => i.id !== item.id);
+    const backgroundColor = item.color ??
+        (getItemTags(item) && getItemTags(item)[0] && getItemTags(item)[0].color
+            ? getItemTags(item)[0].color
+            : item.layer?.markerDefaultColor);
     return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: hasUserPermission(collection, 'update', item) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: `tw-absolute tw-right-4 tw-bottom-4 tw-flex tw-flex-col ${customStyle}`, children: [triggerItemSelected && (jsxRuntime.jsx("button", { tabIndex: 0, className: 'tw-z-500 tw-btn tw-btn-circle tw-shadow', onClick: () => {
                                 setModalOpen(true);
                             }, style: {
-                                backgroundColor: `${colorField && getValue(item, colorField) ? getValue(item, colorField) : getItemTags(item) && getItemTags(item)[0] && getItemTags(item)[0].color ? getItemTags(item)[0].color : item.layer?.markerDefaultColor}`,
+                                backgroundColor,
                                 color: '#fff',
                             }, children: jsxRuntime.jsx("svg", { className: 'tw-h-5 tw-w-5', stroke: 'currentColor', fill: 'currentColor', strokeWidth: '0', viewBox: '0 0 512 512', xmlns: 'http://www.w3.org/2000/svg', children: jsxRuntime.jsx("path", { d: 'M326.612 185.391c59.747 59.809 58.927 155.698.36 214.59-.11.12-.24.25-.36.37l-67.2 67.2c-59.27 59.27-155.699 59.262-214.96 0-59.27-59.26-59.27-155.7 0-214.96l37.106-37.106c9.84-9.84 26.786-3.3 27.294 10.606.648 17.722 3.826 35.527 9.69 52.721 1.986 5.822.567 12.262-3.783 16.612l-13.087 13.087c-28.026 28.026-28.905 73.66-1.155 101.96 28.024 28.579 74.086 28.749 102.325.51l67.2-67.19c28.191-28.191 28.073-73.757 0-101.83-3.701-3.694-7.429-6.564-10.341-8.569a16.037 16.037 0 0 1-6.947-12.606c-.396-10.567 3.348-21.456 11.698-29.806l21.054-21.055c5.521-5.521 14.182-6.199 20.584-1.731a152.482 152.482 0 0 1 20.522 17.197zM467.547 44.449c-59.261-59.262-155.69-59.27-214.96 0l-67.2 67.2c-.12.12-.25.25-.36.37-58.566 58.892-59.387 154.781.36 214.59a152.454 152.454 0 0 0 20.521 17.196c6.402 4.468 15.064 3.789 20.584-1.731l21.054-21.055c8.35-8.35 12.094-19.239 11.698-29.806a16.037 16.037 0 0 0-6.947-12.606c-2.912-2.005-6.64-4.875-10.341-8.569-28.073-28.073-28.191-73.639 0-101.83l67.2-67.19c28.239-28.239 74.3-28.069 102.325.51 27.75 28.3 26.872 73.934-1.155 101.96l-13.087 13.087c-4.35 4.35-5.769 10.79-3.783 16.612 5.864 17.194 9.042 34.999 9.69 52.721.509 13.906 17.454 20.446 27.294 10.606l37.106-37.106c59.271-59.259 59.271-155.699.001-214.959z' }) }) })), triggerAddButton && (jsxRuntime.jsx("button", { tabIndex: 0, className: 'tw-z-500 tw-btn tw-btn-circle tw-shadow tw-mt-2', onClick: () => {
                                 triggerAddButton();
                             }, style: {
-                                backgroundColor: `${colorField && getValue(item, colorField) ? getValue(item, colorField) : getItemTags(item) && getItemTags(item)[0] && getItemTags(item)[0].color ? getItemTags(item)[0].color : item.layer?.markerDefaultColor}`,
+                                backgroundColor,
                                 color: '#fff',
                             }, children: jsxRuntime.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', fill: 'none', viewBox: '0 0 24 24', strokeWidth: '4', stroke: 'currentColor', className: 'tw-w-5 tw-h-5', children: jsxRuntime.jsx("path", { strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M12 4.5v15m7.5-7.5h-15' }) }) }))] }), jsxRuntime.jsxs(DialogModal, { title: 'Select', isOpened: modalOpen, onClose: () => setModalOpen(false), className: 'tw-w-xl sm:tw-w-2xl tw-min-h-80 tw-bg-base-200', children: [jsxRuntime.jsx(TextInput, { defaultValue: '', placeholder: '\uD83D\uDD0D Search', containerStyle: 'lg:col-span-2 tw-m-4 ', updateFormValue: (val) => {
                                 setSearch(val);
@@ -4552,20 +4617,11 @@ function ActionButton({ item, triggerAddButton, triggerItemSelected, existingRel
                                 }, children: jsxRuntime.jsx(HeaderView, { item: i, hideMenu: true }) }, i.id))) })] })] })) }));
 }
 
-function LinkedItemsHeaderView({ item, unlinkCallback, itemNameField, itemAvatarField, loading, unlinkPermission, itemSubnameField, }) {
+function LinkedItemsHeaderView({ item, unlinkCallback, loading, unlinkPermission, }) {
     const appState = useAppState();
-    const avatar = itemAvatarField && getValue(item, itemAvatarField)
-        ? appState.assetsApi.url + getValue(item, itemAvatarField)
-        : item.layer?.itemAvatarField &&
-            item &&
-            getValue(item, item.layer?.itemAvatarField) &&
-            appState.assetsApi.url + getValue(item, item.layer?.itemAvatarField);
-    const title = itemNameField
-        ? getValue(item, itemNameField)
-        : item.layer?.itemNameField && item && getValue(item, item.layer.itemNameField);
-    const subtitle = itemSubnameField
-        ? getValue(item, itemSubnameField)
-        : item.layer?.itemSubnameField && item && getValue(item, item.layer.itemSubnameField);
+    const avatar = appState.assetsApi.url + item.image;
+    const title = item.name;
+    const subtitle = item.subname;
     react.useEffect(() => { }, [item]);
     return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-row', children: [jsxRuntime.jsx("div", { className: 'tw-grow tw-max-w-[calc(100%-60px)] }', children: jsxRuntime.jsxs("div", { className: 'flex items-center', children: [avatar && (jsxRuntime.jsx("img", { className: 'tw-w-10 tw-inline tw-rounded-full', src: avatar, alt: item.name + ' logo' })), jsxRuntime.jsxs("div", { className: `${avatar ? 'tw-ml-2' : ''} tw-overflow-hidden`, children: [jsxRuntime.jsx("div", { className: 'tw-text-xl tw-font-semibold tw-truncate', children: title }), subtitle && (jsxRuntime.jsx("div", { className: 'tw-text-xs tw-truncate  tw-text-gray-500 ', children: subtitle }))] })] }) }), jsxRuntime.jsx("div", { className: 'tw-col-span-1', onClick: (e) => e.stopPropagation(), children: unlinkPermission && (jsxRuntime.jsxs("div", { className: 'tw-dropdown tw-dropdown-bottom', children: [jsxRuntime.jsx("label", { tabIndex: 0, className: ' tw-btn tw-m-1 tw-leading-3 tw-border-none tw-min-h-0 tw-h-6', children: jsxRuntime.jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', className: 'tw-h-5 tw-w-5', viewBox: '0 0 20 20', fill: 'currentColor', children: jsxRuntime.jsx("path", { d: 'M10 6a2 2 0 110-4 2 2 0 010 4zM10 12a2 2 0 110-4 2 2 0 010 4zM10 18a2 2 0 110-4 2 2 0 010 4z' }) }) }), jsxRuntime.jsx("ul", { tabIndex: 0, className: 'tw-dropdown-content tw-menu tw-p-2 tw-shadow tw-bg-base-100 tw-rounded-box tw-z-1000', children: (jsxRuntime.jsx("li", { children: jsxRuntime.jsx("a", { className: 'tw-cursor-pointer !tw-text-error', onClick: () => unlinkCallback(item.id), children: loading ? (jsxRuntime.jsx("span", { className: 'tw-loading tw-loading-spinner tw-loading-sm' })) : (jsxRuntime.jsx("svg", { className: 'tw-h-5 tw-w-5', stroke: 'currentColor', fill: 'currentColor', strokeWidth: '0', viewBox: '0 0 512 512', xmlns: 'http://www.w3.org/2000/svg', children: jsxRuntime.jsx("path", { d: 'M304.083 405.907c4.686 4.686 4.686 12.284 0 16.971l-44.674 44.674c-59.263 59.262-155.693 59.266-214.961 0-59.264-59.265-59.264-155.696 0-214.96l44.675-44.675c4.686-4.686 12.284-4.686 16.971 0l39.598 39.598c4.686 4.686 4.686 12.284 0 16.971l-44.675 44.674c-28.072 28.073-28.072 73.75 0 101.823 28.072 28.072 73.75 28.073 101.824 0l44.674-44.674c4.686-4.686 12.284-4.686 16.971 0l39.597 39.598zm-56.568-260.216c4.686 4.686 12.284 4.686 16.971 0l44.674-44.674c28.072-28.075 73.75-28.073 101.824 0 28.072 28.073 28.072 73.75 0 101.823l-44.675 44.674c-4.686 4.686-4.686 12.284 0 16.971l39.598 39.598c4.686 4.686 12.284 4.686 16.971 0l44.675-44.675c59.265-59.265 59.265-155.695 0-214.96-59.266-59.264-155.695-59.264-214.961 0l-44.674 44.674c-4.686 4.686-4.686 12.284 0 16.971l39.597 39.598zm234.828 359.28l22.627-22.627c9.373-9.373 9.373-24.569 0-33.941L63.598 7.029c-9.373-9.373-24.569-9.373-33.941 0L7.029 29.657c-9.373 9.373-9.373 24.569 0 33.941l441.373 441.373c9.373 9.372 24.569 9.372 33.941 0z' }) })) }) })) })] })) })] }) }));
 }
@@ -4602,16 +4658,19 @@ const TabsView = ({ attestations, item, offers, needs, relations, updatePermissi
         setActiveTab(urlTab ? Number(urlTab) : 1);
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [location.search]);
-    return (jsxRuntime.jsxs("div", { role: 'tablist', className: 'tw-tabs tw-tabs-lifted tw-mt-2 tw-mb-2 tw-px-6', children: [jsxRuntime.jsx("input", { type: 'radio', name: 'my_tabs_2', role: 'tab', className: 'tw-tab tw-font-bold !tw-ps-2 !tw-pe-2 [--tab-border-color:var(--fallback-bc,oklch(var(--bc)/0.2))]', "aria-label": `${item.layer?.itemType.icon_as_labels && activeTab !== 1 ? '📝' : '📝\u00A0Info'}`, checked: activeTab === 1 && true, onChange: () => updateActiveTab(1) }), jsxRuntime.jsxs("div", { role: 'tabpanel', className: 'tw-tab-content tw-bg-base-100 tw-rounded-box tw-h-[calc(100dvh-280px)] tw-overflow-y-auto fade tw-pt-2 tw-pb-4 tw-mb-4 tw-overflow-x-hidden', children: [item.layer?.itemType.show_start_end && (jsxRuntime.jsx("div", { className: 'tw-max-w-xs', children: jsxRuntime.jsx(StartEndView, { item: item }) })), jsxRuntime.jsx(TextView, { item: item }), jsxRuntime.jsx("div", { className: 'tw-h-4' }), jsxRuntime.jsx(TextView, { item: item, itemTextField: 'contact' })] }), item.layer?.itemType.questlog && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { type: 'radio', name: 'my_tabs_2', role: 'tab', className: 'tw-tab tw-font-bold !tw-ps-2 !tw-pe-2 [--tab-border-color:var(--fallback-bc,oklch(var(--bc)/0.2))]', "aria-label": `${item.layer.itemType.icon_as_labels && activeTab !== 2 ? '❤️' : '❤️\u00A0Trust'}`, checked: activeTab === 2 && true, onChange: () => updateActiveTab(2) }), jsxRuntime.jsx("div", { role: 'tabpanel', className: 'tw-tab-content tw-bg-base-100 tw-rounded-box tw-h-[calc(100dvh-280px)] tw-overflow-y-auto fade tw-pt-2 tw-pb-4 tw-mb-4 tw-overflow-x-hidden', children: jsxRuntime.jsx("table", { className: 'sm:tw-table-sm md:tw-table-md', children: jsxRuntime.jsx("tbody", { children: attestations
+    return (jsxRuntime.jsxs("div", { role: 'tablist', className: 'tw-tabs tw-tabs-lifted tw-mt-2 tw-mb-2 tw-px-6', children: [jsxRuntime.jsx("input", { type: 'radio', name: 'my_tabs_2', role: 'tab', className: 'tw-tab tw-font-bold !tw-ps-2 !tw-pe-2 [--tab-border-color:var(--fallback-bc,oklch(var(--bc)/0.2))]', "aria-label": `${item.layer?.itemType.icon_as_labels && activeTab !== 1 ? '📝' : '📝\u00A0Info'}`, checked: activeTab === 1 && true, onChange: () => updateActiveTab(1) }), jsxRuntime.jsxs("div", { role: 'tabpanel', className: 'tw-tab-content tw-bg-base-100 tw-rounded-box tw-h-[calc(100dvh-280px)] tw-overflow-y-auto fade tw-pt-2 tw-pb-4 tw-mb-4 tw-overflow-x-hidden', children: [item.layer?.itemType.show_start_end && (jsxRuntime.jsx("div", { className: 'tw-max-w-xs', children: jsxRuntime.jsx(StartEndView, { item: item }) })), jsxRuntime.jsx(TextView, { text: item.text, itemId: item.id }), jsxRuntime.jsx("div", { className: 'tw-h-4' }), jsxRuntime.jsx(TextView, { text: item.contact, itemId: item.id })] }), item.layer?.itemType.questlog && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { type: 'radio', name: 'my_tabs_2', role: 'tab', className: 'tw-tab tw-font-bold !tw-ps-2 !tw-pe-2 [--tab-border-color:var(--fallback-bc,oklch(var(--bc)/0.2))]', "aria-label": `${item.layer.itemType.icon_as_labels && activeTab !== 2 ? '❤️' : '❤️\u00A0Trust'}`, checked: activeTab === 2 && true, onChange: () => updateActiveTab(2) }), jsxRuntime.jsx("div", { role: 'tabpanel', className: 'tw-tab-content tw-bg-base-100 tw-rounded-box tw-h-[calc(100dvh-280px)] tw-overflow-y-auto fade tw-pt-2 tw-pb-4 tw-mb-4 tw-overflow-x-hidden', children: jsxRuntime.jsx("table", { className: 'sm:tw-table-sm md:tw-table-md', children: jsxRuntime.jsx("tbody", { children: attestations
                                     .filter((a) => a.to.some((t) => t.directus_users_id === item.user_created?.id))
                                     .sort((a, b) => new Date(b.date_created).getTime() - new Date(a.date_created).getTime())
                                     .map((a, i) => (jsxRuntime.jsxs("tr", { children: [jsxRuntime.jsx("td", { children: jsxRuntime.jsx("div", { className: `tw-cursor-pointer tw-text-3xl tw-mask tw-mask-${a.shape} tw-p-3 tw-mr-2 tw-shadow-xl tw-bg-[${a.color}]`, children: a.emoji }) }), jsxRuntime.jsx("td", { children: jsxRuntime.jsx("div", { className: 'tw-mr-2', children: jsxRuntime.jsx("i", { children: a.text }) }) }), jsxRuntime.jsx("td", { children: jsxRuntime.jsx(reactRouterDom.Link, { to: '/item/' + getUserProfile(a.user_created.id)?.id, children: jsxRuntime.jsxs("div", { className: 'flex items-center gap-3', children: [jsxRuntime.jsx("div", { className: 'tw-avatar', children: jsxRuntime.jsx("div", { className: 'tw-mask tw-rounded-full h-8 w-8 tw-mr-2', children: jsxRuntime.jsx("img", { src: appState.assetsApi.url +
                                                                         getUserProfile(a.user_created.id)?.image, alt: 'Avatar' }) }) }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { className: 'font-bold', children: getUserProfile(a.user_created.id)?.name }), jsxRuntime.jsx("div", { className: 'tw-text-xs opacity-50 tw-text-zinc-500', children: timeAgo(a.date_created) })] })] }) }) })] }, i))) }) }) })] })), item.layer?.itemType.offers_and_needs && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { type: 'radio', name: 'my_tabs_2', role: 'tab', className: `tw-tab tw-font-bold !tw-ps-2 !tw-pe-2 ${!(item.layer.itemType.icon_as_labels && activeTab !== 3) && 'tw-min-w-[10.4em]'} [--tab-border-color:var(--fallback-bc,oklch(var(--bc)/0.2))]`, "aria-label": `${item.layer.itemType.icon_as_labels && activeTab !== 3 ? '♻️' : '♻️\u00A0Offers & Needs'}`, checked: activeTab === 3 && true, onChange: () => updateActiveTab(3) }), jsxRuntime.jsx("div", { role: 'tabpanel', className: 'tw-tab-content tw-bg-base-100  tw-rounded-box tw-h-[calc(100dvh-268px)] tw-overflow-y-auto fade tw-pt-4 tw-pb-1', children: jsxRuntime.jsx("div", { className: 'tw-h-full', children: jsxRuntime.jsxs("div", { className: 'tw-grid tw-grid-cols-1', children: [offers.length > 0 ? (jsxRuntime.jsxs("div", { className: 'tw-col-span-1', children: [jsxRuntime.jsx("h3", { className: '-tw-mb-2', children: "Offers" }), jsxRuntime.jsx("div", { className: 'tw-flex tw-flex-wrap tw-mb-4', children: offers.map((o) => (jsxRuntime.jsx(TagView, { tag: o, onClick: () => {
                                                         addFilterTag(o);
                                                     } }, o.id))) })] })) : (''), needs.length > 0 ? (jsxRuntime.jsxs("div", { className: 'tw-col-span-1', children: [jsxRuntime.jsx("h3", { className: '-tw-mb-2 tw-col-span-1', children: "Needs" }), jsxRuntime.jsx("div", { className: 'tw-flex tw-flex-wrap  tw-mb-4', children: needs.map((n) => (jsxRuntime.jsx(TagView, { tag: n, onClick: () => addFilterTag(n) }, n.id))) })] })) : ('')] }) }) })] })), item.layer?.itemType.relations && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { type: 'radio', name: 'my_tabs_2', role: 'tab', className: 'tw-tab tw-font-bold !tw-ps-2 !tw-pe-2 [--tab-border-color:var(--fallback-bc,oklch(var(--bc)/0.2))]', "aria-label": `${item.layer.itemType.icon_as_labels && activeTab !== 7 ? '🔗' : '🔗\u00A0Links'}`, checked: activeTab === 7 && true, onChange: () => updateActiveTab(7) }), jsxRuntime.jsx("div", { role: 'tabpanel', className: 'tw-tab-content tw-bg-base-100  tw-rounded-box tw-h-[calc(100dvh-280px)] tw-overflow-y-auto tw-pt-4 tw-pb-1 -tw-mr-4 -tw-mb-4 tw-overflow-x-hidden', children: jsxRuntime.jsx("div", { className: 'tw-h-full', children: jsxRuntime.jsxs("div", { className: 'tw-grid tw-grid-cols-1 sm:tw-grid-cols-2 md:tw-grid-cols-1 lg:tw-grid-cols-1 xl:tw-grid-cols-1 2xl:tw-grid-cols-2 tw-pb-4', children: [relations &&
-                                        relations.map((i) => (jsxRuntime.jsxs("div", { className: 'tw-cursor-pointer tw-card tw-bg-base-200 tw-border-[1px] tw-border-base-300 tw-card-body tw-shadow-xl tw-text-base-content tw-p-6 tw-mr-4 tw-mb-4', onClick: () => navigate('/item/' + i.id), children: [jsxRuntime.jsx(LinkedItemsHeaderView, { unlinkPermission: updatePermission, item: i, unlinkCallback: unlinkItem, loading: loading }), jsxRuntime.jsx("div", { className: 'tw-overflow-y-auto tw-overflow-x-hidden tw-max-h-64 fade', children: jsxRuntime.jsx(TextView, { truncate: true, item: i }) })] }, i.id))), updatePermission && (jsxRuntime.jsx(ActionButton, { collection: 'items', item: item, existingRelations: relations, triggerItemSelected: linkItem, colorField: item.layer.itemColorField }))] }) }) })] }))] }));
+                                        relations.map((i) => (jsxRuntime.jsxs("div", { className: 'tw-cursor-pointer tw-card tw-bg-base-200 tw-border-[1px] tw-border-base-300 tw-card-body tw-shadow-xl tw-text-base-content tw-p-6 tw-mr-4 tw-mb-4', onClick: () => navigate('/item/' + i.id), children: [jsxRuntime.jsx(LinkedItemsHeaderView, { unlinkPermission: updatePermission, item: i, unlinkCallback: unlinkItem, loading: loading }), jsxRuntime.jsx("div", { className: 'tw-overflow-y-auto tw-overflow-x-hidden tw-max-h-64 fade', children: jsxRuntime.jsx(TextView, { truncate: true, text: i.text, itemId: item.id }) })] }, i.id))), updatePermission && (jsxRuntime.jsx(ActionButton, { collection: 'items', item: item, existingRelations: relations, triggerItemSelected: linkItem }))] }) }) })] }))] }));
 };
 
+/**
+ * @category Profile
+ */
 function ProfileView({ attestationApi }) {
     const [item, setItem] = react.useState();
     const [updatePermission, setUpdatePermission] = react.useState(false);
@@ -4660,28 +4719,23 @@ function ProfileView({ attestationApi }) {
         setOffers([]);
         setNeeds([]);
         setRelations([]);
-        item?.layer?.itemOffersField &&
-            getValue(item, item.layer.itemOffersField)?.map((o) => {
-                const tag = tags.find((t) => t.id === o.tags_id);
-                tag && setOffers((current) => [...current, tag]);
-                return null;
-            });
-        item?.layer?.itemNeedsField &&
-            getValue(item, item.layer.itemNeedsField)?.map((n) => {
-                const tag = tags.find((t) => t.id === n.tags_id);
-                tag && setNeeds((current) => [...current, tag]);
-                return null;
-            });
-        item?.relations?.map((r) => {
+        item?.offers?.forEach((o) => {
+            const tag = tags.find((t) => t.id === o.tags_id);
+            tag && setOffers((current) => [...current, tag]);
+        });
+        item?.needs?.forEach((n) => {
+            const tag = tags.find((t) => t.id === n.tags_id);
+            tag && setNeeds((current) => [...current, tag]);
+        });
+        item?.relations?.forEach((r) => {
             const item = items.find((i) => i.id === r.related_items_id);
             item && setRelations((current) => [...current, item]);
-            return null;
         });
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [item, items]);
     react.useEffect(() => {
-        const setMap = async (marker, x) => {
-            await map.setView(new leaflet.LatLng(item?.position?.coordinates[1], item?.position?.coordinates[0] + x / 4), undefined);
+        const setMap = (marker, x) => {
+            map.setView(new leaflet.LatLng(item?.position?.coordinates[1], item?.position?.coordinates[0] + x / 4), undefined);
             setTimeout(() => {
                 marker.openPopup();
             }, 500);
@@ -4729,7 +4783,7 @@ function ProfileView({ attestationApi }) {
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [selectPosition]);
     react.useEffect(() => {
-        setTemplate(item?.layer?.itemType.template || appState.userType);
+        setTemplate(item?.layer?.itemType.template ?? appState.userType);
     }, [appState.userType, item]);
     return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: item && (jsxRuntime.jsx(MapOverlayPage, { className: `!tw-p-0 tw-mx-4 tw-mt-4 tw-mb-4 md:tw-w-[calc(50%-32px)] tw-w-[calc(100%-32px)] tw-min-w-80 tw-max-w-3xl !tw-left-0 sm:!tw-left-auto tw-top-0 tw-bottom-0 tw-transition-opacity tw-duration-500 ${!selectPosition ? 'tw-opacity-100 tw-pointer-events-auto' : 'tw-opacity-0 tw-pointer-events-none'}`, children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: 'tw-px-6 tw-pt-6', children: jsxRuntime.jsx(HeaderView, { api: item.layer?.api, item: item, deleteCallback: (e) => handleDelete(e, item, setLoading, removeItem, map, navigate), editCallback: () => navigate('/edit-item/' + item.id), setPositionCallback: () => {
                                 map.closePopup();
@@ -4977,14 +5031,18 @@ const MarkdownHint = () => {
     return (jsxRuntime.jsxs("div", { onClick: () => setExpended(true), title: 'Markdown is supported', className: 'flex tw-flex-row tw-text-gray-400 tw-cursor-pointer tw-items-center', children: [jsxRuntime.jsx("svg", { "aria-hidden": 'true', height: '16', viewBox: '0 0 16 16', version: '1.1', width: '16', "data-view-component": 'true', className: 'octicon octicon-markdown', fill: 'rgb(156 163 175 / var(--tw-text-opacity))', children: jsxRuntime.jsx("path", { d: 'M14.85 3c.63 0 1.15.52 1.14 1.15v7.7c0 .63-.51 1.15-1.15 1.15H1.15C.52 13 0 12.48 0 11.84V4.15C0 3.52.52 3 1.15 3ZM9 11V5H7L5.5 7 4 5H2v6h2V8l1.5 1.92L7 8v3Zm2.99.5L14.5 8H13V5h-2v3H9.5Z' }) }), expended && (jsxRuntime.jsxs("a", { href: 'https://www.markdownguide.org/cheat-sheet/#basic-syntax', target: '_blank', rel: 'noreferrer', children: [jsxRuntime.jsx("span", { className: 'Button-label tw-ml-1', children: "Markdown is support" }), ' '] }))] }));
 };
 
-const ProfileTextForm = ({ state, setState, dataField, heading, size, hideInputLabel, required, }) => {
+const ProfileTextForm = ({ state, setState, 
+// Is this really used?
+dataField, heading, size, hideInputLabel, required, }) => {
     const [field, setField] = react.useState(dataField || 'text');
     react.useEffect(() => {
         if (!dataField) {
             setField('text');
         }
     }, [dataField]);
-    return (jsxRuntime.jsxs("div", { className: 'tw-h-full tw-flex tw-flex-col tw-mt-4', children: [jsxRuntime.jsxs("div", { className: 'tw-flex tw-justify-between tw-items-center', children: [jsxRuntime.jsxs("label", { htmlFor: 'nextAppointment', className: 'tw-block tw-text-sm tw-font-medium tw-text-gray-500 tw-mb-1', children: [heading || 'Text', ":"] }), jsxRuntime.jsx(MarkdownHint, {})] }), jsxRuntime.jsx(TextAreaInput, { placeholder: '...', defaultValue: getValue(state, field), updateFormValue: (v) => setState((prevState) => ({
+    return (jsxRuntime.jsxs("div", { className: 'tw-h-full tw-flex tw-flex-col tw-mt-4', children: [jsxRuntime.jsxs("div", { className: 'tw-flex tw-justify-between tw-items-center', children: [jsxRuntime.jsxs("label", { htmlFor: 'nextAppointment', className: 'tw-block tw-text-sm tw-font-medium tw-text-gray-500 tw-mb-1', children: [heading || 'Text', ":"] }), jsxRuntime.jsx(MarkdownHint, {})] }), jsxRuntime.jsx(TextAreaInput, { placeholder: '...', 
+                // eslint-disable-next-line security/detect-object-injection
+                defaultValue: state[field], updateFormValue: (v) => setState((prevState) => ({
                     ...prevState,
                     [field]: v,
                 })), labelStyle: hideInputLabel ? 'tw-hidden' : '', containerStyle: size === 'full' ? 'tw-grow tw-h-full' : '', inputStyle: size === 'full' ? 'tw-h-full' : 'tw-h-24', required: required })] }));
@@ -5186,16 +5244,19 @@ const TabsForm = ({ item, state, setState, updatePermission, linkItem, unlinkIte
                             })), containerStyle: 'tw-grow', inputStyle: `tw-h-full  ${!item.layer.itemType.show_start_end_input && 'tw-border-t-0 tw-rounded-tl-none'}` }), jsxRuntime.jsx("div", { children: jsxRuntime.jsx(TextAreaInput, { placeholder: 'contact info ...', defaultValue: state.contact || '', updateFormValue: (c) => setState((prevState) => ({
                                     ...prevState,
                                     contact: c,
-                                })), inputStyle: 'tw-h-24', containerStyle: 'tw-pt-4' }) })] }) }), item.layer?.itemType.offers_and_needs && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { type: 'radio', name: 'my_tabs_2', role: 'tab', className: 'tw-tab tw-min-w-[10em]  [--tab-border-color:var(--fallback-bc,oklch(var(--bc)/0.2))]', "aria-label": 'Offers & Needs', checked: activeTab === 3 && true, onChange: () => updateActiveTab(3) }), jsxRuntime.jsx("div", { role: 'tabpanel', className: 'tw-tab-content tw-bg-base-100 tw-border-[var(--fallback-bc,oklch(var(--bc)/0.2))] tw-rounded-box tw-h-[calc(100dvh-332px)] tw-min-h-56 tw-border-none', children: jsxRuntime.jsxs("div", { className: 'tw-h-full', children: [jsxRuntime.jsx("div", { className: 'tw-w-full tw-h-[calc(50%-0.75em)] tw-mb-4', children: jsxRuntime.jsx(TagsWidget, { defaultTags: state.offers, onUpdate: (v) => setState((prevState) => ({
+                                })), inputStyle: 'tw-h-24', containerStyle: 'tw-pt-4', required: false }) })] }) }), item.layer?.itemType.offers_and_needs && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { type: 'radio', name: 'my_tabs_2', role: 'tab', className: 'tw-tab tw-min-w-[10em]  [--tab-border-color:var(--fallback-bc,oklch(var(--bc)/0.2))]', "aria-label": 'Offers & Needs', checked: activeTab === 3 && true, onChange: () => updateActiveTab(3) }), jsxRuntime.jsx("div", { role: 'tabpanel', className: 'tw-tab-content tw-bg-base-100 tw-border-[var(--fallback-bc,oklch(var(--bc)/0.2))] tw-rounded-box tw-h-[calc(100dvh-332px)] tw-min-h-56 tw-border-none', children: jsxRuntime.jsxs("div", { className: 'tw-h-full', children: [jsxRuntime.jsx("div", { className: 'tw-w-full tw-h-[calc(50%-0.75em)] tw-mb-4', children: jsxRuntime.jsx(TagsWidget, { defaultTags: state.offers, onUpdate: (v) => setState((prevState) => ({
                                             ...prevState,
                                             offers: v,
                                         })), placeholder: 'enter your offers', containerStyle: 'tw-bg-transparent tw-w-full tw-h-full tw-mt-3 tw-text-xs tw-h-[calc(100%-1rem)] tw-min-h-[5em] tw-pb-2 tw-overflow-auto' }) }), jsxRuntime.jsx("div", { className: 'tw-w-full tw-h-[calc(50%-1.5em)]', children: jsxRuntime.jsx(TagsWidget, { defaultTags: state.needs, onUpdate: (v) => setState((prevState) => ({
                                             ...prevState,
                                             needs: v,
                                         })), placeholder: 'enter your needs', containerStyle: 'tw-bg-transparent tw-w-full tw-h-full tw-mt-3 tw-text-xs tw-h-[calc(100%-1rem)] tw-min-h-[5em] tw-pb-2 tw-overflow-auto' }) })] }) })] })), item.layer?.itemType.relations && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { type: 'radio', name: 'my_tabs_2', role: 'tab', className: 'tw-tab  [--tab-border-color:var(--fallback-bc,oklch(var(--bc)/0.2))]', "aria-label": 'Links', checked: activeTab === 7 && true, onChange: () => updateActiveTab(7) }), jsxRuntime.jsx("div", { role: 'tabpanel', className: 'tw-tab-content tw-bg-base-100  tw-rounded-box tw-h-[calc(100dvh-332px)] tw-overflow-y-auto tw-pt-4 tw-pb-1 -tw-mx-4 tw-overflow-x-hidden fade', children: jsxRuntime.jsx("div", { className: 'tw-h-full', children: jsxRuntime.jsxs("div", { className: 'tw-grid tw-grid-cols-1 sm:tw-grid-cols-2 md:tw-grid-cols-1 lg:tw-grid-cols-1 xl:tw-grid-cols-1 2xl:tw-grid-cols-2 tw-mb-4', children: [state.relations &&
-                                        state.relations.map((i) => (jsxRuntime.jsxs("div", { className: 'tw-cursor-pointer tw-card tw-bg-base-200 tw-border-[1px] tw-border-base-300 tw-card-body tw-shadow-xl tw-text-base-content tw-mx-4 tw-p-6 tw-mb-4', onClick: () => navigate('/item/' + i.id), children: [jsxRuntime.jsx(LinkedItemsHeaderView, { unlinkPermission: updatePermission, item: i, unlinkCallback: (id) => unlinkItem(id, item, updateItem), loading: loading }), jsxRuntime.jsx("div", { className: 'tw-overflow-y-auto tw-overflow-x-hidden tw-max-h-64 fade', children: jsxRuntime.jsx(TextView, { truncate: true, item: i }) })] }, i.id))), updatePermission && (jsxRuntime.jsx(ActionButton, { customStyle: '!tw-bottom-24', collection: 'items', item: item, existingRelations: state.relations, triggerItemSelected: (id) => linkItem(id, item, updateItem), colorField: item.layer.itemColorField }))] }) }) })] }))] }));
+                                        state.relations.map((i) => (jsxRuntime.jsxs("div", { className: 'tw-cursor-pointer tw-card tw-bg-base-200 tw-border-[1px] tw-border-base-300 tw-card-body tw-shadow-xl tw-text-base-content tw-mx-4 tw-p-6 tw-mb-4', onClick: () => navigate('/item/' + i.id), children: [jsxRuntime.jsx(LinkedItemsHeaderView, { unlinkPermission: updatePermission, item: i, unlinkCallback: (id) => unlinkItem(id, item, updateItem), loading: loading }), jsxRuntime.jsx("div", { className: 'tw-overflow-y-auto tw-overflow-x-hidden tw-max-h-64 fade', children: jsxRuntime.jsx(TextView, { truncate: true, itemId: item.id }) })] }, i.id))), updatePermission && (jsxRuntime.jsx(ActionButton, { customStyle: '!tw-bottom-24', collection: 'items', item: item, existingRelations: state.relations, triggerItemSelected: (id) => linkItem(id, item, updateItem) }))] }) }) })] }))] }));
 };
 
+/**
+ * @category Profile
+ */
 function ProfileForm() {
     const [state, setState] = react.useState({
         color: '',
@@ -5252,11 +5313,10 @@ function ProfileForm() {
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [items]);
     react.useEffect(() => {
-        const newColor = item.layer?.itemColorField && getValue(item, item.layer.itemColorField)
-            ? getValue(item, item.layer.itemColorField)
-            : getItemTags(item) && getItemTags(item)[0]?.color
+        const newColor = item.color ??
+            (getItemTags(item) && getItemTags(item)[0]?.color
                 ? getItemTags(item)[0].color
-                : item.layer?.markerDefaultColor;
+                : item.layer?.markerDefaultColor);
         const offers = (item.offers ?? []).reduce((acc, o) => {
             const offer = tags.find((t) => t.id === o.tags_id);
             if (offer)
@@ -5276,7 +5336,7 @@ function ProfileForm() {
             return acc;
         }, []);
         setState({
-            color: newColor,
+            color: newColor ?? '',
             id: item?.id ?? '',
             group_type: item?.group_type ?? '',
             status: item?.status ?? '',
@@ -5287,7 +5347,8 @@ function ProfileForm() {
             telephone: item?.telephone ?? '',
             next_appointment: item?.next_appointment ?? '',
             image: item?.image ?? '',
-            marker_icon: item?.marker_icon ?? '',
+            // Do we actually mean marker_icon here?
+            marker_icon: item?.markerIcon ?? '',
             offers,
             needs,
             relations,
@@ -5298,17 +5359,21 @@ function ProfileForm() {
     }, [item, tags, items]);
     const [template, setTemplate] = react.useState('');
     react.useEffect(() => {
-        setTemplate(item.layer?.itemType.template || appState.userType);
+        setTemplate(item.layer?.itemType.template ?? appState.userType);
     }, [appState.userType, item]);
     return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx(MapOverlayPage, { backdrop: true, className: 'tw-mx-4 tw-mt-4 tw-mb-4 tw-overflow-x-hidden tw-w-[calc(100%-32px)]  md:tw-w-[calc(50%-32px)] tw-max-w-3xl !tw-left-auto tw-top-0 tw-bottom-0', children: jsxRuntime.jsx("form", { className: 'tw-h-full', onSubmit: (e) => {
                     e.preventDefault();
                     void onUpdateItem(state, item, tags, addTag, setLoading, navigate, updateItem, addItem, user, urlParams);
                 }, children: jsxRuntime.jsxs("div", { className: 'tw-flex tw-flex-col tw-h-full', children: [jsxRuntime.jsx(FormHeader, { item: item, state: state, setState: setState }), template === 'onepager' && (jsxRuntime.jsx(OnepagerForm, { item: item, state: state, setState: setState })), template === 'simple' && jsxRuntime.jsx(SimpleForm, { state: state, setState: setState }), template === 'flex' && (jsxRuntime.jsx(FlexForm, { item: item, state: state, setState: setState })), template === 'tabs' && (jsxRuntime.jsx(TabsForm, { loading: loading, item: item, state: state, setState: setState, updatePermission: updatePermission, linkItem: (id) => linkItem(id, item, updateItem), unlinkItem: (id) => unlinkItem(id, item, updateItem), setUrlParams: setUrlParams })), jsxRuntime.jsx("div", { className: 'tw-mt-4', children: jsxRuntime.jsx("button", { className: loading ? ' tw-loading tw-btn tw-float-right' : 'tw-btn tw-float-right', type: 'submit', style: {
-                                    backgroundColor: `${item.layer?.itemColorField && getValue(item, item.layer?.itemColorField) ? getValue(item, item.layer?.itemColorField) : getItemTags(item) && getItemTags(item)[0] && getItemTags(item)[0].color ? getItemTags(item)[0].color : item?.layer?.markerDefaultColor}`,
+                                    // We could refactor this, it is used several times at different locations
+                                    backgroundColor: `${item.color ?? (getItemTags(item) && getItemTags(item)[0] && getItemTags(item)[0].color ? getItemTags(item)[0].color : item?.layer?.markerDefaultColor)}`,
                                     color: '#fff',
                                 }, children: "Update" }) })] }) }) }) }));
 }
 
+/**
+ * @category Gaming
+ */
 function Modal({ children, showOnStartup, }) {
     react.useEffect(() => {
         if (showOnStartup) {
@@ -5319,6 +5384,9 @@ function Modal({ children, showOnStartup, }) {
     return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("dialog", { id: 'my_modal_3', className: 'tw-modal tw-transition-all tw-duration-300', children: [jsxRuntime.jsxs("form", { method: 'dialog', className: 'tw-modal-box tw-transition-none', children: [jsxRuntime.jsx("button", { className: 'tw-btn tw-btn-sm tw-btn-circle tw-btn-ghost tw-absolute tw-right-2 tw-top-2 focus:tw-outline-none', children: "\u2715" }), children] }), jsxRuntime.jsx("form", { method: 'dialog', className: 'tw-modal-backdrop', children: jsxRuntime.jsx("button", { children: "close" }) })] }) }));
 }
 
+/**
+ * @category Gaming
+ */
 function Quests() {
     const questsOpen = useQuestsOpen();
     const setQuestsOpen = useSetQuestOpen();
@@ -5352,6 +5420,7 @@ exports.Modal = Modal;
 exports.MoonCalendar = MoonCalendar;
 exports.OverlayItemsIndexPage = OverlayItemsIndexPage;
 exports.Permissions = Permissions;
+exports.PlusButton = PlusButton;
 exports.PopupButton = PopupButton;
 exports.PopupCheckboxInput = PopupCheckboxInput;
 exports.PopupStartEndInput = PopupStartEndInput;
@@ -5375,4 +5444,5 @@ exports.TextView = TextView;
 exports.TitleCard = TitleCard;
 exports.UserSettings = UserSettings;
 exports.UtopiaMap = UtopiaMap;
+exports.useAuth = useAuth;
 //# sourceMappingURL=index.cjs.map