forked from nikita/muzika-gromche
30 lines
1.0 KiB
Vue
30 lines
1.0 KiB
Vue
<script setup lang="ts">
|
|
import type { RangeControl } from "@/components/inspector/controls";
|
|
import Slider from "@/components/library/Slider.vue";
|
|
import BaseNamedControlView from "./BaseNamedControlView.vue";
|
|
import { useId } from "vue";
|
|
|
|
const {
|
|
control,
|
|
} = defineProps<{
|
|
control: RangeControl;
|
|
}>();
|
|
|
|
const id = useId();
|
|
</script>
|
|
|
|
<template>
|
|
<BaseNamedControlView :control :id>
|
|
<div class="tw:flex tw:flex-row tw:gap-2 tw:items-baseline">
|
|
<Slider :id v-model.number="control.ref.value"
|
|
@update:model-value="(value) => control.ref.value = value ?? control.default" :min="control.min"
|
|
:max="control.max" :step="0.01" :defaultValue="0" :disabled="control.disabled || control.readonly"
|
|
class="tw:flex-1 tw:self-end" />
|
|
<input type="number" v-model.number="control.ref.value" :min="control.min" :max="control.max" :step="0.01"
|
|
:disabled="control.disabled" :readonly="control.readonly" class="input-text input-number tw:w-14" />
|
|
</div>
|
|
</BaseNamedControlView>
|
|
</template>
|
|
|
|
<style scoped></style>
|