@ogs-gmbh/guthrie-mui-bindings 1.0.0

package/CHANGELOG.md

@@ -0,0 +1,12 @@
+# Changelog
+
+## 1.0.0 (2026-03-24)
+
+
+### ⚠ BREAKING CHANGES
+
+* initial release [skip ci]
+
+### Miscellaneous Chores
+
+* initial release [skip ci] ([0411edc](https://github.com/OGS-GmbH/guthrie-mui-bindings/commit/0411edc75bc0a78eb71ad9a8807496f6ebe300c8))

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 — present OGS Gesellschaft für Datenverarbeitung und Systemberatung mbH
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,142 @@
+> *We're OGS, check out our work on [github.com/ogs-gmbh](https://github.com/ogs-gmbh)*
+
+# Guthrie MUI Bindings
+*UI integration layer that connects the dynamic JSON-driven rendering capabilities of Guthrie with the component ecosystem of Material UI (MUI).*
+
+![Preview](./docs/preview.avif)
+
+<a href="./LICENSE" target="_blank"><img src="https://img.shields.io/github/license/OGS-GmbH/guthrie-mui-bindings?color=0f434e&logo=hackthebox&logoColor=000000&labelColor=ffffff" /></a>
+<a href="https://github.com/OGS-GmbH/guthrie-mui-bindings/actions/workflows/main-deploy.yml" target="_blank"><img src="https://img.shields.io/github/actions/workflow/status/OGS-GmbH/guthrie-mui-bindings/main-deploy.yml?color=0f434e&logo=rocket&logoColor=000000&labelColor=ffffff" /></a>
+<a href="https://www.npmjs.com/package/@ogs-gmbh/guthrie-mui-bindings" target="_blank"><img src="https://img.shields.io/npm/v/%40ogs-gmbh%2Fguthrie-mui-bindings?color=0f434e&logo=npm&logoColor=000000&labelColor=ffffff" /></a>
+
+- **Predefined MUI Component Bindings**\
+  Offers a curated set of bindings that map Guthrie JSON schemas directly to Material UI components, enabling ready-to-use UI elements without manual wiring.
+
+- **Icon Integration**\
+  Provides built-in support for MUI icons within JSON definitions, allowing icons to be rendered declaratively alongside components.
+
+- **Type-Safe Bindings**\
+  Ensures that all JSON-to-component mappings conform to expected TypeScript types, reducing runtime errors and enforcing consistency.
+
+- **Extensibility**\
+  Allows developers to add or override bindings for custom components, supporting domain-specific UI requirements while maintaining a uniform architecture.
+
+## Getting Started
+
+> [!IMPORTANT]
+> We're offering an extensive API-Reference covered with in-depth usage examples of this project.
+
+To get a starting point, simply refer to our documentation at [ogs-gmbh.github.io/guthrie-mui-bindings](https://ogs-gmbh.github.io/guthrie-mui-bindings).
+
+### Prerequisites
+
+- Node.js version 18 or higher
+- A package manager: e.g. npm, pnpm, ...
+
+### Installation
+
+Using npm:
+```sh
+$ npm install -D @ogs-gmbh/guthrie-mui-bindings
+```
+
+<details>
+  <summary>Using a different package managers?</summary>
+  <br/>
+  
+  Using yarn:
+  ```sh
+  $ pnpm add -D @ogs-gmbh/guthrie-mui-bindings
+  ```
+  
+  Using pnpm:
+  ```sh
+  $ pnpm add -D @ogs-gmbh/guthrie-mui-bindings
+  ```
+  
+  Using bun:
+  ```sh
+  $ bun add -D @ogs-gmbh/guthrie-mui-bindings
+  ```
+
+</details>
+
+### Usage
+
+Here's a simple example using [`getGuthrieMuiBindings`](https://ogs-gmbh.github.io/guthrie-mui-bindings/reference/Bindings/getGuthrieMuiBindings). You can get a deeper understanding by looking at the [reference](https://ogs-gmbh.github.io/guthrie-mui-bindings/reference).
+
+```tsx
+import { Guthrie, withElements, withOperators, withFns } from "@ogs-gmbh/guthrie";
+import { getGuthrieMuiBindings } from "@ogs-gmbh/guthrie-mui-bindings";
+
+function MyPage () {
+  return (
+    <Guthrie
+      elements={
+        withElements({
+          elements: getGuthrieMuiBindings()
+        })
+      }
+      operators={
+        withOperators({
+          options: {
+            universal: true
+          }
+        })
+      }
+      fns={
+        withFns({
+          options: {
+            native: true
+          }
+        })
+      }
+      page={page}
+    />
+  )
+}
+```
+
+## License
+
+The MIT License (MIT) - Please have a look at the [LICENSE file](./LICENSE) for more details.
+
+## Contributing
+Contributions are always welcome and greatly appreciated. Whether you want to report a bug, suggest a new feature, or improve the documentation, your input helps make the project better for everyone.
+
+Feel free to submit a pull request, issue or feature request.
+
+### Issues and Feature Requests
+Reporting an issue or creating a feature request is made by creating a new issue on this repository.
+
+You can create a [new issue or feature request here](../../issues/new/choose).
+
+### Pull Requests
+GitHub offers a solid guideline for contributing to open source projects through pull requests, covering key practices. These best practices provide a reliable starting point for making effective contributions.
+
+You can find the [guidelines here](https://docs.github.com/get-started/exploring-projects-on-github/contributing-to-a-project).
+
+### Code Of Conduct
+We are committed to keeping a welcoming, inclusive, and respectful community for everyone. To help us achieve this, we kindly ask that you adhere to our [Code of Conduct](./CODE_OF_CONDUCT.md).
+
+## Disclaimer
+
+All trademarks and registered trademarks mentioned are property of their respective owners and are used for identification purposes only. Use of these names does not imply endorsement or affiliation.
+
+This project is a trademark of OGS Gesellschaft für Datenverarbeitung und Systemberatung mbH. The License does not grant rights to use the trademark without permission.
+
+---
+
+<a href="https://www.ogs.de/en/">
+  <picture>
+    <source
+      srcset="https://raw.githubusercontent.com/OGS-GmbH/.github/refs/tags/v1.0.0/docs/assets/logo/light.svg"
+      media="(prefers-color-scheme: dark)"
+    />
+    <img height="64" alt="OGS Logo" src="https://raw.githubusercontent.com/OGS-GmbH/.github/refs/tags/v1.0.0/docs/assets/logo/dark.svg"
+  </picture>
+</a>
+
+Gesellschaft für Datenverarbeitung und Systemberatung mbH
+
+[Imprint](https://www.ogs.de/en/imprint/) | [Contact](https://www.ogs.de/en/contact/) | [Careers](https://www.ogs.de/en/about-ogs/#Careers)

package/components.d.ts

@@ -0,0 +1,10 @@
+import type { Elements } from "./types";
+/**
+ * `Object` containing all MUI components that are supported by the bindings. The keys are the kebab-case version of the component names, and the values are the corresponding MUI components.
+ *
+ * @since 1.0.0
+ * @author Simon Kovtyk
+ * @category Bindings
+ */
+declare const muiComponentBindings: Elements;
+export { muiComponentBindings };

package/components.mjs

@@ -0,0 +1,246 @@
+// src/components.ts
+import Button from "@mui/material/Button";
+import IconButton from "@mui/material/IconButton";
+import Autocomplete from "@mui/material/Autocomplete";
+import ButtonGroup from "@mui/material/ButtonGroup";
+import Checkbox from "@mui/material/Checkbox";
+import Fab from "@mui/material/Fab";
+import Radio from "@mui/material/Radio";
+import RadioGroup from "@mui/material/RadioGroup";
+import Rating from "@mui/material/Rating";
+import NativeSelect from "@mui/material/NativeSelect";
+import Select from "@mui/material/Select";
+import Slider from "@mui/material/Slider";
+import Switch from "@mui/material/Switch";
+import FilledInput from "@mui/material/FilledInput";
+import Input from "@mui/material/Input";
+import InputAdornment from "@mui/material/InputAdornment";
+import InputBase from "@mui/material/InputBase";
+import InputLabel from "@mui/material/InputLabel";
+import OutlinedInput from "@mui/material/OutlinedInput";
+import TextField from "@mui/material/TextField";
+import List from "@mui/material/List";
+import ListItem from "@mui/material/ListItem";
+import ToggleButton from "@mui/material/ToggleButton";
+import ToggleButtonGroup from "@mui/material/ToggleButtonGroup";
+import Avatar from "@mui/material/Avatar";
+import AvatarGroup from "@mui/material/AvatarGroup";
+import Badge from "@mui/material/Badge";
+import Chip from "@mui/material/Chip";
+import Divider from "@mui/material/Divider";
+import Icon from "@mui/material/Icon";
+import SvgIcon from "@mui/material/SvgIcon";
+import Collapse from "@mui/material/Collapse";
+import ListItemAvatar from "@mui/material/ListItemAvatar";
+import ListItemButton from "@mui/material/ListItemButton";
+import ListItemIcon from "@mui/material/ListItemIcon";
+import ListItemText from "@mui/material/ListItemText";
+import ListSubheader from "@mui/material/ListSubheader";
+import Table from "@mui/material/Table";
+import TableBody from "@mui/material/TableBody";
+import TableCell from "@mui/material/TableCell";
+import TableContainer from "@mui/material/TableContainer";
+import TableFooter from "@mui/material/TableFooter";
+import TableHead from "@mui/material/TableHead";
+import TablePagination from "@mui/material/TablePagination";
+import TableRow from "@mui/material/TableRow";
+import TableSortLabel from "@mui/material/TableSortLabel";
+import Tooltip from "@mui/material/Tooltip";
+import Typography from "@mui/material/Typography";
+import Alert from "@mui/material/Alert";
+import AlertTitle from "@mui/material/AlertTitle";
+import Backdrop from "@mui/material/Backdrop";
+import Dialog from "@mui/material/Dialog";
+import DialogActions from "@mui/material/DialogActions";
+import DialogContent from "@mui/material/DialogContent";
+import DialogContentText from "@mui/material/DialogContentText";
+import DialogTitle from "@mui/material/DialogTitle";
+import Slide from "@mui/material/Slide";
+import CircularProgress from "@mui/material/CircularProgress";
+import LinearProgress from "@mui/material/LinearProgress";
+import Skeleton from "@mui/material/Skeleton";
+import Snackbar from "@mui/material/Snackbar";
+import SnackbarContent from "@mui/material/SnackbarContent";
+import Accordion from "@mui/material/Accordion";
+import AccordionActions from "@mui/material/AccordionActions";
+import AccordionDetails from "@mui/material/AccordionDetails";
+import AccordionSummary from "@mui/material/AccordionSummary";
+import AppBar from "@mui/material/AppBar";
+import Menu from "@mui/material/Menu";
+import Toolbar from "@mui/material/Toolbar";
+import Card from "@mui/material/Card";
+import CardActionArea from "@mui/material/CardActionArea";
+import CardActions from "@mui/material/CardActions";
+import CardContent from "@mui/material/CardContent";
+import CardHeader from "@mui/material/CardHeader";
+import CardMedia from "@mui/material/CardMedia";
+import Paper from "@mui/material/Paper";
+import BottomNavigation from "@mui/material/BottomNavigation";
+import BottomNavigationAction from "@mui/material/BottomNavigationAction";
+import Breadcrumbs from "@mui/material/Breadcrumbs";
+import Link from "@mui/material/Link";
+import Drawer from "@mui/material/Drawer";
+import SwipeableDrawer from "@mui/material/SwipeableDrawer";
+import MenuItem from "@mui/material/MenuItem";
+import MenuList from "@mui/material/MenuList";
+import Popover from "@mui/material/Popover";
+import Popper from "@mui/material/Popper";
+import Pagination from "@mui/material/Pagination";
+import PaginationItem from "@mui/material/PaginationItem";
+import TablePaginationActions from "@mui/material/TablePaginationActions";
+import SpeedDial from "@mui/material/SpeedDial";
+import SpeedDialAction from "@mui/material/SpeedDialAction";
+import SpeedDialIcon from "@mui/material/SpeedDialIcon";
+import MobileStepper from "@mui/material/MobileStepper";
+import Step from "@mui/material/Step";
+import StepButton from "@mui/material/StepButton";
+import StepConnector from "@mui/material/StepConnector";
+import StepContent from "@mui/material/StepContent";
+import StepIcon from "@mui/material/StepIcon";
+import StepLabel from "@mui/material/StepLabel";
+import Stepper from "@mui/material/Stepper";
+import Tab from "@mui/material/Tab";
+import TabScrollButton from "@mui/material/TabScrollButton";
+import Tabs from "@mui/material/Tabs";
+import Box from "@mui/material/Box";
+import Container from "@mui/material/Container";
+import PigmentContainer from "@mui/material/PigmentContainer";
+import Grid from "@mui/material/Grid";
+import PigmentGrid from "@mui/material/PigmentGrid";
+import Stack from "@mui/material/Stack";
+import PigmentStack from "@mui/material/PigmentStack";
+import ImageList from "@mui/material/ImageList";
+import ImageListItem from "@mui/material/ImageListItem";
+import ImageListItemBar from "@mui/material/ImageListItemBar";
+import ClickAwayListener from "@mui/material/ClickAwayListener";
+import Modal from "@mui/material/Modal";
+import Grow from "@mui/material/Grow";
+import Portal from "@mui/material/Portal";
+import TextareaAutosize from "@mui/material/TextareaAutosize";
+import Fade from "@mui/material/Fade";
+import Zoom from "@mui/material/Zoom";
+var muiComponentBindings = {
+  "autocomplete": Autocomplete,
+  "button": Button,
+  "icon-button": IconButton,
+  "button-group": ButtonGroup,
+  "checkbox": Checkbox,
+  "fab": Fab,
+  "radio": Radio,
+  "radio-group": RadioGroup,
+  "rating": Rating,
+  "native-select": NativeSelect,
+  "select": Select,
+  "slider": Slider,
+  "switch": Switch,
+  "filled-input": FilledInput,
+  "input": Input,
+  "input-adornment": InputAdornment,
+  "input-base": InputBase,
+  "input-label": InputLabel,
+  "outlined-input": OutlinedInput,
+  "text-field": TextField,
+  "list": List,
+  "list-item": ListItem,
+  "toggle-button": ToggleButton,
+  "toggle-button-gggroup": ToggleButtonGroup,
+  "avatar": Avatar,
+  "avatar-group": AvatarGroup,
+  "badge": Badge,
+  "chip": Chip,
+  "divider": Divider,
+  "icon": Icon,
+  "svg-icon": SvgIcon,
+  "collapse": Collapse,
+  "list-item-avater": ListItemAvatar,
+  "list-item-button": ListItemButton,
+  "list-item-icon": ListItemIcon,
+  "list-item-text": ListItemText,
+  "list-subheader": ListSubheader,
+  "table": Table,
+  "table-body": TableBody,
+  "table-cell": TableCell,
+  "table-container": TableContainer,
+  "table-footer": TableFooter,
+  "table-head": TableHead,
+  "table-pagination": TablePagination,
+  "table-row": TableRow,
+  "table-sort-label": TableSortLabel,
+  "tooltip": Tooltip,
+  "typography": Typography,
+  "alert": Alert,
+  "alert-title": AlertTitle,
+  "backdrop": Backdrop,
+  "dialog": Dialog,
+  "dialog-actions": DialogActions,
+  "dialog-content": DialogContent,
+  "dialog-content-text": DialogContentText,
+  "dialog-title": DialogTitle,
+  "slide": Slide,
+  "circular-progress": CircularProgress,
+  "linear-progress": LinearProgress,
+  "skeleton": Skeleton,
+  "snackbar": Snackbar,
+  "snackbar-content": SnackbarContent,
+  "accordion": Accordion,
+  "accordion-actions": AccordionActions,
+  "accordion-details": AccordionDetails,
+  "accordion-summary": AccordionSummary,
+  "app-bar": AppBar,
+  "menu": Menu,
+  "toolbar": Toolbar,
+  "card": Card,
+  "card-action-area": CardActionArea,
+  "card-actions": CardActions,
+  "card-content": CardContent,
+  "card-header": CardHeader,
+  "card-media": CardMedia,
+  "paper": Paper,
+  "bottom-navigation": BottomNavigation,
+  "bottom-navigation-action": BottomNavigationAction,
+  "breadcrumbs": Breadcrumbs,
+  "link": Link,
+  "drawer": Drawer,
+  "swipeable-drawer": SwipeableDrawer,
+  "menu-item": MenuItem,
+  "menu-list": MenuList,
+  "popover": Popover,
+  "popper": Popper,
+  "pagination": Pagination,
+  "pagination-item": PaginationItem,
+  "table-pagination-actions": TablePaginationActions,
+  "speed-dial": SpeedDial,
+  "speed-dial-action": SpeedDialAction,
+  "speed-dial-icon": SpeedDialIcon,
+  "mobile-stepper": MobileStepper,
+  "step": Step,
+  "step-button": StepButton,
+  "step-connector": StepConnector,
+  "step-content": StepContent,
+  "step-icon": StepIcon,
+  "step-label": StepLabel,
+  "stepper": Stepper,
+  "tab": Tab,
+  "tab-scroll-button": TabScrollButton,
+  "tabs": Tabs,
+  "box": Box,
+  "container": Container,
+  "pigment-containe": PigmentContainer,
+  "grid": Grid,
+  "pigment-grid": PigmentGrid,
+  "stack": Stack,
+  "pigment-stack": PigmentStack,
+  "image-list": ImageList,
+  "image-list-item": ImageListItem,
+  "image-list-item-bar": ImageListItemBar,
+  "click-away-listener": ClickAwayListener,
+  "modal": Modal,
+  "grow": Grow,
+  "portal": Portal,
+  "textarea-autosize": TextareaAutosize,
+  "fade": Fade,
+  "zoom": Zoom
+};
+export {
+  muiComponentBindings
+};

package/icons.d.ts

@@ -0,0 +1,47 @@
+import type { Elements } from "./types";
+/**
+ * `Function` to get all MUI icons bindings with a filled style.
+ * @returns An `Object` containing all MUI icons bindings with a filled style. The keys are the kebab-case version of the icon names, and the values are the corresponding MUI icons.
+ *
+ * @since 1.0.0
+ * @author Simon Kovtyk
+ * @category Bindings
+ */
+declare function getMuiFilledIconBindings(): Elements;
+/**
+ * `Function` to get all MUI icons bindings with a outlined style.
+ * @returns An `Object` containing all MUI icons bindings with a outlined style. The keys are the kebab-case version of the icon names, and the values are the corresponding MUI icons.
+ *
+ * @since 1.0.0
+ * @author Simon Kovtyk
+ * @category Bindings
+ */
+declare function getMuiOutlinedIconBindings(): Elements;
+/**
+ * `Function` to get all MUI icons bindings with a rounded style.
+ * @returns An `Object` containing all MUI icons bindings with a rounded style. The keys are the kebab-case version of the icon names, and the values are the corresponding MUI icons.
+ *
+ * @since 1.0.0
+ * @author Simon Kovtyk
+ * @category Bindings
+ */
+declare function getMuiRoundedIconBindings(): Elements;
+/**
+ * `Function` to get all MUI icons bindings with a two-tone style.
+ * @returns An `Object` containing all MUI icons bindings with a two-tone style. The keys are the kebab-case version of the icon names, and the values are the corresponding MUI icons.
+ *
+ * @since 1.0.0
+ * @author Simon Kovtyk
+ * @category Bindings
+ */
+declare function getMuiTwoToneIconsBindings(): Elements;
+/**
+ * `Function` to get all MUI icons bindings with a sharpstyle.
+ * @returns An `Object` containing all MUI icons bindings with a sharp style. The keys are the kebab-case version of the icon names, and the values are the corresponding MUI icons.
+ *
+ * @since 1.0.0
+ * @author Simon Kovtyk
+ * @category Bindings
+ */
+declare function getMuiSharpIconBindings(): Elements;
+export { getMuiFilledIconBindings, getMuiOutlinedIconBindings, getMuiRoundedIconBindings, getMuiTwoToneIconsBindings, getMuiSharpIconBindings };

package/icons.mjs

@@ -0,0 +1,43 @@
+// src/icons.ts
+import * as icons from "@mui/icons-material";
+import { pascalCaseToKebabCase } from "./utils.mjs";
+var variantSuffix = {
+  outlined: "Outlined",
+  rounded: "Rounded",
+  twoTone: "TwoTone",
+  sharp: "Sharp"
+};
+function getMuiIconBindingBySuffix(compare) {
+  return Object.fromEntries(
+    Object.entries(icons).reduce((acc, [key, value]) => {
+      if (!compare(value.name))
+        return acc;
+      acc.push([pascalCaseToKebabCase(key), value]);
+      return acc;
+    }, [])
+  );
+}
+function getMuiFilledIconBindings() {
+  return getMuiIconBindingBySuffix(
+    (value) => value.endsWith(variantSuffix.outlined) || value.endsWith(variantSuffix.rounded) || value.endsWith(variantSuffix.twoTone) || value.endsWith(variantSuffix.sharp)
+  );
+}
+function getMuiOutlinedIconBindings() {
+  return getMuiIconBindingBySuffix((value) => value.endsWith(variantSuffix.outlined));
+}
+function getMuiRoundedIconBindings() {
+  return getMuiIconBindingBySuffix((value) => value.endsWith(variantSuffix.rounded));
+}
+function getMuiTwoToneIconsBindings() {
+  return getMuiIconBindingBySuffix((value) => value.endsWith(variantSuffix.twoTone));
+}
+function getMuiSharpIconBindings() {
+  return getMuiIconBindingBySuffix((value) => value.endsWith(variantSuffix.sharp));
+}
+export {
+  getMuiFilledIconBindings,
+  getMuiOutlinedIconBindings,
+  getMuiRoundedIconBindings,
+  getMuiSharpIconBindings,
+  getMuiTwoToneIconsBindings
+};

package/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "@ogs-gmbh/guthrie-mui-bindings",
+  "version": "1.0.0",
+  "description": "UI integration layer that connects the dynamic JSON-driven rendering capabilities of Guthrie with the component ecosystem of Material UI (MUI) in TypeScript applications.",
+  "keywords": [
+    "guthrie",
+    "mui",
+    "material-ui",
+    "react",
+    "typescript",
+    "json-renderer",
+    "dynamic-ui",
+    "ui-bindings",
+    "component-mapping",
+    "schema-driven-ui",
+    "json-to-ui",
+    "icons",
+    "ui-components",
+    "frontend",
+    "declarative-ui"
+  ],
+  "homepage": "https://ogs-gmbh.github.io/guthrie-mui-bindings/",
+  "bugs": "https://github.com/OGS-GmbH/guthrie-mui-bindings/issues",
+  "license": "MIT",
+  "author": "OGS GmbH",
+  "contributors": [
+    {
+      "name": "Simon Kovtyk",
+      "email": "simon@kovtyk.com",
+      "url": "https://simonkov.dev"
+    }
+  ],
+  "exports": {
+    ".": {
+      "types": "./public-api.d.ts",
+      "default": "./public-api.mjs"
+    }
+  },
+  "repository": "https://github.com/OGS-GmbH/guthrie-mui-bindings",
+  "type": "module",
+  "dependencies": {
+    "@mui/icons-material": "^7.3.9",
+    "@mui/material": "^7.3.9",
+    "react": "^19"
+  }
+}

package/public-api.d.ts

@@ -0,0 +1,49 @@
+import type { Elements } from "./types";
+/**
+ * Options for the {@link getGuthrieMuiBindings} function.
+ *
+ * @since 1.0.0
+ * @author Simon Kovtyk
+ * @category Types
+ */
+type GetGuthrieMuiBindingsOptions = {
+    /**
+     * Icon variants to include in the returned bindings. If not specified, only filled icons will be included.
+     * @default `["filled"]`
+     *
+     * @since 1.0.0
+     * @author Simon Kovtyk
+     */
+    icons?: Array<"outlined" | "rounded" | "twoTone" | "sharp" | "filled">;
+    /**
+     * Whether to include MUI components in the returned bindings. If not specified, components will be included by default.
+     * @default `true`
+     *
+     * @since 1.0.0
+     * @author Simon Kovtyk
+     */
+    components?: boolean;
+    /**
+     * A function to map the original component and icon names to custom names in the returned bindings. If not specified, original names will be used.
+     *
+     * @since 1.0.0
+     * @author Simon Kovtyk
+     */
+    mapNames?: (value: string) => string;
+};
+/**
+ * Get a set of bindings for using Material UI components and icons with Guthrie. The returned bindings can be customized by specifying options (see {@link GetGuthrieMuiBindingsOptions}).
+ *
+ * @param options - Options to customize the returned bindings.
+ * @returns A set of bindings for using Material UI components and icons with Guthrie.
+ *
+ * @since 1.0.0
+ * @author Simon Kovtyk
+ * @category Bindings
+ */
+declare function getGuthrieMuiBindings(options: GetGuthrieMuiBindingsOptions): Elements;
+export type { GetGuthrieMuiBindingsOptions };
+export { getGuthrieMuiBindings };
+export * from "./components";
+export * from "./icons";
+export * from "./types";

package/public-api.mjs

@@ -0,0 +1,58 @@
+// src/public-api.ts
+import { muiComponentBindings } from "./components.mjs";
+import { getMuiFilledIconBindings, getMuiOutlinedIconBindings, getMuiRoundedIconBindings, getMuiSharpIconBindings, getMuiTwoToneIconsBindings } from "./icons.mjs";
+export * from "./components.mjs";
+export * from "./icons.mjs";
+export * from "./types.mjs";
+var defaultOptions = {
+  icons: ["filled"],
+  components: true
+};
+function getGuthrieMuiBindings(options) {
+  let elements = {};
+  const configuredComponents = options?.components ?? defaultOptions.components;
+  if (configuredComponents) {
+    elements = {
+      ...elements,
+      ...muiComponentBindings
+    };
+  }
+  const configuredIcons = options?.icons ?? defaultOptions.icons;
+  configuredIcons?.forEach((variant) => {
+    let icons;
+    switch (variant) {
+      case "outlined": {
+        icons = getMuiOutlinedIconBindings();
+        break;
+      }
+      case "sharp": {
+        icons = getMuiSharpIconBindings();
+        break;
+      }
+      case "twoTone": {
+        icons = getMuiTwoToneIconsBindings();
+        break;
+      }
+      case "rounded": {
+        icons = getMuiRoundedIconBindings();
+        break;
+      }
+      case "filled": {
+        icons = getMuiFilledIconBindings();
+        break;
+      }
+    }
+    elements = {
+      ...elements,
+      ...icons
+    };
+  });
+  if (options?.mapNames === void 0)
+    return elements;
+  return Object.fromEntries(
+    Object.entries(elements).map(([key, value]) => [options.mapNames(key), value])
+  );
+}
+export {
+  getGuthrieMuiBindings
+};

package/types.d.ts

@@ -0,0 +1,10 @@
+import type { ElementType } from "react";
+/**
+ * Representing the bindings of the MUI components and icons.
+ *
+ * @since 1.0.0
+ * @author Simon Kovtyk
+ * @category Types
+ */
+type Elements = Record<string, ElementType>;
+export type { Elements };

package/utils.d.ts

@@ -0,0 +1,2 @@
+declare function pascalCaseToKebabCase(value: string): string;
+export { pascalCaseToKebabCase };

package/utils.mjs

@@ -0,0 +1,15 @@
+// src/utils.ts
+function pascalCaseToKebabCase(value) {
+  let result = "";
+  for (const char of value) {
+    if (char.toUpperCase() !== char) {
+      result += char;
+      continue;
+    }
+    result += `-${char.toLowerCase()}`;
+  }
+  return result;
+}
+export {
+  pascalCaseToKebabCase
+};