0.2.3 - Hotfix

CHANGELOG.md

@@ -1,6 +1,12 @@
 # Change log
 All notable changes to this project will be documented in this file.
 
+## [0.2.3]
+### Added
+- Add i18 interface for components
+- Add UIContext to override Component portal root and set Translations
+- Extend TabLayout Functions
+- Webpack Hotfix
 ## [0.2.1]
 ### Added
 - Add required field validation to form event

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grandlinex/react-components",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "private": false,
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

src/renderer.tsx

@@ -4,6 +4,7 @@ import { createRoot } from 'react-dom/client';
 import { Default as test } from './stories/components/PortalStepper.stories';
 import PortalStepper from './components/controlls/PortalStepper/PortalStepper';
 import { GLang, UIContext, UIContextData, useUIContext } from './util';
+import Tooltip from './components/tooltip/Tooltip';
 
 const root = createRoot(document.getElementById('root')!);
 
@@ -16,7 +17,9 @@ const App = () => {
 
   return (
     <div>
-      {ui.translation.get('test.translation')}
+      <Tooltip text="HelloWorld">
+        {ui.translation.get('test.translation')}
+      </Tooltip>
       <PortalStepper {...(test.args as any)} />
     </div>
   );

src/util/BuildHelper.ts

@@ -0,0 +1,12 @@
+/**
+ * Helper function to get the window object. Fix for webpack build.
+ */
+export default function getSaveWindow() {
+  return typeof window !== 'undefined'
+    ? window
+    : ({
+        document: {
+          body: {},
+        },
+      } as unknown as Window);
+}

src/util/GLang.ts

@@ -1,3 +1,5 @@
+import getSaveWindow from './BuildHelper';
+
 export interface LangDataDataElement {
   key: string;
   value: string;
@@ -18,7 +20,7 @@ export class GLang {
     if (langDat) {
       this.loadLang(langDat);
     }
-    const win = window as any;
+    const win = getSaveWindow() as any;
     if (win && !win.missingTrans) {
       win.missingTrans = new Set<string>();
       win.getMissingTrans = () => {
@@ -33,7 +35,7 @@ export class GLang {
   }
 
   getMissingSet() {
-    const win = window as any;
+    const win = getSaveWindow() as any;
     if (win && win.missingTrans) {
       return win.missingTrans as Set<string>;
     }

src/util/MainContext.tsx

@@ -1,5 +1,6 @@
 import React, { useContext } from 'react';
 import { GLang } from './GLang';
+import getSaveWindow from './BuildHelper';
 
 class UIContextData {
   portalRoot: HTMLElement;
@@ -14,7 +15,7 @@ class UIContextData {
 
 const UIContext = React.createContext(
   new UIContextData({
-    portalRoot: document.body,
+    portalRoot: getSaveWindow().document.body,
     lang: new GLang({
       label: 'DefaultEnglish',
       code: 'en',

src/util/index.tsx

@@ -1,6 +1,7 @@
 import React, { ReactNode } from 'react';
 import md5 from './MD5';
 import copyToClipboard from './Clipboard';
+import getSaveWindow from './BuildHelper';
 
 export * from './GLang';
 export * from './MainContext';
@@ -86,4 +87,4 @@ function loop<X = ReactNode>(
   return arr;
 }
 
-export { md5, copyToClipboard, sGen, loop };
+export { md5, copyToClipboard, sGen, loop, getSaveWindow };