diff --git a/lib/content-services/src/lib/content-metadata/services/property-groups-translator.service.spec.ts b/lib/content-services/src/lib/content-metadata/services/property-groups-translator.service.spec.ts
index 7d1756ab69..b3d1ffc327 100644
--- a/lib/content-services/src/lib/content-metadata/services/property-groups-translator.service.spec.ts
+++ b/lib/content-services/src/lib/content-metadata/services/property-groups-translator.service.spec.ts
@@ -28,8 +28,8 @@ import {
     CardViewBoolItemModel,
     CardViewDatetimeItemModel,
     CardViewSelectItemModel,
-    CardViewSelectItemProperties,
-    LogService
+    LogService,
+    CardViewLongItemModel
 } from '@alfresco/adf-core';
 import { ContentTestingModule } from '../../testing/content.testing.module';
 import { Constraint, Definition, Property as PropertyBase } from '@alfresco/js-api';
@@ -171,7 +171,7 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': 'The Chariot Line' };
 
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
-            const cardViewProperty: CardViewTextItemModel = cardViewGroup[0].properties[0] as CardViewTextItemModel;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewTextItemModel).toBeTruthy();
         });
 
@@ -189,7 +189,7 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAKE:NAME': 'API Fake response' };
 
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
-            const cardViewProperty: CardViewTextItemModel = cardViewGroup[0].properties[0] as CardViewTextItemModel;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewTextItemModel).toBeTruthy();
             expect(cardViewProperty.editable).toBe(false);
         });
@@ -224,10 +224,10 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': 'The Chariot Line' };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
 
-            const cardViewProperty: CardViewTextItemModel = cardViewGroup[0].properties[0] as CardViewTextItemModel;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewTextItemModel).toBeTruthy();
             expect(cardViewProperty.value).toBe('The Chariot Line');
-            expect(cardViewProperty.multiline).toBeFalsy();
+            expect((cardViewProperty as CardViewTextItemModel).multiline).toBeFalsy();
         });
 
         it('should translate properly the multiline and value attributes for d:mltext', () => {
@@ -236,10 +236,10 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': 'The Chariot Line' };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
 
-            const cardViewProperty: CardViewTextItemModel = cardViewGroup[0].properties[0] as CardViewTextItemModel;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewTextItemModel).toBeTruthy();
             expect(cardViewProperty.value).toBe('The Chariot Line');
-            expect(cardViewProperty.multiline).toBeTruthy();
+            expect((cardViewProperty as CardViewTextItemModel).multiline).toBeTruthy();
         });
 
         it('should translate properly the value attribute for d:date', () => {
@@ -249,7 +249,7 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': expectedValue };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
 
-            const cardViewProperty: CardViewDateItemModel = cardViewGroup[0].properties[0] as CardViewDateItemModel;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewDateItemModel).toBeTruthy();
             expect(cardViewProperty.value).toBe(expectedValue);
         });
@@ -261,7 +261,7 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': expectedValue };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
 
-            const cardViewProperty: CardViewDatetimeItemModel = cardViewGroup[0].properties[0] as CardViewDatetimeItemModel;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewDatetimeItemModel).toBeTruthy();
             expect(cardViewProperty.value).toBe(expectedValue);
         });
@@ -272,7 +272,7 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': '1024' };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
 
-            const cardViewProperty: CardViewIntItemModel = cardViewGroup[0].properties[0] as CardViewIntItemModel;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewIntItemModel).toBeTruthy();
             expect(cardViewProperty.value).toBe(1024);
         });
@@ -283,7 +283,7 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': 0 };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
 
-            const cardViewProperty: CardViewIntItemModel = cardViewGroup[0].properties[0] as CardViewIntItemModel;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewIntItemModel).toBeTruthy();
             expect(cardViewProperty.value).toBe(0);
         });
@@ -294,8 +294,8 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': '1024' };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
 
-            const cardViewProperty: CardViewIntItemModel = cardViewGroup[0].properties[0] as CardViewIntItemModel;
-            expect(cardViewProperty instanceof CardViewIntItemModel).toBeTruthy();
+            const cardViewProperty = cardViewGroup[0].properties[0];
+            expect(cardViewProperty instanceof CardViewLongItemModel).toBeTruthy();
             expect(cardViewProperty.value).toBe(1024);
         });
 
@@ -305,7 +305,7 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': '1024.24' };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
 
-            const cardViewProperty: CardViewFloatItemModel = cardViewGroup[0].properties[0] as CardViewFloatItemModel;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewFloatItemModel).toBeTruthy();
             expect(cardViewProperty.value).toBe(1024.24);
         });
@@ -316,7 +316,7 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': 0 };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
 
-            const cardViewProperty: CardViewFloatItemModel = cardViewGroup[0].properties[0] as CardViewFloatItemModel;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewFloatItemModel).toBeTruthy();
             expect(cardViewProperty.value).toBe(0);
         });
@@ -327,8 +327,8 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': '1024.24' };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
 
