@wandelbots/wandelbots-js-react-components 1.7.1 → 1.9.0

package/dist/themes/theme.d.ts

@@ -1,144 +0,0 @@
-import { ThemeOptions } from '@mui/material/styles';
-type ThemeName = 'wandelbots';
-export declare const allThemes: {
-    wb: import("@mui/material").Theme;
-};
-export interface NamedThemeOptions extends ThemeOptions {
-    name: ThemeName;
-}
-declare module '@mui/material/styles' {
-    interface Theme {
-        backgrounds: {
-            light1: string;
-            light2: string;
-            medium: string;
-            dark1: string;
-            dark2: string;
-        };
-        buttonPrimary: {
-            background: string;
-            text: string;
-        };
-        buttonSecondary: {
-            background: string;
-            text: string;
-        };
-        buttonBack: {
-            background: string;
-            text: string;
-        };
-        inputField: {
-            background: string;
-            text: string;
-            unitBackground: string;
-            unitText: string;
-        };
-        sidebar: {
-            background: string;
-            backgroundSelected: string;
-            selected: string;
-        };
-        actionPanel: {
-            background: string;
-            backgroundSelected: string;
-            text: string;
-        };
-        controlPanel: {
-            background: string;
-            text: string;
-        };
-        listItem: {
-            background: string;
-            backgroundSelected: string;
-            textTitle: string;
-            textTitleSelected: string;
-            textDesc: string;
-            textDescSelected: string;
-        };
-        breadcrumb: {
-            background: string;
-            text: string;
-            textSelected: string;
-        };
-        axes: {
-            x: string;
-            y: string;
-            z: string;
-        };
-        viewport: {
-            background: string;
-            controlBackground: string;
-        };
-        tabIcon: {
-            color: string;
-        };
-    }
-    interface ThemeOptions {
-        backgrounds?: {
-            light1?: string;
-            light2?: string;
-            medium?: string;
-            dark1?: string;
-            dark2?: string;
-        };
-        buttonPrimary?: {
-            background?: string;
-            text?: string;
-        };
-        buttonSecondary?: {
-            background?: string;
-            text?: string;
-        };
-        buttonBack?: {
-            background?: string;
-            text?: string;
-        };
-        inputField?: {
-            background?: string;
-            text?: string;
-            unitBackground?: string;
-            unitText?: string;
-        };
-        sidebar?: {
-            background?: string;
-            backgroundSelected?: string;
-            selected?: string;
-        };
-        actionPanel?: {
-            background?: string;
-            backgroundSelected?: string;
-            text?: string;
-        };
-        controlPanel?: {
-            background?: string;
-            text?: string;
-        };
-        listItem?: {
-            background?: string;
-            backgroundSelected?: string;
-            textTitle?: string;
-            textTitleSelected?: string;
-            textDesc?: string;
-            textDescSelected?: string;
-        };
-        breadcrumb?: {
-            background?: string;
-            text?: string;
-            textSelected?: string;
-        };
-        axes?: {
-            x?: string;
-            y?: string;
-            z?: string;
-        };
-        viewport?: {
-            background?: string;
-            controlBackground?: string;
-        };
-        tabIcon?: {
-            color?: string;
-        };
-    }
-}
-export {};
-//# sourceMappingURL=theme.d.ts.map

package/dist/themes/theme.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/themes/theme.ts"],"names":[],"mappings":"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"}

package/dist/themes/wbTheme.d.ts

@@ -1,73 +0,0 @@
-/** Colors for the dark theme */
-export declare const darkColors: {
-    primary: string;
-    textDefault: string;
-    textInverse: string;
-    textError: string;
-    textSubtle: string;
-    backgroundDefault: string;
-    inputBackgroundDefault: string;
-    borderColorDefault: string;
-    selectBackground: string;
-    appBarBackground: string;
-    virtualRobot: string;
-    physicalRobot: string;
-    robotViewportBackground: string;
-    viewportButtonInactiveBackground: string;
-    viewportButtonHover: string;
-    viewportButtonActiveBackground: string;
-    tabsBarBackground: string;
-    activeTabBackground: string;
-    omniverseConfigurationSuccess: string;
-    omniverseConfigurationFailure: string;
-};
-/** Colors for the light theme */
-export declare const lightColors: {
-    primary: string;
-    textDefault: string;
-    textInverse: string;
-    textError: string;
-    textSubtle: string;
-    backgroundDefault: string;
-    inputBackgroundDefault: string;
-    borderColorDefault: string;
-    selectBackground: string;
-    appBarBackground: string;
-    virtualRobot: string;
-    physicalRobot: string;
-    robotViewportBackground: string;
-    viewportButtonInactiveBackground: string;
-    viewportButtonHover: string;
-    viewportButtonActiveBackground: string;
-    tabsBarBackground: string;
-    activeTabBackground: string;
-    omniverseConfigurationSuccess: string;
-    omniverseConfigurationFailure: string;
-};
-/** Gets the colors for the current theme (light or dark) */
-export declare function useThemeColors(): {
-    primary: string;
-    textDefault: string;
-    textInverse: string;
-    textError: string;
-    textSubtle: string;
-    backgroundDefault: string;
-    inputBackgroundDefault: string;
-    borderColorDefault: string;
-    selectBackground: string;
-    appBarBackground: string;
-    virtualRobot: string;
-    physicalRobot: string;
-    robotViewportBackground: string;
-    viewportButtonInactiveBackground: string;
-    viewportButtonHover: string;
-    viewportButtonActiveBackground: string;
-    tabsBarBackground: string;
-    activeTabBackground: string;
-    omniverseConfigurationSuccess: string;
-    omniverseConfigurationFailure: string;
-};
-export declare const darkTheme: import("@mui/material").Theme;
-export declare const lightTheme: import("@mui/material").Theme;
-export declare const wbTheme: import("@mui/material").Theme;
-//# sourceMappingURL=wbTheme.d.ts.map

