mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 12:14:41 +01:00
80177679f2
Co-authored-by: Benjamin Canac <canacb1@gmail.com> Co-authored-by: Jakub <jakub.michalek@freelo.io>
1307 lines
128 KiB
Plaintext
1307 lines
128 KiB
Plaintext
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
|
|
|
exports[`Timeline > renders with as correctly 1`] = `
|
|
"<section data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</section>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with class correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex flex-col gap-8">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with date slot correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Date slot</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Date slot</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Date slot</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Date slot</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with defaultValue correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with description slot correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Description slot</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">Description slot</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Description slot</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">Description slot</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with indicator slot correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary">Indicator slot</span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary">Indicator slot</span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary">Indicator slot</span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary">Indicator slot</span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with items correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with modelValue correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with neutral color correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-inverted group-data-[state=active]:bg-inverted"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-inverted"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-inverted group-data-[state=active]:bg-inverted"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-inverted"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-inverted group-data-[state=active]:bg-inverted"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-inverted"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-inverted group-data-[state=active]:bg-inverted"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size 2xl horizontal correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-11 text-[22px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3 pb-8">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-11 text-[22px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3 pb-8">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-11 text-[22px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3 pb-8">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-11 text-[22px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-3 pb-8">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size 2xl vertical correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-11 text-[22px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3 pb-8">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-11 text-[22px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3 pb-8">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-11 text-[22px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3 pb-8">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-11 text-[22px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-3 pb-8">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size 2xs horizontal correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-5 text-[10px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full pb-5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-5 text-[10px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full pb-5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-5 text-[10px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full pb-5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-5 text-[10px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full pb-5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size 2xs vertical correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-5 text-[10px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full pb-5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-5 text-[10px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full pb-5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-5 text-[10px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full pb-5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-5 text-[10px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full pb-5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size 3xl horizontal correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-12 text-2xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3.5 pb-8.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-12 text-2xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3.5 pb-8.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-12 text-2xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3.5 pb-8.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-12 text-2xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-3.5 pb-8.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size 3xl vertical correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-12 text-2xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3.5 pb-8.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-12 text-2xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3.5 pb-8.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-12 text-2xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-3.5 pb-8.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-12 text-2xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-3.5 pb-8.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size 3xs horizontal correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-4 text-[8px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full -mt-0.5 pb-4.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-4 text-[8px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full -mt-0.5 pb-4.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-4 text-[8px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full -mt-0.5 pb-4.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-4 text-[8px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full -mt-0.5 pb-4.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size 3xs vertical correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-4 text-[8px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full -mt-0.5 pb-4.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-4 text-[8px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full -mt-0.5 pb-4.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-4 text-[8px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full -mt-0.5 pb-4.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-4 text-[8px] group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full -mt-0.5 pb-4.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size lg horizontal correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-9 text-lg group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2 pb-7">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-9 text-lg group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2 pb-7">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-9 text-lg group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2 pb-7">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-9 text-lg group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-2 pb-7">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size lg vertical correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-9 text-lg group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2 pb-7">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-9 text-lg group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2 pb-7">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-9 text-lg group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2 pb-7">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-9 text-lg group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-2 pb-7">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size md horizontal correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size md vertical correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size sm horizontal correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-7 text-sm group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1 pb-6">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-7 text-sm group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1 pb-6">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-7 text-sm group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1 pb-6">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-7 text-sm group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1 pb-6">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size sm vertical correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-7 text-sm group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1 pb-6">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-7 text-sm group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1 pb-6">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-7 text-sm group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1 pb-6">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-7 text-sm group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1 pb-6">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size xl horizontal correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-10 text-xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2.5 pb-7.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-10 text-xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2.5 pb-7.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-10 text-xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2.5 pb-7.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-10 text-xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-2.5 pb-7.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size xl vertical correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-10 text-xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2.5 pb-7.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-10 text-xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2.5 pb-7.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-10 text-xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-2.5 pb-7.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-10 text-xl group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-2.5 pb-7.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size xs horizontal correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-6 text-xs group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-0.5 pb-5.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-6 text-xs group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-0.5 pb-5.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-6 text-xs group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-0.5 pb-5.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-6 text-xs group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-0.5 pb-5.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with size xs vertical correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-6 text-xs group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-0.5 pb-5.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-6 text-xs group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-0.5 pb-5.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-6 text-xs group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-0.5 pb-5.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-6 text-xs group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-0.5 pb-5.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with title slot correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Title slot</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Title slot</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Title slot</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="font-medium text-highlighted text-sm">Title slot</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|
|
|
|
exports[`Timeline > renders with ui correctly 1`] = `
|
|
"<div data-orientation="vertical" class="flex gap-1.5 flex-col">
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 15, 2025</div>
|
|
<div class="text-highlighted text-sm font-bold">Project Kickoff</div>
|
|
<div class="text-muted text-wrap text-sm">Kicked off the project with team alignment. Set up project milestones and allocated resources.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 22, 2025</div>
|
|
<div class="text-highlighted text-sm font-bold">Design Phase</div>
|
|
<div class="text-muted text-wrap text-sm">User research and design workshops. Created wireframes and prototypes for user testing</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<div data-orientation="vertical" aria-orientation="vertical" role="separator" class="flex-1 rounded-full bg-elevated w-0.5 group-data-[state=completed]:bg-primary"></div>
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Mar 29, 2025</div>
|
|
<div class="text-highlighted text-sm font-bold">Development Sprint</div>
|
|
<div class="text-muted text-wrap text-sm">Frontend and backend development. Implemented core features and integrated with APIs.</div>
|
|
</div>
|
|
</div>
|
|
<div class="group relative flex flex-1 gap-3">
|
|
<div class="relative flex items-center gap-1.5 flex-col"><span class="inline-flex items-center justify-center shrink-0 select-none rounded-full align-middle bg-elevated size-8 text-base group-data-[state=completed]:text-inverted group-data-[state=active]:text-inverted text-muted group-data-[state=completed]:bg-primary group-data-[state=active]:bg-primary"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" viewBox="0 0 16 16" class="shrink-0 text-inherit"></svg></span>
|
|
<!--v-if-->
|
|
</div>
|
|
<div class="w-full mt-1.5 pb-6.5">
|
|
<div class="text-dimmed text-xs/5">Apr 5, 2025</div>
|
|
<div class="text-highlighted text-sm font-bold">Testing & Deployment</div>
|
|
<div class="text-muted text-wrap text-sm">QA testing and performance optimization. Deployed the application to production.</div>
|
|
</div>
|
|
</div>
|
|
</div>"
|
|
`;
|