@siemens/ix-react 2.1.2 → 2.2.0

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2023 Siemens AG
+Copyright (c) 2024 Siemens AG
 
 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
 

package/README.md

@@ -1,4 +1,4 @@
-# Siemens iX React Components
+# Siemens Industrial Experience - React Components
 
-This library is part of the Siemens iX mono repository.
+This library is part of the Siemens Industrial Experience mono repository.
 You can find the root README [here](https://github.com/siemens/ix/blob/main/README.md)

package/dist/index.esm.js

@@ -96,7 +96,7 @@ import { registerFrameworkDelegate, showModal as showModal$1, toast } from '@sie
 import ReactDOMClient from 'react-dom/client';
 import { defineCustomElement as defineCustomElement$1t } from '@siemens/ix/components/ix-application-sidebar.js';
 import { defineCustomElement as defineCustomElement$1s } from '@siemens/ix/components/ix-application-switch-modal.js';
-import { defineCustomElement as defineCustomElement$1v } from '@siemens/ix/components/ix-burger-menu.js';
+import { defineCustomElement as defineCustomElement$1v } from '@siemens/ix/components/ix-menu-expand-icon.js';
 import { defineCustomElement as defineCustomElement$1u } from '@siemens/ix/components/ix-date-time-card.js';
 import { defineCustomElement as defineCustomElement$1w } from '@siemens/ix/components/ix-modal-loading.js';
 import { defineCustomElement as defineCustomElement$1x } from '@siemens/ix-icons/dist/components/ix-icon';
@@ -127,7 +127,12 @@ function __rest(s, e) {
                 t[p[i]] = s[p[i]];
         }
     return t;
-}
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
 
 const dashToPascalCase = (str) => str
     .toLowerCase()