package/dist/themes/wbTheme.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"wbTheme.d.ts","sourceRoot":"","sources":["../../src/themes/wbTheme.ts"],"names":[],"mappings":"AAsBA,gCAAgC;AAChC,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;CAsBtB,CAAA;AAED,iCAAiC;AACjC,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;CAsBvB,CAAA;AAED,4DAA4D;AAC5D,wBAAgB,cAAc;;;;;;;;;;;;;;;;;;;;;EAE7B;AA4GD,eAAO,MAAM,SAAS,+BAA8B,CAAA;AACpD,eAAO,MAAM,UAAU,+BAA+B,CAAA;AACtD,eAAO,MAAM,OAAO,+BAAY,CAAA"}

package/dist/themes/wbTheme.stories.d.ts

@@ -1,7 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-declare const ColorPalette: () => import("react/jsx-runtime").JSX.Element;
-declare const meta: Meta<typeof ColorPalette>;
-export default meta;
-type Story = StoryObj<typeof ColorPalette>;
-export declare const colorPalette: Story;
-//# sourceMappingURL=wbTheme.stories.d.ts.map

package/dist/themes/wbTheme.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"wbTheme.stories.d.ts","sourceRoot":"","sources":["../../src/themes/wbTheme.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAGlD,QAAA,MAAM,YAAY,+CAiDjB,CAAC;AAEF,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,YAAY,CAEnC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,YAAY,CAAC,CAAC;AAE3C,eAAO,MAAM,YAAY,EAAE,KAAU,CAAC"}

package/src/themes/theme.ts

@@ -1,150 +0,0 @@
-import { ThemeOptions } from '@mui/material/styles';
-import { wbTheme } from './wbTheme';
-
-// TODO: Is all of this theme name foo actually necessary?
-
-type ThemeName = 'wandelbots'
-
-export const allThemes = {
-  wb: wbTheme,
-}
-
-export interface NamedThemeOptions extends ThemeOptions {
-  name: ThemeName
-}
-
-declare module '@mui/material/styles' {
-  interface Theme {
-    backgrounds: {
-      light1: string,
-      light2: string,
-      medium: string,
-      dark1: string,
-      dark2: string,
-    }
-    buttonPrimary: {
-      background: string;
-      text: string;
-    }
-    buttonSecondary: {
-      background: string;
-      text: string;
-    }
-    buttonBack: {
-      background: string;
-      text: string;
-    }
-    inputField: {
-      background: string;
-      text: string;
-      unitBackground: string;
-      unitText: string;
-    }
-    sidebar: {
-      background: string;
-      backgroundSelected: string;
-      selected: string;
-    }
-    actionPanel: {
-      background: string;
-      backgroundSelected: string;
-      text: string;
-    }
-    controlPanel: {
-      background: string;
-      text: string;
-    }
-    listItem: {
-      background: string;
-      backgroundSelected: string;
-      textTitle: string;
-      textTitleSelected: string;
-      textDesc: string;
-      textDescSelected: string;
-    }
-    breadcrumb: {
-      background: string;
-      text: string
-      textSelected: string;
-    }
-    axes: {
-      x: string;
-      y: string;
-      z: string;
-    };
-    viewport: {
-      background: string;
-      controlBackground: string;
-    };
-    tabIcon: {
-      color: string;
-    }
-  }
-
-  interface ThemeOptions {
-    backgrounds?: {
-      light1?: string,
-      light2?: string,
-      medium?: string,
-      dark1?: string,
-      dark2?: string,
-    }
-    buttonPrimary?: {
-      background?: string;
-      text?: string;
-    }
-    buttonSecondary?: {
-      background?: string;
-      text?: string;
-    }
-    buttonBack?: {
-      background?: string;
-      text?: string;
-    }
-    inputField?: {
-      background?: string;
-      text?: string;
-      unitBackground?: string;
-      unitText?: string;
-    }
-    sidebar?: {
-      background?: string;
-      backgroundSelected?: string;
-      selected?: string;
-    }
-    actionPanel?: {
-      background?: string;
-      backgroundSelected?: string;
-      text?: string;
-    }
-    controlPanel?: {
-      background?: string;
-      text?: string;
-    }
-    listItem?: {
-      background?: string;
-      backgroundSelected?: string;
-      textTitle?: string;
-      textTitleSelected?: string;
-      textDesc?: string;
-      textDescSelected?: string;
-    }
-    breadcrumb?: {
-      background?: string;
-      text?: string
-      textSelected?: string;
-    }
-    axes?: {
-      x?: string;
-      y?: string;
-      z?: string;
-    };
-    viewport?: {
-      background?: string;
-      controlBackground?: string;
-    };
-    tabIcon?: {
-      color?: string;
-    }
-  }
-}

