Spaces:
Running
Running
File size: 1,108 Bytes
6ce4ca6 67a499d 6ce4ca6 67a499d 6ce4ca6 67a499d 6ce4ca6 67a499d 6ce4ca6 67a499d |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
<script lang="ts">
import { Container, SVG } from "threlte-uikit";
import { ICON } from "$lib/utils/icon";
interface Props {
color?: string;
opacity?: number;
size?: number;
direction?: "right" | "down" | "left" | "up";
minWidth?: number;
minHeight?: number;
}
let {
color = "rgb(139, 69, 219)",
opacity = 1,
size = 12,
direction = "right",
minWidth = 20,
minHeight = 12
}: Props = $props();
</script>
<Container
flexDirection="row"
alignItems="center"
justifyContent="center"
gap={12}
{minWidth}
{minHeight}
>
{#if direction === "right"}
<SVG
width={size}
height={size}
{color}
{opacity}
src={ICON[`icon-[formkit--arrowright]`].svg}
/>
{:else if direction === "down"}
<SVG width={size} height={size} {color} {opacity} src={ICON[`icon-[formkit--arrowdown]`].svg} />
{:else if direction === "left"}
<SVG width={size} height={size} {color} {opacity} src={ICON[`icon-[formkit--arrowleft]`].svg} />
{:else if direction === "up"}
<SVG width={size} height={size} {color} {opacity} src={ICON[`icon-[formkit--arrowup]`].svg} />
{/if}
</Container>
|