@proximus/lavender-styling-native 0.1.0-alpha.2 → 0.1.0-alpha.3

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.1.0-alpha.3](https://github.com/Pxs-Corporate/react-native-lavender/compare/@proximus/lavender-styling-native@0.1.0-alpha.2...@proximus/lavender-styling-native@0.1.0-alpha.3) (2025-09-19)
+
+### Features
+
+- **BCRI-4249550:** message card + tag components ([#22](https://github.com/Pxs-Corporate/react-native-lavender/issues/22)) ([39fb91c](https://github.com/Pxs-Corporate/react-native-lavender/commit/39fb91cc294a37d07e63fca2b4e993d90b867082))
+
 # [0.1.0-alpha.2](https://github.com/Pxs-Corporate/react-native-lavender/compare/@proximus/lavender-styling-native@0.1.0-alpha.1...@proximus/lavender-styling-native@0.1.0-alpha.2) (2025-09-05)
 
 ### Features

package/dist/index.d.ts

@@ -1,4 +1,3 @@
-export * from './breakpoints';
 export * from './ThemeContext';
 export * from './ThemeProvider';
 export * from './themes';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@proximus/lavender-styling-native",
-  "version": "0.1.0-alpha.2",
+  "version": "0.1.0-alpha.3",
   "description": "Commmon styling constants",
   "main": "src/index.ts",
   "type": "module",
@@ -23,5 +23,5 @@
       }
     }
   },
-  "gitHead": "38a67765befa2567a3f5f57976b7933cf5b85a24"
+  "gitHead": "6e9252a716a08ededdfbfd6f5b1db70ab21e026e"
 }

package/src/index.ts

@@ -1,4 +1,3 @@
-export * from './breakpoints';
 export * from './ThemeContext';
 export * from './ThemeProvider';
 export * from './themes';

package/dist/breakpoints.d.ts

@@ -1,56 +0,0 @@
-export declare const IPHONE_SE_WIDTH = 320;
-export declare const IPHONE_SE_HEIGHT = 568;
-export declare const IPHONE_4_WIDTH = 320;
-export declare const IPHONE_4_HEIGHT = 480;
-export declare const IPHONE_8_WIDTH = 375;
-export declare const IPHONE_8_HEIGHT = 667;
-export declare const IPHONE_XS_WIDTH = 375;
-export declare const IPHONE_XS_HEIGHT = 812;
-export declare const IPHONE_XR_WIDTH = 414;
-export declare const IPHONE_XR_HEIGHT = 896;
-export declare const IPHONE_PLUS_WIDTH = 414;
-export declare const IPHONE_PLUS_HEIGHT = 736;
-export declare const IPAD_MINI_WIDTH = 768;
-export declare const IPAD_MINI_HEIGHT = 1024;
-export declare const MDPI_WIDTH = 320;
-export declare const MDPI_HEIGHT = 480;
-export declare const HDPI_WIDTH = 320;
-export declare const HDPI_HEIGHT = 533;
-export declare const XHDPI_WIDTH = 360;
-export declare const XHDPI_HEIGHT = 640;
-export declare const XXHDPI_WIDTH = 320;
-export declare const XXHDPI_HEIGHT = 533;
-export declare const XXXHDPI_WIDTH = 360;
-export declare const XXXHDPI_HEIGHT = 640;
-export declare const GALAXY_S7_WIDTH = 360;
-export declare const GALAXY_S7_HEIGHT = 640;
-export declare const GALAXY_S9_WIDTH = 360;
-export declare const GALAXY_S9_HEIGHT = 740;
-export declare const GALAXY_S9_PLUS_WIDTH = 412;
-export declare const GALAXY_S9_PLUS_HEIGHT = 846;
-export declare function media(width: number, height: number, fun: 'max' | 'min' | ''): string;
-export declare function max(width: number, height: number): string;
-export declare function min(width: number, height: number): string;
-export declare const MIN_IPHONE_SE: string;
-export declare const MIN_IPHONE_4: string;
-export declare const MIN_IPHONE_8: string;
-export declare const MIN_IPHONE_XS: string;
-export declare const MIN_IPHONE_XR: string;
-export declare const MIN_IPHONE_PLUS: string;
-export declare const MIN_IPAD_MINI: string;
-export declare const MIN_MDPI: string;
-export declare const MIN_HDPI: string;
-export declare const MIN_XHDPI: string;
-export declare const MIN_XXHDPI: string;
-export declare const MIN_XXXHDPI: string;
-export declare const MIN_GALAXY_S7: string;
-export declare const MIN_GALAXY_S9: string;
-export declare const MIN_GALAXY_S9_PLUS: string;
-export declare const MEDIA_IPHONE_SE: string;
-export declare const MEDIA_IPHONE_4: string;
-export declare const MEDIA_IPHONE_8: string;
-export declare const MEDIA_IPHONE_XS: string;
-export declare const MEDIA_IPHONE_XR: string;
-export declare const MEDIA_IPHONE_PLUS: string;
-export declare const MEDIA_IPHONE_X_PLUS = "@media (min-device-height: 736)";
-//# sourceMappingURL=breakpoints.d.ts.map

