feat: allow click on item

fixes #25 fixes algolia/autocomplete#1255 (comment) fixes algolia/autocomplete#1259
tiddly-gittly · Jun 5, 2024 · cb13092 · cb13092
1 parent 0c6da53
commit cb13092
Show file tree

Hide file tree

Showing 12 changed files with 98 additions and 26 deletions.
diff --git a/src/commandpalette/widgets/build-in-sub-plugins/command-action-string.ts b/src/commandpalette/widgets/build-in-sub-plugins/command-action-string.ts
@@ -53,11 +53,15 @@ export const plugin = {
             // show original title + caption
             return `${lingo('ActionString')} - ${lingo('CurrentTiddler')}: ${focusedTiddler} ${caption}`;
           },
-          item({ item }) {
+          item({ item, createElement, state }) {
             const description = item.description
               ? ` (${renderTextWithCache(item.description as string, widget, variables)})`
               : '';
-            return `${renderTextWithCache(item.caption, widget, variables)}${description}` || item.title;
+            return createElement('div', {
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
+            }, `${renderTextWithCache(item.caption, widget, variables)}${description}` || item.title);
           },
         },
       },

diff --git a/src/commandpalette/widgets/build-in-sub-plugins/command-message.ts b/src/commandpalette/widgets/build-in-sub-plugins/command-message.ts
@@ -63,11 +63,15 @@ export const plugin = {
             // show original title + caption
             return `${lingo('Message')} - ${lingo('CurrentTiddler')}: ${focusedTiddler} ${caption}`;
           },
-          item({ item }) {
+          item({ item, createElement, state }) {
             const description = item.description
               ? ` (${renderTextWithCache(item.description as string, widget, variables)})`
               : '';
-            return `${renderTextWithCache(item.caption, widget, variables)}${description}` || item.title;
+            return createElement('div', {
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
+            }, `${renderTextWithCache(item.caption, widget, variables)}${description}` || item.title);
           },
         },
       },

diff --git a/src/commandpalette/widgets/build-in-sub-plugins/search-config.ts b/src/commandpalette/widgets/build-in-sub-plugins/search-config.ts
@@ -35,11 +35,19 @@ export const plugin = {
           header() {
             return lingo('Config');
           },
-          item({ item }) {
+          item({ item, createElement, state }) {
             if (typeof item.caption === 'string' && item.caption !== '') {
-              return renderTextWithCache(item.caption, widget);
+              return createElement('div', {
+                onclick: () => {
+                  parameters.navigator.navigate({ item, itemUrl: item.title, state });
+                },
+              }, renderTextWithCache(item.caption, widget));
             }
-            return item.title;
+            return createElement('div', {
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
+            }, item.title);
           },
         },
       },