-            const cardViewProperty: CardViewFloatItemModel = cardViewGroup[0].properties[0] as CardViewFloatItemModel;
-            expect(cardViewProperty instanceof CardViewFloatItemModel).toBeTruthy();
+            const cardViewProperty = cardViewGroup[0].properties[0];
+            expect(cardViewProperty instanceof CardViewFloatItemModel).toBeTrue();
             expect(cardViewProperty.value).toBe(1024.24);
         });
 
@@ -338,7 +338,7 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': true };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
 
-            const cardViewProperty: CardViewBoolItemModel = cardViewGroup[0].properties[0] as CardViewBoolItemModel;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewBoolItemModel).toBeTruthy();
             expect(cardViewProperty.value).toBe(true);
         });
@@ -363,7 +363,7 @@ describe('PropertyGroupTranslatorService', () => {
             propertyValues = { 'FAS:PLAGUE': 'two' };
             const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, definition);
 
-            const cardViewProperty = cardViewGroup[0].properties[0] as CardViewSelectItemModel<CardViewSelectItemProperties<string>>;
+            const cardViewProperty = cardViewGroup[0].properties[0];
             expect(cardViewProperty instanceof CardViewSelectItemModel).toBeTruthy();
             expect(cardViewProperty.value).toBe('two');
         });
@@ -428,5 +428,27 @@ describe('PropertyGroupTranslatorService', () => {
             expect(cardViewProperty.key).toBe('properties.fk:emperor');
             expect(cardViewProperty.editable).toBe(false);
         });
+
+        it('should translate properly the value attribute for d:long', () => {
+            property.dataType = 'd:long';
+
+            propertyValues = { 'FAS:PLAGUE': '1024' };
+            const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
+
+            const cardViewProperty = cardViewGroup[0].properties[0];
+            expect(cardViewProperty instanceof CardViewLongItemModel).toBeTruthy();
+            expect(cardViewProperty.value).toBe(1024);
+        });
+
+        it('should translate properly the value attribute for d:long and value is 0', () => {
+            property.dataType = 'd:long';
+
+            propertyValues = { 'FAS:PLAGUE': 0 };
+            const cardViewGroup = service.translateToCardViewGroups(propertyGroups, propertyValues, null);
+
+            const cardViewProperty = cardViewGroup[0].properties[0];
+            expect(cardViewProperty instanceof CardViewLongItemModel).toBeTruthy();
+            expect(cardViewProperty.value).toBe(0);
+        });
     });
 });