@@ -424,7 +429,7 @@ const IxWorkflowStep = /*@__PURE__*/ createReactComponent('ix-workflow-step', un
 const IxWorkflowSteps = /*@__PURE__*/ createReactComponent('ix-workflow-steps', undefined, undefined, defineCustomElement$1r);
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -497,7 +502,7 @@ const reactFrameworkDelegate = new ReactFrameworkDelegate();
 registerFrameworkDelegate(reactFrameworkDelegate);
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -562,7 +567,7 @@ const IxOverlay = (props) => {
 };
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -572,7 +577,7 @@ const IxOverlay = (props) => {
 const IxContext = React.createContext(null);
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -596,7 +601,7 @@ class IxApplicationContext extends React.Component {
 }
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -610,10 +615,12 @@ defineCustomElement$1v();
 defineCustomElement$1w();
 
 // eslint-disable-next-line no-inline-comments
-const IxIcon = /*@__PURE__*/ createReactComponent('ix-icon', undefined, undefined, defineCustomElement$1x);
+const IxIcon = /*@__PURE__*/ createReactComponent('ix-icon', undefined, undefined);
+// Predefine `ix-icon` to be sure its loaded before its used inside the util functions
+defineCustomElement$1x();
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -637,7 +644,7 @@ const Modal = React.forwardRef((props, ref) => {
 });
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -649,7 +656,7 @@ async function showModal(config) {
 }
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -657,6 +664,9 @@ async function showModal(config) {
  * LICENSE file in the root directory of this source tree.
  */
 async function showToast(config) {
+    // Define custom element, otherwise dynamic creation of toast container will fail
+    defineCustomElement$1i();
+    defineCustomElement$1j();
     if (typeof config.message === 'string') {
         const toastInstance = await toast(config);
         return toastInstance;

package/dist/index.js

@@ -100,7 +100,7 @@ const ix = require('@siemens/ix');
 const ReactDOMClient = require('react-dom/client');
 const ixApplicationSidebar_js = require('@siemens/ix/components/ix-application-sidebar.js');
 const ixApplicationSwitchModal_js = require('@siemens/ix/components/ix-application-switch-modal.js');
-const ixBurgerMenu_js = require('@siemens/ix/components/ix-burger-menu.js');
+const ixMenuExpandIcon_js = require('@siemens/ix/components/ix-menu-expand-icon.js');
 const ixDateTimeCard_js = require('@siemens/ix/components/ix-date-time-card.js');
 const ixModalLoading_js = require('@siemens/ix/components/ix-modal-loading.js');
 const ixIcon = require('@siemens/ix-icons/dist/components/ix-icon');
@@ -137,7 +137,12 @@ function __rest(s, e) {
                 t[p[i]] = s[p[i]];
         }
     return t;
-}
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
 
 const dashToPascalCase = (str) => str
     .toLowerCase()
@@ -434,7 +439,7 @@ const IxWorkflowStep = /*@__PURE__*/ createReactComponent('ix-workflow-step', un
 const IxWorkflowSteps = /*@__PURE__*/ createReactComponent('ix-workflow-steps', undefined, undefined, ixWorkflowSteps_js.defineCustomElement);
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -507,7 +512,7 @@ const reactFrameworkDelegate = new ReactFrameworkDelegate();
 ix.registerFrameworkDelegate(reactFrameworkDelegate);
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -572,7 +577,7 @@ const IxOverlay = (props) => {
 };
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -582,7 +587,7 @@ const IxOverlay = (props) => {
 const IxContext = React__default["default"].createContext(null);
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -606,7 +611,7 @@ class IxApplicationContext extends React__default["default"].Component {
 }
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -616,14 +621,16 @@ class IxApplicationContext extends React__default["default"].Component {
 ixApplicationSwitchModal_js.defineCustomElement();
 ixApplicationSidebar_js.defineCustomElement();
 ixDateTimeCard_js.defineCustomElement();
-ixBurgerMenu_js.defineCustomElement();
+ixMenuExpandIcon_js.defineCustomElement();
 ixModalLoading_js.defineCustomElement();
 
 // eslint-disable-next-line no-inline-comments
-const IxIcon = /*@__PURE__*/ createReactComponent('ix-icon', undefined, undefined, ixIcon.defineCustomElement);
+const IxIcon = /*@__PURE__*/ createReactComponent('ix-icon', undefined, undefined);
+// Predefine `ix-icon` to be sure its loaded before its used inside the util functions
+ixIcon.defineCustomElement();
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -647,7 +654,7 @@ const Modal = React__default["default"].forwardRef((props, ref) => {
 });
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -659,7 +666,7 @@ async function showModal(config) {
 }
 
 /*
- * SPDX-FileCopyrightText: 2023 Siemens AG
+ * SPDX-FileCopyrightText: 2024 Siemens AG
  *
  * SPDX-License-Identifier: MIT
  *
@@ -667,6 +674,9 @@ async function showModal(config) {
  * LICENSE file in the root directory of this source tree.
  */
 async function showToast(config) {
+    // Define custom element, otherwise dynamic creation of toast container will fail
+    ixToast_js.defineCustomElement();
+    ixToastContainer_js.defineCustomElement();
     if (typeof config.message === 'string') {
         const toastInstance = await ix.toast(config);
         return toastInstance;

package/dist/types/context/application-context.d.ts

@@ -1,7 +1,7 @@
 import React, { PropsWithChildren } from 'react';
-export declare type IxApplicationContextProps = PropsWithChildren;
+export type IxApplicationContextProps = PropsWithChildren;
 export declare class IxApplicationContext extends React.Component<IxApplicationContextProps> {
     private delegate;
     constructor(props: IxApplicationContextProps);
-    render(): JSX.Element;
+    render(): React.JSX.Element;
 }

package/dist/types/modal/index.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { ModalConfig as IxModalConfig } from '@siemens/ix';
 export * from './modal';
-export declare type ModalConfig = {
+export type ModalConfig = {
     content: React.ReactNode | string;
 };
 export declare function showModal(config: Omit<IxModalConfig, 'content'> & ModalConfig): Promise<import("@siemens/ix").ModalInstance<any>>;

package/dist/types/modal/portal.d.ts

@@ -1,5 +1,6 @@
+import React from 'react';
 import { ReactFrameworkDelegate } from 'src/delegate';
 export declare const PORTAL_ID = "ix-portal";
 export declare const IxOverlay: (props: {
     delegate: ReactFrameworkDelegate;
-}) => JSX.Element | null;
+}) => React.JSX.Element | null;

package/dist/types/react-component-lib/utils/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { StyleReactProps } from '../interfaces';
-export declare type StencilReactExternalProps<PropType, ElementType> = PropType & Omit<React.HTMLAttributes<ElementType>, 'style'> & StyleReactProps;
-export declare type StencilReactForwardedRef<T> = ((instance: T | null) => void) | React.MutableRefObject<T | null> | null;
+export type StencilReactExternalProps<PropType, ElementType> = PropType & Omit<React.HTMLAttributes<ElementType>, 'style'> & StyleReactProps;
+export type StencilReactForwardedRef<T> = ((instance: T | null) => void) | React.MutableRefObject<T | null> | null;
 export declare const setRef: (ref: StencilReactForwardedRef<any> | React.Ref<any> | undefined, value: any) => void;
 export declare const mergeRefs: (...refs: (StencilReactForwardedRef<any> | React.Ref<any> | undefined)[]) => React.RefCallback<any>;
 export declare const createForwardRef: <PropType, ElementType>(ReactComponent: any, displayName: string) => React.ForwardRefExoticComponent<React.PropsWithoutRef<StencilReactExternalProps<PropType, ElementType>> & React.RefAttributes<ElementType>>;

package/dist/types/tests/toast/toast.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const Index: () => React.JSX.Element;
+export default Index;

package/dist/types/tests/undefined-error/undefined-error.d.ts

@@ -1,2 +1,3 @@
-declare const Index: () => JSX.Element;
+import React from 'react';
+declare const Index: () => React.JSX.Element;
 export default Index;

package/dist/types/tests/validation-tooltip-null-error/validation-tooltip-null-error.d.ts

@@ -1,2 +1,3 @@
-declare const Index: () => JSX.Element;
+import React from 'react';
+declare const Index: () => React.JSX.Element;
 export default Index;

package/dist/types/toast/toast.d.ts

@@ -1,9 +1,6 @@
 /// <reference types="react" />
 import { ToastConfig as IxToastConfig } from '@siemens/ix';
-export declare type ToastConfig = {
+export type ToastConfig = {
     message: string | React.ReactNode;
 };
-export declare function showToast(config: Omit<IxToastConfig, 'message'> & ToastConfig): Promise<{
-    onClose: import("@siemens/ix").TypedEvent<any>;
-    close: (result?: any) => void;
-}>;
+export declare function showToast(config: Omit<IxToastConfig, 'message'> & ToastConfig): Promise<import("@siemens/ix").ShowToastResult>;

package/dist/types/tree/tree.d.ts

@@ -4,4 +4,4 @@ import { StyleReactProps } from '../react-component-lib/interfaces';
 export declare const InternalIxTree: React.ForwardRefExoticComponent<JSX.IxTree & Omit<React.HTMLAttributes<HTMLIxTreeElement>, "style"> & StyleReactProps & React.RefAttributes<HTMLIxTreeElement>>;
 export declare const IxTree: (props: Omit<JSX.IxTree, "renderItem"> & Omit<React.HTMLAttributes<HTMLIxTreeElement>, "style"> & StyleReactProps & React.RefAttributes<HTMLIxTreeElement> & {
     renderItem?: ((data: any) => React.ReactNode) | undefined;
-}) => globalThis.JSX.Element;
+}) => React.JSX.Element;

package/package.json

@@ -7,7 +7,7 @@
     "url": "https://github.com/siemens/ix",
     "directory": "packages/react"
   },
-  "version": "2.1.2",
+  "version": "2.2.0",
   "description": "Siemens iX for React",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",
@@ -17,30 +17,22 @@
     "README.md",
     "dist"
   ],
-  "scripts": {
-    "build": "npm run clean && npm run compile",
-    "clean": "rimraf dist && rimraf dist-transpiled",
-    "compile": "rollup -c",
-    "tsc": "tsc -p .",
-    "lint": "eslint src",
-    "test": "vitest run",
-    "test:watch": "vitest"
-  },
   "author": "",
   "license": "MIT",
   "devDependencies": {
     "@rollup/plugin-typescript": "^8.4.0",
-    "@siemens/ix": "~2.1.2",
+    "@siemens/ix": "~2.2.0",
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
     "@types/estree": "~0.0.51",
-    "@types/react": "~18.0.15",
-    "@types/react-dom": "~18.0.6",
+    "@types/react": "18.2.33",
+    "@types/react-dom": "18.2.14",
     "@typescript-eslint/eslint-plugin": "^5.45.0",
     "@typescript-eslint/parser": "^5.45.0",
     "babel-jest": "^29.7.0",
     "eslint-config-ix": "*",
     "eslint-plugin-react": "^7.31.11",
+    "happy-dom": "^14.7.1",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^29.1.2",
     "jest-environment-jsdom": "^29.1.2",
@@ -53,6 +45,7 @@
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-sourcemaps": "^0.6.3",
     "rollup-plugin-terser": "^7.0.2",
+    "shadow-dom-testing-library": "^1.11.2",
     "typescript": "^4.5.5",
     "vitest": "^1.3.1"
   },
@@ -62,6 +55,15 @@
     "react-dom": ">=17.0.2"
   },
   "dependencies": {
-    "@siemens/ix": "~2.1.2"
+    "@siemens/ix": "~2.2.0"
+  },
+  "scripts": {
+    "build": "npm run clean && npm run compile",
+    "clean": "rimraf dist && rimraf dist-transpiled",
+    "compile": "rollup -c",
+    "tsc": "tsc -p .",
+    "lint": "eslint src",
+    "test": "vitest run",
+    "test:watch": "vitest"
   }
-}
+}

package/dist/types/tests/example/example.d.ts

@@ -1,2 +0,0 @@
-declare const Index: () => JSX.Element;
-export default Index;