@fuf-stack/pixels 0.1.1 → 0.2.1

package/dist/Json/Json.cjs

@@ -0,0 +1,204 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Json/Json.tsx
+var Json_exports = {};
+__export(Json_exports, {
+  default: () => Json_default
+});
+module.exports = __toCommonJS(Json_exports);
+var import_react = require("react");
+var import_fa = require("react-icons/fa");
+var import_react_json_view = __toESM(require("react-json-view"), 1);
+var import_classnames2 = __toESM(require("classnames"), 1);
+
+// src/Button/Button.tsx
+var import_button = require("@nextui-org/button");
+var import_classnames = __toESM(require("classnames"), 1);
+
+// src/Button/subcomponents/LoadingSpinner.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var LoadingSpinner_default = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    className: "animate-spin h-5 w-5 text-current",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "circle",
+        {
+          className: "opacity-25",
+          cx: "12",
+          cy: "12",
+          r: "10",
+          stroke: "currentColor",
+          strokeWidth: "4"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "path",
+        {
+          className: "opacity-75",
+          d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z",
+          fill: "currentColor"
+        }
+      )
+    ]
+  }
+);
+
+// src/Button/Button.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var Button = ({
+  ariaLabel = void 0,
+  children = void 0,
+  className = void 0,
+  color = "default",
+  disabled = false,
+  icon = void 0,
+  loading = false,
+  onClick = void 0,
+  size = void 0,
+  testId = void 0,
+  type = void 0,
+  variant = "solid",
+  ...passthrouhProps
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    import_button.Button,
+    {
+      "aria-label": ariaLabel,
+      className: (0, import_classnames.default)(className),
+      color,
+      "data-testid": testId,
+      isDisabled: disabled,
+      isIconOnly: !!(icon && !children),
+      isLoading: loading,
+      onPress: onClick,
+      size,
+      spinner: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LoadingSpinner_default, {}),
+      type,
+      variant,
+      ...passthrouhProps,
+      children: [
+        icon,
+        children
+      ]
+    }
+  );
+};
+var Button_default = Button;
+
+// src/Button/index.ts
+var Button_default2 = Button_default;
+
+// src/Json/Json.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var getValue = (value) => {
+  if (typeof value === "string") {
+    return JSON.parse(value);
+  }
+  if (typeof value === "object") {
+    return value;
+  }
+  throw new Error(`${typeof value} can not be visualized`);
+};
+var Json = ({ className = null, collapsed = false, value }) => {
+  const isDarkMode = document.body.classList.contains("dark");
+  let content = null;
+  let error = null;
+  const [showDetails, setShowDetails] = (0, import_react.useState)(false);
+  try {
+    content = /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      import_react_json_view.default,
+      {
+        theme: isDarkMode ? "tomorrow" : "rjv-default",
+        style: {
+          fontSize: "12px",
+          backgroundColor: "unset"
+        },
+        name: false,
+        displayDataTypes: false,
+        src: getValue(value),
+        collapsed
+      }
+    );
+  } catch (err) {
+    error = /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      "div",
+      {
+        className: "mb-4 flex flex-col items-center rounded-lg border border-danger bg-danger-50 p-4 text-sm text-danger",
+        role: "alert",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex w-full justify-between gap-6", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_fa.FaTimesCircle, { className: "mr-2" }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "font-medium", children: "Failed to parse JSON data" })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              Button_default2,
+              {
+                color: "danger",
+                size: "sm",
+                variant: "light",
+                onClick: () => setShowDetails(!showDetails),
+                children: showDetails ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_fa.FaChevronUp, {}),
+                  " Hide Details"
+                ] }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_fa.FaChevronDown, {}),
+                  " Show Details"
+                ] })
+              }
+            )
+          ] }),
+          showDetails && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "mt-4 w-full text-left", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("strong", { children: "Error:" }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("pre", { children: [
+                err?.name,
+                ": ",
+                err?.message
+              ] })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "mt-4", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("strong", { children: "Data:" }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("pre", { children: typeof value !== "string" ? JSON.stringify(value, null, 2) : value })
+            ] })
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: (0, import_classnames2.default)(className), children: error || content });
+};
+var Json_default = Json;
+//# sourceMappingURL=Json.cjs.map

package/dist/Json/Json.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Json/Json.tsx","../../src/Button/Button.tsx","../../src/Button/subcomponents/LoadingSpinner.tsx","../../src/Button/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { useState } from 'react';\nimport { FaChevronDown, FaChevronUp, FaTimesCircle } from 'react-icons/fa';\nimport ReactJson from 'react-json-view';\n\nimport cn from 'classnames';\n\nimport Button from '../Button';\n\n/**\n * returns the value (JSON string or object) as object\n */\nconst getValue = (value: string | object) => {\n  if (typeof value === 'string') {\n    return JSON.parse(value);\n  }\n  if (typeof value === 'object') {\n    return value;\n  }\n  throw new Error(`${typeof value} can not be visualized`);\n};\n\nexport interface JsonProps {\n  /** CSS class name */\n  className?: string | string[] | null;\n  /** When set to true, all nodes will be collapsed by default. Use an integer value to collapse at a particular depth. */\n  collapsed?: boolean | number;\n  /** Object to be visualized JSON string or object */\n  value: string | object;\n}\n\n/**\n * Json renderer based on [react-json-view](https://mac-s-g.github.io/react-json-view/demo/dist/)\n */\nconst Json = ({ className = null, collapsed = false, value }: JsonProps) => {\n  const isDarkMode = document.body.classList.contains('dark');\n\n  let content: ReactNode = null;\n  let error: ReactNode = null;\n\n  const [showDetails, setShowDetails] = useState(false);\n\n  try {\n    content = (\n      <ReactJson\n        theme={isDarkMode ? 'tomorrow' : 'rjv-default'}\n        style={{\n          fontSize: '12px',\n          backgroundColor: 'unset',\n        }}\n        name={false}\n        displayDataTypes={false}\n        src={getValue(value)}\n        collapsed={collapsed}\n      />\n    );\n  } catch (err) {\n    error = (\n      <div\n        className=\"mb-4 flex flex-col items-center rounded-lg border border-danger bg-danger-50 p-4 text-sm text-danger\"\n        role=\"alert\"\n      >\n        <div className=\"flex w-full justify-between gap-6\">\n          <div className=\"flex items-center\">\n            <FaTimesCircle className=\"mr-2\" />\n            <span className=\"font-medium\">Failed to parse JSON data</span>\n          </div>\n          <Button\n            color=\"danger\"\n            size=\"sm\"\n            variant=\"light\"\n            onClick={() => setShowDetails(!showDetails)}\n          >\n            {showDetails ? (\n              <>\n                <FaChevronUp /> Hide Details\n              </>\n            ) : (\n              <>\n                <FaChevronDown /> Show Details\n              </>\n            )}\n          </Button>\n        </div>\n        {showDetails && (\n          <div className=\"mt-4 w-full text-left\">\n            <div>\n              <strong>Error:</strong>\n              <pre>\n                {/* @ts-expect-error is ok */}\n                {err?.name}: {err?.message}\n              </pre>\n            </div>\n            <div className=\"mt-4\">\n              <strong>Data:</strong>\n              <pre>\n                {typeof value !== 'string'\n                  ? JSON.stringify(value, null, 2)\n                  : value}\n              </pre>\n            </div>\n          </div>\n        )}\n      </div>\n    );\n  }\n  return <div className={cn(className)}>{error || content}</div>;\n};\n\nexport default Json;\n","import type { ButtonProps as NextButtonProps } from '@nextui-org/button';\nimport type { ReactNode } from 'react';\n\nimport { Button as NextButton } from '@nextui-org/button';\nimport cn from 'classnames';\n\nimport LoadingSpinner from './subcomponents/LoadingSpinner';\n\nexport interface ButtonProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** next ui button color  */\n  color?: NextButtonProps['color'];\n  /** disables function of the button. */\n  disabled?: boolean;\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** optional icon */\n  icon?: ReactNode;\n  /** on click event */\n  onClick?: NextButtonProps['onPress'];\n  /** 3 size options */\n  size?: NextButtonProps['size'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** sets the button type. */\n  type?: 'button' | 'submit' | 'reset' | undefined;\n  /** next ui button variants */\n  variant?: NextButtonProps['variant'];\n}\n\n/**\n * Button component based on [NextUI Button](https://nextui.org/docs/components/button)\n */\nconst Button = ({\n  ariaLabel = undefined,\n  children = undefined,\n  className = undefined,\n  color = 'default',\n  disabled = false,\n  icon = undefined,\n  loading = false,\n  onClick = undefined,\n  size = undefined,\n  testId = undefined,\n  type = undefined,\n  variant = 'solid',\n  ...passthrouhProps\n}: ButtonProps) => {\n  return (\n    <NextButton\n      aria-label={ariaLabel}\n      className={cn(className)}\n      color={color}\n      data-testid={testId}\n      isDisabled={disabled}\n      isIconOnly={!!(icon && !children)}\n      isLoading={loading}\n      onPress={onClick}\n      size={size}\n      spinner={<LoadingSpinner />}\n      type={type}\n      variant={variant}\n      {...passthrouhProps}\n    >\n      {icon}\n      {children}\n    </NextButton>\n  );\n};\n\nexport default Button;\n","/**\n * svg loading spinner for button\n * @see https://nextui.org/docs/components/button#loading\n * */\nexport default () => (\n  <svg\n    className=\"animate-spin h-5 w-5 text-current\"\n    fill=\"none\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <circle\n      className=\"opacity-25\"\n      cx=\"12\"\n      cy=\"12\"\n      r=\"10\"\n      stroke=\"currentColor\"\n      strokeWidth=\"4\"\n    />\n    <path\n      className=\"opacity-75\"\n      d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n);\n","import type { ButtonProps } from './Button';\n\nimport Button from './Button';\n\nexport default Button;\n\nexport type { ButtonProps };\n"],"mappings":"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","names":["import_classnames","import_jsx_runtime","NextButton","cn","Button_default","import_jsx_runtime","ReactJson","Button_default","cn"]}

package/dist/Json/Json.d.cts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface JsonProps {
+    /** CSS class name */
+    className?: string | string[] | null;
+    /** When set to true, all nodes will be collapsed by default. Use an integer value to collapse at a particular depth. */
+    collapsed?: boolean | number;
+    /** Object to be visualized JSON string or object */
+    value: string | object;
+}
+/**
+ * Json renderer based on [react-json-view](https://mac-s-g.github.io/react-json-view/demo/dist/)
+ */
+declare const Json: ({ className, collapsed, value }: JsonProps) => react_jsx_runtime.JSX.Element;
+
+export { type JsonProps, Json as default };

package/dist/Json/Json.d.ts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface JsonProps {
+    /** CSS class name */
+    className?: string | string[] | null;
+    /** When set to true, all nodes will be collapsed by default. Use an integer value to collapse at a particular depth. */
+    collapsed?: boolean | number;
+    /** Object to be visualized JSON string or object */
+    value: string | object;
+}
+/**
+ * Json renderer based on [react-json-view](https://mac-s-g.github.io/react-json-view/demo/dist/)
+ */
+declare const Json: ({ className, collapsed, value }: JsonProps) => react_jsx_runtime.JSX.Element;
+
+export { type JsonProps, Json as default };

package/dist/Json/Json.js

@@ -0,0 +1,10 @@
+import {
+  Json_default
+} from "../chunk-3EFVWEGP.js";
+import "../chunk-NFWS2SSN.js";
+import "../chunk-6QVKZ4AT.js";
+import "../chunk-ZFEVTQWW.js";
+export {
+  Json_default as default
+};
+//# sourceMappingURL=Json.js.map

package/dist/Json/Json.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/Json/index.cjs

@@ -0,0 +1,209 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Json/index.ts
+var Json_exports = {};
+__export(Json_exports, {
+  default: () => Json_default2
+});
+module.exports = __toCommonJS(Json_exports);
+
+// src/Json/Json.tsx
+var import_react = require("react");
+var import_fa = require("react-icons/fa");
+var import_react_json_view = __toESM(require("react-json-view"), 1);
+var import_classnames2 = __toESM(require("classnames"), 1);
+
+// src/Button/Button.tsx
+var import_button = require("@nextui-org/button");
+var import_classnames = __toESM(require("classnames"), 1);
+
+// src/Button/subcomponents/LoadingSpinner.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var LoadingSpinner_default = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  "svg",
+  {
+    className: "animate-spin h-5 w-5 text-current",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "circle",
+        {
+          className: "opacity-25",
+          cx: "12",
+          cy: "12",
+          r: "10",
+          stroke: "currentColor",
+          strokeWidth: "4"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "path",
+        {
+          className: "opacity-75",
+          d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z",
+          fill: "currentColor"
+        }
+      )
+    ]
+  }
+);
+
+// src/Button/Button.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var Button = ({
+  ariaLabel = void 0,
+  children = void 0,
+  className = void 0,
+  color = "default",
+  disabled = false,
+  icon = void 0,
+  loading = false,
+  onClick = void 0,
+  size = void 0,
+  testId = void 0,
+  type = void 0,
+  variant = "solid",
+  ...passthrouhProps
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    import_button.Button,
+    {
+      "aria-label": ariaLabel,
+      className: (0, import_classnames.default)(className),
+      color,
+      "data-testid": testId,
+      isDisabled: disabled,
+      isIconOnly: !!(icon && !children),
+      isLoading: loading,
+      onPress: onClick,
+      size,
+      spinner: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LoadingSpinner_default, {}),
+      type,
+      variant,
+      ...passthrouhProps,
+      children: [
+        icon,
+        children
+      ]
+    }
+  );
+};
+var Button_default = Button;
+
+// src/Button/index.ts
+var Button_default2 = Button_default;
+
+// src/Json/Json.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var getValue = (value) => {
+  if (typeof value === "string") {
+    return JSON.parse(value);
+  }
+  if (typeof value === "object") {
+    return value;
+  }
+  throw new Error(`${typeof value} can not be visualized`);
+};
+var Json = ({ className = null, collapsed = false, value }) => {
+  const isDarkMode = document.body.classList.contains("dark");
+  let content = null;
+  let error = null;
+  const [showDetails, setShowDetails] = (0, import_react.useState)(false);
+  try {
+    content = /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      import_react_json_view.default,
+      {
+        theme: isDarkMode ? "tomorrow" : "rjv-default",
+        style: {
+          fontSize: "12px",
+          backgroundColor: "unset"
+        },
+        name: false,
+        displayDataTypes: false,
+        src: getValue(value),
+        collapsed
+      }
+    );
+  } catch (err) {
+    error = /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      "div",
+      {
+        className: "mb-4 flex flex-col items-center rounded-lg border border-danger bg-danger-50 p-4 text-sm text-danger",
+        role: "alert",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex w-full justify-between gap-6", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_fa.FaTimesCircle, { className: "mr-2" }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "font-medium", children: "Failed to parse JSON data" })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              Button_default2,
+              {
+                color: "danger",
+                size: "sm",
+                variant: "light",
+                onClick: () => setShowDetails(!showDetails),
+                children: showDetails ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_fa.FaChevronUp, {}),
+                  " Hide Details"
+                ] }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_fa.FaChevronDown, {}),
+                  " Show Details"
+                ] })
+              }
+            )
+          ] }),
+          showDetails && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "mt-4 w-full text-left", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("strong", { children: "Error:" }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("pre", { children: [
+                err?.name,
+                ": ",
+                err?.message
+              ] })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "mt-4", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("strong", { children: "Data:" }),
+              /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("pre", { children: typeof value !== "string" ? JSON.stringify(value, null, 2) : value })
+            ] })
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: (0, import_classnames2.default)(className), children: error || content });
+};
+var Json_default = Json;
+
+// src/Json/index.ts
+var Json_default2 = Json_default;
+//# sourceMappingURL=index.cjs.map

