mirror of
https://github.com/jeffvli/feishin.git
synced 2026-06-14 23:44:01 +02:00
add Mantine progress component
This commit is contained in:
@@ -0,0 +1,7 @@
|
|||||||
|
.root {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section {
|
||||||
|
transition: width 0.15s ease-out;
|
||||||
|
}
|
||||||
@@ -0,0 +1,29 @@
|
|||||||
|
import type { ProgressProps as MantineProgressProps } from '@mantine/core';
|
||||||
|
|
||||||
|
import { Progress as MantineProgress } from '@mantine/core';
|
||||||
|
import { forwardRef } from 'react';
|
||||||
|
|
||||||
|
import styles from './progress.module.css';
|
||||||
|
|
||||||
|
export interface ProgressProps extends MantineProgressProps {}
|
||||||
|
|
||||||
|
export const Progress = forwardRef<HTMLDivElement, ProgressProps>(
|
||||||
|
({ classNames, style, ...props }, ref) => {
|
||||||
|
return (
|
||||||
|
<MantineProgress
|
||||||
|
classNames={{
|
||||||
|
root: styles.root,
|
||||||
|
section: styles.section,
|
||||||
|
...classNames,
|
||||||
|
}}
|
||||||
|
ref={ref}
|
||||||
|
style={{
|
||||||
|
...style,
|
||||||
|
}}
|
||||||
|
{...props}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
Progress.displayName = 'Progress';
|
||||||
Reference in New Issue
Block a user