diff --git a/src/commandpalette/widgets/build-in-sub-plugins/search-filter.ts b/src/commandpalette/widgets/build-in-sub-plugins/search-filter.ts
@@ -53,13 +53,16 @@ export const plugin = {
           header() {
             return lingo('Filter');
           },
-          item({ item, createElement }) {
+          item({ item, createElement, state }) {
             const caption = renderTextWithCache(item.caption, widget);
             const description = item.description
               ? `${caption ? ' - ' : ''}${renderTextWithCache(item.description as string, widget)}`
               : '';
             return createElement('div', {
               style: 'display:flex;flex-direction:column;',
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
             }, [
               createElement('div', { style: 'margin-bottom:0.25em;' }, `${caption}${description}`),
               createElement('div', {}, [

diff --git a/src/commandpalette/widgets/build-in-sub-plugins/search-help.ts b/src/commandpalette/widgets/build-in-sub-plugins/search-help.ts
@@ -40,12 +40,15 @@ export const plugin = {
           header() {
             return lingo('Help');
           },
-          item({ item, createElement }) {
+          item({ item, state, createElement }) {
             const description = item.description
               ? ` ${renderTextWithCache(item.description as string, widget)}`
               : '';
             return createElement('div', {
               style: 'display:flex;flex-direction:column;',
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
             }, [
               createElement('div', { style: 'margin-bottom:0.25em;' }, [
                 createElement('em', { style: 'margin-right:0.25em;' }, [item['command-palette-prefix'] as string]),

diff --git a/src/commandpalette/widgets/build-in-sub-plugins/search-layout.ts b/src/commandpalette/widgets/build-in-sub-plugins/search-layout.ts
@@ -47,17 +47,24 @@ export const plugin = {
               : $tw.wiki.getTiddlerText('$:/language/PageTemplate/Name');
             return `${lingo('Layout')} - ${lingo('CurrentLayout')}: ${currentLayoutName}`;
           },
-          item({ item, createElement }) {
+          item({ item, createElement, state }) {
             if (typeof item.name === 'string' && item.name !== '') {
               const name = renderTextWithCache(item.name, widget);
               const description = renderTextWithCache(item.description, widget);
               const icon = getIconSvg(item.icon as string, widget);
               return createElement('div', {
                 class: 'tw-commandpalette-layout-result',
+                onclick: () => {
+                  parameters.navigator.navigate({ item, itemUrl: item.title, state });
+                },
                 innerHTML: `${icon}${name}${description ? ` - ${description}` : ''}`,
               });
             }
-            return item.title;
+            return createElement('div', {
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
+            }, item.title);
           },
         },
       },

diff --git a/src/commandpalette/widgets/build-in-sub-plugins/search-story-history.ts b/src/commandpalette/widgets/build-in-sub-plugins/search-story-history.ts
@@ -38,11 +38,19 @@ export const plugin = {
           header() {
             return lingo('StoryHistory');
           },
-          item({ item }) {
+          item({ item, createElement, state }) {
             if (typeof item.caption === 'string' && item.caption !== '') {
-              return `${renderTextWithCache(item.caption, widget)} (${item.title})`;
+              return createElement('div', {
+                onclick: () => {
+                  parameters.navigator.navigate({ item, itemUrl: item.title, state });
+                },
+              }, `${renderTextWithCache(item.caption, widget)} (${item.title})`);
             }
-            return item.title;
+            return createElement('div', {
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
+            }, item.title);
           },
         },
       },

diff --git a/src/commandpalette/widgets/build-in-sub-plugins/search-system-title.ts b/src/commandpalette/widgets/build-in-sub-plugins/search-system-title.ts
@@ -23,11 +23,19 @@ export const plugin = {
           header() {
             return lingo('SystemTitle');
           },
-          item({ item }) {
+          item({ item, createElement, state }) {
             if (typeof item.caption === 'string' && item.caption !== '') {
-              return `${item.caption} (${item.title})`;
+              return createElement('div', {
+                onclick: () => {
+                  parameters.navigator.navigate({ item, itemUrl: item.title, state });
+                },
+              }, `${item.caption} (${item.title})`);
             }
-            return item.title;
+            return createElement('div', {
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
+            }, item.title);
           },
         },
       },

diff --git a/src/commandpalette/widgets/build-in-sub-plugins/search-tags.ts b/src/commandpalette/widgets/build-in-sub-plugins/search-tags.ts
@@ -30,11 +30,19 @@ export const plugin = {
         header() {
           return lingo('Tags');
         },
-        item({ item }) {
+        item({ item, createElement, state }) {
           if (typeof item.caption === 'string' && item.caption !== '') {
-            return `${item.caption} (${item.title})`;
+            return createElement('div', {
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
+            }, `${item.caption} (${item.title})`);
           }
-          return item.title;
+          return createElement('div', {
+            onclick: () => {
+              parameters.navigator.navigate({ item, itemUrl: item.title, state });
+            },
+          }, item.title);
         },
         noResults() {
           return lingo('NoResult');

diff --git a/src/commandpalette/widgets/build-in-sub-plugins/search-user-text.ts b/src/commandpalette/widgets/build-in-sub-plugins/search-user-text.ts
@@ -48,6 +48,9 @@ export const plugin = {
 
             return createElement('div', {
               style: 'display:flex;flex-direction:column;',
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
             }, [
               createElement('div', { style: 'margin-bottom:0.25em;' }, title),
               createElement('div', {}, [

diff --git a/src/commandpalette/widgets/build-in-sub-plugins/search-user-title-pinyin.ts b/src/commandpalette/widgets/build-in-sub-plugins/search-user-title-pinyin.ts
@@ -32,11 +32,19 @@ export const plugin = {
           header() {
             return lingo('UserTitlePinyin');
           },
-          item({ item }) {
+          item({ item, createElement, state }) {
             if (typeof item.caption === 'string' && item.caption !== '') {
-              return `${item.caption} (${item.title})`;
+              return createElement('div', {
+                onclick: () => {
+                  parameters.navigator.navigate({ item, itemUrl: item.title, state });
+                },
+              }, `${item.caption} (${item.title})`);
             }
-            return item.title;
+            return createElement('div', {
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
+            }, item.title);
           },
         },
       },

diff --git a/src/commandpalette/widgets/build-in-sub-plugins/search-user-title.ts b/src/commandpalette/widgets/build-in-sub-plugins/search-user-title.ts
@@ -24,11 +24,19 @@ export const plugin = {
           header() {
             return lingo('UserTitle');
           },
-          item({ item }) {
+          item({ item, createElement, state }) {
             if (typeof item.caption === 'string' && item.caption !== '') {
-              return `${item.caption} (${item.title})`;
+              return createElement('div', {
+                onclick: () => {
+                  parameters.navigator.navigate({ item, itemUrl: item.title, state });
+                },
+              }, `${item.caption} (${item.title})`);
             }
-            return item.title;
+            return createElement('div', {
+              onclick: () => {
+                parameters.navigator.navigate({ item, itemUrl: item.title, state });
+              },
+            }, item.title);
           },
         },
       },