dhre-ui-kit 2.0.23 → 3.0.1

package/lib/theme/borderRadius.d.ts

@@ -0,0 +1,34 @@
+/**
+ * DHRE Corner Radius (Border Radius) Tokens
+ * Use for borderRadius on cards, buttons, inputs, sheets, and avatars.
+ * Values are responsive via moderateScale (baseline: 375pt).
+ *
+ * TODO: Verify values against the DHDS "Corner Radius" page in Figma
+ * (share the node URL from the DHDS — Atoms and molecules file).
+ * Current values follow the 4pt grid convention used across DHDS spacing.
+ */
+export declare const DHRE_RADIUS_BASE: {
+    readonly RADIUS_2: number;
+    readonly RADIUS_4: number;
+    readonly RADIUS_8: number;
+    readonly RADIUS_12: number;
+    readonly RADIUS_16: number;
+    readonly RADIUS_20: number;
+    readonly RADIUS_24: number;
+    readonly RADIUS_36: number;
+    readonly RADIUS_100: number;
+    readonly RADIUS_120: number;
+    readonly RADIUS_200: number;
+};
+export declare const DHRE_RADIUS: {
+    readonly NONE: 0;
+    readonly XS: number;
+    readonly SM: number;
+    readonly MD: number;
+    readonly LG: number;
+    readonly XL: number;
+    readonly XXL: number;
+    readonly PILL: number;
+    readonly CIRCLE: 9999;
+};
+export type RadiusKey = keyof typeof DHRE_RADIUS;

package/lib/theme/colors.d.ts

@@ -179,3 +179,85 @@ export declare const DHRE_COLORS_TEXT: {
     DH_MEDIUM_GRAY: string;
     DH_SOFT_GRAY: string;
 };
+export declare const DHRE_DEEP_SPACE_BLUE: {
+    950: string;
+    900: string;
+    800: string;
+    700: string;
+    600: string;
+    500: string;
+    400: string;
+    300: string;
+    200: string;
+    100: string;
+    DSP_900_TRANSPERANT_20: string;
+    DSP_900_TRANSPERANT_10: string;
+};
+export declare const DHRE_CORE_BLUE: {
+    400: string;
+    300: string;
+    200: string;
+    100: string;
+    50: string;
+    TRANSPARENT_60: string;
+};
+export declare const DHRE_CYAN_HIGHLIGHT: {
+    600: string;
+    500: string;
+    400: string;
+    300: string;
+    200: string;
+    100: string;
+    50: string;
+    TRANSPARENT: string;
+};
+export declare const DHRE_WHITE: {
+    100: string;
+    TRANSPARENT_50: string;
+    TRANSPARENT_30: string;
+    TRANSPARENT_10: string;
+};
+export declare const DHRE_INFO_BLUE: {
+    400: string;
+    300: string;
+    200: string;
+    100: string;
+    50: string;
+    TRANSPARENT_35: string;
+    TRASNPARENT: string;
+};
+export declare const DHRE_SUCCESS_GREEN: {
+    400: string;
+    300: string;
+    200: string;
+    100: string;
+    50: string;
+    TRANSPARENT_50: string;
+    TRANSPARENT_10: string;
+};
+export declare const DHRE_ORANGE_WARNING: {
+    400: string;
+    300: string;
+    200: string;
+    100: string;
+    50: string;
+    TRANSPARENT_60: string;
+    TRANSPARENT_10: string;
+};
+export declare const DHRE_RED_ERROR: {
+    400: string;
+    300: string;
+    200: string;
+    100: string;
+    50: string;
+    TRANSPARENT_400_60: string;
+    TRANSPARENT_400_10: string;
+};
+export declare const DHRE_CONFIRMATION_ERROR_GRADIENT: {
+    light: readonly ["#F0809E", "#FFFFFF"];
+    dark: readonly ["#EB0542", "#000A28"];
+};
+export declare const DHRE_CONFIRMATION_BASE_GRADIENT: {
+    light: readonly ["rgba(165, 233, 255, 0)", "#52C5E8"];
+    dark: readonly ["rgba(165, 233, 255, 0)", "#279DC1"];
+};

package/lib/theme/fonts.d.ts

@@ -2,11 +2,11 @@ import { TextStyle } from 'react-native';
 interface FontStyles {
     [key: string]: TextStyle;
 }
