@softpak/components 18.6.10 → 19.0.0-beta.10

package/fesm2022/softpak-components-spx-card.mjs

@@ -20,31 +20,31 @@ class SpxCardComponent {
         this.clicked.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SpxCardComponent, isStandalone: true, selector: "spx-card", inputs: { clickable: "clickable", hasContent: "hasContent", onDetailPage: "onDetailPage", text: "text", unit: "unit", tableView: "tableView" }, outputs: { clicked: "clicked" }, ngImport: i0, template: `
-  <button type="button"
-    class="block w-full text-left rounded font-body items-stretch"
-    [class.flex]="tableView"
-    [class.cursor-pointer]="clickable"
-    [class.cursor-not-allowed]="!clickable"
-    [class.focus:ring-2]="clickable"
-    [class.focus:ring-offset-2]="clickable"
-    [class.focus:ring-blue-500]="clickable"
-    (click)="onClick()"
-    [tabIndex]="clickable ? 0 : -1">
-    <div class="text-gray-900 opacity-90" [class.w-96]="tableView">
-      <ng-content select="[card-header]"></ng-content>
-    </div>
-    <ng-content select="[card-content-top]"></ng-content>
-    @if (hasContent) {
-      <div class="bg-white dark:bg-gray-600 p-3">
-        <ng-content select="[card-content]"></ng-content>
-      </div>
-    }
-    <ng-content select="[card-content-bottom]"></ng-content>
-    <div class="bg-gray-50 dark:bg-gray-700 p-3 grow" [class.rounded-b-lg]="!onDetailPage && !tableView" [class.rounded-r-lg]="!onDetailPage && tableView">
-      <ng-content select="[card-lines]"></ng-content>
-    </div>
-  </button>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SpxCardComponent, isStandalone: true, selector: "spx-card", inputs: { clickable: "clickable", hasContent: "hasContent", onDetailPage: "onDetailPage", text: "text", unit: "unit", tableView: "tableView" }, outputs: { clicked: "clicked" }, ngImport: i0, template: `
+  <button type="button"
+    class="block w-full text-left rounded font-body items-stretch"
+    [class.flex]="tableView"
+    [class.cursor-pointer]="clickable"
+    [class.cursor-not-allowed]="!clickable"
+    [class.focus:ring-2]="clickable"
+    [class.focus:ring-offset-2]="clickable"
+    [class.focus:ring-blue-500]="clickable"
+    (click)="onClick()"
+    [tabIndex]="clickable ? 0 : -1">
+    <div class="text-gray-900 opacity-90" [class.w-96]="tableView">
+      <ng-content select="[card-header]"></ng-content>
+    </div>
+    <ng-content select="[card-content-top]"></ng-content>
+    @if (hasContent) {
+      <div class="bg-white dark:bg-gray-600 p-3">
+        <ng-content select="[card-content]"></ng-content>
+      </div>
+    }
+    <ng-content select="[card-content-bottom]"></ng-content>
+    <div class="bg-gray-50 dark:bg-gray-700 p-3 grow" [class.rounded-b-lg]="!onDetailPage && !tableView" [class.rounded-r-lg]="!onDetailPage && tableView">
+      <ng-content select="[card-lines]"></ng-content>
+    </div>
+  </button>
   `, isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxCardComponent, decorators: [{
@@ -55,31 +55,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                     imports: [
                         NgClass
                     ],
-                    template: `
-  <button type="button"
-    class="block w-full text-left rounded font-body items-stretch"
-    [class.flex]="tableView"
-    [class.cursor-pointer]="clickable"
-    [class.cursor-not-allowed]="!clickable"
-    [class.focus:ring-2]="clickable"
-    [class.focus:ring-offset-2]="clickable"
-    [class.focus:ring-blue-500]="clickable"
-    (click)="onClick()"
-    [tabIndex]="clickable ? 0 : -1">
-    <div class="text-gray-900 opacity-90" [class.w-96]="tableView">
-      <ng-content select="[card-header]"></ng-content>
-    </div>
-    <ng-content select="[card-content-top]"></ng-content>
-    @if (hasContent) {
-      <div class="bg-white dark:bg-gray-600 p-3">
-        <ng-content select="[card-content]"></ng-content>
-      </div>
-    }
-    <ng-content select="[card-content-bottom]"></ng-content>
-    <div class="bg-gray-50 dark:bg-gray-700 p-3 grow" [class.rounded-b-lg]="!onDetailPage && !tableView" [class.rounded-r-lg]="!onDetailPage && tableView">
-      <ng-content select="[card-lines]"></ng-content>
-    </div>
-  </button>
+                    template: `
+  <button type="button"
+    class="block w-full text-left rounded font-body items-stretch"
+    [class.flex]="tableView"
+    [class.cursor-pointer]="clickable"
+    [class.cursor-not-allowed]="!clickable"
+    [class.focus:ring-2]="clickable"
+    [class.focus:ring-offset-2]="clickable"
+    [class.focus:ring-blue-500]="clickable"
+    (click)="onClick()"
+    [tabIndex]="clickable ? 0 : -1">
+    <div class="text-gray-900 opacity-90" [class.w-96]="tableView">
+      <ng-content select="[card-header]"></ng-content>
+    </div>
+    <ng-content select="[card-content-top]"></ng-content>
+    @if (hasContent) {
+      <div class="bg-white dark:bg-gray-600 p-3">
+        <ng-content select="[card-content]"></ng-content>
+      </div>
+    }
+    <ng-content select="[card-content-bottom]"></ng-content>
+    <div class="bg-gray-50 dark:bg-gray-700 p-3 grow" [class.rounded-b-lg]="!onDetailPage && !tableView" [class.rounded-r-lg]="!onDetailPage && tableView">
+      <ng-content select="[card-lines]"></ng-content>
+    </div>
+  </button>
   `,
                 }]
         }], ctorParameters: () => [], propDecorators: { clickable: [{
@@ -114,40 +114,40 @@ class SpxCardItemComponent {
     get spxIconSeverityUnknown() { return this.spxIconSeverity === SpxSeverityEnum.unknown; }
     get spxIconSeverityWarning() { return this.spxIconSeverity === SpxSeverityEnum.warning; }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxCardItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SpxCardItemComponent, isStandalone: true, selector: "spx-card-item", inputs: { icon: "icon", iconOnly: "iconOnly", spxLabel: "spxLabel", spxValue: "spxValue", spxSeverity: "spxSeverity", spxIconSeverity: "spxIconSeverity" }, host: { properties: { "class.h-full": "this.hFull" } }, ngImport: i0, template: `
-    <div class='py-2 px-3 rounded h-full'
-      [class.bg-slate-100]="!spxSeverity"
-      [class.dark:bg-slate-600]="!spxSeverity"
-      [class.text-black]="spxSeverityWarning"
-      [class.text-white]="spxSeverityError || spxSeverityInfo || spxSeveritySuccess || spxSeverityUnknown"
-      [class.bg-red-700]="spxSeverityError"
-      [class.bg-green-700]="spxSeveritySuccess"
-      [class.bg-blue-700]="spxSeverityInfo"
-      [class.bg-gray-400]="spxSeverityUnknown"
-      [class.bg-amber-700]="spxSeverityWarning">
-      <div class="font-small leading-normal">{{ spxLabel }}</div>
-      <div class="flex gap-4 text-lg leading-normal py-1">
-        @if (icon) {
-          <div class="font-bold text-center leading-normal max-w-12 min-w-12" [class.grow]="iconOnly">
-            <div
-              class="px-3 py-1 text-white rounded"
-              [class.bg-black]="!spxIconSeverity"
-              [class.bg-red-700]="spxIconSeverityError"
-              [class.bg-green-700]="spxIconSeveritySuccess"
-              [class.bg-blue-700]="spxIconSeverityInfo"
-              [class.bg-gray-400]="spxIconSeverityUnknown"
-              [class.bg-amber-700]="spxIconSeverityWarning">
-              <fa-icon [icon]="icon"></fa-icon>
-            </div>
-          </div>
-        }
-        <div class="grow font-bold">
-          @if (!iconOnly) {
-            <ng-content></ng-content><div [innerHTML]="spxValue"></div>
-          }
-        </div>
-      </div>
-    </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SpxCardItemComponent, isStandalone: true, selector: "spx-card-item", inputs: { icon: "icon", iconOnly: "iconOnly", spxLabel: "spxLabel", spxValue: "spxValue", spxSeverity: "spxSeverity", spxIconSeverity: "spxIconSeverity" }, host: { properties: { "class.h-full": "this.hFull" } }, ngImport: i0, template: `
+    <div class='py-2 px-3 rounded h-full'
+      [class.bg-slate-100]="!spxSeverity"
+      [class.dark:bg-slate-600]="!spxSeverity"
+      [class.text-black]="spxSeverityWarning"
+      [class.text-white]="spxSeverityError || spxSeverityInfo || spxSeveritySuccess || spxSeverityUnknown"
+      [class.bg-red-700]="spxSeverityError"
+      [class.bg-green-700]="spxSeveritySuccess"
+      [class.bg-blue-700]="spxSeverityInfo"
+      [class.bg-gray-400]="spxSeverityUnknown"
+      [class.bg-amber-700]="spxSeverityWarning">
+      <div class="font-small leading-normal">{{ spxLabel }}</div>
+      <div class="flex gap-4 text-lg leading-normal py-1">
+        @if (icon) {
+          <div class="font-bold text-center leading-normal max-w-12 min-w-12" [class.grow]="iconOnly">
+            <div
+              class="px-3 py-1 text-white rounded"
+              [class.bg-black]="!spxIconSeverity"
+              [class.bg-red-700]="spxIconSeverityError"
+              [class.bg-green-700]="spxIconSeveritySuccess"
+              [class.bg-blue-700]="spxIconSeverityInfo"
+              [class.bg-gray-400]="spxIconSeverityUnknown"
+              [class.bg-amber-700]="spxIconSeverityWarning">
+              <fa-icon [icon]="icon"></fa-icon>
+            </div>
+          </div>
+        }
+        <div class="grow font-bold">
+          @if (!iconOnly) {
+            <ng-content></ng-content><div [innerHTML]="spxValue"></div>
+          }
+        </div>
+      </div>
+    </div>
     `, isInline: true, dependencies: [{ kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxCardItemComponent, decorators: [{
@@ -158,40 +158,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                     imports: [
                         FaIconComponent
                     ],
-                    template: `
-    <div class='py-2 px-3 rounded h-full'
-      [class.bg-slate-100]="!spxSeverity"
-      [class.dark:bg-slate-600]="!spxSeverity"
-      [class.text-black]="spxSeverityWarning"
-      [class.text-white]="spxSeverityError || spxSeverityInfo || spxSeveritySuccess || spxSeverityUnknown"
-      [class.bg-red-700]="spxSeverityError"
-      [class.bg-green-700]="spxSeveritySuccess"
-      [class.bg-blue-700]="spxSeverityInfo"
-      [class.bg-gray-400]="spxSeverityUnknown"
-      [class.bg-amber-700]="spxSeverityWarning">
-      <div class="font-small leading-normal">{{ spxLabel }}</div>
-      <div class="flex gap-4 text-lg leading-normal py-1">
-        @if (icon) {
-          <div class="font-bold text-center leading-normal max-w-12 min-w-12" [class.grow]="iconOnly">
-            <div
-              class="px-3 py-1 text-white rounded"
-              [class.bg-black]="!spxIconSeverity"
-              [class.bg-red-700]="spxIconSeverityError"
-              [class.bg-green-700]="spxIconSeveritySuccess"
-              [class.bg-blue-700]="spxIconSeverityInfo"
-              [class.bg-gray-400]="spxIconSeverityUnknown"
-              [class.bg-amber-700]="spxIconSeverityWarning">
-              <fa-icon [icon]="icon"></fa-icon>
-            </div>
-          </div>
-        }
-        <div class="grow font-bold">
-          @if (!iconOnly) {
-            <ng-content></ng-content><div [innerHTML]="spxValue"></div>
-          }
-        </div>
-      </div>
-    </div>
+                    template: `
+    <div class='py-2 px-3 rounded h-full'
+      [class.bg-slate-100]="!spxSeverity"
+      [class.dark:bg-slate-600]="!spxSeverity"
+      [class.text-black]="spxSeverityWarning"
+      [class.text-white]="spxSeverityError || spxSeverityInfo || spxSeveritySuccess || spxSeverityUnknown"
+      [class.bg-red-700]="spxSeverityError"
+      [class.bg-green-700]="spxSeveritySuccess"
+      [class.bg-blue-700]="spxSeverityInfo"
+      [class.bg-gray-400]="spxSeverityUnknown"
+      [class.bg-amber-700]="spxSeverityWarning">
+      <div class="font-small leading-normal">{{ spxLabel }}</div>
+      <div class="flex gap-4 text-lg leading-normal py-1">
+        @if (icon) {
+          <div class="font-bold text-center leading-normal max-w-12 min-w-12" [class.grow]="iconOnly">
+            <div
+              class="px-3 py-1 text-white rounded"
+              [class.bg-black]="!spxIconSeverity"
+              [class.bg-red-700]="spxIconSeverityError"
+              [class.bg-green-700]="spxIconSeveritySuccess"
+              [class.bg-blue-700]="spxIconSeverityInfo"
+              [class.bg-gray-400]="spxIconSeverityUnknown"
+              [class.bg-amber-700]="spxIconSeverityWarning">
+              <fa-icon [icon]="icon"></fa-icon>
+            </div>
+          </div>
+        }
+        <div class="grow font-bold">
+          @if (!iconOnly) {
+            <ng-content></ng-content><div [innerHTML]="spxValue"></div>
+          }
+        </div>
+      </div>
+    </div>
     `,
                 }]
         }], propDecorators: { hFull: [{
@@ -216,19 +216,19 @@ class SpxCardGridComponent {
         this.minWidth2Columns = 460;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxCardGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SpxCardGridComponent, isStandalone: true, selector: "spx-card-grid", inputs: { minWidth2Columns: "minWidth2Columns" }, ngImport: i0, template: `
-    <div class='grid gap-3 items-stretch'
-    [class.min-[300px]:grid-cols-2]="minWidth2Columns == 300"
-    [class.min-[320px]:grid-cols-2]="minWidth2Columns == 320"
-    [class.min-[340px]:grid-cols-2]="minWidth2Columns == 340"
-    [class.min-[360px]:grid-cols-2]="minWidth2Columns == 360"
-    [class.min-[380px]:grid-cols-2]="minWidth2Columns == 380"
-    [class.min-[400px]:grid-cols-2]="minWidth2Columns == 400"
-    [class.min-[420px]:grid-cols-2]="minWidth2Columns == 420"
-    [class.min-[440px]:grid-cols-2]="minWidth2Columns == 440"
-    [class.min-[460px]:grid-cols-2]="minWidth2Columns == 460">
-      <ng-content></ng-content>
-  </div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SpxCardGridComponent, isStandalone: true, selector: "spx-card-grid", inputs: { minWidth2Columns: "minWidth2Columns" }, ngImport: i0, template: `
+    <div class='grid gap-3 items-stretch'
+    [class.min-[300px]:grid-cols-2]="minWidth2Columns == 300"
+    [class.min-[320px]:grid-cols-2]="minWidth2Columns == 320"
+    [class.min-[340px]:grid-cols-2]="minWidth2Columns == 340"
+    [class.min-[360px]:grid-cols-2]="minWidth2Columns == 360"
+    [class.min-[380px]:grid-cols-2]="minWidth2Columns == 380"
+    [class.min-[400px]:grid-cols-2]="minWidth2Columns == 400"
+    [class.min-[420px]:grid-cols-2]="minWidth2Columns == 420"
+    [class.min-[440px]:grid-cols-2]="minWidth2Columns == 440"
+    [class.min-[460px]:grid-cols-2]="minWidth2Columns == 460">
+      <ng-content></ng-content>
+  </div>
   `, isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxCardGridComponent, decorators: [{
@@ -236,19 +236,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             args: [{
                     selector: 'spx-card-grid',
                     standalone: true,
-                    template: `
-    <div class='grid gap-3 items-stretch'
-    [class.min-[300px]:grid-cols-2]="minWidth2Columns == 300"
-    [class.min-[320px]:grid-cols-2]="minWidth2Columns == 320"
-    [class.min-[340px]:grid-cols-2]="minWidth2Columns == 340"
-    [class.min-[360px]:grid-cols-2]="minWidth2Columns == 360"
-    [class.min-[380px]:grid-cols-2]="minWidth2Columns == 380"
-    [class.min-[400px]:grid-cols-2]="minWidth2Columns == 400"
-    [class.min-[420px]:grid-cols-2]="minWidth2Columns == 420"
-    [class.min-[440px]:grid-cols-2]="minWidth2Columns == 440"
-    [class.min-[460px]:grid-cols-2]="minWidth2Columns == 460">
-      <ng-content></ng-content>
-  </div>
+                    template: `
+    <div class='grid gap-3 items-stretch'
+    [class.min-[300px]:grid-cols-2]="minWidth2Columns == 300"
+    [class.min-[320px]:grid-cols-2]="minWidth2Columns == 320"
+    [class.min-[340px]:grid-cols-2]="minWidth2Columns == 340"
+    [class.min-[360px]:grid-cols-2]="minWidth2Columns == 360"
+    [class.min-[380px]:grid-cols-2]="minWidth2Columns == 380"
+    [class.min-[400px]:grid-cols-2]="minWidth2Columns == 400"
+    [class.min-[420px]:grid-cols-2]="minWidth2Columns == 420"
+    [class.min-[440px]:grid-cols-2]="minWidth2Columns == 440"
+    [class.min-[460px]:grid-cols-2]="minWidth2Columns == 460">
+      <ng-content></ng-content>
+  </div>
   `,
                 }]
         }], propDecorators: { minWidth2Columns: [{
@@ -267,44 +267,44 @@ class SpxCardLineComponent {
         return val || val === 0 ? val : '—';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxCardLineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SpxCardLineComponent, isStandalone: true, selector: "spx-card-line", inputs: { icon: "icon", showPositiveOrNegative: "showPositiveOrNegative", text: "text", value: "value", secondValue: "secondValue", showProgress: "showProgress", unit: "unit", newOrderScreen: "newOrderScreen" }, ngImport: i0, template: `
-<div class="items-center" [class.flex]="!newOrderScreen">
-  <div class="block w-24 text-gray-600 dark:text-gray-200 text-xs mb-1" [class.pt-1]="!newOrderScreen" [innerHTML]="text"></div>
-  <div class="flex">
-    @if (icon) {
-      <fa-icon [icon]="icon" class="text-lg mr-3 w-6 text-center"></fa-icon>
-    }
-    @if (showPositiveOrNegative && numericValue < 0) {
-      <div class="rounded-full w-4 h-4 mr-2 bg-sky-600">&nbsp;</div>
-    }
-    @if (!showProgress) {
-      <span class="block font-medium grow whitespace-pre-line leading-5">
-        <span [innerHTML]="displayValue(value)"></span>
-        <ng-content></ng-content>
-        @if (unit) {
-          <span> {{ unit }}</span>
-        }
-        @if (!unit && secondValue !== null && secondValue !== undefined) {
-          / {{ displayValue(secondValue) }}
-        }
-      </span>
-    }
-  </div>
-  @if (showProgress) {
-    <div class="block font-medium grow whitespace-pre-line text-gray-600 dark:text-gray-200">
-      <div class="flex">
-        <div class="flex grow gap-2">
-          <div class="bg-gray-200 my-0.5 h-5 w-full rounded">
-            <div class="bg-teal-600 h-5 rounded" [style.width]="((+value) / (secondValue ? +secondValue : 0)) * 100 + '%'"></div>
-          </div>
-        </div>
-        <div class="flex text-left pl-3 gap-2">
-          <div class="block w-16 text-right">{{ value }} / {{ secondValue }}</div>
-        </div>
-      </div>
-    </div>
-  }
-</div>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SpxCardLineComponent, isStandalone: true, selector: "spx-card-line", inputs: { icon: "icon", showPositiveOrNegative: "showPositiveOrNegative", text: "text", value: "value", secondValue: "secondValue", showProgress: "showProgress", unit: "unit", newOrderScreen: "newOrderScreen" }, ngImport: i0, template: `
+<div class="items-center" [class.flex]="!newOrderScreen">
+  <div class="block w-24 text-gray-600 dark:text-gray-200 text-xs mb-1" [class.pt-1]="!newOrderScreen" [innerHTML]="text"></div>
+  <div class="flex">
+    @if (icon) {
+      <fa-icon [icon]="icon" class="text-lg mr-3 w-6 text-center"></fa-icon>
+    }
+    @if (showPositiveOrNegative && numericValue < 0) {
+      <div class="rounded-full w-4 h-4 mr-2 bg-sky-600">&nbsp;</div>
+    }
+    @if (!showProgress) {
+      <span class="block font-medium grow whitespace-pre-line leading-5">
+        <span [innerHTML]="displayValue(value)"></span>
+        <ng-content></ng-content>
+        @if (unit) {
+          <span> {{ unit }}</span>
+        }
+        @if (!unit && secondValue !== null && secondValue !== undefined) {
+          / {{ displayValue(secondValue) }}
+        }
+      </span>
+    }
+  </div>
+  @if (showProgress) {
+    <div class="block font-medium grow whitespace-pre-line text-gray-600 dark:text-gray-200">
+      <div class="flex">
+        <div class="flex grow gap-2">
+          <div class="bg-gray-200 my-0.5 h-5 w-full rounded">
+            <div class="bg-teal-600 h-5 rounded" [style.width]="((+value) / (secondValue ? +secondValue : 0)) * 100 + '%'"></div>
+          </div>
+        </div>
+        <div class="flex text-left pl-3 gap-2">
+          <div class="block w-16 text-right">{{ value }} / {{ secondValue }}</div>
+        </div>
+      </div>
+    </div>
+  }
+</div>
 `, isInline: true, dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxCardLineComponent, decorators: [{
@@ -316,44 +316,44 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         FontAwesomeModule,
                         NgClass
                     ],
-                    template: `
-<div class="items-center" [class.flex]="!newOrderScreen">
-  <div class="block w-24 text-gray-600 dark:text-gray-200 text-xs mb-1" [class.pt-1]="!newOrderScreen" [innerHTML]="text"></div>
-  <div class="flex">
-    @if (icon) {
-      <fa-icon [icon]="icon" class="text-lg mr-3 w-6 text-center"></fa-icon>
-    }
-    @if (showPositiveOrNegative && numericValue < 0) {
-      <div class="rounded-full w-4 h-4 mr-2 bg-sky-600">&nbsp;</div>
-    }
-    @if (!showProgress) {
-      <span class="block font-medium grow whitespace-pre-line leading-5">
-        <span [innerHTML]="displayValue(value)"></span>
-        <ng-content></ng-content>
-        @if (unit) {
-          <span> {{ unit }}</span>
-        }
-        @if (!unit && secondValue !== null && secondValue !== undefined) {
-          / {{ displayValue(secondValue) }}
-        }
-      </span>
-    }
-  </div>
-  @if (showProgress) {
-    <div class="block font-medium grow whitespace-pre-line text-gray-600 dark:text-gray-200">
-      <div class="flex">
-        <div class="flex grow gap-2">
-          <div class="bg-gray-200 my-0.5 h-5 w-full rounded">
-            <div class="bg-teal-600 h-5 rounded" [style.width]="((+value) / (secondValue ? +secondValue : 0)) * 100 + '%'"></div>
-          </div>
-        </div>
-        <div class="flex text-left pl-3 gap-2">
-          <div class="block w-16 text-right">{{ value }} / {{ secondValue }}</div>
-        </div>
-      </div>
-    </div>
-  }
-</div>
+                    template: `
+<div class="items-center" [class.flex]="!newOrderScreen">
+  <div class="block w-24 text-gray-600 dark:text-gray-200 text-xs mb-1" [class.pt-1]="!newOrderScreen" [innerHTML]="text"></div>
+  <div class="flex">
+    @if (icon) {
+      <fa-icon [icon]="icon" class="text-lg mr-3 w-6 text-center"></fa-icon>
+    }
+    @if (showPositiveOrNegative && numericValue < 0) {
+      <div class="rounded-full w-4 h-4 mr-2 bg-sky-600">&nbsp;</div>
+    }
+    @if (!showProgress) {
+      <span class="block font-medium grow whitespace-pre-line leading-5">
+        <span [innerHTML]="displayValue(value)"></span>
+        <ng-content></ng-content>
+        @if (unit) {
+          <span> {{ unit }}</span>
+        }
+        @if (!unit && secondValue !== null && secondValue !== undefined) {
+          / {{ displayValue(secondValue) }}
+        }
+      </span>
+    }
+  </div>
+  @if (showProgress) {
+    <div class="block font-medium grow whitespace-pre-line text-gray-600 dark:text-gray-200">
+      <div class="flex">
+        <div class="flex grow gap-2">
+          <div class="bg-gray-200 my-0.5 h-5 w-full rounded">
+            <div class="bg-teal-600 h-5 rounded" [style.width]="((+value) / (secondValue ? +secondValue : 0)) * 100 + '%'"></div>
+          </div>
+        </div>
+        <div class="flex text-left pl-3 gap-2">
+          <div class="block w-16 text-right">{{ value }} / {{ secondValue }}</div>
+        </div>
+      </div>
+    </div>
+  }
+</div>
 `,
                 }]
         }], ctorParameters: () => [], propDecorators: { icon: [{

package/fesm2022/softpak-components-spx-card.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"softpak-components-spx-card.mjs","sources":["../../../../projects/softpak/components/spx-card/spx-card.component.ts","../../../../projects/softpak/components/spx-card/spx-card-item.component.ts","../../../../projects/softpak/components/spx-card/spx-card-grid.component.ts","../../../../projects/softpak/components/spx-card/spx-card-line.component.ts","../../../../projects/softpak/components/spx-card/softpak-components-spx-card.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\r\nimport { Component, EventEmitter, Input, Output } from '@angular/core';\r\n\r\n@Component({\r\n  selector: 'spx-card',\r\n  standalone: true,\r\n  imports: [\r\n    NgClass\r\n],\r\n  template: `\r\n  <button type=\"button\"\r\n    class=\"block w-full text-left rounded font-body items-stretch\"\r\n    [class.flex]=\"tableView\"\r\n    [class.cursor-pointer]=\"clickable\"\r\n    [class.cursor-not-allowed]=\"!clickable\"\r\n    [class.focus:ring-2]=\"clickable\"\r\n    [class.focus:ring-offset-2]=\"clickable\"\r\n    [class.focus:ring-blue-500]=\"clickable\"\r\n    (click)=\"onClick()\"\r\n    [tabIndex]=\"clickable ? 0 : -1\">\r\n    <div class=\"text-gray-900 opacity-90\" [class.w-96]=\"tableView\">\r\n      <ng-content select=\"[card-header]\"></ng-content>\r\n    </div>\r\n    <ng-content select=\"[card-content-top]\"></ng-content>\r\n    @if (hasContent) {\r\n      <div class=\"bg-white dark:bg-gray-600 p-3\">\r\n        <ng-content select=\"[card-content]\"></ng-content>\r\n      </div>\r\n    }\r\n    <ng-content select=\"[card-content-bottom]\"></ng-content>\r\n    <div class=\"bg-gray-50 dark:bg-gray-700 p-3 grow\" [class.rounded-b-lg]=\"!onDetailPage && !tableView\" [class.rounded-r-lg]=\"!onDetailPage && tableView\">\r\n      <ng-content select=\"[card-lines]\"></ng-content>\r\n    </div>\r\n  </button>\r\n  `,\r\n})\r\nexport class SpxCardComponent {\r\n  @Input() clickable = true;\r\n  @Input() hasContent = true;\r\n  @Input() onDetailPage = false;\r\n  @Input() text!: string;\r\n  @Input() unit?: string;\r\n  @Input() tableView = false;\r\n  @Output() clicked: EventEmitter<void> = new EventEmitter<void>();\r\n\r\n  constructor() { }\r\n\r\n  displayValue(val: string | number): string | number {\r\n    return val || (val === 0) ? val : '—';\r\n  }\r\n\r\n  onClick(): void {\r\n    this.clicked.emit();\r\n  }\r\n}\r\n","\r\nimport { Component, HostBinding, Input } from '@angular/core';\r\nimport { FaIconComponent } from '@fortawesome/angular-fontawesome';\r\nimport { IconProp } from '@fortawesome/angular-fontawesome/types';\r\nimport { SpxSeverityEnum } from '@softpak/components/spx-helpers';\r\n\r\n@Component({\r\n  selector: 'spx-card-item',\r\n  standalone: true,\r\n  imports: [\r\n    FaIconComponent\r\n],\r\n  template: `\r\n    <div class='py-2 px-3 rounded h-full'\r\n      [class.bg-slate-100]=\"!spxSeverity\"\r\n      [class.dark:bg-slate-600]=\"!spxSeverity\"\r\n      [class.text-black]=\"spxSeverityWarning\"\r\n      [class.text-white]=\"spxSeverityError || spxSeverityInfo || spxSeveritySuccess || spxSeverityUnknown\"\r\n      [class.bg-red-700]=\"spxSeverityError\"\r\n      [class.bg-green-700]=\"spxSeveritySuccess\"\r\n      [class.bg-blue-700]=\"spxSeverityInfo\"\r\n      [class.bg-gray-400]=\"spxSeverityUnknown\"\r\n      [class.bg-amber-700]=\"spxSeverityWarning\">\r\n      <div class=\"font-small leading-normal\">{{ spxLabel }}</div>\r\n      <div class=\"flex gap-4 text-lg leading-normal py-1\">\r\n        @if (icon) {\r\n          <div class=\"font-bold text-center leading-normal max-w-12 min-w-12\" [class.grow]=\"iconOnly\">\r\n            <div\r\n              class=\"px-3 py-1 text-white rounded\"\r\n              [class.bg-black]=\"!spxIconSeverity\"\r\n              [class.bg-red-700]=\"spxIconSeverityError\"\r\n              [class.bg-green-700]=\"spxIconSeveritySuccess\"\r\n              [class.bg-blue-700]=\"spxIconSeverityInfo\"\r\n              [class.bg-gray-400]=\"spxIconSeverityUnknown\"\r\n              [class.bg-amber-700]=\"spxIconSeverityWarning\">\r\n              <fa-icon [icon]=\"icon\"></fa-icon>\r\n            </div>\r\n          </div>\r\n        }\r\n        <div class=\"grow font-bold\">\r\n          @if (!iconOnly) {\r\n            <ng-content></ng-content><div [innerHTML]=\"spxValue\"></div>\r\n          }\r\n        </div>\r\n      </div>\r\n    </div>\r\n    `,\r\n})\r\nexport class SpxCardItemComponent {\r\n  @HostBinding('class.h-full') hFull = true;\r\n  @Input() icon?: IconProp;\r\n  @Input() iconOnly = false;\r\n  @Input() spxLabel!: string;\r\n  @Input() spxValue!: string;\r\n  @Input() spxSeverity?: SpxSeverityEnum;\r\n  @Input() spxIconSeverity?: SpxSeverityEnum;\r\n  get spxSeverityError() { return this.spxSeverity === SpxSeverityEnum.error; }\r\n  get spxSeverityInfo() { return this.spxSeverity === SpxSeverityEnum.info; }\r\n  get spxSeveritySuccess() { return this.spxSeverity === SpxSeverityEnum.success; }\r\n  get spxSeverityUnknown() { return this.spxSeverity === SpxSeverityEnum.unknown; }\r\n  get spxSeverityWarning() { return this.spxSeverity === SpxSeverityEnum.warning; }\r\n  get spxIconSeverityError() { return this.spxIconSeverity === SpxSeverityEnum.error; }\r\n  get spxIconSeverityInfo() { return this.spxIconSeverity === SpxSeverityEnum.info; }\r\n  get spxIconSeveritySuccess() { return this.spxIconSeverity === SpxSeverityEnum.success; }\r\n  get spxIconSeverityUnknown() { return this.spxIconSeverity === SpxSeverityEnum.unknown; }\r\n  get spxIconSeverityWarning() { return this.spxIconSeverity === SpxSeverityEnum.warning; }\r\n}\r\n","import { Component, Input } from '@angular/core';\r\n\r\n@Component({\r\n  selector: 'spx-card-grid',\r\n  standalone: true,\r\n  template: `\r\n    <div class='grid gap-3 items-stretch'\r\n    [class.min-[300px]:grid-cols-2]=\"minWidth2Columns == 300\"\r\n    [class.min-[320px]:grid-cols-2]=\"minWidth2Columns == 320\"\r\n    [class.min-[340px]:grid-cols-2]=\"minWidth2Columns == 340\"\r\n    [class.min-[360px]:grid-cols-2]=\"minWidth2Columns == 360\"\r\n    [class.min-[380px]:grid-cols-2]=\"minWidth2Columns == 380\"\r\n    [class.min-[400px]:grid-cols-2]=\"minWidth2Columns == 400\"\r\n    [class.min-[420px]:grid-cols-2]=\"minWidth2Columns == 420\"\r\n    [class.min-[440px]:grid-cols-2]=\"minWidth2Columns == 440\"\r\n    [class.min-[460px]:grid-cols-2]=\"minWidth2Columns == 460\">\r\n      <ng-content></ng-content>\r\n  </div>\r\n  `,\r\n})\r\nexport class SpxCardGridComponent {\r\n  @Input() minWidth2Columns?: 300 | 320 | 340 | 360 | 380 | 400 | 420 | 440 | 460 = 460;\r\n}\r\n","import { NgClass } from '@angular/common';\r\nimport { Component, Input } from '@angular/core';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { IconProp } from '@fortawesome/angular-fontawesome/types';\r\n\r\n@Component({\r\n  selector: 'spx-card-line',\r\n  standalone: true,\r\n  imports: [\r\n    FontAwesomeModule,\r\n    NgClass\r\n],\r\n  template: `\r\n<div class=\"items-center\" [class.flex]=\"!newOrderScreen\">\r\n  <div class=\"block w-24 text-gray-600 dark:text-gray-200 text-xs mb-1\" [class.pt-1]=\"!newOrderScreen\" [innerHTML]=\"text\"></div>\r\n  <div class=\"flex\">\r\n    @if (icon) {\r\n      <fa-icon [icon]=\"icon\" class=\"text-lg mr-3 w-6 text-center\"></fa-icon>\r\n    }\r\n    @if (showPositiveOrNegative && numericValue < 0) {\r\n      <div class=\"rounded-full w-4 h-4 mr-2 bg-sky-600\">&nbsp;</div>\r\n    }\r\n    @if (!showProgress) {\r\n      <span class=\"block font-medium grow whitespace-pre-line leading-5\">\r\n        <span [innerHTML]=\"displayValue(value)\"></span>\r\n        <ng-content></ng-content>\r\n        @if (unit) {\r\n          <span> {{ unit }}</span>\r\n        }\r\n        @if (!unit && secondValue !== null && secondValue !== undefined) {\r\n          / {{ displayValue(secondValue) }}\r\n        }\r\n      </span>\r\n    }\r\n  </div>\r\n  @if (showProgress) {\r\n    <div class=\"block font-medium grow whitespace-pre-line text-gray-600 dark:text-gray-200\">\r\n      <div class=\"flex\">\r\n        <div class=\"flex grow gap-2\">\r\n          <div class=\"bg-gray-200 my-0.5 h-5 w-full rounded\">\r\n            <div class=\"bg-teal-600 h-5 rounded\" [style.width]=\"((+value) / (secondValue ? +secondValue : 0)) * 100 + '%'\"></div>\r\n          </div>\r\n        </div>\r\n        <div class=\"flex text-left pl-3 gap-2\">\r\n          <div class=\"block w-16 text-right\">{{ value }} / {{ secondValue }}</div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  }\r\n</div>\r\n`,\r\n})\r\nexport class SpxCardLineComponent {\r\n  @Input() icon?: IconProp;\r\n  @Input() showPositiveOrNegative = false;\r\n  @Input() text: string | unknown;\r\n  @Input() value!: string | number;\r\n  @Input() secondValue?: string | number;\r\n  @Input() showProgress?: boolean;\r\n  @Input() unit?: string;\r\n  @Input() newOrderScreen = false;\r\n\r\n  get numericValue() {\r\n    return this.value as number;\r\n  }\r\n\r\n  constructor() { }\r\n\r\n  public displayValue(val: string | number | unknown): string | number | unknown {\r\n    return val || val === 0 ? val : '—';\r\n  }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"softpak-components-spx-card.mjs","sources":["../../../../projects/softpak/components/spx-card/spx-card.component.ts","../../../../projects/softpak/components/spx-card/spx-card-item.component.ts","../../../../projects/softpak/components/spx-card/spx-card-grid.component.ts","../../../../projects/softpak/components/spx-card/spx-card-line.component.ts","../../../../projects/softpak/components/spx-card/softpak-components-spx-card.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\nimport { Component, EventEmitter, Input, Output } from '@angular/core';\n\n@Component({\n  selector: 'spx-card',\n  standalone: true,\n  imports: [\n    NgClass\n],\n  template: `\n  <button type=\"button\"\n    class=\"block w-full text-left rounded font-body items-stretch\"\n    [class.flex]=\"tableView\"\n    [class.cursor-pointer]=\"clickable\"\n    [class.cursor-not-allowed]=\"!clickable\"\n    [class.focus:ring-2]=\"clickable\"\n    [class.focus:ring-offset-2]=\"clickable\"\n    [class.focus:ring-blue-500]=\"clickable\"\n    (click)=\"onClick()\"\n    [tabIndex]=\"clickable ? 0 : -1\">\n    <div class=\"text-gray-900 opacity-90\" [class.w-96]=\"tableView\">\n      <ng-content select=\"[card-header]\"></ng-content>\n    </div>\n    <ng-content select=\"[card-content-top]\"></ng-content>\n    @if (hasContent) {\n      <div class=\"bg-white dark:bg-gray-600 p-3\">\n        <ng-content select=\"[card-content]\"></ng-content>\n      </div>\n    }\n    <ng-content select=\"[card-content-bottom]\"></ng-content>\n    <div class=\"bg-gray-50 dark:bg-gray-700 p-3 grow\" [class.rounded-b-lg]=\"!onDetailPage && !tableView\" [class.rounded-r-lg]=\"!onDetailPage && tableView\">\n      <ng-content select=\"[card-lines]\"></ng-content>\n    </div>\n  </button>\n  `,\n})\nexport class SpxCardComponent {\n  @Input() clickable = true;\n  @Input() hasContent = true;\n  @Input() onDetailPage = false;\n  @Input() text!: string;\n  @Input() unit?: string;\n  @Input() tableView = false;\n  @Output() clicked: EventEmitter<void> = new EventEmitter<void>();\n\n  constructor() { }\n\n  displayValue(val: string | number): string | number {\n    return val || (val === 0) ? val : '—';\n  }\n\n  onClick(): void {\n    this.clicked.emit();\n  }\n}\n","\nimport { Component, HostBinding, Input } from '@angular/core';\nimport { FaIconComponent } from '@fortawesome/angular-fontawesome';\nimport { IconProp } from '@fortawesome/angular-fontawesome/types';\nimport { SpxSeverityEnum } from '@softpak/components/spx-helpers';\n\n@Component({\n  selector: 'spx-card-item',\n  standalone: true,\n  imports: [\n    FaIconComponent\n],\n  template: `\n    <div class='py-2 px-3 rounded h-full'\n      [class.bg-slate-100]=\"!spxSeverity\"\n      [class.dark:bg-slate-600]=\"!spxSeverity\"\n      [class.text-black]=\"spxSeverityWarning\"\n      [class.text-white]=\"spxSeverityError || spxSeverityInfo || spxSeveritySuccess || spxSeverityUnknown\"\n      [class.bg-red-700]=\"spxSeverityError\"\n      [class.bg-green-700]=\"spxSeveritySuccess\"\n      [class.bg-blue-700]=\"spxSeverityInfo\"\n      [class.bg-gray-400]=\"spxSeverityUnknown\"\n      [class.bg-amber-700]=\"spxSeverityWarning\">\n      <div class=\"font-small leading-normal\">{{ spxLabel }}</div>\n      <div class=\"flex gap-4 text-lg leading-normal py-1\">\n        @if (icon) {\n          <div class=\"font-bold text-center leading-normal max-w-12 min-w-12\" [class.grow]=\"iconOnly\">\n            <div\n              class=\"px-3 py-1 text-white rounded\"\n              [class.bg-black]=\"!spxIconSeverity\"\n              [class.bg-red-700]=\"spxIconSeverityError\"\n              [class.bg-green-700]=\"spxIconSeveritySuccess\"\n              [class.bg-blue-700]=\"spxIconSeverityInfo\"\n              [class.bg-gray-400]=\"spxIconSeverityUnknown\"\n              [class.bg-amber-700]=\"spxIconSeverityWarning\">\n              <fa-icon [icon]=\"icon\"></fa-icon>\n            </div>\n          </div>\n        }\n        <div class=\"grow font-bold\">\n          @if (!iconOnly) {\n            <ng-content></ng-content><div [innerHTML]=\"spxValue\"></div>\n          }\n        </div>\n      </div>\n    </div>\n    `,\n})\nexport class SpxCardItemComponent {\n  @HostBinding('class.h-full') hFull = true;\n  @Input() icon?: IconProp;\n  @Input() iconOnly = false;\n  @Input() spxLabel!: string;\n  @Input() spxValue!: string;\n  @Input() spxSeverity?: SpxSeverityEnum;\n  @Input() spxIconSeverity?: SpxSeverityEnum;\n  get spxSeverityError() { return this.spxSeverity === SpxSeverityEnum.error; }\n  get spxSeverityInfo() { return this.spxSeverity === SpxSeverityEnum.info; }\n  get spxSeveritySuccess() { return this.spxSeverity === SpxSeverityEnum.success; }\n  get spxSeverityUnknown() { return this.spxSeverity === SpxSeverityEnum.unknown; }\n  get spxSeverityWarning() { return this.spxSeverity === SpxSeverityEnum.warning; }\n  get spxIconSeverityError() { return this.spxIconSeverity === SpxSeverityEnum.error; }\n  get spxIconSeverityInfo() { return this.spxIconSeverity === SpxSeverityEnum.info; }\n  get spxIconSeveritySuccess() { return this.spxIconSeverity === SpxSeverityEnum.success; }\n  get spxIconSeverityUnknown() { return this.spxIconSeverity === SpxSeverityEnum.unknown; }\n  get spxIconSeverityWarning() { return this.spxIconSeverity === SpxSeverityEnum.warning; }\n}\n","import { Component, Input } from '@angular/core';\n\n@Component({\n  selector: 'spx-card-grid',\n  standalone: true,\n  template: `\n    <div class='grid gap-3 items-stretch'\n    [class.min-[300px]:grid-cols-2]=\"minWidth2Columns == 300\"\n    [class.min-[320px]:grid-cols-2]=\"minWidth2Columns == 320\"\n    [class.min-[340px]:grid-cols-2]=\"minWidth2Columns == 340\"\n    [class.min-[360px]:grid-cols-2]=\"minWidth2Columns == 360\"\n    [class.min-[380px]:grid-cols-2]=\"minWidth2Columns == 380\"\n    [class.min-[400px]:grid-cols-2]=\"minWidth2Columns == 400\"\n    [class.min-[420px]:grid-cols-2]=\"minWidth2Columns == 420\"\n    [class.min-[440px]:grid-cols-2]=\"minWidth2Columns == 440\"\n    [class.min-[460px]:grid-cols-2]=\"minWidth2Columns == 460\">\n      <ng-content></ng-content>\n  </div>\n  `,\n})\nexport class SpxCardGridComponent {\n  @Input() minWidth2Columns?: 300 | 320 | 340 | 360 | 380 | 400 | 420 | 440 | 460 = 460;\n}\n","import { NgClass } from '@angular/common';\nimport { Component, Input } from '@angular/core';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\nimport { IconProp } from '@fortawesome/angular-fontawesome/types';\n\n@Component({\n  selector: 'spx-card-line',\n  standalone: true,\n  imports: [\n    FontAwesomeModule,\n    NgClass\n],\n  template: `\n<div class=\"items-center\" [class.flex]=\"!newOrderScreen\">\n  <div class=\"block w-24 text-gray-600 dark:text-gray-200 text-xs mb-1\" [class.pt-1]=\"!newOrderScreen\" [innerHTML]=\"text\"></div>\n  <div class=\"flex\">\n    @if (icon) {\n      <fa-icon [icon]=\"icon\" class=\"text-lg mr-3 w-6 text-center\"></fa-icon>\n    }\n    @if (showPositiveOrNegative && numericValue < 0) {\n      <div class=\"rounded-full w-4 h-4 mr-2 bg-sky-600\">&nbsp;</div>\n    }\n    @if (!showProgress) {\n      <span class=\"block font-medium grow whitespace-pre-line leading-5\">\n        <span [innerHTML]=\"displayValue(value)\"></span>\n        <ng-content></ng-content>\n        @if (unit) {\n          <span> {{ unit }}</span>\n        }\n        @if (!unit && secondValue !== null && secondValue !== undefined) {\n          / {{ displayValue(secondValue) }}\n        }\n      </span>\n    }\n  </div>\n  @if (showProgress) {\n    <div class=\"block font-medium grow whitespace-pre-line text-gray-600 dark:text-gray-200\">\n      <div class=\"flex\">\n        <div class=\"flex grow gap-2\">\n          <div class=\"bg-gray-200 my-0.5 h-5 w-full rounded\">\n            <div class=\"bg-teal-600 h-5 rounded\" [style.width]=\"((+value) / (secondValue ? +secondValue : 0)) * 100 + '%'\"></div>\n          </div>\n        </div>\n        <div class=\"flex text-left pl-3 gap-2\">\n          <div class=\"block w-16 text-right\">{{ value }} / {{ secondValue }}</div>\n        </div>\n      </div>\n    </div>\n  }\n</div>\n`,\n})\nexport class SpxCardLineComponent {\n  @Input() icon?: IconProp;\n  @Input() showPositiveOrNegative = false;\n  @Input() text: string | unknown;\n  @Input() value!: string | number;\n  @Input() secondValue?: string | number;\n  @Input() showProgress?: boolean;\n  @Input() unit?: string;\n  @Input() newOrderScreen = false;\n\n  get numericValue() {\n    return this.value as number;\n  }\n\n  constructor() { }\n\n  public displayValue(val: string | number | unknown): string | number | unknown {\n    return val || val === 0 ? val : '—';\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/softpak-components-spx-change-details.mjs

@@ -152,7 +152,7 @@ class SpxChangeDetailsComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxChangeDetailsComponent, deps: [{ token: i1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SpxChangeDetailsComponent, isStandalone: true, selector: "spx-change-details", inputs: { formGroup: "formGroup", suggestions: "suggestions", textCategory: "textCategory", textContainerNumber: "textContainerNumber", textContainerType: "textContainerType", textCustomer: "textCustomer", textLicensePlate: "textLicensePlate", textSave: "textSave", textTonsTested: "textTonsTested" }, outputs: { spxBlurCategory: "spxBlurCategory", spxBlurContainerType: "spxBlurContainerType", spxSearchCategory: "spxSearchCategory", spxSearchContainerType: "spxSearchContainerType", spxSearchTonsTested: "spxSearchTonsTested", submit: "submit" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\" class=\"max-w-lg mx-auto flex flex-col gap-3\" (ngSubmit)=\"onSubmit()\">\r\n  <spx-form-view\r\n    [spxFormGroup]=\"formGroup\"\r\n    [spxForm]=\"form\"\r\n    [spxSuggestions]=\"suggestions\"\r\n    (spxBlur)=\"onBlur($event)\"\r\n    (spxSearch)=\"onSearch($event)\">\r\n  </spx-form-view>\r\n</form>", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: SpxFormViewComponent, selector: "spx-form-view", inputs: ["spxFormGroup", "spxForm", "spxSuggestions"], outputs: ["spxBlur", "spxClick", "spxSearch"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SpxChangeDetailsComponent, isStandalone: true, selector: "spx-change-details", inputs: { formGroup: "formGroup", suggestions: "suggestions", textCategory: "textCategory", textContainerNumber: "textContainerNumber", textContainerType: "textContainerType", textCustomer: "textCustomer", textLicensePlate: "textLicensePlate", textSave: "textSave", textTonsTested: "textTonsTested" }, outputs: { spxBlurCategory: "spxBlurCategory", spxBlurContainerType: "spxBlurContainerType", spxSearchCategory: "spxSearchCategory", spxSearchContainerType: "spxSearchContainerType", spxSearchTonsTested: "spxSearchTonsTested", submit: "submit" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\" class=\"max-w-lg mx-auto flex flex-col gap-3\" (ngSubmit)=\"onSubmit()\">\n  <spx-form-view\n    [spxFormGroup]=\"formGroup\"\n    [spxForm]=\"form\"\n    [spxSuggestions]=\"suggestions\"\n    (spxBlur)=\"onBlur($event)\"\n    (spxSearch)=\"onSearch($event)\">\n  </spx-form-view>\n</form>", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: SpxFormViewComponent, selector: "spx-form-view", inputs: ["spxFormGroup", "spxForm", "spxSuggestions"], outputs: ["spxBlur", "spxClick", "spxSearch"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SpxChangeDetailsComponent, decorators: [{
             type: Component,
@@ -163,7 +163,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         SpxFormViewComponent,
                         SpxInputComponent,
                         SpxValidateControlComponent
-                    ], template: "<form [formGroup]=\"formGroup\" class=\"max-w-lg mx-auto flex flex-col gap-3\" (ngSubmit)=\"onSubmit()\">\r\n  <spx-form-view\r\n    [spxFormGroup]=\"formGroup\"\r\n    [spxForm]=\"form\"\r\n    [spxSuggestions]=\"suggestions\"\r\n    (spxBlur)=\"onBlur($event)\"\r\n    (spxSearch)=\"onSearch($event)\">\r\n  </spx-form-view>\r\n</form>" }]
+                    ], template: "<form [formGroup]=\"formGroup\" class=\"max-w-lg mx-auto flex flex-col gap-3\" (ngSubmit)=\"onSubmit()\">\n  <spx-form-view\n    [spxFormGroup]=\"formGroup\"\n    [spxForm]=\"form\"\n    [spxSuggestions]=\"suggestions\"\n    (spxBlur)=\"onBlur($event)\"\n    (spxSearch)=\"onSearch($event)\">\n  </spx-form-view>\n</form>" }]
         }], ctorParameters: () => [{ type: i1.FormBuilder }], propDecorators: { formGroup: [{
                 type: Input
             }], suggestions: [{