@omnia/fx 8.0.476-dev → 8.0.478-dev

package/internal-do-not-import-from-here/stores/SizeContainerStore.d.ts

@@ -1,3 +1,4 @@
+import { DisplayBreakpointTypes } from "../models";
 export declare const useSizeContainerStore: () => {
     state: {
         width: string;
@@ -9,6 +10,9 @@ export declare const useSizeContainerStore: () => {
     }, Record<string, import("@omnia/fx-models").IMessageBusTopicPublishSubscriber<any>>>;
     actions: import("./DefineStore").StoreReturnDefineAction<{
         setWidth: (width: string) => void;
+        resetWidth: () => void;
+        setBreakPoint: (breakPoint: DisplayBreakpointTypes) => void;
+        resetZoomLevel: () => void;
         setZoomLevel: (zoomLevel: number) => void;
     }>;
     get: {};

package/internal-do-not-import-from-here/ux/editorchrome/EditorChrome_testSetup.d.ts

@@ -0,0 +1,31 @@
+import { IChromeActionItem, IEditorChromeRegistration } from "@omnia/fx-models";
+import { useEditorChromeStore } from "..";
+export declare function useDefineEditorChromeTestSetup(editorStore: ReturnType<typeof useEditorChromeStore>): {
+    tabs: {
+        tab1: IEditorChromeRegistration;
+        tab2: IEditorChromeRegistration;
+        tab3: IEditorChromeRegistration;
+    };
+    buttons: {
+        header: {
+            toggleGrid: IChromeActionItem;
+        };
+        footer: {
+            active: IChromeActionItem;
+            noToggle: IChromeActionItem;
+            toggle: IChromeActionItem;
+            approve: IChromeActionItem;
+            cancel: IChromeActionItem;
+            extendedButton1: IChromeActionItem;
+            extendedButton2: IChromeActionItem;
+            extendedButton3: IChromeActionItem;
+        };
+        drawer: {
+            settingsTab: IChromeActionItem;
+            drawerToolbarSettings: IChromeActionItem;
+            drawerToolbarPreview: IChromeActionItem;
+            drawerToolbarNoToggle: IChromeActionItem;
+        };
+    };
+    registerTabs: () => void;
+};

package/internal-do-not-import-from-here/ux/editorchrome/buttons/ToolbarButton.css.d.ts

@@ -73,5 +73,5 @@ export declare const ToolbarButtonStyles: {
             object: typeof import("../../aurora/styling/styles").TextStyles.getBlueprintTextStylingObject;
         };
     };
-    wrapper: (dark: boolean, border: "left" | "right" | "left right") => string;
+    wrapper: (dark: boolean, border: "left" | "right" | "left right" | "bottom") => string;
 };

package/internal-do-not-import-from-here/ux/editorchrome/buttons/ToolbarButton.d.ts

@@ -1,9 +1,9 @@
 import { DefineProp, DefinePropTheming } from "@omnia/fx/ux";
 import { IIcon } from "@omnia/fx-models";
-type ToolbarButtonProps = DefinePropTheming & DefineProp<"icon", IIcon> & DefineProp<"active", boolean> & DefineProp<"title", string> & DefineProp<"border", "left" | "right" | "left right">;
+type ToolbarButtonProps = DefinePropTheming & DefineProp<"icon", IIcon> & DefineProp<"active", boolean> & DefineProp<"loading", boolean> & DefineProp<"disabled", boolean> & DefineProp<"position", "topBar" | "bottomBar" | "rightBar"> & DefineProp<"title", string> & DefineProp<"border", "left" | "right" | "left right" | "bottom">;
 declare const _default: (props: import("@omnia/fx/ux").ExtractProps<ToolbarButtonProps> & {} & {
     "v-slots"?: {} & Omit<{
         default?: import("vue").Slot;
     }, never>;
-} & {} & Omit<import("@omnia/fx/ux").VueComponentBaseProps, "icon" | "border" | "title" | "colorSchemaType" | "active" | "colors"> & import("@omnia/fx/ux").VNodeEvents) => any;
+} & {} & Omit<import("@omnia/fx/ux").VueComponentBaseProps, "icon" | "border" | "position" | "title" | "colorSchemaType" | "active" | "disabled" | "loading" | "colors"> & import("@omnia/fx/ux").VNodeEvents) => any;
 export default _default;

