ToggleTheme

src/components/ToggleTheme.vue

@@ -0,0 +1,21 @@
+<script setup lang="ts">
+import UiIcon from './Icon.vue'
+
+// Props.
+const props = defineProps<{
+	dark?: boolean
+}>()
+
+// Emits.
+const emit = defineEmits<{ (e: 'update:dark', v: boolean): void }>()
+</script>
+
+<template>
+	<div class="ui-toggle-theme">
+		<ui-icon
+			:name="props.dark ? 'moon' : 'sun'"
+			@click="emit('update:dark', !props.dark)"
+			title="Переключить тему"
+		/>
+	</div>
+</template>

src/components/index.ts

@@ -17,3 +17,4 @@ export { default as UiForm } from './Form.vue'
 export { default as UiCard } from './Card.vue'
 export { default as UiTable } from './Table.vue'
 export { default as UiDialog } from './Dialog.vue'
+export { default as UiToggleTheme } from './ToggleTheme.vue'