package/src/themes/wbTheme.stories.tsx

@@ -1,64 +0,0 @@
-import { wbTheme } from "./wbTheme";
-import { Meta, StoryObj } from "@storybook/react";
-import { Color, ColorSection } from "./color";
-
-const ColorPalette = () => {
-  return (
-    <div
-      style={{
-        fontFamily: "sans-serif",
-      }}
-    >
-      <ColorSection name="Palette">
-        <Color name="Primary" color={wbTheme.palette.primary.main} />
-        <Color name="Secondary" color={wbTheme.palette.secondary.main} />
-        <Color name="Background" color={wbTheme.palette.background.default} />
-      </ColorSection>
-      <ColorSection name="Text">
-        <Color name="Primary" color={wbTheme.palette.text.primary} />
-        <Color name="Secondary" color={wbTheme.palette.text.secondary} />
-      </ColorSection>
-      <ColorSection name="Button">
-        <Color
-          name="Primary Background"
-          color={wbTheme.buttonPrimary.background}
-        />
-        <Color name="Primary Text" color={wbTheme.buttonPrimary.text} />
-        <Color
-          name="Secondary Background"
-          color={wbTheme.buttonSecondary.background}
-        />
-        <Color name="Secondary Text" color={wbTheme.buttonSecondary.text} />
-        <Color name="Back Background" color={wbTheme.buttonBack.background} />
-        <Color name="Back Text" color={wbTheme.buttonBack.text} />
-      </ColorSection>
-      <ColorSection name="Input Field">
-        <Color name="Background" color={wbTheme.inputField.background} />
-        <Color name="Text" color={wbTheme.inputField.text} />
-        <Color
-          name="Unit Background"
-          color={wbTheme.inputField.unitBackground}
-        />
-        <Color name="Unit Text" color={wbTheme.inputField.unitText} />
-      </ColorSection>
-      <ColorSection name="Sidebar">
-        <Color name="Background" color={wbTheme.sidebar.background} />
-        <Color
-          name="Background Selected"
-          color={wbTheme.sidebar.backgroundSelected}
-        />
-        <Color name="Selected" color={wbTheme.sidebar.selected} />
-      </ColorSection>
-    </div>
-  );
-};
-
-const meta: Meta<typeof ColorPalette> = {
-  component: ColorPalette,
-};
-
-export default meta;
-
-type Story = StoryObj<typeof ColorPalette>;
-
-export const colorPalette: Story = {};

package/src/themes/wbTheme.ts