package/internal-do-not-import-from-here/ux/editorchrome/hooks/index.d.ts

@@ -0,0 +1 @@
+export * from "./useRenderActions";

package/internal-do-not-import-from-here/ux/editorchrome/hooks/useRenderActions.d.ts

@@ -0,0 +1,32 @@
+import { IChromeActionItem } from "@omnia/fx-models";
+export interface RenderActionsOptions {
+    /**
+     * The border style for the toolbar buttons
+     * @default "right"
+     */
+    border?: "left" | "right" | "left right" | "bottom";
+    startBorder?: "left" | "right" | "left right" | "bottom";
+    /**
+     * Whether to disable the toggle functionality
+     * @default false
+     */
+    disableToggle?: boolean;
+    /**
+     * The position of the toolbar
+     */
+    position: "topBar" | "bottomBar" | "rightBar";
+    /**
+     * The rendering key to use for Vue reactivity
+     */
+    renderingKey: string;
+    /**
+     * The sync function to call after button interactions
+     */
+    syncFunction: () => void;
+}
+/**
+ * Custom hook for rendering action buttons with consistent double-click prevention and async handling
+ * @param options Configuration options for rendering actions
+ * @returns Function to render actions
+ */
+export declare function useRenderActions(options: RenderActionsOptions): (items: IChromeActionItem[]) => import("vue").VNodeChild[];

package/internal-do-not-import-from-here/ux/editorchrome/renderers/EditorChromeCompactRenderer.d.ts

@@ -0,0 +1,11 @@
+import { DefineEmit, DefineProp } from "@omnia/fx/ux";
+import { IIcon, guid } from "../../../models";
+type EditorChromeProps = DefineProp<"icon", IIcon> & DefineProp<"title", string> & DefineProp<"subTitle", string> & DefineProp<"actionToolbarRoles", guid[]> & DefineProp<"hideCloseButton", boolean> & DefineEmit<"close", () => true>;
+declare const _default: (props: import("@omnia/fx/ux").ExtractProps<EditorChromeProps> & {
+    onClose?: () => any;
+} & {
+    "v-slots"?: {} & Omit<{
+        default?: import("vue").Slot;
+    }, never>;
+} & {} & Omit<import("@omnia/fx/ux").VueComponentBaseProps, "icon" | "title" | "hideCloseButton" | "subTitle" | "actionToolbarRoles" | "emit:close"> & import("@omnia/fx/ux").VNodeEvents) => any;
+export default _default;

package/internal-do-not-import-from-here/ux/editorchrome/renderers/EditorChromeRegularRenderer.d.ts

@@ -0,0 +1,11 @@
+import { DefineEmit, DefineProp } from "@omnia/fx/ux";
+import { IIcon, guid } from "../../../models";
+type EditorChromeProps = DefineProp<"icon", IIcon> & DefineProp<"title", string> & DefineProp<"subTitle", string> & DefineProp<"actionToolbarRoles", guid[]> & DefineProp<"hideCloseButton", boolean> & DefineEmit<"close", () => true>;
+declare const _default: (props: import("@omnia/fx/ux").ExtractProps<EditorChromeProps> & {
+    onClose?: () => any;
+} & {
+    "v-slots"?: {} & Omit<{
+        default?: import("vue").Slot;
+    }, never>;
+} & {} & Omit<import("@omnia/fx/ux").VueComponentBaseProps, "icon" | "title" | "hideCloseButton" | "subTitle" | "actionToolbarRoles" | "emit:close"> & import("@omnia/fx/ux").VNodeEvents) => any;
+export default _default;

package/internal-do-not-import-from-here/ux/editorchrome/renderers/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./EditorChromeRegularRenderer";
+export * from "./EditorChromeCompactRenderer";

package/internal-do-not-import-from-here/ux/editorchrome/stores/EditorChromeStoreV2.d.ts

