@omnia/fx 8.0.53-vnext → 8.0.55-vnext

package/internal-do-not-import-from-here/ux/theming/components/ThemeDefinitionEditor.d.ts

@@ -109,9 +109,9 @@ declare const _default: {
             }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
                 [key: string]: any;
             }>) => void)[];
-            readonly "v-model"?: ThemeDefinition;
-            readonly modelValue?: ThemeDefinition;
             "onUpdate:modelValue"?: ((value: ThemeDefinition) => any) & ((value: ThemeDefinition) => any);
+            readonly modelValue?: ThemeDefinition;
+            readonly "v-model"?: ThemeDefinition;
             readonly attachedToParent?: boolean;
             readonly hideBodySettings?: boolean;
             readonly "hide-body-settings"?: boolean;
@@ -504,9 +504,9 @@ declare const _default: {
                 };
             }>;
         };
-        "v-model"?: ThemeDefinition;
-        modelValue?: ThemeDefinition;
         "onUpdate:modelValue"?: (value: ThemeDefinition) => any;
+        modelValue?: ThemeDefinition;
+        "v-model"?: ThemeDefinition;
         attachedToParent?: boolean;
         hideBodySettings?: boolean;
         "hide-body-settings"?: boolean;

package/internal-do-not-import-from-here/ux/theming-v2/BlueprintStore.d.ts