package/dist/Json/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Json/index.ts","../../src/Json/Json.tsx","../../src/Button/Button.tsx","../../src/Button/subcomponents/LoadingSpinner.tsx","../../src/Button/index.ts"],"sourcesContent":["import Json from './Json';\n\nexport default Json;\n","import type { ReactNode } from 'react';\n\nimport { useState } from 'react';\nimport { FaChevronDown, FaChevronUp, FaTimesCircle } from 'react-icons/fa';\nimport ReactJson from 'react-json-view';\n\nimport cn from 'classnames';\n\nimport Button from '../Button';\n\n/**\n * returns the value (JSON string or object) as object\n */\nconst getValue = (value: string | object) => {\n  if (typeof value === 'string') {\n    return JSON.parse(value);\n  }\n  if (typeof value === 'object') {\n    return value;\n  }\n  throw new Error(`${typeof value} can not be visualized`);\n};\n\nexport interface JsonProps {\n  /** CSS class name */\n  className?: string | string[] | null;\n  /** When set to true, all nodes will be collapsed by default. Use an integer value to collapse at a particular depth. */\n  collapsed?: boolean | number;\n  /** Object to be visualized JSON string or object */\n  value: string | object;\n}\n\n/**\n * Json renderer based on [react-json-view](https://mac-s-g.github.io/react-json-view/demo/dist/)\n */\nconst Json = ({ className = null, collapsed = false, value }: JsonProps) => {\n  const isDarkMode = document.body.classList.contains('dark');\n\n  let content: ReactNode = null;\n  let error: ReactNode = null;\n\n  const [showDetails, setShowDetails] = useState(false);\n\n  try {\n    content = (\n      <ReactJson\n        theme={isDarkMode ? 'tomorrow' : 'rjv-default'}\n        style={{\n          fontSize: '12px',\n          backgroundColor: 'unset',\n        }}\n        name={false}\n        displayDataTypes={false}\n        src={getValue(value)}\n        collapsed={collapsed}\n      />\n    );\n  } catch (err) {\n    error = (\n      <div\n        className=\"mb-4 flex flex-col items-center rounded-lg border border-danger bg-danger-50 p-4 text-sm text-danger\"\n        role=\"alert\"\n      >\n        <div className=\"flex w-full justify-between gap-6\">\n          <div className=\"flex items-center\">\n            <FaTimesCircle className=\"mr-2\" />\n            <span className=\"font-medium\">Failed to parse JSON data</span>\n          </div>\n          <Button\n            color=\"danger\"\n            size=\"sm\"\n            variant=\"light\"\n            onClick={() => setShowDetails(!showDetails)}\n          >\n            {showDetails ? (\n              <>\n                <FaChevronUp /> Hide Details\n              </>\n            ) : (\n              <>\n                <FaChevronDown /> Show Details\n              </>\n            )}\n          </Button>\n        </div>\n        {showDetails && (\n          <div className=\"mt-4 w-full text-left\">\n            <div>\n              <strong>Error:</strong>\n              <pre>\n                {/* @ts-expect-error is ok */}\n                {err?.name}: {err?.message}\n              </pre>\n            </div>\n            <div className=\"mt-4\">\n              <strong>Data:</strong>\n              <pre>\n                {typeof value !== 'string'\n                  ? JSON.stringify(value, null, 2)\n                  : value}\n              </pre>\n            </div>\n          </div>\n        )}\n      </div>\n    );\n  }\n  return <div className={cn(className)}>{error || content}</div>;\n};\n\nexport default Json;\n","import type { ButtonProps as NextButtonProps } from '@nextui-org/button';\nimport type { ReactNode } from 'react';\n\nimport { Button as NextButton } from '@nextui-org/button';\nimport cn from 'classnames';\n\nimport LoadingSpinner from './subcomponents/LoadingSpinner';\n\nexport interface ButtonProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** next ui button color  */\n  color?: NextButtonProps['color'];\n  /** disables function of the button. */\n  disabled?: boolean;\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** optional icon */\n  icon?: ReactNode;\n  /** on click event */\n  onClick?: NextButtonProps['onPress'];\n  /** 3 size options */\n  size?: NextButtonProps['size'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** sets the button type. */\n  type?: 'button' | 'submit' | 'reset' | undefined;\n  /** next ui button variants */\n  variant?: NextButtonProps['variant'];\n}\n\n/**\n * Button component based on [NextUI Button](https://nextui.org/docs/components/button)\n */\nconst Button = ({\n  ariaLabel = undefined,\n  children = undefined,\n  className = undefined,\n  color = 'default',\n  disabled = false,\n  icon = undefined,\n  loading = false,\n  onClick = undefined,\n  size = undefined,\n  testId = undefined,\n  type = undefined,\n  variant = 'solid',\n  ...passthrouhProps\n}: ButtonProps) => {\n  return (\n    <NextButton\n      aria-label={ariaLabel}\n      className={cn(className)}\n      color={color}\n      data-testid={testId}\n      isDisabled={disabled}\n      isIconOnly={!!(icon && !children)}\n      isLoading={loading}\n      onPress={onClick}\n      size={size}\n      spinner={<LoadingSpinner />}\n      type={type}\n      variant={variant}\n      {...passthrouhProps}\n    >\n      {icon}\n      {children}\n    </NextButton>\n  );\n};\n\nexport default Button;\n","/**\n * svg loading spinner for button\n * @see https://nextui.org/docs/components/button#loading\n * */\nexport default () => (\n  <svg\n    className=\"animate-spin h-5 w-5 text-current\"\n    fill=\"none\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <circle\n      className=\"opacity-25\"\n      cx=\"12\"\n      cy=\"12\"\n      r=\"10\"\n      stroke=\"currentColor\"\n      strokeWidth=\"4\"\n    />\n    <path\n      className=\"opacity-75\"\n      d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n);\n","import type { ButtonProps } from './Button';\n\nimport Button from './Button';\n\nexport default Button;\n\nexport type { ButtonProps };\n"],"mappings":"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","names":["Json_default","import_classnames","import_jsx_runtime","NextButton","cn","Button_default","import_jsx_runtime","ReactJson","Button_default","cn","Json_default"]}

package/dist/Json/index.d.cts

@@ -0,0 +1,6 @@
+import Json from './Json.cjs';
+import 'react/jsx-runtime';
+
+
+
+export { Json as default };

package/dist/Json/index.d.ts

@@ -0,0 +1,6 @@
+import Json from './Json.js';
+import 'react/jsx-runtime';
+
+
+
+export { Json as default };

package/dist/Json/index.js

@@ -0,0 +1,13 @@
+import {
+  Json_default
+} from "../chunk-3EFVWEGP.js";
+import "../chunk-NFWS2SSN.js";
+import "../chunk-6QVKZ4AT.js";
+import "../chunk-ZFEVTQWW.js";
+
+// src/Json/index.ts
+var Json_default2 = Json_default;
+export {
+  Json_default2 as default
+};
+//# sourceMappingURL=index.js.map

package/dist/Json/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Json/index.ts"],"sourcesContent":["import Json from './Json';\n\nexport default Json;\n"],"mappings":";;;;;;;;AAEA,IAAOA,gBAAQ;","names":["Json_default"]}

package/dist/Menu/Menu.cjs

@@ -34,101 +34,18 @@ __export(Menu_exports, {
 });
 module.exports = __toCommonJS(Menu_exports);
 var import_fa6 = require("react-icons/fa6");
-var import_dropdown = require("@nextui-org/dropdown");
-var import_classnames2 = __toESM(require("classnames"), 1);
-var import_debug = __toESM(require("debug"), 1);
-
-// src/Button/Button.tsx
 var import_button = require("@nextui-org/button");
+var import_dropdown = require("@nextui-org/dropdown");
 var import_classnames = __toESM(require("classnames"), 1);
-
-// src/Button/subcomponents/LoadingSpinner.tsx
+var import_debug = __toESM(require("debug"), 1);
 var import_jsx_runtime = require("react/jsx-runtime");
-var LoadingSpinner_default = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-  "svg",
-  {
-    className: "animate-spin h-5 w-5 text-current",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "circle",
-        {
-          className: "opacity-25",
-          cx: "12",
-          cy: "12",
-          r: "10",
-          stroke: "currentColor",
-          strokeWidth: "4"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "path",
-        {
-          className: "opacity-75",
-          d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z",
-          fill: "currentColor"
-        }
-      )
-    ]
-  }
-);
-
-// src/Button/Button.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var Button = ({
-  ariaLabel = void 0,
-  children = void 0,
-  className = void 0,
-  color = "default",
-  disabled = false,
-  icon = void 0,
-  loading = false,
-  onClick = void 0,
-  size = void 0,
-  testId = void 0,
-  type = void 0,
-  variant = "solid",
-  ...passthrouhProps
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-    import_button.Button,
-    {
-      "aria-label": ariaLabel,
-      className: (0, import_classnames.default)(className),
-      color,
-      "data-testid": testId,
-      isDisabled: disabled,
-      isIconOnly: !!(icon && !children),
-      isLoading: loading,
-      onPress: onClick,
-      size,
-      spinner: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LoadingSpinner_default, {}),
-      type,
-      variant,
-      ...passthrouhProps,
-      children: [
-        icon,
-        children
-      ]
-    }
-  );
-};
-var Button_default = Button;
-
-// src/Button/index.ts
-var Button_default2 = Button_default;
-
-// src/Menu/Menu.tsx
-var import_jsx_runtime3 = require("react/jsx-runtime");
 var debug = (0, import_debug.default)("component:Menu");
 var getDisabledKeys = (items) => {
   return items.map((item) => typeof item?.items === "undefined" ? item : item.items).flat().filter((item) => {
     return Object.hasOwn(item, "disabled") && item.disabled === true;
   }).map((item) => item.key);
 };
