All files / src/components/widget-host si-widget-host.component.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
42x
117x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
42x
 
 
117x
117x
 
 
 
 
 
 
 
 
 
 
 
 
 
42x
117x
4x
8x
 
 
 
 
42x
117x
 
 
 
 
42x
 
 
<div class="grid-stack-item-content p-4">
  @if (editable()) {
    <div class="resize-handle">
      <svg
        width="24"
        height="24"
        viewBox="0 0 24 24"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <g>
          <path d="M16 16H18V18H16V16Z" fill="currentColor" />
          <path d="M11 16H13V18H11V16Z" fill="currentColor" />
          <path d="M11 11H13V13H11V11Z" fill="currentColor" />
          <path d="M6 16H8V18H6V16Z" fill="currentColor" />
          <path d="M16 11H18V13H16V11Z" fill="currentColor" />
          <path d="M16 6H18V8H16V6Z" fill="currentColor" />
        </g>
      </svg>
    </div>
    <div class="draggable-overlay"></div>
  }
 
  <si-dashboard-card
    #card
    class="h-100 dragging-card"
    [class]="accentLine()"
    [expandText]="labelExpand"
    [restoreText]="labelRestore"
    [heading]="widgetConfig().heading"
    [primaryActions]="primaryActions"
    [secondaryActions]="secondaryActions"
    [actionBarViewType]="actionBarViewType"
    [enableExpandInteraction]="widgetConfig().expandable"
    [imgAlt]="widgetConfig().image?.alt"
    [imgDir]="widgetConfig().image?.dir"
    [imgObjectFit]="widgetConfig().image?.objectFit"
    [imgObjectPosition]="widgetConfig().image?.objectPosition"
    [imgSrc]="!setupPending() ? widgetConfig().image?.src : ''"
  >
    <div class="card-body overflow-auto" body>
      <ng-container #widgetHost />
      @if (setupPending()) {
        <si-empty-state
          [icon]="emptyStateIcon()"
          [heading]="labelSetup"
          [content]="labelSetupMessage"
        />
      }
    </div>
    @if (widgetInstanceFooter && !setupPending()) {
      <div class="card-footer" footer>
        <ng-container *ngTemplateOutlet="widgetInstanceFooter" />
      </div>
    }
  </si-dashboard-card>
</div>