@xyo-network/react-property 2.64.9 → 2.64.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (90) hide show
  1. package/dist/docs.json +12159 -5655
  2. package/package.json +11 -11
  3. package/dist/browser/components/Action.cjs +0 -19
  4. package/dist/browser/components/Action.cjs.map +0 -1
  5. package/dist/browser/components/Action.js +0 -1
  6. package/dist/browser/components/Action.js.map +0 -1
  7. package/dist/browser/components/Actions.cjs +0 -38
  8. package/dist/browser/components/Actions.cjs.map +0 -1
  9. package/dist/browser/components/Actions.js +0 -17
  10. package/dist/browser/components/Actions.js.map +0 -1
  11. package/dist/browser/components/ActionsMenu.cjs +0 -57
  12. package/dist/browser/components/ActionsMenu.cjs.map +0 -1
  13. package/dist/browser/components/ActionsMenu.js +0 -36
  14. package/dist/browser/components/ActionsMenu.js.map +0 -1
  15. package/dist/browser/components/ActionsProps.cjs +0 -19
  16. package/dist/browser/components/ActionsProps.cjs.map +0 -1
  17. package/dist/browser/components/ActionsProps.js +0 -1
  18. package/dist/browser/components/ActionsProps.js.map +0 -1
  19. package/dist/browser/components/Group.cjs +0 -93
  20. package/dist/browser/components/Group.cjs.map +0 -1
  21. package/dist/browser/components/Group.js +0 -72
  22. package/dist/browser/components/Group.js.map +0 -1
  23. package/dist/browser/components/IdenticonCorner.cjs +0 -41
  24. package/dist/browser/components/IdenticonCorner.cjs.map +0 -1
  25. package/dist/browser/components/IdenticonCorner.js +0 -20
  26. package/dist/browser/components/IdenticonCorner.js.map +0 -1
  27. package/dist/browser/components/Property.cjs +0 -185
  28. package/dist/browser/components/Property.cjs.map +0 -1
  29. package/dist/browser/components/Property.js +0 -164
  30. package/dist/browser/components/Property.js.map +0 -1
  31. package/dist/browser/components/Props.cjs +0 -19
  32. package/dist/browser/components/Props.cjs.map +0 -1
  33. package/dist/browser/components/Props.js +0 -1
  34. package/dist/browser/components/Props.js.map +0 -1
  35. package/dist/browser/components/Title.cjs +0 -69
  36. package/dist/browser/components/Title.cjs.map +0 -1
  37. package/dist/browser/components/Title.js +0 -48
  38. package/dist/browser/components/Title.js.map +0 -1
  39. package/dist/browser/components/Value.cjs +0 -33
  40. package/dist/browser/components/Value.cjs.map +0 -1
  41. package/dist/browser/components/Value.js +0 -12
  42. package/dist/browser/components/Value.js.map +0 -1
  43. package/dist/browser/components/index.cjs +0 -214
  44. package/dist/browser/components/index.cjs.map +0 -1
  45. package/dist/browser/components/index.js +0 -191
  46. package/dist/browser/components/index.js.map +0 -1
  47. package/dist/node/components/Action.cjs +0 -19
  48. package/dist/node/components/Action.cjs.map +0 -1
  49. package/dist/node/components/Action.js +0 -1
  50. package/dist/node/components/Action.js.map +0 -1
  51. package/dist/node/components/Actions.cjs +0 -42
  52. package/dist/node/components/Actions.cjs.map +0 -1
  53. package/dist/node/components/Actions.js +0 -17
  54. package/dist/node/components/Actions.js.map +0 -1
  55. package/dist/node/components/ActionsMenu.cjs +0 -62
  56. package/dist/node/components/ActionsMenu.cjs.map +0 -1
  57. package/dist/node/components/ActionsMenu.js +0 -37
  58. package/dist/node/components/ActionsMenu.js.map +0 -1
  59. package/dist/node/components/ActionsProps.cjs +0 -19
  60. package/dist/node/components/ActionsProps.cjs.map +0 -1
  61. package/dist/node/components/ActionsProps.js +0 -1
  62. package/dist/node/components/ActionsProps.js.map +0 -1
  63. package/dist/node/components/Group.cjs +0 -97
  64. package/dist/node/components/Group.cjs.map +0 -1
  65. package/dist/node/components/Group.js +0 -72
  66. package/dist/node/components/Group.js.map +0 -1
  67. package/dist/node/components/IdenticonCorner.cjs +0 -46
  68. package/dist/node/components/IdenticonCorner.cjs.map +0 -1
  69. package/dist/node/components/IdenticonCorner.js +0 -21
  70. package/dist/node/components/IdenticonCorner.js.map +0 -1
  71. package/dist/node/components/Property.cjs +0 -191
  72. package/dist/node/components/Property.cjs.map +0 -1
  73. package/dist/node/components/Property.js +0 -166
  74. package/dist/node/components/Property.js.map +0 -1
  75. package/dist/node/components/Props.cjs +0 -19
  76. package/dist/node/components/Props.cjs.map +0 -1
  77. package/dist/node/components/Props.js +0 -1
  78. package/dist/node/components/Props.js.map +0 -1
  79. package/dist/node/components/Title.cjs +0 -73
  80. package/dist/node/components/Title.cjs.map +0 -1
  81. package/dist/node/components/Title.js +0 -48
  82. package/dist/node/components/Title.js.map +0 -1
  83. package/dist/node/components/Value.cjs +0 -37
  84. package/dist/node/components/Value.cjs.map +0 -1
  85. package/dist/node/components/Value.js +0 -12
  86. package/dist/node/components/Value.js.map +0 -1
  87. package/dist/node/components/index.cjs +0 -223
  88. package/dist/node/components/index.cjs.map +0 -1
  89. package/dist/node/components/index.js +0 -193
  90. package/dist/node/components/index.js.map +0 -1
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/Property.tsx","../../../src/components/ActionsMenu.tsx","../../../src/components/IdenticonCorner.tsx","../../../src/components/Title.tsx","../../../src/components/Value.tsx"],"sourcesContent":["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 { 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 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_react","MoreHorizIcon","import_material","import_react_flexbox","import_react","import_jsx_runtime","import_material","import_react_flexbox","import_jsx_runtime","import_react","import_jsx_runtime","import_jsx_runtime"]}
@@ -1,166 +0,0 @@
1
- // src/components/Property.tsx
2
- import { CircularProgress, Paper } from "@mui/material";
3
- import { FlexRow as FlexRow4 } from "@xylabs/react-flexbox";
4
- import { forwardRef as forwardRef2 } from "react";
5
-
6
- // src/components/ActionsMenu.tsx
7
- import { MoreHoriz as MoreHorizIcon } from "@mui/icons-material";
8
- import { IconButton, Menu, MenuItem } from "@mui/material";
9
- import { FlexRow } from "@xylabs/react-flexbox";
10
- import { useState } from "react";
11
- import { jsx, jsxs } from "react/jsx-runtime";
12
- var PropertyActionsMenu = ({ actions, ...props }) => {
13
- const [anchorEl, setAnchorEl] = useState(null);
14
- const open = !!anchorEl;
15
- const handleClick = (event) => {
16
- setAnchorEl(event.currentTarget);
17
- };
18
- const handleClose = () => {
19
- setAnchorEl(null);
20
- };
21
- return actions && (actions == null ? void 0 : actions.length) > 0 ? /* @__PURE__ */ jsxs(FlexRow, { ...props, children: [
22
- /* @__PURE__ */ jsx(IconButton, { size: "small", color: "inherit", onClick: handleClick, children: /* @__PURE__ */ jsx(MoreHorizIcon, { fontSize: "inherit" }) }),
23
- /* @__PURE__ */ jsx(Menu, { anchorEl, open, onClose: handleClose, children: actions == null ? void 0 : actions.map((action) => {
24
- return /* @__PURE__ */ jsx(
25
- MenuItem,
26
- {
27
- onClick: () => {
28
- var _a;
29
- (_a = action == null ? void 0 : action.onClick) == null ? void 0 : _a.call(action);
30
- handleClose();
31
- },
32
- children: action.name
33
- },
34
- action.name
35
- );
36
- }) })
37
- ] }) : null;
38
- };
39
-
40
- // src/components/IdenticonCorner.tsx
41
- import { useTheme } from "@mui/material";
42
- import { FlexRow as FlexRow2 } from "@xylabs/react-flexbox";
43
- import { Identicon } from "@xylabs/react-identicon";
44
- import { useEffect, useRef, useState as useState2 } from "react";
45
- import { jsx as jsx2 } from "react/jsx-runtime";
46
- var IdenticonCorner = ({ value, ...props }) => {
47
- const theme = useTheme();
48
- const [parentHeight, setParentHeight] = useState2();
49
- const ref = useRef(null);
50
- useEffect(() => {
51
- var _a, _b, _c;
52
- setParentHeight((_c = (_b = (_a = ref.current) == null ? void 0 : _a.parentElement) == null ? void 0 : _b.parentElement) == null ? void 0 : _c.clientHeight);
53
- }, []);
54
- const calculatedHeight = parentHeight ?? 0;
55
- return /* @__PURE__ */ jsx2(FlexRow2, { alignItems: "flex-start", height: "100%", children: /* @__PURE__ */ jsx2(FlexRow2, { background: true, height: calculatedHeight, width: calculatedHeight, borderLeft: `1px solid ${theme.palette.divider}`, children: /* @__PURE__ */ jsx2("div", { ref, children: /* @__PURE__ */ jsx2(Identicon, { size: calculatedHeight * 0.6, value: `${value}`, sx: { padding: `${calculatedHeight * 0.2}px` }, ...props }) }) }) });
56
- };
57
-
58
- // src/components/Title.tsx
59
- import { darken, lighten, Typography, useTheme as useTheme2 } from "@mui/material";
60
- import { FlexRow as FlexRow3 } from "@xylabs/react-flexbox";
61
- import { QuickTipButton } from "@xylabs/react-quick-tip-button";
62
- import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
63
- var PropertyTitle = ({ elevation = 1, size = "medium", tip, more, title, ...props }) => {
64
- const sizeVariants = {
65
- full: "caption",
66
- large: "caption",
67
- medium: "caption",
68
- small: "caption"
69
- };
70
- const sizeTitleHeight = {
71
- full: void 0,
72
- large: 32,
73
- medium: 20,
74
- small: 16
75
- };
76
- const sizeFontSize = {
77
- full: 16,
78
- large: 16,
79
- medium: 14,
80
- small: 10
81
- };
82
- const quickTipSize = sizeFontSize[size] < 16 ? sizeFontSize[size] : 16;
83
- const theme = useTheme2();
84
- return /* @__PURE__ */ jsxs2(
85
- FlexRow3,
86
- {
87
- bgcolor: theme.palette.mode === "dark" ? lighten(theme.palette.background.paper, 0.05 * elevation) : darken(theme.palette.background.paper, 0.025 * elevation),
88
- alignItems: "center",
89
- height: sizeTitleHeight[size],
90
- justifyContent: "space-between",
91
- ...props,
92
- children: [
93
- /* @__PURE__ */ jsxs2(FlexRow3, { paddingX: 1, paddingY: 0.5, children: [
94
- /* @__PURE__ */ jsx3(Typography, { fontWeight: 500, noWrap: true, variant: sizeVariants[size], fontSize: sizeFontSize[size], children: /* @__PURE__ */ jsx3("small", { children: /* @__PURE__ */ jsx3("strong", { children: title }) }) }),
95
- tip ? /* @__PURE__ */ jsx3(QuickTipButton, { style: { fontSize: quickTipSize }, color: "inherit", title: title ?? "", children: tip }) : null
96
- ] }),
97
- more
98
- ]
99
- }
100
- );
101
- };
102
-
103
- // src/components/Value.tsx
104
- import { EllipsizeBox } from "@xyo-network/react-shared";
105
- import { forwardRef } from "react";
106
- import { jsx as jsx4 } from "react/jsx-runtime";
107
- var PropertyValue = forwardRef(({ typographyVariant = "body1", value, ...props }, ref) => {
108
- return value !== void 0 ? /* @__PURE__ */ jsx4(EllipsizeBox, { typographyProps: { component: void 0, title: value == null ? void 0 : value.toString(), variant: typographyVariant }, width: "100%", ref, ...props, children: value }) : null;
109
- });
110
- PropertyValue.displayName = "PropertyValue";
111
-
112
- // src/components/Property.tsx
113
- import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
114
- var PropertyBox = forwardRef2(
115
- ({ titleProps, title, value, children, size = "medium", tip, actions, required, badge = false, ...props }, ref) => {
116
- const sizeValueHeight = {
117
- large: 48,
118
- medium: 36,
119
- small: 24
120
- };
121
- const sizeVariants = {
122
- large: "h6",
123
- medium: "body1",
124
- small: "body2"
125
- };
126
- return /* @__PURE__ */ jsxs3(FlexRow4, { ref, flexDirection: "column", minWidth: 0, alignItems: "stretch", overflow: "hidden", ...props, children: [
127
- title !== void 0 ? /* @__PURE__ */ jsx5(
128
- PropertyTitle,
129
- {
130
- tip,
131
- title: required ? `${title}*` : title,
132
- size,
133
- more: /* @__PURE__ */ jsx5(PropertyActionsMenu, { actions }),
134
- ...titleProps
135
- }
136
- ) : null,
137
- /* @__PURE__ */ jsxs3(
138
- FlexRow4,
139
- {
140
- pl: 1,
141
- columnGap: 1,
142
- justifyContent: value === void 0 ? "center" : "space-between",
143
- overflow: "hidden",
144
- height: sizeValueHeight[size],
145
- children: [
146
- children ? children : value !== void 0 ? /* @__PURE__ */ jsx5(PropertyValue, { value, typographyVariant: sizeVariants[size] }) : /* @__PURE__ */ jsx5(CircularProgress, { size: 16 }),
147
- value !== void 0 ? badge ? /* @__PURE__ */ jsx5(IdenticonCorner, { value }) : null : null
148
- ]
149
- }
150
- )
151
- ] });
152
- }
153
- );
154
- PropertyBox.displayName = "PropertyBox";
155
- var PropertyPaper = forwardRef2(({ style, variant, elevation = 2, square, ...props }, ref) => {
156
- return /* @__PURE__ */ jsx5(Paper, { ref, style: { minWidth: 0, overflow: "hidden", ...style }, variant, elevation, square, children: /* @__PURE__ */ jsx5(PropertyBox, { ...props, paper: false }) });
157
- });
158
- PropertyPaper.displayName = "PropertyPaper";
159
- var Property = forwardRef2((props, ref) => {
160
- return props.paper ? /* @__PURE__ */ jsx5(PropertyPaper, { ref, ...props }) : /* @__PURE__ */ jsx5(PropertyBox, { ref, ...props });
161
- });
162
- Property.displayName = "Property";
163
- export {
164
- Property
165
- };
166
- //# sourceMappingURL=Property.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/Property.tsx","../../../src/components/ActionsMenu.tsx","../../../src/components/IdenticonCorner.tsx","../../../src/components/Title.tsx","../../../src/components/Value.tsx"],"sourcesContent":["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 { 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 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":["FlexRow","forwardRef","FlexRow","useState","jsx","useTheme","FlexRow","jsx","jsxs","jsx","jsx","jsxs","forwardRef","FlexRow"]}
@@ -1,19 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __copyProps = (to, from, except, desc) => {
7
- if (from && typeof from === "object" || typeof from === "function") {
8
- for (let key of __getOwnPropNames(from))
9
- if (!__hasOwnProp.call(to, key) && key !== except)
10
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
11
- }
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
15
-
16
- // src/components/Props.tsx
17
- var Props_exports = {};
18
- module.exports = __toCommonJS(Props_exports);
19
- //# sourceMappingURL=Props.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/Props.tsx"],"sourcesContent":["import { PaperProps } from '@mui/material'\nimport { FlexBoxProps } from '@xylabs/react-flexbox'\nimport { SizeProp } from '@xyo-network/react-shared'\nimport { ReactNode } from 'react'\n\nimport { PropertyAction } from './Action'\nimport { PropertyTitleProps } from './Title'\n\nexport interface PropertyBaseProps {\n paper?: boolean\n tip?: ReactNode\n title?: string\n titleProps?: PropertyTitleProps\n}\n\nexport type PropertyFieldBaseProps = PropertyBaseProps & {\n actions?: PropertyAction[]\n badge?: boolean\n required?: boolean\n size?: SizeProp\n value?: string | number | boolean | null\n}\n\nexport type PropertyBoxProps = PropertyFieldBaseProps &\n FlexBoxProps & {\n paper?: false\n }\n\nexport type PropertyPaperProps = PropertyFieldBaseProps &\n PaperProps & {\n paper: true\n }\n\nexport type PropertyProps = PropertyBoxProps | PropertyPaperProps\n\nexport type PropertyGroupBaseProps = PropertyBaseProps\n\nexport type PropertyGroupBoxProps = PropertyGroupBaseProps &\n FlexBoxProps & {\n paper?: false\n }\n\nexport type PropertyGroupPaperProps = PropertyGroupBaseProps &\n PaperProps & {\n paper: true\n }\n\nexport type PropertyGroupProps = PropertyGroupBoxProps | PropertyGroupPaperProps\n"],"mappings":";;;;;;;;;;;;;;;;AAAA;AAAA;","names":[]}
@@ -1 +0,0 @@
1
- //# sourceMappingURL=Props.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
@@ -1,73 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/components/Title.tsx
21
- var Title_exports = {};
22
- __export(Title_exports, {
23
- PropertyTitle: () => PropertyTitle
24
- });
25
- module.exports = __toCommonJS(Title_exports);
26
- var import_material = require("@mui/material");
27
- var import_react_flexbox = require("@xylabs/react-flexbox");
28
- var import_react_quick_tip_button = require("@xylabs/react-quick-tip-button");
29
- var import_jsx_runtime = require("react/jsx-runtime");
30
- var PropertyTitle = ({ elevation = 1, size = "medium", tip, more, title, ...props }) => {
31
- const sizeVariants = {
32
- full: "caption",
33
- large: "caption",
34
- medium: "caption",
35
- small: "caption"
36
- };
37
- const sizeTitleHeight = {
38
- full: void 0,
39
- large: 32,
40
- medium: 20,
41
- small: 16
42
- };
43
- const sizeFontSize = {
44
- full: 16,
45
- large: 16,
46
- medium: 14,
47
- small: 10
48
- };
49
- const quickTipSize = sizeFontSize[size] < 16 ? sizeFontSize[size] : 16;
50
- const theme = (0, import_material.useTheme)();
51
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
52
- import_react_flexbox.FlexRow,
53
- {
54
- bgcolor: theme.palette.mode === "dark" ? (0, import_material.lighten)(theme.palette.background.paper, 0.05 * elevation) : (0, import_material.darken)(theme.palette.background.paper, 0.025 * elevation),
55
- alignItems: "center",
56
- height: sizeTitleHeight[size],
57
- justifyContent: "space-between",
58
- ...props,
59
- children: [
60
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_flexbox.FlexRow, { paddingX: 1, paddingY: 0.5, children: [
61
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { fontWeight: 500, noWrap: true, variant: sizeVariants[size], fontSize: sizeFontSize[size], children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("small", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: title }) }) }),
62
- tip ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_quick_tip_button.QuickTipButton, { style: { fontSize: quickTipSize }, color: "inherit", title: title ?? "", children: tip }) : null
63
- ] }),
64
- more
65
- ]
66
- }
67
- );
68
- };
69
- // Annotate the CommonJS export names for ESM import in node:
70
- 0 && (module.exports = {
71
- PropertyTitle
72
- });
73
- //# sourceMappingURL=Title.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/Title.tsx"],"sourcesContent":["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"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,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;","names":[]}
@@ -1,48 +0,0 @@
1
- // src/components/Title.tsx
2
- import { darken, lighten, Typography, useTheme } from "@mui/material";
3
- import { FlexRow } from "@xylabs/react-flexbox";
4
- import { QuickTipButton } from "@xylabs/react-quick-tip-button";
5
- import { jsx, jsxs } from "react/jsx-runtime";
6
- var PropertyTitle = ({ elevation = 1, size = "medium", tip, more, title, ...props }) => {
7
- const sizeVariants = {
8
- full: "caption",
9
- large: "caption",
10
- medium: "caption",
11
- small: "caption"
12
- };
13
- const sizeTitleHeight = {
14
- full: void 0,
15
- large: 32,
16
- medium: 20,
17
- small: 16
18
- };
19
- const sizeFontSize = {
20
- full: 16,
21
- large: 16,
22
- medium: 14,
23
- small: 10
24
- };
25
- const quickTipSize = sizeFontSize[size] < 16 ? sizeFontSize[size] : 16;
26
- const theme = useTheme();
27
- return /* @__PURE__ */ jsxs(
28
- FlexRow,
29
- {
30
- bgcolor: theme.palette.mode === "dark" ? lighten(theme.palette.background.paper, 0.05 * elevation) : darken(theme.palette.background.paper, 0.025 * elevation),
31
- alignItems: "center",
32
- height: sizeTitleHeight[size],
33
- justifyContent: "space-between",
34
- ...props,
35
- children: [
36
- /* @__PURE__ */ jsxs(FlexRow, { paddingX: 1, paddingY: 0.5, children: [
37
- /* @__PURE__ */ jsx(Typography, { fontWeight: 500, noWrap: true, variant: sizeVariants[size], fontSize: sizeFontSize[size], children: /* @__PURE__ */ jsx("small", { children: /* @__PURE__ */ jsx("strong", { children: title }) }) }),
38
- tip ? /* @__PURE__ */ jsx(QuickTipButton, { style: { fontSize: quickTipSize }, color: "inherit", title: title ?? "", children: tip }) : null
39
- ] }),
40
- more
41
- ]
42
- }
43
- );
44
- };
45
- export {
46
- PropertyTitle
47
- };
48
- //# sourceMappingURL=Title.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/Title.tsx"],"sourcesContent":["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"],"mappings":";AAAA,SAAS,QAAQ,SAAS,YAA+B,gBAAgB;AACzE,SAAuB,eAAe;AACtC,SAAS,sBAAsB;AAoDzB,SAGM,KAHN;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,QAAQ,SAAS;AAEvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SACE,MAAM,QAAQ,SAAS,SACnB,QAAQ,MAAM,QAAQ,WAAW,OAAO,OAAO,SAAS,IACxD,OAAO,MAAM,QAAQ,WAAW,OAAO,QAAQ,SAAS;AAAA,MAE9D,YAAW;AAAA,MACX,QAAQ,gBAAgB,IAAI;AAAA,MAC5B,gBAAe;AAAA,MACd,GAAG;AAAA,MAEJ;AAAA,6BAAC,WAAQ,UAAU,GAAG,UAAU,KAC9B;AAAA,8BAAC,cAAW,YAAY,KAAK,QAAM,MAAC,SAAS,aAAa,IAAI,GAAG,UAAU,aAAa,IAAI,GAC1F,8BAAC,WACC,8BAAC,YAAQ,iBAAM,GACjB,GACF;AAAA,UACC,MACC,oBAAC,kBAAe,OAAO,EAAE,UAAU,aAAa,GAAG,OAAM,WAAU,OAAO,SAAS,IAChF,eACH,IACE;AAAA,WACN;AAAA,QACC;AAAA;AAAA;AAAA,EACH;AAEJ;","names":[]}
@@ -1,37 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/components/Value.tsx
21
- var Value_exports = {};
22
- __export(Value_exports, {
23
- PropertyValue: () => PropertyValue
24
- });
25
- module.exports = __toCommonJS(Value_exports);
26
- var import_react_shared = require("@xyo-network/react-shared");
27
- var import_react = require("react");
28
- var import_jsx_runtime = require("react/jsx-runtime");
29
- var PropertyValue = (0, import_react.forwardRef)(({ typographyVariant = "body1", value, ...props }, ref) => {
30
- return value !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_shared.EllipsizeBox, { typographyProps: { component: void 0, title: value == null ? void 0 : value.toString(), variant: typographyVariant }, width: "100%", ref, ...props, children: value }) : null;
31
- });
32
- PropertyValue.displayName = "PropertyValue";
33
- // Annotate the CommonJS export names for ESM import in node:
34
- 0 && (module.exports = {
35
- PropertyValue
36
- });
37
- //# sourceMappingURL=Value.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/Value.tsx"],"sourcesContent":["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;AACA,0BAAgD;AAChD,mBAA2B;AASvB;AAFG,IAAM,oBAAgB,yBAA+C,CAAC,EAAE,oBAAoB,SAAS,OAAO,GAAG,MAAM,GAAG,QAAQ;AACrI,SAAO,UAAU,SACf,4CAAC,oCAAa,iBAAiB,EAAE,WAAW,QAAW,OAAO,+BAAO,YAAY,SAAS,kBAAkB,GAAG,OAAM,QAAO,KAAW,GAAG,OACvI,iBACH,IACE;AACN,CAAC;AAED,cAAc,cAAc;","names":[]}
@@ -1,12 +0,0 @@
1
- // src/components/Value.tsx
2
- import { EllipsizeBox } from "@xyo-network/react-shared";
3
- import { forwardRef } from "react";
4
- import { jsx } from "react/jsx-runtime";
5
- var PropertyValue = forwardRef(({ typographyVariant = "body1", value, ...props }, ref) => {
6
- return value !== void 0 ? /* @__PURE__ */ jsx(EllipsizeBox, { typographyProps: { component: void 0, title: value == null ? void 0 : value.toString(), variant: typographyVariant }, width: "100%", ref, ...props, children: value }) : null;
7
- });
8
- PropertyValue.displayName = "PropertyValue";
9
- export {
10
- PropertyValue
11
- };
12
- //# sourceMappingURL=Value.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/components/Value.tsx"],"sourcesContent":["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":";AACA,SAAS,oBAAuC;AAChD,SAAS,kBAAkB;AASvB;AAFG,IAAM,gBAAgB,WAA+C,CAAC,EAAE,oBAAoB,SAAS,OAAO,GAAG,MAAM,GAAG,QAAQ;AACrI,SAAO,UAAU,SACf,oBAAC,gBAAa,iBAAiB,EAAE,WAAW,QAAW,OAAO,+BAAO,YAAY,SAAS,kBAAkB,GAAG,OAAM,QAAO,KAAW,GAAG,OACvI,iBACH,IACE;AACN,CAAC;AAED,cAAc,cAAc;","names":[]}