-export declare const meraasActivFontfamily: TextStyle;
-export declare const serifActivFontfamily: TextStyle;
-export declare const nakheelHeadlineFontfamily: TextStyle;
-export declare const nakheelHeadlineTextFontfamily: TextStyle;
-export declare const nakheelTextBoldFontfamily: TextStyle;
-export declare const nakheelTextFontfamily: TextStyle;
+export declare const InterBold = "Inter-Bold";
+export declare const InterLight = "Inter-Light";
+export declare const InterMedium = "Inter-Medium";
+export declare const lifestyleInterBold: TextStyle;
+export declare const lifestyleInterLight: TextStyle;
+export declare const lifestyleInterMedium: TextStyle;
 export declare const FONT_STYLES: FontStyles;
 export {};

package/lib/theme/padding.d.ts

@@ -0,0 +1,32 @@
+/**
+ * DHRE Padding Tokens
+ * Use for component-level inner padding (paddingHorizontal, paddingVertical, padding).
+ * Kept separate from spacing so padding intent is explicit at the call site.
+ * Values are responsive via moderateScale (baseline: 375pt).
+ */
+export declare const DHRE_PADDING_BASE: {
+    readonly PADDING_4: number;
+    readonly PADDING_8: number;
+    readonly PADDING_12: number;
+    readonly PADDING_16: number;
+    readonly PADDING_20: number;
+    readonly PADDING_24: number;
+    readonly PADDING_28: number;
+    readonly PADDING_32: number;
+    readonly PADDING_36: number;
+    readonly PADDING_40: number;
+    readonly PADDING_48: number;
+    readonly PADDING_56: number;
+    readonly PADDING_64: number;
+};
+export declare const DHRE_PADDING: {
+    readonly NONE: 0;
+    readonly XS: number;
+    readonly SM: number;
+    readonly MD: number;
+    readonly LG: number;
+    readonly XL: number;
+    readonly XXL: number;
+    readonly XXXL: number;
+};
+export type PaddingKey = keyof typeof DHRE_PADDING;

package/lib/theme/sizing.d.ts

@@ -0,0 +1,53 @@
+/**
+ * DHRE Sizing Tokens (Width & Height)
+ * Use for fixed component dimensions: icons, avatars, buttons, inputs, bars.
+ *
+ * Convention:
+ *  - Width-axis / square dimensions  → moderateScale  (scales with screen width)
+ *  - Height-axis dimensions          → verticalScale   (scales with screen height)
+ *
+ * TODO: Verify values against the DHDS "Width & Height" page in Figma
+ * (share the node URL from the DHDS — Atoms and molecules file).
+ * Current values are based on DHDS design conventions and 8pt grid.
+ */
+export declare const DHRE_ICON_SIZE: {
+    readonly XS: number;
+    readonly SM: number;
+    readonly MD: number;
+    readonly LG: number;
+    readonly XL: number;
+    readonly XXL: number;
+};
+export declare const DHRE_AVATAR_SIZE: {
+    readonly XS: number;
+    readonly SM: number;
+    readonly MD: number;
+    readonly LG: number;
+    readonly XL: number;
+    readonly XXL: number;
+};
+export declare const DHRE_COMPONENT_HEIGHT: {
+    readonly BUTTON_SM: number;
+    readonly BUTTON_MD: number;
+    readonly BUTTON_LG: number;
+    readonly INPUT_SM: number;
+    readonly INPUT_MD: number;
+    readonly INPUT_LG: number;
+    readonly TAB_BAR: number;
+    readonly HEADER: number;
+    readonly BOTTOM_SHEET: number;
+    readonly LIST_ITEM_SM: number;
+    readonly LIST_ITEM_MD: number;
+    readonly LIST_ITEM_LG: number;
+};
+export declare const DHRE_IMAGE_SIZE: {
+    readonly THUMB_SM: number;
+    readonly THUMB_MD: number;
+    readonly THUMB_LG: number;
+    readonly CARD_SM: number;
+    readonly CARD_MD: number;
+};
+export type IconSizeKey = keyof typeof DHRE_ICON_SIZE;
+export type AvatarSizeKey = keyof typeof DHRE_AVATAR_SIZE;
+export type ComponentHeightKey = keyof typeof DHRE_COMPONENT_HEIGHT;
+export type ImageSizeKey = keyof typeof DHRE_IMAGE_SIZE;

package/lib/theme/spacing.d.ts

