UNPKG

@react-three/uikit-default

Version:

Default (shadcn) kit for @react-three/uikit

10 lines (9 loc) 613 B
import { Container } from '@react-three/uikit'; import React, { forwardRef, useMemo } from 'react'; import { colors } from './theme.js'; import { computed } from '@preact/signals-core'; export const Progress = forwardRef(({ value, ...props }, ref) => { const width = useMemo(() => computed(() => `${(value ?? 0)}%`), [value]); return (React.createElement(Container, { height: 16, width: "100%", borderRadius: 1000, backgroundColor: colors.secondary, ref: ref, ...props }, React.createElement(Container, { height: "100%", borderRadius: 1000, backgroundColor: colors.primary, width: width }))); });