benjaminramey/Twain
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Reorganize components and add application form buttons component

Browse Source
This commit is contained in:
Benjamin Ramey
2024-05-01 09:56:40 -05:00
parent c64202b66b
commit 65595607da
24 changed files with 939 additions and 566 deletions
Download Patch File Download Diff File Expand all files Collapse all files

516
src/OAP/Oap.Content/Migrations.cs
View File

@@ -1,243 +1,273 @@
using Oap.OapApplication;
using OrchardCore.Autoroute.Models;
using OrchardCore.ContentFields.Fields;
using OrchardCore.ContentFields.Settings;
using OrchardCore.ContentManagement.Metadata;
using OrchardCore.ContentManagement.Metadata.Settings;
using OrchardCore.Data.Migration;
using OrchardCore.Flows.Models;
using OrchardCore.Forms.Models;
using OrchardCore.Html.Models;
using OrchardCore.Html.Settings;
using OrchardCore.Lists.Models;
using OrchardCore.Mvc.Utilities;
using OrchardCore.Title.Models;
namespace Oap.Content;
public class Migrations : DataMigration
{
public Migrations(IContentDefinitionManager contentDefinitionManager)
{
m_contentDefinitionManager = contentDefinitionManager;
}
public async Task<int> CreateAsync()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync(ContentTypes.OapApplicationFormStep, type => type
.Securable()
.Draftable()
.Versionable()
.WithPart(nameof(TitlePart), part => part
.WithPosition("1"))
.WithPart(nameof(AutoroutePart), part => part
.WithPosition("2")
.WithSettings(new AutoroutePartSettings
{
AllowCustomPath = true,
AllowUpdatePath = true,
}))
.WithPart(nameof(FlowPart), part => part
.WithPosition("3")));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync(ContentTypes.OapApplicationForm, type => type
.Creatable()
.Listable()
.Securable()
.Draftable()
.Versionable()
.WithPart(nameof(AutoroutePart), part => part
.WithPosition("2")
.WithSettings(new AutoroutePartSettings
{
AllowCustomPath = true,
AllowUpdatePath = true,
}))
.WithPart(nameof(ListPart), part => part
.WithDisplayName("Form Steps")
.WithPosition("3")
.WithSettings(new ListPartSettings
{
PageSize = 10,
EnableOrdering = true,
ContainedContentTypes = [ContentTypes.OapApplicationFormStep]
})
));
await m_contentDefinitionManager
.AlterPartDefinitionAsync(nameof(OapApplicationPart), builder => builder
.Attachable()
.WithField(nameof(OapApplicationPart.Status), field => field
.OfType(nameof(TextField))
.WithDisplayName(nameof(OapApplicationPart.Status))
.WithDescription("The status of the OAP Application.")
.WithEditor("PredefinedList")
.WithSettings(new TextFieldPredefinedListEditorSettings
{
Options = new[]
{
new ListValueOption { Name = OapApplicationStatuses.InProgress, Value = OapApplicationStatuses.InProgress.HtmlClassify() },
new ListValueOption { Name = OapApplicationStatuses.Submitted, Value = OapApplicationStatuses.Submitted.HtmlClassify() },
},
DefaultValue = OapApplicationStatuses.InProgress.HtmlClassify(),
Editor = EditorOption.Radio,
}))
.WithDescription("Makes a content item into an OAP Application."));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync(ContentTypes.OapApplication, type => type
.Creatable()
.Listable()
.Securable()
.WithPart(nameof(HtmlBodyPart), part => part
.WithDisplayName("Notes")
.WithSettings(new ContentTypePartSettings { Editor = "Wysiwyg", })
)
.WithPart(nameof(OapApplicationPart)));
return 1;
}
public async Task<int> UpdateFrom1Async()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync(ContentTypes.OapApplicationFormStep, type => type
.WithPart(nameof(HtmlBodyPart), part => part
.WithPosition("2")
.WithEditor("Wysiwyg")
.WithSettings(new HtmlBodyPartSettings
{
SanitizeHtml = true,
})));
return 2;
}
public Task<int> UpdateFrom2Async()
{
return Task.FromResult(3);
}
public Task<int> UpdateFrom3Async()
{
return Task.FromResult(4);
}
public Task<int> UpdateFrom4Async()
{
return Task.FromResult(5);
}
public Task<int> UpdateFrom5Async()
{
return Task.FromResult(6);
}
public async Task<int> UpdateFrom6Async()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync(ContentTypes.OapApplicationForm, type => type
.WithPart(nameof(TitlePart)));
return 7;
}
public async Task<int> UpdateFrom7Async()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Input", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("1")
.WithDisplayName("Details to help the user correctly fill out this form field.")
.WithEditor("Wysiwyg")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("TextArea", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("1")
.WithDisplayName("Details to help the user correctly fill out this form field.")
.WithEditor("Wysiwyg")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Select", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("1")
.WithDisplayName("Details to help the user correctly fill out this form field.")
.WithEditor("Wysiwyg")
));
return 8;
}
public async Task<int> UpdateFrom8Async()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Input", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("4")
)
.WithPart("InputPart", part => part
.WithPosition("5")
)
.WithPart("FormElementValidationPart", part => part
.WithPosition("6")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("TextArea", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("4")
)
.WithPart("TextAreaPart", part => part
.WithPosition("5")
)
.WithPart("FormElementValidationPart", part => part
.WithPosition("6")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Select", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("4")
)
.WithPart("SelectPart", part => part
.WithPosition("5")
)
.WithPart("FormElementValidationPart", part => part
.WithPosition("6")
));
return 9;
}
public async Task<int> UpdateFrom9Async()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Input", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithDisplayName("Explanation")
.WithDescription("Details to help the user correctly fill out this form field.")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("TextArea", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithDisplayName("Explanation")
.WithDescription("Details to help the user correctly fill out this form field.")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Select", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithDisplayName("Explanation")
.WithDescription("Details to help the user correctly fill out this form field.")
));
return 10;
}
private readonly IContentDefinitionManager m_contentDefinitionManager;
}
using Oap.OapApplication;
using OrchardCore.Autoroute.Models;
using OrchardCore.ContentFields.Fields;
using OrchardCore.ContentFields.Settings;
using OrchardCore.ContentManagement.Metadata;
using OrchardCore.ContentManagement.Metadata.Settings;
using OrchardCore.Data.Migration;
using OrchardCore.Flows.Models;
using OrchardCore.Forms.Models;
using OrchardCore.Html.Models;
using OrchardCore.Html.Settings;
using OrchardCore.Lists.Models;
using OrchardCore.Mvc.Utilities;
using OrchardCore.Title.Models;
namespace Oap.Content;
public class Migrations : DataMigration
{
public Migrations(IContentDefinitionManager contentDefinitionManager)
{
m_contentDefinitionManager = contentDefinitionManager;
}
public async Task<int> CreateAsync()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync(ContentTypes.OapApplicationFormStep, type => type
.Securable()
.Draftable()
.Versionable()
.WithPart(nameof(TitlePart), part => part
.WithPosition("1"))
.WithPart(nameof(AutoroutePart), part => part
.WithPosition("2")
.WithSettings(new AutoroutePartSettings
{
AllowCustomPath = true,
AllowUpdatePath = true,
}))
.WithPart(nameof(FlowPart), part => part
.WithPosition("3")));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync(ContentTypes.OapApplicationForm, type => type
.Creatable()
.Listable()
.Securable()
.Draftable()
.Versionable()
.WithPart(nameof(AutoroutePart), part => part
.WithPosition("2")
.WithSettings(new AutoroutePartSettings
{
AllowCustomPath = true,
AllowUpdatePath = true,
}))
.WithPart(nameof(ListPart), part => part
.WithDisplayName("Form Steps")
.WithPosition("3")
.WithSettings(new ListPartSettings
{
PageSize = 10,
EnableOrdering = true,
ContainedContentTypes = [ContentTypes.OapApplicationFormStep]
})
));
await m_contentDefinitionManager
.AlterPartDefinitionAsync(nameof(OapApplicationPart), builder => builder
.Attachable()
.WithField(nameof(OapApplicationPart.Status), field => field
.OfType(nameof(TextField))
.WithDisplayName(nameof(OapApplicationPart.Status))
.WithDescription("The status of the OAP Application.")
.WithEditor("PredefinedList")
.WithSettings(new TextFieldPredefinedListEditorSettings
{
Options = new[]
{
new ListValueOption { Name = OapApplicationStatuses.InProgress, Value = OapApplicationStatuses.InProgress.HtmlClassify() },
new ListValueOption { Name = OapApplicationStatuses.Submitted, Value = OapApplicationStatuses.Submitted.HtmlClassify() },
},
DefaultValue = OapApplicationStatuses.InProgress.HtmlClassify(),
Editor = EditorOption.Radio,
}))
.WithDescription("Makes a content item into an OAP Application."));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync(ContentTypes.OapApplication, type => type
.Creatable()
.Listable()
.Securable()
.WithPart(nameof(HtmlBodyPart), part => part
.WithDisplayName("Notes")
.WithSettings(new ContentTypePartSettings { Editor = "Wysiwyg", })
)
.WithPart(nameof(OapApplicationPart)));
return 1;
}
public async Task<int> UpdateFrom1Async()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync(ContentTypes.OapApplicationFormStep, type => type
.WithPart(nameof(HtmlBodyPart), part => part
.WithPosition("2")
.WithEditor("Wysiwyg")
.WithSettings(new HtmlBodyPartSettings
{
SanitizeHtml = true,
})));
return 2;
}
public Task<int> UpdateFrom2Async()
{
return Task.FromResult(3);
}
public Task<int> UpdateFrom3Async()
{
return Task.FromResult(4);
}
public Task<int> UpdateFrom4Async()
{
return Task.FromResult(5);
}
public Task<int> UpdateFrom5Async()
{
return Task.FromResult(6);
}
public async Task<int> UpdateFrom6Async()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync(ContentTypes.OapApplicationForm, type => type
.WithPart(nameof(TitlePart)));
return 7;
}
public async Task<int> UpdateFrom7Async()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Input", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("1")
.WithDisplayName("Details to help the user correctly fill out this form field.")
.WithEditor("Wysiwyg")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("TextArea", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("1")
.WithDisplayName("Details to help the user correctly fill out this form field.")
.WithEditor("Wysiwyg")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Select", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("1")
.WithDisplayName("Details to help the user correctly fill out this form field.")
.WithEditor("Wysiwyg")
));
return 8;
}
public async Task<int> UpdateFrom8Async()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Input", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("4")
)
.WithPart("InputPart", part => part
.WithPosition("5")
)
.WithPart("FormElementValidationPart", part => part
.WithPosition("6")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("TextArea", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("4")
)
.WithPart("TextAreaPart", part => part
.WithPosition("5")
)
.WithPart("FormElementValidationPart", part => part
.WithPosition("6")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Select", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithPosition("4")
)
.WithPart("SelectPart", part => part
.WithPosition("5")
)
.WithPart("FormElementValidationPart", part => part
.WithPosition("6")
));
return 9;
}
public async Task<int> UpdateFrom9Async()
{
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Input", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithDisplayName("Explanation")
.WithDescription("Details to help the user correctly fill out this form field.")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("TextArea", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithDisplayName("Explanation")
.WithDescription("Details to help the user correctly fill out this form field.")
));
await m_contentDefinitionManager
.AlterTypeDefinitionAsync("Select", type => type
.WithPart("Explanation", "HtmlBodyPart", part => part
.WithDisplayName("Explanation")
.WithDescription("Details to help the user correctly fill out this form field.")
));
return 10;
}
public async Task<int> UpdateFrom10Async()
{
await m_contentDefinitionManager.AlterTypeDefinitionAsync("OapApplicationFormButtons", type => type
.Stereotype("Widget")
.WithPart("OapApplicationFormButtons")
.WithPart("Back", "ButtonPart", part => part
.WithDisplayName("Back Button"))
.WithPart("Submit", "ButtonPart", part => part
.WithDisplayName("Submit Button")));
return 11;
}
public async Task<int> UpdateFrom11Async()
{
await m_contentDefinitionManager.AlterPartDefinitionAsync("OapApplicationFormButtons", part => part
.WithField<BooleanField>("ShowBackButton", field => field.WithDisplayName("Show Back Button")));
return 12;
}
public async Task<int> UpdateFrom12Async()
{
await m_contentDefinitionManager.AlterTypeDefinitionAsync("OapApplicationFormButtons", type => type
.WithPart("OapApplicationFormButtons"));
return 13;
}
private readonly IContentDefinitionManager m_contentDefinitionManager;
}