@@ -1,4 +1,4 @@
-import { BlockBlueprint, BlueprintDefinition, BlueprintItemDefinition, BlueprintType, BlueprintTypes, TypographyBlueprint, WebBlueprintDefintionType, WebBlueprintDefintionTypes } from "@omnia/fx-models";
+import { BlockBlueprint, BlueprintDefinition, BlueprintItemDefinition, BlueprintType, BlueprintTypes, SpacingBlueprint, TypographyBlueprint, WebBlueprintDefintionType, WebBlueprintDefintionTypes } from "@omnia/fx-models";
 import { useThemeStoreV2 } from "./ThemeStoreV2";
 export declare const useBlueprintStore: (newInstanceWithName?: string) => {
     state: {
@@ -10,6 +10,10 @@ export declare const useBlueprintStore: (newInstanceWithName?: string) => {
         byType: <TType extends BlueprintItemDefinition>(type: WebBlueprintDefintionTypes | WebBlueprintDefintionType) => TType;
         readonly typography: TypographyBlueprint;
         readonly block: BlockBlueprint;
+        spacing: {
+            readonly inner: SpacingBlueprint;
+            readonly layout: SpacingBlueprint;
+        };
     };
     actions: {
         setBlueprint: (type: BlueprintTypes | BlueprintType) => void;

package/internal-do-not-import-from-here/ux/theming-v2/ThemeContextStore.d.ts

@@ -6,7 +6,7 @@ export declare const useThemeContextStore: (newInstanceWithName?: string) => {
             };
             get: {
                 colorSchema: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
-                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes) => import("@omnia/fx-models").TypographyTypeDefinition;
+                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize | import("@omnia/fx-models").TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
                 color: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
                 colorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
                 complementaryColorType: (colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorTypes;
@@ -30,7 +30,7 @@ export declare const useThemeContextStore: (newInstanceWithName?: string) => {
             };
             get: {
                 colorSchema: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
-                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes) => import("@omnia/fx-models").TypographyTypeDefinition;
+                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize | import("@omnia/fx-models").TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
                 color: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
                 colorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
                 complementaryColorType: (colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorTypes;
@@ -56,7 +56,7 @@ export declare const useThemeContextStore: (newInstanceWithName?: string) => {
             };
             get: {
                 colorSchema: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
-                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes) => import("@omnia/fx-models").TypographyTypeDefinition;
+                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize | import("@omnia/fx-models").TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
                 color: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
                 colorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
                 complementaryColorType: (colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorTypes;
@@ -80,7 +80,7 @@ export declare const useThemeContextStore: (newInstanceWithName?: string) => {
             };
             get: {
                 colorSchema: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
-                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes) => import("@omnia/fx-models").TypographyTypeDefinition;
+                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize | import("@omnia/fx-models").TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
                 color: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
                 colorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
                 complementaryColorType: (colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorTypes;
@@ -107,7 +107,7 @@ export declare const useThemeContextStore: (newInstanceWithName?: string) => {
             };
             get: {
                 colorSchema: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
-                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes) => import("@omnia/fx-models").TypographyTypeDefinition;
+                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize | import("@omnia/fx-models").TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
                 color: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
                 colorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
                 complementaryColorType: (colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorTypes;
@@ -131,7 +131,7 @@ export declare const useThemeContextStore: (newInstanceWithName?: string) => {
             };
             get: {
                 colorSchema: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
-                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes) => import("@omnia/fx-models").TypographyTypeDefinition;
+                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize | import("@omnia/fx-models").TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
                 color: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
                 colorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
                 complementaryColorType: (colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorTypes;
@@ -155,7 +155,7 @@ export declare const useThemeContextStore: (newInstanceWithName?: string) => {
             };
             get: {
                 colorSchema: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
-                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes) => import("@omnia/fx-models").TypographyTypeDefinition;
+                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize | import("@omnia/fx-models").TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
                 color: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
                 colorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
                 complementaryColorType: (colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorTypes;
@@ -179,7 +179,7 @@ export declare const useThemeContextStore: (newInstanceWithName?: string) => {
             };
             get: {
                 colorSchema: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
-                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes) => import("@omnia/fx-models").TypographyTypeDefinition;
+                typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize | import("@omnia/fx-models").TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
                 color: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
                 colorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
                 complementaryColorType: (colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorTypes;

package/internal-do-not-import-from-here/ux/theming-v2/ThemeStoreV2.d.ts

@@ -1,11 +1,11 @@
-import { BlueprintType, BlueprintTypes, ColorSchemaType, ColorSchemaTypes, ColorType, ColorTypes, ThemeDefinitionV2, TypographyType, TypographyTypes } from "@omnia/fx-models";
+import { BlueprintType, BlueprintTypes, ColorSchemaType, ColorSchemaTypes, ColorType, ColorTypes, ThemeDefinitionV2, TypographySize, TypographySizes, TypographyType, TypographyTypes } from "@omnia/fx-models";
 export declare const useThemeStoreV2: (newInstanceWithName?: string) => {
     state: {
         currentTheme: import("./themes/Themes").ThemeDefinitionInstance;
     };
     get: {
         colorSchema: (colorSchemaType: ColorSchemaTypes | ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
-        typography: (typographyType: TypographyTypes | TypographyType) => import("@omnia/fx-models").TypographyTypeDefinition;
+        typography: (typographyType: TypographyTypes | TypographyType, size: TypographySize | TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
         color: (colorSchemaType: ColorSchemaTypes | ColorSchemaType, colorType: ColorTypes | ColorType) => string;
         colorDefinition: (colorSchemaType: ColorSchemaTypes | ColorSchemaType, colorType: ColorTypes | ColorType) => import("@omnia/fx-models").ColorDefinition;
         complementaryColorType: (colorType: ColorTypes | ColorType) => ColorTypes;

package/internal-do-not-import-from-here/ux/theming-v2/blueprintpicker/BlueprintPicker.d.ts

@@ -110,9 +110,9 @@ declare const _default: {
             }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
                 [key: string]: any;
             }>) => void)[];
-            readonly "v-model"?: BlueprintType | BlueprintTypes;
-            readonly modelValue?: BlueprintType | BlueprintTypes;
             "onUpdate:modelValue"?: ((value: BlueprintType | BlueprintTypes) => any) & ((value: BlueprintTypes) => any);
+            readonly modelValue?: BlueprintType | BlueprintTypes;
+            readonly "v-model"?: BlueprintType | BlueprintTypes;
         };
         $attrs: {
             [x: string]: unknown;
@@ -441,9 +441,9 @@ declare const _default: {
                 };
             }>;
         };
-        "v-model"?: BlueprintType | BlueprintTypes;
-        modelValue?: BlueprintType | BlueprintTypes;
         "onUpdate:modelValue"?: (value: BlueprintType | BlueprintTypes) => any;
+        modelValue?: BlueprintType | BlueprintTypes;
+        "v-model"?: BlueprintType | BlueprintTypes;
     }>, "onUpdate:modelValue"> & {
         "onUpdate:modelValue"?: (value: BlueprintTypes) => any;
     };

package/internal-do-not-import-from-here/ux/theming-v2/colorschemadefinitionpicker/ColorSchemaDefinitionPicker.d.ts

@@ -7,8 +7,8 @@ declare const _default: {
         $props: {
             container?: any;
             blueprint?: any;
-            colorSchemaType?: any;
             blueprintType?: any;
+            colorSchemaType?: any;
             colors?: any;
             style?: unknown;
             class?: unknown;
@@ -120,9 +120,9 @@ declare const _default: {
             } & {
                 activator?: () => VNodeChild;
             };
-            readonly "v-model"?: unknown;
-            readonly modelValue?: unknown;
             "onUpdate:modelValue"?: ((value: unknown) => any) & ((colorSchema: ColorSchema) => any);
+            readonly modelValue?: unknown;
+            readonly "v-model"?: unknown;
         };
         $attrs: {
             [x: string]: unknown;
@@ -221,8 +221,8 @@ declare const _default: {
         }, string, {
             container?: any;
             blueprint?: any;
-            colorSchemaType?: any;
             blueprintType?: any;
+            colorSchemaType?: any;
             colors?: any;
         }, {}, string, {}> & {
             beforeCreate?: (() => void) | (() => void)[];
@@ -411,15 +411,15 @@ declare const _default: {
 }, string, {
     container?: any;
     blueprint?: any;
-    colorSchemaType?: any;
     blueprintType?: any;
+    colorSchemaType?: any;
     colors?: any;
 }, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & {
     propsDefinition: Omit<Readonly<{
         container?: any;
         blueprint?: any;
-        colorSchemaType?: any;
         blueprintType?: any;
+        colorSchemaType?: any;
         colors?: any;
     } & {
         name?: {
@@ -488,9 +488,9 @@ declare const _default: {
         } & {
             activator?: () => VNodeChild;
         };
-        "v-model"?: unknown;
-        modelValue?: unknown;
         "onUpdate:modelValue"?: (value: unknown) => any;
+        modelValue?: unknown;
+        "v-model"?: unknown;
     }>, "onUpdate:modelValue"> & {
         "onUpdate:modelValue"?: (colorSchema: ColorSchema) => any;
     };

package/internal-do-not-import-from-here/ux/theming-v2/colorschemapicker/ColorSchemaPicker.d.ts

@@ -112,9 +112,9 @@ declare const _default: {
             }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
                 [key: string]: any;
             }>) => void)[];
-            readonly "v-model"?: ColorSchemaTypes | ColorSchemaType;
-            readonly modelValue?: ColorSchemaTypes | ColorSchemaType;
             "onUpdate:modelValue"?: ((value: ColorSchemaTypes | ColorSchemaType) => any) & ((value: ColorSchemaTypes) => any);
+            readonly modelValue?: ColorSchemaTypes | ColorSchemaType;
+            readonly "v-model"?: ColorSchemaTypes | ColorSchemaType;
         };
         $attrs: {
             [x: string]: unknown;
@@ -463,9 +463,9 @@ declare const _default: {
         };
         themeDefinition?: ThemeDefinitionV2;
         "theme-definition"?: ThemeDefinitionV2;
-        "v-model"?: ColorSchemaTypes | ColorSchemaType;
-        modelValue?: ColorSchemaTypes | ColorSchemaType;
         "onUpdate:modelValue"?: (value: ColorSchemaTypes | ColorSchemaType) => any;
+        modelValue?: ColorSchemaTypes | ColorSchemaType;
+        "v-model"?: ColorSchemaTypes | ColorSchemaType;
     }>, "onUpdate:modelValue"> & {
         "onUpdate:modelValue"?: (value: ColorSchemaTypes) => any;
     };

package/internal-do-not-import-from-here/ux/theming-v2/styling/UseThemeStyling.d.ts

@@ -0,0 +1,188 @@
+import { useBlueprintStore } from "../BlueprintStore";
+import { WebBlueprintDefintionTypes, setColorOpacity } from "@omnia/fx-models";
+export declare function useThemeStyling(): {
+    colors: {
+        dividingOpacity: (dark: boolean) => string;
+        backgroundOpacity: (dark: boolean, opacity?: Number) => string;
+        setColorOpacity: typeof setColorOpacity;
+    };
+    styles: {
+        selectedTableRowStyling: typeof import("./styles").getSelectedTableRowStyling;
+        colorStyling: (color: string, opacity?: number) => import("@omnia/fx-models").ColorStyles;
+        scrollStyling: typeof import("./styles").getScrollStyling;
+    };
+    typography: {
+        typeStyling: (typographyType: import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize, blueprint: import("@omnia/fx-models").TypographyBlueprint) => {
+            baseStyles: {
+                fontSize: string;
+                fontWeight: number;
+                lineHeight: string;
+                textDecoration: string;
+            };
+            mediumStyles: any;
+            smallStyles: any;
+            queryOnSmallScreen: import("typestyle/lib/types").MediaQuery;
+            queryOnMediumScreen: import("typestyle/lib/types").MediaQuery;
+        };
+        styling: (blueprints: {
+            state: {
+                blueprint: import("@omnia/fx-models").BlueprintDefinition;
+                blueprintType: import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes;
+            };
+            get: {
+                readonly all: import("@omnia/fx-models").BlueprintDefinition;
+                byType: <TType extends import("@omnia/fx-models").BlueprintItemDefinition>(type: import("@omnia/fx-models").WebBlueprintDefintionType | WebBlueprintDefintionTypes) => TType;
+                readonly typography: import("@omnia/fx-models").TypographyBlueprint;
+                readonly block: import("@omnia/fx-models").BlockBlueprint;
+                spacing: {
+                    readonly inner: import("@omnia/fx-models").SpacingBlueprint;
+                    readonly layout: import("@omnia/fx-models").SpacingBlueprint;
+                };
+            };
+            actions: {
+                setBlueprint: (type: import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes) => void;
+                setThemeStore: (themeStoreInstance: {
+                    state: {
+                        currentTheme: import("..").ThemeDefinitionInstance;
+                    };
+                    get: {
+                        colorSchema: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
+                        typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize | import("@omnia/fx-models").TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
+                        color: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
+                        colorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
+                        complementaryColorType: (colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorTypes;
+                        complementaryColor: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
+                        complementaryColorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
+                        currentTheme: () => import("@omnia/fx-models").ThemeDefinitionV2;
+                        blueprint: (blueprintType: import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes) => import("@omnia/fx-models").BlueprintDefinition;
+                    };
+                    actions: {
+                        setTheme: (themeDefinition: import("@omnia/fx-models").ThemeDefinitionV2) => void;
+                    };
+                    events: {
+                        onMutatingCurrentTheme: import("../../..").EventHook<import("..").ThemeDefinitionInstance>;
+                        onMutatedCurrentTheme: import("../../..").EventHook<import("..").ThemeDefinitionInstance>;
+                    };
+                    deactivated(): void;
+                }) => void;
+                setCustomBlueprint: (blueprint: import("@omnia/fx-models").BlueprintDefinition) => void;
+            };
+            events: {
+                onMutatingBlueprint: import("../../..").EventHook<import("@omnia/fx-models").BlueprintDefinition>;
+                onMutatedBlueprint: import("../../..").EventHook<import("@omnia/fx-models").BlueprintDefinition>;
+                onMutatingBlueprintType: import("../../..").EventHook<import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes>;
+                onMutatedBlueprintType: import("../../..").EventHook<import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes>;
+            };
+            deactivated(): void;
+        }) => import("./styles").TypographyTypesResult;
+    };
+    blueprints: {
+        block: (blueprint: import("@omnia/fx-models").BlockBlueprint, colors: import("@omnia/fx-models").ColorSchema) => string;
+        button: (bluePrint?: {
+            state: {
+                blueprint: import("@omnia/fx-models").BlueprintDefinition;
+                blueprintType: import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes;
+            };
+            get: {
+                readonly all: import("@omnia/fx-models").BlueprintDefinition;
+                byType: <TType extends import("@omnia/fx-models").BlueprintItemDefinition>(type: import("@omnia/fx-models").WebBlueprintDefintionType | WebBlueprintDefintionTypes) => TType;
+                readonly typography: import("@omnia/fx-models").TypographyBlueprint;
+                readonly block: import("@omnia/fx-models").BlockBlueprint;
+                spacing: {
+                    readonly inner: import("@omnia/fx-models").SpacingBlueprint;
+                    readonly layout: import("@omnia/fx-models").SpacingBlueprint;
+                };
+            };
+            actions: {
+                setBlueprint: (type: import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes) => void;
+                setThemeStore: (themeStoreInstance: {
+                    state: {
+                        currentTheme: import("..").ThemeDefinitionInstance;
+                    };
+                    get: {
+                        colorSchema: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
+                        typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize | import("@omnia/fx-models").TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
+                        color: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
+                        colorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
+                        complementaryColorType: (colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorTypes;
+                        complementaryColor: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
+                        complementaryColorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
+                        currentTheme: () => import("@omnia/fx-models").ThemeDefinitionV2;
+                        blueprint: (blueprintType: import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes) => import("@omnia/fx-models").BlueprintDefinition;
+                    };
+                    actions: {
+                        setTheme: (themeDefinition: import("@omnia/fx-models").ThemeDefinitionV2) => void;
+                    };
+                    events: {
+                        onMutatingCurrentTheme: import("../../..").EventHook<import("..").ThemeDefinitionInstance>;
+                        onMutatedCurrentTheme: import("../../..").EventHook<import("..").ThemeDefinitionInstance>;
+                    };
+                    deactivated(): void;
+                }) => void;
+                setCustomBlueprint: (blueprint: import("@omnia/fx-models").BlueprintDefinition) => void;
+            };
+            events: {
+                onMutatingBlueprint: import("../../..").EventHook<import("@omnia/fx-models").BlueprintDefinition>;
+                onMutatedBlueprint: import("../../..").EventHook<import("@omnia/fx-models").BlueprintDefinition>;
+                onMutatingBlueprintType: import("../../..").EventHook<import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes>;
+                onMutatedBlueprintType: import("../../..").EventHook<import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes>;
+            };
+            deactivated(): void;
+        }) => string;
+        icon: (bluePrint?: {
+            state: {
+                blueprint: import("@omnia/fx-models").BlueprintDefinition;
+                blueprintType: import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes;
+            };
+            get: {
+                readonly all: import("@omnia/fx-models").BlueprintDefinition;
+                byType: <TType extends import("@omnia/fx-models").BlueprintItemDefinition>(type: import("@omnia/fx-models").WebBlueprintDefintionType | WebBlueprintDefintionTypes) => TType;
+                readonly typography: import("@omnia/fx-models").TypographyBlueprint;
+                readonly block: import("@omnia/fx-models").BlockBlueprint;
+                spacing: {
+                    readonly inner: import("@omnia/fx-models").SpacingBlueprint;
+                    readonly layout: import("@omnia/fx-models").SpacingBlueprint;
+                };
+            };
+            actions: {
+                setBlueprint: (type: import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes) => void;
+                setThemeStore: (themeStoreInstance: {
+                    state: {
+                        currentTheme: import("..").ThemeDefinitionInstance;
+                    };
+                    get: {
+                        colorSchema: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType) => import("@omnia/fx-models").ColorSchema;
+                        typography: (typographyType: import("@omnia/fx-models").TypographyType | import("@omnia/fx-models").TypographyTypes, size: import("@omnia/fx-models").TypographySize | import("@omnia/fx-models").TypographySizes) => import("@omnia/fx-models").TypographyTypeDefinition;
+                        color: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
+                        colorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
+                        complementaryColorType: (colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorTypes;
+                        complementaryColor: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => string;
+                        complementaryColorDefinition: (colorSchemaType: import("@omnia/fx-models").ColorSchemaTypes | import("@omnia/fx-models").ColorSchemaType, colorType: import("@omnia/fx-models").ColorType | import("@omnia/fx-models").ColorTypes) => import("@omnia/fx-models").ColorDefinition;
+                        currentTheme: () => import("@omnia/fx-models").ThemeDefinitionV2;
+                        blueprint: (blueprintType: import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes) => import("@omnia/fx-models").BlueprintDefinition;
+                    };
+                    actions: {
+                        setTheme: (themeDefinition: import("@omnia/fx-models").ThemeDefinitionV2) => void;
+                    };
+                    events: {
+                        onMutatingCurrentTheme: import("../../..").EventHook<import("..").ThemeDefinitionInstance>;
+                        onMutatedCurrentTheme: import("../../..").EventHook<import("..").ThemeDefinitionInstance>;
+                    };
+                    deactivated(): void;
+                }) => void;
+                setCustomBlueprint: (blueprint: import("@omnia/fx-models").BlueprintDefinition) => void;
+            };
+            events: {
+                onMutatingBlueprint: import("../../..").EventHook<import("@omnia/fx-models").BlueprintDefinition>;
+                onMutatedBlueprint: import("../../..").EventHook<import("@omnia/fx-models").BlueprintDefinition>;
+                onMutatingBlueprintType: import("../../..").EventHook<import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes>;
+                onMutatedBlueprintType: import("../../..").EventHook<import("@omnia/fx-models").BlueprintType | import("@omnia/fx-models").BlueprintTypes>;
+            };
+            deactivated(): void;
+        }) => string;
+        spacing: {
+            inner: (value: any, blueprints?: ReturnType<typeof useBlueprintStore>) => number;
+            layout: (value: any, blueprints?: ReturnType<typeof useBlueprintStore>) => number;
+        };
+    };
+};

package/internal-do-not-import-from-here/ux/theming-v2/styling/index.d.ts

@@ -1,3 +1 @@
-export * from "./UseBlueprintStyling";
-export * from "./UseComponentStyling";
-export * from "./UseTypographyStyling";
+export * from "./UseThemeStyling";

package/internal-do-not-import-from-here/ux/theming-v2/styling/styles/Blueprints.d.ts

@@ -0,0 +1,14 @@
+import { BlockBlueprint, ColorSchema, WebBlueprintDefintionTypes } from "@omnia/fx-models";
+import { useBlueprintStore } from "../../BlueprintStore";
+export declare const BlueprintStyles: {
+    getBlueprintSpacingValue: typeof getBlueprintSpacingValue;
+    getButtonBlueprintStyling: typeof getButtonBlueprintStyling;
+    getIconBlueprintStyling: typeof getIconBlueprintStyling;
+    getBlockBlueprintStyling: typeof getBlockBlueprintStyling;
+};
+/**Blueprint styling */
+declare function getBlueprintSpacingValue(value: any, type: WebBlueprintDefintionTypes.innerspacing | WebBlueprintDefintionTypes.layoutspacing, blueprints?: ReturnType<typeof useBlueprintStore>): number;
+declare function getButtonBlueprintStyling(bluePrint?: ReturnType<typeof useBlueprintStore>): string;
+declare function getIconBlueprintStyling(bluePrint?: ReturnType<typeof useBlueprintStore>): string;
+declare function getBlockBlueprintStyling(blueprint: BlockBlueprint, colors: ColorSchema): string;
+export {};

package/internal-do-not-import-from-here/ux/theming-v2/styling/styles/Colors.d.ts

@@ -0,0 +1,12 @@
+import { ColorStyles } from "@omnia/fx-models";
+export declare const ColorStyling: {
+    dividingOpacity: typeof dividingOpacity;
+    backgroundOpacity: typeof backgroundOpacity;
+    backgroundOpacityOnColor: typeof backgroundOpacityOnColor;
+    getColorStyling: typeof getColorStyling;
+};
+declare function dividingOpacity(dark: boolean): string;
+declare function backgroundOpacity(dark: boolean, opacity?: Number): string;
+declare function backgroundOpacityOnColor(color: string, dark: boolean, opacity?: Number): any;
+declare function getColorStyling(color: string, opacity?: number): ColorStyles;
+export {};

package/internal-do-not-import-from-here/ux/theming-v2/styling/styles/General.d.ts

@@ -0,0 +1,7 @@
+import { useColorSchemaStore } from "../../ColorSchemaStore";
+export declare const GeneralStyles: {
+    getSelectedTableRowStyling: typeof getSelectedTableRowStyling;
+    getScrollStyling: typeof getScrollStyling;
+};
+export declare function getSelectedTableRowStyling(dark: boolean): string;
+export declare function getScrollStyling(colors: ReturnType<typeof useColorSchemaStore>, toned?: boolean, targetSelector?: string): string;

package/internal-do-not-import-from-here/ux/theming-v2/styling/styles/Typography.d.ts

@@ -0,0 +1,45 @@
+/**Typography */
+import { TypographyBlueprint, TypographySize, TypographyTypes } from "@omnia/fx-models";
+import { MediaQuery } from "typestyle/lib/types";
+import { useBlueprintStore } from "../..";
+export declare const TypographyStyles: {
+    typographyTypeStyling: typeof typographyTypeStyling;
+    typographyStyling: typeof typographyStyling;
+};
+export interface TypographyTypesResult {
+    title: {
+        xl: string;
+        l: string;
+        m: string;
+        s: string;
+        xs: string;
+    };
+    text: {
+        l: string;
+        m: string;
+        s: string;
+        xs: string;
+    };
+    navigation: {
+        l: string;
+        m: string;
+    };
+    link: {
+        m: string;
+    };
+    typographyType: (typographyType: string) => string;
+}
+declare function typographyTypeStyling(typographyType: TypographyTypes, size: TypographySize, blueprint: TypographyBlueprint): {
+    baseStyles: {
+        fontSize: string;
+        fontWeight: number;
+        lineHeight: string;
+        textDecoration: string;
+    };
+    mediumStyles: any;
+    smallStyles: any;
+    queryOnSmallScreen: MediaQuery;
+    queryOnMediumScreen: MediaQuery;
+};
+declare function typographyStyling(blueprints: ReturnType<typeof useBlueprintStore>): TypographyTypesResult;
+export {};

package/internal-do-not-import-from-here/ux/theming-v2/styling/styles/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./Blueprints";
+export * from "./Colors";
+export * from "./General";
+export * from "./Typography";

package/internal-do-not-import-from-here/ux/theming-v2/themedefinitionpicker/ThemeDefinitionPicker.d.ts

@@ -6,8 +6,8 @@ declare const _default: {
         $props: {
             container?: any;
             blueprint?: any;
-            colorSchemaType?: any;
             blueprintType?: any;
+            colorSchemaType?: any;
             colors?: any;
             style?: unknown;
             class?: unknown;
@@ -114,10 +114,10 @@ declare const _default: {
             }>) => void) | ((vnode: import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
                 [key: string]: any;
             }>) => void)[];
+            "onUpdate:modelValue"?: ((value: Guid) => any) & ((theme: ThemeDefinitionV2) => any);
+            readonly modelValue?: Guid;
             readonly toned?: string;
             readonly "v-model"?: Guid;
-            readonly modelValue?: Guid;
-            "onUpdate:modelValue"?: ((value: Guid) => any) & ((theme: ThemeDefinitionV2) => any);
         };
         $attrs: {
             [x: string]: unknown;
@@ -216,8 +216,8 @@ declare const _default: {
         }, string, {
             container?: any;
             blueprint?: any;
-            colorSchemaType?: any;
             blueprintType?: any;
+            colorSchemaType?: any;
             colors?: any;
         }, {}, string, {}> & {
             beforeCreate?: (() => void) | (() => void)[];
@@ -406,15 +406,15 @@ declare const _default: {
 }, string, {
     container?: any;
     blueprint?: any;
-    colorSchemaType?: any;
     blueprintType?: any;
+    colorSchemaType?: any;
     colors?: any;
 }, {}, string, {}> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & {
     propsDefinition: Omit<Readonly<{
         container?: any;
         blueprint?: any;
-        colorSchemaType?: any;
         blueprintType?: any;
+        colorSchemaType?: any;
         colors?: any;
     } & {
         name?: {
@@ -478,10 +478,10 @@ declare const _default: {
                 };
             }>;
         };
+        "onUpdate:modelValue"?: (value: Guid) => any;
+        modelValue?: Guid;
         toned?: string;
         "v-model"?: Guid;
-        modelValue?: Guid;
-        "onUpdate:modelValue"?: (value: Guid) => any;
     }>, "onUpdate:modelValue"> & {
         "onUpdate:modelValue"?: (theme: ThemeDefinitionV2) => any;
     };