package/dist/breakpoints.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"breakpoints.d.ts","sourceRoot":"","sources":["../src/breakpoints.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,eAAe,MAAM,CAAC;AACnC,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAEpC,eAAO,MAAM,cAAc,MAAM,CAAC;AAClC,eAAO,MAAM,eAAe,MAAM,CAAC;AAEnC,eAAO,MAAM,cAAc,MAAM,CAAC;AAClC,eAAO,MAAM,eAAe,MAAM,CAAC;AAEnC,eAAO,MAAM,eAAe,MAAM,CAAC;AACnC,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAEpC,eAAO,MAAM,eAAe,MAAM,CAAC;AACnC,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAEpC,eAAO,MAAM,iBAAiB,MAAM,CAAC;AACrC,eAAO,MAAM,kBAAkB,MAAM,CAAC;AAEtC,eAAO,MAAM,eAAe,MAAM,CAAC;AACnC,eAAO,MAAM,gBAAgB,OAAO,CAAC;AAGrC,eAAO,MAAM,UAAU,MAAM,CAAC;AAC9B,eAAO,MAAM,WAAW,MAAM,CAAC;AAE/B,eAAO,MAAM,UAAU,MAAM,CAAC;AAC9B,eAAO,MAAM,WAAW,MAAM,CAAC;AAE/B,eAAO,MAAM,WAAW,MAAM,CAAC;AAC/B,eAAO,MAAM,YAAY,MAAM,CAAC;AAEhC,eAAO,MAAM,YAAY,MAAM,CAAC;AAChC,eAAO,MAAM,aAAa,MAAM,CAAC;AAEjC,eAAO,MAAM,aAAa,MAAM,CAAC;AACjC,eAAO,MAAM,cAAc,MAAM,CAAC;AAIlC,eAAO,MAAM,eAAe,MAAM,CAAC;AACnC,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAEpC,eAAO,MAAM,eAAe,MAAM,CAAC;AACnC,eAAO,MAAM,gBAAgB,MAAM,CAAC;AAEpC,eAAO,MAAM,oBAAoB,MAAM,CAAC;AACxC,eAAO,MAAM,qBAAqB,MAAM,CAAC;AAEzC,wBAAgB,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,KAAK,GAAG,KAAK,GAAG,EAAE,UAI3E;AAED,wBAAgB,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,UAEhD;AAED,wBAAgB,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,UAEhD;AAED,eAAO,MAAM,aAAa,QAAyC,CAAC;AACpE,eAAO,MAAM,YAAY,QAAuC,CAAC;AACjE,eAAO,MAAM,YAAY,QAAuC,CAAC;AACjE,eAAO,MAAM,aAAa,QAAyC,CAAC;AACpE,eAAO,MAAM,aAAa,QAAyC,CAAC;AACpE,eAAO,MAAM,eAAe,QAA6C,CAAC;AAC1E,eAAO,MAAM,aAAa,QAAyC,CAAC;AAEpE,eAAO,MAAM,QAAQ,QAA+B,CAAC;AACrD,eAAO,MAAM,QAAQ,QAA+B,CAAC;AACrD,eAAO,MAAM,SAAS,QAAiC,CAAC;AACxD,eAAO,MAAM,UAAU,QAAmC,CAAC;AAC3D,eAAO,MAAM,WAAW,QAAqC,CAAC;AAE9D,eAAO,MAAM,aAAa,QAAyC,CAAC;AACpE,eAAO,MAAM,aAAa,QAAyC,CAAC;AACpE,eAAO,MAAM,kBAAkB,QAG9B,CAAC;AAGF,eAAO,MAAM,eAAe,QAAyC,CAAC;AACtE,eAAO,MAAM,cAAc,QAAuC,CAAC;AACnE,eAAO,MAAM,cAAc,QAAuC,CAAC;AACnE,eAAO,MAAM,eAAe,QAA+C,CAAC;AAC5E,eAAO,MAAM,eAAe,QAA+C,CAAC;AAC5E,eAAO,MAAM,iBAAiB,QAI7B,CAAC;AACF,eAAO,MAAM,mBAAmB,oCAAsD,CAAC"}