-var renderMenuItem = (item) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+var renderMenuItem = (item) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
   import_dropdown.DropdownItem,
   {
     className: item.className,
@@ -149,12 +66,15 @@ var Menu = ({
   items
 }) => {
   debug("Menu", { items });
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_dropdown.Dropdown, { isDisabled, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dropdown.DropdownTrigger, { className: (0, import_classnames2.default)(className), "data-testid": testId, children: children ? (
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_dropdown.Dropdown, { isDisabled, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_dropdown.DropdownTrigger, { className: (0, import_classnames.default)(className), "data-testid": testId, children: children ? (
       // eslint-disable-next-line react/button-has-type
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { children })
-    ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Button_default2, { size: "sm", variant: "bordered", className: "min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_fa6.FaEllipsisVertical, {}) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { children })
+    ) : (
+      // INFO: we use next button here so that ref passing works
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { size: "sm", variant: "flat", className: "min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_fa6.FaEllipsisVertical, {}) })
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_dropdown.DropdownMenu,
       {
         items,
@@ -162,7 +82,7 @@ var Menu = ({
         onAction,
         children: (item) => {
           if ("items" in item) {
-            return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
               import_dropdown.DropdownSection,
               {
                 items: item.items,

package/dist/Menu/Menu.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Menu/Menu.tsx","../../src/Button/Button.tsx","../../src/Button/subcomponents/LoadingSpinner.tsx","../../src/Button/index.ts"],"sourcesContent":["import type { DropdownSectionProps } from '@nextui-org/dropdown';\nimport type { Key, MouseEventHandler, ReactNode } from 'react';\n\nimport { FaEllipsisVertical } from 'react-icons/fa6';\n\nimport {\n  Dropdown as NextDropdown,\n  DropdownItem as NextDropdownItem,\n  DropdownMenu as NextDropdownMenu,\n  DropdownSection as NextDropdownSection,\n  DropdownTrigger as NextDropdownTrigger,\n} from '@nextui-org/dropdown';\nimport cn from 'classnames';\nimport createDebug from 'debug';\n\nimport Button from '../Button';\n\nconst debug = createDebug('component:Menu');\n\n/**\n * Menu item type\n */\nexport interface MenuItem {\n  /** unique identifier */\n  key: string;\n  /** CSS class name */\n  className?: string;\n  /** additional description shown under the label */\n  description?: string;\n  /** disables the menu item */\n  disabled?: boolean;\n  /** menu item icon  */\n  icon?: ReactNode;\n  /** menu item name */\n  label: ReactNode;\n  /** click event handler */\n  onClick?: MouseEventHandler<HTMLLIElement>;\n  /** e2e test identifier */\n  testId?: string;\n}\n\n/**\n * Menu section type\n */\nexport interface MenuSection {\n  /** unique identifier */\n  key: string;\n  /** section label */\n  label: ReactNode;\n  /** section items (array of MenuItem) */\n  items: MenuItem[];\n}\n\nexport interface MenuProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** menu item structure */\n  items: (MenuSection | MenuItem)[];\n  /** disable menu trigger */\n  isDisabled?: boolean;\n  /** called if item is selected */\n  onAction?: (key: Key) => void;\n}\n\n/** returns String[] of disabled items/keys */\nconst getDisabledKeys = (items: (MenuSection | MenuItem)[]) => {\n  return (\n    items\n      // @ts-expect-error typing issue with MenuSection | MenuItem\n      .map((item) => (typeof item?.items === 'undefined' ? item : item.items))\n      .flat<MenuItem[]>()\n      .filter((item) => {\n        return Object.hasOwn(item, 'disabled') && item.disabled === true;\n      })\n      .map((item) => item.key)\n  );\n};\n\nconst renderMenuItem = (item: MenuItem) => (\n  <NextDropdownItem\n    className={item.className}\n    data-testid={item.testId || item.key}\n    description={item.description}\n    key={item.key}\n    onClick={item.onClick}\n    startContent={item.icon}\n  >\n    {item.label}\n  </NextDropdownItem>\n);\n\n/**\n * Dropdown menu component based on [NextUI Dropdown](https://nextui.org/docs/components/dropdown)\n */\nconst Menu = ({\n  children = null,\n  className = undefined,\n  onAction = undefined,\n  testId = undefined,\n  isDisabled = false,\n  items,\n}: MenuProps) => {\n  debug('Menu', { items });\n\n  return (\n    <NextDropdown isDisabled={isDisabled}>\n      <NextDropdownTrigger className={cn(className)} data-testid={testId}>\n        {children ? (\n          // eslint-disable-next-line react/button-has-type\n          <button>{children}</button>\n        ) : (\n          <Button size=\"sm\" variant=\"bordered\" className=\"min-w-0\">\n            <FaEllipsisVertical />\n          </Button>\n        )}\n      </NextDropdownTrigger>\n      <NextDropdownMenu\n        // aria-label=\"Dynamic Actions\"\n        items={items}\n        disabledKeys={getDisabledKeys(items)}\n        onAction={onAction}\n      >\n        {(item) => {\n          if ('items' in item) {\n            return (\n              <NextDropdownSection\n                items={item.items as MenuSection['items']}\n                title={item.label as DropdownSectionProps['title']}\n                key={item.key}\n              >\n                {/* @ts-expect-error ts problem here with render fn */}\n                {(sectionItem) => {\n                  return renderMenuItem(sectionItem);\n                }}\n              </NextDropdownSection>\n            );\n          }\n          return renderMenuItem(item);\n        }}\n      </NextDropdownMenu>\n    </NextDropdown>\n  );\n};\n\nexport default Menu;\n","import type { ButtonProps as NextButtonProps } from '@nextui-org/button';\nimport type { ReactNode } from 'react';\n\nimport { Button as NextButton } from '@nextui-org/button';\nimport cn from 'classnames';\n\nimport LoadingSpinner from './subcomponents/LoadingSpinner';\n\nexport interface ButtonProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** next ui button color  */\n  color?: NextButtonProps['color'];\n  /** disables function of the button. */\n  disabled?: boolean;\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** optional icon */\n  icon?: ReactNode;\n  /** on click event */\n  onClick?: NextButtonProps['onPress'];\n  /** 3 size options */\n  size?: NextButtonProps['size'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** sets the button type. */\n  type?: 'button' | 'submit' | 'reset' | undefined;\n  /** next ui button variants */\n  variant?: NextButtonProps['variant'];\n}\n\n/**\n * Button component based on [NextUI Button](https://nextui.org/docs/components/button)\n */\nconst Button = ({\n  ariaLabel = undefined,\n  children = undefined,\n  className = undefined,\n  color = 'default',\n  disabled = false,\n  icon = undefined,\n  loading = false,\n  onClick = undefined,\n  size = undefined,\n  testId = undefined,\n  type = undefined,\n  variant = 'solid',\n  ...passthrouhProps\n}: ButtonProps) => {\n  return (\n    <NextButton\n      aria-label={ariaLabel}\n      className={cn(className)}\n      color={color}\n      data-testid={testId}\n      isDisabled={disabled}\n      isIconOnly={!!(icon && !children)}\n      isLoading={loading}\n      onPress={onClick}\n      size={size}\n      spinner={<LoadingSpinner />}\n      type={type}\n      variant={variant}\n      {...passthrouhProps}\n    >\n      {icon}\n      {children}\n    </NextButton>\n  );\n};\n\nexport default Button;\n","/**\n * svg loading spinner for button\n * @see https://nextui.org/docs/components/button#loading\n * */\nexport default () => (\n  <svg\n    className=\"animate-spin h-5 w-5 text-current\"\n    fill=\"none\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <circle\n      className=\"opacity-25\"\n      cx=\"12\"\n      cy=\"12\"\n      r=\"10\"\n      stroke=\"currentColor\"\n      strokeWidth=\"4\"\n    />\n    <path\n      className=\"opacity-75\"\n      d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n);\n","import type { ButtonProps } from './Button';\n\nimport Button from './Button';\n\nexport default Button;\n\nexport type { ButtonProps };\n"],"mappings":"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","names":["import_classnames","import_jsx_runtime","NextButton","cn","Button_default","import_jsx_runtime","createDebug","NextDropdownItem","NextDropdown","NextDropdownTrigger","cn","Button_default","NextDropdownMenu","NextDropdownSection"]}
+{"version":3,"sources":["../../src/Menu/Menu.tsx"],"sourcesContent":["import type { DropdownSectionProps } from '@nextui-org/dropdown';\nimport type { Key, MouseEventHandler, ReactNode } from 'react';\n\nimport { FaEllipsisVertical } from 'react-icons/fa6';\n\nimport { Button } from '@nextui-org/button';\nimport {\n  Dropdown as NextDropdown,\n  DropdownItem as NextDropdownItem,\n  DropdownMenu as NextDropdownMenu,\n  DropdownSection as NextDropdownSection,\n  DropdownTrigger as NextDropdownTrigger,\n} from '@nextui-org/dropdown';\nimport cn from 'classnames';\nimport createDebug from 'debug';\n\nconst debug = createDebug('component:Menu');\n\n/**\n * Menu item type\n */\nexport interface MenuItem {\n  /** unique identifier */\n  key: string;\n  /** CSS class name */\n  className?: string;\n  /** additional description shown under the label */\n  description?: string;\n  /** disables the menu item */\n  disabled?: boolean;\n  /** menu item icon  */\n  icon?: ReactNode;\n  /** menu item name */\n  label: ReactNode;\n  /** click event handler */\n  onClick?: MouseEventHandler<HTMLLIElement>;\n  /** e2e test identifier */\n  testId?: string;\n}\n\n/**\n * Menu section type\n */\nexport interface MenuSection {\n  /** unique identifier */\n  key: string;\n  /** section label */\n  label: ReactNode;\n  /** section items (array of MenuItem) */\n  items: MenuItem[];\n}\n\nexport interface MenuProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** menu item structure */\n  items: (MenuSection | MenuItem)[];\n  /** disable menu trigger */\n  isDisabled?: boolean;\n  /** called if item is selected */\n  onAction?: (key: Key) => void;\n}\n\n/** returns String[] of disabled items/keys */\nconst getDisabledKeys = (items: (MenuSection | MenuItem)[]) => {\n  return (\n    items\n      // @ts-expect-error typing issue with MenuSection | MenuItem\n      .map((item) => (typeof item?.items === 'undefined' ? item : item.items))\n      .flat<MenuItem[]>()\n      .filter((item) => {\n        return Object.hasOwn(item, 'disabled') && item.disabled === true;\n      })\n      .map((item) => item.key)\n  );\n};\n\nconst renderMenuItem = (item: MenuItem) => (\n  <NextDropdownItem\n    className={item.className}\n    data-testid={item.testId || item.key}\n    description={item.description}\n    key={item.key}\n    onClick={item.onClick}\n    startContent={item.icon}\n  >\n    {item.label}\n  </NextDropdownItem>\n);\n\n/**\n * Dropdown menu component based on [NextUI Dropdown](https://nextui.org/docs/components/dropdown)\n */\nconst Menu = ({\n  children = null,\n  className = undefined,\n  onAction = undefined,\n  testId = undefined,\n  isDisabled = false,\n  items,\n}: MenuProps) => {\n  debug('Menu', { items });\n\n  return (\n    <NextDropdown isDisabled={isDisabled}>\n      <NextDropdownTrigger className={cn(className)} data-testid={testId}>\n        {children ? (\n          // eslint-disable-next-line react/button-has-type\n          <button>{children}</button>\n        ) : (\n          // INFO: we use next button here so that ref passing works\n          <Button size=\"sm\" variant=\"flat\" className=\"min-w-0\">\n            <FaEllipsisVertical />\n          </Button>\n        )}\n      </NextDropdownTrigger>\n      <NextDropdownMenu\n        // aria-label=\"Dynamic Actions\"\n        items={items}\n        disabledKeys={getDisabledKeys(items)}\n        onAction={onAction}\n      >\n        {(item) => {\n          if ('items' in item) {\n            return (\n              <NextDropdownSection\n                items={item.items as MenuSection['items']}\n                title={item.label as DropdownSectionProps['title']}\n                key={item.key}\n              >\n                {/* @ts-expect-error ts problem here with render fn */}\n                {(sectionItem) => {\n                  return renderMenuItem(sectionItem);\n                }}\n              </NextDropdownSection>\n            );\n          }\n          return renderMenuItem(item);\n        }}\n      </NextDropdownMenu>\n    </NextDropdown>\n  );\n};\n\nexport default Menu;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,iBAAmC;AAEnC,oBAAuB;AACvB,sBAMO;AACP,wBAAe;AACf,mBAAwB;AAoEtB;AAlEF,IAAM,YAAQ,aAAAA,SAAY,gBAAgB;AAoD1C,IAAM,kBAAkB,CAAC,UAAsC;AAC7D,SACE,MAEG,IAAI,CAAC,SAAU,OAAO,MAAM,UAAU,cAAc,OAAO,KAAK,KAAM,EACtE,KAAiB,EACjB,OAAO,CAAC,SAAS;AAChB,WAAO,OAAO,OAAO,MAAM,UAAU,KAAK,KAAK,aAAa;AAAA,EAC9D,CAAC,EACA,IAAI,CAAC,SAAS,KAAK,GAAG;AAE7B;AAEA,IAAM,iBAAiB,CAAC,SACtB;AAAA,EAAC,gBAAAC;AAAA,EAAA;AAAA,IACC,WAAW,KAAK;AAAA,IAChB,eAAa,KAAK,UAAU,KAAK;AAAA,IACjC,aAAa,KAAK;AAAA,IAElB,SAAS,KAAK;AAAA,IACd,cAAc,KAAK;AAAA,IAElB,eAAK;AAAA;AAAA,EAJD,KAAK;AAKZ;AAMF,IAAM,OAAO,CAAC;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,SAAS;AAAA,EACT,aAAa;AAAA,EACb;AACF,MAAiB;AACf,QAAM,QAAQ,EAAE,MAAM,CAAC;AAEvB,SACE,6CAAC,gBAAAC,UAAA,EAAa,YACZ;AAAA,gDAAC,gBAAAC,iBAAA,EAAoB,eAAW,kBAAAC,SAAG,SAAS,GAAG,eAAa,QACzD;AAAA;AAAA,MAEC,4CAAC,YAAQ,UAAS;AAAA;AAAA;AAAA,MAGlB,4CAAC,wBAAO,MAAK,MAAK,SAAQ,QAAO,WAAU,WACzC,sDAAC,iCAAmB,GACtB;AAAA,OAEJ;AAAA,IACA;AAAA,MAAC,gBAAAC;AAAA,MAAA;AAAA,QAEC;AAAA,QACA,cAAc,gBAAgB,KAAK;AAAA,QACnC;AAAA,QAEC,WAAC,SAAS;AACT,cAAI,WAAW,MAAM;AACnB,mBACE;AAAA,cAAC,gBAAAC;AAAA,cAAA;AAAA,gBACC,OAAO,KAAK;AAAA,gBACZ,OAAO,KAAK;AAAA,gBAIX,WAAC,gBAAgB;AAChB,yBAAO,eAAe,WAAW;AAAA,gBACnC;AAAA;AAAA,cALK,KAAK;AAAA,YAMZ;AAAA,UAEJ;AACA,iBAAO,eAAe,IAAI;AAAA,QAC5B;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEA,IAAO,eAAQ;","names":["createDebug","NextDropdownItem","NextDropdown","NextDropdownTrigger","cn","NextDropdownMenu","NextDropdownSection"]}

package/dist/Menu/Menu.js

@@ -1,9 +1,6 @@
 import {
   Menu_default
-} from "../chunk-K3QI56MF.js";
-import "../chunk-NFWS2SSN.js";
-import "../chunk-6QVKZ4AT.js";
-import "../chunk-ZFEVTQWW.js";
+} from "../chunk-Y35GJHOR.js";
 export {
   Menu_default as default
 };

package/dist/Menu/index.cjs

@@ -36,101 +36,18 @@ module.exports = __toCommonJS(Menu_exports);
 
 // src/Menu/Menu.tsx
 var import_fa6 = require("react-icons/fa6");
-var import_dropdown = require("@nextui-org/dropdown");
-var import_classnames2 = __toESM(require("classnames"), 1);
-var import_debug = __toESM(require("debug"), 1);
-
-// src/Button/Button.tsx
 var import_button = require("@nextui-org/button");
+var import_dropdown = require("@nextui-org/dropdown");
 var import_classnames = __toESM(require("classnames"), 1);
-
-// src/Button/subcomponents/LoadingSpinner.tsx
+var import_debug = __toESM(require("debug"), 1);
 var import_jsx_runtime = require("react/jsx-runtime");
-var LoadingSpinner_default = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-  "svg",
-  {
-    className: "animate-spin h-5 w-5 text-current",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    xmlns: "http://www.w3.org/2000/svg",
-    children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "circle",
-        {
-          className: "opacity-25",
-          cx: "12",
-          cy: "12",
-          r: "10",
-          stroke: "currentColor",
-          strokeWidth: "4"
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        "path",
-        {
-          className: "opacity-75",
-          d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z",
-          fill: "currentColor"
-        }
-      )
-    ]
-  }
-);
-
-// src/Button/Button.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
-var Button = ({
-  ariaLabel = void 0,
-  children = void 0,
-  className = void 0,
-  color = "default",
-  disabled = false,
-  icon = void 0,
-  loading = false,
-  onClick = void 0,
-  size = void 0,
-  testId = void 0,
-  type = void 0,
-  variant = "solid",
-  ...passthrouhProps
-}) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
-    import_button.Button,
-    {
-      "aria-label": ariaLabel,
-      className: (0, import_classnames.default)(className),
-      color,
-      "data-testid": testId,
-      isDisabled: disabled,
-      isIconOnly: !!(icon && !children),
-      isLoading: loading,
-      onPress: onClick,
-      size,
-      spinner: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(LoadingSpinner_default, {}),
-      type,
-      variant,
-      ...passthrouhProps,
-      children: [
-        icon,
-        children
-      ]
-    }
-  );
-};
-var Button_default = Button;
-
-// src/Button/index.ts
-var Button_default2 = Button_default;
-
-// src/Menu/Menu.tsx
-var import_jsx_runtime3 = require("react/jsx-runtime");
 var debug = (0, import_debug.default)("component:Menu");
 var getDisabledKeys = (items) => {
   return items.map((item) => typeof item?.items === "undefined" ? item : item.items).flat().filter((item) => {
     return Object.hasOwn(item, "disabled") && item.disabled === true;
   }).map((item) => item.key);
 };
-var renderMenuItem = (item) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+var renderMenuItem = (item) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
   import_dropdown.DropdownItem,
   {
     className: item.className,
@@ -151,12 +68,15 @@ var Menu = ({
   items
 }) => {
   debug("Menu", { items });
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_dropdown.Dropdown, { isDisabled, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_dropdown.DropdownTrigger, { className: (0, import_classnames2.default)(className), "data-testid": testId, children: children ? (
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_dropdown.Dropdown, { isDisabled, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_dropdown.DropdownTrigger, { className: (0, import_classnames.default)(className), "data-testid": testId, children: children ? (
       // eslint-disable-next-line react/button-has-type
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { children })
-    ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Button_default2, { size: "sm", variant: "bordered", className: "min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_fa6.FaEllipsisVertical, {}) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { children })
+    ) : (
+      // INFO: we use next button here so that ref passing works
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { size: "sm", variant: "flat", className: "min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_fa6.FaEllipsisVertical, {}) })
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_dropdown.DropdownMenu,
       {
         items,
@@ -164,7 +84,7 @@ var Menu = ({
         onAction,
         children: (item) => {
           if ("items" in item) {
-            return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
               import_dropdown.DropdownSection,
               {
                 items: item.items,

package/dist/Menu/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Menu/index.ts","../../src/Menu/Menu.tsx","../../src/Button/Button.tsx","../../src/Button/subcomponents/LoadingSpinner.tsx","../../src/Button/index.ts"],"sourcesContent":["import Menu from './Menu';\n\nexport default Menu;\n","import type { DropdownSectionProps } from '@nextui-org/dropdown';\nimport type { Key, MouseEventHandler, ReactNode } from 'react';\n\nimport { FaEllipsisVertical } from 'react-icons/fa6';\n\nimport {\n  Dropdown as NextDropdown,\n  DropdownItem as NextDropdownItem,\n  DropdownMenu as NextDropdownMenu,\n  DropdownSection as NextDropdownSection,\n  DropdownTrigger as NextDropdownTrigger,\n} from '@nextui-org/dropdown';\nimport cn from 'classnames';\nimport createDebug from 'debug';\n\nimport Button from '../Button';\n\nconst debug = createDebug('component:Menu');\n\n/**\n * Menu item type\n */\nexport interface MenuItem {\n  /** unique identifier */\n  key: string;\n  /** CSS class name */\n  className?: string;\n  /** additional description shown under the label */\n  description?: string;\n  /** disables the menu item */\n  disabled?: boolean;\n  /** menu item icon  */\n  icon?: ReactNode;\n  /** menu item name */\n  label: ReactNode;\n  /** click event handler */\n  onClick?: MouseEventHandler<HTMLLIElement>;\n  /** e2e test identifier */\n  testId?: string;\n}\n\n/**\n * Menu section type\n */\nexport interface MenuSection {\n  /** unique identifier */\n  key: string;\n  /** section label */\n  label: ReactNode;\n  /** section items (array of MenuItem) */\n  items: MenuItem[];\n}\n\nexport interface MenuProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** menu item structure */\n  items: (MenuSection | MenuItem)[];\n  /** disable menu trigger */\n  isDisabled?: boolean;\n  /** called if item is selected */\n  onAction?: (key: Key) => void;\n}\n\n/** returns String[] of disabled items/keys */\nconst getDisabledKeys = (items: (MenuSection | MenuItem)[]) => {\n  return (\n    items\n      // @ts-expect-error typing issue with MenuSection | MenuItem\n      .map((item) => (typeof item?.items === 'undefined' ? item : item.items))\n      .flat<MenuItem[]>()\n      .filter((item) => {\n        return Object.hasOwn(item, 'disabled') && item.disabled === true;\n      })\n      .map((item) => item.key)\n  );\n};\n\nconst renderMenuItem = (item: MenuItem) => (\n  <NextDropdownItem\n    className={item.className}\n    data-testid={item.testId || item.key}\n    description={item.description}\n    key={item.key}\n    onClick={item.onClick}\n    startContent={item.icon}\n  >\n    {item.label}\n  </NextDropdownItem>\n);\n\n/**\n * Dropdown menu component based on [NextUI Dropdown](https://nextui.org/docs/components/dropdown)\n */\nconst Menu = ({\n  children = null,\n  className = undefined,\n  onAction = undefined,\n  testId = undefined,\n  isDisabled = false,\n  items,\n}: MenuProps) => {\n  debug('Menu', { items });\n\n  return (\n    <NextDropdown isDisabled={isDisabled}>\n      <NextDropdownTrigger className={cn(className)} data-testid={testId}>\n        {children ? (\n          // eslint-disable-next-line react/button-has-type\n          <button>{children}</button>\n        ) : (\n          <Button size=\"sm\" variant=\"bordered\" className=\"min-w-0\">\n            <FaEllipsisVertical />\n          </Button>\n        )}\n      </NextDropdownTrigger>\n      <NextDropdownMenu\n        // aria-label=\"Dynamic Actions\"\n        items={items}\n        disabledKeys={getDisabledKeys(items)}\n        onAction={onAction}\n      >\n        {(item) => {\n          if ('items' in item) {\n            return (\n              <NextDropdownSection\n                items={item.items as MenuSection['items']}\n                title={item.label as DropdownSectionProps['title']}\n                key={item.key}\n              >\n                {/* @ts-expect-error ts problem here with render fn */}\n                {(sectionItem) => {\n                  return renderMenuItem(sectionItem);\n                }}\n              </NextDropdownSection>\n            );\n          }\n          return renderMenuItem(item);\n        }}\n      </NextDropdownMenu>\n    </NextDropdown>\n  );\n};\n\nexport default Menu;\n","import type { ButtonProps as NextButtonProps } from '@nextui-org/button';\nimport type { ReactNode } from 'react';\n\nimport { Button as NextButton } from '@nextui-org/button';\nimport cn from 'classnames';\n\nimport LoadingSpinner from './subcomponents/LoadingSpinner';\n\nexport interface ButtonProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** next ui button color  */\n  color?: NextButtonProps['color'];\n  /** disables function of the button. */\n  disabled?: boolean;\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** optional icon */\n  icon?: ReactNode;\n  /** on click event */\n  onClick?: NextButtonProps['onPress'];\n  /** 3 size options */\n  size?: NextButtonProps['size'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** sets the button type. */\n  type?: 'button' | 'submit' | 'reset' | undefined;\n  /** next ui button variants */\n  variant?: NextButtonProps['variant'];\n}\n\n/**\n * Button component based on [NextUI Button](https://nextui.org/docs/components/button)\n */\nconst Button = ({\n  ariaLabel = undefined,\n  children = undefined,\n  className = undefined,\n  color = 'default',\n  disabled = false,\n  icon = undefined,\n  loading = false,\n  onClick = undefined,\n  size = undefined,\n  testId = undefined,\n  type = undefined,\n  variant = 'solid',\n  ...passthrouhProps\n}: ButtonProps) => {\n  return (\n    <NextButton\n      aria-label={ariaLabel}\n      className={cn(className)}\n      color={color}\n      data-testid={testId}\n      isDisabled={disabled}\n      isIconOnly={!!(icon && !children)}\n      isLoading={loading}\n      onPress={onClick}\n      size={size}\n      spinner={<LoadingSpinner />}\n      type={type}\n      variant={variant}\n      {...passthrouhProps}\n    >\n      {icon}\n      {children}\n    </NextButton>\n  );\n};\n\nexport default Button;\n","/**\n * svg loading spinner for button\n * @see https://nextui.org/docs/components/button#loading\n * */\nexport default () => (\n  <svg\n    className=\"animate-spin h-5 w-5 text-current\"\n    fill=\"none\"\n    viewBox=\"0 0 24 24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <circle\n      className=\"opacity-25\"\n      cx=\"12\"\n      cy=\"12\"\n      r=\"10\"\n      stroke=\"currentColor\"\n      strokeWidth=\"4\"\n    />\n    <path\n      className=\"opacity-75\"\n      d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n);\n","import type { ButtonProps } from './Button';\n\nimport Button from './Button';\n\nexport default Button;\n\nexport type { ButtonProps };\n"],"mappings":"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","names":["Menu_default","import_classnames","import_jsx_runtime","NextButton","cn","Button_default","import_jsx_runtime","createDebug","NextDropdownItem","NextDropdown","NextDropdownTrigger","cn","Button_default","NextDropdownMenu","NextDropdownSection","Menu_default"]}
+{"version":3,"sources":["../../src/Menu/index.ts","../../src/Menu/Menu.tsx"],"sourcesContent":["import Menu from './Menu';\n\nexport default Menu;\n","import type { DropdownSectionProps } from '@nextui-org/dropdown';\nimport type { Key, MouseEventHandler, ReactNode } from 'react';\n\nimport { FaEllipsisVertical } from 'react-icons/fa6';\n\nimport { Button } from '@nextui-org/button';\nimport {\n  Dropdown as NextDropdown,\n  DropdownItem as NextDropdownItem,\n  DropdownMenu as NextDropdownMenu,\n  DropdownSection as NextDropdownSection,\n  DropdownTrigger as NextDropdownTrigger,\n} from '@nextui-org/dropdown';\nimport cn from 'classnames';\nimport createDebug from 'debug';\n\nconst debug = createDebug('component:Menu');\n\n/**\n * Menu item type\n */\nexport interface MenuItem {\n  /** unique identifier */\n  key: string;\n  /** CSS class name */\n  className?: string;\n  /** additional description shown under the label */\n  description?: string;\n  /** disables the menu item */\n  disabled?: boolean;\n  /** menu item icon  */\n  icon?: ReactNode;\n  /** menu item name */\n  label: ReactNode;\n  /** click event handler */\n  onClick?: MouseEventHandler<HTMLLIElement>;\n  /** e2e test identifier */\n  testId?: string;\n}\n\n/**\n * Menu section type\n */\nexport interface MenuSection {\n  /** unique identifier */\n  key: string;\n  /** section label */\n  label: ReactNode;\n  /** section items (array of MenuItem) */\n  items: MenuItem[];\n}\n\nexport interface MenuProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** menu item structure */\n  items: (MenuSection | MenuItem)[];\n  /** disable menu trigger */\n  isDisabled?: boolean;\n  /** called if item is selected */\n  onAction?: (key: Key) => void;\n}\n\n/** returns String[] of disabled items/keys */\nconst getDisabledKeys = (items: (MenuSection | MenuItem)[]) => {\n  return (\n    items\n      // @ts-expect-error typing issue with MenuSection | MenuItem\n      .map((item) => (typeof item?.items === 'undefined' ? item : item.items))\n      .flat<MenuItem[]>()\n      .filter((item) => {\n        return Object.hasOwn(item, 'disabled') && item.disabled === true;\n      })\n      .map((item) => item.key)\n  );\n};\n\nconst renderMenuItem = (item: MenuItem) => (\n  <NextDropdownItem\n    className={item.className}\n    data-testid={item.testId || item.key}\n    description={item.description}\n    key={item.key}\n    onClick={item.onClick}\n    startContent={item.icon}\n  >\n    {item.label}\n  </NextDropdownItem>\n);\n\n/**\n * Dropdown menu component based on [NextUI Dropdown](https://nextui.org/docs/components/dropdown)\n */\nconst Menu = ({\n  children = null,\n  className = undefined,\n  onAction = undefined,\n  testId = undefined,\n  isDisabled = false,\n  items,\n}: MenuProps) => {\n  debug('Menu', { items });\n\n  return (\n    <NextDropdown isDisabled={isDisabled}>\n      <NextDropdownTrigger className={cn(className)} data-testid={testId}>\n        {children ? (\n          // eslint-disable-next-line react/button-has-type\n          <button>{children}</button>\n        ) : (\n          // INFO: we use next button here so that ref passing works\n          <Button size=\"sm\" variant=\"flat\" className=\"min-w-0\">\n            <FaEllipsisVertical />\n          </Button>\n        )}\n      </NextDropdownTrigger>\n      <NextDropdownMenu\n        // aria-label=\"Dynamic Actions\"\n        items={items}\n        disabledKeys={getDisabledKeys(items)}\n        onAction={onAction}\n      >\n        {(item) => {\n          if ('items' in item) {\n            return (\n              <NextDropdownSection\n                items={item.items as MenuSection['items']}\n                title={item.label as DropdownSectionProps['title']}\n                key={item.key}\n              >\n                {/* @ts-expect-error ts problem here with render fn */}\n                {(sectionItem) => {\n                  return renderMenuItem(sectionItem);\n                }}\n              </NextDropdownSection>\n            );\n          }\n          return renderMenuItem(item);\n        }}\n      </NextDropdownMenu>\n    </NextDropdown>\n  );\n};\n\nexport default Menu;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,iBAAAA;AAAA;AAAA;;;ACGA,iBAAmC;AAEnC,oBAAuB;AACvB,sBAMO;AACP,wBAAe;AACf,mBAAwB;AAoEtB;AAlEF,IAAM,YAAQ,aAAAC,SAAY,gBAAgB;AAoD1C,IAAM,kBAAkB,CAAC,UAAsC;AAC7D,SACE,MAEG,IAAI,CAAC,SAAU,OAAO,MAAM,UAAU,cAAc,OAAO,KAAK,KAAM,EACtE,KAAiB,EACjB,OAAO,CAAC,SAAS;AAChB,WAAO,OAAO,OAAO,MAAM,UAAU,KAAK,KAAK,aAAa;AAAA,EAC9D,CAAC,EACA,IAAI,CAAC,SAAS,KAAK,GAAG;AAE7B;AAEA,IAAM,iBAAiB,CAAC,SACtB;AAAA,EAAC,gBAAAC;AAAA,EAAA;AAAA,IACC,WAAW,KAAK;AAAA,IAChB,eAAa,KAAK,UAAU,KAAK;AAAA,IACjC,aAAa,KAAK;AAAA,IAElB,SAAS,KAAK;AAAA,IACd,cAAc,KAAK;AAAA,IAElB,eAAK;AAAA;AAAA,EAJD,KAAK;AAKZ;AAMF,IAAM,OAAO,CAAC;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,SAAS;AAAA,EACT,aAAa;AAAA,EACb;AACF,MAAiB;AACf,QAAM,QAAQ,EAAE,MAAM,CAAC;AAEvB,SACE,6CAAC,gBAAAC,UAAA,EAAa,YACZ;AAAA,gDAAC,gBAAAC,iBAAA,EAAoB,eAAW,kBAAAC,SAAG,SAAS,GAAG,eAAa,QACzD;AAAA;AAAA,MAEC,4CAAC,YAAQ,UAAS;AAAA;AAAA;AAAA,MAGlB,4CAAC,wBAAO,MAAK,MAAK,SAAQ,QAAO,WAAU,WACzC,sDAAC,iCAAmB,GACtB;AAAA,OAEJ;AAAA,IACA;AAAA,MAAC,gBAAAC;AAAA,MAAA;AAAA,QAEC;AAAA,QACA,cAAc,gBAAgB,KAAK;AAAA,QACnC;AAAA,QAEC,WAAC,SAAS;AACT,cAAI,WAAW,MAAM;AACnB,mBACE;AAAA,cAAC,gBAAAC;AAAA,cAAA;AAAA,gBACC,OAAO,KAAK;AAAA,gBACZ,OAAO,KAAK;AAAA,gBAIX,WAAC,gBAAgB;AAChB,yBAAO,eAAe,WAAW;AAAA,gBACnC;AAAA;AAAA,cALK,KAAK;AAAA,YAMZ;AAAA,UAEJ;AACA,iBAAO,eAAe,IAAI;AAAA,QAC5B;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEA,IAAO,eAAQ;;;ADlJf,IAAOC,gBAAQ;","names":["Menu_default","createDebug","NextDropdownItem","NextDropdown","NextDropdownTrigger","cn","NextDropdownMenu","NextDropdownSection","Menu_default"]}

package/dist/Menu/index.js

@@ -1,9 +1,6 @@
 import {
   Menu_default
-} from "../chunk-K3QI56MF.js";
-import "../chunk-NFWS2SSN.js";
-import "../chunk-6QVKZ4AT.js";
-import "../chunk-ZFEVTQWW.js";
+} from "../chunk-Y35GJHOR.js";
 
 // src/Menu/index.ts
 var Menu_default2 = Menu_default;

package/dist/Menu/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Menu/index.ts"],"sourcesContent":["import Menu from './Menu';\n\nexport default Menu;\n"],"mappings":";;;;;;;;AAEA,IAAOA,gBAAQ;","names":["Menu_default"]}
+{"version":3,"sources":["../../src/Menu/index.ts"],"sourcesContent":["import Menu from './Menu';\n\nexport default Menu;\n"],"mappings":";;;;;AAEA,IAAOA,gBAAQ;","names":["Menu_default"]}

package/dist/chunk-3EFVWEGP.js

@@ -0,0 +1,94 @@
+import {
+  Button_default
+} from "./chunk-NFWS2SSN.js";
+
+// src/Json/Json.tsx
+import { useState } from "react";
+import { FaChevronDown, FaChevronUp, FaTimesCircle } from "react-icons/fa";
+import ReactJson from "react-json-view";
+import cn from "classnames";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var getValue = (value) => {
+  if (typeof value === "string") {
+    return JSON.parse(value);
+  }
+  if (typeof value === "object") {
+    return value;
+  }
+  throw new Error(`${typeof value} can not be visualized`);
+};
+var Json = ({ className = null, collapsed = false, value }) => {
+  const isDarkMode = document.body.classList.contains("dark");
+  let content = null;
+  let error = null;
+  const [showDetails, setShowDetails] = useState(false);
+  try {
+    content = /* @__PURE__ */ jsx(
+      ReactJson,
+      {
+        theme: isDarkMode ? "tomorrow" : "rjv-default",
+        style: {
+          fontSize: "12px",
+          backgroundColor: "unset"
+        },
+        name: false,
+        displayDataTypes: false,
+        src: getValue(value),
+        collapsed
+      }
+    );
+  } catch (err) {
+    error = /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "mb-4 flex flex-col items-center rounded-lg border border-danger bg-danger-50 p-4 text-sm text-danger",
+        role: "alert",
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex w-full justify-between gap-6", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
+              /* @__PURE__ */ jsx(FaTimesCircle, { className: "mr-2" }),
+              /* @__PURE__ */ jsx("span", { className: "font-medium", children: "Failed to parse JSON data" })
+            ] }),
+            /* @__PURE__ */ jsx(
+              Button_default,
+              {
+                color: "danger",
+                size: "sm",
+                variant: "light",
+                onClick: () => setShowDetails(!showDetails),
+                children: showDetails ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx(FaChevronUp, {}),
+                  " Hide Details"
+                ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx(FaChevronDown, {}),
+                  " Show Details"
+                ] })
+              }
+            )
+          ] }),
+          showDetails && /* @__PURE__ */ jsxs("div", { className: "mt-4 w-full text-left", children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("strong", { children: "Error:" }),
+              /* @__PURE__ */ jsxs("pre", { children: [
+                err?.name,
+                ": ",
+                err?.message
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "mt-4", children: [
+              /* @__PURE__ */ jsx("strong", { children: "Data:" }),
+              /* @__PURE__ */ jsx("pre", { children: typeof value !== "string" ? JSON.stringify(value, null, 2) : value })
+            ] })
+          ] })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn(className), children: error || content });
+};
+var Json_default = Json;
+
+export {
+  Json_default
+};
+//# sourceMappingURL=chunk-3EFVWEGP.js.map

package/dist/chunk-3EFVWEGP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Json/Json.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { useState } from 'react';\nimport { FaChevronDown, FaChevronUp, FaTimesCircle } from 'react-icons/fa';\nimport ReactJson from 'react-json-view';\n\nimport cn from 'classnames';\n\nimport Button from '../Button';\n\n/**\n * returns the value (JSON string or object) as object\n */\nconst getValue = (value: string | object) => {\n  if (typeof value === 'string') {\n    return JSON.parse(value);\n  }\n  if (typeof value === 'object') {\n    return value;\n  }\n  throw new Error(`${typeof value} can not be visualized`);\n};\n\nexport interface JsonProps {\n  /** CSS class name */\n  className?: string | string[] | null;\n  /** When set to true, all nodes will be collapsed by default. Use an integer value to collapse at a particular depth. */\n  collapsed?: boolean | number;\n  /** Object to be visualized JSON string or object */\n  value: string | object;\n}\n\n/**\n * Json renderer based on [react-json-view](https://mac-s-g.github.io/react-json-view/demo/dist/)\n */\nconst Json = ({ className = null, collapsed = false, value }: JsonProps) => {\n  const isDarkMode = document.body.classList.contains('dark');\n\n  let content: ReactNode = null;\n  let error: ReactNode = null;\n\n  const [showDetails, setShowDetails] = useState(false);\n\n  try {\n    content = (\n      <ReactJson\n        theme={isDarkMode ? 'tomorrow' : 'rjv-default'}\n        style={{\n          fontSize: '12px',\n          backgroundColor: 'unset',\n        }}\n        name={false}\n        displayDataTypes={false}\n        src={getValue(value)}\n        collapsed={collapsed}\n      />\n    );\n  } catch (err) {\n    error = (\n      <div\n        className=\"mb-4 flex flex-col items-center rounded-lg border border-danger bg-danger-50 p-4 text-sm text-danger\"\n        role=\"alert\"\n      >\n        <div className=\"flex w-full justify-between gap-6\">\n          <div className=\"flex items-center\">\n            <FaTimesCircle className=\"mr-2\" />\n            <span className=\"font-medium\">Failed to parse JSON data</span>\n          </div>\n          <Button\n            color=\"danger\"\n            size=\"sm\"\n            variant=\"light\"\n            onClick={() => setShowDetails(!showDetails)}\n          >\n            {showDetails ? (\n              <>\n                <FaChevronUp /> Hide Details\n              </>\n            ) : (\n              <>\n                <FaChevronDown /> Show Details\n              </>\n            )}\n          </Button>\n        </div>\n        {showDetails && (\n          <div className=\"mt-4 w-full text-left\">\n            <div>\n              <strong>Error:</strong>\n              <pre>\n                {/* @ts-expect-error is ok */}\n                {err?.name}: {err?.message}\n              </pre>\n            </div>\n            <div className=\"mt-4\">\n              <strong>Data:</strong>\n              <pre>\n                {typeof value !== 'string'\n                  ? JSON.stringify(value, null, 2)\n                  : value}\n              </pre>\n            </div>\n          </div>\n        )}\n      </div>\n    );\n  }\n  return <div className={cn(className)}>{error || content}</div>;\n};\n\nexport default Json;\n"],"mappings":";;;;;AAEA,SAAS,gBAAgB;AACzB,SAAS,eAAe,aAAa,qBAAqB;AAC1D,OAAO,eAAe;AAEtB,OAAO,QAAQ;AAuCT,SA8BQ,UA9BR,KAmBI,YAnBJ;AAhCN,IAAM,WAAW,CAAC,UAA2B;AAC3C,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO,KAAK,MAAM,KAAK;AAAA,EACzB;AACA,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,EACT;AACA,QAAM,IAAI,MAAM,GAAG,OAAO,KAAK,wBAAwB;AACzD;AAcA,IAAM,OAAO,CAAC,EAAE,YAAY,MAAM,YAAY,OAAO,MAAM,MAAiB;AAC1E,QAAM,aAAa,SAAS,KAAK,UAAU,SAAS,MAAM;AAE1D,MAAI,UAAqB;AACzB,MAAI,QAAmB;AAEvB,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,KAAK;AAEpD,MAAI;AACF,cACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,aAAa,aAAa;AAAA,QACjC,OAAO;AAAA,UACL,UAAU;AAAA,UACV,iBAAiB;AAAA,QACnB;AAAA,QACA,MAAM;AAAA,QACN,kBAAkB;AAAA,QAClB,KAAK,SAAS,KAAK;AAAA,QACnB;AAAA;AAAA,IACF;AAAA,EAEJ,SAAS,KAAK;AACZ,YACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,MAAK;AAAA,QAEL;AAAA,+BAAC,SAAI,WAAU,qCACb;AAAA,iCAAC,SAAI,WAAU,qBACb;AAAA,kCAAC,iBAAc,WAAU,QAAO;AAAA,cAChC,oBAAC,UAAK,WAAU,eAAc,uCAAyB;AAAA,eACzD;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,OAAM;AAAA,gBACN,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,SAAS,MAAM,eAAe,CAAC,WAAW;AAAA,gBAEzC,wBACC,iCACE;AAAA,sCAAC,eAAY;AAAA,kBAAE;AAAA,mBACjB,IAEA,iCACE;AAAA,sCAAC,iBAAc;AAAA,kBAAE;AAAA,mBACnB;AAAA;AAAA,YAEJ;AAAA,aACF;AAAA,UACC,eACC,qBAAC,SAAI,WAAU,yBACb;AAAA,iCAAC,SACC;AAAA,kCAAC,YAAO,oBAAM;AAAA,cACd,qBAAC,SAEE;AAAA,qBAAK;AAAA,gBAAK;AAAA,gBAAG,KAAK;AAAA,iBACrB;AAAA,eACF;AAAA,YACA,qBAAC,SAAI,WAAU,QACb;AAAA,kCAAC,YAAO,mBAAK;AAAA,cACb,oBAAC,SACE,iBAAO,UAAU,WACd,KAAK,UAAU,OAAO,MAAM,CAAC,IAC7B,OACN;AAAA,eACF;AAAA,aACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACA,SAAO,oBAAC,SAAI,WAAW,GAAG,SAAS,GAAI,mBAAS,SAAQ;AAC1D;AAEA,IAAO,eAAQ;","names":[]}

package/dist/{chunk-K3QI56MF.js → chunk-Y35GJHOR.js}

@@ -1,9 +1,6 @@
-import {
-  Button_default
-} from "./chunk-NFWS2SSN.js";
-
 // src/Menu/Menu.tsx
 import { FaEllipsisVertical } from "react-icons/fa6";
+import { Button } from "@nextui-org/button";
 import {
   Dropdown as NextDropdown,
   DropdownItem as NextDropdownItem,
@@ -45,7 +42,10 @@ var Menu = ({
     /* @__PURE__ */ jsx(NextDropdownTrigger, { className: cn(className), "data-testid": testId, children: children ? (
       // eslint-disable-next-line react/button-has-type
       /* @__PURE__ */ jsx("button", { children })
-    ) : /* @__PURE__ */ jsx(Button_default, { size: "sm", variant: "bordered", className: "min-w-0", children: /* @__PURE__ */ jsx(FaEllipsisVertical, {}) }) }),
+    ) : (
+      // INFO: we use next button here so that ref passing works
+      /* @__PURE__ */ jsx(Button, { size: "sm", variant: "flat", className: "min-w-0", children: /* @__PURE__ */ jsx(FaEllipsisVertical, {}) })
+    ) }),
     /* @__PURE__ */ jsx(
       NextDropdownMenu,
       {
@@ -77,4 +77,4 @@ var Menu_default = Menu;
 export {
   Menu_default
 };
-//# sourceMappingURL=chunk-K3QI56MF.js.map
+//# sourceMappingURL=chunk-Y35GJHOR.js.map

package/dist/chunk-Y35GJHOR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Menu/Menu.tsx"],"sourcesContent":["import type { DropdownSectionProps } from '@nextui-org/dropdown';\nimport type { Key, MouseEventHandler, ReactNode } from 'react';\n\nimport { FaEllipsisVertical } from 'react-icons/fa6';\n\nimport { Button } from '@nextui-org/button';\nimport {\n  Dropdown as NextDropdown,\n  DropdownItem as NextDropdownItem,\n  DropdownMenu as NextDropdownMenu,\n  DropdownSection as NextDropdownSection,\n  DropdownTrigger as NextDropdownTrigger,\n} from '@nextui-org/dropdown';\nimport cn from 'classnames';\nimport createDebug from 'debug';\n\nconst debug = createDebug('component:Menu');\n\n/**\n * Menu item type\n */\nexport interface MenuItem {\n  /** unique identifier */\n  key: string;\n  /** CSS class name */\n  className?: string;\n  /** additional description shown under the label */\n  description?: string;\n  /** disables the menu item */\n  disabled?: boolean;\n  /** menu item icon  */\n  icon?: ReactNode;\n  /** menu item name */\n  label: ReactNode;\n  /** click event handler */\n  onClick?: MouseEventHandler<HTMLLIElement>;\n  /** e2e test identifier */\n  testId?: string;\n}\n\n/**\n * Menu section type\n */\nexport interface MenuSection {\n  /** unique identifier */\n  key: string;\n  /** section label */\n  label: ReactNode;\n  /** section items (array of MenuItem) */\n  items: MenuItem[];\n}\n\nexport interface MenuProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** menu item structure */\n  items: (MenuSection | MenuItem)[];\n  /** disable menu trigger */\n  isDisabled?: boolean;\n  /** called if item is selected */\n  onAction?: (key: Key) => void;\n}\n\n/** returns String[] of disabled items/keys */\nconst getDisabledKeys = (items: (MenuSection | MenuItem)[]) => {\n  return (\n    items\n      // @ts-expect-error typing issue with MenuSection | MenuItem\n      .map((item) => (typeof item?.items === 'undefined' ? item : item.items))\n      .flat<MenuItem[]>()\n      .filter((item) => {\n        return Object.hasOwn(item, 'disabled') && item.disabled === true;\n      })\n      .map((item) => item.key)\n  );\n};\n\nconst renderMenuItem = (item: MenuItem) => (\n  <NextDropdownItem\n    className={item.className}\n    data-testid={item.testId || item.key}\n    description={item.description}\n    key={item.key}\n    onClick={item.onClick}\n    startContent={item.icon}\n  >\n    {item.label}\n  </NextDropdownItem>\n);\n\n/**\n * Dropdown menu component based on [NextUI Dropdown](https://nextui.org/docs/components/dropdown)\n */\nconst Menu = ({\n  children = null,\n  className = undefined,\n  onAction = undefined,\n  testId = undefined,\n  isDisabled = false,\n  items,\n}: MenuProps) => {\n  debug('Menu', { items });\n\n  return (\n    <NextDropdown isDisabled={isDisabled}>\n      <NextDropdownTrigger className={cn(className)} data-testid={testId}>\n        {children ? (\n          // eslint-disable-next-line react/button-has-type\n          <button>{children}</button>\n        ) : (\n          // INFO: we use next button here so that ref passing works\n          <Button size=\"sm\" variant=\"flat\" className=\"min-w-0\">\n            <FaEllipsisVertical />\n          </Button>\n        )}\n      </NextDropdownTrigger>\n      <NextDropdownMenu\n        // aria-label=\"Dynamic Actions\"\n        items={items}\n        disabledKeys={getDisabledKeys(items)}\n        onAction={onAction}\n      >\n        {(item) => {\n          if ('items' in item) {\n            return (\n              <NextDropdownSection\n                items={item.items as MenuSection['items']}\n                title={item.label as DropdownSectionProps['title']}\n                key={item.key}\n              >\n                {/* @ts-expect-error ts problem here with render fn */}\n                {(sectionItem) => {\n                  return renderMenuItem(sectionItem);\n                }}\n              </NextDropdownSection>\n            );\n          }\n          return renderMenuItem(item);\n        }}\n      </NextDropdownMenu>\n    </NextDropdown>\n  );\n};\n\nexport default Menu;\n"],"mappings":";AAGA,SAAS,0BAA0B;AAEnC,SAAS,cAAc;AACvB;AAAA,EACE,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,gBAAgB;AAAA,EAChB,mBAAmB;AAAA,EACnB,mBAAmB;AAAA,OACd;AACP,OAAO,QAAQ;AACf,OAAO,iBAAiB;AAoEtB,cA0BE,YA1BF;AAlEF,IAAM,QAAQ,YAAY,gBAAgB;AAoD1C,IAAM,kBAAkB,CAAC,UAAsC;AAC7D,SACE,MAEG,IAAI,CAAC,SAAU,OAAO,MAAM,UAAU,cAAc,OAAO,KAAK,KAAM,EACtE,KAAiB,EACjB,OAAO,CAAC,SAAS;AAChB,WAAO,OAAO,OAAO,MAAM,UAAU,KAAK,KAAK,aAAa;AAAA,EAC9D,CAAC,EACA,IAAI,CAAC,SAAS,KAAK,GAAG;AAE7B;AAEA,IAAM,iBAAiB,CAAC,SACtB;AAAA,EAAC;AAAA;AAAA,IACC,WAAW,KAAK;AAAA,IAChB,eAAa,KAAK,UAAU,KAAK;AAAA,IACjC,aAAa,KAAK;AAAA,IAElB,SAAS,KAAK;AAAA,IACd,cAAc,KAAK;AAAA,IAElB,eAAK;AAAA;AAAA,EAJD,KAAK;AAKZ;AAMF,IAAM,OAAO,CAAC;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,SAAS;AAAA,EACT,aAAa;AAAA,EACb;AACF,MAAiB;AACf,QAAM,QAAQ,EAAE,MAAM,CAAC;AAEvB,SACE,qBAAC,gBAAa,YACZ;AAAA,wBAAC,uBAAoB,WAAW,GAAG,SAAS,GAAG,eAAa,QACzD;AAAA;AAAA,MAEC,oBAAC,YAAQ,UAAS;AAAA;AAAA;AAAA,MAGlB,oBAAC,UAAO,MAAK,MAAK,SAAQ,QAAO,WAAU,WACzC,8BAAC,sBAAmB,GACtB;AAAA,OAEJ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QAEC;AAAA,QACA,cAAc,gBAAgB,KAAK;AAAA,QACnC;AAAA,QAEC,WAAC,SAAS;AACT,cAAI,WAAW,MAAM;AACnB,mBACE;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO,KAAK;AAAA,gBACZ,OAAO,KAAK;AAAA,gBAIX,WAAC,gBAAgB;AAChB,yBAAO,eAAe,WAAW;AAAA,gBACnC;AAAA;AAAA,cALK,KAAK;AAAA,YAMZ;AAAA,UAEJ;AACA,iBAAO,eAAe,IAAI;AAAA,QAC5B;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEA,IAAO,eAAQ;","names":[]}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@fuf-stack/pixels",
   "description": "fuf react component library",
   "author": "Hannes Tiede",
-  "version": "0.1.1",
+  "version": "0.2.1",
   "type": "module",
   "exports": {
     "./": "./dist/"
@@ -56,8 +56,8 @@
     "@types/debug": "4.1.12",
     "@types/react": "18.2.69",
     "@types/react-dom": "18.2.22",
-    "storybook-config": "0.0.1",
-    "tailwind-config": "0.0.1"
+    "tailwind-config": "0.0.1",
+    "storybook-config": "0.0.1"
   },
   "scripts": {
     "build": "rm -rf ./dist && tsup",

package/dist/chunk-K3QI56MF.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/Menu/Menu.tsx"],"sourcesContent":["import type { DropdownSectionProps } from '@nextui-org/dropdown';\nimport type { Key, MouseEventHandler, ReactNode } from 'react';\n\nimport { FaEllipsisVertical } from 'react-icons/fa6';\n\nimport {\n  Dropdown as NextDropdown,\n  DropdownItem as NextDropdownItem,\n  DropdownMenu as NextDropdownMenu,\n  DropdownSection as NextDropdownSection,\n  DropdownTrigger as NextDropdownTrigger,\n} from '@nextui-org/dropdown';\nimport cn from 'classnames';\nimport createDebug from 'debug';\n\nimport Button from '../Button';\n\nconst debug = createDebug('component:Menu');\n\n/**\n * Menu item type\n */\nexport interface MenuItem {\n  /** unique identifier */\n  key: string;\n  /** CSS class name */\n  className?: string;\n  /** additional description shown under the label */\n  description?: string;\n  /** disables the menu item */\n  disabled?: boolean;\n  /** menu item icon  */\n  icon?: ReactNode;\n  /** menu item name */\n  label: ReactNode;\n  /** click event handler */\n  onClick?: MouseEventHandler<HTMLLIElement>;\n  /** e2e test identifier */\n  testId?: string;\n}\n\n/**\n * Menu section type\n */\nexport interface MenuSection {\n  /** unique identifier */\n  key: string;\n  /** section label */\n  label: ReactNode;\n  /** section items (array of MenuItem) */\n  items: MenuItem[];\n}\n\nexport interface MenuProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | string[];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** menu item structure */\n  items: (MenuSection | MenuItem)[];\n  /** disable menu trigger */\n  isDisabled?: boolean;\n  /** called if item is selected */\n  onAction?: (key: Key) => void;\n}\n\n/** returns String[] of disabled items/keys */\nconst getDisabledKeys = (items: (MenuSection | MenuItem)[]) => {\n  return (\n    items\n      // @ts-expect-error typing issue with MenuSection | MenuItem\n      .map((item) => (typeof item?.items === 'undefined' ? item : item.items))\n      .flat<MenuItem[]>()\n      .filter((item) => {\n        return Object.hasOwn(item, 'disabled') && item.disabled === true;\n      })\n      .map((item) => item.key)\n  );\n};\n\nconst renderMenuItem = (item: MenuItem) => (\n  <NextDropdownItem\n    className={item.className}\n    data-testid={item.testId || item.key}\n    description={item.description}\n    key={item.key}\n    onClick={item.onClick}\n    startContent={item.icon}\n  >\n    {item.label}\n  </NextDropdownItem>\n);\n\n/**\n * Dropdown menu component based on [NextUI Dropdown](https://nextui.org/docs/components/dropdown)\n */\nconst Menu = ({\n  children = null,\n  className = undefined,\n  onAction = undefined,\n  testId = undefined,\n  isDisabled = false,\n  items,\n}: MenuProps) => {\n  debug('Menu', { items });\n\n  return (\n    <NextDropdown isDisabled={isDisabled}>\n      <NextDropdownTrigger className={cn(className)} data-testid={testId}>\n        {children ? (\n          // eslint-disable-next-line react/button-has-type\n          <button>{children}</button>\n        ) : (\n          <Button size=\"sm\" variant=\"bordered\" className=\"min-w-0\">\n            <FaEllipsisVertical />\n          </Button>\n        )}\n      </NextDropdownTrigger>\n      <NextDropdownMenu\n        // aria-label=\"Dynamic Actions\"\n        items={items}\n        disabledKeys={getDisabledKeys(items)}\n        onAction={onAction}\n      >\n        {(item) => {\n          if ('items' in item) {\n            return (\n              <NextDropdownSection\n                items={item.items as MenuSection['items']}\n                title={item.label as DropdownSectionProps['title']}\n                key={item.key}\n              >\n                {/* @ts-expect-error ts problem here with render fn */}\n                {(sectionItem) => {\n                  return renderMenuItem(sectionItem);\n                }}\n              </NextDropdownSection>\n            );\n          }\n          return renderMenuItem(item);\n        }}\n      </NextDropdownMenu>\n    </NextDropdown>\n  );\n};\n\nexport default Menu;\n"],"mappings":";;;;;AAGA,SAAS,0BAA0B;AAEnC;AAAA,EACE,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,gBAAgB;AAAA,EAChB,mBAAmB;AAAA,EACnB,mBAAmB;AAAA,OACd;AACP,OAAO,QAAQ;AACf,OAAO,iBAAiB;AAsEtB,cA0BE,YA1BF;AAlEF,IAAM,QAAQ,YAAY,gBAAgB;AAoD1C,IAAM,kBAAkB,CAAC,UAAsC;AAC7D,SACE,MAEG,IAAI,CAAC,SAAU,OAAO,MAAM,UAAU,cAAc,OAAO,KAAK,KAAM,EACtE,KAAiB,EACjB,OAAO,CAAC,SAAS;AAChB,WAAO,OAAO,OAAO,MAAM,UAAU,KAAK,KAAK,aAAa;AAAA,EAC9D,CAAC,EACA,IAAI,CAAC,SAAS,KAAK,GAAG;AAE7B;AAEA,IAAM,iBAAiB,CAAC,SACtB;AAAA,EAAC;AAAA;AAAA,IACC,WAAW,KAAK;AAAA,IAChB,eAAa,KAAK,UAAU,KAAK;AAAA,IACjC,aAAa,KAAK;AAAA,IAElB,SAAS,KAAK;AAAA,IACd,cAAc,KAAK;AAAA,IAElB,eAAK;AAAA;AAAA,EAJD,KAAK;AAKZ;AAMF,IAAM,OAAO,CAAC;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,SAAS;AAAA,EACT,aAAa;AAAA,EACb;AACF,MAAiB;AACf,QAAM,QAAQ,EAAE,MAAM,CAAC;AAEvB,SACE,qBAAC,gBAAa,YACZ;AAAA,wBAAC,uBAAoB,WAAW,GAAG,SAAS,GAAG,eAAa,QACzD;AAAA;AAAA,MAEC,oBAAC,YAAQ,UAAS;AAAA,QAElB,oBAAC,kBAAO,MAAK,MAAK,SAAQ,YAAW,WAAU,WAC7C,8BAAC,sBAAmB,GACtB,GAEJ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QAEC;AAAA,QACA,cAAc,gBAAgB,KAAK;AAAA,QACnC;AAAA,QAEC,WAAC,SAAS;AACT,cAAI,WAAW,MAAM;AACnB,mBACE;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO,KAAK;AAAA,gBACZ,OAAO,KAAK;AAAA,gBAIX,WAAC,gBAAgB;AAChB,yBAAO,eAAe,WAAW;AAAA,gBACnC;AAAA;AAAA,cALK,KAAK;AAAA,YAMZ;AAAA,UAEJ;AACA,iBAAO,eAAe,IAAI;AAAA,QAC5B;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEA,IAAO,eAAQ;","names":[]}