Clarity Angular Vertical Timeline enum

354 Views Asked by At

I installed Clarity Design System and added a Timeline component

<clr-timeline>
  <clr-timeline-step>
    <clr-timeline-step-header>11:59 am</clr-timeline-step-header>
  </clr-timeline-step>
</clr-timeline>

I want to change layout to vertical on first HTML tag. <clr-timeline [clrLayout]="'VERTICAL'"> But the input is an enum and I cannot give string values.

I imported in a class field

import { ClrTimelineLayout } from '@clr/angular/timeline';
..
orientation = ClrTimelineLayout.VERTICAL;

Error follows: Module not found: Error: Can't resolve '@clr/angular/timeline'

1

There are 1 best solutions below

0
readuke On BEST ANSWER

First check if you have @clr/core@next installed

Refer this to check correct installation https://clarity.design/documentation/get-started https://github.com/vmware/clarity/issues/4244

<clr-timeline [clrLayout]="orientation"><!--add this-->
  <clr-timeline-step>
    <clr-timeline-step-header>11:59 am</clr-timeline-step-header>
  </clr-timeline-step>
</clr-timeline>