@@ -1,186 +0,0 @@
-"use client"
-
-import { createTheme, useTheme, type ThemeOptions } from "@mui/material/styles"
-import { defaultsDeep } from "lodash-es"
-
-const baseColors = {
-  white: "#FFFFFF",
-  midnightblue: "#001337",
-  lightbuttonblue: "#47D3FF",
-  midnightgray: "#DDE0E4",
-  midnightgray500: "#828B9B",
-  skyblue500: "#06B8F1",
-  skyblue600: "#0094CE",
-  darkishblue: "#262F42",
-  darkestblue: "#101629",
-  grayishblue: "#505968",
-  darkgrayishblue: "#363c4b",
-  scaryred: "#FF0E65",
-  tealGreen: "#1AC0B2",
-  magenta: "#EA3785",
-}
-
-/** Colors for the dark theme */
-export const darkColors = {
-  primary: baseColors.skyblue500,
-  textDefault: baseColors.white,
-  textInverse: baseColors.darkestblue,
-  textError: baseColors.scaryred,
-  textSubtle: baseColors.midnightgray500,
-  backgroundDefault: baseColors.darkishblue,
-  inputBackgroundDefault: baseColors.darkgrayishblue,
-  borderColorDefault: "#3A4150",
-
-  selectBackground: baseColors.grayishblue,
-  appBarBackground: baseColors.darkestblue,
-  virtualRobot: "#1AC0B2",
-  physicalRobot: "#956FFA",
-  robotViewportBackground: "#1F283A",
-  viewportButtonInactiveBackground: baseColors.darkestblue,
-  viewportButtonHover: baseColors.midnightgray500,
-  viewportButtonActiveBackground: baseColors.skyblue500,
-  tabsBarBackground: baseColors.darkestblue,
-  activeTabBackground: baseColors.darkishblue,
-  omniverseConfigurationSuccess: baseColors.tealGreen,
-  omniverseConfigurationFailure: baseColors.magenta,
-}
-
-/** Colors for the light theme */
-export const lightColors = {
-  primary: baseColors.lightbuttonblue,
-  textDefault: "#18181B",
-  textInverse: baseColors.white,
-  textError: baseColors.scaryred,
-  textSubtle: baseColors.midnightgray500,
-  backgroundDefault: baseColors.white,
-  inputBackgroundDefault: baseColors.white,
-  borderColorDefault: baseColors.midnightgray500,
-
-  selectBackground: "#E4E4E7",
-  appBarBackground: baseColors.white,
-  virtualRobot: "green",
-  physicalRobot: "blue",
-  robotViewportBackground: "#E4E4E7",
-  viewportButtonInactiveBackground: baseColors.midnightgray,
-  viewportButtonHover: baseColors.midnightgray500,
-  viewportButtonActiveBackground: baseColors.lightbuttonblue,
-  tabsBarBackground: baseColors.white,
-  activeTabBackground: baseColors.white,
-  omniverseConfigurationSuccess: baseColors.tealGreen,
-  omniverseConfigurationFailure: baseColors.magenta,
-}
-
-/** Gets the colors for the current theme (light or dark) */
-export function useThemeColors() {
-  return useTheme().palette.mode === "dark" ? darkColors : lightColors
-}
-
-function createRobotPadTheme(
-  mode: "light" | "dark",
-  options: ThemeOptions = {},
-) {
-  const colors = mode === "light" ? lightColors : darkColors
-  return createTheme(
-    defaultsDeep(options, {
-      palette: {
-        mode,
-        primary: {
-          main: colors.primary,
-        },
-        background: {
-          default: colors.backgroundDefault,
-        },
-      },
-      typography: {
-        allVariants: {
-          color: colors.textDefault,
-        },
-      },
-      components: {
-        MuiPaper: {
-          styleOverrides: {
-            root: {
-              backgroundColor: colors.backgroundDefault,
-            },
-          },
-        },
-        MuiTabs: {
-          styleOverrides: {
-            root: {
-              backgroundColor: colors.tabsBarBackground,
-              minHeight: "42px",
-            },
-          },
-        },
-        MuiTab: {
-          styleOverrides: {
-            root: {
-              minHeight: "42px",
-              textTransform: "none",
-              "&.Mui-selected": {
-                color: "inherit",
-                backgroundColor: colors.activeTabBackground,
-              },
-            },
-          },
-        },
-        MuiButton: {
-          defaultProps: {
-            disableElevation: true,
-          },
-          styleOverrides: {
-            root: {
-              textTransform: "none",
-              borderRadius: "10px",
-              fontSize: "14px",
-              fontWeight: 500,
-            },
-          },
-          variants: [
-            {
-              props: { variant: "outlined" },
-              style: {
-                border: "2px solid rgba(255, 255, 255, 0.6)",
-                color: "rgba(255, 255, 255, 0.6)",
-                backgroundColor: "rgba(255, 255, 255, 0.2)",
-                "&:hover": {
-                  backgroundColor: "rgba(255, 255, 255, 0.4)",
-                  border: "2px solid rgba(255, 255, 255, 0.8)",
-                },
-              },
-            },
-          ],
-        },
-        MuiFab: {
-          styleOverrides: {
-            root: {
-              width: "48px",
-              height: "48px",
-              backgroundColor: colors.viewportButtonInactiveBackground,
-              color: colors.textDefault,
-              "&:hover": {
-                backgroundColor: colors.viewportButtonHover,
-              },
-            },
-          },
-          variants: [
-            {
-              props: { variant: "active" },
-              style: {
-                backgroundColor: colors.viewportButtonActiveBackground,
-                color: colors.textInverse,
-                "&:hover": {
-                  backgroundColor: colors.viewportButtonActiveBackground,
-                },
-              },
-            },
-          ],
-        },
-      },
-    }),
-  )
-}
-
-export const darkTheme = createRobotPadTheme("dark")
-export const lightTheme = createRobotPadTheme("light")
-export const wbTheme = darkTheme