53
src/OAP/Oap.Theme.Svelte/src/components/ButtonPart.svelte
View File

@@ -1,53 +0,0 @@
<script context="module" lang="ts">
import { graphql } from "../gql";
export const ButtonPartFragment = graphql(/* GraphQL */ `
fragment ButtonPart on Button {
metadata {
alignment
size
}
button {
type
text
}
formInputElement {
name
}
formElement {
id
}
}
`);
export function isButtonType(
buttonType: string | undefined | null,
): buttonType is HTMLButtonElement["type"] {
return !!(buttonType as HTMLButtonElement["type"]);
}
</script>
<script lang="ts">
import { type FragmentType, useFragment } from "../gql";
import Widget from "./Widget.svelte";
export let fragment: FragmentType<typeof ButtonPartFragment>;
const content = useFragment(ButtonPartFragment, fragment);
const buttonType: HTMLButtonElement["type"] = isButtonType(
content.button?.type,
)
? content.button?.type
: "button";
</script>
<Widget metadata={content.metadata}>
<button
class="block cursor-pointer rounded-md bg-amber-300 px-4 py-2 text-gray-800 hover:bg-amber-500 disabled:cursor-not-allowed disabled:bg-gray-400 disabled:text-gray-600"
type={buttonType}
name={content.formInputElement?.name}
id={content.formElement?.id}
>
{content.button?.text}
</button>
</Widget>