@@ -0,0 +1,50 @@
+/**
+ * DHRE Spacing Tokens
+ * Primitive spacing scale — 4pt base grid.
+ * Use for margins, gaps, and layout whitespace.
+ * Values are responsive via moderateScale (baseline: 375pt).
+ */
+export declare const DHRE_SPACING_BASE: {
+    readonly SPACE_0: 0;
+    readonly SPACE_4: number;
+    readonly SPACE_6: number;
+    readonly SPACE_8: number;
+    readonly SPACE_16: number;
+    readonly SPACE_20: number;
+    readonly SPACE_24: number;
+    readonly SPACE_28: number;
+    readonly SPACE_32: number;
+    readonly SPACE_36: number;
+    readonly SPACE_40: number;
+    readonly SPACE_48: number;
+    readonly SPACE_56: number;
+    readonly SPACE_64: number;
+    readonly SPACE_72: number;
+    readonly SPACE_80: number;
+    readonly SPACE_88: number;
+    readonly SPACE_96: number;
+    readonly SPACE_104: number;
+    readonly SPACE_112: number;
+    readonly SPACE_120: number;
+    readonly SPACE_128: number;
+    readonly SPACE_136: number;
+    readonly SPACE_144: number;
+    readonly SPACE_152: number;
+    readonly SPACE_160: number;
+};
+/**
+ * Semantic spacing aliases mapped to the base scale.
+ * Prefer these named tokens over raw SPACE_N values in components.
+ */
+export declare const DHRE_SPACING: {
+    readonly NONE: 0;
+    readonly XS: number;
+    readonly SM: number;
+    readonly MD: number;
+    readonly LG: number;
+    readonly XL: number;
+    readonly XXL: number;
+    readonly XXXL: number;
+};
+export type SpacingBaseKey = keyof typeof DHRE_SPACING_BASE;
+export type SpacingKey = keyof typeof DHRE_SPACING;

package/lib/theme/stroke.d.ts

@@ -0,0 +1,15 @@
+/**
+ * DHRE Stroke (Border Width) Tokens
+ *
+ * ⚠️  IMPORTANT — Do NOT wrap these values in moderateScale / verticalScale.
+ * Border widths in React Native are physical pixels. Scaling a 1pt border
+ * produces sub-pixel values (e.g. 0.75) that render as blurry, anti-aliased
+ * edges on high-density (retina) displays. Always keep borders as integers.
+ */
+export declare const DHRE_STROKE: {
+    readonly NONE: 0;
+    readonly THIN: 1;
+    readonly MEDIUM: 2;
+    readonly THICK: 4;
+};
+export type StrokeKey = keyof typeof DHRE_STROKE;

package/lib/theme/themes.d.ts

@@ -7,6 +7,14 @@ declare const theme: {
         light: string;
         dark: string;
     };
