@siemens/ix-react 3.0.0-alpha.0 → 3.0.0-alpha.3

package/dist/toast/toast.js

@@ -0,0 +1,30 @@
+"use client";
+import { defineCustomElement as defineCustomElement$1 } from '@siemens/ix/components/ix-toast-container.js';
+import { defineCustomElement } from '@siemens/ix/components/ix-toast.js';
+import { toast } from '@siemens/ix';
+import ReactDOMClient from 'react-dom/client';
+
+async function showToast(config) {
+    // Define custom element, otherwise dynamic creation of toast container will fail
+    defineCustomElement();
+    defineCustomElement$1();
+    if (typeof config.message === 'string') {
+        const toastInstance = await toast(config);
+        return toastInstance;
+    }
+    const node = config.message;
+    const toastContainer = document.createElement('DIV');
+    const root = ReactDOMClient.createRoot(toastContainer);
+    root.render(node);
+    const toastInstance = await toast({
+        ...config,
+        message: toastContainer,
+    });
+    toastInstance.onClose.once(() => {
+        root.unmount();
+    });
+    return toastInstance;
+}
+
+export { showToast };
+//# sourceMappingURL=toast.js.map

package/dist/toast/toast.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toast.js","sources":["../../src/toast/toast.ts"],"sourcesContent":["'use client';\n/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport { defineCustomElement as defineToastContainer } from '@siemens/ix/components/ix-toast-container.js';\nimport { defineCustomElement as defineToast } from '@siemens/ix/components/ix-toast.js';\n\nimport { toast, ToastConfig as IxToastConfig } from '@siemens/ix';\nimport ReactDOMClient from 'react-dom/client';\n\nexport type ToastConfig = {\n  message: string | React.ReactNode;\n};\n\nexport async function showToast(\n  config: Omit<IxToastConfig, 'message'> & ToastConfig\n) {\n  // Define custom element, otherwise dynamic creation of toast container will fail\n  defineToast();\n  defineToastContainer();\n\n  if (typeof config.message === 'string') {\n    const toastInstance = await toast(config as IxToastConfig);\n    return toastInstance;\n  }\n\n  const node = config.message as React.ReactNode;\n  const toastContainer = document.createElement('DIV');\n  const root = ReactDOMClient.createRoot(toastContainer);\n  root.render(node);\n\n  const toastInstance = await toast({\n    ...config,\n    message: toastContainer,\n  });\n\n  toastInstance.onClose.once(() => {\n    root.unmount();\n  });\n\n  return toastInstance;\n}\n"],"names":[],"mappings":";;;;;;AAmBO;;AAIL;AACA;AAEA;AACE;AACA;;AAGF;;;AAGA;AAEA;AACE;AACA;AACD;AAED;;AAEA;AAEA;AACF;;"}

package/dist/tree/internal-tree.js

@@ -0,0 +1,21 @@
+"use client";
+import { IxTree, defineCustomElement } from '@siemens/ix/components/ix-tree.js';
+import { createComponent } from '@stencil/react-output-target/runtime';
+import React from 'react';
+
+const InternalIxTree = 
+/*@__PURE__*/ createComponent({
+    tagName: 'ix-tree',
+    elementClass: IxTree,
+    react: React,
+    events: {
+        onContextChange: 'contextChange',
+        onNodeToggled: 'nodeToggled',
+        onNodeClicked: 'nodeClicked',
+        onNodeRemoved: 'nodeRemoved',
+    },
+    defineCustomElement: defineCustomElement,
+});
+
+export { InternalIxTree as default };
+//# sourceMappingURL=internal-tree.js.map

package/dist/tree/internal-tree.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"internal-tree.js","sources":["../../src/tree/internal-tree.tsx"],"sourcesContent":["'use client';\n/* eslint-disable */\n\n/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { type IxTreeCustomEvent, type TreeContext } from '@siemens/ix';\nimport {\n  IxTree as IxTreeElement,\n  defineCustomElement as defineIxTree,\n} from '@siemens/ix/components/ix-tree.js';\nimport {\n  createComponent,\n  type EventName,\n  type StencilReactComponent,\n} from '@stencil/react-output-target/runtime';\nimport React from 'react';\n\ntype IxTreeEvents = {\n  onContextChange: EventName<IxTreeCustomEvent<TreeContext>>;\n  onNodeToggled: EventName<CustomEvent<{ id: string; isExpaned: boolean }>>;\n  onNodeClicked: EventName<CustomEvent<string>>;\n  onNodeRemoved: EventName<CustomEvent<any>>;\n};\n\nconst InternalIxTree: StencilReactComponent<IxTreeElement, IxTreeEvents> =\n  /*@__PURE__*/ createComponent<IxTreeElement, IxTreeEvents>({\n    tagName: 'ix-tree',\n    elementClass: IxTreeElement,\n    react: React,\n    events: {\n      onContextChange: 'contextChange',\n      onNodeToggled: 'nodeToggled',\n      onNodeClicked: 'nodeClicked',\n      onNodeRemoved: 'nodeRemoved',\n    } as IxTreeEvents,\n    defineCustomElement: defineIxTree,\n  });\n\nexport default InternalIxTree;\n"],"names":[],"mappings":";;;;;AA+BA;AACE;AACE;AACA;AACA;AACA;AACE;AACA;AACA;AACA;AACe;AACjB;AACD;;"}

