83 lines
2.4 KiB
Python
Executable file
83 lines
2.4 KiB
Python
Executable file
import os
|
||
|
||
skeleton_code = '''import React from 'react'
|
||
|
||
interface SkeletonProps {
|
||
className?: string
|
||
variant?: 'rectangular' | 'circular' | 'text'
|
||
pulse?: boolean
|
||
}
|
||
|
||
export function Skeleton({ className = '', variant = 'rectangular', pulse = true }: SkeletonProps) {
|
||
const baseClasses = 'bg-gray-800 border border-gray-700'
|
||
const variantClasses = {
|
||
rectangular: 'rounded-md',
|
||
circular: 'rounded-full',
|
||
text: 'rounded-sm h-4'
|
||
}
|
||
const animationClasses = pulse ? 'animate-pulse' : ''
|
||
|
||
return (
|
||
<div
|
||
className={\ \ \ \}
|
||
aria-hidden="true"
|
||
/>
|
||
)
|
||
}
|
||
|
||
export function SkeletonList({ count = 3, className = '' }) {
|
||
return (
|
||
<div className="space-y-4">
|
||
{Array.from({ length: count }).map((_, i) => (
|
||
<div key={i} className={p-4 bg-[#1e1e2e] border border-gray-700/50 rounded-lg flex items-center justify-between \}>
|
||
<div className="space-y-3 flex-1 mr-4">
|
||
<Skeleton variant="text" className="w-1/3 h-5" />
|
||
<Skeleton variant="text" className="w-1/2 h-4" />
|
||
</div>
|
||
<div className="flex gap-2">
|
||
<Skeleton variant="circular" className="w-8 h-8" />
|
||
<Skeleton variant="circular" className="w-8 h-8" />
|
||
</div>
|
||
</div>
|
||
))}
|
||
</div>
|
||
)
|
||
}
|
||
'''
|
||
|
||
spinner_code = '''import React from 'react'
|
||
|
||
export function Spinner({ className = 'w-6 h-6', text }: { className?: string, text?: string }) {
|
||
return (
|
||
<div className="flex flex-col items-center justify-center space-y-2">
|
||
<svg
|
||
className={nimate-spin text-purple-500 \}
|
||
xmlns="http://www.w3.org/2000/svg"
|
||
fill="none"
|
||
viewBox="0 0 24 24"
|
||
>
|
||
<circle
|
||
className="opacity-25"
|
||
cx="12"
|
||
cy="12"
|
||
r="10"
|
||
stroke="currentColor"
|
||
strokeWidth="4"
|
||
></circle>
|
||
<path
|
||
className="opacity-75"
|
||
fill="currentColor"
|
||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||
></path>
|
||
</svg>
|
||
{text && <span className="text-sm text-gray-400">{text}</span>}
|
||
</div>
|
||
)
|
||
}
|
||
'''
|
||
|
||
with open('c:/ScriptoriumAI/scriptoriumai-ui/src/components/ui/Skeleton.tsx', 'w', encoding='utf-8') as f:
|
||
f.write(skeleton_code.replace('\\$', '$'))
|
||
|
||
with open('c:/ScriptoriumAI/scriptoriumai-ui/src/components/ui/Spinner.tsx', 'w', encoding='utf-8') as f:
|
||
f.write(spinner_code.replace('\\$', '$'))
|