package/src/__tests__/breakpoints.spec.ts

@@ -1,168 +0,0 @@
-import {
-  IPHONE_SE_HEIGHT,
-  IPHONE_SE_WIDTH,
-  max,
-  media,
-  min,
-  MIN_HDPI,
-  MIN_IPHONE_4,
-  MIN_IPHONE_8,
-  MIN_IPHONE_PLUS,
-  MIN_IPHONE_SE,
-  MIN_IPHONE_XS,
-  MIN_IPHONE_XR,
-  MIN_MDPI,
-  MIN_XHDPI,
-  MIN_XXHDPI,
-  MIN_XXXHDPI,
-  MIN_GALAXY_S7,
-  MIN_GALAXY_S9,
-  MIN_GALAXY_S9_PLUS,
-} from '../breakpoints';
-
-describe('breakpoints test suite', () => {
-  let width: number;
-  let height: number;
-  let mediaquery: string;
-
-  it('should compute mediaquery properly', () => {
-    givenScreenResolution(IPHONE_SE_WIDTH, IPHONE_SE_HEIGHT);
-    whenComputingMediaQuery();
-    thenMediaQueryMustBe('@media (device-width: 320) and (device-height: 568)');
-  });
-
-  it('should compute minimum mediaquery properly', () => {
-    givenScreenResolution(IPHONE_SE_WIDTH, IPHONE_SE_HEIGHT);
-    whenComputingMinMediaQuery();
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 320) and (min-device-height: 568)'
-    );
-  });
-
-  it('should compute maximum mediaquery properly', () => {
-    givenScreenResolution(IPHONE_SE_WIDTH, IPHONE_SE_HEIGHT);
-    whenComputingMaxMediaQuery();
-    thenMediaQueryMustBe(
-      '@media (max-device-width: 320) and (max-device-height: 568)'
-    );
-  });
-
-  it('should compute iphone SE mediaqueries properly', () => {
-    mediaquery = MIN_IPHONE_SE;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 320) and (min-device-height: 568)'
-    );
-  });
-
-  it('should compute iphone 4 mediaqueries properly', () => {
-    mediaquery = MIN_IPHONE_4;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 320) and (min-device-height: 480)'
-    );
-  });
-
-  it('should compute iphone 8 mediaqueries properly', () => {
-    mediaquery = MIN_IPHONE_8;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 375) and (min-device-height: 667)'
-    );
-  });
-
-  it('should compute iphone X mediaqueries properly', () => {
-    mediaquery = MIN_IPHONE_XS;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 375) and (min-device-height: 812)'
-    );
-  });
-
-  it('should compute iphone XR mediaqueries properly', () => {
-    mediaquery = MIN_IPHONE_XR;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 414) and (min-device-height: 896)'
-    );
-  });
-
-  it('should compute iphone Plus mediaqueries properly', () => {
-    mediaquery = MIN_IPHONE_PLUS;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 414) and (min-device-height: 736)'
-    );
-  });
-
-  it('should compute android MDPI mediaqueries properly', () => {
-    mediaquery = MIN_MDPI;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 320) and (min-device-height: 480)'
-    );
-  });
-
-  it('should compute android HDPI mediaqueries properly', () => {
-    mediaquery = MIN_HDPI;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 320) and (min-device-height: 533)'
-    );
-  });
-
-  it('should compute android XHDPI mediaqueries properly', () => {
-    mediaquery = MIN_XHDPI;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 360) and (min-device-height: 640)'
-    );
-  });
-
-  it('should compute android XXHDPI mediaqueries properly', () => {
-    mediaquery = MIN_XXHDPI;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 320) and (min-device-height: 533)'
-    );
-  });
-
-  it('should compute android XXXHDPI mediaqueries properly', () => {
-    mediaquery = MIN_XXXHDPI;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 360) and (min-device-height: 640)'
-    );
-  });
-
-  it('should compute iphone SE mediaqueries properly', () => {
-    mediaquery = MIN_GALAXY_S7;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 360) and (min-device-height: 640)'
-    );
-  });
-
-  it('should compute iphone SE mediaqueries properly', () => {
-    mediaquery = MIN_GALAXY_S9;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 360) and (min-device-height: 740)'
-    );
-  });
-
-  it('should compute iphone SE mediaqueries properly', () => {
-    mediaquery = MIN_GALAXY_S9_PLUS;
-    thenMediaQueryMustBe(
-      '@media (min-device-width: 412) and (min-device-height: 846)'
-    );
-  });
-
-  function givenScreenResolution(w: number, h: number) {
-    width = w;
-    height = h;
-  }
-
-  function whenComputingMediaQuery() {
-    mediaquery = media(width, height, '');
-  }
-
-  function whenComputingMinMediaQuery() {
-    mediaquery = min(width, height);
-  }
-
-  function whenComputingMaxMediaQuery() {
-    mediaquery = max(width, height);
-  }
-
-  function thenMediaQueryMustBe(mq: string) {
-    expect(mediaquery).toEqual(mq);
-  }
-});