diff --git a/lib/content-services/src/lib/content-metadata/services/property-groups-translator.service.ts b/lib/content-services/src/lib/content-metadata/services/property-groups-translator.service.ts
index ec8a389a69..744be1cae0 100644
--- a/lib/content-services/src/lib/content-metadata/services/property-groups-translator.service.ts
+++ b/lib/content-services/src/lib/content-metadata/services/property-groups-translator.service.ts
@@ -25,6 +25,7 @@ import {
     CardViewSelectItemModel,
     CardViewDatetimeItemModel,
     CardViewIntItemModel,
+    CardViewLongItemModel,
     CardViewFloatItemModel,
     MultiValuePipe,
     AppConfigService,
@@ -53,10 +54,12 @@ export const RECOGNISED_ECM_TYPES = [D_TEXT, D_MLTEXT, D_DATE, D_DATETIME, D_INT
 export class PropertyGroupTranslatorService {
     valueSeparator: string;
 
-    constructor(private multiValuePipe: MultiValuePipe,
-                private decimalNumberPipe: DecimalNumberPipe,
-                private appConfig: AppConfigService,
-                private logService: LogService) {
+    constructor(
+        private multiValuePipe: MultiValuePipe,
+        private decimalNumberPipe: DecimalNumberPipe,
+        private appConfig: AppConfigService,
+        private logService: LogService
+    ) {
         this.valueSeparator = this.appConfig.get<string>('content-metadata.multi-value-pipe-separator');
     }
 
@@ -123,42 +126,57 @@ export class PropertyGroupTranslatorService {
         } else {
             switch (dataType) {
                 case D_MLTEXT:
-                    cardViewItemProperty = new CardViewTextItemModel(Object.assign(propertyDefinition, {
-                        multiline: true
-                    }));
+                    cardViewItemProperty = new CardViewTextItemModel(
+                        Object.assign(propertyDefinition, {
+                            multiline: true
+                        })
+                    );
                     break;
 
                 case D_INT:
+                    cardViewItemProperty = new CardViewIntItemModel(
+                        Object.assign(propertyDefinition, {
+                            multivalued: isMultiValued,
+                            pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
+                        })
+                    );
+                    break;
+
                 case D_LONG:
-                    cardViewItemProperty = new CardViewIntItemModel(Object.assign(propertyDefinition, {
-                        multivalued: isMultiValued,
-                        pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
-                    }));
+                    cardViewItemProperty = new CardViewLongItemModel(
+                        Object.assign(propertyDefinition, {
+                            multivalued: isMultiValued,
+                            pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
+                        })
+                    );
                     break;
 
                 case D_FLOAT:
                 case D_DOUBLE:
-                    cardViewItemProperty = new CardViewFloatItemModel(Object.assign(propertyDefinition, {
-                        multivalued: isMultiValued,
-                        pipes: [
-                            { pipe: this.decimalNumberPipe },
-                            { pipe: this.multiValuePipe, params: [this.valueSeparator] }
-                        ]
-                    }));
+                    cardViewItemProperty = new CardViewFloatItemModel(
+                        Object.assign(propertyDefinition, {
+                            multivalued: isMultiValued,
+                            pipes: [{ pipe: this.decimalNumberPipe }, { pipe: this.multiValuePipe, params: [this.valueSeparator] }]
+                        })
+                    );
                     break;
 
                 case D_DATE:
-                    cardViewItemProperty = new CardViewDateItemModel(Object.assign(propertyDefinition, {
-                        multivalued: isMultiValued,
-                        pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
-                    }));
+                    cardViewItemProperty = new CardViewDateItemModel(
+                        Object.assign(propertyDefinition, {
+                            multivalued: isMultiValued,
+                            pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
+                        })
+                    );
                     break;
 
                 case D_DATETIME:
-                    cardViewItemProperty = new CardViewDatetimeItemModel(Object.assign(propertyDefinition, {
-                        multivalued: isMultiValued,
-                        pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
-                    }));
+                    cardViewItemProperty = new CardViewDatetimeItemModel(
+                        Object.assign(propertyDefinition, {
+                            multivalued: isMultiValued,
+                            pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
+                        })
+                    );
                     break;
 
                 case D_BOOLEAN:
@@ -167,11 +185,13 @@ export class PropertyGroupTranslatorService {
 
                 case D_TEXT:
                 default:
-                    cardViewItemProperty = new CardViewTextItemModel(Object.assign(propertyDefinition, {
-                        multivalued: isMultiValued,
-                        multiline: isMultiValued,
-                        pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
-                    }));
+                    cardViewItemProperty = new CardViewTextItemModel(
+                        Object.assign(propertyDefinition, {
+                            multivalued: isMultiValued,
+                            multiline: isMultiValued,
+                            pipes: [{ pipe: this.multiValuePipe, params: [this.valueSeparator] }]
+                        })
+                    );
             }
         }
 
diff --git a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts
index a648ca11be..c2f80dbdbb 100644
--- a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts
+++ b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts
@@ -135,8 +135,12 @@ export class CardViewTextItemComponent extends BaseCardView<CardViewTextItemMode
     }
 
     prepareValueForUpload(property: CardViewTextItemModel, value: string | string[]): string | string[] {
-        if (property.multivalued && typeof value === 'string') {
-            return value.split(this.multiValueSeparator.trim()).map((item) => item.trim());
+        if (typeof value === 'string') {
+            if (property.multivalued) {
+                return value.split(this.multiValueSeparator.trim()).map((item) => item.trim());
+            } else if (property.type === 'int' || property.type === 'long') {
+                return this.prepareIntLongValue(value);
+            }
         }
         return value;
     }
@@ -151,11 +155,14 @@ export class CardViewTextItemComponent extends BaseCardView<CardViewTextItemMode
 
     addValueToList(newListItem: MatChipInputEvent) {
         const chipInput = newListItem.chipInput.inputElement;
-        const chipValue = newListItem.value.trim() || '';
+        let chipValue = newListItem.value.trim() || '';
 
         if (typeof this.editedValue !== 'string') {
             if (this.property.isValid(chipValue)) {
                 if (chipValue) {
+                    if (this.property.type === 'int' || this.property.type === 'long') {
+                        chipValue = this.prepareIntLongValue(chipValue);
+                    }
                     this.editedValue.push(chipValue);
                     this.update();
                 }
@@ -223,4 +230,8 @@ export class CardViewTextItemComponent extends BaseCardView<CardViewTextItemMode
     get showLabelForChips(): boolean {
         return this.displayLabelForChips;
     }
+
+    private prepareIntLongValue(value: string): string {
+        return String(Math.trunc(Number(value)));
+    }
 }
diff --git a/lib/core/src/lib/card-view/models/card-view-boolitem.model.ts b/lib/core/src/lib/card-view/models/card-view-boolitem.model.ts
index 12e4a49e4f..56a6c93d2d 100644
--- a/lib/core/src/lib/card-view/models/card-view-boolitem.model.ts
+++ b/lib/core/src/lib/card-view/models/card-view-boolitem.model.ts
@@ -21,8 +21,8 @@ import { CardViewBaseItemModel } from './card-view-baseitem.model';
 import { CardViewBoolItemProperties } from '../interfaces/card-view.interfaces';
 
 export class CardViewBoolItemModel extends CardViewBaseItemModel implements CardViewItem, DynamicComponentModel {
-    type: string = 'bool';
-    value: boolean = false;
+    type = 'bool';
+    value = false;
     default: boolean;
 
     constructor(cardViewBoolItemProperties: CardViewBoolItemProperties) {
diff --git a/lib/core/src/lib/card-view/models/card-view-dateitem.model.ts b/lib/core/src/lib/card-view/models/card-view-dateitem.model.ts
index f2e4d30efe..939382ee98 100644
--- a/lib/core/src/lib/card-view/models/card-view-dateitem.model.ts
+++ b/lib/core/src/lib/card-view/models/card-view-dateitem.model.ts
@@ -25,7 +25,7 @@ import { DateFnsUtils } from '../../common/utils/date-fns-utils';
 type DateItemType = Date | Date[] | null;
 
 export class CardViewDateItemModel extends CardViewBaseItemModel<DateItemType> implements CardViewItem, DynamicComponentModel {
-    type: string = 'date';
+    type = 'date';
     format: string;
     locale: string;
 
@@ -51,9 +51,7 @@ export class CardViewDateItemModel extends CardViewBaseItemModel<DateItemType> i
                 return this.default ? [this.default] : [];
             }
         } else {
-            return this.value && !Array.isArray(this.value)
-                ? this.transformDate(this.prepareDate(this.value))
-                : this.default;
+            return this.value && !Array.isArray(this.value) ? this.transformDate(this.prepareDate(this.value)) : this.default;
         }
     }
 
diff --git a/lib/core/src/lib/card-view/models/card-view-datetimeitem.model.ts b/lib/core/src/lib/card-view/models/card-view-datetimeitem.model.ts
index 3e93e0a1f1..11bc9916ca 100644
--- a/lib/core/src/lib/card-view/models/card-view-datetimeitem.model.ts
+++ b/lib/core/src/lib/card-view/models/card-view-datetimeitem.model.ts
@@ -21,8 +21,8 @@ import { CardViewDateItemModel } from './card-view-dateitem.model';
 import { CardViewDateItemProperties } from '../interfaces/card-view.interfaces';
 
 export class CardViewDatetimeItemModel extends CardViewDateItemModel implements CardViewItem, DynamicComponentModel {
-    type: string = 'datetime';
-    format: string = 'MMM d, y, H:mm';
+    type = 'datetime';
+    format = 'MMM d, y, H:mm';
 
     constructor(cardViewDateItemProperties: CardViewDateItemProperties) {
         super(cardViewDateItemProperties);
diff --git a/lib/core/src/lib/card-view/models/card-view-floatitem.model.ts b/lib/core/src/lib/card-view/models/card-view-floatitem.model.ts
index 86ab2eae49..00430c5f88 100644
--- a/lib/core/src/lib/card-view/models/card-view-floatitem.model.ts
+++ b/lib/core/src/lib/card-view/models/card-view-floatitem.model.ts
@@ -22,8 +22,8 @@ import { CardViewTextItemProperties } from '../interfaces/card-view.interfaces';
 import { CardViewItemFloatValidator } from '../validators/card-view.validators';
 
 export class CardViewFloatItemModel extends CardViewTextItemModel implements CardViewItem, DynamicComponentModel {
-    type: string = 'float';
-    inputType: string = 'number';
+    type = 'float';
+    inputType = 'number';
 
     constructor(cardViewTextItemProperties: CardViewTextItemProperties) {
         super(cardViewTextItemProperties);
diff --git a/lib/core/src/lib/card-view/models/card-view-intitem.model.ts b/lib/core/src/lib/card-view/models/card-view-intitem.model.ts
index 79598424ce..4f9fbea843 100644
--- a/lib/core/src/lib/card-view/models/card-view-intitem.model.ts
+++ b/lib/core/src/lib/card-view/models/card-view-intitem.model.ts
@@ -22,8 +22,8 @@ import { CardViewIntItemProperties } from '../interfaces/card-view.interfaces';
 import { CardViewItemIntValidator, CardViewItemPositiveIntValidator } from '../validators/card-view.validators';
 
 export class CardViewIntItemModel extends CardViewTextItemModel implements CardViewItem, DynamicComponentModel {
-    type: string = 'int';
-    inputType: string = 'number';
+    type = 'int';
+    inputType = 'number';
 
     constructor(cardViewIntItemProperties: CardViewIntItemProperties) {
         super(cardViewIntItemProperties);
diff --git a/lib/core/src/lib/card-view/models/card-view-keyvaluepairs.model.ts b/lib/core/src/lib/card-view/models/card-view-keyvaluepairs.model.ts
index 44f53593e3..86a8468d1f 100644
--- a/lib/core/src/lib/card-view/models/card-view-keyvaluepairs.model.ts
+++ b/lib/core/src/lib/card-view/models/card-view-keyvaluepairs.model.ts
@@ -21,7 +21,7 @@ import { CardViewBaseItemModel } from './card-view-baseitem.model';
 import { CardViewKeyValuePairsItemProperties } from '../interfaces/card-view.interfaces';
 
 export class CardViewKeyValuePairsItemModel extends CardViewBaseItemModel implements CardViewItem, DynamicComponentModel {
-    type: string = 'keyvaluepairs';
+    type = 'keyvaluepairs';
 
     constructor(cardViewKeyValuePairsItemProperties: CardViewKeyValuePairsItemProperties) {
         super(cardViewKeyValuePairsItemProperties);
diff --git a/lib/core/src/lib/card-view/models/card-view-longitem.model.spec.ts b/lib/core/src/lib/card-view/models/card-view-longitem.model.spec.ts
new file mode 100644
index 0000000000..eee44f24f3
--- /dev/null
+++ b/lib/core/src/lib/card-view/models/card-view-longitem.model.spec.ts
@@ -0,0 +1,83 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CardViewLongItemModel } from './card-view-longitem.model';
+import { CardViewTextItemProperties } from '../interfaces/card-view.interfaces';
+
+describe('CardViewLongItemModel', () => {
+    let properties: CardViewTextItemProperties;
+
+    beforeEach(() => {
+        properties = {
+            label: 'Long Number',
+            value: '21',
+            key: 'long'
+        };
+    });
+
+    it('value should be parsed as a long integer', () => {
+        const itemModel = new CardViewLongItemModel(properties);
+
+        expect(itemModel.value).toBe(21);
+    });
+
+    it('value should be parsed as a long integer only if there is a value', () => {
+        properties.value = undefined;
+        const itemModel = new CardViewLongItemModel(properties);
+
+        expect(itemModel.value).toBe(undefined);
+    });
+
+    it('isValid should return the validators value', () => {
+        const itemModel = new CardViewLongItemModel(properties);
+
+        expect(itemModel.isValid(21)).toBe(true, 'For 21 it should be true');
+        expect(itemModel.isValid(21.0)).toBe(true, 'For 21.0 it should be true');
+        expect(itemModel.isValid('21')).toBe(true, 'For "21" it should be true');
+        expect(itemModel.isValid('21.0')).toBe(true, 'For "21.0" it should be true');
+        expect(itemModel.isValid('2e1')).toBe(true, 'For "2e1" it should be true');
+        expect(itemModel.isValid('2g1')).toBe(false, 'For "2g1" it should be false');
+        expect(itemModel.isValid(21.3)).toBe(false, 'For 21.3 it should be false');
+        expect(itemModel.isValid('21.3')).toBe(false, 'For "21.3" it should be false');
+        expect(itemModel.isValid('text')).toBe(false, 'For "text" it should be false');
+    });
+
+    it('should validate based on defined constraints', () => {
+        const constrainedProperties = {
+            label: 'Some Number',
+            value: '21',
+            key: 'number',
+            dataType: 'd:float',
+            constraints: [
+                {
+                    id: 'constraint-id',
+                    type: 'MINMAX',
+                    parameters: { minValue: 10, maxValue: 15 }
+                }
+            ]
+        };
+
+        const itemModel = new CardViewLongItemModel(constrainedProperties);
+        expect(itemModel.isValid(itemModel.value)).toBe(false, '21 is bigger than maximum allowed');
+
+        itemModel.value = '5';
+        expect(itemModel.isValid(itemModel.value)).toBe(false, '5 is less than minimum allowed');
+
+        itemModel.value = '13';
+        expect(itemModel.isValid(itemModel.value)).toBe(true, '13 is within the allowed range');
+    });
+});
diff --git a/lib/core/src/lib/card-view/models/card-view-longitem.model.ts b/lib/core/src/lib/card-view/models/card-view-longitem.model.ts
new file mode 100644
index 0000000000..70ccdc0f9a
--- /dev/null
+++ b/lib/core/src/lib/card-view/models/card-view-longitem.model.ts
@@ -0,0 +1,45 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CardViewItem } from '../interfaces/card-view-item.interface';
+import { DynamicComponentModel } from '../../common/services/dynamic-component-mapper.service';
+import { CardViewTextItemModel } from './card-view-textitem.model';
+import { CardViewIntItemProperties } from '../interfaces/card-view.interfaces';
+import { CardViewItemLongValidator, CardViewItemPositiveLongValidator } from '../validators/card-view.validators';
+
+export class CardViewLongItemModel extends CardViewTextItemModel implements CardViewItem, DynamicComponentModel {
+    type = 'long';
+    inputType = 'number';
+
+    constructor(cardViewIntItemProperties: CardViewIntItemProperties) {
+        super(cardViewIntItemProperties);
+
+        this.validators.push(new CardViewItemLongValidator());
+
+        if (cardViewIntItemProperties.allowOnlyPositiveNumbers) {
+            this.validators.push(new CardViewItemPositiveLongValidator());
+        }
+
+        if (cardViewIntItemProperties.value && !cardViewIntItemProperties.multivalued) {
+            this.value = Number(cardViewIntItemProperties.value);
+        }
+    }
+
+    get displayValue(): string {
+        return this.applyPipes(this.value);
+    }
+}
diff --git a/lib/core/src/lib/card-view/models/card-view-mapitem.model.ts b/lib/core/src/lib/card-view/models/card-view-mapitem.model.ts
index 0f0b12e11d..b39303d177 100644
--- a/lib/core/src/lib/card-view/models/card-view-mapitem.model.ts
+++ b/lib/core/src/lib/card-view/models/card-view-mapitem.model.ts
@@ -20,7 +20,7 @@ import { DynamicComponentModel } from '../../common/services/dynamic-component-m
 import { CardViewBaseItemModel } from './card-view-baseitem.model';
 
 export class CardViewMapItemModel extends CardViewBaseItemModel implements CardViewItem, DynamicComponentModel {
-    type: string = 'map';
+    type = 'map';
     value: Map<string, string>;
 
     get displayValue() {
diff --git a/lib/core/src/lib/card-view/models/card-view-selectitem.model.ts b/lib/core/src/lib/card-view/models/card-view-selectitem.model.ts
index f3cdb0d1a4..836f6bcd39 100644
--- a/lib/core/src/lib/card-view/models/card-view-selectitem.model.ts
+++ b/lib/core/src/lib/card-view/models/card-view-selectitem.model.ts
@@ -23,7 +23,7 @@ import { Observable, of } from 'rxjs';
 import { switchMap } from 'rxjs/operators';
 
 export class CardViewSelectItemModel<T> extends CardViewBaseItemModel implements CardViewItem, DynamicComponentModel {
-    type: string = 'select';
+    type = 'select';
     options$: Observable<CardViewSelectItemOption<T>[]>;
     displayNoneOption: boolean;
 
@@ -40,7 +40,8 @@ export class CardViewSelectItemModel<T> extends CardViewBaseItemModel implements
             switchMap((options) => {
                 const option = options.find((o) => o.key === this.value?.toString());
                 return of(option ? option.label : '');
-        }));
+            })
+        );
     }
 
     get displayValue() {
diff --git a/lib/core/src/lib/card-view/models/card-view-textitem.model.ts b/lib/core/src/lib/card-view/models/card-view-textitem.model.ts
index 7bef2fe4e1..e2dcaa5d21 100644
--- a/lib/core/src/lib/card-view/models/card-view-textitem.model.ts
+++ b/lib/core/src/lib/card-view/models/card-view-textitem.model.ts
@@ -21,8 +21,8 @@ import { CardViewBaseItemModel } from './card-view-baseitem.model';
 import { CardViewTextItemPipeProperty, CardViewTextItemProperties } from '../interfaces/card-view.interfaces';
 
 export class CardViewTextItemModel extends CardViewBaseItemModel implements CardViewItem, DynamicComponentModel {
-    type: string = 'text';
-    inputType: string = 'text';
+    type = 'text';
+    inputType = 'text';
     multiline?: boolean;
     pipes?: CardViewTextItemPipeProperty[];
     clickCallBack?: any;
diff --git a/lib/core/src/lib/card-view/models/card-view.models.ts b/lib/core/src/lib/card-view/models/card-view.models.ts
index 42ff49ea7d..ad7351932a 100644
--- a/lib/core/src/lib/card-view/models/card-view.models.ts
+++ b/lib/core/src/lib/card-view/models/card-view.models.ts
@@ -21,6 +21,7 @@ export * from './card-view-dateitem.model';
 export * from './card-view-datetimeitem.model';
 export * from './card-view-floatitem.model';
 export * from './card-view-intitem.model';
+export * from './card-view-longitem.model';
 export * from './card-view-mapitem.model';
 export * from './card-view-textitem.model';
 export * from './card-view-keyvaluepairs.model';
diff --git a/lib/core/src/lib/card-view/services/card-item-types.service.ts b/lib/core/src/lib/card-view/services/card-item-types.service.ts
index 8c418e63f6..217fcdba21 100644
--- a/lib/core/src/lib/card-view/services/card-item-types.service.ts
+++ b/lib/core/src/lib/card-view/services/card-item-types.service.ts
@@ -22,14 +22,17 @@ import { CardViewTextItemComponent } from '../components/card-view-textitem/card
 import { CardViewSelectItemComponent } from '../components/card-view-selectitem/card-view-selectitem.component';
 import { CardViewBoolItemComponent } from '../components/card-view-boolitem/card-view-boolitem.component';
 import { CardViewKeyValuePairsItemComponent } from '../components/card-view-keyvaluepairsitem/card-view-keyvaluepairsitem.component';
-import { DynamicComponentMapper, DynamicComponentResolveFunction, DynamicComponentResolver } from '../../common/services/dynamic-component-mapper.service';
+import {
+    DynamicComponentMapper,
+    DynamicComponentResolveFunction,
+    DynamicComponentResolver
+} from '../../common/services/dynamic-component-mapper.service';
 import { CardViewArrayItemComponent } from '../components/card-view-arrayitem/card-view-arrayitem.component';
 
 @Injectable({
     providedIn: 'root'
 })
 export class CardItemTypeService extends DynamicComponentMapper {
-
     protected defaultValue: Type<any> = CardViewTextItemComponent;
 
     protected types: { [key: string]: DynamicComponentResolveFunction } = {
@@ -37,6 +40,7 @@ export class CardItemTypeService extends DynamicComponentMapper {
         select: DynamicComponentResolver.fromType(CardViewSelectItemComponent),
         int: DynamicComponentResolver.fromType(CardViewTextItemComponent),
         float: DynamicComponentResolver.fromType(CardViewTextItemComponent),
+        long: DynamicComponentResolver.fromType(CardViewTextItemComponent),
         date: DynamicComponentResolver.fromType(CardViewDateItemComponent),
         datetime: DynamicComponentResolver.fromType(CardViewDateItemComponent),
         bool: DynamicComponentResolver.fromType(CardViewBoolItemComponent),
diff --git a/lib/core/src/lib/card-view/validators/card-view-item-length.validator.spec.ts b/lib/core/src/lib/card-view/validators/card-view-item-length.validator.spec.ts
index cb934ae745..d640b5cb6e 100644
--- a/lib/core/src/lib/card-view/validators/card-view-item-length.validator.spec.ts
+++ b/lib/core/src/lib/card-view/validators/card-view-item-length.validator.spec.ts
@@ -15,9 +15,9 @@
  * limitations under the License.
  */
 
-import { CardViewItemLengthValidator } from './card-view-item-length.valiator';
+import { CardViewItemLengthValidator } from './card-view-item-length.validator';
 
-describe('CardViewItemPositiveIntValidator', () => {
+describe('CardViewItemLengthValidator', () => {
     const validator = new CardViewItemLengthValidator(2, 3);
 
     it('should validate empty value', () => {
diff --git a/lib/core/src/lib/card-view/validators/card-view-item-length.valiator.ts b/lib/core/src/lib/card-view/validators/card-view-item-length.validator.ts
similarity index 100%
rename from lib/core/src/lib/card-view/validators/card-view-item-length.valiator.ts
rename to lib/core/src/lib/card-view/validators/card-view-item-length.validator.ts
diff --git a/lib/core/src/lib/card-view/validators/card-view-item-long.validator.ts b/lib/core/src/lib/card-view/validators/card-view-item-long.validator.ts
new file mode 100644
index 0000000000..f801da88c0
--- /dev/null
+++ b/lib/core/src/lib/card-view/validators/card-view-item-long.validator.ts
@@ -0,0 +1,39 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CardViewItemValidator } from '../interfaces/card-view.interfaces';
+
+export class CardViewItemLongValidator implements CardViewItemValidator {
+    message = 'CORE.CARDVIEW.VALIDATORS.LONG_VALIDATION_ERROR';
+
+    isValid(value: number | number[] | ''): boolean {
+        if (Array.isArray(value)) {
+            return value.every(this.isLongNumber);
+        }
+
+        return value === '' || (!isNaN(value) && this.isLongNumber(value) && this.isNotSpaceOnly(value));
+    }
+
+    private isLongNumber(value: number): boolean {
+        const longNumber = Number(value);
+        return Math.trunc(longNumber) === longNumber && longNumber >= Number.MIN_SAFE_INTEGER && longNumber <= Number.MAX_SAFE_INTEGER;
+    }
+
+    private isNotSpaceOnly(value: number): boolean {
+        return String(value).trim() !== '';
+    }
+}
diff --git a/lib/core/src/lib/card-view/validators/card-view-item-match.validator.spec.ts b/lib/core/src/lib/card-view/validators/card-view-item-match.validator.spec.ts
index 00b54f34dd..9b53cc8ea6 100644
--- a/lib/core/src/lib/card-view/validators/card-view-item-match.validator.spec.ts
+++ b/lib/core/src/lib/card-view/validators/card-view-item-match.validator.spec.ts
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { CardViewItemMatchValidator } from './card-view-item-match.valiator';
+import { CardViewItemMatchValidator } from './card-view-item-match.validator';
 
 describe('CardViewItemMatchValidator', () => {
     const validator = new CardViewItemMatchValidator('^[a-zA-Z]+$', undefined, true);
diff --git a/lib/core/src/lib/card-view/validators/card-view-item-match.valiator.ts b/lib/core/src/lib/card-view/validators/card-view-item-match.validator.ts
similarity index 100%
rename from lib/core/src/lib/card-view/validators/card-view-item-match.valiator.ts
rename to lib/core/src/lib/card-view/validators/card-view-item-match.validator.ts
diff --git a/lib/core/src/lib/card-view/validators/card-view-item-minmax.validator.spec.ts b/lib/core/src/lib/card-view/validators/card-view-item-minmax.validator.spec.ts
index 4962f46fae..adf298fd25 100644
--- a/lib/core/src/lib/card-view/validators/card-view-item-minmax.validator.spec.ts
+++ b/lib/core/src/lib/card-view/validators/card-view-item-minmax.validator.spec.ts
@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 
-import { CardViewItemMinMaxValidator } from './card-view-item-minmax.valiator';
+import { CardViewItemMinMaxValidator } from './card-view-item-minmax.validator';
 
 describe('CardViewItemMinMaxValidator', () => {
     const validator = new CardViewItemMinMaxValidator(1, 3);
diff --git a/lib/core/src/lib/card-view/validators/card-view-item-minmax.valiator.ts b/lib/core/src/lib/card-view/validators/card-view-item-minmax.validator.ts
similarity index 100%
rename from lib/core/src/lib/card-view/validators/card-view-item-minmax.valiator.ts
rename to lib/core/src/lib/card-view/validators/card-view-item-minmax.validator.ts
diff --git a/lib/core/src/lib/card-view/validators/card-view-item-only-positive-long.validator.ts b/lib/core/src/lib/card-view/validators/card-view-item-only-positive-long.validator.ts
new file mode 100644
index 0000000000..80b0e6bd8f
--- /dev/null
+++ b/lib/core/src/lib/card-view/validators/card-view-item-only-positive-long.validator.ts
@@ -0,0 +1,34 @@
+/*!
+ * @license
+ * Copyright © 2005-2024 Hyland Software, Inc. and its affiliates. All rights reserved.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CardViewItemValidator } from '../interfaces/card-view.interfaces';
+
+export class CardViewItemPositiveLongValidator implements CardViewItemValidator {
+    message = 'CORE.CARDVIEW.VALIDATORS.ONLY_POSITIVE_NUMBER';
+
+    isValid(value: number | number[] | ''): boolean {
+        if (Array.isArray(value)) {
+            return value.every(this.isPositiveNumber);
+        }
+
+        return value === '' || (!isNaN(value) && this.isPositiveNumber(value));
+    }
+
+    private isPositiveNumber(value: number): boolean {
+        return Number(value) >= 0;
+    }
+}
diff --git a/lib/core/src/lib/card-view/validators/card-view.validators.ts b/lib/core/src/lib/card-view/validators/card-view.validators.ts
index 628c37dbf2..85ad9ebba3 100644
--- a/lib/core/src/lib/card-view/validators/card-view.validators.ts
+++ b/lib/core/src/lib/card-view/validators/card-view.validators.ts
@@ -18,7 +18,9 @@
 export * from './card-view-item-int.validator';
 export * from './card-view-item-only-positive-int.validator';
 export * from './card-view-item-float.validator';
-export * from './card-view-item-match.valiator';
-export * from './card-view-item-minmax.valiator';
-export * from './card-view-item-length.valiator';
+export * from './card-view-item-long.validator';
+export * from './card-view-item-only-positive-long.validator';
+export * from './card-view-item-match.validator';
+export * from './card-view-item-minmax.validator';
+export * from './card-view-item-length.validator';
 export * from './validators.map';
diff --git a/lib/core/src/lib/card-view/validators/validators.map.ts b/lib/core/src/lib/card-view/validators/validators.map.ts
index a93c6ff3d6..cc47fcbc98 100644
--- a/lib/core/src/lib/card-view/validators/validators.map.ts
+++ b/lib/core/src/lib/card-view/validators/validators.map.ts
@@ -15,9 +15,9 @@
  * limitations under the License.
  */
 
-import { CardViewItemMatchValidator, MatchValidatorParams } from './card-view-item-match.valiator';
-import { CardViewItemMinMaxValidator, MinMaxValidatorParams } from './card-view-item-minmax.valiator';
-import { CardViewItemLengthValidator, LengthValidatorParams } from './card-view-item-length.valiator';
+import { CardViewItemMatchValidator, MatchValidatorParams } from './card-view-item-match.validator';
+import { CardViewItemMinMaxValidator, MinMaxValidatorParams } from './card-view-item-minmax.validator';
+import { CardViewItemLengthValidator, LengthValidatorParams } from './card-view-item-length.validator';
 
 const validators = {
     minmax: (parameters: MinMaxValidatorParams) => new CardViewItemMinMaxValidator(parameters.minValue, parameters.maxValue),
diff --git a/lib/core/src/lib/i18n/en.json b/lib/core/src/lib/i18n/en.json
index 8a49799e52..4b34fb1d20 100644
--- a/lib/core/src/lib/i18n/en.json
+++ b/lib/core/src/lib/i18n/en.json
@@ -196,6 +196,7 @@
       "VALIDATORS": {
         "FLOAT_VALIDATION_ERROR": "Use a number format",
         "INT_VALIDATION_ERROR": "Use an integer format",
+        "LONG_VALIDATION_ERROR": "Use a long format",
         "LENGTH_VALIDATION_ERROR": "Value should be between {{ minLength }} and {{ maxLength }} in length",
         "MATCH_VALIDATION_ERROR": "Value doesn't match pattern: {{ expression }}",
         "MINMAX_VALIDATION_ERROR": "Value should be between {{ minValue }} and {{ maxValue }}",