package/dist/tree/tree.js

@@ -0,0 +1,38 @@
+"use client";
+import { jsx } from 'react/jsx-runtime';
+import { useRef, useCallback } from 'react';
+import ReactDOMClient from 'react-dom/client';
+import InternalIxTree from './internal-tree.js';
+
+const IxTree = (props) => {
+    const cachedRootNodes = useRef(new Map());
+    const renderItem = useCallback((_, data, __, context, update) => {
+        const treeItem = document.createElement('ix-tree-item');
+        treeItem.hasChildren = data.hasChildren;
+        treeItem.context = context[data.id];
+        update((itemData, context) => {
+            treeItem.context = context[itemData.id];
+            treeItem.hasChildren = itemData.hasChildren;
+        });
+        const container = document.createElement('DIV');
+        const rootNode = ReactDOMClient.createRoot(container);
+        if (props.renderItem) {
+            rootNode.render(props.renderItem(data.data));
+        }
+        treeItem.appendChild(container);
+        cachedRootNodes.current.set(treeItem, rootNode);
+        return treeItem;
+    }, []);
+    return (jsx(InternalIxTree, { ...props, renderItem: props.renderItem ? renderItem : undefined, onNodeRemoved: (removed) => {
+            const { detail } = removed;
+            detail.forEach((removedItemElement) => {
+                if (cachedRootNodes.current.has(removedItemElement)) {
+                    cachedRootNodes.current.get(removedItemElement)?.unmount();
+                    cachedRootNodes.current.delete(removedItemElement);
+                }
+            });
+        } }));
+};
+
+export { IxTree, IxTree as default };
+//# sourceMappingURL=tree.js.map

package/dist/tree/tree.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree.js","sources":["../../src/tree/tree.tsx"],"sourcesContent":["'use client';\n/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { type TreeContext, UpdateCallback } from '@siemens/ix';\nimport React, { useCallback, useRef } from 'react';\nimport ReactDOM, { Root } from 'react-dom/client';\nimport InternalIxTree from './internal-tree';\n\ntype ExtractProps<TComponentOrTProps> =\n  TComponentOrTProps extends React.ComponentType<infer TProps>\n    ? TProps\n    : TComponentOrTProps;\n\ntype IxTreeProps = ExtractProps<typeof InternalIxTree> & {\n  renderItem?: (data: any) => React.ReactNode;\n};\n\nexport const IxTree = (props: IxTreeProps) => {\n  const cachedRootNodes = useRef<Map<HTMLElement, Root>>(new Map());\n\n  const renderItem = useCallback(\n    (\n      _: number,\n      data: any,\n      __: any[],\n      context: TreeContext,\n      update: (callback: UpdateCallback) => void\n    ) => {\n      const treeItem = document.createElement('ix-tree-item');\n      treeItem.hasChildren = data.hasChildren;\n      treeItem.context = context[data.id];\n\n      update((itemData, context) => {\n        treeItem.context = context[itemData.id];\n        treeItem.hasChildren = itemData.hasChildren;\n      });\n\n      const container = document.createElement('DIV');\n      const rootNode = ReactDOM.createRoot(container);\n      if (props.renderItem) {\n        rootNode.render(props.renderItem(data.data));\n      }\n\n      treeItem.appendChild(container);\n      cachedRootNodes.current.set(treeItem, rootNode);\n\n      return treeItem;\n    },\n    []\n  );\n\n  return (\n    <InternalIxTree\n      {...props}\n      renderItem={props.renderItem ? renderItem : undefined}\n      onNodeRemoved={(removed: CustomEvent<any[]>) => {\n        const { detail } = removed;\n\n        detail.forEach((removedItemElement) => {\n          if (cachedRootNodes.current.has(removedItemElement)) {\n            cachedRootNodes.current.get(removedItemElement)?.unmount();\n            cachedRootNodes.current.delete(removedItemElement);\n          }\n        });\n      }}\n    ></InternalIxTree>\n  );\n};\n\nexport default IxTree;\n"],"names":[],"mappings":";;;;;;AAwBa;;AAGX;;AASI;;AAGA;;AAEE;AACF;;;AAIA;AACE;;AAGF;;AAGA;;;AAUE;AAEA;;;AAGI;;AAEJ;;AAIR;;"}

