@wandelbots/wandelbots-js-react-components 1.21.0 → 1.22.1

package/README.md

@@ -14,19 +14,22 @@ npm install @wandelbots/wandelbots-js-react-components
 Import your desired components or functions from the package:
 
 ```jsx
-import { WandelscriptEditor, ... } from '@wandelbots/wandelbots-js-react-components'
+import { JoggingPanel, ... } from '@wandelbots/wandelbots-js-react-components'
 ```
 
+See the [Storybook](https://wandelbotsgmbh.github.io/wandelbots-js-react-components) for implementation details of each component.
+
 ### Index
 
 <table>
   <tr>
     <td valign="top">
       <ul>
-        <li><a href="#wandelscript">Wandelscript</a></li>
+        <li><a href="#ui">UI</a></li>
         <ul>
           <li><a href="#joggingpanel">JoggingPanel</a></li>
           <li><a href="#wandelscripteditor">WandelscriptEditor</a></li>
+          <li><a href="#theming">Theming</a></li>
         </ul>
         <li><a href="#viewport">3D Viewport</a></li>
         <ul>
@@ -39,10 +42,14 @@ import { WandelscriptEditor, ... } from '@wandelbots/wandelbots-js-react-compone
   </tr>
 </table>
 
-### Wandelscript
+### UI
 
 #### JoggingPanel
 
+<a href="https://wandelbotsgmbh.github.io/wandelbots-js-react-components/?path=/docs/jogging-joggingpanel--docs">
+<img width="20%" alt="jogging" src="https://github.com/user-attachments/assets/07d8bd72-9378-4199-8f54-d101c857797c">
+</a>
+
 The JoggingPanel is a high-level user interface for manually moving a robot using the Wandelbots stack. It needs only a `NovaClient` instance from [wandelbots-js](https://github.com/wandelbotsgmbh/wandelbots-js) and the id of a motion group to connect to.
 
 ```tsx
@@ -76,11 +83,31 @@ type WandelscriptEditorProps = {
 }
 ```
 
+#### Theming
+
+The UI components presented in this library will respect the Material UI theme of the application they are rendered within, allowing customization with the [MUI theming system](mui.com/material-ui).
+
+Using the Wandelbots MUI theme
+To make the components look exactly like they do in the storybook, pass the [Wandelbots MUI theme](https://wandelbotsgmbh.github.io/wandelbots-js-react-components/?path=/docs/theming-wandelbots-mui-theme--docs) to ThemeProvider.
+
+```tsx
+import { ThemeProvider } from "@mui/material";
+import { createNovaMuiTheme, JoggingPanel } from "@wandelbots/wandelbots-js-react-components"
+
+const theme = createNovaMuiTheme()
+
+<ThemeProvider theme={theme}>
+  <JoggingPanel ... />
+</ThemeProvider>
+```
+
 ### Viewport
 
 #### Robot
 
-<img width="20%" alt="Screenshot 2024-08-08 at 14 17 55" src="https://github.com/user-attachments/assets/da661136-8b53-48ba-85de-63b09e3b51f3">
+<a href="https://wandelbotsgmbh.github.io/wandelbots-js-react-components/?path=/docs/3d-view-robot--docs">
+<img width="20%" alt="Robot" src="https://github.com/user-attachments/assets/da661136-8b53-48ba-85de-63b09e3b51f3">
+</a>
 
 This `Robot` component adds the robot to the 3D viewport. Use it together with the `connectedMotionGroup` from `@wandelbots/wandelbots-js`.
 
@@ -140,6 +167,10 @@ The `PresetEnvironment` component adds a default lighting setup to the 3D viewpo
 
 #### Safety
 
+<a href="https://wandelbotsgmbh.github.io/wandelbots-js-react-components/?path=/docs/3d-view-safetyzonesrenderer--docs">
+<img width="20%" alt="Bildschirmfoto 2024-09-19 um 14 26 40" src="https://github.com/user-attachments/assets/be5ef8c3-5cd2-4d6d-bfc3-cbf4eb4fc04c">
+</a>
+
 The `SafetyZonesRenderer` component visualizes the safety zones of the controller.
 
 ```tsx

package/dist/components/jogging/JoggingCartesianAxisControl.d.ts

@@ -9,6 +9,7 @@ type JoggingCartesianAxisControlProps = {
     stopJogging: () => void;
     disabled?: boolean;
 } & React.ComponentProps<typeof Stack>;
+/** A input widget to control an individual cartesian axis */
 export declare const JoggingCartesianAxisControl: (({ colors, label, getDisplayedValue, startJogging, stopJogging, disabled, ...rest }: JoggingCartesianAxisControlProps) => import("react/jsx-runtime").JSX.Element) & {
     displayName: string;
 };

package/dist/components/jogging/JoggingCartesianAxisControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"JoggingCartesianAxisControl.d.ts","sourceRoot":"","sources":["../../../src/components/jogging/JoggingCartesianAxisControl.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,qBAAqB,CAAA;AAEvC,OAAO,EAAU,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAE9C,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAA;AAGzE,KAAK,gCAAgC,GAAG;IACtC,MAAM,CAAC,EAAE,0BAA0B,CAAA;IACnC,KAAK,EAAE,SAAS,CAAA;IAChB,iBAAiB,EAAE,MAAM,MAAM,CAAA;IAC/B,YAAY,EAAE,CAAC,SAAS,EAAE,GAAG,GAAG,GAAG,KAAK,IAAI,CAAA;IAC5C,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,CAAA;AAEtC,eAAO,MAAM,2BAA2B,wFAUjC,gCAAgC;;CAkHtC,CAAA"}
+{"version":3,"file":"JoggingCartesianAxisControl.d.ts","sourceRoot":"","sources":["../../../src/components/jogging/JoggingCartesianAxisControl.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,qBAAqB,CAAA;AAEvC,OAAO,EAAU,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAE9C,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAA;AAGzE,KAAK,gCAAgC,GAAG;IACtC,MAAM,CAAC,EAAE,0BAA0B,CAAA;IACnC,KAAK,EAAE,SAAS,CAAA;IAChB,iBAAiB,EAAE,MAAM,MAAM,CAAA;IAC/B,YAAY,EAAE,CAAC,SAAS,EAAE,GAAG,GAAG,GAAG,KAAK,IAAI,CAAA;IAC5C,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,CAAA;AAEtC,6DAA6D;AAC7D,eAAO,MAAM,2BAA2B,wFAUjC,gCAAgC;;CAkHtC,CAAA"}

package/dist/components/jogging/JoggingJointRotationControl.d.ts

@@ -7,6 +7,7 @@ type JoggingJointRotationControlProps = {
     getValueDegs: () => number | undefined;
     disabled?: boolean;
 } & React.ComponentProps<typeof Stack>;
+/** A input widget to control an individual joint */
 export declare const JoggingJointRotationControl: (({ startJogging, stopJogging, lowerLimitDegs, upperLimitDegs, getValueDegs, disabled, ...rest }: JoggingJointRotationControlProps) => import("react/jsx-runtime").JSX.Element) & {
     displayName: string;
 };

package/dist/components/jogging/JoggingJointRotationControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"JoggingJointRotationControl.d.ts","sourceRoot":"","sources":["../../../src/components/jogging/JoggingJointRotationControl.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,qBAAqB,CAAA;AAUvC,KAAK,gCAAgC,GAAG;IACtC,YAAY,EAAE,CAAC,SAAS,EAAE,GAAG,GAAG,GAAG,KAAK,IAAI,CAAA;IAC5C,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,YAAY,EAAE,MAAM,MAAM,GAAG,SAAS,CAAA;IAEtC,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,CAAA;AAEtC,eAAO,MAAM,2BAA2B,oGAUjC,gCAAgC;;CAyLtC,CAAA"}
+{"version":3,"file":"JoggingJointRotationControl.d.ts","sourceRoot":"","sources":["../../../src/components/jogging/JoggingJointRotationControl.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,qBAAqB,CAAA;AAQvC,KAAK,gCAAgC,GAAG;IACtC,YAAY,EAAE,CAAC,SAAS,EAAE,GAAG,GAAG,GAAG,KAAK,IAAI,CAAA;IAC5C,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,YAAY,EAAE,MAAM,MAAM,GAAG,SAAS,CAAA;IAEtC,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,CAAA;AAEtC,oDAAoD;AACpD,eAAO,MAAM,2BAA2B,oGAUjC,gCAAgC;;CAyLtC,CAAA"}

package/dist/components/robots/UniversalRobots_UR10CB.d.ts

@@ -0,0 +1,3 @@
+import type { RobotModelProps } from "./types";
+export declare function UniversalRobots_UR10CB({ modelURL, ...props }: RobotModelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=UniversalRobots_UR10CB.d.ts.map

package/dist/components/robots/UniversalRobots_UR10CB.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UniversalRobots_UR10CB.d.ts","sourceRoot":"","sources":["../../../src/components/robots/UniversalRobots_UR10CB.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAE9C,wBAAgB,sBAAsB,CAAC,EACrC,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,2CA0SjB"}

package/dist/components/robots/UniversalRobots_UR3CB.d.ts

@@ -0,0 +1,3 @@
+import type { RobotModelProps } from "./types";
+export declare function UniversalRobots_UR3CB({ modelURL, ...props }: RobotModelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=UniversalRobots_UR3CB.d.ts.map

package/dist/components/robots/UniversalRobots_UR3CB.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UniversalRobots_UR3CB.d.ts","sourceRoot":"","sources":["../../../src/components/robots/UniversalRobots_UR3CB.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAE9C,wBAAgB,qBAAqB,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CA0F5E"}

package/dist/components/robots/UniversalRobots_UR3e.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UniversalRobots_UR3e.d.ts","sourceRoot":"","sources":["../../../src/components/robots/UniversalRobots_UR3e.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAE9C,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CA0F3E"}
+{"version":3,"file":"UniversalRobots_UR3e.d.ts","sourceRoot":"","sources":["../../../src/components/robots/UniversalRobots_UR3e.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAE9C,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CAuP3E"}

package/dist/components/robots/UniversalRobots_UR5CB.d.ts

@@ -0,0 +1,3 @@
+import type { RobotModelProps } from "./types";
+export declare function UniversalRobots_UR5CB({ modelURL, ...props }: RobotModelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=UniversalRobots_UR5CB.d.ts.map

package/dist/components/robots/UniversalRobots_UR5CB.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UniversalRobots_UR5CB.d.ts","sourceRoot":"","sources":["../../../src/components/robots/UniversalRobots_UR5CB.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAE9C,wBAAgB,qBAAqB,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CAiP5E"}