43 lines
8.3 KiB
TypeScript
43 lines
8.3 KiB
TypeScript
interface Props {
|
|
layout: string;
|
|
className?: string;
|
|
}
|
|
export default function EntityViewLayoutBadge({ layout, className = "h-5 w-5 text-muted-foreground" }: Props) {
|
|
return (
|
|
<>
|
|
{layout === "table" && (
|
|
<svg xmlns="http://www.w3.org/2000/svg" className={className} viewBox="0 0 20 20" fill="currentColor">
|
|
<path
|
|
fillRule="evenodd"
|
|
d="M5 4a3 3 0 00-3 3v6a3 3 0 003 3h10a3 3 0 003-3V7a3 3 0 00-3-3H5zm-1 9v-1h5v2H5a1 1 0 01-1-1zm7 1h4a1 1 0 001-1v-1h-5v2zm0-4h5V8h-5v2zM9 8H4v2h5V8z"
|
|
clipRule="evenodd"
|
|
/>
|
|
</svg>
|
|
)}
|
|
{layout === "board" && (
|
|
<svg xmlns="http://www.w3.org/2000/svg" className={className} viewBox="0 0 20 20" fill="currentColor">
|
|
<path d="M2 4a1 1 0 011-1h2a1 1 0 011 1v12a1 1 0 01-1 1H3a1 1 0 01-1-1V4zM8 4a1 1 0 011-1h2a1 1 0 011 1v12a1 1 0 01-1 1H9a1 1 0 01-1-1V4zM15 3a1 1 0 00-1 1v12a1 1 0 001 1h2a1 1 0 001-1V4a1 1 0 00-1-1h-2z" />
|
|
</svg>
|
|
)}
|
|
|
|
{layout === "grid" && (
|
|
<svg xmlns="http://www.w3.org/2000/svg" className={className} viewBox="0 0 20 20" fill="currentColor">
|
|
<path d="M5 3a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2V5a2 2 0 00-2-2H5zM5 11a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2v-2a2 2 0 00-2-2H5zM11 5a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V5zM11 13a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z" />
|
|
</svg>
|
|
)}
|
|
|
|
{layout === "card" && (
|
|
// <svg className={className} xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="80" height="80" viewBox="0 0 80 80" fill="currentColor">
|
|
// <path d="M 19 14 C 12.9375 14 8 18.9375 8 25 L 8 55 C 8 61.0625 12.9375 66 19 66 L 61 66 C 67.0625 66 72 61.0625 72 55 L 72 25 C 72 18.9375 67.0625 14 61 14 Z M 19 16 L 61 16 C 65.984375 16 70 20.015625 70 25 L 70 55 C 70 59.984375 65.984375 64 61 64 L 19 64 C 14.015625 64 10 59.984375 10 55 L 10 25 C 10 20.015625 14.015625 16 19 16 Z M 22 19 C 21.449219 19 21 19.449219 21 20 C 21 20.550781 21.449219 21 22 21 C 22.550781 21 23 20.550781 23 20 C 23 19.449219 22.550781 19 22 19 Z M 26 19 C 25.449219 19 25 19.449219 25 20 C 25 20.550781 25.449219 21 26 21 C 26.550781 21 27 20.550781 27 20 C 27 19.449219 26.550781 19 26 19 Z M 30 19 C 29.449219 19 29 19.449219 29 20 C 29 20.550781 29.449219 21 30 21 C 30.550781 21 31 20.550781 31 20 C 31 19.449219 30.550781 19 30 19 Z M 34 19 C 33.449219 19 33 19.449219 33 20 C 33 20.550781 33.449219 21 34 21 C 34.550781 21 35 20.550781 35 20 C 35 19.449219 34.550781 19 34 19 Z M 38 19 C 37.449219 19 37 19.449219 37 20 C 37 20.550781 37.449219 21 38 21 C 38.550781 21 39 20.550781 39 20 C 39 19.449219 38.550781 19 38 19 Z M 42 19 C 41.449219 19 41 19.449219 41 20 C 41 20.550781 41.449219 21 42 21 C 42.550781 21 43 20.550781 43 20 C 43 19.449219 42.550781 19 42 19 Z M 46 19 C 45.449219 19 45 19.449219 45 20 C 45 20.550781 45.449219 21 46 21 C 46.550781 21 47 20.550781 47 20 C 47 19.449219 46.550781 19 46 19 Z M 50 19 C 49.449219 19 49 19.449219 49 20 C 49 20.550781 49.449219 21 50 21 C 50.550781 21 51 20.550781 51 20 C 51 19.449219 50.550781 19 50 19 Z M 54 19 C 53.449219 19 53 19.449219 53 20 C 53 20.550781 53.449219 21 54 21 C 54.550781 21 55 20.550781 55 20 C 55 19.449219 54.550781 19 54 19 Z M 58 19 C 57.449219 19 57 19.449219 57 20 C 57 20.550781 57.449219 21 58 21 C 58.550781 21 59 20.550781 59 20 C 59 19.449219 58.550781 19 58 19 Z M 18 20 C 17.449219 20 17 20.449219 17 21 C 17 21.550781 17.449219 22 18 22 C 18.550781 22 19 21.550781 19 21 C 19 20.449219 18.550781 20 18 20 Z M 62 20 C 61.449219 20 61 20.449219 61 21 C 61 21.550781 61.449219 22 62 22 C 62.550781 22 63 21.550781 63 21 C 63 20.449219 62.550781 20 62 20 Z M 15 23 C 14.449219 23 14 23.449219 14 24 C 14 24.550781 14.449219 25 15 25 C 15.550781 25 16 24.550781 16 24 C 16 23.449219 15.550781 23 15 23 Z M 65 23 C 64.449219 23 64 23.449219 64 24 C 64 24.550781 64.449219 25 65 25 C 65.550781 25 66 24.550781 66 24 C 66 23.449219 65.550781 23 65 23 Z M 14 27 C 13.449219 27 13 27.449219 13 28 C 13 28.550781 13.449219 29 14 29 C 14.550781 29 15 28.550781 15 28 C 15 27.449219 14.550781 27 14 27 Z M 66 27 C 65.449219 27 65 27.449219 65 28 C 65 28.550781 65.449219 29 66 29 C 66.550781 29 67 28.550781 67 28 C 67 27.449219 66.550781 27 66 27 Z M 14 31 C 13.449219 31 13 31.449219 13 32 C 13 32.550781 13.449219 33 14 33 C 14.550781 33 15 32.550781 15 32 C 15 31.449219 14.550781 31 14 31 Z M 66 31 C 65.449219 31 65 31.449219 65 32 C 65 32.550781 65.449219 33 66 33 C 66.550781 33 67 32.550781 67 32 C 67 31.449219 66.550781 31 66 31 Z M 14 35 C 13.449219 35 13 35.449219 13 36 C 13 36.550781 13.449219 37 14 37 C 14.550781 37 15 36.550781 15 36 C 15 35.449219 14.550781 35 14 35 Z M 66 35 C 65.449219 35 65 35.449219 65 36 C 65 36.550781 65.449219 37 66 37 C 66.550781 37 67 36.550781 67 36 C 67 35.449219 66.550781 35 66 35 Z M 14 39 C 13.449219 39 13 39.449219 13 40 C 13 40.550781 13.449219 41 14 41 C 14.550781 41 15 40.550781 15 40 C 15 39.449219 14.550781 39 14 39 Z M 66 39 C 65.449219 39 65 39.449219 65 40 C 65 40.550781 65.449219 41 66 41 C 66.550781 41 67 40.550781 67 40 C 67 39.449219 66.550781 39 66 39 Z M 14 43 C 13.449219 43 13 43.449219 13 44 C 13 44.550781 13.449219 45 14 45 C 14.550781 45 15 44.550781 15 44 C 15 43.449219 14.550781 43 14 43 Z M 66 43 C 65.449219 43 65 43.449219 65 44 C 65 44.550781 65.449219 45 66 45 C 66.550781 45 67 44.550781 67 44 C 67 43.449219 66.550781 43 66 43 Z M 14 47 C 13.449219 47 13 47.449219 13 48 C 13 48.550781 13.449219 49 14 49 C 14.550781 49 15 48.550781 15 48 C 15 47.449219 14.550781 47 14 47 Z M 66 47 C 65.449219 47 65 47.449219 65 48 C 65 48.550781 65.449219 49 66 49 C 66.550781 49 67 48.550781 67 48 C 67 47.449219 66.550781 47 66 47 Z M 14 51 C 13.449219 51 13 51.449219 13 52 C 13 52.550781 13.449219 53 14 53 C 14.550781 53 15 52.550781 15 52 C 15 51.449219 14.550781 51 14 51 Z M 66 51 C 65.449219 51 65 51.449219 65 52 C 65 52.550781 65.449219 53 66 53 C 66.550781 53 67 52.550781 67 52 C 67 51.449219 66.550781 51 66 51 Z M 15 55 C 14.449219 55 14 55.449219 14 56 C 14 56.550781 14.449219 57 15 57 C 15.550781 57 16 56.550781 16 56 C 16 55.449219 15.550781 55 15 55 Z M 65 55 C 64.449219 55 64 55.449219 64 56 C 64 56.550781 64.449219 57 65 57 C 65.550781 57 66 56.550781 66 56 C 66 55.449219 65.550781 55 65 55 Z M 18 58 C 17.449219 58 17 58.449219 17 59 C 17 59.550781 17.449219 60 18 60 C 18.550781 60 19 59.550781 19 59 C 19 58.449219 18.550781 58 18 58 Z M 62 58 C 61.449219 58 61 58.449219 61 59 C 61 59.550781 61.449219 60 62 60 C 62.550781 60 63 59.550781 63 59 C 63 58.449219 62.550781 58 62 58 Z M 22 59 C 21.449219 59 21 59.449219 21 60 C 21 60.550781 21.449219 61 22 61 C 22.550781 61 23 60.550781 23 60 C 23 59.449219 22.550781 59 22 59 Z M 26 59 C 25.449219 59 25 59.449219 25 60 C 25 60.550781 25.449219 61 26 61 C 26.550781 61 27 60.550781 27 60 C 27 59.449219 26.550781 59 26 59 Z M 30 59 C 29.449219 59 29 59.449219 29 60 C 29 60.550781 29.449219 61 30 61 C 30.550781 61 31 60.550781 31 60 C 31 59.449219 30.550781 59 30 59 Z M 34 59 C 33.449219 59 33 59.449219 33 60 C 33 60.550781 33.449219 61 34 61 C 34.550781 61 35 60.550781 35 60 C 35 59.449219 34.550781 59 34 59 Z M 38 59 C 37.449219 59 37 59.449219 37 60 C 37 60.550781 37.449219 61 38 61 C 38.550781 61 39 60.550781 39 60 C 39 59.449219 38.550781 59 38 59 Z M 42 59 C 41.449219 59 41 59.449219 41 60 C 41 60.550781 41.449219 61 42 61 C 42.550781 61 43 60.550781 43 60 C 43 59.449219 42.550781 59 42 59 Z M 46 59 C 45.449219 59 45 59.449219 45 60 C 45 60.550781 45.449219 61 46 61 C 46.550781 61 47 60.550781 47 60 C 47 59.449219 46.550781 59 46 59 Z M 50 59 C 49.449219 59 49 59.449219 49 60 C 49 60.550781 49.449219 61 50 61 C 50.550781 61 51 60.550781 51 60 C 51 59.449219 50.550781 59 50 59 Z M 54 59 C 53.449219 59 53 59.449219 53 60 C 53 60.550781 53.449219 61 54 61 C 54.550781 61 55 60.550781 55 60 C 55 59.449219 54.550781 59 54 59 Z M 58 59 C 57.449219 59 57 59.449219 57 60 C 57 60.550781 57.449219 61 58 61 C 58.550781 61 59 60.550781 59 60 C 59 59.449219 58.550781 59 58 59 Z"></path>
|
|
// </svg>
|
|
<svg className={className} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 100">
|
|
<rect x="20" y="20" rx="10" ry="10" width="80" height="80" fill="currentColor" />
|
|
<rect x="110" y="20" rx="10" ry="10" width="80" height="80" fill="currentColor" />
|
|
</svg>
|
|
|
|
// <span className="text-xs font-medium italic">Row</span>
|
|
)}
|
|
</>
|
|
);
|
|
}
|