Visual cron expression editor with field-by-field builder, presets select, human-readable description, and live schedule preview showing next occurrences. Registered in tools registry with CronIcon. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
106 lines
5.5 KiB
TypeScript
106 lines
5.5 KiB
TypeScript
import * as React from 'react';
|
|
|
|
export const ColorIcon = (props: React.SVGProps<SVGSVGElement>) => (
|
|
<svg {...props} fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z" />
|
|
<circle cx="6.5" cy="11.5" r="1" fill="currentColor" />
|
|
<circle cx="9.5" cy="7.5" r="1" fill="currentColor" />
|
|
<circle cx="14.5" cy="7.5" r="1" fill="currentColor" />
|
|
<circle cx="17.5" cy="11.5" r="1" fill="currentColor" />
|
|
</svg>
|
|
);
|
|
|
|
export const UnitsIcon = (props: React.SVGProps<SVGSVGElement>) => (
|
|
<svg {...props} fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M7 16V4m0 0L3 8m4-4l4 4m6 0v12m0 0l4-4m-4 4l-4-4" />
|
|
</svg>
|
|
);
|
|
|
|
export const ASCIIIcon = (props: React.SVGProps<SVGSVGElement>) => (
|
|
<svg {...props} fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M3.5 13h6" />
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="m2 16 4.5-9 4.5 9" />
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M18 16V7" />
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="m14 11 4-4 4 4" />
|
|
</svg>
|
|
);
|
|
|
|
export const MediaIcon = (props: React.SVGProps<SVGSVGElement>) => (
|
|
<svg {...props} fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" />
|
|
</svg>
|
|
);
|
|
|
|
export const FaviconIcon = (props: React.SVGProps<SVGSVGElement>) => (
|
|
<svg {...props} fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5" />
|
|
</svg>
|
|
);
|
|
|
|
export const AnimateIcon = (props: React.SVGProps<SVGSVGElement>) => (
|
|
<svg {...props} fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<circle cx="12" cy="12" r="3" strokeWidth={2} />
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
|
|
d="M12 3c-1.2 2.4-1.2 4.8 0 7.2" />
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
|
|
d="M12 21c1.2-2.4 1.2-4.8 0-7.2" />
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
|
|
d="M3 12c2.4 1.2 4.8 1.2 7.2 0" />
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
|
|
d="M21 12c-2.4-1.2-4.8-1.2-7.2 0" />
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} strokeDasharray="2 2"
|
|
d="M5.6 5.6c1.8 1.8 3.4 2.6 4.8 2.4" />
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} strokeDasharray="2 2"
|
|
d="M18.4 18.4c-1.8-1.8-3.4-2.6-4.8-2.4" />
|
|
</svg>
|
|
);
|
|
|
|
export const QRCodeIcon = (props: React.SVGProps<SVGSVGElement>) => (
|
|
<svg {...props} fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<rect x="3" y="3" width="7" height="7" rx="1" strokeWidth={2} />
|
|
<rect x="14" y="3" width="7" height="7" rx="1" strokeWidth={2} />
|
|
<rect x="3" y="14" width="7" height="7" rx="1" strokeWidth={2} />
|
|
<rect x="14" y="14" width="3" height="3" strokeWidth={2} />
|
|
<rect x="18" y="18" width="3" height="3" strokeWidth={2} />
|
|
<line x1="14" y1="18" x2="17" y2="18" strokeWidth={2} />
|
|
<line x1="18" y1="14" x2="18" y2="17" strokeWidth={2} />
|
|
</svg>
|
|
);
|
|
|
|
export const RandomIcon = (props: React.SVGProps<SVGSVGElement>) => (
|
|
<svg {...props} fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<rect x="3" y="3" width="18" height="18" rx="3" strokeWidth={2} />
|
|
<circle cx="8.5" cy="8.5" r="1.25" fill="currentColor" stroke="none" />
|
|
<circle cx="15.5" cy="8.5" r="1.25" fill="currentColor" stroke="none" />
|
|
<circle cx="8.5" cy="15.5" r="1.25" fill="currentColor" stroke="none" />
|
|
<circle cx="15.5" cy="15.5" r="1.25" fill="currentColor" stroke="none" />
|
|
<circle cx="12" cy="12" r="1.25" fill="currentColor" stroke="none" />
|
|
</svg>
|
|
);
|
|
|
|
export const CronIcon = (props: React.SVGProps<SVGSVGElement>) => (
|
|
<svg {...props} fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
{/* Clock face */}
|
|
<circle cx="12" cy="12" r="8.5" strokeWidth={2} />
|
|
{/* Center */}
|
|
<circle cx="12" cy="12" r="1" fill="currentColor" stroke="none" />
|
|
{/* Clock hands */}
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 7.5V12l3 2" />
|
|
{/* Repeat arrow arcing around the top */}
|
|
<path strokeLinecap="round" strokeWidth={1.5} d="M18.5 6.5a10.5 10.5 0 0 0-7-3.5" />
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M18.5 6.5l2-2M18.5 6.5l-1.5 2.5" />
|
|
</svg>
|
|
);
|
|
|
|
export const CalculateIcon = (props: React.SVGProps<SVGSVGElement>) => (
|
|
<svg {...props} fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
{/* Y-axis */}
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 20V4" />
|
|
{/* X-axis */}
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 20h16" />
|
|
{/* Smooth curve resembling sin/cos */}
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
|
|
d="M4 14c1.5-3 3-7 5-5s2 8 4 6 3-6 5-5" />
|
|
</svg>
|
|
);
|