@zidsa/zidmui 1.4.40 → 1.4.41

package/dist/cjs/components/app-alert.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const material = require("@mui/material");
+const appButton = require("./app-button.js");
+const appTypography = require("./app-typography.js");
+const stackColumn = require("./stack-column.js");
+const stackRow = require("./stack-row.js");
+const AppAlert = ({
+  title,
+  titleProps,
+  link,
+  content,
+  children,
+  onClose,
+  actions,
+  isLoading,
+  ...props
+}) => {
+  if (isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsx(material.Alert, { ...props, onClose, variant: "standard", children: /* @__PURE__ */ jsxRuntime.jsx(stackColumn.StackColumn, { gap: 1.5, justifyContent: "center", width: "100%", alignItems: "center", children: /* @__PURE__ */ jsxRuntime.jsx(material.CircularProgress, { size: 22 }) }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(material.Alert, { ...props, onClose, variant: "standard", children: /* @__PURE__ */ jsxRuntime.jsxs(stackColumn.StackColumn, { gap: 1.5, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(stackColumn.StackColumn, { gap: 0.5, children: [
+      title && /* @__PURE__ */ jsxRuntime.jsx(material.AlertTitle, { mb: 0, variant: "subtitle2", ...titleProps, children: title }),
+      content && /* @__PURE__ */ jsxRuntime.jsx(appTypography.AppTypography, { variant: "body2", color: title ? "text.tertiary" : "text.primary", children: content }),
+      link && link,
+      children
+    ] }),
+    actions && /* @__PURE__ */ jsxRuntime.jsx(stackRow.StackRow, { gap: 1, children: actions })
+  ] }) });
+};
+const AppAlertButton = ({ children, ...props }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(appButton.AppButton, { variant: "outlined", size: "small", ...props, children });
+};
+exports.AppAlert = AppAlert;
+exports.AppAlertButton = AppAlertButton;
+//# sourceMappingURL=app-alert.js.map

package/dist/cjs/components/app-alert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-alert.js","sources":["../../../src/components/app-alert.tsx"],"sourcesContent":["import { Alert, AlertProps, AlertTitle, AlertTitleProps, CircularProgress } from '@mui/material';\n\nimport { AppButton, AppButtonProps } from './app-button';\nimport { AppTypography } from './app-typography';\nimport { StackColumn } from './stack-column';\nimport { StackRow } from './stack-row';\n\n//\n//\n\nexport type AppAlertProps = {\n  title?: string | React.ReactNode;\n  titleProps?: AlertTitleProps;\n  link?: React.ReactNode;\n  content?: React.ReactNode;\n  actions?: React.ReactNode;\n  isLoading?: boolean;\n} & Omit<AlertProps, 'title' | 'variant' | 'content'>;\n\nexport const AppAlert: React.FC<AppAlertProps> = ({\n  title,\n  titleProps,\n  link,\n  content,\n  children,\n  onClose,\n  actions,\n  isLoading,\n  ...props\n}) => {\n  if (isLoading) {\n    return (\n      <Alert {...props} onClose={onClose} variant=\"standard\">\n        <StackColumn gap={1.5} justifyContent=\"center\" width=\"100%\" alignItems=\"center\">\n          <CircularProgress size={22} />\n        </StackColumn>\n      </Alert>\n    );\n  }\n\n  return (\n    <Alert {...props} onClose={onClose} variant=\"standard\">\n      <StackColumn gap={1.5}>\n        <StackColumn gap={0.5}>\n          {title && (\n            <AlertTitle mb={0} variant=\"subtitle2\" {...titleProps}>\n              {title}\n            </AlertTitle>\n          )}\n          {content && (\n            <AppTypography variant=\"body2\" color={title ? 'text.tertiary' : 'text.primary'}>\n              {content}\n            </AppTypography>\n          )}\n          {link && link}\n          {children}\n        </StackColumn>\n\n        {actions && <StackRow gap={1}>{actions}</StackRow>}\n      </StackColumn>\n    </Alert>\n  );\n};\n\n//\n\nexport const AppAlertButton: React.FC<AppButtonProps> = ({ children, ...props }) => {\n  return (\n    <AppButton variant=\"outlined\" size=\"small\" {...props}>\n      {children}\n    </AppButton>\n  );\n};\n"],"names":["jsx","Alert","StackColumn","CircularProgress","jsxs","AlertTitle","AppTypography","StackRow","AppButton"],"mappings":";;;;;;;;AAmBO,MAAM,WAAoC,CAAC;AAAA,EAChD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,MAAI,WAAW;AACb,WACEA,2BAAAA,IAACC,SAAAA,SAAO,GAAG,OAAO,SAAkB,SAAQ,YAC1C,UAAAD,2BAAAA,IAACE,yBAAA,EAAY,KAAK,KAAK,gBAAe,UAAS,OAAM,QAAO,YAAW,UACrE,yCAACC,SAAAA,kBAAA,EAAiB,MAAM,GAAA,CAAI,EAAA,CAC9B,EAAA,CACF;AAAA,EAEJ;AAEA,SACEH,2BAAAA,IAACC,SAAAA,OAAA,EAAO,GAAG,OAAO,SAAkB,SAAQ,YAC1C,UAAAG,2BAAAA,KAACF,YAAAA,aAAA,EAAY,KAAK,KAChB,UAAA;AAAA,IAAAE,2BAAAA,KAACF,YAAAA,aAAA,EAAY,KAAK,KACf,UAAA;AAAA,MAAA,SACCF,2BAAAA,IAACK,uBAAW,IAAI,GAAG,SAAQ,aAAa,GAAG,YACxC,UAAA,MAAA,CACH;AAAA,MAED,0CACEC,6BAAA,EAAc,SAAQ,SAAQ,OAAO,QAAQ,kBAAkB,gBAC7D,UAAA,QAAA,CACH;AAAA,MAED,QAAQ;AAAA,MACR;AAAA,IAAA,GACH;AAAA,IAEC,WAAWN,2BAAAA,IAACO,mBAAA,EAAS,KAAK,GAAI,UAAA,QAAA,CAAQ;AAAA,EAAA,EAAA,CACzC,EAAA,CACF;AAEJ;AAIO,MAAM,iBAA2C,CAAC,EAAE,UAAU,GAAG,YAAY;AAClF,SACEP,2BAAAA,IAACQ,uBAAU,SAAQ,YAAW,MAAK,SAAS,GAAG,OAC5C,UACH;AAEJ;;;"}

package/dist/cjs/components/app-button.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const material = require("@mui/material");
+const appTooltip = require("./app-tooltip.js");
+const AppButton = ({
+  ref,
+  variant = "contained",
+  color,
+  children,
+  content,
+  tooltip,
+  tooltipProps,
+  ...props
+}) => {
+  const resolvedColor = color || (() => {
+    switch (variant) {
+      case "outlined":
+      case "text":
+        return "secondary";
+      case "contained":
+      default:
+        return "primary";
+    }
+  })();
+  const element = /* @__PURE__ */ jsxRuntime.jsx(material.Button, { component: "button", color: resolvedColor, variant, ref, ...props, children: /* @__PURE__ */ jsxRuntime.jsxs(material.Box, { sx: { overflow: "hidden", textOverflow: "ellipsis" }, children: [
+    children,
+    content
+  ] }) });
+  return tooltip ? /* @__PURE__ */ jsxRuntime.jsx(appTooltip.AppTooltip, { description: tooltip, ...tooltipProps, children: element }) : element;
+};
+AppButton.displayName = "AppButton";
+exports.AppButton = AppButton;
+//# sourceMappingURL=app-button.js.map

package/dist/cjs/components/app-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-button.js","sources":["../../../src/components/app-button.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Box, Button, ButtonProps } from '@mui/material';\n\nimport { AppTooltip, AppTooltipProps } from './app-tooltip';\n\n//\n//\n\ntype PrimaryDarkButtonProps = {\n  color: 'primaryDark';\n  variant: 'text' | 'contained';\n};\n\ntype PrimaryLightButtonProps = {\n  color: 'primaryLight';\n  variant: 'contained';\n};\n\ntype PrimaryButtonProps = {\n  color: 'primary';\n  variant: 'contained';\n};\n\ntype SecondaryButtonProps = {\n  color: 'secondary';\n  variant: 'text' | 'outlined';\n};\n\ntype ErrorButtonProps = {\n  color: 'error';\n  variant: 'text' | 'outlined' | 'contained';\n};\n\ntype NoColorButtonProps = {\n  color?: undefined;\n  variant?: 'text' | 'outlined' | 'contained';\n};\n\ntype TertiaryButtonProps = {\n  color: 'tertiary';\n  variant?: 'contained' | 'outlined';\n};\n\nexport type AppButtonProps = Omit<ButtonProps, 'color' | 'variant' | 'href'> & {\n  content?: React.ReactNode;\n  tooltip?: AppTooltipProps['headline'];\n  tooltipProps?: Omit<AppTooltipProps, 'children'>;\n} & (\n    | PrimaryButtonProps\n    | SecondaryButtonProps\n    | ErrorButtonProps\n    | NoColorButtonProps\n    | PrimaryDarkButtonProps\n    | PrimaryLightButtonProps\n    | TertiaryButtonProps\n  );\n\nexport const AppButton = ({\n  ref,\n  variant = 'contained',\n  color,\n  children,\n  content,\n  tooltip,\n  tooltipProps,\n  ...props\n}: AppButtonProps) => {\n  const resolvedColor =\n    color ||\n    (() => {\n      switch (variant) {\n        case 'outlined':\n        case 'text':\n          return 'secondary';\n        case 'contained':\n        default:\n          return 'primary';\n      }\n    })();\n\n  const element = (\n    <Button component=\"button\" color={resolvedColor} variant={variant} ref={ref} {...props}>\n      <Box sx={{ overflow: 'hidden', textOverflow: 'ellipsis' }}>\n        {children}\n        {content}\n      </Box>\n    </Button>\n  );\n\n  return tooltip ? (\n    <AppTooltip description={tooltip} {...tooltipProps}>\n      {element}\n    </AppTooltip>\n  ) : (\n    element\n  );\n};\n\nAppButton.displayName = 'AppButton';\n"],"names":["jsx","Button","jsxs","Box","AppTooltip"],"mappings":";;;;;AA0DO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAsB;AACpB,QAAM,gBACJ,UACC,MAAM;AACL,YAAQ,SAAA;AAAA,MACN,KAAK;AAAA,MACL,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AAAA,MACL;AACE,eAAO;AAAA,IAAA;AAAA,EAEb,GAAA;AAEF,QAAM,UACJA,+BAACC,SAAAA,QAAA,EAAO,WAAU,UAAS,OAAO,eAAe,SAAkB,KAAW,GAAG,OAC/E,UAAAC,2BAAAA,KAACC,gBAAI,IAAI,EAAE,UAAU,UAAU,cAAc,cAC1C,UAAA;AAAA,IAAA;AAAA,IACA;AAAA,EAAA,EAAA,CACH,EAAA,CACF;AAGF,SAAO,yCACJC,WAAAA,YAAA,EAAW,aAAa,SAAU,GAAG,cACnC,mBACH,IAEA;AAEJ;AAEA,UAAU,cAAc;;"}

package/dist/cjs/components/app-icon-with-tooltip.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const material = require("@mui/material");
+const informationLine = require("../icons/system/information-line.js");
+const appTooltip = require("./app-tooltip.js");
+const stackRow = require("./stack-row.js");
+const AppIconWithTooltip = ({
+  tooltip,
+  tooltipProps,
+  accessibleAreaWidth = "36px",
+  accessibleAreaHeight = "36px",
+  icon,
+  iconProps
+}) => {
+  if (!tooltip) return;
+  return /* @__PURE__ */ jsxRuntime.jsx(appTooltip.AppTooltip, { description: tooltip, ...tooltipProps, children: /* @__PURE__ */ jsxRuntime.jsxs(stackRow.StackRow, { position: "relative", alignItems: "center", justifyContent: "center", children: [
+    icon ?? /* @__PURE__ */ jsxRuntime.jsx(informationLine.IconInformationLine, { fontSize: "inherit", color: "action", ...iconProps }),
+    /* @__PURE__ */ jsxRuntime.jsx(TooltipArea, { width: accessibleAreaWidth, height: accessibleAreaHeight })
+  ] }) });
+};
+const TooltipArea = material.styled(material.Box)(({ width, height }) => ({
+  position: "absolute",
+  display: "none",
+  pointerEvents: "none",
+  "@media (pointer:none), (pointer:coarse), (hover:none)": {
+    display: "block",
+    width: width || "24px",
+    height: height || "24px",
+    pointerEvents: "auto"
+  }
+}));
+exports.AppIconWithTooltip = AppIconWithTooltip;
+//# sourceMappingURL=app-icon-with-tooltip.js.map

package/dist/cjs/components/app-icon-with-tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-icon-with-tooltip.js","sources":["../../../src/components/app-icon-with-tooltip.tsx"],"sourcesContent":["import { Box, SvgIconOwnProps, styled } from '@mui/material';\n\nimport { IconInformationLine } from '../icons/system/information-line';\n\nimport { AppTooltip, AppTooltipProps } from './app-tooltip';\nimport { StackRow } from './stack-row';\n\n//\n//\n\n// NOTE: accessibleAreaWidth and accessibleAreaHeight are used to create non-visible area for\n//       the tooltip to be accessible on mobile\n\nexport type AppIconWithTooltipProps = {\n  accessibleAreaWidth?: string;\n  accessibleAreaHeight?: string;\n  icon?: React.ReactNode;\n  iconProps?: SvgIconOwnProps;\n  tooltip?: AppTooltipProps['description'];\n  tooltipProps?: Omit<AppTooltipProps, 'children'>;\n};\n\nexport const AppIconWithTooltip: React.FC<AppIconWithTooltipProps> = ({\n  tooltip,\n  tooltipProps,\n  accessibleAreaWidth = '36px',\n  accessibleAreaHeight = '36px',\n  icon,\n  iconProps,\n}) => {\n  if (!tooltip) return;\n\n  return (\n    <AppTooltip description={tooltip} {...tooltipProps}>\n      <StackRow position=\"relative\" alignItems=\"center\" justifyContent=\"center\">\n        {icon ?? <IconInformationLine fontSize=\"inherit\" color=\"action\" {...iconProps} />}\n        <TooltipArea width={accessibleAreaWidth} height={accessibleAreaHeight} />\n      </StackRow>\n    </AppTooltip>\n  );\n};\n\nconst TooltipArea = styled(Box)(({ width, height }) => ({\n  position: 'absolute',\n  display: 'none',\n  pointerEvents: 'none',\n  '@media (pointer:none), (pointer:coarse), (hover:none)': {\n    display: 'block',\n    width: width || '24px',\n    height: height || '24px',\n    pointerEvents: 'auto',\n  },\n}));\n"],"names":["jsx","AppTooltip","jsxs","StackRow","IconInformationLine","styled","Box"],"mappings":";;;;;;;AAsBO,MAAM,qBAAwD,CAAC;AAAA,EACpE;AAAA,EACA;AAAA,EACA,sBAAsB;AAAA,EACtB,uBAAuB;AAAA,EACvB;AAAA,EACA;AACF,MAAM;AACJ,MAAI,CAAC,QAAS;AAEd,SACEA,2BAAAA,IAACC,WAAAA,YAAA,EAAW,aAAa,SAAU,GAAG,cACpC,UAAAC,2BAAAA,KAACC,SAAAA,UAAA,EAAS,UAAS,YAAW,YAAW,UAAS,gBAAe,UAC9D,UAAA;AAAA,IAAA,uCAASC,gBAAAA,qBAAA,EAAoB,UAAS,WAAU,OAAM,UAAU,GAAG,WAAW;AAAA,IAC/EJ,2BAAAA,IAAC,aAAA,EAAY,OAAO,qBAAqB,QAAQ,qBAAA,CAAsB;AAAA,EAAA,EAAA,CACzE,EAAA,CACF;AAEJ;AAEA,MAAM,cAAcK,SAAAA,OAAOC,SAAAA,GAAG,EAAE,CAAC,EAAE,OAAO,cAAc;AAAA,EACtD,UAAU;AAAA,EACV,SAAS;AAAA,EACT,eAAe;AAAA,EACf,yDAAyD;AAAA,IACvD,SAAS;AAAA,IACT,OAAO,SAAS;AAAA,IAChB,QAAQ,UAAU;AAAA,IAClB,eAAe;AAAA,EAAA;AAEnB,EAAE;;"}

package/dist/cjs/components/app-input-adornment-text.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const material = require("@mui/material");
+const appTypography = require("./app-typography.js");
+const AppInputAdornmentText = ({
+  children,
+  position = "start",
+  typographyProps,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(material.InputAdornment, { ...props, position, children: /* @__PURE__ */ jsxRuntime.jsx(StyledAppTypography, { variant: "body1", color: "text.secondary", ...typographyProps, children }) });
+};
+const StyledAppTypography = material.styled(appTypography.AppTypography)(({ theme }) => ({
+  minWidth: theme.spacing(1.25)
+}));
+exports.AppInputAdornmentText = AppInputAdornmentText;
+//# sourceMappingURL=app-input-adornment-text.js.map

package/dist/cjs/components/app-input-adornment-text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-input-adornment-text.js","sources":["../../../src/components/app-input-adornment-text.tsx"],"sourcesContent":["import { InputAdornment, InputAdornmentProps, styled } from '@mui/material';\n\nimport { AppTypography, AppTypographyProps } from './app-typography';\n\n//\n//\n\nexport type AppInputAdornmentTextProps = Omit<InputAdornmentProps, 'position'> & {\n  typographyProps?: AppTypographyProps;\n  position?: 'start' | 'end';\n};\n\nexport const AppInputAdornmentText = ({\n  children,\n  position = 'start',\n  typographyProps,\n  ...props\n}: AppInputAdornmentTextProps) => {\n  return (\n    <InputAdornment {...props} position={position}>\n      <StyledAppTypography variant=\"body1\" color=\"text.secondary\" {...typographyProps}>\n        {children}\n      </StyledAppTypography>\n    </InputAdornment>\n  );\n};\n\n//\n\nconst StyledAppTypography = styled(AppTypography)(({ theme }) => ({\n  minWidth: theme.spacing(1.25),\n}));\n"],"names":["jsx","InputAdornment","styled","AppTypography"],"mappings":";;;;;AAYO,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA,GAAG;AACL,MAAkC;AAChC,SACEA,2BAAAA,IAACC,SAAAA,gBAAA,EAAgB,GAAG,OAAO,UACzB,UAAAD,+BAAC,qBAAA,EAAoB,SAAQ,SAAQ,OAAM,kBAAkB,GAAG,iBAC7D,UACH,GACF;AAEJ;AAIA,MAAM,sBAAsBE,SAAAA,OAAOC,cAAAA,aAAa,EAAE,CAAC,EAAE,aAAa;AAAA,EAChE,UAAU,MAAM,QAAQ,IAAI;AAC9B,EAAE;;"}

package/dist/cjs/components/app-input-base-search.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const searchLine = require("../icons/system/search-line.js");
+const appInputBase = require("./app-input-base.js");
+const AppInputBaseSearch = ({
+  name,
+  helperText,
+  transformText,
+  children,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    appInputBase.AppInputBase,
+    {
+      transformText,
+      id: "input-" + name,
+      helperText,
+      startAdornment: /* @__PURE__ */ jsxRuntime.jsx(searchLine.IconSearchLine, { fontSize: "small" }),
+      ...props,
+      children
+    }
+  );
+};
+exports.AppInputBaseSearch = AppInputBaseSearch;
+//# sourceMappingURL=app-input-base-search.js.map

package/dist/cjs/components/app-input-base-search.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-input-base-search.js","sources":["../../../src/components/app-input-base-search.tsx"],"sourcesContent":["import { IconButtonProps, SvgIconProps, TextFieldProps } from '@mui/material';\n\nimport { IconSearchLine } from '../icons/system/search-line';\n\nimport { AppInputBase } from './app-input-base';\n\n//\n//\n\nexport type AppInputSearchProps = TextFieldProps & {\n  name: string;\n  transformText?: (text: string) => string;\n  iconButtonProps?: IconButtonProps;\n  iconProps?: SvgIconProps;\n};\n\nexport const AppInputBaseSearch = ({\n  name,\n  helperText,\n  transformText,\n  children,\n  ...props\n}: AppInputSearchProps) => {\n  return (\n    <AppInputBase\n      transformText={transformText}\n      id={'input-' + name}\n      helperText={helperText}\n      startAdornment={<IconSearchLine fontSize=\"small\" />}\n      {...props}\n    >\n      {children}\n    </AppInputBase>\n  );\n};\n"],"names":["jsx","AppInputBase","IconSearchLine"],"mappings":";;;;;AAgBO,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA2B;AACzB,SACEA,2BAAAA;AAAAA,IAACC,aAAAA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA,IAAI,WAAW;AAAA,MACf;AAAA,MACA,gBAAgBD,2BAAAA,IAACE,WAAAA,gBAAA,EAAe,UAAS,QAAA,CAAQ;AAAA,MAChD,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;;"}

package/dist/cjs/components/app-input-base.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const material = require("@mui/material");
+const appInputAdornmentText = require("./app-input-adornment-text.js");
+const AppInputBase = ({
+  transformText,
+  children,
+  startAdornment,
+  startAdornmentText,
+  startAdornmentTextProps,
+  endAdornment,
+  endAdornmentText,
+  endAdornmentTextProps,
+  labelSuffix,
+  size = "medium",
+  ...props
+}) => {
+  let labelContent = props.label;
+  if (props.label && labelSuffix) {
+    labelContent = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      props.label,
+      " ",
+      labelSuffix
+    ] });
+  }
+  const inputSlotProps = typeof props.slotProps?.input === "function" ? {} : props.slotProps?.input || {};
+  props.slotProps = {
+    ...props?.slotProps,
+    input: {
+      startAdornment: startAdornment ? /* @__PURE__ */ jsxRuntime.jsx(material.InputAdornment, { position: "start", children: startAdornment }) : startAdornmentText ? /* @__PURE__ */ jsxRuntime.jsx(appInputAdornmentText.AppInputAdornmentText, { position: "start", ...startAdornmentTextProps, children: startAdornmentText }) : void 0,
+      endAdornment: endAdornment ? /* @__PURE__ */ jsxRuntime.jsx(material.InputAdornment, { position: "end", children: endAdornment }) : endAdornmentText ? /* @__PURE__ */ jsxRuntime.jsx(appInputAdornmentText.AppInputAdornmentText, { position: "end", ...endAdornmentTextProps, children: endAdornmentText }) : void 0,
+      ...inputSlotProps,
+      // FIX: autocomplete inputs gets broken
+      // oxlint-disable-next-line @typescript-eslint/no-explicit-any
+      ...props.InputProps
+    },
+    ...props?.slotProps
+  };
+  const handleChangeText = React.useCallback(
+    (text) => {
+      return transformText ? transformText(text) : text;
+    },
+    [transformText]
+  );
+  const onChange = React.useCallback(
+    (event) => {
+      event.target.value = handleChangeText(event.target.value);
+      props?.onChange?.(event);
+    },
+    [handleChangeText, props]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(material.TextField, { size, ...props, label: labelContent, onChange, children });
+};
+exports.AppInputBase = AppInputBase;
+//# sourceMappingURL=app-input-base.js.map

package/dist/cjs/components/app-input-base.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-input-base.js","sources":["../../../src/components/app-input-base.tsx"],"sourcesContent":["import { FC, useCallback, ReactNode } from 'react';\n\nimport { InputAdornment, TextField, TextFieldProps } from '@mui/material';\n\nimport { AppInputAdornmentText, AppInputAdornmentTextProps } from './app-input-adornment-text';\n\n//\n//\n\nexport type AppInputBaseProps = Omit<TextFieldProps, 'variant'> & {\n  transformText?: (text: string) => string;\n  startAdornment?: React.JSX.Element;\n  startAdornmentText?: React.JSX.Element | string;\n  startAdornmentTextProps?: AppInputAdornmentTextProps;\n  endAdornment?: React.JSX.Element;\n  endAdornmentText?: React.JSX.Element | string;\n  endAdornmentTextProps?: AppInputAdornmentTextProps;\n  labelSuffix?: ReactNode;\n};\n\nexport const AppInputBase: FC<AppInputBaseProps> = ({\n  transformText,\n  children,\n  startAdornment,\n  startAdornmentText,\n  startAdornmentTextProps,\n  endAdornment,\n  endAdornmentText,\n  endAdornmentTextProps,\n  labelSuffix,\n  size = 'medium',\n  ...props\n}) => {\n  let labelContent = props.label;\n\n  if (props.label && labelSuffix) {\n    labelContent = (\n      <>\n        {props.label} {labelSuffix}\n      </>\n    );\n  }\n\n  const inputSlotProps =\n    typeof props.slotProps?.input === 'function' ? {} : props.slotProps?.input || {};\n\n  props.slotProps = {\n    ...props?.slotProps,\n    input: {\n      startAdornment: startAdornment ? (\n        <InputAdornment position=\"start\">{startAdornment}</InputAdornment>\n      ) : startAdornmentText ? (\n        <AppInputAdornmentText position=\"start\" {...startAdornmentTextProps}>\n          {startAdornmentText}\n        </AppInputAdornmentText>\n      ) : undefined,\n      endAdornment: endAdornment ? (\n        <InputAdornment position=\"end\">{endAdornment}</InputAdornment>\n      ) : endAdornmentText ? (\n        <AppInputAdornmentText position=\"end\" {...endAdornmentTextProps}>\n          {endAdornmentText}\n        </AppInputAdornmentText>\n      ) : undefined,\n      ...inputSlotProps,\n\n      // FIX: autocomplete inputs gets broken\n      // oxlint-disable-next-line @typescript-eslint/no-explicit-any\n      ...(props.InputProps as any),\n    },\n    ...props?.slotProps,\n  };\n\n  const handleChangeText = useCallback(\n    (text: string) => {\n      return transformText ? transformText(text) : text;\n    },\n    [transformText],\n  );\n\n  const onChange = useCallback(\n    (event: React.ChangeEvent<HTMLInputElement>) => {\n      event.target.value = handleChangeText(event.target.value);\n      props?.onChange?.(event);\n    },\n    [handleChangeText, props],\n  );\n\n  return (\n    <TextField size={size} {...props} label={labelContent} onChange={onChange}>\n      {children}\n    </TextField>\n  );\n};\n"],"names":["jsxs","Fragment","jsx","InputAdornment","AppInputAdornmentText","useCallback","TextField"],"mappings":";;;;;;AAoBO,MAAM,eAAsC,CAAC;AAAA,EAClD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,MAAM;AACJ,MAAI,eAAe,MAAM;AAEzB,MAAI,MAAM,SAAS,aAAa;AAC9B,mBACEA,2BAAAA,KAAAC,qBAAA,EACG,UAAA;AAAA,MAAA,MAAM;AAAA,MAAM;AAAA,MAAE;AAAA,IAAA,GACjB;AAAA,EAEJ;AAEA,QAAM,iBACJ,OAAO,MAAM,WAAW,UAAU,aAAa,CAAA,IAAK,MAAM,WAAW,SAAS,CAAA;AAEhF,QAAM,YAAY;AAAA,IAChB,GAAG,OAAO;AAAA,IACV,OAAO;AAAA,MACL,gBAAgB,iBACdC,2BAAAA,IAACC,SAAAA,gBAAA,EAAe,UAAS,SAAS,UAAA,gBAAe,IAC/C,qBACFD,+BAACE,sBAAAA,yBAAsB,UAAS,SAAS,GAAG,yBACzC,8BACH,IACE;AAAA,MACJ,cAAc,eACZF,2BAAAA,IAACC,SAAAA,gBAAA,EAAe,UAAS,OAAO,UAAA,cAAa,IAC3C,mBACFD,+BAACE,sBAAAA,yBAAsB,UAAS,OAAO,GAAG,uBACvC,4BACH,IACE;AAAA,MACJ,GAAG;AAAA;AAAA;AAAA,MAIH,GAAI,MAAM;AAAA,IAAA;AAAA,IAEZ,GAAG,OAAO;AAAA,EAAA;AAGZ,QAAM,mBAAmBC,MAAAA;AAAAA,IACvB,CAAC,SAAiB;AAChB,aAAO,gBAAgB,cAAc,IAAI,IAAI;AAAA,IAC/C;AAAA,IACA,CAAC,aAAa;AAAA,EAAA;AAGhB,QAAM,WAAWA,MAAAA;AAAAA,IACf,CAAC,UAA+C;AAC9C,YAAM,OAAO,QAAQ,iBAAiB,MAAM,OAAO,KAAK;AACxD,aAAO,WAAW,KAAK;AAAA,IACzB;AAAA,IACA,CAAC,kBAAkB,KAAK;AAAA,EAAA;AAG1B,SACEH,2BAAAA,IAACI,sBAAU,MAAa,GAAG,OAAO,OAAO,cAAc,UACpD,UACH;AAEJ;;"}

package/dist/cjs/components/app-list-item.js

@@ -0,0 +1,95 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const material = require("@mui/material");
+const appIconWithTooltip = require("./app-icon-with-tooltip.js");
+const appOverflownTextWithTooltip = require("./app-overflown-text-with-tooltip.js");
+const appTypography = require("./app-typography.js");
+const stackRow = require("./stack-row.js");
+const AppListItem = ({
+  icon,
+  iconProps,
+  textLabel,
+  textDescription,
+  textLabelProps = {},
+  textContent,
+  textContentProps,
+  children,
+  labelSuffix,
+  tooltip,
+  ...props
+}) => {
+  if (typeof textDescription === "string") {
+    textLabelProps.secondary = /* @__PURE__ */ jsxRuntime.jsx(
+      appOverflownTextWithTooltip.AppOverflownTextWithTooltip,
+      {
+        title: textDescription,
+        typographyProps: { variant: "body2", color: "text.tertiary" },
+        twoLines: true
+      }
+    );
+  } else if (textDescription) {
+    textLabelProps.secondary = /* @__PURE__ */ jsxRuntime.jsx(appTypography.AppTypography, { variant: "caption", color: "text.tertiary", children: textDescription });
+  }
+  if (typeof textLabel === "string") {
+    textLabel = /* @__PURE__ */ jsxRuntime.jsx(
+      appOverflownTextWithTooltip.AppOverflownTextWithTooltip,
+      {
+        title: textLabel,
+        typographyProps: { variant: "body2", color: "text.secondary" }
+      }
+    );
+  } else {
+    textLabel = /* @__PURE__ */ jsxRuntime.jsx(appTypography.AppTypography, { variant: "body2", color: "text.secondary", children: textLabel });
+  }
+  if (labelSuffix) {
+    textLabel = /* @__PURE__ */ jsxRuntime.jsxs(stackRow.StackRow, { overflow: "hidden", children: [
+      textLabel,
+      labelSuffix
+    ] });
+  }
+  if (typeof textContent === "string") {
+    textContent = /* @__PURE__ */ jsxRuntime.jsx(
+      appOverflownTextWithTooltip.AppOverflownTextWithTooltip,
+      {
+        title: textContent,
+        typographyProps: { variant: "body2", color: "text.secondary" },
+        twoLines: true
+      }
+    );
+  } else if (textContent) {
+    textContent = /* @__PURE__ */ jsxRuntime.jsx(appTypography.AppTypography, { variant: "body2", color: "text.secondary", children: textContent });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(ListItemStyled, { ...props, children: [
+    icon && /* @__PURE__ */ jsxRuntime.jsx(material.ListItemIcon, { ...iconProps, children: icon }),
+    (textLabel || textLabelProps) && /* @__PURE__ */ jsxRuntime.jsx(
+      material.ListItemText,
+      {
+        primary: /* @__PURE__ */ jsxRuntime.jsxs(stackRow.StackRow, { gap: 0.75, children: [
+          textLabel,
+          tooltip && /* @__PURE__ */ jsxRuntime.jsx(appIconWithTooltip.AppIconWithTooltip, { tooltip, iconProps: { sx: { fontSize: 16 } } })
+        ] }),
+        ...textLabelProps
+      }
+    ),
+    textContent && /* @__PURE__ */ jsxRuntime.jsx(appTypography.AppTypography, { variant: "body2", color: "text.secondary", ...textContentProps, children: textContent }),
+    children
+  ] });
+};
+const AppListItemContent = ({ children, ...props }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(appTypography.AppTypography, { variant: "body2", color: "text.secondary", ...props, children });
+};
+const ListItemStyled = material.styled(material.ListItem)(({ theme }) => ({
+  display: "flex",
+  gap: theme.spacing(1.5),
+  ".MuiListItemText-root": {
+    minWidth: 200,
+    display: "flex",
+    flexDirection: "column",
+    gap: theme.spacing(0.5),
+    margin: theme.spacing(0.125)
+  }
+}));
+exports.AppListItem = AppListItem;
+exports.AppListItemContent = AppListItemContent;
+//# sourceMappingURL=app-list-item.js.map

package/dist/cjs/components/app-list-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-list-item.js","sources":["../../../src/components/app-list-item.tsx"],"sourcesContent":["import React from 'react';\n\nimport {\n  ListItem,\n  ListItemIcon,\n  ListItemIconProps,\n  ListItemProps,\n  ListItemText,\n  ListItemTextProps,\n  styled,\n} from '@mui/material';\n\nimport { AppIconWithTooltip } from './app-icon-with-tooltip';\nimport { AppOverflownTextWithTooltip } from './app-overflown-text-with-tooltip';\nimport { AppTypographyProps, AppTypography } from './app-typography';\nimport { StackRow } from './stack-row';\n\n//\n//\n\nexport type AppListItemProps = {\n  icon?: React.ReactNode;\n  iconProps?: ListItemIconProps;\n  textLabel?: React.ReactNode;\n  textLabelProps?: ListItemTextProps;\n  textDescription?: React.ReactNode;\n  textContent?: React.ReactNode;\n  textContentProps?: AppTypographyProps;\n  children?: React.ReactNode;\n  labelSuffix?: React.ReactNode;\n  tooltip?: string;\n} & Omit<ListItemProps, 'value'>;\n\nexport const AppListItem = ({\n  icon,\n  iconProps,\n  textLabel,\n  textDescription,\n  textLabelProps = {},\n  textContent,\n  textContentProps,\n  children,\n  labelSuffix,\n  tooltip,\n  ...props\n}: AppListItemProps) => {\n  if (typeof textDescription === 'string') {\n    textLabelProps.secondary = (\n      <AppOverflownTextWithTooltip\n        title={textDescription}\n        typographyProps={{ variant: 'body2', color: 'text.tertiary' }}\n        twoLines\n      />\n    );\n  } else if (textDescription) {\n    textLabelProps.secondary = (\n      <AppTypography variant=\"caption\" color=\"text.tertiary\">\n        {textDescription}\n      </AppTypography>\n    );\n  }\n\n  //\n\n  if (typeof textLabel === 'string') {\n    textLabel = (\n      <AppOverflownTextWithTooltip\n        title={textLabel}\n        typographyProps={{ variant: 'body2', color: 'text.secondary' }}\n      />\n    );\n  } else {\n    textLabel = (\n      <AppTypography variant=\"body2\" color=\"text.secondary\">\n        {textLabel}\n      </AppTypography>\n    );\n  }\n\n  if (labelSuffix) {\n    textLabel = (\n      <StackRow overflow=\"hidden\">\n        {textLabel}\n        {labelSuffix}\n      </StackRow>\n    );\n  }\n\n  //\n\n  if (typeof textContent === 'string') {\n    textContent = (\n      <AppOverflownTextWithTooltip\n        title={textContent}\n        typographyProps={{ variant: 'body2', color: 'text.secondary' }}\n        twoLines\n      />\n    );\n  } else if (textContent) {\n    textContent = (\n      <AppTypography variant=\"body2\" color=\"text.secondary\">\n        {textContent}\n      </AppTypography>\n    );\n  }\n\n  return (\n    <ListItemStyled {...props}>\n      {icon && <ListItemIcon {...iconProps}>{icon}</ListItemIcon>}\n      {(textLabel || textLabelProps) && (\n        <ListItemText\n          primary={\n            <StackRow gap={0.75}>\n              {textLabel}\n\n              {tooltip && (\n                <AppIconWithTooltip tooltip={tooltip} iconProps={{ sx: { fontSize: 16 } }} />\n              )}\n            </StackRow>\n          }\n          {...textLabelProps}\n        />\n      )}\n      {textContent && (\n        <AppTypography variant=\"body2\" color=\"text.secondary\" {...textContentProps}>\n          {textContent}\n        </AppTypography>\n      )}\n      {children}\n    </ListItemStyled>\n  );\n};\n\ntype AppListItemContentProps = AppTypographyProps;\n\nexport const AppListItemContent: React.FC<AppListItemContentProps> = ({ children, ...props }) => {\n  return (\n    <AppTypography variant=\"body2\" color=\"text.secondary\" {...props}>\n      {children}\n    </AppTypography>\n  );\n};\n\n//\n\nconst ListItemStyled = styled(ListItem)(({ theme }) => ({\n  display: 'flex',\n  gap: theme.spacing(1.5),\n  '.MuiListItemText-root': {\n    minWidth: 200,\n    display: 'flex',\n    flexDirection: 'column',\n    gap: theme.spacing(0.5),\n    margin: theme.spacing(0.125),\n  },\n}));\n"],"names":["jsx","AppOverflownTextWithTooltip","AppTypography","jsxs","StackRow","ListItemIcon","ListItemText","AppIconWithTooltip","styled","ListItem"],"mappings":";;;;;;;;AAiCO,MAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB,CAAA;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAwB;AACtB,MAAI,OAAO,oBAAoB,UAAU;AACvC,mBAAe,YACbA,2BAAAA;AAAAA,MAACC,4BAAAA;AAAAA,MAAA;AAAA,QACC,OAAO;AAAA,QACP,iBAAiB,EAAE,SAAS,SAAS,OAAO,gBAAA;AAAA,QAC5C,UAAQ;AAAA,MAAA;AAAA,IAAA;AAAA,EAGd,WAAW,iBAAiB;AAC1B,mBAAe,YACbD,+BAACE,cAAAA,eAAA,EAAc,SAAQ,WAAU,OAAM,iBACpC,UAAA,gBAAA,CACH;AAAA,EAEJ;AAIA,MAAI,OAAO,cAAc,UAAU;AACjC,gBACEF,2BAAAA;AAAAA,MAACC,4BAAAA;AAAAA,MAAA;AAAA,QACC,OAAO;AAAA,QACP,iBAAiB,EAAE,SAAS,SAAS,OAAO,iBAAA;AAAA,MAAiB;AAAA,IAAA;AAAA,EAGnE,OAAO;AACL,+CACGC,cAAAA,eAAA,EAAc,SAAQ,SAAQ,OAAM,kBAClC,UAAA,WACH;AAAA,EAEJ;AAEA,MAAI,aAAa;AACf,gBACEC,2BAAAA,KAACC,SAAAA,UAAA,EAAS,UAAS,UAChB,UAAA;AAAA,MAAA;AAAA,MACA;AAAA,IAAA,GACH;AAAA,EAEJ;AAIA,MAAI,OAAO,gBAAgB,UAAU;AACnC,kBACEJ,2BAAAA;AAAAA,MAACC,4BAAAA;AAAAA,MAAA;AAAA,QACC,OAAO;AAAA,QACP,iBAAiB,EAAE,SAAS,SAAS,OAAO,iBAAA;AAAA,QAC5C,UAAQ;AAAA,MAAA;AAAA,IAAA;AAAA,EAGd,WAAW,aAAa;AACtB,iDACGC,cAAAA,eAAA,EAAc,SAAQ,SAAQ,OAAM,kBAClC,UAAA,aACH;AAAA,EAEJ;AAEA,SACEC,2BAAAA,KAAC,gBAAA,EAAgB,GAAG,OACjB,UAAA;AAAA,IAAA,QAAQH,2BAAAA,IAACK,uBAAA,EAAc,GAAG,WAAY,UAAA,MAAK;AAAA,KAC1C,aAAa,mBACbL,2BAAAA;AAAAA,MAACM,SAAAA;AAAAA,MAAA;AAAA,QACC,SACEH,2BAAAA,KAACC,SAAAA,UAAA,EAAS,KAAK,MACZ,UAAA;AAAA,UAAA;AAAA,UAEA,WACCJ,2BAAAA,IAACO,uCAAA,EAAmB,SAAkB,WAAW,EAAE,IAAI,EAAE,UAAU,GAAA,IAAK,CAAG;AAAA,QAAA,GAE/E;AAAA,QAED,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,IAGP,8CACEL,6BAAA,EAAc,SAAQ,SAAQ,OAAM,kBAAkB,GAAG,kBACvD,UAAA,YAAA,CACH;AAAA,IAED;AAAA,EAAA,GACH;AAEJ;AAIO,MAAM,qBAAwD,CAAC,EAAE,UAAU,GAAG,YAAY;AAC/F,SACEF,2BAAAA,IAACE,+BAAc,SAAQ,SAAQ,OAAM,kBAAkB,GAAG,OACvD,UACH;AAEJ;AAIA,MAAM,iBAAiBM,SAAAA,OAAOC,SAAAA,QAAQ,EAAE,CAAC,EAAE,aAAa;AAAA,EACtD,SAAS;AAAA,EACT,KAAK,MAAM,QAAQ,GAAG;AAAA,EACtB,yBAAyB;AAAA,IACvB,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,KAAK,MAAM,QAAQ,GAAG;AAAA,IACtB,QAAQ,MAAM,QAAQ,KAAK;AAAA,EAAA;AAE/B,EAAE;;;"}

package/dist/cjs/components/app-overflown-text-with-tooltip.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const material = require("@mui/material");
+const appTooltip = require("./app-tooltip.js");
+const appTypography = require("./app-typography.js");
+const AppOverflownTextWithTooltip = ({
+  title,
+  typographyProps,
+  twoLines,
+  ...props
+}) => {
+  const [isOverflown, setIsOverflown] = React.useState(false);
+  const checkIsOverflown = (element) => {
+    if (!element) return;
+    setIsOverflown(
+      element.clientWidth < element.scrollWidth || element.clientHeight < element.scrollHeight
+    );
+  };
+  const checkIsOverflownTwoLines = (element) => {
+    if (!element) return;
+    const lineHeight = parseFloat(window.getComputedStyle(element).lineHeight || "0");
+    const maxHeight = lineHeight * 2;
+    const actualHeight = element.scrollHeight;
+    setIsOverflown(actualHeight > maxHeight + 1);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(appTooltip.AppTooltip, { description: title, disable: !isOverflown, placement: "top", ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+    Typography,
+    {
+      onMouseEnter: (e) => twoLines ? checkIsOverflownTwoLines(e.currentTarget) : checkIsOverflown(e.currentTarget),
+      "data-two-lines": `${twoLines}`,
+      ...typographyProps,
+      children: title
+    }
+  ) });
+};
+const Typography = material.styled(appTypography.AppTypography)(() => ({
+  whiteSpace: "nowrap",
+  overflow: "hidden",
+  textOverflow: "ellipsis",
+  "::first-letter": { textTransform: "capitalize" },
+  '&[data-two-lines="true"]': {
+    display: "-webkit-box",
+    WebkitLineClamp: 2,
+    WebkitBoxOrient: "vertical",
+    whiteSpace: "normal"
+  }
+}));
+exports.AppOverflownTextWithTooltip = AppOverflownTextWithTooltip;
+//# sourceMappingURL=app-overflown-text-with-tooltip.js.map

package/dist/cjs/components/app-overflown-text-with-tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-overflown-text-with-tooltip.js","sources":["../../../src/components/app-overflown-text-with-tooltip.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { styled } from '@mui/material';\n\nimport { AppTooltip, AppTooltipProps } from './app-tooltip';\nimport { AppTypographyProps, AppTypography } from './app-typography';\n\n//\n//\n\nexport type AppOverflownTextWithTooltipProps = {\n  title: string;\n  typographyProps?: AppTypographyProps;\n  twoLines?: boolean;\n  tooltipProps?: Omit<AppTooltipProps, 'children'>;\n};\n\nexport const AppOverflownTextWithTooltip: React.FC<AppOverflownTextWithTooltipProps> = ({\n  title,\n  typographyProps,\n  twoLines,\n  ...props\n}) => {\n  const [isOverflown, setIsOverflown] = useState(false);\n\n  const checkIsOverflown = (element: HTMLElement) => {\n    if (!element) return;\n    setIsOverflown(\n      element.clientWidth < element.scrollWidth || element.clientHeight < element.scrollHeight,\n    );\n  };\n\n  const checkIsOverflownTwoLines = (element: HTMLElement) => {\n    if (!element) return;\n\n    const lineHeight = parseFloat(window.getComputedStyle(element).lineHeight || '0');\n\n    const maxHeight = lineHeight * 2;\n    const actualHeight = element.scrollHeight;\n\n    setIsOverflown(actualHeight > maxHeight + 1); // +1 for rounding\n  };\n\n  return (\n    <AppTooltip description={title} disable={!isOverflown} placement=\"top\" {...props}>\n      <Typography\n        onMouseEnter={e =>\n          twoLines ? checkIsOverflownTwoLines(e.currentTarget) : checkIsOverflown(e.currentTarget)\n        }\n        data-two-lines={`${twoLines}`}\n        {...typographyProps}\n      >\n        {title}\n      </Typography>\n    </AppTooltip>\n  );\n};\n\n//\n\nconst Typography = styled(AppTypography)(() => ({\n  whiteSpace: 'nowrap',\n  overflow: 'hidden',\n  textOverflow: 'ellipsis',\n  '::first-letter': { textTransform: 'capitalize' },\n\n  '&[data-two-lines=\"true\"]': {\n    display: '-webkit-box',\n    WebkitLineClamp: 2,\n    WebkitBoxOrient: 'vertical',\n    whiteSpace: 'normal',\n  },\n}));\n"],"names":["useState","jsx","AppTooltip","styled","AppTypography"],"mappings":";;;;;;;AAiBO,MAAM,8BAA0E,CAAC;AAAA,EACtF;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,aAAa,cAAc,IAAIA,MAAAA,SAAS,KAAK;AAEpD,QAAM,mBAAmB,CAAC,YAAyB;AACjD,QAAI,CAAC,QAAS;AACd;AAAA,MACE,QAAQ,cAAc,QAAQ,eAAe,QAAQ,eAAe,QAAQ;AAAA,IAAA;AAAA,EAEhF;AAEA,QAAM,2BAA2B,CAAC,YAAyB;AACzD,QAAI,CAAC,QAAS;AAEd,UAAM,aAAa,WAAW,OAAO,iBAAiB,OAAO,EAAE,cAAc,GAAG;AAEhF,UAAM,YAAY,aAAa;AAC/B,UAAM,eAAe,QAAQ;AAE7B,mBAAe,eAAe,YAAY,CAAC;AAAA,EAC7C;AAEA,SACEC,2BAAAA,IAACC,WAAAA,YAAA,EAAW,aAAa,OAAO,SAAS,CAAC,aAAa,WAAU,OAAO,GAAG,OACzE,UAAAD,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,cAAc,OACZ,WAAW,yBAAyB,EAAE,aAAa,IAAI,iBAAiB,EAAE,aAAa;AAAA,MAEzF,kBAAgB,GAAG,QAAQ;AAAA,MAC1B,GAAG;AAAA,MAEH,UAAA;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ;AAIA,MAAM,aAAaE,SAAAA,OAAOC,cAAAA,aAAa,EAAE,OAAO;AAAA,EAC9C,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,cAAc;AAAA,EACd,kBAAkB,EAAE,eAAe,aAAA;AAAA,EAEnC,4BAA4B;AAAA,IAC1B,SAAS;AAAA,IACT,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,YAAY;AAAA,EAAA;AAEhB,EAAE;;"}

package/dist/cjs/components/app-status.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const material = require("@mui/material");
+const appTooltip = require("./app-tooltip.js");
+const AppStatus = ({
+  ref,
+  color = "neutral",
+  size = "small",
+  tooltip,
+  tooltipProps,
+  ...props
+}) => {
+  if (color === "default") color = "neutral";
+  const element = /* @__PURE__ */ jsxRuntime.jsx(StatusElement, { color2: color, size, ref, ...props });
+  if (!tooltip) return element;
+  return /* @__PURE__ */ jsxRuntime.jsx(appTooltip.AppTooltip, { description: tooltip, ...tooltipProps, children: element });
+};
+AppStatus.displayName = "AppStatus";
+const StatusElement = material.styled(material.Chip, {
+  shouldForwardProp: (prop) => prop !== "color2"
+})(({ theme, color2 = "neutral" }) => ({
+  ...color2 === "success" ? {
+    backgroundColor: theme.palette.colors.green[300],
+    color: theme.palette.colors.green[900]
+  } : void 0,
+  ...color2 === "error" ? {
+    backgroundColor: theme.palette.colors.red[200],
+    color: theme.palette.colors.red[900]
+  } : void 0,
+  ...color2 === "warning" ? {
+    backgroundColor: theme.palette.colors.yellow[300],
+    color: theme.palette.colors.yellow[1e3]
+  } : void 0,
+  ...color2 === "neutral" ? {
+    backgroundColor: theme.palette.colors.neutral[100],
+    color: theme.palette.colors.neutral[600]
+  } : void 0,
+  ...color2 === "disabled" ? {
+    backgroundColor: theme.palette.colors.neutral[50],
+    color: theme.palette.colors.neutral[400]
+  } : void 0,
+  ...color2 === "info" ? {
+    backgroundColor: theme.palette.colors.primary[200],
+    color: theme.palette.colors.primary[800]
+  } : void 0,
+  ...color2 === "orange" ? {
+    backgroundColor: theme.palette.colors.orange[200],
+    color: theme.palette.colors.orange[700]
+  } : void 0,
+  ...color2 === "blue" ? {
+    backgroundColor: theme.palette.colors.blue[300],
+    color: theme.palette.colors.blue[900]
+  } : void 0
+}));
+exports.AppStatus = AppStatus;
+//# sourceMappingURL=app-status.js.map

package/dist/cjs/components/app-status.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-status.js","sources":["../../../src/components/app-status.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styled, ChipProps, Chip, TooltipProps } from '@mui/material';\n\nimport { AppTooltip } from './app-tooltip';\n\n//\n//\n\nexport type AppStatusColor =\n  | 'success'\n  | 'warning'\n  | 'error'\n  | 'neutral'\n  | 'default'\n  | 'disabled'\n  | 'info'\n  | 'orange'\n  | 'blue';\n\nexport type AppStatusProps = Omit<ChipProps, 'color' | 'variant' | 'size'> & {\n  size?: 'small' | 'medium';\n  color?: AppStatusColor;\n  tooltip?: TooltipProps['title'];\n  tooltipProps?: Omit<TooltipProps, 'title' | 'children'>;\n};\n\nexport const AppStatus: React.FC<AppStatusProps> = ({\n  ref,\n  color = 'neutral',\n  size = 'small',\n  tooltip,\n  tooltipProps,\n  ...props\n}) => {\n  if (color === 'default') color = 'neutral';\n\n  const element = <StatusElement color2={color} size={size} ref={ref} {...props} />;\n\n  //\n\n  if (!tooltip) return element;\n\n  return (\n    <AppTooltip description={tooltip} {...tooltipProps}>\n      {element}\n    </AppTooltip>\n  );\n};\n\nAppStatus.displayName = 'AppStatus';\n\n//\n\nconst StatusElement = styled(Chip, {\n  shouldForwardProp: prop => prop !== 'color2',\n})<{ color2?: AppStatusProps['color'] }>(({ theme, color2 = 'neutral' }) => ({\n  ...(color2 === 'success'\n    ? {\n        backgroundColor: theme.palette.colors.green[300],\n        color: theme.palette.colors.green[900],\n      }\n    : undefined),\n  ...(color2 === 'error'\n    ? {\n        backgroundColor: theme.palette.colors.red[200],\n        color: theme.palette.colors.red[900],\n      }\n    : undefined),\n  ...(color2 === 'warning'\n    ? {\n        backgroundColor: theme.palette.colors.yellow[300],\n        color: theme.palette.colors.yellow[1000],\n      }\n    : undefined),\n  ...(color2 === 'neutral'\n    ? {\n        backgroundColor: theme.palette.colors.neutral[100],\n        color: theme.palette.colors.neutral[600],\n      }\n    : undefined),\n  ...(color2 === 'disabled'\n    ? {\n        backgroundColor: theme.palette.colors.neutral[50],\n        color: theme.palette.colors.neutral[400],\n      }\n    : undefined),\n  ...(color2 === 'info'\n    ? {\n        backgroundColor: theme.palette.colors.primary[200],\n        color: theme.palette.colors.primary[800],\n      }\n    : undefined),\n  ...(color2 === 'orange'\n    ? {\n        backgroundColor: theme.palette.colors.orange[200],\n        color: theme.palette.colors.orange[700],\n      }\n    : undefined),\n  ...(color2 === 'blue'\n    ? {\n        backgroundColor: theme.palette.colors.blue[300],\n        color: theme.palette.colors.blue[900],\n      }\n    : undefined),\n}));\n"],"names":["AppTooltip","styled","Chip"],"mappings":";;;;;AA2BO,MAAM,YAAsC,CAAC;AAAA,EAClD;AAAA,EACA,QAAQ;AAAA,EACR,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,MAAI,UAAU,UAAW,SAAQ;AAEjC,QAAM,yCAAW,eAAA,EAAc,QAAQ,OAAO,MAAY,KAAW,GAAG,OAAO;AAI/E,MAAI,CAAC,QAAS,QAAO;AAErB,wCACGA,WAAAA,YAAA,EAAW,aAAa,SAAU,GAAG,cACnC,UAAA,SACH;AAEJ;AAEA,UAAU,cAAc;AAIxB,MAAM,gBAAgBC,SAAAA,OAAOC,eAAM;AAAA,EACjC,mBAAmB,UAAQ,SAAS;AACtC,CAAC,EAAwC,CAAC,EAAE,OAAO,SAAS,iBAAiB;AAAA,EAC3E,GAAI,WAAW,YACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,OAAO,MAAM,GAAG;AAAA,IAC/C,OAAO,MAAM,QAAQ,OAAO,MAAM,GAAG;AAAA,EAAA,IAEvC;AAAA,EACJ,GAAI,WAAW,UACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,OAAO,IAAI,GAAG;AAAA,IAC7C,OAAO,MAAM,QAAQ,OAAO,IAAI,GAAG;AAAA,EAAA,IAErC;AAAA,EACJ,GAAI,WAAW,YACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,OAAO,OAAO,GAAG;AAAA,IAChD,OAAO,MAAM,QAAQ,OAAO,OAAO,GAAI;AAAA,EAAA,IAEzC;AAAA,EACJ,GAAI,WAAW,YACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,OAAO,QAAQ,GAAG;AAAA,IACjD,OAAO,MAAM,QAAQ,OAAO,QAAQ,GAAG;AAAA,EAAA,IAEzC;AAAA,EACJ,GAAI,WAAW,aACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,OAAO,QAAQ,EAAE;AAAA,IAChD,OAAO,MAAM,QAAQ,OAAO,QAAQ,GAAG;AAAA,EAAA,IAEzC;AAAA,EACJ,GAAI,WAAW,SACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,OAAO,QAAQ,GAAG;AAAA,IACjD,OAAO,MAAM,QAAQ,OAAO,QAAQ,GAAG;AAAA,EAAA,IAEzC;AAAA,EACJ,GAAI,WAAW,WACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,OAAO,OAAO,GAAG;AAAA,IAChD,OAAO,MAAM,QAAQ,OAAO,OAAO,GAAG;AAAA,EAAA,IAExC;AAAA,EACJ,GAAI,WAAW,SACX;AAAA,IACE,iBAAiB,MAAM,QAAQ,OAAO,KAAK,GAAG;AAAA,IAC9C,OAAO,MAAM,QAAQ,OAAO,KAAK,GAAG;AAAA,EAAA,IAEtC;AACN,EAAE;;"}

package/dist/cjs/components/app-tooltip.js

@@ -0,0 +1,74 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const material = require("@mui/material");
+const stackColumn = require("./stack-column.js");
+const AppTooltip = ({
+  children,
+  headline,
+  headLintProps,
+  description,
+  descriptionProps,
+  content,
+  contentProps,
+  disable,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    material.Tooltip,
+    {
+      arrow: true,
+      placement: "top",
+      disableInteractive: true,
+      enterDelay: 500,
+      slotProps: {
+        popper: { modifiers: [{ name: "offset", options: { offset: [0, -4] } }] }
+      },
+      title: disable ? void 0 : /* @__PURE__ */ jsxRuntime.jsx(
+        AppTooltipTitle,
+        {
+          headline,
+          headLintProps,
+          description,
+          descriptionProps,
+          content,
+          contentProps
+        }
+      ),
+      ...props,
+      children
+    }
+  );
+};
+const AppTooltipTitle = ({
+  headline,
+  headLintProps,
+  description,
+  descriptionProps,
+  content,
+  contentProps
+}) => {
+  const headlineElem = typeof headline === "string" ? /* @__PURE__ */ jsxRuntime.jsx(HeadlineTypography, { ...headLintProps, children: headline }) : headline;
+  const descriptionElem = typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(DescriptionTypography, { ...descriptionProps, children: description }) : description;
+  const contentElem = typeof content === "string" ? /* @__PURE__ */ jsxRuntime.jsx(DescriptionTypography, { ...contentProps, children: content }) : content;
+  return /* @__PURE__ */ jsxRuntime.jsxs(stackColumn.StackColumn, { gap: 1.5, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(stackColumn.StackColumn, { gap: 0.25, children: [
+      headlineElem,
+      descriptionElem
+    ] }),
+    contentElem
+  ] });
+};
+const HeadlineTypography = material.styled(material.Typography)(({ theme }) => ({
+  color: theme.palette.colors.neutral[50],
+  lineHeight: theme.spacing(2.5),
+  fontWeight: 600,
+  fontSize: theme.spacing(1.625)
+}));
+const DescriptionTypography = material.styled(material.Typography)(({ theme }) => ({
+  color: theme.palette.colors.neutral[50],
+  fontWeight: 400,
+  fontSize: theme.spacing(1.5)
+}));
+exports.AppTooltip = AppTooltip;
+//# sourceMappingURL=app-tooltip.js.map