+    SURFACE_PRIMARY_CARDS: {
+        light: string;
+        dark: string;
+    };
+    SURFACE_PRIMARY_TRANSPARENT: {
+        light: string;
+        dark: string;
+    };
     SURFACE_SECONDARY: {
         light: string;
         dark: string;
@@ -15,10 +23,18 @@ declare const theme: {
         light: string;
         dark: string;
     };
+    SURFACE_SECONDARY_TRANSPARENT: {
+        light: string;
+        dark: string;
+    };
     SURFACE_TERTIARY: {
         light: string;
         dark: string;
     };
+    SURFACE_TERTIARY_TRANSPARENT: {
+        light: string;
+        dark: string;
+    };
     SURFACE_STATIC: {
         light: string;
         dark: string;
@@ -35,6 +51,14 @@ declare const theme: {
         light: string;
         dark: string;
     };
+    SURFACE_DISABLE_DARK: {
+        light: string;
+        dark: string;
+    };
+    SURFACE_DISABLE_LIGHT: {
+        light: string;
+        dark: string;
+    };
     SURFACE_INVERTED: {
         light: string;
         dark: string;
@@ -51,6 +75,38 @@ declare const theme: {
         light: string;
         dark: string;
     };
+    SURFACE_SUCCESS: {
+        light: string;
+        dark: string;
+    };
+    SURFACE_SUCCESS_TRANSPARENT: {
+        light: string;
+        dark: string;
+    };
+    SURFACE_INFO: {
+        light: string;
+        dark: string;
+    };
+    SURFACE_INFO_TRANSPARENT: {
+        light: string;
+        dark: string;
+    };
+    SURFACE_WARNING: {
+        light: string;
+        dark: string;
+    };
+    SURFACE_WARNING_TRANSPARENT: {
+        light: string;
+        dark: string;
+    };
+    SURFACE_ERROR: {
+        light: string;
+        dark: string;
+    };
+    SURFACE_ERROR_TRANSPARENT: {
+        light: string;
+        dark: string;
+    };
     CONTENT_PRIMARY: {
         light: string;
         dark: string;
@@ -59,6 +115,10 @@ declare const theme: {
         light: string;
         dark: string;
     };
+    CONTENT_TERTIARY: {
+        light: string;
+        dark: string;
+    };
     CONTENT_SECONDARY_TEXT: {
         light: string;
         dark: string;
@@ -71,6 +131,14 @@ declare const theme: {
         light: string;
         dark: string;
     };
+    CONTENT_DISABLE_DARK: {
+        light: string;
+        dark: string;
+    };
+    CONTENT_DISABLE_LIGHT: {
+        light: string;
+        dark: string;
+    };
     CONTENT_INVERTED: {
         light: string;
         dark: string;
@@ -131,18 +199,42 @@ declare const theme: {
         light: string;
         dark: string;
     };
+    WARNING_EMPHASIS: {
+        light: string;
+        dark: string;
+    };
     SUCCESS: {
         light: string;
         dark: string;
     };
+    SUCCESS_EMPHASIS: {
+        light: string;
+        dark: string;
+    };
     INFO: {
         light: string;
         dark: string;
     };
+    INFO_EMPHASIS: {
+        light: string;
+        dark: string;
+    };
     ERROR: {
         light: string;
         dark: string;
     };
+    ERROR_EMPHASIS: {
+        light: string;
+        dark: string;
+    };
+    LINK: {
+        light: string;
+        dark: string;
+    };
+    LINK_INVERTED: {
+        light: string;
+        dark: string;
+    };
     TRANSPARENT_INVERTED: {
         light: string;
         dark: string;
@@ -159,5 +251,93 @@ declare const theme: {
         light: string;
         dark: string;
     };
+    BUTTON_DEFAULT_FILL: {
+        light: string;
+        dark: string;
+    };
+    BUTTON_HOVER_FILL: {
+        light: string;
+        dark: string;
+    };
+    BUTTON_HOVER_FILL_SECONDARY: {
+        light: string;
+        dark: string;
+    };
+    BUTTON_INVRTED_FILL: {
+        light: string;
+        dark: string;
+    };
+    BUTTON_DISABLED_FILL: {
+        light: string;
+        dark: string;
+    };
+    BUTTON_DISABLED_FILL_2: {
+        light: string;
+        dark: string;
+    };
+    BUTTON_SUCCESS_FILL: {
+        light: string;
+        dark: string;
+    };
+    NOTIFICATIONS_INFO: {
+        light: string;
+        dark: string;
+    };
+    NOTIFICATIONS_HIGHLIGHT: {
+        light: string;
+        dark: string;
+    };
+    BLUR_20: {
+        light: string;
+        dark: string;
+    };
+    BLUR_40: {
+        light: string;
+        dark: string;
+    };
+    STROKE_PRIMARY: {
+        dark: string;
+        light: string;
+    };
+    STROKE_SECONDARY: {
+        dark: string;
+        light: string;
+    };
+    STROKE_TERTIARY: {
+        dark: string;
+        light: string;
+    };
+    STROKE_INVERTED: {
+        dark: string;
+        light: string;
+    };
+    STROKE_ERROR: {
+        dark: string;
+        light: string;
+    };
+    STROKE_SUCCESS: {
+        dark: string;
+        light: string;
+    };
+    STROKE_INFO: {
+        dark: string;
+        light: string;
+    };
+    STROKE_WARNING: {
+        dark: string;
+        light: string;
+    };
+    STROKE_DISABLED_DARK: {
+        dark: string;
+        light: string;
+    };
+    STROKE_DISABLED_DARK2: {
+        dark: string;
+        light: string;
+    };
+    STROKE_ACTIVE: {
+        dark: string;
+        light: string;
+    };
 };
 export default theme;

package/lib/utils/appEnum.d.ts

@@ -23,14 +23,14 @@ export declare enum FontStyle {
     H6_BOLD = "H6_BOLD",
     H7_BOLD = "H7_BOLD",
     H8_BOLD = "H8_BOLD",
-    H1_REGULAR = "H1_REGULAR",
-    H2_REGULAR = "H2_REGULAR",
-    H3_REGULAR = "H3_REGULAR",
-    H4_REGULAR = "H4_REGULAR",
-    H5_REGULAR = "H5_REGULAR",
-    H6_REGULAR = "H6_REGULAR",
-    H7_REGULAR = "H7_REGULAR",
-    H8_REGULAR = "H8_REGULAR",
+    H1_MEDIUM = "H1_MEDIUM",
+    H2_MEDIUM = "H2_MEDIUM",
+    H3_MEDIUM = "H3_MEDIUM",
+    H4_MEDIUM = "H4_MEDIUM",
+    H5_MEDIUM = "H5_MEDIUM",
+    H6_MEDIUM = "H6_MEDIUM",
+    H7_MEDIUM = "H7_MEDIUM",
+    H8_MEDIUM = "H8_MEDIUM",
     H1_LIGHT = "H1_LIGHT",
     H2_LIGHT = "H2_LIGHT",
     H3_LIGHT = "H3_LIGHT",
@@ -39,6 +39,30 @@ export declare enum FontStyle {
     H6_LIGHT = "H6_LIGHT",
     H7_LIGHT = "H7_LIGHT",
     H8_LIGHT = "H8_LIGHT",
+    H1_LINK = "H1_LINK",
+    H2_LINK = "H2_LINK",
+    H3_LINK = "H3_LINK",
+    H4_LINK = "H4_LINK",
+    H5_LINK = "H5_LINK",
+    H6_LINK = "H6_LINK",
+    H7_LINK = "H7_LINK",
+    H8_LINK = "H8_LINK",
+    BODY1_BOLD = "BODY1_BOLD",
+    BODY2_BOLD = "BODY2_BOLD",
+    BODY3_BOLD = "BODY3_BOLD",
+    BODY4_BOLD = "BODY4_BOLD",
+    BODY1_MEDIUM = "BODY1_MEDIUM",
+    BODY2_MEDIUM = "BODY2_MEDIUM",
+    BODY3_MEDIUM = "BODY3_MEDIUM",
+    BODY4_MEDIUM = "BODY4_MEDIUM",
+    BODY1_LIGHT = "BODY1_LIGHT",
+    BODY2_LIGHT = "BODY2_LIGHT",
+    BODY3_LIGHT = "BODY3_LIGHT",
+    BODY4_LIGHT = "BODY4_LIGHT",
+    BODY1_LINK = "BODY1_LINK",
+    BODY2_LINK = "BODY2_LINK",
+    BODY3_LINK = "BODY3_LINK",
+    BODY4_LINK = "BODY4_LINK",
     B1_BOLD = "B1_BOLD",
     B2_BOLD = "B2_BOLD",
     B3_BOLD = "B3_BOLD",
@@ -57,20 +81,37 @@ export declare enum FontStyle {
 export declare enum Theme {
     SURFACE_PRIMARY = "SURFACE_PRIMARY",
     SURFACE_PRIMARY_NAKHEEL = "SURFACE_PRIMARY_NAKHEEL",
+    SURFACE_PRIMARY_CARDS = "SURFACE_PRIMARY_CARDS",
+    SURFACE_PRIMARY_TRANSPARENT = "SURFACE_PRIMARY_TRANSPARENT",
     SURFACE_SECONDARY = "SURFACE_SECONDARY",
     SURFACE_SECONDARY_NAKHEEL = "SURFACE_SECONDARY_NAKHEEL",
+    SURFACE_SECONDARY_TRANSPARENT = "SURFACE_SECONDARY_TRANSPARENT",
     SURFACE_TERTIARY = "SURFACE_TERTIARY",
+    SURFACE_TERTIARY_TRANSPARENT = "SURFACE_TERTIARY_TRANSPARENT",
     SURFACE_STATIC = "SURFACE_STATIC",
     SURFACE_BRAND_STATIC = "SURFACE_BRAND_STATIC",
     SURFACE_BRAND_TRANSPARENT_STATIC = "SURFACE_BRAND_TRANSPARENT_STATIC",
     SURFACE_DISABLE = "SURFACE_DISABLE",
+    SURFACE_DISABLE_DARK = "SURFACE_DISABLE_DARK",
+    SURFACE_DISABLE_LIGHT = "SURFACE_DISABLE_LIGHT",
     SURFACE_INVERTED = "SURFACE_INVERTED",
     SURFACE_INVERTED_TRANSPARENT = "SURFACE_INVERTED_TRANSPARENT",
     SURFACE_DROP_SHADOW = "SURFACE_DROP_SHADOW",
     SURFACE_BLUR = "SURFACE_BLUR",
+    SURFACE_SUCCESS = "SURFACE_SUCCESS",
+    SURFACE_SUCCESS_TRANSPARENT = "SURFACE_SUCCESS_TRANSPARENT",
+    SURFACE_INFO = "SURFACE_INFO",
+    SURFACE_INFO_TRANSPARENT = "SURFACE_INFO_TRANSPARENT",
+    SURFACE_WARNING = "SURFACE_WARNING",
+    SURFACE_WARNING_TRANSPARENT = "SURFACE_WARNING_TRANSPARENT",
+    SURFACE_ERROR = "SURFACE_ERROR",
+    SURFACE_ERROR_TRANSPARENT = "SURFACE_ERROR_TRANSPARENT",
     CONTENT_PRIMARY = "CONTENT_PRIMARY",
     CONTENT_SECONDRY = "CONTENT_SECONDRY",
+    CONTENT_TERTIARY = "CONTENT_TERTIARY",
     CONTENT_DISABLE = "CONTENT_DISABLE",
+    CONTENT_DISABLE_DARK = "CONTENT_DISABLE_DARK",
+    CONTENT_DISABLE_LIGHT = "CONTENT_DISABLE_LIGHT",
     CONTENT_INVERTED = "CONTENT_INVERTED",
     CONTENT_STATIC = "CONTENT_STATIC",
     CONTENT_PRIMARY_STATIC = "CONTENT_PRIMARY_STATIC",
@@ -88,11 +129,39 @@ export declare enum Theme {
     BORDER_STATIC = "BORDER_STATIC",
     BORDER_SEPRATOR = "BORDER_SEPRATOR",
     WARNING = "WARNING",
+    WARNING_EMPHASIS = "WARNING_EMPHASIS",
     SUCCESS = "SUCCESS",
+    SUCCESS_EMPHASIS = "SUCCESS_EMPHASIS",
     INFO = "INFO",
+    INFO_EMPHASIS = "INFO_EMPHASIS",
     ERROR = "ERROR",
+    ERROR_EMPHASIS = "ERROR_EMPHASIS",
+    LINK = "LINK",
+    LINK_INVERTED = "LINK_INVERTED",
     TRANSPARENT_INVERTED = "TRANSPARENT_INVERTED",
     SYSTEM_BLUE = "SYSTEM_BLUE",
     SYSTEM_BACKGROUND = "SYSTEM_BACKGROUND",
-    LIGHT_GRAY = "LIGHT_GRAY"
+    LIGHT_GRAY = "LIGHT_GRAY",
+    BUTTON_DEFAULT_FILL = "BUTTON_DEFAULT_FILL",
+    BUTTON_HOVER_FILL = "BUTTON_HOVER_FILL",
+    BUTTON_HOVER_FILL_SECONDARY = "BUTTON_HOVER_FILL_SECONDARY",
+    BUTTON_INVRTED_FILL = "BUTTON_INVRTED_FILL",
+    BUTTON_DISABLED_FILL = "BUTTON_DISABLED_FILL",
+    BUTTON_DISABLED_FILL_2 = "BUTTON_DISABLED_FILL_2",
+    BUTTON_SUCCESS_FILL = "BUTTON_SUCCESS_FILL",
+    NOTIFICATIONS_INFO = "NOTIFICATIONS_INFO",
+    NOTIFICATIONS_HIGHLIGHT = "NOTIFICATIONS_HIGHLIGHT",
+    BLUR_20 = "BLUR_20",
+    BLUR_40 = "BLUR_40",
+    STROKE_PRIMARY = "STROKE_PRIMARY",
+    STROKE_SECONDARY = "STROKE_SECONDARY",
+    STROKE_TERTIARY = "STROKE_TERTIARY",
+    STROKE_INVERTED = "STROKE_INVERTED",
+    STROKE_ERROR = "STROKE_ERROR",
+    STROKE_SUCCESS = "STROKE_SUCCESS",
+    STROKE_WARNING = "STROKE_WARNING",
+    STROKE_INFO = "STROKE_INFO",
+    STROKE_DISABLED_DARK = "STROKE_DISABLED_DARK",
+    STROKE_DISABLED_DARK2 = "STROKE_DISABLED_DARK2",
+    STROKE_ACTIVE = "STROKE_ACTIVE"
 }