package/dist/types/components/IxApplicationHeader.d.ts

@@ -0,0 +1,12 @@
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+import { IxApplicationHeader as IxApplicationHeaderElement } from "@siemens/ix/components/ix-application-header.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+type IxApplicationHeaderEvents = {
+    onMenuToggle: EventName<CustomEvent<boolean>>;
+    onOpenAppSwitch: EventName<CustomEvent<void>>;
+};
+declare const IxApplicationHeader: StencilReactComponent<IxApplicationHeaderElement, IxApplicationHeaderEvents>;
+export default IxApplicationHeader;

package/dist/types/components/IxDateInput.d.ts

@@ -0,0 +1,13 @@
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+import { type DateInputValidityState, type IxDateInputCustomEvent } from "@siemens/ix";
+import { IxDateInput as IxDateInputElement } from "@siemens/ix/components/ix-date-input.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+type IxDateInputEvents = {
+    onValueChange: EventName<CustomEvent<string | undefined>>;
+    onValidityStateChange: EventName<IxDateInputCustomEvent<DateInputValidityState>>;
+};
+declare const IxDateInput: StencilReactComponent<IxDateInputElement, IxDateInputEvents>;
+export default IxDateInput;

package/dist/types/components/IxFlipTile.d.ts

@@ -0,0 +1,11 @@
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+import { IxFlipTile as IxFlipTileElement } from "@siemens/ix/components/ix-flip-tile.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+type IxFlipTileEvents = {
+    onToggle: EventName<CustomEvent<number>>;
+};
+declare const IxFlipTile: StencilReactComponent<IxFlipTileElement, IxFlipTileEvents>;
+export default IxFlipTile;

package/dist/types/components/IxMenu.d.ts

@@ -0,0 +1,15 @@
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+import { IxMenu as IxMenuElement } from "@siemens/ix/components/ix-menu.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+type IxMenuEvents = {
+    onExpandChange: EventName<CustomEvent<boolean>>;
+    onMapExpandChange: EventName<CustomEvent<boolean>>;
+    onOpenAppSwitch: EventName<CustomEvent<void>>;
+    onOpenSettings: EventName<CustomEvent<void>>;
+    onOpenAbout: EventName<CustomEvent<void>>;
+};
+declare const IxMenu: StencilReactComponent<IxMenuElement, IxMenuEvents>;
+export default IxMenu;

package/dist/types/components/IxMenuAbout.d.ts

@@ -0,0 +1,13 @@
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+import { type CustomCloseEvent, type IxMenuAboutCustomEvent } from "@siemens/ix";
+import { IxMenuAbout as IxMenuAboutElement } from "@siemens/ix/components/ix-menu-about.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+type IxMenuAboutEvents = {
+    onTabChange: EventName<CustomEvent<string>>;
+    onClose: EventName<IxMenuAboutCustomEvent<CustomCloseEvent>>;
+};
+declare const IxMenuAbout: StencilReactComponent<IxMenuAboutElement, IxMenuAboutEvents>;
+export default IxMenuAbout;

package/dist/types/components/IxMenuSettings.d.ts

@@ -0,0 +1,13 @@
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+import { type CustomCloseEvent, type IxMenuSettingsCustomEvent } from "@siemens/ix";
+import { IxMenuSettings as IxMenuSettingsElement } from "@siemens/ix/components/ix-menu-settings.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+type IxMenuSettingsEvents = {
+    onTabChange: EventName<CustomEvent<string>>;
+    onClose: EventName<IxMenuSettingsCustomEvent<CustomCloseEvent>>;
+};
+declare const IxMenuSettings: StencilReactComponent<IxMenuSettingsElement, IxMenuSettingsEvents>;
+export default IxMenuSettings;

package/dist/types/components/IxMessageBar.d.ts

@@ -0,0 +1,12 @@
+/**
+ * This file was automatically generated by the Stencil React Output Target.
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
+ */
+import { IxMessageBar as IxMessageBarElement } from "@siemens/ix/components/ix-message-bar.js";
+import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
+type IxMessageBarEvents = {
+    onClosedChange: EventName<CustomEvent<any>>;
+    onCloseAnimationCompleted: EventName<CustomEvent<any>>;
+};
+declare const IxMessageBar: StencilReactComponent<IxMessageBarElement, IxMessageBarEvents>;
+export default IxMessageBar;