package/dist/cjs/components/app-tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-tooltip.js","sources":["../../../src/components/app-tooltip.tsx"],"sourcesContent":["import { styled, Tooltip, TooltipProps, Typography, TypographyProps } from '@mui/material';\n\nimport { StackColumn } from './stack-column';\n\n//\n//\n\nexport type AppTooltipTitleProps = {\n  headline?: React.ReactNode;\n  headLintProps?: TypographyProps;\n  description?: React.ReactNode;\n  descriptionProps?: TypographyProps;\n  content?: React.ReactNode;\n  contentProps?: TypographyProps;\n  disable?: boolean;\n};\n\nexport type AppTooltipProps = Omit<TooltipProps, 'title' | 'content'> & AppTooltipTitleProps;\n\nexport const AppTooltip = ({\n  children,\n  headline,\n  headLintProps,\n  description,\n  descriptionProps,\n  content,\n  contentProps,\n  disable,\n  ...props\n}: AppTooltipProps) => {\n  return (\n    <Tooltip\n      arrow\n      placement=\"top\"\n      disableInteractive\n      enterDelay={500}\n      slotProps={{\n        popper: { modifiers: [{ name: 'offset', options: { offset: [0, -4] } }] },\n      }}\n      title={\n        disable ? undefined : (\n          <AppTooltipTitle\n            headline={headline}\n            headLintProps={headLintProps}\n            description={description}\n            descriptionProps={descriptionProps}\n            content={content}\n            contentProps={contentProps}\n          />\n        )\n      }\n      {...props}\n    >\n      {children}\n    </Tooltip>\n  );\n};\n\nconst AppTooltipTitle = ({\n  headline,\n  headLintProps,\n  description,\n  descriptionProps,\n  content,\n  contentProps,\n}: AppTooltipTitleProps) => {\n  const headlineElem =\n    typeof headline === 'string' ? (\n      <HeadlineTypography {...headLintProps}>{headline}</HeadlineTypography>\n    ) : (\n      headline\n    );\n\n  //\n\n  const descriptionElem =\n    typeof description === 'string' ? (\n      <DescriptionTypography {...descriptionProps}>{description}</DescriptionTypography>\n    ) : (\n      description\n    );\n\n  //\n\n  const contentElem =\n    typeof content === 'string' ? (\n      <DescriptionTypography {...contentProps}>{content}</DescriptionTypography>\n    ) : (\n      content\n    );\n\n  //\n\n  return (\n    <StackColumn gap={1.5}>\n      <StackColumn gap={0.25}>\n        {headlineElem}\n        {descriptionElem}\n      </StackColumn>\n      {contentElem}\n    </StackColumn>\n  );\n};\n\n//\n\nconst HeadlineTypography = styled(Typography)(({ theme }) => ({\n  color: theme.palette.colors.neutral[50],\n  lineHeight: theme.spacing(2.5),\n  fontWeight: 600,\n  fontSize: theme.spacing(1.625),\n}));\n\nconst DescriptionTypography = styled(Typography)(({ theme }) => ({\n  color: theme.palette.colors.neutral[50],\n  fontWeight: 400,\n  fontSize: theme.spacing(1.5),\n}));\n"],"names":["jsx","Tooltip","jsxs","StackColumn","styled","Typography"],"mappings":";;;;;AAmBO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAuB;AACrB,SACEA,2BAAAA;AAAAA,IAACC,SAAAA;AAAAA,IAAA;AAAA,MACC,OAAK;AAAA,MACL,WAAU;AAAA,MACV,oBAAkB;AAAA,MAClB,YAAY;AAAA,MACZ,WAAW;AAAA,QACT,QAAQ,EAAE,WAAW,CAAC,EAAE,MAAM,UAAU,SAAS,EAAE,QAAQ,CAAC,GAAG,EAAE,EAAA,EAAE,CAAG,EAAA;AAAA,MAAE;AAAA,MAE1E,OACE,UAAU,SACRD,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QAAA;AAAA,MAAA;AAAA,MAIL,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;AAEA,MAAM,kBAAkB,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA4B;AAC1B,QAAM,eACJ,OAAO,aAAa,0CACjB,oBAAA,EAAoB,GAAG,eAAgB,UAAA,SAAA,CAAS,IAEjD;AAKJ,QAAM,kBACJ,OAAO,gBAAgB,0CACpB,uBAAA,EAAuB,GAAG,kBAAmB,UAAA,YAAA,CAAY,IAE1D;AAKJ,QAAM,cACJ,OAAO,YAAY,0CAChB,uBAAA,EAAuB,GAAG,cAAe,UAAA,QAAA,CAAQ,IAElD;AAKJ,SACEE,2BAAAA,KAACC,YAAAA,aAAA,EAAY,KAAK,KAChB,UAAA;AAAA,IAAAD,2BAAAA,KAACC,YAAAA,aAAA,EAAY,KAAK,MACf,UAAA;AAAA,MAAA;AAAA,MACA;AAAA,IAAA,GACH;AAAA,IACC;AAAA,EAAA,GACH;AAEJ;AAIA,MAAM,qBAAqBC,SAAAA,OAAOC,SAAAA,UAAU,EAAE,CAAC,EAAE,aAAa;AAAA,EAC5D,OAAO,MAAM,QAAQ,OAAO,QAAQ,EAAE;AAAA,EACtC,YAAY,MAAM,QAAQ,GAAG;AAAA,EAC7B,YAAY;AAAA,EACZ,UAAU,MAAM,QAAQ,KAAK;AAC/B,EAAE;AAEF,MAAM,wBAAwBD,SAAAA,OAAOC,SAAAA,UAAU,EAAE,CAAC,EAAE,aAAa;AAAA,EAC/D,OAAO,MAAM,QAAQ,OAAO,QAAQ,EAAE;AAAA,EACtC,YAAY;AAAA,EACZ,UAAU,MAAM,QAAQ,GAAG;AAC7B,EAAE;;"}

