コード入力ボックスでTabを入力できるように (#12671)
This commit is contained in:
parent
eacc2040a1
commit
c41924399b
@ -91,6 +91,16 @@ const onKeydown = (ev: KeyboardEvent) => {
|
|||||||
if (ev.code === 'Enter') {
|
if (ev.code === 'Enter') {
|
||||||
emit('enter');
|
emit('enter');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (props.code && ev.key === 'Tab') {
|
||||||
|
const pos = inputEl.value?.selectionStart ?? 0;
|
||||||
|
const posEnd = inputEl.value?.selectionEnd ?? v.value.length;
|
||||||
|
v.value = v.value.slice(0, pos) + '\t' + v.value.slice(posEnd);
|
||||||
|
nextTick(() => {
|
||||||
|
inputEl.value?.setSelectionRange(pos + 1, pos + 1);
|
||||||
|
});
|
||||||
|
ev.preventDefault();
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const updated = () => {
|
const updated = () => {
|
||||||
|
@ -15,7 +15,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||||||
<template #label>{{ i18n.ts._play.summary }}</template>
|
<template #label>{{ i18n.ts._play.summary }}</template>
|
||||||
</MkTextarea>
|
</MkTextarea>
|
||||||
<MkButton primary @click="selectPreset">{{ i18n.ts.selectFromPresets }}<i class="ti ti-chevron-down"></i></MkButton>
|
<MkButton primary @click="selectPreset">{{ i18n.ts.selectFromPresets }}<i class="ti ti-chevron-down"></i></MkButton>
|
||||||
<MkTextarea v-model="script" class="_monospace" tall spellcheck="false">
|
<MkTextarea v-model="script" code tall spellcheck="false">
|
||||||
<template #label>{{ i18n.ts._play.script }}</template>
|
<template #label>{{ i18n.ts._play.script }}</template>
|
||||||
</MkTextarea>
|
</MkTextarea>
|
||||||
<div class="_buttons">
|
<div class="_buttons">
|
||||||
|
@ -26,7 +26,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||||||
</MkKeyValue>
|
</MkKeyValue>
|
||||||
</FormSplit>
|
</FormSplit>
|
||||||
|
|
||||||
<MkTextarea v-model="valueForEditor" tall class="_monospace">
|
<MkTextarea v-model="valueForEditor" tall code>
|
||||||
<template #label>{{ i18n.ts.value }} (JSON)</template>
|
<template #label>{{ i18n.ts.value }} (JSON)</template>
|
||||||
</MkTextarea>
|
</MkTextarea>
|
||||||
|
|
||||||
|
@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||||||
<div class="_gaps_m">
|
<div class="_gaps_m">
|
||||||
<FormInfo warn>{{ i18n.ts.customCssWarn }}</FormInfo>
|
<FormInfo warn>{{ i18n.ts.customCssWarn }}</FormInfo>
|
||||||
|
|
||||||
<MkTextarea v-model="localCustomCss" manualSave tall class="_monospace" style="tab-size: 2;">
|
<MkTextarea v-model="localCustomCss" manualSave tall code style="tab-size: 2;">
|
||||||
<template #label>CSS</template>
|
<template #label>CSS</template>
|
||||||
</MkTextarea>
|
</MkTextarea>
|
||||||
</div>
|
</div>
|
||||||
|
@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||||||
<div class="_gaps_m">
|
<div class="_gaps_m">
|
||||||
<FormInfo warn>{{ i18n.ts._plugin.installWarn }}</FormInfo>
|
<FormInfo warn>{{ i18n.ts._plugin.installWarn }}</FormInfo>
|
||||||
|
|
||||||
<MkTextarea v-model="code" tall>
|
<MkTextarea v-model="code" tall code>
|
||||||
<template #label>{{ i18n.ts.code }}</template>
|
<template #label>{{ i18n.ts.code }}</template>
|
||||||
</MkTextarea>
|
</MkTextarea>
|
||||||
|
|
||||||
|
@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="_gaps_m">
|
<div class="_gaps_m">
|
||||||
<MkTextarea v-model="installThemeCode">
|
<MkTextarea v-model="installThemeCode" code>
|
||||||
<template #label>{{ i18n.ts._theme.code }}</template>
|
<template #label>{{ i18n.ts._theme.code }}</template>
|
||||||
</MkTextarea>
|
</MkTextarea>
|
||||||
|
|
||||||
|
@ -51,7 +51,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||||||
<template #label>{{ i18n.ts.editCode }}</template>
|
<template #label>{{ i18n.ts.editCode }}</template>
|
||||||
|
|
||||||
<div class="_gaps_m">
|
<div class="_gaps_m">
|
||||||
<MkTextarea v-model="themeCode" tall>
|
<MkTextarea v-model="themeCode" tall code>
|
||||||
<template #label>{{ i18n.ts._theme.code }}</template>
|
<template #label>{{ i18n.ts._theme.code }}</template>
|
||||||
</MkTextarea>
|
</MkTextarea>
|
||||||
<MkButton primary @click="applyThemeCode">{{ i18n.ts.apply }}</MkButton>
|
<MkButton primary @click="applyThemeCode">{{ i18n.ts.apply }}</MkButton>
|
||||||
|
Loading…
Reference in New Issue
Block a user