@availity/mui-tree 0.2.2 → 0.2.4

package/CHANGELOG.md

@@ -2,6 +2,18 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [0.2.4](https://github.com/Availity/element/compare/@availity/mui-tree@0.2.3...@availity/mui-tree@0.2.4) (2024-12-09)
+
+### Dependency Updates
+
+* `mui-icon` updated to version `0.2.3`
+## [0.2.3](https://github.com/Availity/element/compare/@availity/mui-tree@0.2.2...@availity/mui-tree@0.2.3) (2024-11-22)
+
+
+### Bug Fixes
+
+* **mui-tree:** don't export JsonViewer as default ([404861f](https://github.com/Availity/element/commit/404861f4cb98a0dc3237b60c4d199ab24bbb3447))
+
 ## [0.2.2](https://github.com/Availity/element/compare/@availity/mui-tree@0.2.1...@availity/mui-tree@0.2.2) (2024-11-21)
 
 

package/dist/index.d.mts

@@ -18,5 +18,6 @@ interface JsonViewerProps extends Omit<TreeViewProps, 'children'> {
     /** Data to be rendered, can be most valid javascript objects, some uncommon types may not by fully supported - like cyclical objects, proxies, symbols as keys. */
     data: Record<string, unknown>;
 }
+declare const JsonViewer: ({ data, ...rest }: JsonViewerProps) => JSX.Element;
 
-export { DynamicTreeView, type DynamicTreeViewProps, type JsonViewerProps, TreeItem, type TreeItemProps, TreeView, type TreeViewProps };
+export { DynamicTreeView, type DynamicTreeViewProps, JsonViewer, type JsonViewerProps, TreeItem, type TreeItemProps, TreeView, type TreeViewProps };

package/dist/index.d.ts

@@ -18,5 +18,6 @@ interface JsonViewerProps extends Omit<TreeViewProps, 'children'> {
     /** Data to be rendered, can be most valid javascript objects, some uncommon types may not by fully supported - like cyclical objects, proxies, symbols as keys. */
     data: Record<string, unknown>;
 }
+declare const JsonViewer: ({ data, ...rest }: JsonViewerProps) => JSX.Element;
 
-export { DynamicTreeView, type DynamicTreeViewProps, type JsonViewerProps, TreeItem, type TreeItemProps, TreeView, type TreeViewProps };
+export { DynamicTreeView, type DynamicTreeViewProps, JsonViewer, type JsonViewerProps, TreeItem, type TreeItemProps, TreeView, type TreeViewProps };

package/dist/index.js

@@ -50,6 +50,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var src_exports = {};
 __export(src_exports, {
   DynamicTreeView: () => DynamicTreeView,
+  JsonViewer: () => JsonViewer,
   TreeItem: () => TreeItem,
   TreeView: () => TreeView
 });
@@ -107,9 +108,35 @@ var DynamicTreeView = (_a) => {
 
 // src/lib/JsonViewer.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
+var isPrimitive = (value) => {
+  return ["string", "number", "boolean"].includes(typeof value);
+};
+var isObject = (value) => {
+  return !!value && typeof value === "object";
+};
+var getDetails = ({ data }) => {
+  return Object.entries(data).map((entry) => {
+    const [key, value] = entry;
+    if (isPrimitive(value)) {
+      const label = `${key}: ${value.toString()}`;
+      return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(TreeItem, { label, itemId: `${key}.${value}` }, `${key}.${value}`);
+    }
+    if (isObject(value)) {
+      const label = `${key}: ${Array.isArray(value) ? `[ ] ${value.length} items` : `{ } ${Object.keys(value).length} keys`}`;
+      return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(TreeItem, { label, itemId: key, children: getDetails({ data: value }) }, key);
+    }
+    return null;
+  });
+};
+var JsonViewer = (_a) => {
+  var _b = _a, { data } = _b, rest = __objRest(_b, ["data"]);
+  const details = getDetails({ data });
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(TreeView, __spreadProps(__spreadValues({}, rest), { children: details }));
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   DynamicTreeView,
+  JsonViewer,
   TreeItem,
   TreeView
 });

package/dist/index.mjs

@@ -82,8 +82,34 @@ var DynamicTreeView = (_a) => {
 
 // src/lib/JsonViewer.tsx
 import { jsx as jsx4 } from "react/jsx-runtime";
+var isPrimitive = (value) => {
+  return ["string", "number", "boolean"].includes(typeof value);
+};
+var isObject = (value) => {
+  return !!value && typeof value === "object";
+};
+var getDetails = ({ data }) => {
+  return Object.entries(data).map((entry) => {
+    const [key, value] = entry;
+    if (isPrimitive(value)) {
+      const label = `${key}: ${value.toString()}`;
+      return /* @__PURE__ */ jsx4(TreeItem, { label, itemId: `${key}.${value}` }, `${key}.${value}`);
+    }
+    if (isObject(value)) {
+      const label = `${key}: ${Array.isArray(value) ? `[ ] ${value.length} items` : `{ } ${Object.keys(value).length} keys`}`;
+      return /* @__PURE__ */ jsx4(TreeItem, { label, itemId: key, children: getDetails({ data: value }) }, key);
+    }
+    return null;
+  });
+};
+var JsonViewer = (_a) => {
+  var _b = _a, { data } = _b, rest = __objRest(_b, ["data"]);
+  const details = getDetails({ data });
+  return /* @__PURE__ */ jsx4(TreeView, __spreadProps(__spreadValues({}, rest), { children: details }));
+};
 export {
   DynamicTreeView,
+  JsonViewer,
   TreeItem,
   TreeView
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@availity/mui-tree",
-  "version": "0.2.2",
+  "version": "0.2.4",
   "description": "Availity MUI Tree Component - part of the @availity/element design system",
   "keywords": [
     "react",
@@ -32,7 +32,7 @@
     "publish:canary": "yarn npm publish --access public --tag canary"
   },
   "devDependencies": {
-    "@availity/mui-icon": "^0.11.0",
+    "@availity/mui-icon": "^0.11.1",
     "@availity/mui-layout": "^0.2.0",
     "@availity/mui-typography": "^0.2.1",
     "@mui/material": "^5.15.15",
@@ -42,7 +42,7 @@
     "typescript": "^5.4.5"
   },
   "peerDependencies": {
-    "@availity/mui-icon": "^0.11.0",
+    "@availity/mui-icon": "^0.11.1",
     "@mui/material": "^5.11.9",
     "react": ">=16.3.0"
   },

package/src/lib/JsonViewer.stories.tsx

@@ -1,6 +1,6 @@
 import { Meta, StoryObj } from '@storybook/react';
 
-import JsonViewer, { JsonViewerProps } from './JsonViewer';
+import { JsonViewer, JsonViewerProps } from './JsonViewer';
 // import README from '../README.md';
 
 const meta: Meta<typeof JsonViewer> = {

package/src/lib/JsonViewer.test.tsx

@@ -1,5 +1,5 @@
 import { render, fireEvent } from '@testing-library/react';
-import JsonViewer from './JsonViewer';
+import { JsonViewer } from './JsonViewer';
 
 const setup = (data: Record<string, unknown>) => render(<JsonViewer data={data} />);
 

package/src/lib/JsonViewer.tsx

@@ -35,9 +35,7 @@ const getDetails = ({ data }: JsonViewerProps): (JSX.Element | null)[] => {
   });
 };
 
-const JsonViewer = ({ data, ...rest }: JsonViewerProps): JSX.Element => {
+export const JsonViewer = ({ data, ...rest }: JsonViewerProps): JSX.Element => {
   const details = getDetails({ data });
   return <TreeView {...rest}>{details}</TreeView>;
 };
-
-export default JsonViewer;