package/src/breakpoints.ts

@@ -1,96 +0,0 @@
-/* tslint:disable:max-line-length */
-export const IPHONE_SE_WIDTH = 320;
-export const IPHONE_SE_HEIGHT = 568;
-
-export const IPHONE_4_WIDTH = 320;
-export const IPHONE_4_HEIGHT = 480;
-
-export const IPHONE_8_WIDTH = 375;
-export const IPHONE_8_HEIGHT = 667;
-
-export const IPHONE_XS_WIDTH = 375;
-export const IPHONE_XS_HEIGHT = 812;
-
-export const IPHONE_XR_WIDTH = 414;
-export const IPHONE_XR_HEIGHT = 896;
-
-export const IPHONE_PLUS_WIDTH = 414;
-export const IPHONE_PLUS_HEIGHT = 736;
-
-export const IPAD_MINI_WIDTH = 768;
-export const IPAD_MINI_HEIGHT = 1024;
-
-// https://stackoverflow.com/questions/28507609/image-resolution-for-mdpi-hdpi-xhdpi-and-xxhdpi
-export const MDPI_WIDTH = 320;
-export const MDPI_HEIGHT = 480;
-
-export const HDPI_WIDTH = 320;
-export const HDPI_HEIGHT = 533;
-
-export const XHDPI_WIDTH = 360;
-export const XHDPI_HEIGHT = 640;
-
-export const XXHDPI_WIDTH = 320;
-export const XXHDPI_HEIGHT = 533;
-
-export const XXXHDPI_WIDTH = 360;
-export const XXXHDPI_HEIGHT = 640;
-
-// New sizes: Galaxy J3/J7/S6/S7 and Galaxy S8/S9 and Galaxy S8+/S9+
-
-export const GALAXY_S7_WIDTH = 360;
-export const GALAXY_S7_HEIGHT = 640;
-
-export const GALAXY_S9_WIDTH = 360;
-export const GALAXY_S9_HEIGHT = 740;
-
-export const GALAXY_S9_PLUS_WIDTH = 412;
-export const GALAXY_S9_PLUS_HEIGHT = 846;
-
-export function media(width: number, height: number, fun: 'max' | 'min' | '') {
-  const deviceHeight = fun ? `${fun}-device-height` : 'device-height';
-  const deviceWidth = fun ? `${fun}-device-width` : 'device-width';
-  return `@media (${deviceWidth}: ${width}) and (${deviceHeight}: ${height})`;
-}
-
-export function max(width: number, height: number) {
-  return media(width, height, 'max');
-}
-
-export function min(width: number, height: number) {
-  return media(width, height, 'min');
-}
-
-export const MIN_IPHONE_SE = min(IPHONE_SE_WIDTH, IPHONE_SE_HEIGHT);
-export const MIN_IPHONE_4 = min(IPHONE_4_WIDTH, IPHONE_4_HEIGHT);
-export const MIN_IPHONE_8 = min(IPHONE_8_WIDTH, IPHONE_8_HEIGHT);
-export const MIN_IPHONE_XS = min(IPHONE_XS_WIDTH, IPHONE_XS_HEIGHT);
-export const MIN_IPHONE_XR = min(IPHONE_XR_WIDTH, IPHONE_XR_HEIGHT);
-export const MIN_IPHONE_PLUS = min(IPHONE_PLUS_WIDTH, IPHONE_PLUS_HEIGHT);
-export const MIN_IPAD_MINI = min(IPAD_MINI_WIDTH, IPAD_MINI_HEIGHT);
-
-export const MIN_MDPI = min(MDPI_WIDTH, MDPI_HEIGHT);
-export const MIN_HDPI = min(HDPI_WIDTH, HDPI_HEIGHT);
-export const MIN_XHDPI = min(XHDPI_WIDTH, XHDPI_HEIGHT);
-export const MIN_XXHDPI = min(XXHDPI_WIDTH, XXHDPI_HEIGHT);
-export const MIN_XXXHDPI = min(XXXHDPI_WIDTH, XXXHDPI_HEIGHT);
-
-export const MIN_GALAXY_S7 = min(GALAXY_S7_WIDTH, GALAXY_S7_HEIGHT);
-export const MIN_GALAXY_S9 = min(GALAXY_S9_WIDTH, GALAXY_S9_HEIGHT);
-export const MIN_GALAXY_S9_PLUS = min(
-  GALAXY_S9_PLUS_WIDTH,
-  GALAXY_S9_PLUS_HEIGHT
-);
-
-// We keep those one for backward compatibility
-export const MEDIA_IPHONE_SE = max(IPHONE_SE_WIDTH, IPHONE_SE_HEIGHT);
-export const MEDIA_IPHONE_4 = max(IPHONE_4_WIDTH, IPHONE_4_HEIGHT);
-export const MEDIA_IPHONE_8 = max(IPHONE_8_WIDTH, IPHONE_8_HEIGHT);
-export const MEDIA_IPHONE_XS = media(IPHONE_XS_WIDTH, IPHONE_XS_HEIGHT, '');
-export const MEDIA_IPHONE_XR = media(IPHONE_XR_WIDTH, IPHONE_XR_HEIGHT, '');
-export const MEDIA_IPHONE_PLUS = media(
-  IPHONE_PLUS_WIDTH,
-  IPHONE_PLUS_HEIGHT,
-  ''
-);
-export const MEDIA_IPHONE_X_PLUS = `@media (min-device-height: ${IPHONE_PLUS_HEIGHT})`;