Skip to content

Commit c03d2f1

Browse files
mProjectsCodemProjectsCode
committed
more list and suggester ipf improvements
1 parent 342e9c6 commit c03d2f1

File tree

11 files changed

+74
-27
lines changed

11 files changed

+74
-27
lines changed

‎packages/core/src/config/FieldConfigs.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -438,7 +438,7 @@ export const InputFieldArgumentConfigs: Record<InputFieldArgumentType, InputFiel
438438
},
439439
[InputFieldArgumentType.MULTI_LINE]: {
440440
type: InputFieldArgumentType.MULTI_LINE,
441-
allowedFieldTypes: [InputFieldType.LIST, InputFieldType.INLINE_LIST],
441+
allowedFieldTypes: [InputFieldType.LIST],
442442
values: [
443443
[
444444
{

‎packages/core/src/fields/fieldArguments/inputFieldArguments/InputFieldArgumentFactory.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,8 @@ import { StepSizeValueInputFieldArgument } from 'packages/core/src/fields/fieldA
1515
import { TitleInputFieldArgument } from 'packages/core/src/fields/fieldArguments/inputFieldArguments/arguments/TitleInputFieldArgument';
1616
import { UseLinksInputFieldArgument } from 'packages/core/src/fields/fieldArguments/inputFieldArguments/arguments/UseLinksInputFieldArgument';
1717
import { ErrorLevel, MetaBindParsingError } from 'packages/core/src/utils/errors/MetaBindErrors';
18+
import { MultiLineInputFieldArgument } from 'packages/core/src/fields/fieldArguments/inputFieldArguments/arguments/MultiLineInputFieldArgument';
19+
import { AllowOtherInputFieldArgument } from 'packages/core/src/fields/fieldArguments/inputFieldArguments/arguments/AllowOtherInputFieldArgument';
1820

1921
export const INPUT_FIELD_ARGUMENT_MAP = {
2022
[InputFieldArgumentType.CLASS]: ClassInputFieldArgument,
@@ -32,6 +34,8 @@ export const INPUT_FIELD_ARGUMENT_MAP = {
3234
[InputFieldArgumentType.PLACEHOLDER]: PlaceholderInputFieldArgument,
3335
[InputFieldArgumentType.USE_LINKS]: UseLinksInputFieldArgument,
3436
[InputFieldArgumentType.LIMIT]: LimitInputFieldArgument,
37+
[InputFieldArgumentType.ALLOW_OTHER]: AllowOtherInputFieldArgument,
38+
[InputFieldArgumentType.MULTI_LINE]: MultiLineInputFieldArgument,
3539
} as const;
3640

3741
export type InputFieldArgumentMapType<T extends InputFieldArgumentType> =

‎packages/core/src/fields/inputFields/fields/InlineList/InlineListComponent.svelte‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -28,13 +28,6 @@
2828
value = value;
2929
}
3030
31-
function input(event: MouseEvent): void {
32-
// don't fire the event if user clicked on the link
33-
if (!(event.target instanceof HTMLAnchorElement)) {
34-
showInput();
35-
}
36-
}
37-
3831
function inputKey(event: KeyboardEvent): void {
3932
if (event.key === ' ') {
4033
showInput();
@@ -109,7 +102,7 @@
109102
</button>
110103
</div>
111104
{/each}
112-
<div class="mb-inline-list-add" on:click={input} on:keydown={inputKey} role="button" tabindex="0">
105+
<div class="mb-inline-list-add" on:click={() => showInput()} on:keydown={inputKey} role="button" tabindex="0">
113106
<!-- Alignment hack with zero width space -->
114107
<span>&#x200B;</span>
115108
<Icon plugin={plugin} iconName="plus" />

‎packages/core/src/fields/inputFields/fields/InlineListSuggester/InlineListSuggesterComponent.svelte‎

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@
88
export let plugin: IPlugin;
99
export let value: MBLiteral[];
1010
export let showSuggester: () => void;
11+
export let showTextPrompt: () => void;
12+
export let allowsOther: boolean;
1113
export let onValueChange: (value: MBLiteral[]) => void;
1214
1315
export function setValue(v: MBLiteral[]): void {
@@ -29,10 +31,23 @@
2931
}
3032
3133
function suggest(event: MouseEvent): void {
32-
// don't fire the event if user clicked on the link
33-
if (!(event.target instanceof HTMLAnchorElement)) {
34+
if (!allowsOther) {
3435
showSuggester();
36+
return;
3537
}
38+
39+
plugin.internal
40+
.createContextMenu([
41+
{
42+
name: 'From Options',
43+
onclick: () => showSuggester(),
44+
},
45+
{
46+
name: 'From Text',
47+
onclick: () => showTextPrompt(),
48+
},
49+
])
50+
.showWithEvent(event);
3651
}
3752
3853
function suggestKey(event: KeyboardEvent): void {

‎packages/core/src/fields/inputFields/fields/InlineListSuggester/InlineListSuggesterIPF.ts‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { AbstractInputField } from 'packages/core/src/fields/inputFields/Abstrac
22
import InlineListSuggesterComponent from 'packages/core/src/fields/inputFields/fields/InlineListSuggester/InlineListSuggesterComponent.svelte';
33
import { type MBLiteral, parseUnknownToLiteralArray } from 'packages/core/src/utils/Literal';
44
import { type SvelteComponent } from 'svelte';
5+
import { InputFieldArgumentType } from 'packages/core/src/config/FieldConfigs';
56

67
export class InlineListSuggesterIPF extends AbstractInputField<MBLiteral[], MBLiteral[]> {
78
protected filterValue(value: unknown): MBLiteral[] | undefined {
@@ -28,6 +29,8 @@ export class InlineListSuggesterIPF extends AbstractInputField<MBLiteral[], MBLi
2829
protected getMountArgs(): Record<string, unknown> {
2930
return {
3031
showSuggester: () => this.openModal(),
32+
showTextPrompt: () => this.openTextModal(),
33+
allowsOther: this.base.getArgument(InputFieldArgumentType.ALLOW_OTHER)?.value === true,
3134
};
3235
}
3336

@@ -38,4 +41,19 @@ export class InlineListSuggesterIPF extends AbstractInputField<MBLiteral[], MBLi
3841
this.setInternalValue(value);
3942
});
4043
}
44+
45+
openTextModal(): void {
46+
this.base.plugin.internal.openTextPromptModal(
47+
'',
48+
'Meta Bind List Suggester',
49+
'New List Element',
50+
'',
51+
(newElement: MBLiteral) => {
52+
const value = this.getInternalValue();
53+
value.push(newElement);
54+
this.setInternalValue(value);
55+
},
56+
() => {},
57+
);
58+
}
4159
}

‎packages/core/src/fields/inputFields/fields/List/ListComponent.svelte‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,14 @@
55
import Button from '../../../../utils/components/Button.svelte';
66
import { IPlugin } from '../../../../IPlugin';
77
import { ContextMenuItemDefinition } from 'packages/core/src/utils/IContextMenu';
8+
import { ButtonStyleType } from '../../../../config/ButtonConfig';
89
910
export let plugin: IPlugin;
1011
export let value: MBLiteral[];
1112
export let limit: number | undefined;
1213
export let placeholder: string;
14+
// TODO: implement multiLine support
15+
export let multiLine: boolean;
1316
export let onValueChange: (value: MBLiteral[]) => void;
1417
1518
let addValue: string = '';
@@ -104,7 +107,7 @@
104107
{#each value as entry, i}
105108
<div class="mb-list-item">
106109
<LiteralRenderComponent value={entry}></LiteralRenderComponent>
107-
<Button on:click={e => openContextMenuForElement(e, i)}>
110+
<Button variant={ButtonStyleType.PLAIN} on:click={e => openContextMenuForElement(e, i)}>
108111
<Icon plugin={plugin} iconName="more-vertical" />
109112
</Button>
110113
</div>

‎packages/core/src/fields/inputFields/fields/List/ListIPF.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ export class ListIPF extends AbstractInputField<MBLiteral[], MBLiteral[]> {
3030
return {
3131
placeholder: this.base.getArgument(InputFieldArgumentType.PLACEHOLDER)?.value ?? 'New Entry...',
3232
limit: this.base.getArgument(InputFieldArgumentType.LIMIT)?.value,
33+
multiLine: this.base.getArgument(InputFieldArgumentType.MULTI_LINE)?.value === true,
3334
};
3435
}
3536
}

‎packages/core/src/fields/inputFields/fields/ListSuggester/ListSuggesterComponent.svelte‎

Lines changed: 8 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,13 @@
55
import Button from '../../../../utils/components/Button.svelte';
66
import { IPlugin } from '../../../../IPlugin';
77
import { ContextMenuItemDefinition } from 'packages/core/src/utils/IContextMenu';
8+
import { ButtonStyleType } from 'packages/core/src/config/ButtonConfig';
89
910
export let plugin: IPlugin;
1011
export let value: MBLiteral[];
1112
export let showSuggester: () => void;
13+
export let showTextPrompt: () => void;
14+
export let allowsOther: boolean;
1215
export let onValueChange: (value: MBLiteral[]) => void;
1316
1417
export function setValue(v: MBLiteral[]): void {
@@ -29,13 +32,6 @@
2932
value = value;
3033
}
3134
32-
function suggest(event: MouseEvent): void {
33-
// don't fire the event if user clicked on the link
34-
if (!(event.target instanceof HTMLAnchorElement)) {
35-
showSuggester();
36-
}
37-
}
38-
3935
function suggestKey(event: KeyboardEvent): void {
4036
if (event.key === ' ') {
4137
showSuggester();
@@ -86,7 +82,7 @@
8682
{#each value as entry, i}
8783
<div class="mb-list-item">
8884
<LiteralRenderComponent value={entry}></LiteralRenderComponent>
89-
<Button on:click={e => openContextMenuForElement(e, i)}>
85+
<Button variant={ButtonStyleType.PLAIN} on:click={e => openContextMenuForElement(e, i)}>
9086
<Icon plugin={plugin} iconName="more-vertical" />
9187
</Button>
9288
</div>
@@ -95,10 +91,8 @@
9591
{/each}
9692
</div>
9793
<div class="mb-list-input">
98-
<div class="mb-suggest-input" on:click={suggest} on:keydown={suggestKey} role="button" tabindex="0">
99-
<div class="mb-suggest-text">
100-
<span>Add Element...</span>
101-
</div>
102-
<Icon plugin={plugin} iconName="list" />
103-
</div>
94+
<Button variant={ButtonStyleType.DEFAULT} on:click={() => showSuggester()}>Add new item</Button>
95+
{#if allowsOther}
96+
<Button variant={ButtonStyleType.DEFAULT} on:click={() => showTextPrompt()}>Add other item</Button>
97+
{/if}
10498
</div>

‎packages/core/src/fields/inputFields/fields/ListSuggester/ListSuggesterIPF.ts‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { AbstractInputField } from 'packages/core/src/fields/inputFields/Abstrac
22
import ListSuggesterComponent from 'packages/core/src/fields/inputFields/fields/ListSuggester/ListSuggesterComponent.svelte';
33
import { type MBLiteral, parseUnknownToLiteralArray } from 'packages/core/src/utils/Literal';
44
import { type SvelteComponent } from 'svelte';
5+
import { InputFieldArgumentType } from 'packages/core/src/config/FieldConfigs';
56

67
export class ListSuggesterIPF extends AbstractInputField<MBLiteral[], MBLiteral[]> {
78
protected filterValue(value: unknown): MBLiteral[] | undefined {
@@ -28,6 +29,8 @@ export class ListSuggesterIPF extends AbstractInputField<MBLiteral[], MBLiteral[
2829
protected getMountArgs(): Record<string, unknown> {
2930
return {
3031
showSuggester: () => this.openModal(),
32+
showTextPrompt: () => this.openTextModal(),
33+
allowsOther: this.base.getArgument(InputFieldArgumentType.ALLOW_OTHER)?.value === true,
3134
};
3235
}
3336

@@ -38,4 +41,19 @@ export class ListSuggesterIPF extends AbstractInputField<MBLiteral[], MBLiteral[
3841
this.setInternalValue(value);
3942
});
4043
}
44+
45+
openTextModal(): void {
46+
this.base.plugin.internal.openTextPromptModal(
47+
'',
48+
'Meta Bind List Suggester',
49+
'New List Element',
50+
'',
51+
(newElement: MBLiteral) => {
52+
const value = this.getInternalValue();
53+
value.push(newElement);
54+
this.setInternalValue(value);
55+
},
56+
() => {},
57+
);
58+
}
4159
}

‎packages/core/src/fields/inputFields/fields/Suggester/SuggesterComponent.svelte‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
export let plugin: IPlugin;
1010
export let value: MBLiteral;
1111
export let showSuggester: () => void;
12+
// TODO: implement allowOther option
1213
export let onValueChange: (value: MBLiteral) => void;
1314
1415
let mdLink: MarkdownLink;

0 commit comments

Comments
 (0)