23
src/OAP/Oap.Theme.Svelte/src/components/Fields/Button.svelte Normal file
View File

@@ -0,0 +1,23 @@
<script context="module" lang="ts">
export function isButtonType(
buttonType: string | undefined | null,
): buttonType is HTMLButtonElement["type"] {
return !!(buttonType as HTMLButtonElement["type"]);
}
</script>
<script lang="ts">
export let type: HTMLButtonElement["type"] | null | undefined;
export let name: string | null | undefined;
export let id: string | null | undefined;
export let text: string | null | undefined;
const cssClasses =
type === "submit"
? "block cursor-pointer rounded-md bg-amber-300 px-4 py-2 text-gray-800 hover:bg-amber-400 hover:text-gray-900 disabled:cursor-not-allowed disabled:bg-gray-400 disabled:text-gray-600"
: "cursor-pointer px-4 py-2 text-gray-800 hover:text-gray-400";
</script>
<button class={cssClasses} {type} {name} {id}>
{@html text}
</button>

9
src/OAP/Oap.Theme.Svelte/src/components/CommonFieldParts.svelte → src/OAP/Oap.Theme.Svelte/src/components/Fields/CommonFieldParts.svelte
View File

@@ -3,8 +3,9 @@
FormElementLabelPart,
FormElementPart,
RichTextFragment,
} from "../gql/graphql";
import ExplanationPart from "./ExplanationPart.svelte";
} from "../../gql/graphql";
import ExplanationPart from "./Explanation.svelte";
import Label from "./Label.svelte";
export let formElementLabel: FormElementLabelPart | undefined | null;
export let formElement: FormElementPart | undefined | null;
@@ -23,9 +24,7 @@
</script>
{#if formElementLabel?.label}
<label for={formElement?.id} class="block mt-2 font-bold text-gray-900">
{formElementLabel.label}
</label>
<Label forId={formElement?.id} text={formElementLabel.label} />
{/if}
{#if explanation}

6
src/OAP/Oap.Theme.Svelte/src/components/ExplanationPart.svelte → src/OAP/Oap.Theme.Svelte/src/components/Fields/Explanation.svelte
View File

@@ -1,12 +1,12 @@
<script context="module" lang="ts">
import { RichTextFragment } from "./RichText.svelte";
import { RichTextFragment } from "../RichText.svelte";
export const ExplanationPartFragment = RichTextFragment;
</script>
<script lang="ts">
import { type FragmentType } from "../gql";
import RichText from "./RichText.svelte";
import { type FragmentType } from "../../gql";
import RichText from "../RichText.svelte";
export let fragment: FragmentType<typeof ExplanationPartFragment>;
</script>

16
src/OAP/Oap.Theme.Svelte/src/components/Fields/Input.svelte Normal file
View File

@@ -0,0 +1,16 @@
<script lang="ts">
export let type: HTMLInputElement["type"] | null | undefined;
export let name: string | null | undefined;
export let id: string | null | undefined;
export let value: string | null | undefined;
export let placeholder: string | null | undefined;
let cssClasses =
"block w-full rounded-md border-0 py-1.5 px-2 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600";
if (type === "number" || type === "date") {
cssClasses =
"block w-1/3 rounded-md border-0 py-1.5 px-2 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600";
}
</script>
<input {id} {name} {type} {value} {placeholder} class={cssClasses} />

8
src/OAP/Oap.Theme.Svelte/src/components/Fields/Label.svelte Normal file
View File

@@ -0,0 +1,8 @@
<script lang="ts">
export let forId: string | null | undefined;
export let text: string | null | undefined;
</script>
<label for={forId} class="block mt-2 font-semibold text-gray-900">
{text}
</label>

44
src/OAP/Oap.Theme.Svelte/src/components/Fields/Select.svelte Normal file
View File

@@ -0,0 +1,44 @@
<script lang="ts">
export let name: string | null | undefined;
export let id: string | null | undefined;
export let type: string | null | undefined;
export let options:
| Array<{ text: string | null | undefined; value: string | null | undefined }>
| null
| undefined;
const showDropdown = type === "select";
</script>
{#if showDropdown}
<div class="mt-2">
<select
{id}
{name}
class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:max-w-xs sm:text-sm sm:leading-6"
>
{#each options ?? [] as option}
<option value={option?.value ?? option?.text} selected={false}
>{option?.text}</option
>
{/each}
</select>
</div>
{:else}
<div class="mt-2 space-y-2">
{#each options ?? [] as option, index}
<div class="flex items-center gap-x-3">
<input
{type}
{id}
{name}
class="h-4 w-4 border-gray-300 text-indigo-600 focus:ring-indigo-600"
value={option?.value}
/>
<label
class="block text-sm font-normal text-gray-900"
for={id + "_" + index}>{option?.text}</label
>
</div>
{/each}
</div>
{/if}

13
src/OAP/Oap.Theme.Svelte/src/components/Fields/TextArea.svelte Normal file
View File

@@ -0,0 +1,13 @@
<script lang="ts">
export let name: string | null | undefined;
export let id: string | null | undefined;
export let placeholder: string | null | undefined;
</script>
<textarea
{id}
{name}
{placeholder}
class="block w-full rounded-md border-0 py-1.5 px-2 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600"
>
</textarea>

35
src/OAP/Oap.Theme.Svelte/src/components/Form.svelte
View File

@@ -13,11 +13,12 @@
}
flow {
widgets {
...LabelPart
...ButtonPart
...InputPart
...SelectPart
...TextAreaPart
...LabelWidget
...ButtonWidget
...InputWidget
...SelectWidget
...TextAreaWidget
...OapApplicationFormButtonsWidget
}
}
}
@@ -27,12 +28,12 @@
<script lang="ts">
import type { EventHandler } from "svelte/elements";
import { useFragment, type FragmentType } from "../gql";
import ButtonPart from "./ButtonPart.svelte";
import InputPart from "./InputPart.svelte";
import LabelPart from "./LabelPart.svelte";
import SelectPart from "./SelectPart.svelte";
import TextAreaPart from "./TextAreaPart.svelte";
import Widget from "./Widget.svelte";
import ButtonWidget from "./Widgets/ButtonWidget.svelte";
import InputWidget from "./Widgets/InputWidget.svelte";
import SelectWidget from "./Widgets/SelectWidget.svelte";
import TextAreaWidget from "./Widgets/TextAreaWidget.svelte";
import LabelWidget from "./Widgets/LabelWidget.svelte";
import ApplicationFormButtonsWidget from "./Widgets/ApplicationFormButtonsWidget.svelte";
export let onSubmit:
| EventHandler<SubmitEvent, HTMLFormElement>
@@ -59,15 +60,17 @@
{#if content.flow}
{#each content.flow.widgets ?? [] as widget}
{#if widget?.__typename === "Button"}
<ButtonPart fragment={widget} />
<ButtonWidget fragment={widget} />
{:else if widget?.__typename === "Input"}
<InputPart fragment={widget} />
<InputWidget fragment={widget} />
{:else if widget?.__typename === "Label"}
<LabelPart fragment={widget} />
<LabelWidget fragment={widget} />
{:else if widget?.__typename === "Select"}
<SelectPart fragment={widget} />
<SelectWidget fragment={widget} />
{:else if widget?.__typename === "TextArea"}
<TextAreaPart fragment={widget} />
<TextAreaWidget fragment={widget} />
{:else if widget?.__typename === "OapApplicationFormButtons"}
<ApplicationFormButtonsWidget fragment={widget} />
{/if}
{/each}
{/if}

64
src/OAP/Oap.Theme.Svelte/src/components/InputPart.svelte
View File

@@ -1,64 +0,0 @@
<script context="module" lang="ts">
import { graphql } from "../gql";
export const InputPartFragment = graphql(/* GraphQL */ `
fragment InputPart on Input {
metadata {
alignment
size
}
input {
defaultValue
placeholder
type
}
formElementLabel {
label
}
formInputElement {
name
}
formElement {
id
}
explanation {
html
}
}
`);
</script>
<script lang="ts">
import { useFragment, type FragmentType } from "../gql";
import CommonFieldParts from "./CommonFieldParts.svelte";
import Widget from "./Widget.svelte";
export let fragment: FragmentType<typeof InputPartFragment>;
const content = useFragment(InputPartFragment, fragment);
let cssClasses =
"block w-full rounded-md border-0 py-1.5 px-2 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600";
if (content.input?.type === "number" || content.input?.type === "date") {
cssClasses =
"block w-1/3 rounded-md border-0 py-1.5 px-2 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600";
}
let checked = false;
let value = content.input?.defaultValue ?? "";
</script>
<Widget metadata={content.metadata}>
<CommonFieldParts
formElementLabel={content.formElementLabel}
formElement={content.formElement}
explanation={content.explanation}
/>
<input
id={content.formElement?.id}
name={content.formInputElement?.name}
type={content.input?.type}
class={cssClasses}
{value}
placeholder={content.input?.placeholder}
/>
</Widget>

34
src/OAP/Oap.Theme.Svelte/src/components/LabelPart.svelte
View File

@@ -1,34 +0,0 @@
<script context="module" lang="ts">
import { graphql } from "../gql";
export const LabelPartFragment = graphql(/* GraphQL */ `
fragment LabelPart on Label {
metadata {
alignment
size
}
displayText
formElement {
id
}
label {
for
value
}
contentType
}
`);
</script>
<script lang="ts">
import { useFragment, type FragmentType } from "../gql";
import Widget from "./Widget.svelte";
export let fragment: FragmentType<typeof LabelPartFragment>;
const content = useFragment(LabelPartFragment, fragment);
</script>
<Widget metadata={content.metadata}>
<label id={content.formElement?.id} for={content.label?.for}>
{content.label?.value}
</label>
</Widget>

86
src/OAP/Oap.Theme.Svelte/src/components/SelectPart.svelte
View File

@@ -1,86 +0,0 @@
<script context="module" lang="ts">
import { graphql } from "../gql";
export const SelectPartFragment = graphql(/* GraphQL */ `
fragment SelectPart on Select {
metadata {
alignment
size
}
formElementLabel {
label
}
formInputElement {
name
}
formElement {
id
}
explanation {
...RichText
}
select {
defaultValue
editor
options {
text
value
}
}
}
`);
</script>
<script lang="ts">
import { useFragment, type FragmentType } from "../gql";
import CommonFieldParts from "./CommonFieldParts.svelte";
import Widget from "./Widget.svelte";
export let fragment: FragmentType<typeof SelectPartFragment>;
const content = useFragment(SelectPartFragment, fragment);
const showDropdown = content.select?.editor === "select";
</script>
<Widget metadata={content.metadata}>
<CommonFieldParts
formElementLabel={content.formElementLabel}
formElement={content.formElement}
explanation={content.explanation}
/>
{#if !showDropdown}
<div class="mt-2 space-y-2">
{#each content.select?.options ?? [] as option, index}
<div class="flex items-center gap-x-3">
<input
type={content.select?.editor}
id={content.formElement?.id + "_" + index}
name={content.formInputElement?.name}
class="h-4 w-4 border-gray-300 text-indigo-600 focus:ring-indigo-600"
value={option?.value}
/>
<label
class="block text-sm font-medium text-gray-900"
for={content.formElement?.id + "_" + index}
>{option?.text}</label
>
</div>
{/each}
</div>
{:else}
<div class="mt-2">
<select
id={content.formElement?.id}
name={content.formInputElement?.name}
class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:max-w-xs sm:text-sm sm:leading-6"
>
{#each content.select?.options ?? [] as option}
<option
value={option?.value ?? option?.text}
selected={false}>{option?.text}</option
>
{/each}
</select>
</div>
{/if}
</Widget>

61
src/OAP/Oap.Theme.Svelte/src/components/Widgets/ApplicationFormButtonsWidget.svelte Normal file
View File

@@ -0,0 +1,61 @@
<script context="module" lang="ts">
import { graphql } from "../../gql";
export const OapApplicationFormButtonsWidgetFragment = graphql(
/* GraphQL */ `
fragment OapApplicationFormButtonsWidget on OapApplicationFormButtons {
metadata {
alignment
size
}
back {
type
text
}
submit {
type
text
}
showBackButton
}
`,
);
</script>
<script lang="ts">
import { useFragment, type FragmentType } from "../../gql";
import Widget from "./Widget.svelte";
import Button, { isButtonType } from "../Fields/Button.svelte";
export let fragment: FragmentType<
typeof OapApplicationFormButtonsWidgetFragment
>;
const content = useFragment(
OapApplicationFormButtonsWidgetFragment,
fragment,
);
</script>
<Widget metadata={content.metadata}>
<div class="flex flex-row mt-8 justify-between">
{#if content.showBackButton}
<Button
id="Back"
name="Back"
text={content.back?.text}
type={isButtonType(content.back?.type)
? content.back?.type
: "button"}
/>
{:else}
<span>&nbsp;</span>
{/if}
<Button
id="Submit"
name="Submit"
text={content.submit?.text}
type={isButtonType(content.submit?.type)
? content.submit?.type
: "submit"}
/>
</div>
</Widget>

46
src/OAP/Oap.Theme.Svelte/src/components/Widgets/ButtonWidget.svelte Normal file
View File

@@ -0,0 +1,46 @@
<script context="module" lang="ts">
import { graphql } from "../../gql";
export const ButtonWidgetFragment = graphql(/* GraphQL */ `
fragment ButtonWidget on Button {
metadata {
alignment
size
}
button {
type
text
}
formInputElement {
name
}
formElement {
id
}
}
`);
</script>
<script lang="ts">
import { type FragmentType, useFragment } from "../../gql";
import Button, { isButtonType } from "../Fields/Button.svelte";
import Widget from "./Widget.svelte";
export let fragment: FragmentType<typeof ButtonWidgetFragment>;
const content = useFragment(ButtonWidgetFragment, fragment);
const buttonType: HTMLButtonElement["type"] = isButtonType(
content.button?.type,
)
? content.button?.type
: "button";
</script>
<Widget metadata={content.metadata}>
<Button
type={buttonType}
name={content.formInputElement?.name}
id={content.formElement?.id}
text={content.button?.text}
/>
</Widget>

57
src/OAP/Oap.Theme.Svelte/src/components/Widgets/InputWidget.svelte Normal file
View File

@@ -0,0 +1,57 @@
<script context="module" lang="ts">
import { graphql } from "../../gql";
export const InputWidgetFragment = graphql(/* GraphQL */ `
fragment InputWidget on Input {
metadata {
alignment
size
}
input {
defaultValue
placeholder
type
}
formElementLabel {
label
}
formInputElement {
name
}
formElement {
id
}
explanation {
html
}
}
`);
</script>
<script lang="ts">
import { useFragment, type FragmentType } from "../../gql";
import CommonFieldParts from "../Fields/CommonFieldParts.svelte";
import Input from "../Fields/Input.svelte";
import Widget from "./Widget.svelte";
export let fragment: FragmentType<typeof InputWidgetFragment>;
const content = useFragment(InputWidgetFragment, fragment);
let checked = false;
let value = content.input?.defaultValue ?? "";
</script>
<Widget metadata={content.metadata}>
<CommonFieldParts
formElementLabel={content.formElementLabel}
formElement={content.formElement}
explanation={content.explanation}
/>
<Input
id={content.formElement?.id}
name={content.formInputElement?.name}
type={content.input?.type}
{value}
placeholder={content.input?.placeholder}
/>
</Widget>

33
src/OAP/Oap.Theme.Svelte/src/components/Widgets/LabelWidget.svelte Normal file
View File

@@ -0,0 +1,33 @@
<script context="module" lang="ts">
import { graphql } from "../../gql";
export const LabelWidgetFragment = graphql(/* GraphQL */ `
fragment LabelWidget on Label {
metadata {
alignment
size
}
displayText
formElement {
id
}
label {
for
value
}
contentType
}
`);
</script>
<script lang="ts">
import { useFragment, type FragmentType } from "../../gql";
import Widget from "./Widget.svelte";
import Label from "../Fields/Label.svelte";
export let fragment: FragmentType<typeof LabelWidgetFragment>;
const content = useFragment(LabelWidgetFragment, fragment);
</script>
<Widget metadata={content.metadata}>
<Label id={content.formElement?.id} forId={content.label?.for} text={content.label?.value} />
</Widget>

58
src/OAP/Oap.Theme.Svelte/src/components/Widgets/SelectWidget.svelte Normal file
View File

@@ -0,0 +1,58 @@
<script context="module" lang="ts">
import { graphql } from "../../gql";
export const SelectWidgetFragment = graphql(/* GraphQL */ `
fragment SelectWidget on Select {
metadata {
alignment
size
}
formElementLabel {
label
}
formInputElement {
name
}
formElement {
id
}
explanation {
...RichText
}
select {
defaultValue
editor
options {
text
value
}
}
}
`);
</script>
<script lang="ts">
import { useFragment, type FragmentType } from "../../gql";
import CommonFieldParts from "../Fields/CommonFieldParts.svelte";
import Select from "../Fields/Select.svelte";
import Widget from "./Widget.svelte";
export let fragment: FragmentType<typeof SelectWidgetFragment>;
const content = useFragment(SelectWidgetFragment, fragment);
</script>
<Widget metadata={content.metadata}>
<CommonFieldParts
formElementLabel={content.formElementLabel}
formElement={content.formElement}
explanation={content.explanation}
/>
<Select
type={content.select?.editor}
options={content.select?.options?.map((o) => {
return { text: o?.text, value: o?.value };
})}
id={content.formElement?.id}
name={content.formInputElement?.name}
/>
</Widget>

21
src/OAP/Oap.Theme.Svelte/src/components/TextAreaPart.svelte → src/OAP/Oap.Theme.Svelte/src/components/Widgets/TextAreaWidget.svelte
View File

@@ -1,8 +1,8 @@
<script context="module" lang="ts">
import { graphql } from "../gql";
import { graphql } from "../../gql";
export const TextAreaPartFragment = graphql(/* GraphQL */ `
fragment TextAreaPart on TextArea {
export const TextAreaWidgetFragment = graphql(/* GraphQL */ `
fragment TextAreaWidget on TextArea {
metadata {
alignment
size
@@ -28,11 +28,12 @@
</script>
<script lang="ts">
import { useFragment, type FragmentType } from "../gql";
import CommonFieldParts from "./CommonFieldParts.svelte";
import { useFragment, type FragmentType } from "../../gql";
import CommonFieldParts from "../Fields/CommonFieldParts.svelte";
import TextArea from "../Fields/TextArea.svelte";
import Widget from "./Widget.svelte";
export let fragment: FragmentType<typeof TextAreaPartFragment>;
const content = useFragment(TextAreaPartFragment, fragment);
export let fragment: FragmentType<typeof TextAreaWidgetFragment>;
const content = useFragment(TextAreaWidgetFragment, fragment);
</script>
<Widget metadata={content.metadata}>
@@ -42,11 +43,9 @@
explanation={content.explanation}
/>
<textarea
<TextArea
id={content.formElement?.id}
name={content.formInputElement?.name}
class="block w-full rounded-md border-0 py-1.5 px-2 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600"
placeholder={content.textArea?.placeholder}
>
</textarea>
/>
</Widget>

4
src/OAP/Oap.Theme.Svelte/src/components/Widget.svelte → src/OAP/Oap.Theme.Svelte/src/components/Widgets/Widget.svelte
View File

@@ -1,5 +1,5 @@
<script lang="ts">
import type { FlowMetadata } from "../gql/graphql";
import type { FlowMetadata } from "../../gql/graphql";
export let metadata: FlowMetadata | null | undefined;
@@ -12,7 +12,7 @@
const justify = metadata?.alignment === "Right" ? "justify-self-end"
: metadata?.alignment === "Left" ? "justify-self-start"
: metadata?.alignment === "Center" ? "justify-self-center"
: metadata?.alignment === "Justify" ? "justify-self-stretch"
: metadata?.alignment === "Justify" ? "justify-self-auto"
: "";
const cssClasses = colspan + " " + justify;

47
src/OAP/Oap.Theme.Svelte/src/gql/gql.ts
View File

@@ -15,13 +15,14 @@ import type { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-
const documents = {
"\n\t\tquery OapApplicationForm($contentItemId: ID!) {\n\t\t\toapApplicationForm(where: { contentItemId: $contentItemId }) {\n\t\t\t\tdisplayText\n\t\t\t\tcontentItemId\n\t\t\t\tlist {\n\t\t\t\t\tcontentItems {\n\t\t\t\t\t\t__typename\n\t\t\t\t\t\t...OapApplicationFormStep\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t": types.OapApplicationFormDocument,
"\n\t\tfragment OapApplicationFormStep on OapApplicationFormStep {\n\t\t\tdisplayText\n\t\t\tcontentItemId\n\t\t\thtmlBody {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tflow {\n\t\t\t\twidgets {\n\t\t\t\t\t...Form\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t": types.OapApplicationFormStepFragmentDoc,
"\n\t\tfragment ButtonPart on Button {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tbutton {\n\t\t\t\ttype\n\t\t\t\ttext\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t}\n\t": types.ButtonPartFragmentDoc,
"\n\t\tfragment Form on Form {\n\t\t\tdisplayText\n\t\t\tform {\n\t\t\t\taction\n\t\t\t\tmethod\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tflow {\n\t\t\t\twidgets {\n\t\t\t\t\t...LabelPart\n\t\t\t\t\t...ButtonPart\n\t\t\t\t\t...InputPart\n\t\t\t\t\t...SelectPart\n\t\t\t\t\t...TextAreaPart\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t": types.FormFragmentDoc,
"\n\t\tfragment InputPart on Input {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tinput {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t\ttype\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\thtml\n\t\t\t}\n\t\t}\n\t": types.InputPartFragmentDoc,
"\n\t\tfragment LabelPart on Label {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tdisplayText\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tlabel {\n\t\t\t\tfor\n\t\t\t\tvalue\n\t\t\t}\n\t\t\tcontentType\n\t\t}\n\t": types.LabelPartFragmentDoc,
"\n\t\tfragment Form on Form {\n\t\t\tdisplayText\n\t\t\tform {\n\t\t\t\taction\n\t\t\t\tmethod\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tflow {\n\t\t\t\twidgets {\n\t\t\t\t\t...LabelWidget\n\t\t\t\t\t...ButtonWidget\n\t\t\t\t\t...InputWidget\n\t\t\t\t\t...SelectWidget\n\t\t\t\t\t...TextAreaWidget\n\t\t\t\t\t...OapApplicationFormButtonsWidget\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t": types.FormFragmentDoc,
"\n\t\tfragment RichText on HtmlBodyPart {\n\t\t\thtml\n\t\t}\n\t": types.RichTextFragmentDoc,
"\n\t\tfragment SelectPart on Select {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tselect {\n\t\t\t\tdefaultValue\n\t\t\t\teditor\n\t\t\t\toptions {\n\t\t\t\t\ttext\n\t\t\t\t\tvalue\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t": types.SelectPartFragmentDoc,
"\n\t\tfragment TextAreaPart on TextArea {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\ttextArea {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t}\n\t\t}\n\t": types.TextAreaPartFragmentDoc,
"\n\t\t\tfragment OapApplicationFormButtonsWidget on OapApplicationFormButtons {\n\t\t\t\tmetadata {\n\t\t\t\t\talignment\n\t\t\t\t\tsize\n\t\t\t\t}\n\t\t\t\tback {\n\t\t\t\t\ttype\n\t\t\t\t\ttext\n\t\t\t\t}\n\t\t\t\tsubmit {\n\t\t\t\t\ttype\n\t\t\t\t\ttext\n\t\t\t\t}\n\t\t\t\tshowBackButton\n\t\t\t}\n\t\t": types.OapApplicationFormButtonsWidgetFragmentDoc,
"\n\t\tfragment ButtonWidget on Button {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tbutton {\n\t\t\t\ttype\n\t\t\t\ttext\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t}\n\t": types.ButtonWidgetFragmentDoc,
"\n\t\tfragment InputWidget on Input {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tinput {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t\ttype\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\thtml\n\t\t\t}\n\t\t}\n\t": types.InputWidgetFragmentDoc,
"\n\t\tfragment LabelWidget on Label {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tdisplayText\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tlabel {\n\t\t\t\tfor\n\t\t\t\tvalue\n\t\t\t}\n\t\t\tcontentType\n\t\t}\n\t": types.LabelWidgetFragmentDoc,
"\n\t\tfragment SelectWidget on Select {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tselect {\n\t\t\t\tdefaultValue\n\t\t\t\teditor\n\t\t\t\toptions {\n\t\t\t\t\ttext\n\t\t\t\t\tvalue\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t": types.SelectWidgetFragmentDoc,
"\n\t\tfragment TextAreaWidget on TextArea {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\ttextArea {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t}\n\t\t}\n\t": types.TextAreaWidgetFragmentDoc,
};
/**
@@ -49,19 +50,7 @@ export function graphql(source: "\n\t\tfragment OapApplicationFormStep on OapApp
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n\t\tfragment ButtonPart on Button {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tbutton {\n\t\t\t\ttype\n\t\t\t\ttext\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment ButtonPart on Button {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tbutton {\n\t\t\t\ttype\n\t\t\t\ttext\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t}\n\t"];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n\t\tfragment Form on Form {\n\t\t\tdisplayText\n\t\t\tform {\n\t\t\t\taction\n\t\t\t\tmethod\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tflow {\n\t\t\t\twidgets {\n\t\t\t\t\t...LabelPart\n\t\t\t\t\t...ButtonPart\n\t\t\t\t\t...InputPart\n\t\t\t\t\t...SelectPart\n\t\t\t\t\t...TextAreaPart\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment Form on Form {\n\t\t\tdisplayText\n\t\t\tform {\n\t\t\t\taction\n\t\t\t\tmethod\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tflow {\n\t\t\t\twidgets {\n\t\t\t\t\t...LabelPart\n\t\t\t\t\t...ButtonPart\n\t\t\t\t\t...InputPart\n\t\t\t\t\t...SelectPart\n\t\t\t\t\t...TextAreaPart\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t"];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n\t\tfragment InputPart on Input {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tinput {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t\ttype\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\thtml\n\t\t\t}\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment InputPart on Input {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tinput {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t\ttype\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\thtml\n\t\t\t}\n\t\t}\n\t"];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n\t\tfragment LabelPart on Label {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tdisplayText\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tlabel {\n\t\t\t\tfor\n\t\t\t\tvalue\n\t\t\t}\n\t\t\tcontentType\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment LabelPart on Label {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tdisplayText\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tlabel {\n\t\t\t\tfor\n\t\t\t\tvalue\n\t\t\t}\n\t\t\tcontentType\n\t\t}\n\t"];
export function graphql(source: "\n\t\tfragment Form on Form {\n\t\t\tdisplayText\n\t\t\tform {\n\t\t\t\taction\n\t\t\t\tmethod\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tflow {\n\t\t\t\twidgets {\n\t\t\t\t\t...LabelWidget\n\t\t\t\t\t...ButtonWidget\n\t\t\t\t\t...InputWidget\n\t\t\t\t\t...SelectWidget\n\t\t\t\t\t...TextAreaWidget\n\t\t\t\t\t...OapApplicationFormButtonsWidget\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment Form on Form {\n\t\t\tdisplayText\n\t\t\tform {\n\t\t\t\taction\n\t\t\t\tmethod\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tflow {\n\t\t\t\twidgets {\n\t\t\t\t\t...LabelWidget\n\t\t\t\t\t...ButtonWidget\n\t\t\t\t\t...InputWidget\n\t\t\t\t\t...SelectWidget\n\t\t\t\t\t...TextAreaWidget\n\t\t\t\t\t...OapApplicationFormButtonsWidget\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t"];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
@@ -69,11 +58,27 @@ export function graphql(source: "\n\t\tfragment RichText on HtmlBodyPart {\n\t\t
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n\t\tfragment SelectPart on Select {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tselect {\n\t\t\t\tdefaultValue\n\t\t\t\teditor\n\t\t\t\toptions {\n\t\t\t\t\ttext\n\t\t\t\t\tvalue\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment SelectPart on Select {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tselect {\n\t\t\t\tdefaultValue\n\t\t\t\teditor\n\t\t\t\toptions {\n\t\t\t\t\ttext\n\t\t\t\t\tvalue\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t"];
export function graphql(source: "\n\t\t\tfragment OapApplicationFormButtonsWidget on OapApplicationFormButtons {\n\t\t\t\tmetadata {\n\t\t\t\t\talignment\n\t\t\t\t\tsize\n\t\t\t\t}\n\t\t\t\tback {\n\t\t\t\t\ttype\n\t\t\t\t\ttext\n\t\t\t\t}\n\t\t\t\tsubmit {\n\t\t\t\t\ttype\n\t\t\t\t\ttext\n\t\t\t\t}\n\t\t\t\tshowBackButton\n\t\t\t}\n\t\t"): (typeof documents)["\n\t\t\tfragment OapApplicationFormButtonsWidget on OapApplicationFormButtons {\n\t\t\t\tmetadata {\n\t\t\t\t\talignment\n\t\t\t\t\tsize\n\t\t\t\t}\n\t\t\t\tback {\n\t\t\t\t\ttype\n\t\t\t\t\ttext\n\t\t\t\t}\n\t\t\t\tsubmit {\n\t\t\t\t\ttype\n\t\t\t\t\ttext\n\t\t\t\t}\n\t\t\t\tshowBackButton\n\t\t\t}\n\t\t"];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n\t\tfragment TextAreaPart on TextArea {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\ttextArea {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t}\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment TextAreaPart on TextArea {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\ttextArea {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t}\n\t\t}\n\t"];
export function graphql(source: "\n\t\tfragment ButtonWidget on Button {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tbutton {\n\t\t\t\ttype\n\t\t\t\ttext\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment ButtonWidget on Button {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tbutton {\n\t\t\t\ttype\n\t\t\t\ttext\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t}\n\t"];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n\t\tfragment InputWidget on Input {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tinput {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t\ttype\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\thtml\n\t\t\t}\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment InputWidget on Input {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tinput {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t\ttype\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\thtml\n\t\t\t}\n\t\t}\n\t"];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n\t\tfragment LabelWidget on Label {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tdisplayText\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tlabel {\n\t\t\t\tfor\n\t\t\t\tvalue\n\t\t\t}\n\t\t\tcontentType\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment LabelWidget on Label {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tdisplayText\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tlabel {\n\t\t\t\tfor\n\t\t\t\tvalue\n\t\t\t}\n\t\t\tcontentType\n\t\t}\n\t"];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n\t\tfragment SelectWidget on Select {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tselect {\n\t\t\t\tdefaultValue\n\t\t\t\teditor\n\t\t\t\toptions {\n\t\t\t\t\ttext\n\t\t\t\t\tvalue\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment SelectWidget on Select {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tselect {\n\t\t\t\tdefaultValue\n\t\t\t\teditor\n\t\t\t\toptions {\n\t\t\t\t\ttext\n\t\t\t\t\tvalue\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t"];
/**
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
*/
export function graphql(source: "\n\t\tfragment TextAreaWidget on TextArea {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\ttextArea {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t}\n\t\t}\n\t"): (typeof documents)["\n\t\tfragment TextAreaWidget on TextArea {\n\t\t\tmetadata {\n\t\t\t\talignment\n\t\t\t\tsize\n\t\t\t}\n\t\t\texplanation {\n\t\t\t\t...RichText\n\t\t\t}\n\t\t\tformElement {\n\t\t\t\tid\n\t\t\t}\n\t\t\tformElementLabel {\n\t\t\t\tlabel\n\t\t\t}\n\t\t\tformInputElement {\n\t\t\t\tname\n\t\t\t}\n\t\t\ttextArea {\n\t\t\t\tdefaultValue\n\t\t\t\tplaceholder\n\t\t\t}\n\t\t}\n\t"];
export function graphql(source: string) {
return (documents as any)[source] ?? {};

243
src/OAP/Oap.Theme.Svelte/src/gql/graphql.ts
View File

File diff suppressed because one or more lines are too long