@@ -3,10 +3,22 @@ import { DisplayBreakpointTypes, guid, IEditorChromeRegistration, NotificationMe
 export declare const useEditorChromeStore: () => {
     state: {
         finishedLoading: boolean;
-        renderingKey: guid;
+        compactMode: boolean;
+        renderingKeys: {
+            header: guid;
+            footer: guid;
+            leftDrawer: guid;
+            rightDrawer: guid;
+        };
         drawers: {
-            showLeftDrawer: boolean;
-            showRightDrawer: boolean;
+            left: {
+                enabled: boolean;
+                show: boolean;
+            };
+            right: {
+                enabled: boolean;
+                show: boolean;
+            };
         };
         tabs: {
             activeIndex: number;
@@ -14,6 +26,64 @@ export declare const useEditorChromeStore: () => {
             items: IEditorChromeRegistration[];
         };
         canvasSettings: {
+            scroll: {
+                store: {
+                    state: {
+                        elementRef: HTMLElement;
+                        elementId: string;
+                        disableScrolling: boolean;
+                        height: string;
+                        width: string;
+                        scrollingDirection: import("@omnia/fx-models").OScrollTypesCombination;
+                        coordinates: {
+                            readonly left: number;
+                            readonly right: number;
+                            readonly bottom: number;
+                            readonly top: number;
+                        };
+                    };
+                    events: import("@omnia/fx/stores").StoreEvents<{
+                        elementRef: HTMLElement;
+                        elementId: string;
+                        disableScrolling: boolean;
+                        height: string;
+                        width: string;
+                        scrollingDirection: import("@omnia/fx-models").OScrollTypesCombination;
+                        coordinates: {
+                            readonly left: number;
+                            readonly right: number;
+                            readonly bottom: number;
+                            readonly top: number;
+                        };
+                    }, Record<string, import("@omnia/fx-models").IMessageBusTopicPublishSubscriber<any>>>;
+                    actions: import("@omnia/fx/stores").StoreReturnDefineAction<{
+                        scroll: () => void;
+                        calculateDynamicHeight: () => void;
+                        setHeight: (height: string) => void;
+                        setWidth: (width: string) => void;
+                        setScrolling: (scrolling: import("@omnia/fx-models").OScrollTypesCombination) => void;
+                        calculateScrollHeight: (referenceElementIds: string[]) => void;
+                        isElementNameStillInView: (elementName: string) => boolean;
+                        isElementIdStillInView: (elementId: string) => boolean;
+                        scrollToStart: () => void;
+                        scrollToElementId: (elementId: string, anchor?: import("../..").AnchorPosition, handler?: (target: HTMLElement, container: HTMLElement) => void, immediate?: boolean) => void;
+                        scrollToElementName: (elementName: string, anchor?: import("../..").AnchorPosition) => void;
+                        scrollToElement: (element: HTMLElement, anchor?: import("../..").AnchorPosition, handler?: (target: HTMLElement, container: HTMLElement) => void) => void;
+                        scrollToSelector: (selector: string, anchor?: import("../..").AnchorPosition, handler?: (target: HTMLElement, container: HTMLElement) => void, immediate?: boolean) => void;
+                    }>;
+                    get: {
+                        readonly coordinates: {
+                            readonly left: number;
+                            readonly right: number;
+                            readonly bottom: number;
+                            readonly top: number;
+                        };
+                        readonly scrollPosition: number;
+                    };
+                } & {
+                    dispose?: () => void;
+                };
+            };
             zoom: {
                 enabled: boolean;
                 level: number;
@@ -21,6 +91,26 @@ export declare const useEditorChromeStore: () => {
             displaySize: {
                 enabled: boolean;
                 value: "l" | "s" | "m";
+                store: {
+                    state: {
+                        width: string;
+                        zoomLevel: number;
+                    };
+                    events: import("@omnia/fx/stores").StoreEvents<{
+                        width: string;
+                        zoomLevel: number;
+                    }, Record<string, import("@omnia/fx-models").IMessageBusTopicPublishSubscriber<any>>>;
+                    actions: import("@omnia/fx/stores").StoreReturnDefineAction<{
+                        setWidth: (width: string) => void;
+                        resetWidth: () => void;
+                        setBreakPoint: (breakPoint: DisplayBreakpointTypes) => void;
+                        resetZoomLevel: () => void;
+                        setZoomLevel: (zoomLevel: number) => void;
+                    }>;
+                    get: {};
+                } & {
+                    dispose?: () => void;
+                };
             };
         };
         splitPanes: {
@@ -48,8 +138,19 @@ export declare const useEditorChromeStore: () => {
         };
     };
     actions: import("@omnia/fx/stores").StoreReturnDefineAction<{
-        displayBreakpoint: () => {
-            set: (value: DisplayBreakpointTypes) => void;
+        header: () => {
+            syncButtons: () => void;
+        };
+        footer: () => {
+            syncButtons: () => void;
+        };
+        canvas: () => {
+            syncDisplaySettings: () => void;
+            setDisplayBreakPoint: (value: DisplayBreakpointTypes) => void;
+            zoomIn: (step?: number) => void;
+            zoomOut: (step?: number) => void;
+            setZoom: (level: number) => void;
+            resetZoom: () => void;
         };
         tabs: () => {
             syncEditor: () => void;
@@ -58,8 +159,14 @@ export declare const useEditorChromeStore: () => {
         };
         showNotification: (message: NotificationMessage) => void;
         drawers: () => {
-            toggleLeftDrawer: (value: boolean) => void;
-            toggleRightDrawer: (value: boolean) => void;
+            left: {
+                syncButtons: () => void;
+                toggle: (value: boolean) => void;
+            };
+            right: {
+                syncButtons: (currentId: guid) => void;
+                toggle: (value: boolean) => void;
+            };
         };
         splitPanes: () => {
             wrapper: {
@@ -74,7 +181,9 @@ export declare const useEditorChromeStore: () => {
         init: () => void;
     }>;
     get: {};
-    rules: {};
+    rules: {
+        showLeftDrawerSettings: () => boolean;
+    };
 } & {
     dispose?: () => void;
 };

package/internal-do-not-import-from-here/ux/editorchrome/toolbars/HeaderToolbar.d.ts

@@ -0,0 +1,7 @@
+import { DefinePropTheming } from "@omnia/fx/ux";
+declare const _default: (props: import("@omnia/fx/ux").ExtractProps<DefinePropTheming> & {} & {
+    "v-slots"?: {} & Omit<{
+        default?: import("vue").Slot;
+    }, never>;
+} & {} & Omit<import("@omnia/fx/ux").VueComponentBaseProps, "colorSchemaType" | "colors"> & import("@omnia/fx/ux").VNodeEvents) => any;
+export default _default;

package/internal-do-not-import-from-here/ux/editorchrome/toolbars/LeftPanelToolbar.d.ts

@@ -0,0 +1,7 @@
+import { DefinePropTheming } from "@omnia/fx/ux";
+declare const _default: (props: import("@omnia/fx/ux").ExtractProps<DefinePropTheming> & {} & {
+    "v-slots"?: {} & Omit<{
+        default?: import("vue").Slot;
+    }, never>;
+} & {} & Omit<import("@omnia/fx/ux").VueComponentBaseProps, "colorSchemaType" | "colors"> & import("@omnia/fx/ux").VNodeEvents) => any;
+export default _default;

package/internal-do-not-import-from-here/ux/editorchrome/toolbars/RightPanelToolbar.d.ts

@@ -0,0 +1,7 @@
+import { DefinePropTheming } from "@omnia/fx/ux";
+declare const _default: (props: import("@omnia/fx/ux").ExtractProps<DefinePropTheming> & {} & {
+    "v-slots"?: {} & Omit<{
+        default?: import("vue").Slot;
+    }, never>;
+} & {} & Omit<import("@omnia/fx/ux").VueComponentBaseProps, "colorSchemaType" | "colors"> & import("@omnia/fx/ux").VNodeEvents) => any;
+export default _default;

package/internal-do-not-import-from-here/ux/layoutcanvas/editor/sizecontainer/SizeContainer.css.d.ts

@@ -1,4 +1,6 @@
 export declare const SizeContainerStyles: {
-    wrapper: (backgroundColor: any) => string;
-    wrapperContent: (backgroundColor: any, zoomLevel: number, width: any) => string;
+    wrapper: (backgroundColor: any) => Readonly<import("internal/fx/ux/Styles.stylex").StylexValue>;
+    baseContainer: (backgroundColor: any) => Readonly<import("internal/fx/ux/Styles.stylex").StylexValue>;
+    sizeWrapper: (width: any) => Readonly<import("internal/fx/ux/Styles.stylex").StylexValue>;
+    zoomTransform: (zoomLevel: number) => import("internal/fx/ux/Styles.stylex").StylexValue;
 };

package/internal-do-not-import-from-here/ux/layoutcanvas/stores/LayoutCanvasStore.d.ts

@@ -84,6 +84,9 @@ export declare class LayoutCanvasStore extends Store implements ILayoutCanvasSto
         }, Record<string, IMessageBusTopicPublishSubscriber<any>>>;
         actions: import("../../../stores").StoreReturnDefineAction<{
             setWidth: (width: string) => void;
+            resetWidth: () => void;
+            setBreakPoint: (breakPoint: import("@omnia/fx-models").DisplayBreakpointTypes) => void;
+            resetZoomLevel: () => void;
             setZoomLevel: (zoomLevel: number) => void;
         }>;
         get: {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@omnia/fx",
   "license": "MIT",
-  "version": "8.0.476-dev",
+  "version": "8.0.478-dev",
   "description": "Provide Omnia Fx typings and tooling for clientside Omnia development.",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
@@ -20,7 +20,7 @@
   ],
   "author": "Omnia Digital Workplace AB",
   "dependencies": {
-    "@omnia/fx-models": "8.0.476-dev",
+    "@omnia/fx-models": "8.0.478-dev",
     "@microsoft/signalr": "6.0.1",
     "broadcast-channel": "4.8.0",
     "dayjs": "1.11.7",

package/internal-do-not-import-from-here/ux/editorchrome/buttons/ExtendedToolbarButton.css.d.ts

@@ -1,77 +0,0 @@
-export declare const ToolbarButtonStyles: {
-    themeStyling: {
-        input: {
-            stylex: typeof import("../../aurora/styling/styles/InputStyling").InputStyling.getFieldBlueprintStylex;
-        };
-        icons: {
-            stylex: typeof import("../../aurora/styling/styles").IconStyling.getIconBlueprintStylex;
-        };
-        colors: {
-            dividingOpacity: typeof import("../../aurora/styling/styles").colorStyling.dividingOpacity;
-            backgroundOpacity: typeof import("../../aurora/styling/styles").colorStyling.backgroundOpacity;
-            setColorOpacity: typeof import("@omnia/fx-models").setColorOpacity;
-        };
-        elementStyling: {
-            colorStylex: typeof import("../../aurora/styling/styles").colorStyling.getColorStylingx;
-            selectedTableRowStylex: typeof import("../../aurora/styling/styles").generalStylex.getSelectedTableRowStylex;
-            scrollStylex: typeof import("../../aurora/styling/styles").generalStylex.getScrollStylex;
-            borderDividerStylex: typeof import("../../aurora/styling/styles").generalStylex.getBorderDividerStylex;
-            hoverStylex: typeof import("../../aurora/styling/styles").generalStylex.getHoverStylex;
-            css: {
-                generateAllStylesSchema: () => {
-                    [key: string]: string;
-                };
-                generateVariableStyle: (color: import("@omnia/fx-models").ColorValue) => {
-                    [key: string]: string;
-                };
-                generateValueVariable: (color: import("@omnia/fx-models").ColorValue) => string;
-            };
-        };
-        typography: {
-            valueStylex: typeof import("../../aurora/styling/styles/Typography").TypographyStyling.typographyStylexFromValueStylex;
-            typeStylex: typeof import("../../aurora/styling/styles/Typography").TypographyStyling.typographyTypeStylex;
-            stylex: typeof import("../../aurora/styling/styles/Typography").TypographyStyling.typographyStylex;
-            fontStyling: typeof import("../../aurora/styling/styles/Typography").fontStyling;
-            typeStyling: (typographyType: import("@omnia/fx-models").TextStyleTypes | import("@omnia/fx-models").TextStyleType, size: import("@omnia/fx-models").TextStyleSize | import("@omnia/fx-models").TextStyleSizes, blueprint: import("@omnia/fx-models").TypographyBlueprint) => {
-                baseStyles: {
-                    fontFamily: string;
-                    fontSize: string;
-                    fontWeight: number;
-                    lineHeight: string;
-                    fontStyle: string;
-                    textTransform: any;
-                    letterSpacing: string;
-                    textDecoration: string;
-                    $nest: {};
-                };
-                mediumStyles: any;
-                smallStyles: any;
-                queryOnSmallScreen: import("typestyle/lib/types").MediaQuery;
-                queryOnMediumScreen: import("typestyle/lib/types").MediaQuery;
-            };
-        };
-        spacing: {
-            paddingStylex: (value: import("@omnia/fx-models").Spacing | import("@omnia/fx-models").SpacingValue, blueprint?: ReturnType<typeof import("@omnia/fx/ux").useSpacingBlueprintStore>) => import("@omnia/fx/ux").StylexValue;
-            marginStylex: (value: import("@omnia/fx-models").Spacing | import("@omnia/fx-models").SpacingValue, blueprint?: ReturnType<typeof import("@omnia/fx/ux").useSpacingBlueprintStore>) => import("@omnia/fx/ux").StylexValue;
-            value: (value: import("@omnia/fx-models").SpacingValue, blueprint?: ReturnType<typeof import("@omnia/fx/ux").useSpacingBlueprintStore>) => number;
-            values: (value: import("@omnia/fx-models").Spacing, blueprint?: ReturnType<typeof import("@omnia/fx/ux").useSpacingBlueprintStore>) => import("@omnia/fx-models").Spacing;
-        };
-        fill: {
-            stylex: typeof import("../../aurora/styling/styles").FillStyling.getBlueprintFillStylex;
-            stylexObject: typeof import("../../aurora/styling/styles").FillStyling.getBlueprintFillObjectStylex;
-        };
-        border: {
-            stylex: typeof import("../../aurora/styling/styles").BorderStyling.getBlueprintBorderStylex;
-            stylexObject: typeof import("../../aurora/styling/styles").BorderStyling.getBlueprintBorderObjectStylex;
-        };
-        background: {
-            stylex: typeof import("../../aurora/styling/styles").BackgroundStyling.getBlueprintBackgroundStylex;
-            stylexObject: typeof import("../../aurora/styling/styles").BackgroundStyling.getBlueprintBackgroundObjectStylex;
-        };
-        text: {
-            stylex: typeof import("../../aurora/styling/styles").TextStyles.getBlueprintTextStylex;
-            object: typeof import("../../aurora/styling/styles").TextStyles.getBlueprintTextStylingObject;
-        };
-    };
-    wrapper: (dark: boolean, selected: boolean) => string;
-};

package/internal-do-not-import-from-here/ux/editorchrome/buttons/ExtendedToolbarButton.d.ts

@@ -1,9 +0,0 @@
-import { DefineProp, DefinePropTheming } from "@omnia/fx/ux";
-import { IIcon } from "@omnia/fx-models";
-type ToolbarButtonProps = DefinePropTheming & DefineProp<"icon", IIcon> & DefineProp<"active", boolean> & DefineProp<"title", string> & DefineProp<"border", "left" | "right" | "left right">;
-declare const _default: (props: import("@omnia/fx/ux").ExtractProps<ToolbarButtonProps> & {} & {
-    "v-slots"?: {} & Omit<{
-        default?: import("vue").Slot;
-    }, never>;
-} & {} & Omit<import("@omnia/fx/ux").VueComponentBaseProps, "icon" | "border" | "title" | "colorSchemaType" | "active" | "colors"> & import("@omnia/fx/ux").VNodeEvents) => any;
-export default _default;