{#snippet InputVariable()} opt.value === component.properties.id)} onUpdate={(value) => { updateProperty("id", (value as IOption).value as string) onPropertyChange({ name: (value as IOption).name?.split("—")[1]?.trim(), eventHandler: { Variables: [(value as IOption).value as string] } }) }} /> {/snippet} {#snippet InputAccess()} o.value === component.access)} onUpdate={(option) => onPropertyChange({ access: (option as IOption).value })} /> {/snippet} {#snippet InputLabel()} updateProperty("label.name", value as string)} /> {/snippet} {#snippet InputLabelAlign()} updateProperty("label.class", twMerge(component.properties.label.class, (option as IOption).value))} /> {/snippet} {#snippet InputType()} opt.value === (component.properties.type || "text"))} onUpdate={(option) => { if ((option as IOption).value == "password" && component.properties.help.copyButton) updateProperty("help.copyButton", false) if ((option as IOption).value === "bitMode") { updateProperty("type", "number") updateProperty("number.minNum", 0) updateProperty("number.maxNum", Math.pow(2, component.properties.range.end - component.properties.range.start + 1) - 1) updateProperty("number.step", 1) updateProperty("help.info", `${$T("constructor.props.maxnum")}: ${component.properties.number.maxNum}`) } else { updateProperty("help.info", "") } updateProperty("type", (option as UI.IOption).value as string) }} /> {#if component.properties.type === "text" || component.properties.type === "password" || component.properties.type === "text-area"} updateProperty("maxlength", value as string)} />
updateProperty("help.regExp", value as string)} /> { showRegExpLibrary = !showRegExpLibrary }} /> {#if showRegExpLibrary} {#snippet main()} {#each $optionsStore.INPUT_REGEXP_OPTIONS as regexp}
(component.properties.help.regExp = regexp.value)} >
{regexp.name}
{regexp.value}
{/each} {/snippet} {/if}
{#if component.properties.type === "text-area"} updateProperty("textareaRows", value as string)} /> {/if} {#if component.properties.type === "text" || component.properties.type === "text-area"} opt.value === (component.properties.componentClass.split(" ").find((cl: string) => cl.startsWith("text-")) || "text-center"), )} onUpdate={(option) => { updateProperty("componentClass", twMerge(component.properties.componentClass, (option as IOption).value)) }} /> {/if} {:else if component.properties.type === "number" && !component.properties.readonly && !component.properties.disabled}
{ updateProperty("number.minNum", Number(value)) }} /> { updateProperty("number.maxNum", Number(value)) }} /> updateProperty("number.step", Number(value))} />
{:else if component.properties.type === "bitMode"} { if (Array.isArray(value)) { updateProperty("range.start", value[0] as number) updateProperty("range.end", value[1] as number) updateProperty("number.minNum", 0) updateProperty("number.maxNum", Math.pow(2, component.properties.range.end - component.properties.range.start + 1) - 1) updateProperty("number.step", 1) updateProperty("help.info", `${$T("constructor.props.maxnum")}: ${component.properties.number.maxNum}`) } }} /> {/if} {/snippet} {#snippet InputPlaceholder()} updateProperty("placeholder", value)} /> {/snippet} {#snippet InputInfo()} updateProperty("help.info", value)} /> {/snippet} {#snippet InputSettings()} {#if component.properties.type !== "bitMode"} { if (component.properties.type === "password" && o.value == "help.copyButton") return { ...o, disabled: true } else return o })} type="buttons" multiSelect={true} value={$optionsStore.INPUT_SETTING_OPTIONS.filter((opt) => { if (opt.value.split(".").reduce((o, key) => o?.[key], component.properties)) return opt })} onUpdate={(value) => { const currentActiveValues = $optionsStore.INPUT_SETTING_OPTIONS.filter((opt) => { if (!opt?.value) return false return opt.value.split(".").reduce((o, key) => o?.[key], component.properties) }).map((opt) => opt.value) if (Array.isArray(value)) { value.forEach((opt) => { updateProperty(opt.value ?? "", true) }) currentActiveValues.forEach((activeValue) => { if (!value.some((opt) => opt?.value === activeValue)) { updateProperty(activeValue, false) } }) } }} /> {/if} {/snippet} {#snippet InputAutocomplete()} opt.value === (component.properties.help.autocomplete || "off"))} onUpdate={(option) => updateProperty("help.autocomplete", (option as UI.IOption).value as string)} /> {/snippet} {#snippet InputColors()} handleOptionColorChange((option as UI.IOption).value as string)} /> {/snippet} {#snippet InputIdentificator()} updateProperty("id", value as string)} /> {/snippet} {#snippet InputWrapperClass()} updateProperty("wrapperClass", value as string)} /> {/snippet} {#snippet InputLabelClass()} updateProperty("label.class", value as string)} /> {/snippet} {#snippet InputComponentClass()} updateProperty("componentClass", twMerge(component.properties.componentClass, value as string))} /> {/snippet} {#snippet InputValue()} updateProperty("value", value as string)} /> {/snippet} {#snippet InputDisabled()} updateProperty("disabled", value)} /> {/snippet} {#if forConstructor}
{@render InputAccess()} {@render InputVariable()} {@render InputType()}
{@render InputValue()} {@render InputPlaceholder()} {@render InputInfo()} {@render InputSettings()}
{@render InputLabel()} {@render InputLabelAlign()} {@render InputAutocomplete()} {@render InputColors()}
{:else}
{@render InputIdentificator()} {@render InputWrapperClass()} {@render InputLabel()} {@render InputLabelClass()} {@render InputComponentClass()} {@render InputColors()}
{@render InputAccess()} {@render InputValue()} {@render InputType()}
{@render InputPlaceholder()} {@render InputInfo()} {@render InputAutocomplete()} {@render InputSettings()} {@render InputDisabled()}
{/if}