@xyo-network/react-property 2.62.3 → 2.64.0-rc.1

package/dist/index.js

@@ -1,9 +1,7 @@
 "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)
@@ -17,14 +15,6 @@ var __copyProps = (to, from, except, desc) => {
   }
   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/index.ts
@@ -116,7 +106,7 @@ var import_react_flexbox5 = require("@xylabs/react-flexbox");
 var import_react4 = require("react");
 
 // src/components/ActionsMenu.tsx
-var import_MoreHoriz = __toESM(require("@mui/icons-material/MoreHoriz"));
+var import_icons_material = require("@mui/icons-material");
 var import_material3 = require("@mui/material");
 var import_react_flexbox3 = require("@xylabs/react-flexbox");
 var import_react = require("react");
@@ -131,7 +121,7 @@ var PropertyActionsMenu = ({ actions, ...props }) => {
     setAnchorEl(null);
   };
   return actions && actions?.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react_flexbox3.FlexRow, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.IconButton, { size: "small", color: "inherit", onClick: handleClick, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_MoreHoriz.default, { fontSize: "inherit" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.IconButton, { size: "small", color: "inherit", onClick: handleClick, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons_material.MoreHoriz, { fontSize: "inherit" }) }),
     /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Menu, { anchorEl, open, onClose: handleClose, children: actions?.map((action) => {
       return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
         import_material3.MenuItem,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/components/Group.tsx","../../../../../node_modules/@xyo-network/typeof/src/typeOf.ts","../../../../../node_modules/@xyo-network/typeof/src/ifDefined.ts","../../../../../node_modules/@xyo-network/typeof/src/ifTypeOf.ts","../../../../../node_modules/@xyo-network/typeof/src/validateType.ts","../src/components/Title.tsx","../src/components/Property.tsx","../src/components/ActionsMenu.tsx","../src/components/IdenticonCorner.tsx","../src/components/Value.tsx"],"sourcesContent":["export * from './components'\n","import { Paper, useTheme } from '@mui/material'\nimport { FlexCol, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport { typeOf } from '@xyo-network/typeof'\nimport { ReactElement } from 'react'\n\nimport { PropertyGroupBoxProps, PropertyGroupPaperProps, PropertyGroupProps } from './Props'\nimport { PropertyTitle } from './Title'\n\nconst PropertyGroupBox: React.FC<PropertyGroupBoxProps> = ({ titleProps, children, title, tip, ...props }) => {\n  const theme = useTheme()\n  const childrenArray = typeOf(children) === 'array' ? (children as ReactElement[]) : undefined\n  return (\n    <FlexCol alignItems=\"stretch\" overflow=\"hidden\" {...props}>\n      <FlexRow overflow=\"hidden\" justifyContent=\"stretch\" alignItems=\"stretch\">\n        <PropertyTitle alignItems=\"flex-start\" size=\"full\" title={title} tip={tip} {...titleProps} />\n        {childrenArray ? (\n          <FlexGrowRow>\n            {childrenArray?.map((child, index) => {\n              return child ? (\n                <FlexGrowRow key={index} borderLeft={1} borderColor={theme.palette.divider}>\n                  {child}\n                </FlexGrowRow>\n              ) : null\n            })}\n          </FlexGrowRow>\n        ) : (\n          <FlexGrowRow overflow=\"hidden\">{children}</FlexGrowRow>\n        )}\n      </FlexRow>\n    </FlexCol>\n  )\n}\n\nconst PropertyGroupPaper: React.FC<PropertyGroupPaperProps> = ({ style, variant, elevation, square, ...props }) => {\n  return (\n    <Paper style={{ minWidth: 0, overflow: 'hidden', ...style }} variant={variant} elevation={elevation} square={square}>\n      <PropertyGroupBox {...props} paper={false} />\n    </Paper>\n  )\n}\n\nexport const PropertyGroup: React.FC<PropertyGroupProps> = (props) => {\n  return props.paper ? <PropertyGroupPaper {...props} /> : <PropertyGroupBox {...props} />\n}\n","import { TypeOfTypes } from './TypeOfTypes'\n\nexport const typeOf = <T>(item: T): TypeOfTypes => {\n  return Array.isArray(item) ? 'array' : typeof item\n}\n","import { typeOf } from './typeOf'\n\nexport const ifDefined = <T>(value: T, func: (value: T) => void) => {\n  switch (typeOf(value)) {\n    case 'undefined':\n    case 'null':\n      break\n    default:\n      func(value)\n      return value\n  }\n}\n","import { typeOf } from './typeOf'\nimport { TypeOfTypes } from './TypeOfTypes'\n\nexport const ifTypeOf = <T, R>(typeName: TypeOfTypes, value: unknown, trueFunc: (value: T) => R, isFunc?: (value: T) => boolean) => {\n  switch (typeOf(value)) {\n    case typeName:\n      return !isFunc || isFunc(value as T) ? trueFunc(value as T) : undefined\n  }\n}\n","import { typeOf } from './typeOf'\nimport { TypeOfTypes } from './TypeOfTypes'\n\nexport const validateType = <T>(typeName: TypeOfTypes, value: T, optional = false): [T | undefined, Error[]] => {\n  switch (typeOf(value)) {\n    case typeName:\n      return [value, []]\n    default: {\n      if (optional && typeOf(value) === 'undefined') {\n        return [value, []]\n      }\n      return [undefined, [Error(`value type is not '${typeName}:${typeof value}'`)]]\n    }\n  }\n}\n","import { darken, lighten, Typography, TypographyVariant, useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport { QuickTipButton } from '@xylabs/react-quick-tip-button'\nimport { SizeProp } from '@xyo-network/react-shared'\nimport { ReactNode } from 'react'\n\nexport type TitleSizeProp = SizeProp | 'full'\n\nexport interface PropertyTitleProps extends FlexBoxProps {\n  elevation?: number\n  more?: ReactNode\n  size?: TitleSizeProp\n  tip?: ReactNode\n  title?: string\n}\n\nexport const PropertyTitle: React.FC<PropertyTitleProps> = ({ elevation = 1, size = 'medium', tip, more, title, ...props }) => {\n  const sizeVariants: Record<TitleSizeProp, TypographyVariant> = {\n    full: 'caption',\n    large: 'caption',\n    medium: 'caption',\n    small: 'caption',\n  }\n\n  const sizeTitleHeight: Record<TitleSizeProp, number | undefined> = {\n    full: undefined,\n    large: 32,\n    medium: 20,\n    small: 16,\n  }\n\n  const sizeFontSize: Record<TitleSizeProp, number> = {\n    full: 16,\n    large: 16,\n    medium: 14,\n    small: 10,\n  }\n\n  const quickTipSize = sizeFontSize[size] < 16 ? sizeFontSize[size] : 16\n\n  const theme = useTheme()\n\n  return (\n    <FlexRow\n      bgcolor={\n        theme.palette.mode === 'dark'\n          ? lighten(theme.palette.background.paper, 0.05 * elevation)\n          : darken(theme.palette.background.paper, 0.025 * elevation)\n      }\n      alignItems=\"center\"\n      height={sizeTitleHeight[size]}\n      justifyContent=\"space-between\"\n      {...props}\n    >\n      <FlexRow paddingX={1} paddingY={0.5}>\n        <Typography fontWeight={500} noWrap variant={sizeVariants[size]} fontSize={sizeFontSize[size]}>\n          <small>\n            <strong>{title}</strong>\n          </small>\n        </Typography>\n        {tip ? (\n          <QuickTipButton style={{ fontSize: quickTipSize }} color=\"inherit\" title={title ?? ''}>\n            {tip}\n          </QuickTipButton>\n        ) : null}\n      </FlexRow>\n      {more}\n    </FlexRow>\n  )\n}\n","import { CircularProgress, Paper, TypographyVariant } from '@mui/material'\nimport { FlexRow } from '@xylabs/react-flexbox'\nimport { SizeProp } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nimport { PropertyActionsMenu } from './ActionsMenu'\nimport { IdenticonCorner } from './IdenticonCorner'\nimport { PropertyBoxProps, PropertyPaperProps, PropertyProps } from './Props'\nimport { PropertyTitle } from './Title'\nimport { PropertyValue } from './Value'\n\nconst PropertyBox = forwardRef<HTMLDivElement, PropertyBoxProps>(\n  ({ titleProps, title, value, children, size = 'medium', tip, actions, required, badge = false, ...props }, ref) => {\n    const sizeValueHeight: Record<SizeProp, number> = {\n      large: 48,\n      medium: 36,\n      small: 24,\n    }\n\n    const sizeVariants: Record<SizeProp, TypographyVariant> = {\n      large: 'h6',\n      medium: 'body1',\n      small: 'body2',\n    }\n\n    return (\n      <FlexRow ref={ref} flexDirection=\"column\" minWidth={0} alignItems=\"stretch\" overflow=\"hidden\" {...props}>\n        {title !== undefined ? (\n          <PropertyTitle\n            tip={tip}\n            title={required ? `${title}*` : title}\n            size={size}\n            more={<PropertyActionsMenu actions={actions} />}\n            {...titleProps}\n          />\n        ) : null}\n        <FlexRow\n          pl={1}\n          columnGap={1}\n          justifyContent={value === undefined ? 'center' : 'space-between'}\n          overflow=\"hidden\"\n          height={sizeValueHeight[size]}\n        >\n          {children ? (\n            children\n          ) : value !== undefined ? (\n            <PropertyValue value={value} typographyVariant={sizeVariants[size]} />\n          ) : (\n            <CircularProgress size={16} />\n          )}\n          {value !== undefined ? badge ? <IdenticonCorner value={value} /> : null : null}\n        </FlexRow>\n      </FlexRow>\n    )\n  },\n)\nPropertyBox.displayName = 'PropertyBox'\n\nconst PropertyPaper = forwardRef<HTMLDivElement, PropertyPaperProps>(({ style, variant, elevation = 2, square, ...props }, ref) => {\n  return (\n    <Paper ref={ref} style={{ minWidth: 0, overflow: 'hidden', ...style }} variant={variant} elevation={elevation} square={square}>\n      <PropertyBox {...props} paper={false} />\n    </Paper>\n  )\n})\nPropertyPaper.displayName = 'PropertyPaper'\n\nexport const Property = forwardRef<HTMLDivElement, PropertyProps>((props, ref) => {\n  return props.paper ? <PropertyPaper ref={ref} {...props} /> : <PropertyBox ref={ref} {...props} />\n})\nProperty.displayName = 'Property'\n","import MoreHorizIcon from '@mui/icons-material/MoreHoriz'\nimport { IconButton, Menu, MenuItem } from '@mui/material'\nimport { FlexRow } from '@xylabs/react-flexbox'\nimport { useState } from 'react'\n\nimport { PropertyActionsProps } from './ActionsProps'\n\nexport const PropertyActionsMenu: React.FC<PropertyActionsProps> = ({ actions, ...props }) => {\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null)\n  const open = !!anchorEl\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget)\n  }\n  const handleClose = () => {\n    setAnchorEl(null)\n  }\n\n  return actions && actions?.length > 0 ? (\n    <FlexRow {...props}>\n      <IconButton size=\"small\" color=\"inherit\" onClick={handleClick}>\n        <MoreHorizIcon fontSize=\"inherit\" />\n      </IconButton>\n      <Menu anchorEl={anchorEl} open={open} onClose={handleClose}>\n        {actions?.map((action) => {\n          return (\n            <MenuItem\n              key={action.name}\n              onClick={() => {\n                action?.onClick?.()\n                handleClose()\n              }}\n            >\n              {action.name}\n            </MenuItem>\n          )\n        })}\n      </Menu>\n    </FlexRow>\n  ) : null\n}\n","import { useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport { Identicon } from '@xylabs/react-identicon'\nimport { useEffect, useRef, useState } from 'react'\n\nexport interface IdenticonCornerProps extends FlexBoxProps {\n  value?: string | number | boolean | null\n}\n\nexport const IdenticonCorner: React.FC<IdenticonCornerProps> = ({ value, ...props }) => {\n  const theme = useTheme()\n  const [parentHeight, setParentHeight] = useState<number>()\n  const ref = useRef<HTMLDivElement>(null)\n\n  useEffect(() => {\n    setParentHeight(ref.current?.parentElement?.parentElement?.clientHeight)\n  }, [])\n\n  const calculatedHeight = parentHeight ?? 0\n\n  return (\n    <FlexRow alignItems=\"flex-start\" height=\"100%\">\n      <FlexRow background height={calculatedHeight} width={calculatedHeight} borderLeft={`1px solid ${theme.palette.divider}`}>\n        <div ref={ref}>\n          <Identicon size={calculatedHeight * 0.6} value={`${value}`} sx={{ padding: `${calculatedHeight * 0.2}px` }} {...props} />\n        </div>\n      </FlexRow>\n    </FlexRow>\n  )\n}\n","import type { Variant } from '@mui/material/styles/createTypography'\nimport { EllipsizeBox, EllipsizeBoxProps } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nexport interface PropertyValueProps extends Omit<EllipsizeBoxProps, 'ref'> {\n  typographyVariant?: Variant\n  value?: string | number | boolean | null\n}\n\nexport const PropertyValue = forwardRef<HTMLDivElement, PropertyValueProps>(({ typographyVariant = 'body1', value, ...props }, ref) => {\n  return value !== undefined ? (\n    <EllipsizeBox typographyProps={{ component: undefined, title: value?.toString(), variant: typographyVariant }} width=\"100%\" ref={ref} {...props}>\n      {value}\n    </EllipsizeBox>\n  ) : null\n})\n\nPropertyValue.displayName = 'PropertyValue'\n"],"mappings":"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","names":["import_material","import_react_flexbox","import_jsx_runtime","import_material","import_react_flexbox","import_react","import_material","import_react_flexbox","import_jsx_runtime","MoreHorizIcon","import_material","import_react_flexbox","import_react","import_jsx_runtime","import_react","import_jsx_runtime","import_jsx_runtime"]}
+{"version":3,"sources":["../src/index.ts","../src/components/Group.tsx","../../../../../node_modules/@xyo-network/typeof/src/typeOf.ts","../../../../../node_modules/@xyo-network/typeof/src/ifDefined.ts","../../../../../node_modules/@xyo-network/typeof/src/ifTypeOf.ts","../../../../../node_modules/@xyo-network/typeof/src/validateType.ts","../src/components/Title.tsx","../src/components/Property.tsx","../src/components/ActionsMenu.tsx","../src/components/IdenticonCorner.tsx","../src/components/Value.tsx"],"sourcesContent":["export * from './components'\n","import { Paper, useTheme } from '@mui/material'\nimport { FlexCol, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport { typeOf } from '@xyo-network/typeof'\nimport { ReactElement } from 'react'\n\nimport { PropertyGroupBoxProps, PropertyGroupPaperProps, PropertyGroupProps } from './Props'\nimport { PropertyTitle } from './Title'\n\nconst PropertyGroupBox: React.FC<PropertyGroupBoxProps> = ({ titleProps, children, title, tip, ...props }) => {\n  const theme = useTheme()\n  const childrenArray = typeOf(children) === 'array' ? (children as ReactElement[]) : undefined\n  return (\n    <FlexCol alignItems=\"stretch\" overflow=\"hidden\" {...props}>\n      <FlexRow overflow=\"hidden\" justifyContent=\"stretch\" alignItems=\"stretch\">\n        <PropertyTitle alignItems=\"flex-start\" size=\"full\" title={title} tip={tip} {...titleProps} />\n        {childrenArray ? (\n          <FlexGrowRow>\n            {childrenArray?.map((child, index) => {\n              return child ? (\n                <FlexGrowRow key={index} borderLeft={1} borderColor={theme.palette.divider}>\n                  {child}\n                </FlexGrowRow>\n              ) : null\n            })}\n          </FlexGrowRow>\n        ) : (\n          <FlexGrowRow overflow=\"hidden\">{children}</FlexGrowRow>\n        )}\n      </FlexRow>\n    </FlexCol>\n  )\n}\n\nconst PropertyGroupPaper: React.FC<PropertyGroupPaperProps> = ({ style, variant, elevation, square, ...props }) => {\n  return (\n    <Paper style={{ minWidth: 0, overflow: 'hidden', ...style }} variant={variant} elevation={elevation} square={square}>\n      <PropertyGroupBox {...props} paper={false} />\n    </Paper>\n  )\n}\n\nexport const PropertyGroup: React.FC<PropertyGroupProps> = (props) => {\n  return props.paper ? <PropertyGroupPaper {...props} /> : <PropertyGroupBox {...props} />\n}\n","import { TypeOfTypes } from './TypeOfTypes'\n\nexport const typeOf = <T>(item: T): TypeOfTypes => {\n  return Array.isArray(item) ? 'array' : typeof item\n}\n","import { typeOf } from './typeOf'\n\nexport const ifDefined = <T>(value: T, func: (value: T) => void) => {\n  switch (typeOf(value)) {\n    case 'undefined':\n    case 'null':\n      break\n    default:\n      func(value)\n      return value\n  }\n}\n","import { typeOf } from './typeOf'\nimport { TypeOfTypes } from './TypeOfTypes'\n\nexport const ifTypeOf = <T, R>(typeName: TypeOfTypes, value: unknown, trueFunc: (value: T) => R, isFunc?: (value: T) => boolean) => {\n  switch (typeOf(value)) {\n    case typeName:\n      return !isFunc || isFunc(value as T) ? trueFunc(value as T) : undefined\n  }\n}\n","import { typeOf } from './typeOf'\nimport { TypeOfTypes } from './TypeOfTypes'\n\nexport const validateType = <T>(typeName: TypeOfTypes, value: T, optional = false): [T | undefined, Error[]] => {\n  switch (typeOf(value)) {\n    case typeName:\n      return [value, []]\n    default: {\n      if (optional && typeOf(value) === 'undefined') {\n        return [value, []]\n      }\n      return [undefined, [Error(`value type is not '${typeName}:${typeof value}'`)]]\n    }\n  }\n}\n","import { darken, lighten, Typography, TypographyVariant, useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport { QuickTipButton } from '@xylabs/react-quick-tip-button'\nimport { SizeProp } from '@xyo-network/react-shared'\nimport { ReactNode } from 'react'\n\nexport type TitleSizeProp = SizeProp | 'full'\n\nexport interface PropertyTitleProps extends FlexBoxProps {\n  elevation?: number\n  more?: ReactNode\n  size?: TitleSizeProp\n  tip?: ReactNode\n  title?: string\n}\n\nexport const PropertyTitle: React.FC<PropertyTitleProps> = ({ elevation = 1, size = 'medium', tip, more, title, ...props }) => {\n  const sizeVariants: Record<TitleSizeProp, TypographyVariant> = {\n    full: 'caption',\n    large: 'caption',\n    medium: 'caption',\n    small: 'caption',\n  }\n\n  const sizeTitleHeight: Record<TitleSizeProp, number | undefined> = {\n    full: undefined,\n    large: 32,\n    medium: 20,\n    small: 16,\n  }\n\n  const sizeFontSize: Record<TitleSizeProp, number> = {\n    full: 16,\n    large: 16,\n    medium: 14,\n    small: 10,\n  }\n\n  const quickTipSize = sizeFontSize[size] < 16 ? sizeFontSize[size] : 16\n\n  const theme = useTheme()\n\n  return (\n    <FlexRow\n      bgcolor={\n        theme.palette.mode === 'dark'\n          ? lighten(theme.palette.background.paper, 0.05 * elevation)\n          : darken(theme.palette.background.paper, 0.025 * elevation)\n      }\n      alignItems=\"center\"\n      height={sizeTitleHeight[size]}\n      justifyContent=\"space-between\"\n      {...props}\n    >\n      <FlexRow paddingX={1} paddingY={0.5}>\n        <Typography fontWeight={500} noWrap variant={sizeVariants[size]} fontSize={sizeFontSize[size]}>\n          <small>\n            <strong>{title}</strong>\n          </small>\n        </Typography>\n        {tip ? (\n          <QuickTipButton style={{ fontSize: quickTipSize }} color=\"inherit\" title={title ?? ''}>\n            {tip}\n          </QuickTipButton>\n        ) : null}\n      </FlexRow>\n      {more}\n    </FlexRow>\n  )\n}\n","import { CircularProgress, Paper, TypographyVariant } from '@mui/material'\nimport { FlexRow } from '@xylabs/react-flexbox'\nimport { SizeProp } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nimport { PropertyActionsMenu } from './ActionsMenu'\nimport { IdenticonCorner } from './IdenticonCorner'\nimport { PropertyBoxProps, PropertyPaperProps, PropertyProps } from './Props'\nimport { PropertyTitle } from './Title'\nimport { PropertyValue } from './Value'\n\nconst PropertyBox = forwardRef<HTMLDivElement, PropertyBoxProps>(\n  ({ titleProps, title, value, children, size = 'medium', tip, actions, required, badge = false, ...props }, ref) => {\n    const sizeValueHeight: Record<SizeProp, number> = {\n      large: 48,\n      medium: 36,\n      small: 24,\n    }\n\n    const sizeVariants: Record<SizeProp, TypographyVariant> = {\n      large: 'h6',\n      medium: 'body1',\n      small: 'body2',\n    }\n\n    return (\n      <FlexRow ref={ref} flexDirection=\"column\" minWidth={0} alignItems=\"stretch\" overflow=\"hidden\" {...props}>\n        {title !== undefined ? (\n          <PropertyTitle\n            tip={tip}\n            title={required ? `${title}*` : title}\n            size={size}\n            more={<PropertyActionsMenu actions={actions} />}\n            {...titleProps}\n          />\n        ) : null}\n        <FlexRow\n          pl={1}\n          columnGap={1}\n          justifyContent={value === undefined ? 'center' : 'space-between'}\n          overflow=\"hidden\"\n          height={sizeValueHeight[size]}\n        >\n          {children ? (\n            children\n          ) : value !== undefined ? (\n            <PropertyValue value={value} typographyVariant={sizeVariants[size]} />\n          ) : (\n            <CircularProgress size={16} />\n          )}\n          {value !== undefined ? badge ? <IdenticonCorner value={value} /> : null : null}\n        </FlexRow>\n      </FlexRow>\n    )\n  },\n)\nPropertyBox.displayName = 'PropertyBox'\n\nconst PropertyPaper = forwardRef<HTMLDivElement, PropertyPaperProps>(({ style, variant, elevation = 2, square, ...props }, ref) => {\n  return (\n    <Paper ref={ref} style={{ minWidth: 0, overflow: 'hidden', ...style }} variant={variant} elevation={elevation} square={square}>\n      <PropertyBox {...props} paper={false} />\n    </Paper>\n  )\n})\nPropertyPaper.displayName = 'PropertyPaper'\n\nexport const Property = forwardRef<HTMLDivElement, PropertyProps>((props, ref) => {\n  return props.paper ? <PropertyPaper ref={ref} {...props} /> : <PropertyBox ref={ref} {...props} />\n})\nProperty.displayName = 'Property'\n","import { MoreHoriz as MoreHorizIcon } from '@mui/icons-material'\nimport { IconButton, Menu, MenuItem } from '@mui/material'\nimport { FlexRow } from '@xylabs/react-flexbox'\nimport { useState } from 'react'\n\nimport { PropertyActionsProps } from './ActionsProps'\n\nexport const PropertyActionsMenu: React.FC<PropertyActionsProps> = ({ actions, ...props }) => {\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null)\n  const open = !!anchorEl\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget)\n  }\n  const handleClose = () => {\n    setAnchorEl(null)\n  }\n\n  return actions && actions?.length > 0 ? (\n    <FlexRow {...props}>\n      <IconButton size=\"small\" color=\"inherit\" onClick={handleClick}>\n        <MoreHorizIcon fontSize=\"inherit\" />\n      </IconButton>\n      <Menu anchorEl={anchorEl} open={open} onClose={handleClose}>\n        {actions?.map((action) => {\n          return (\n            <MenuItem\n              key={action.name}\n              onClick={() => {\n                action?.onClick?.()\n                handleClose()\n              }}\n            >\n              {action.name}\n            </MenuItem>\n          )\n        })}\n      </Menu>\n    </FlexRow>\n  ) : null\n}\n","import { useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport { Identicon } from '@xylabs/react-identicon'\nimport { useEffect, useRef, useState } from 'react'\n\nexport interface IdenticonCornerProps extends FlexBoxProps {\n  value?: string | number | boolean | null\n}\n\nexport const IdenticonCorner: React.FC<IdenticonCornerProps> = ({ value, ...props }) => {\n  const theme = useTheme()\n  const [parentHeight, setParentHeight] = useState<number>()\n  const ref = useRef<HTMLDivElement>(null)\n\n  useEffect(() => {\n    setParentHeight(ref.current?.parentElement?.parentElement?.clientHeight)\n  }, [])\n\n  const calculatedHeight = parentHeight ?? 0\n\n  return (\n    <FlexRow alignItems=\"flex-start\" height=\"100%\">\n      <FlexRow background height={calculatedHeight} width={calculatedHeight} borderLeft={`1px solid ${theme.palette.divider}`}>\n        <div ref={ref}>\n          <Identicon size={calculatedHeight * 0.6} value={`${value}`} sx={{ padding: `${calculatedHeight * 0.2}px` }} {...props} />\n        </div>\n      </FlexRow>\n    </FlexRow>\n  )\n}\n","import type { Variant } from '@mui/material/styles/createTypography'\nimport { EllipsizeBox, EllipsizeBoxProps } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nexport interface PropertyValueProps extends Omit<EllipsizeBoxProps, 'ref'> {\n  typographyVariant?: Variant\n  value?: string | number | boolean | null\n}\n\nexport const PropertyValue = forwardRef<HTMLDivElement, PropertyValueProps>(({ typographyVariant = 'body1', value, ...props }, ref) => {\n  return value !== undefined ? (\n    <EllipsizeBox typographyProps={{ component: undefined, title: value?.toString(), variant: typographyVariant }} width=\"100%\" ref={ref} {...props}>\n      {value}\n    </EllipsizeBox>\n  ) : null\n})\n\nPropertyValue.displayName = 'PropertyValue'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,IAAAA,mBAAgC;AAChC,IAAAC,wBAA8C;;;ACCvC,IAAM,SAAS,CAAI,SAAyB;AACjD,SAAO,MAAM,QAAQ,IAAI,IAAI,UAAU,OAAO;AAChD;;;AIJA,sBAAyE;AACzE,2BAAsC;AACtC,oCAA+B;AAoDzB;AAtCC,IAAM,gBAA8C,CAAC,EAAE,YAAY,GAAG,OAAO,UAAU,KAAK,MAAM,OAAO,GAAG,MAAM,MAAM;AAC7H,QAAM,eAAyD;AAAA,IAC7D,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,OAAO;AAAA,EACT;AAEA,QAAM,kBAA6D;AAAA,IACjE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,OAAO;AAAA,EACT;AAEA,QAAM,eAA8C;AAAA,IAClD,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,OAAO;AAAA,EACT;AAEA,QAAM,eAAe,aAAa,IAAI,IAAI,KAAK,aAAa,IAAI,IAAI;AAEpE,QAAM,YAAQ,0BAAS;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SACE,MAAM,QAAQ,SAAS,aACnB,yBAAQ,MAAM,QAAQ,WAAW,OAAO,OAAO,SAAS,QACxD,wBAAO,MAAM,QAAQ,WAAW,OAAO,QAAQ,SAAS;AAAA,MAE9D,YAAW;AAAA,MACX,QAAQ,gBAAgB,IAAI;AAAA,MAC5B,gBAAe;AAAA,MACd,GAAG;AAAA,MAEJ;AAAA,qDAAC,gCAAQ,UAAU,GAAG,UAAU,KAC9B;AAAA,sDAAC,8BAAW,YAAY,KAAK,QAAM,MAAC,SAAS,aAAa,IAAI,GAAG,UAAU,aAAa,IAAI,GAC1F,sDAAC,WACC,sDAAC,YAAQ,iBAAM,GACjB,GACF;AAAA,UACC,MACC,4CAAC,gDAAe,OAAO,EAAE,UAAU,aAAa,GAAG,OAAM,WAAU,OAAO,SAAS,IAChF,eACH,IACE;AAAA,WACN;AAAA,QACC;AAAA;AAAA;AAAA,EACH;AAEJ;;;ALxDM,IAAAC,sBAAA;AALN,IAAM,mBAAoD,CAAC,EAAE,YAAY,UAAU,OAAO,KAAK,GAAG,MAAM,MAAM;AAC5G,QAAM,YAAQ,2BAAS;AACvB,QAAM,gBAAgB,OAAO,QAAQ,MAAM,UAAW,WAA8B;AACpF,SACE,6CAAC,iCAAQ,YAAW,WAAU,UAAS,UAAU,GAAG,OAClD,wDAAC,iCAAQ,UAAS,UAAS,gBAAe,WAAU,YAAW,WAC7D;AAAA,iDAAC,iBAAc,YAAW,cAAa,MAAK,QAAO,OAAc,KAAW,GAAG,YAAY;AAAA,IAC1F,gBACC,6CAAC,qCACE,yBAAe,IAAI,CAAC,OAAO,UAAU;AACpC,aAAO,QACL,6CAAC,qCAAwB,YAAY,GAAG,aAAa,MAAM,QAAQ,SAChE,mBADe,KAElB,IACE;AAAA,IACN,CAAC,GACH,IAEA,6CAAC,qCAAY,UAAS,UAAU,UAAS;AAAA,KAE7C,GACF;AAEJ;AAEA,IAAM,qBAAwD,CAAC,EAAE,OAAO,SAAS,WAAW,QAAQ,GAAG,MAAM,MAAM;AACjH,SACE,6CAAC,0BAAM,OAAO,EAAE,UAAU,GAAG,UAAU,UAAU,GAAG,MAAM,GAAG,SAAkB,WAAsB,QACnG,uDAAC,oBAAkB,GAAG,OAAO,OAAO,OAAO,GAC7C;AAEJ;AAEO,IAAM,gBAA8C,CAAC,UAAU;AACpE,SAAO,MAAM,QAAQ,6CAAC,sBAAoB,GAAG,OAAO,IAAK,6CAAC,oBAAkB,GAAG,OAAO;AACxF;;;AM3CA,IAAAC,mBAA2D;AAC3D,IAAAC,wBAAwB;AAExB,IAAAC,gBAA2B;;;ACH3B,4BAA2C;AAC3C,IAAAC,mBAA2C;AAC3C,IAAAC,wBAAwB;AACxB,mBAAyB;AAgBrB,IAAAC,sBAAA;AAZG,IAAM,sBAAsD,CAAC,EAAE,SAAS,GAAG,MAAM,MAAM;AAC5F,QAAM,CAAC,UAAU,WAAW,QAAI,uBAA6B,IAAI;AACjE,QAAM,OAAO,CAAC,CAAC;AAEf,QAAM,cAAc,CAAC,UAAyC;AAC5D,gBAAY,MAAM,aAAa;AAAA,EACjC;AACA,QAAM,cAAc,MAAM;AACxB,gBAAY,IAAI;AAAA,EAClB;AAEA,SAAO,WAAW,SAAS,SAAS,IAClC,8CAAC,iCAAS,GAAG,OACX;AAAA,iDAAC,+BAAW,MAAK,SAAQ,OAAM,WAAU,SAAS,aAChD,uDAAC,sBAAAC,WAAA,EAAc,UAAS,WAAU,GACpC;AAAA,IACA,6CAAC,yBAAK,UAAoB,MAAY,SAAS,aAC5C,mBAAS,IAAI,CAAC,WAAW;AACxB,aACE;AAAA,QAAC;AAAA;AAAA,UAEC,SAAS,MAAM;AACb,oBAAQ,UAAU;AAClB,wBAAY;AAAA,UACd;AAAA,UAEC,iBAAO;AAAA;AAAA,QANH,OAAO;AAAA,MAOd;AAAA,IAEJ,CAAC,GACH;AAAA,KACF,IACE;AACN;;;ACxCA,IAAAC,mBAAyB;AACzB,IAAAC,wBAAsC;AACtC,6BAA0B;AAC1B,IAAAC,gBAA4C;AAqBlC,IAAAC,sBAAA;AAfH,IAAM,kBAAkD,CAAC,EAAE,OAAO,GAAG,MAAM,MAAM;AACtF,QAAM,YAAQ,2BAAS;AACvB,QAAM,CAAC,cAAc,eAAe,QAAI,wBAAiB;AACzD,QAAM,UAAM,sBAAuB,IAAI;AAEvC,+BAAU,MAAM;AACd,oBAAgB,IAAI,SAAS,eAAe,eAAe,YAAY;AAAA,EACzE,GAAG,CAAC,CAAC;AAEL,QAAM,mBAAmB,gBAAgB;AAEzC,SACE,6CAAC,iCAAQ,YAAW,cAAa,QAAO,QACtC,uDAAC,iCAAQ,YAAU,MAAC,QAAQ,kBAAkB,OAAO,kBAAkB,YAAY,aAAa,MAAM,QAAQ,OAAO,IACnH,uDAAC,SAAI,KACH,uDAAC,oCAAU,MAAM,mBAAmB,KAAK,OAAO,GAAG,KAAK,IAAI,IAAI,EAAE,SAAS,GAAG,mBAAmB,GAAG,KAAK,GAAI,GAAG,OAAO,GACzH,GACF,GACF;AAEJ;;;AC5BA,0BAAgD;AAChD,IAAAC,gBAA2B;AASvB,IAAAC,sBAAA;AAFG,IAAM,oBAAgB,0BAA+C,CAAC,EAAE,oBAAoB,SAAS,OAAO,GAAG,MAAM,GAAG,QAAQ;AACrI,SAAO,UAAU,SACf,6CAAC,oCAAa,iBAAiB,EAAE,WAAW,QAAW,OAAO,OAAO,SAAS,GAAG,SAAS,kBAAkB,GAAG,OAAM,QAAO,KAAW,GAAG,OACvI,iBACH,IACE;AACN,CAAC;AAED,cAAc,cAAc;;;AHeV,IAAAC,sBAAA;AArBlB,IAAM,kBAAc;AAAA,EAClB,CAAC,EAAE,YAAY,OAAO,OAAO,UAAU,OAAO,UAAU,KAAK,SAAS,UAAU,QAAQ,OAAO,GAAG,MAAM,GAAG,QAAQ;AACjH,UAAM,kBAA4C;AAAA,MAChD,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,IACT;AAEA,UAAM,eAAoD;AAAA,MACxD,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,IACT;AAEA,WACE,8CAAC,iCAAQ,KAAU,eAAc,UAAS,UAAU,GAAG,YAAW,WAAU,UAAS,UAAU,GAAG,OAC/F;AAAA,gBAAU,SACT;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,OAAO,WAAW,GAAG,KAAK,MAAM;AAAA,UAChC;AAAA,UACA,MAAM,6CAAC,uBAAoB,SAAkB;AAAA,UAC5C,GAAG;AAAA;AAAA,MACN,IACE;AAAA,MACJ;AAAA,QAAC;AAAA;AAAA,UACC,IAAI;AAAA,UACJ,WAAW;AAAA,UACX,gBAAgB,UAAU,SAAY,WAAW;AAAA,UACjD,UAAS;AAAA,UACT,QAAQ,gBAAgB,IAAI;AAAA,UAE3B;AAAA,uBACC,WACE,UAAU,SACZ,6CAAC,iBAAc,OAAc,mBAAmB,aAAa,IAAI,GAAG,IAEpE,6CAAC,qCAAiB,MAAM,IAAI;AAAA,YAE7B,UAAU,SAAY,QAAQ,6CAAC,mBAAgB,OAAc,IAAK,OAAO;AAAA;AAAA;AAAA,MAC5E;AAAA,OACF;AAAA,EAEJ;AACF;AACA,YAAY,cAAc;AAE1B,IAAM,oBAAgB,0BAA+C,CAAC,EAAE,OAAO,SAAS,YAAY,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ;AACjI,SACE,6CAAC,0BAAM,KAAU,OAAO,EAAE,UAAU,GAAG,UAAU,UAAU,GAAG,MAAM,GAAG,SAAkB,WAAsB,QAC7G,uDAAC,eAAa,GAAG,OAAO,OAAO,OAAO,GACxC;AAEJ,CAAC;AACD,cAAc,cAAc;AAErB,IAAM,eAAW,0BAA0C,CAAC,OAAO,QAAQ;AAChF,SAAO,MAAM,QAAQ,6CAAC,iBAAc,KAAW,GAAG,OAAO,IAAK,6CAAC,eAAY,KAAW,GAAG,OAAO;AAClG,CAAC;AACD,SAAS,cAAc;","names":["import_material","import_react_flexbox","import_jsx_runtime","import_material","import_react_flexbox","import_react","import_material","import_react_flexbox","import_jsx_runtime","MoreHorizIcon","import_material","import_react_flexbox","import_react","import_jsx_runtime","import_react","import_jsx_runtime","import_jsx_runtime"]}

package/dist/index.mjs

@@ -77,7 +77,7 @@ import { FlexRow as FlexRow5 } from "@xylabs/react-flexbox";
 import { forwardRef as forwardRef2 } from "react";
 
 // src/components/ActionsMenu.tsx
-import MoreHorizIcon from "@mui/icons-material/MoreHoriz";
+import { MoreHoriz as MoreHorizIcon } from "@mui/icons-material";
 import { IconButton, Menu, MenuItem } from "@mui/material";
 import { FlexRow as FlexRow3 } from "@xylabs/react-flexbox";
 import { useState } from "react";

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Group.tsx","../../../../../node_modules/@xyo-network/typeof/src/typeOf.ts","../../../../../node_modules/@xyo-network/typeof/src/ifDefined.ts","../../../../../node_modules/@xyo-network/typeof/src/ifTypeOf.ts","../../../../../node_modules/@xyo-network/typeof/src/validateType.ts","../src/components/Title.tsx","../src/components/Property.tsx","../src/components/ActionsMenu.tsx","../src/components/IdenticonCorner.tsx","../src/components/Value.tsx"],"sourcesContent":["import { Paper, useTheme } from '@mui/material'\nimport { FlexCol, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport { typeOf } from '@xyo-network/typeof'\nimport { ReactElement } from 'react'\n\nimport { PropertyGroupBoxProps, PropertyGroupPaperProps, PropertyGroupProps } from './Props'\nimport { PropertyTitle } from './Title'\n\nconst PropertyGroupBox: React.FC<PropertyGroupBoxProps> = ({ titleProps, children, title, tip, ...props }) => {\n  const theme = useTheme()\n  const childrenArray = typeOf(children) === 'array' ? (children as ReactElement[]) : undefined\n  return (\n    <FlexCol alignItems=\"stretch\" overflow=\"hidden\" {...props}>\n      <FlexRow overflow=\"hidden\" justifyContent=\"stretch\" alignItems=\"stretch\">\n        <PropertyTitle alignItems=\"flex-start\" size=\"full\" title={title} tip={tip} {...titleProps} />\n        {childrenArray ? (\n          <FlexGrowRow>\n            {childrenArray?.map((child, index) => {\n              return child ? (\n                <FlexGrowRow key={index} borderLeft={1} borderColor={theme.palette.divider}>\n                  {child}\n                </FlexGrowRow>\n              ) : null\n            })}\n          </FlexGrowRow>\n        ) : (\n          <FlexGrowRow overflow=\"hidden\">{children}</FlexGrowRow>\n        )}\n      </FlexRow>\n    </FlexCol>\n  )\n}\n\nconst PropertyGroupPaper: React.FC<PropertyGroupPaperProps> = ({ style, variant, elevation, square, ...props }) => {\n  return (\n    <Paper style={{ minWidth: 0, overflow: 'hidden', ...style }} variant={variant} elevation={elevation} square={square}>\n      <PropertyGroupBox {...props} paper={false} />\n    </Paper>\n  )\n}\n\nexport const PropertyGroup: React.FC<PropertyGroupProps> = (props) => {\n  return props.paper ? <PropertyGroupPaper {...props} /> : <PropertyGroupBox {...props} />\n}\n","import { TypeOfTypes } from './TypeOfTypes'\n\nexport const typeOf = <T>(item: T): TypeOfTypes => {\n  return Array.isArray(item) ? 'array' : typeof item\n}\n","import { typeOf } from './typeOf'\n\nexport const ifDefined = <T>(value: T, func: (value: T) => void) => {\n  switch (typeOf(value)) {\n    case 'undefined':\n    case 'null':\n      break\n    default:\n      func(value)\n      return value\n  }\n}\n","import { typeOf } from './typeOf'\nimport { TypeOfTypes } from './TypeOfTypes'\n\nexport const ifTypeOf = <T, R>(typeName: TypeOfTypes, value: unknown, trueFunc: (value: T) => R, isFunc?: (value: T) => boolean) => {\n  switch (typeOf(value)) {\n    case typeName:\n      return !isFunc || isFunc(value as T) ? trueFunc(value as T) : undefined\n  }\n}\n","import { typeOf } from './typeOf'\nimport { TypeOfTypes } from './TypeOfTypes'\n\nexport const validateType = <T>(typeName: TypeOfTypes, value: T, optional = false): [T | undefined, Error[]] => {\n  switch (typeOf(value)) {\n    case typeName:\n      return [value, []]\n    default: {\n      if (optional && typeOf(value) === 'undefined') {\n        return [value, []]\n      }\n      return [undefined, [Error(`value type is not '${typeName}:${typeof value}'`)]]\n    }\n  }\n}\n","import { darken, lighten, Typography, TypographyVariant, useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport { QuickTipButton } from '@xylabs/react-quick-tip-button'\nimport { SizeProp } from '@xyo-network/react-shared'\nimport { ReactNode } from 'react'\n\nexport type TitleSizeProp = SizeProp | 'full'\n\nexport interface PropertyTitleProps extends FlexBoxProps {\n  elevation?: number\n  more?: ReactNode\n  size?: TitleSizeProp\n  tip?: ReactNode\n  title?: string\n}\n\nexport const PropertyTitle: React.FC<PropertyTitleProps> = ({ elevation = 1, size = 'medium', tip, more, title, ...props }) => {\n  const sizeVariants: Record<TitleSizeProp, TypographyVariant> = {\n    full: 'caption',\n    large: 'caption',\n    medium: 'caption',\n    small: 'caption',\n  }\n\n  const sizeTitleHeight: Record<TitleSizeProp, number | undefined> = {\n    full: undefined,\n    large: 32,\n    medium: 20,\n    small: 16,\n  }\n\n  const sizeFontSize: Record<TitleSizeProp, number> = {\n    full: 16,\n    large: 16,\n    medium: 14,\n    small: 10,\n  }\n\n  const quickTipSize = sizeFontSize[size] < 16 ? sizeFontSize[size] : 16\n\n  const theme = useTheme()\n\n  return (\n    <FlexRow\n      bgcolor={\n        theme.palette.mode === 'dark'\n          ? lighten(theme.palette.background.paper, 0.05 * elevation)\n          : darken(theme.palette.background.paper, 0.025 * elevation)\n      }\n      alignItems=\"center\"\n      height={sizeTitleHeight[size]}\n      justifyContent=\"space-between\"\n      {...props}\n    >\n      <FlexRow paddingX={1} paddingY={0.5}>\n        <Typography fontWeight={500} noWrap variant={sizeVariants[size]} fontSize={sizeFontSize[size]}>\n          <small>\n            <strong>{title}</strong>\n          </small>\n        </Typography>\n        {tip ? (\n          <QuickTipButton style={{ fontSize: quickTipSize }} color=\"inherit\" title={title ?? ''}>\n            {tip}\n          </QuickTipButton>\n        ) : null}\n      </FlexRow>\n      {more}\n    </FlexRow>\n  )\n}\n","import { CircularProgress, Paper, TypographyVariant } from '@mui/material'\nimport { FlexRow } from '@xylabs/react-flexbox'\nimport { SizeProp } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nimport { PropertyActionsMenu } from './ActionsMenu'\nimport { IdenticonCorner } from './IdenticonCorner'\nimport { PropertyBoxProps, PropertyPaperProps, PropertyProps } from './Props'\nimport { PropertyTitle } from './Title'\nimport { PropertyValue } from './Value'\n\nconst PropertyBox = forwardRef<HTMLDivElement, PropertyBoxProps>(\n  ({ titleProps, title, value, children, size = 'medium', tip, actions, required, badge = false, ...props }, ref) => {\n    const sizeValueHeight: Record<SizeProp, number> = {\n      large: 48,\n      medium: 36,\n      small: 24,\n    }\n\n    const sizeVariants: Record<SizeProp, TypographyVariant> = {\n      large: 'h6',\n      medium: 'body1',\n      small: 'body2',\n    }\n\n    return (\n      <FlexRow ref={ref} flexDirection=\"column\" minWidth={0} alignItems=\"stretch\" overflow=\"hidden\" {...props}>\n        {title !== undefined ? (\n          <PropertyTitle\n            tip={tip}\n            title={required ? `${title}*` : title}\n            size={size}\n            more={<PropertyActionsMenu actions={actions} />}\n            {...titleProps}\n          />\n        ) : null}\n        <FlexRow\n          pl={1}\n          columnGap={1}\n          justifyContent={value === undefined ? 'center' : 'space-between'}\n          overflow=\"hidden\"\n          height={sizeValueHeight[size]}\n        >\n          {children ? (\n            children\n          ) : value !== undefined ? (\n            <PropertyValue value={value} typographyVariant={sizeVariants[size]} />\n          ) : (\n            <CircularProgress size={16} />\n          )}\n          {value !== undefined ? badge ? <IdenticonCorner value={value} /> : null : null}\n        </FlexRow>\n      </FlexRow>\n    )\n  },\n)\nPropertyBox.displayName = 'PropertyBox'\n\nconst PropertyPaper = forwardRef<HTMLDivElement, PropertyPaperProps>(({ style, variant, elevation = 2, square, ...props }, ref) => {\n  return (\n    <Paper ref={ref} style={{ minWidth: 0, overflow: 'hidden', ...style }} variant={variant} elevation={elevation} square={square}>\n      <PropertyBox {...props} paper={false} />\n    </Paper>\n  )\n})\nPropertyPaper.displayName = 'PropertyPaper'\n\nexport const Property = forwardRef<HTMLDivElement, PropertyProps>((props, ref) => {\n  return props.paper ? <PropertyPaper ref={ref} {...props} /> : <PropertyBox ref={ref} {...props} />\n})\nProperty.displayName = 'Property'\n","import MoreHorizIcon from '@mui/icons-material/MoreHoriz'\nimport { IconButton, Menu, MenuItem } from '@mui/material'\nimport { FlexRow } from '@xylabs/react-flexbox'\nimport { useState } from 'react'\n\nimport { PropertyActionsProps } from './ActionsProps'\n\nexport const PropertyActionsMenu: React.FC<PropertyActionsProps> = ({ actions, ...props }) => {\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null)\n  const open = !!anchorEl\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget)\n  }\n  const handleClose = () => {\n    setAnchorEl(null)\n  }\n\n  return actions && actions?.length > 0 ? (\n    <FlexRow {...props}>\n      <IconButton size=\"small\" color=\"inherit\" onClick={handleClick}>\n        <MoreHorizIcon fontSize=\"inherit\" />\n      </IconButton>\n      <Menu anchorEl={anchorEl} open={open} onClose={handleClose}>\n        {actions?.map((action) => {\n          return (\n            <MenuItem\n              key={action.name}\n              onClick={() => {\n                action?.onClick?.()\n                handleClose()\n              }}\n            >\n              {action.name}\n            </MenuItem>\n          )\n        })}\n      </Menu>\n    </FlexRow>\n  ) : null\n}\n","import { useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport { Identicon } from '@xylabs/react-identicon'\nimport { useEffect, useRef, useState } from 'react'\n\nexport interface IdenticonCornerProps extends FlexBoxProps {\n  value?: string | number | boolean | null\n}\n\nexport const IdenticonCorner: React.FC<IdenticonCornerProps> = ({ value, ...props }) => {\n  const theme = useTheme()\n  const [parentHeight, setParentHeight] = useState<number>()\n  const ref = useRef<HTMLDivElement>(null)\n\n  useEffect(() => {\n    setParentHeight(ref.current?.parentElement?.parentElement?.clientHeight)\n  }, [])\n\n  const calculatedHeight = parentHeight ?? 0\n\n  return (\n    <FlexRow alignItems=\"flex-start\" height=\"100%\">\n      <FlexRow background height={calculatedHeight} width={calculatedHeight} borderLeft={`1px solid ${theme.palette.divider}`}>\n        <div ref={ref}>\n          <Identicon size={calculatedHeight * 0.6} value={`${value}`} sx={{ padding: `${calculatedHeight * 0.2}px` }} {...props} />\n        </div>\n      </FlexRow>\n    </FlexRow>\n  )\n}\n","import type { Variant } from '@mui/material/styles/createTypography'\nimport { EllipsizeBox, EllipsizeBoxProps } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nexport interface PropertyValueProps extends Omit<EllipsizeBoxProps, 'ref'> {\n  typographyVariant?: Variant\n  value?: string | number | boolean | null\n}\n\nexport const PropertyValue = forwardRef<HTMLDivElement, PropertyValueProps>(({ typographyVariant = 'body1', value, ...props }, ref) => {\n  return value !== undefined ? (\n    <EllipsizeBox typographyProps={{ component: undefined, title: value?.toString(), variant: typographyVariant }} width=\"100%\" ref={ref} {...props}>\n      {value}\n    </EllipsizeBox>\n  ) : null\n})\n\nPropertyValue.displayName = 'PropertyValue'\n"],"mappings":"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","names":["useTheme","FlexRow","jsx","jsxs","useTheme","FlexRow","Paper","FlexRow","forwardRef","FlexRow","jsx","jsxs","useTheme","FlexRow","useState","jsx","jsx","jsx","jsxs","forwardRef","FlexRow","Paper"]}
+{"version":3,"sources":["../src/components/Group.tsx","../../../../../node_modules/@xyo-network/typeof/src/typeOf.ts","../../../../../node_modules/@xyo-network/typeof/src/ifDefined.ts","../../../../../node_modules/@xyo-network/typeof/src/ifTypeOf.ts","../../../../../node_modules/@xyo-network/typeof/src/validateType.ts","../src/components/Title.tsx","../src/components/Property.tsx","../src/components/ActionsMenu.tsx","../src/components/IdenticonCorner.tsx","../src/components/Value.tsx"],"sourcesContent":["import { Paper, useTheme } from '@mui/material'\nimport { FlexCol, FlexGrowRow, FlexRow } from '@xylabs/react-flexbox'\nimport { typeOf } from '@xyo-network/typeof'\nimport { ReactElement } from 'react'\n\nimport { PropertyGroupBoxProps, PropertyGroupPaperProps, PropertyGroupProps } from './Props'\nimport { PropertyTitle } from './Title'\n\nconst PropertyGroupBox: React.FC<PropertyGroupBoxProps> = ({ titleProps, children, title, tip, ...props }) => {\n  const theme = useTheme()\n  const childrenArray = typeOf(children) === 'array' ? (children as ReactElement[]) : undefined\n  return (\n    <FlexCol alignItems=\"stretch\" overflow=\"hidden\" {...props}>\n      <FlexRow overflow=\"hidden\" justifyContent=\"stretch\" alignItems=\"stretch\">\n        <PropertyTitle alignItems=\"flex-start\" size=\"full\" title={title} tip={tip} {...titleProps} />\n        {childrenArray ? (\n          <FlexGrowRow>\n            {childrenArray?.map((child, index) => {\n              return child ? (\n                <FlexGrowRow key={index} borderLeft={1} borderColor={theme.palette.divider}>\n                  {child}\n                </FlexGrowRow>\n              ) : null\n            })}\n          </FlexGrowRow>\n        ) : (\n          <FlexGrowRow overflow=\"hidden\">{children}</FlexGrowRow>\n        )}\n      </FlexRow>\n    </FlexCol>\n  )\n}\n\nconst PropertyGroupPaper: React.FC<PropertyGroupPaperProps> = ({ style, variant, elevation, square, ...props }) => {\n  return (\n    <Paper style={{ minWidth: 0, overflow: 'hidden', ...style }} variant={variant} elevation={elevation} square={square}>\n      <PropertyGroupBox {...props} paper={false} />\n    </Paper>\n  )\n}\n\nexport const PropertyGroup: React.FC<PropertyGroupProps> = (props) => {\n  return props.paper ? <PropertyGroupPaper {...props} /> : <PropertyGroupBox {...props} />\n}\n","import { TypeOfTypes } from './TypeOfTypes'\n\nexport const typeOf = <T>(item: T): TypeOfTypes => {\n  return Array.isArray(item) ? 'array' : typeof item\n}\n","import { typeOf } from './typeOf'\n\nexport const ifDefined = <T>(value: T, func: (value: T) => void) => {\n  switch (typeOf(value)) {\n    case 'undefined':\n    case 'null':\n      break\n    default:\n      func(value)\n      return value\n  }\n}\n","import { typeOf } from './typeOf'\nimport { TypeOfTypes } from './TypeOfTypes'\n\nexport const ifTypeOf = <T, R>(typeName: TypeOfTypes, value: unknown, trueFunc: (value: T) => R, isFunc?: (value: T) => boolean) => {\n  switch (typeOf(value)) {\n    case typeName:\n      return !isFunc || isFunc(value as T) ? trueFunc(value as T) : undefined\n  }\n}\n","import { typeOf } from './typeOf'\nimport { TypeOfTypes } from './TypeOfTypes'\n\nexport const validateType = <T>(typeName: TypeOfTypes, value: T, optional = false): [T | undefined, Error[]] => {\n  switch (typeOf(value)) {\n    case typeName:\n      return [value, []]\n    default: {\n      if (optional && typeOf(value) === 'undefined') {\n        return [value, []]\n      }\n      return [undefined, [Error(`value type is not '${typeName}:${typeof value}'`)]]\n    }\n  }\n}\n","import { darken, lighten, Typography, TypographyVariant, useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport { QuickTipButton } from '@xylabs/react-quick-tip-button'\nimport { SizeProp } from '@xyo-network/react-shared'\nimport { ReactNode } from 'react'\n\nexport type TitleSizeProp = SizeProp | 'full'\n\nexport interface PropertyTitleProps extends FlexBoxProps {\n  elevation?: number\n  more?: ReactNode\n  size?: TitleSizeProp\n  tip?: ReactNode\n  title?: string\n}\n\nexport const PropertyTitle: React.FC<PropertyTitleProps> = ({ elevation = 1, size = 'medium', tip, more, title, ...props }) => {\n  const sizeVariants: Record<TitleSizeProp, TypographyVariant> = {\n    full: 'caption',\n    large: 'caption',\n    medium: 'caption',\n    small: 'caption',\n  }\n\n  const sizeTitleHeight: Record<TitleSizeProp, number | undefined> = {\n    full: undefined,\n    large: 32,\n    medium: 20,\n    small: 16,\n  }\n\n  const sizeFontSize: Record<TitleSizeProp, number> = {\n    full: 16,\n    large: 16,\n    medium: 14,\n    small: 10,\n  }\n\n  const quickTipSize = sizeFontSize[size] < 16 ? sizeFontSize[size] : 16\n\n  const theme = useTheme()\n\n  return (\n    <FlexRow\n      bgcolor={\n        theme.palette.mode === 'dark'\n          ? lighten(theme.palette.background.paper, 0.05 * elevation)\n          : darken(theme.palette.background.paper, 0.025 * elevation)\n      }\n      alignItems=\"center\"\n      height={sizeTitleHeight[size]}\n      justifyContent=\"space-between\"\n      {...props}\n    >\n      <FlexRow paddingX={1} paddingY={0.5}>\n        <Typography fontWeight={500} noWrap variant={sizeVariants[size]} fontSize={sizeFontSize[size]}>\n          <small>\n            <strong>{title}</strong>\n          </small>\n        </Typography>\n        {tip ? (\n          <QuickTipButton style={{ fontSize: quickTipSize }} color=\"inherit\" title={title ?? ''}>\n            {tip}\n          </QuickTipButton>\n        ) : null}\n      </FlexRow>\n      {more}\n    </FlexRow>\n  )\n}\n","import { CircularProgress, Paper, TypographyVariant } from '@mui/material'\nimport { FlexRow } from '@xylabs/react-flexbox'\nimport { SizeProp } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nimport { PropertyActionsMenu } from './ActionsMenu'\nimport { IdenticonCorner } from './IdenticonCorner'\nimport { PropertyBoxProps, PropertyPaperProps, PropertyProps } from './Props'\nimport { PropertyTitle } from './Title'\nimport { PropertyValue } from './Value'\n\nconst PropertyBox = forwardRef<HTMLDivElement, PropertyBoxProps>(\n  ({ titleProps, title, value, children, size = 'medium', tip, actions, required, badge = false, ...props }, ref) => {\n    const sizeValueHeight: Record<SizeProp, number> = {\n      large: 48,\n      medium: 36,\n      small: 24,\n    }\n\n    const sizeVariants: Record<SizeProp, TypographyVariant> = {\n      large: 'h6',\n      medium: 'body1',\n      small: 'body2',\n    }\n\n    return (\n      <FlexRow ref={ref} flexDirection=\"column\" minWidth={0} alignItems=\"stretch\" overflow=\"hidden\" {...props}>\n        {title !== undefined ? (\n          <PropertyTitle\n            tip={tip}\n            title={required ? `${title}*` : title}\n            size={size}\n            more={<PropertyActionsMenu actions={actions} />}\n            {...titleProps}\n          />\n        ) : null}\n        <FlexRow\n          pl={1}\n          columnGap={1}\n          justifyContent={value === undefined ? 'center' : 'space-between'}\n          overflow=\"hidden\"\n          height={sizeValueHeight[size]}\n        >\n          {children ? (\n            children\n          ) : value !== undefined ? (\n            <PropertyValue value={value} typographyVariant={sizeVariants[size]} />\n          ) : (\n            <CircularProgress size={16} />\n          )}\n          {value !== undefined ? badge ? <IdenticonCorner value={value} /> : null : null}\n        </FlexRow>\n      </FlexRow>\n    )\n  },\n)\nPropertyBox.displayName = 'PropertyBox'\n\nconst PropertyPaper = forwardRef<HTMLDivElement, PropertyPaperProps>(({ style, variant, elevation = 2, square, ...props }, ref) => {\n  return (\n    <Paper ref={ref} style={{ minWidth: 0, overflow: 'hidden', ...style }} variant={variant} elevation={elevation} square={square}>\n      <PropertyBox {...props} paper={false} />\n    </Paper>\n  )\n})\nPropertyPaper.displayName = 'PropertyPaper'\n\nexport const Property = forwardRef<HTMLDivElement, PropertyProps>((props, ref) => {\n  return props.paper ? <PropertyPaper ref={ref} {...props} /> : <PropertyBox ref={ref} {...props} />\n})\nProperty.displayName = 'Property'\n","import { MoreHoriz as MoreHorizIcon } from '@mui/icons-material'\nimport { IconButton, Menu, MenuItem } from '@mui/material'\nimport { FlexRow } from '@xylabs/react-flexbox'\nimport { useState } from 'react'\n\nimport { PropertyActionsProps } from './ActionsProps'\n\nexport const PropertyActionsMenu: React.FC<PropertyActionsProps> = ({ actions, ...props }) => {\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null)\n  const open = !!anchorEl\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget)\n  }\n  const handleClose = () => {\n    setAnchorEl(null)\n  }\n\n  return actions && actions?.length > 0 ? (\n    <FlexRow {...props}>\n      <IconButton size=\"small\" color=\"inherit\" onClick={handleClick}>\n        <MoreHorizIcon fontSize=\"inherit\" />\n      </IconButton>\n      <Menu anchorEl={anchorEl} open={open} onClose={handleClose}>\n        {actions?.map((action) => {\n          return (\n            <MenuItem\n              key={action.name}\n              onClick={() => {\n                action?.onClick?.()\n                handleClose()\n              }}\n            >\n              {action.name}\n            </MenuItem>\n          )\n        })}\n      </Menu>\n    </FlexRow>\n  ) : null\n}\n","import { useTheme } from '@mui/material'\nimport { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'\nimport { Identicon } from '@xylabs/react-identicon'\nimport { useEffect, useRef, useState } from 'react'\n\nexport interface IdenticonCornerProps extends FlexBoxProps {\n  value?: string | number | boolean | null\n}\n\nexport const IdenticonCorner: React.FC<IdenticonCornerProps> = ({ value, ...props }) => {\n  const theme = useTheme()\n  const [parentHeight, setParentHeight] = useState<number>()\n  const ref = useRef<HTMLDivElement>(null)\n\n  useEffect(() => {\n    setParentHeight(ref.current?.parentElement?.parentElement?.clientHeight)\n  }, [])\n\n  const calculatedHeight = parentHeight ?? 0\n\n  return (\n    <FlexRow alignItems=\"flex-start\" height=\"100%\">\n      <FlexRow background height={calculatedHeight} width={calculatedHeight} borderLeft={`1px solid ${theme.palette.divider}`}>\n        <div ref={ref}>\n          <Identicon size={calculatedHeight * 0.6} value={`${value}`} sx={{ padding: `${calculatedHeight * 0.2}px` }} {...props} />\n        </div>\n      </FlexRow>\n    </FlexRow>\n  )\n}\n","import type { Variant } from '@mui/material/styles/createTypography'\nimport { EllipsizeBox, EllipsizeBoxProps } from '@xyo-network/react-shared'\nimport { forwardRef } from 'react'\n\nexport interface PropertyValueProps extends Omit<EllipsizeBoxProps, 'ref'> {\n  typographyVariant?: Variant\n  value?: string | number | boolean | null\n}\n\nexport const PropertyValue = forwardRef<HTMLDivElement, PropertyValueProps>(({ typographyVariant = 'body1', value, ...props }, ref) => {\n  return value !== undefined ? (\n    <EllipsizeBox typographyProps={{ component: undefined, title: value?.toString(), variant: typographyVariant }} width=\"100%\" ref={ref} {...props}>\n      {value}\n    </EllipsizeBox>\n  ) : null\n})\n\nPropertyValue.displayName = 'PropertyValue'\n"],"mappings":"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","names":["useTheme","FlexRow","jsx","jsxs","useTheme","FlexRow","Paper","FlexRow","forwardRef","FlexRow","jsx","jsxs","useTheme","FlexRow","useState","jsx","jsx","jsx","jsxs","forwardRef","FlexRow","Paper"]}

package/package.json

@@ -10,11 +10,11 @@
     "url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/issues"
   },
   "dependencies": {
-    "@xylabs/react-button": "~2.18.4",
-    "@xylabs/react-flexbox": "~2.18.4",
-    "@xylabs/react-identicon": "~2.18.4",
-    "@xylabs/react-quick-tip-button": "~2.18.4",
-    "@xyo-network/react-shared": "~2.62.3"
+    "@xylabs/react-button": "^3.1.0-rc.3",
+    "@xylabs/react-flexbox": "^3.1.0-rc.3",
+    "@xylabs/react-identicon": "^3.1.0-rc.3",
+    "@xylabs/react-quick-tip-button": "^3.1.0-rc.3",
+    "@xyo-network/react-shared": "~2.64.0-rc.1"
   },
   "peerDependencies": {
     "@mui/icons-material": "^5",
@@ -29,9 +29,9 @@
     "@storybook/react": "^7.4.3",
     "@xylabs/ts-scripts-yarn3": "^3.0.28",
     "@xylabs/tsconfig-react": "^3.0.28",
-    "@xyo-network/payload-wrapper": "^2.74.1",
-    "@xyo-network/react-storybook": "~2.62.3",
-    "@xyo-network/typeof": "^2.74.1",
+    "@xyo-network/payload-wrapper": "^2.74.4",
+    "@xyo-network/react-storybook": "~2.64.0-rc.1",
+    "@xyo-network/typeof": "^2.74.4",
     "typescript": "^5.2.2"
   },
   "description": "Common React library for all XYO projects that use React",
@@ -85,5 +85,6 @@
   },
   "sideEffects": false,
   "types": "dist/index.d.ts",
-  "version": "2.62.3"
+  "version": "2.64.0-rc.1",
+  "stableVersion": "2.63.1"
 }

package/src/components/ActionsMenu.tsx

@@ -1,4 +1,4 @@
-import MoreHorizIcon from '@mui/icons-material/MoreHoriz'
+import { MoreHoriz as MoreHorizIcon } from '@mui/icons-material'
 import { IconButton, Menu, MenuItem } from '@mui/material'
 import { FlexRow } from '@xylabs/react-flexbox'
 import { useState } from 'react'

package/src/components/PropertyBox.stories.tsx

@@ -1,4 +1,4 @@
-import ReplayIcon from '@mui/icons-material/Replay'
+import { Replay as ReplayIcon } from '@mui/icons-material'
 import { TextField } from '@mui/material'
 import { Meta, StoryFn } from '@storybook/react'
 import { FlexCol, FlexRow } from '@xylabs/react-flexbox'

package/src/components/PropertyPaper.stories.tsx

@@ -1,4 +1,4 @@
-import ReplayIcon from '@mui/icons-material/Replay'
+import { Replay as ReplayIcon } from '@mui/icons-material'
 import { TextField } from '@mui/material'
 import { Meta, StoryFn } from '@storybook/react'
 import { FlexCol, FlexRow } from '@xylabs/react-flexbox'