@inventreedb/ui 0.2.1 → 0.2.2

package/dist/.vite/manifest.json

@@ -63,14 +63,13 @@
     "name": "_virtual/index",
     "src": "/home/inventree/src/frontend/node_modules/unraw/dist/index.js?commonjs-exports"
   },
-  "lib/components/StylishText.tsx": {
-    "file": "components/StylishText.js",
-    "name": "components/StylishText",
-    "src": "lib/components/StylishText.tsx",
+  "lib/components/InvenTreeStylishText.tsx": {
+    "file": "components/InvenTreeStylishText.js",
+    "name": "components/InvenTreeStylishText",
+    "src": "lib/components/InvenTreeStylishText.tsx",
     "imports": [
       "/home/inventree/src/frontend/node_modules/react/jsx-runtime.js?commonjs-es-import",
       "node_modules/@mantine/core/esm/components/Text/Text.mjs",
-      "node_modules/@mantine/core/esm/core/MantineProvider/MantineThemeProvider/MantineThemeProvider.mjs",
       "node_modules/@mantine/core/esm/core/MantineProvider/color-functions/get-theme-color/get-theme-color.mjs",
       "node_modules/@mantine/core/esm/core/MantineProvider/color-functions/darken/darken.mjs"
     ]
@@ -139,7 +138,7 @@
       "lib/functions/Api.tsx",
       "lib/functions/Navigation.tsx",
       "lib/functions/Plugins.tsx",
-      "lib/components/StylishText.tsx"
+      "lib/components/InvenTreeStylishText.tsx"
     ]
   },
   "lib/types/Plugins.tsx": {

package/dist/components/InvenTreeStylishText.d.ts

@@ -0,0 +1,13 @@
+import { MantineSize, MantineTheme } from '@mantine/core';
+import { JSX } from 'react';
+/**
+ * A stylish text component that uses the primary color of the theme
+ * Note that the "theme" object must be provided by the parent component.
+ * - For plugins this theme object is provided.
+ * - For the main UI, we have a separate <StylishText> component
+ */
+export declare function InvenTreeStylishText({ children, theme, size }: Readonly<{
+    children: JSX.Element | string;
+    theme: MantineTheme;
+    size?: MantineSize;
+}>): import("react/jsx-runtime").JSX.Element;

package/dist/components/{StylishText.js → InvenTreeStylishText.js}

@@ -1,21 +1,14 @@
 import { j as jsxRuntimeExports } from "../_virtual/jsx-runtime.js";
 import { useMemo } from "react";
 import { Text } from "../node_modules/@mantine/core/esm/components/Text/Text.js";
-import { useMantineTheme } from "../node_modules/@mantine/core/esm/core/MantineProvider/MantineThemeProvider/MantineThemeProvider.js";
 import { getThemeColor } from "../node_modules/@mantine/core/esm/core/MantineProvider/color-functions/get-theme-color/get-theme-color.js";
 import { darken } from "../node_modules/@mantine/core/esm/core/MantineProvider/color-functions/darken/darken.js";
 const useThematicGradient = ({
   suppliedTheme
 }) => {
-  const theme = useMemo(() => {
-    if (suppliedTheme && suppliedTheme != void 0) {
-      return suppliedTheme;
-    }
-    return useMantineTheme();
-  }, [suppliedTheme, useMantineTheme]);
   const primary = useMemo(() => {
-    return getThemeColor(theme.primaryColor, theme);
-  }, [theme]);
+    return getThemeColor(suppliedTheme.primaryColor, suppliedTheme);
+  }, [suppliedTheme]);
   const secondary = useMemo(() => darken(primary, 0.25), [primary]);
   return useMemo(() => {
     return {
@@ -24,7 +17,7 @@ const useThematicGradient = ({
     };
   }, [primary, secondary]);
 };
-function StylishText({
+function InvenTreeStylishText({
   children,
   theme,
   size
@@ -41,6 +34,6 @@ function StylishText({
   }, children });
 }
 export {
-  StylishText
+  InvenTreeStylishText
 };
-//# sourceMappingURL=StylishText.js.map
+//# sourceMappingURL=InvenTreeStylishText.js.map

package/dist/components/InvenTreeStylishText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InvenTreeStylishText.js","sources":["../../lib/components/InvenTreeStylishText.tsx"],"sourcesContent":["import {\n  type MantineSize,\n  type MantineTheme,\n  Text,\n  darken,\n  getThemeColor\n} from '@mantine/core';\nimport { useMemo } from 'react';\nimport type { JSX } from 'react';\n\n// Hook that memoizes the gradient color based on the primary color of the theme\nconst useThematicGradient = ({\n  suppliedTheme\n}: {\n  suppliedTheme: MantineTheme;\n}) => {\n  const primary = useMemo(() => {\n    return getThemeColor(suppliedTheme.primaryColor, suppliedTheme);\n  }, [suppliedTheme]);\n\n  const secondary = useMemo(() => darken(primary, 0.25), [primary]);\n\n  return useMemo(() => {\n    return { primary, secondary };\n  }, [primary, secondary]);\n};\n\n/**\n * A stylish text component that uses the primary color of the theme\n * Note that the \"theme\" object must be provided by the parent component.\n * - For plugins this theme object is provided.\n * - For the main UI, we have a separate <StylishText> component\n */\nexport function InvenTreeStylishText({\n  children,\n  theme,\n  size\n}: Readonly<{\n  children: JSX.Element | string;\n  theme: MantineTheme;\n  size?: MantineSize;\n}>) {\n  const { primary, secondary } = useThematicGradient({ suppliedTheme: theme });\n\n  return (\n    <Text\n      fw={700}\n      size={size ?? 'xl'}\n      variant='gradient'\n      gradient={{ from: primary.toString(), to: secondary.toString() }}\n    >\n      {children}\n    </Text>\n  );\n}\n"],"names":["useThematicGradient","suppliedTheme","primary","useMemo","getThemeColor","primaryColor","secondary","darken","InvenTreeStylishText","children","theme","size","jsx","from","toString","to"],"mappings":";;;;;AAWA,MAAMA,sBAAsBA,CAAC;AAAA,EAC3BC;AAGF,MAAM;AACEC,QAAAA,UAAUC,QAAQ,MAAM;AACrBC,WAAAA,cAAcH,cAAcI,cAAcJ,aAAa;AAAA,EAAA,GAC7D,CAACA,aAAa,CAAC;AAEZK,QAAAA,YAAYH,QAAQ,MAAMI,OAAOL,SAAS,IAAI,GAAG,CAACA,OAAO,CAAC;AAEhE,SAAOC,QAAQ,MAAM;AACZ,WAAA;AAAA,MAAED;AAAAA,MAASI;AAAAA,IAAU;AAAA,EAAA,GAC3B,CAACJ,SAASI,SAAS,CAAC;AACzB;AAQO,SAASE,qBAAqB;AAAA,EACnCC;AAAAA,EACAC;AAAAA,EACAC;AAKD,GAAG;AACI,QAAA;AAAA,IAAET;AAAAA,IAASI;AAAAA,MAAcN,oBAAoB;AAAA,IAAEC,eAAeS;AAAAA,EAAAA,CAAO;AAGzE,SAAAE,sCAAC,QACC,IAAI,KACJ,MAAMD,QAAQ,MACd,SAAQ,YACR,UAAU;AAAA,IAAEE,MAAMX,QAAQY,SAAS;AAAA,IAAGC,IAAIT,UAAUQ,SAAS;AAAA,KAE5DL,SACH,CAAA;AAEJ;"}

package/dist/index.d.ts

@@ -6,4 +6,4 @@ export type { InvenTreePluginContext } from './types/Plugins';
 export { apiUrl } from './functions/Api';
 export { getBaseUrl, getDetailUrl, navigateToLink } from './functions/Navigation';
 export { checkPluginVersion } from './functions/Plugins';
-export { StylishText } from './components/StylishText';
+export { InvenTreeStylishText } from './components/InvenTreeStylishText';

package/dist/index.js

@@ -5,15 +5,15 @@ import { UserPermissions, UserRoles } from "./enums/Roles.js";
 import { apiUrl } from "./functions/Api.js";
 import { getBaseUrl, getDetailUrl, navigateToLink } from "./functions/Navigation.js";
 import { checkPluginVersion } from "./functions/Plugins.js";
-import { StylishText } from "./components/StylishText.js";
+import { InvenTreeStylishText } from "./components/InvenTreeStylishText.js";
 export {
   ApiEndpoints,
   INVENTREE_MANTINE_VERSION,
   INVENTREE_PLUGIN_VERSION,
   INVENTREE_REACT_DOM_VERSION,
   INVENTREE_REACT_VERSION,
+  InvenTreeStylishText,
   ModelType,
-  StylishText,
   UserPermissions,
   UserRoles,
   apiUrl,

package/dist/types/Plugins.js

@@ -1,4 +1,4 @@
-const INVENTREE_PLUGIN_VERSION = "0.2.1";
+const INVENTREE_PLUGIN_VERSION = "0.2.2";
 const INVENTREE_REACT_VERSION = "18.3.1";
 const INVENTREE_REACT_DOM_VERSION = (
   // @ts-ignore

package/lib/components/{StylishText.tsx → InvenTreeStylishText.tsx}

@@ -3,8 +3,7 @@ import {
   type MantineTheme,
   Text,
   darken,
-  getThemeColor,
-  useMantineTheme
+  getThemeColor
 } from '@mantine/core';
 import { useMemo } from 'react';
 import type { JSX } from 'react';
@@ -13,19 +12,11 @@ import type { JSX } from 'react';
 const useThematicGradient = ({
   suppliedTheme
 }: {
-  suppliedTheme?: MantineTheme;
+  suppliedTheme: MantineTheme;
 }) => {
-  const theme = useMemo(() => {
-    if (suppliedTheme && suppliedTheme != undefined) {
-      return suppliedTheme;
-    }
-
-    return useMantineTheme();
-  }, [suppliedTheme, useMantineTheme]);
-
   const primary = useMemo(() => {
-    return getThemeColor(theme.primaryColor, theme);
-  }, [theme]);
+    return getThemeColor(suppliedTheme.primaryColor, suppliedTheme);
+  }, [suppliedTheme]);
 
   const secondary = useMemo(() => darken(primary, 0.25), [primary]);
 
@@ -34,14 +25,19 @@ const useThematicGradient = ({
   }, [primary, secondary]);
 };
 
-// A stylish text component that uses the primary color of the theme
-export function StylishText({
+/**
+ * A stylish text component that uses the primary color of the theme
+ * Note that the "theme" object must be provided by the parent component.
+ * - For plugins this theme object is provided.
+ * - For the main UI, we have a separate <StylishText> component
+ */
+export function InvenTreeStylishText({
   children,
   theme,
   size
 }: Readonly<{
   children: JSX.Element | string;
-  theme?: MantineTheme;
+  theme: MantineTheme;
   size?: MantineSize;
 }>) {
   const { primary, secondary } = useThematicGradient({ suppliedTheme: theme });

package/lib/index.ts

@@ -23,4 +23,4 @@ export {
 export { checkPluginVersion } from './functions/Plugins';
 
 // UI components
-export { StylishText } from './components/StylishText';
+export { InvenTreeStylishText } from './components/InvenTreeStylishText';

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@inventreedb/ui",
     "description": "UI components for the InvenTree project",
-    "version": "0.2.1",
+    "version": "0.2.2",
     "private": false,
     "type": "module",
     "license": "MIT",

package/dist/components/StylishText.d.ts

@@ -1,7 +0,0 @@
-import { MantineSize, MantineTheme } from '@mantine/core';
-import { JSX } from 'react';
-export declare function StylishText({ children, theme, size }: Readonly<{
-    children: JSX.Element | string;
-    theme?: MantineTheme;
-    size?: MantineSize;
-}>): import("react/jsx-runtime").JSX.Element;

package/dist/components/StylishText.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"StylishText.js","sources":["../../lib/components/StylishText.tsx"],"sourcesContent":["import {\n  type MantineSize,\n  MantineTheme,\n  Text,\n  darken,\n  getThemeColor,\n  useMantineTheme\n} from '@mantine/core';\nimport { useMemo } from 'react';\nimport type { JSX } from 'react';\n\n// Hook that memoizes the gradient color based on the primary color of the theme\nconst useThematicGradient = ({\n  suppliedTheme,\n}: {\n  suppliedTheme?: MantineTheme;\n}) => {\n\n  const theme = useMemo(() => {\n    if (suppliedTheme && suppliedTheme != undefined) {\n      return suppliedTheme;\n    }\n\n    return useMantineTheme();\n  }, [suppliedTheme, useMantineTheme]);\n\n  const primary = useMemo(() => {\n    return getThemeColor(theme.primaryColor, theme);\n  }, [theme]);\n\n  const secondary = useMemo(() => darken(primary, 0.25), [primary]);\n\n  return useMemo(() => {\n    return { primary, secondary };\n  }, [primary, secondary]);\n};\n\n// A stylish text component that uses the primary color of the theme\nexport function StylishText({\n  children,\n  theme,\n  size\n}: Readonly<{\n  children: JSX.Element | string;\n  theme?: MantineTheme;\n  size?: MantineSize;\n}>) {\n  const { primary, secondary } = useThematicGradient({ suppliedTheme: theme });\n\n  return (\n    <Text\n      fw={700}\n      size={size ?? 'xl'}\n      variant='gradient'\n      gradient={{ from: primary.toString(), to: secondary.toString() }}\n    >\n      {children}\n    </Text>\n  );\n}\n"],"names":["useThematicGradient","suppliedTheme","theme","useMemo","undefined","useMantineTheme","primary","getThemeColor","primaryColor","secondary","darken","StylishText","children","size","jsx","from","toString","to"],"mappings":";;;;;;AAYA,MAAMA,sBAAsBA,CAAC;AAAA,EAC3BC;AAGF,MAAM;AAEEC,QAAAA,QAAQC,QAAQ,MAAM;AACtBF,QAAAA,iBAAiBA,iBAAiBG,QAAW;AACxCH,aAAAA;AAAAA,IAAAA;AAGT,WAAOI,gBAAgB;AAAA,EAAA,GACtB,CAACJ,eAAeI,eAAe,CAAC;AAE7BC,QAAAA,UAAUH,QAAQ,MAAM;AACrBI,WAAAA,cAAcL,MAAMM,cAAcN,KAAK;AAAA,EAAA,GAC7C,CAACA,KAAK,CAAC;AAEJO,QAAAA,YAAYN,QAAQ,MAAMO,OAAOJ,SAAS,IAAI,GAAG,CAACA,OAAO,CAAC;AAEhE,SAAOH,QAAQ,MAAM;AACZ,WAAA;AAAA,MAAEG;AAAAA,MAASG;AAAAA,IAAU;AAAA,EAAA,GAC3B,CAACH,SAASG,SAAS,CAAC;AACzB;AAGO,SAASE,YAAY;AAAA,EAC1BC;AAAAA,EACAV;AAAAA,EACAW;AAKD,GAAG;AACI,QAAA;AAAA,IAAEP;AAAAA,IAASG;AAAAA,MAAcT,oBAAoB;AAAA,IAAEC,eAAeC;AAAAA,EAAAA,CAAO;AAGzE,SAAAY,sCAAC,QACC,IAAI,KACJ,MAAMD,QAAQ,MACd,SAAQ,YACR,UAAU;AAAA,IAAEE,MAAMT,QAAQU,SAAS;AAAA,IAAGC,IAAIR,UAAUO,SAAS;AAAA,KAE5DJ,SACH,CAAA;AAEJ;"}