package/dist/cjs/components/app-typography.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const material = require("@mui/material");
+const appTooltip = require("./app-tooltip.js");
+const AppTypography = ({
+  ref,
+  children,
+  variant = "body1",
+  tooltip,
+  tooltipProps,
+  ...props
+}) => {
+  const element = /* @__PURE__ */ jsxRuntime.jsx(material.Typography, { ref, ...props, variant, children });
+  return tooltip ? /* @__PURE__ */ jsxRuntime.jsx(appTooltip.AppTooltip, { description: tooltip, ...tooltipProps, children: element }) : element;
+};
+AppTypography.displayName = "AppTypography";
+exports.AppTypography = AppTypography;
+//# sourceMappingURL=app-typography.js.map

package/dist/cjs/components/app-typography.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-typography.js","sources":["../../../src/components/app-typography.tsx"],"sourcesContent":["import React from 'react';\n\nimport { Typography, TypographyProps, TypographyVariant } from '@mui/material';\n\nimport { AppTooltip, AppTooltipProps } from './app-tooltip';\n\n//\n//\n\nexport type AppTypographyProps = Omit<TypographyProps, 'fontSize' | 'fontWeight' | 'fontStyle'> & {\n  variant?: TypographyVariant;\n  tooltip?: string | null;\n  tooltipProps?: Omit<AppTooltipProps, 'children'>;\n};\n\nexport const AppTypography: React.FC<AppTypographyProps> = ({\n  ref,\n  children,\n  variant = 'body1',\n  tooltip,\n  tooltipProps,\n  ...props\n}) => {\n  const element = (\n    <Typography ref={ref} {...props} variant={variant}>\n      {children}\n    </Typography>\n  );\n\n  return tooltip ? (\n    <AppTooltip description={tooltip} {...tooltipProps}>\n      {element}\n    </AppTooltip>\n  ) : (\n    element\n  );\n};\n\nAppTypography.displayName = 'AppTypography';\n"],"names":["jsx","Typography","AppTooltip"],"mappings":";;;;;AAeO,MAAM,gBAA8C,CAAC;AAAA,EAC1D;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,UACJA,2BAAAA,IAACC,qBAAA,EAAW,KAAW,GAAG,OAAO,SAC9B,UACH;AAGF,SAAO,yCACJC,WAAAA,YAAA,EAAW,aAAa,SAAU,GAAG,cACnC,mBACH,IAEA;AAEJ;AAEA,cAAc,cAAc;;"}

package/dist/cjs/components/stack-column.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const material = require("@mui/material");
+const StackColumn = ({ children, ...props }) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(material.Stack, { spacing: 0, direction: "column", ...props, children });
+};
+StackColumn.displayName = "StackColumn";
+exports.StackColumn = StackColumn;
+//# sourceMappingURL=stack-column.js.map