@xyo-network/react-os 3.0.2 → 3.0.4
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.
- package/dist/browser/components/Profile/Profile.d.ts +8 -0
- package/dist/browser/components/Profile/Profile.d.ts.map +1 -0
- package/dist/browser/components/Profile/StatsModal.d.ts +3 -0
- package/dist/browser/components/Profile/StatsModal.d.ts.map +1 -0
- package/dist/browser/components/Profile/index.d.ts +2 -0
- package/dist/browser/components/Profile/index.d.ts.map +1 -0
- package/dist/browser/components/TestComponent.d.ts +6 -0
- package/dist/browser/components/TestComponent.d.ts.map +1 -0
- package/dist/browser/components/XyOsClock/XyOsClock.d.ts +18 -0
- package/dist/browser/components/XyOsClock/XyOsClock.d.ts.map +1 -0
- package/dist/browser/components/XyOsClock/index.d.ts +2 -0
- package/dist/browser/components/XyOsClock/index.d.ts.map +1 -0
- package/dist/browser/components/index.d.ts +2 -0
- package/dist/browser/components/index.d.ts.map +1 -0
- package/dist/browser/index.d.ts +2 -7
- package/dist/browser/index.d.ts.map +1 -0
- package/package.json +50 -45
- package/src/components/Profile/Profile.stories.tsx +2 -8
- package/src/components/Profile/Profile.tsx +24 -7
- package/src/components/Profile/StatsModal.tsx +6 -7
- package/src/components/TestComponent.stories.tsx +1 -3
- package/src/components/XyOsClock/XyOsClock.stories.tsx +2 -8
- package/src/components/XyOsClock/XyOsClock.tsx +3 -1
- package/xy.config.ts +1 -3
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { PaperProps } from '@mui/material';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
export interface XyOsProfileProps extends PaperProps {
|
|
4
|
+
pfp: string;
|
|
5
|
+
xns: string;
|
|
6
|
+
}
|
|
7
|
+
export declare const XyOsProfile: React.FC<XyOsProfileProps>;
|
|
8
|
+
//# sourceMappingURL=Profile.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Profile.d.ts","sourceRoot":"","sources":["../../../../src/components/Profile/Profile.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAM/C,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,MAAM,WAAW,gBAAiB,SAAQ,UAAU;IAClD,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;CACZ;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAkElD,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StatsModal.d.ts","sourceRoot":"","sources":["../../../../src/components/Profile/StatsModal.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAS9B,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAiC9B,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Profile/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TestComponent.d.ts","sourceRoot":"","sources":["../../../src/components/TestComponent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAC9C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,WAAW,kBAAmB,SAAQ,iBAAiB;CAAG;AAEhE,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAEtD,CAAA"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import type { BoxProps } from '@mui/material';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
interface ClockProps extends BoxProps {
|
|
4
|
+
date: number;
|
|
5
|
+
}
|
|
6
|
+
export interface XyOsClockProps {
|
|
7
|
+
clockSize: 'small' | 'medium' | 'large';
|
|
8
|
+
clockType: 'appbar' | 'widget';
|
|
9
|
+
}
|
|
10
|
+
export declare const XyOsClock: React.FC<XyOsClockProps>;
|
|
11
|
+
export declare const SmallAppBarClock: React.FC<ClockProps>;
|
|
12
|
+
export declare const MediumAppBarClock: React.FC<ClockProps>;
|
|
13
|
+
export declare const LargeAppBarClock: React.FC<ClockProps>;
|
|
14
|
+
export declare const SmallWidgetClock: React.FC<ClockProps>;
|
|
15
|
+
export declare const MediumWidgetClock: React.FC<ClockProps>;
|
|
16
|
+
export declare const LargeWidgetClock: React.FC<ClockProps>;
|
|
17
|
+
export {};
|
|
18
|
+
//# sourceMappingURL=XyOsClock.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"XyOsClock.d.ts","sourceRoot":"","sources":["../../../../src/components/XyOsClock/XyOsClock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAK7C,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,UAAU,UAAW,SAAQ,QAAQ;IACnC,IAAI,EAAE,MAAM,CAAA;CACb;AAaD,MAAM,WAAW,cAAc;IAC7B,SAAS,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACvC,SAAS,EAAE,QAAQ,GAAG,QAAQ,CAAA;CAC/B;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA8B9C,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAOjD,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAOlD,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAOjD,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CASjD,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CASlD,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAUjD,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/XyOsClock/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAA"}
|
package/dist/browser/index.d.ts
CHANGED
|
@@ -1,7 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
interface TestComponentProps extends PropsWithChildren {
|
|
4
|
-
}
|
|
5
|
-
declare const TestComponent: React.FC<TestComponentProps>;
|
|
6
|
-
|
|
7
|
-
export { TestComponent, type TestComponentProps };
|
|
1
|
+
export * from './components/index.ts';
|
|
2
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,34 +1,30 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xyo-network/react-os",
|
|
3
|
-
"
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
"
|
|
7
|
-
|
|
3
|
+
"version": "3.0.4",
|
|
4
|
+
"description": "Common React library for all XYO projects that use React",
|
|
5
|
+
"keywords": [
|
|
6
|
+
"xyo",
|
|
7
|
+
"utility",
|
|
8
|
+
"typescript",
|
|
9
|
+
"react"
|
|
10
|
+
],
|
|
11
|
+
"homepage": "https://xyo.network",
|
|
8
12
|
"bugs": {
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
-
},
|
|
12
|
-
"dependencies": {
|
|
13
|
-
"@mui/icons-material": "^5.16.7",
|
|
14
|
-
"@xylabs/react-flexbox": "^4.0.3",
|
|
15
|
-
"date-fns": "^3.6.0"
|
|
13
|
+
"url": "git+https://github.com/XYOracleNetwork/sdk-xyo-react-js/issues",
|
|
14
|
+
"email": "support@xyo.network"
|
|
16
15
|
},
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"react": "^18",
|
|
21
|
-
"react-dom": "^18"
|
|
16
|
+
"repository": {
|
|
17
|
+
"type": "git",
|
|
18
|
+
"url": "git+https://github.com/XYOracleNetwork/sdk-xyo-react-js.git"
|
|
22
19
|
},
|
|
23
|
-
"
|
|
24
|
-
|
|
25
|
-
"
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
"typescript": "^5.5.4"
|
|
20
|
+
"license": "LGPL-3.0-only",
|
|
21
|
+
"author": {
|
|
22
|
+
"name": "XYO Development Team",
|
|
23
|
+
"email": "support@xyo.network",
|
|
24
|
+
"url": "https://xyo.network"
|
|
29
25
|
},
|
|
30
|
-
"
|
|
31
|
-
"
|
|
26
|
+
"sideEffects": false,
|
|
27
|
+
"type": "module",
|
|
32
28
|
"exports": {
|
|
33
29
|
".": {
|
|
34
30
|
"import": {
|
|
@@ -41,27 +37,36 @@
|
|
|
41
37
|
"./package.json": "./package.json"
|
|
42
38
|
},
|
|
43
39
|
"module": "dist/browser/index.mjs",
|
|
44
|
-
"
|
|
45
|
-
"
|
|
46
|
-
"
|
|
47
|
-
"
|
|
48
|
-
"typescript",
|
|
49
|
-
"react"
|
|
50
|
-
],
|
|
51
|
-
"license": "LGPL-3.0-only",
|
|
52
|
-
"publishConfig": {
|
|
53
|
-
"access": "public"
|
|
40
|
+
"types": "dist/browser/index.d.ts",
|
|
41
|
+
"scripts": {
|
|
42
|
+
"license": "yarn license-checker --exclude \"MIT, ISC, Apache-2.0, BSD, BSD-2-Clause, CC-BY-4.0, Unlicense, CC-BY-3.0, CC0-1.0\"",
|
|
43
|
+
"lint-pkg": "npmPkgJsonLint ."
|
|
54
44
|
},
|
|
55
|
-
"
|
|
56
|
-
"
|
|
57
|
-
"
|
|
45
|
+
"dependencies": {
|
|
46
|
+
"@mui/icons-material": "^5.16.7",
|
|
47
|
+
"@xylabs/react-flexbox": "^4.0.3",
|
|
48
|
+
"date-fns": "^3.6.0"
|
|
58
49
|
},
|
|
59
|
-
"
|
|
60
|
-
"
|
|
61
|
-
"
|
|
50
|
+
"devDependencies": {
|
|
51
|
+
"@mui/material": "^5.16.7",
|
|
52
|
+
"@mui/styles": "^5.16.7",
|
|
53
|
+
"@storybook/react": "^8.2.9",
|
|
54
|
+
"@xylabs/ts-scripts-yarn3": "^4.0.7",
|
|
55
|
+
"@xylabs/tsconfig-react": "^4.0.7",
|
|
56
|
+
"react": "^18.3.1",
|
|
57
|
+
"react-dom": "^18.3.1",
|
|
58
|
+
"react-router-dom": "^6.26.1",
|
|
59
|
+
"storybook": "^8.2.9",
|
|
60
|
+
"typescript": "^5.5.4"
|
|
62
61
|
},
|
|
63
|
-
"
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
62
|
+
"peerDependencies": {
|
|
63
|
+
"@mui/material": "^5",
|
|
64
|
+
"@mui/styles": "^5",
|
|
65
|
+
"react": "^18",
|
|
66
|
+
"react-dom": "^18"
|
|
67
|
+
},
|
|
68
|
+
"publishConfig": {
|
|
69
|
+
"access": "public"
|
|
70
|
+
},
|
|
71
|
+
"docs": "dist/docs.json"
|
|
67
72
|
}
|
|
@@ -6,11 +6,7 @@ import { XyOsProfile } from './Profile.tsx'
|
|
|
6
6
|
const StorybookEntry = {
|
|
7
7
|
argTypes: {},
|
|
8
8
|
component: XyOsProfile,
|
|
9
|
-
parameters: {
|
|
10
|
-
docs: {
|
|
11
|
-
page: null,
|
|
12
|
-
},
|
|
13
|
-
},
|
|
9
|
+
parameters: { docs: { page: null } },
|
|
14
10
|
title: 'shared/XyOsProfile',
|
|
15
11
|
} as Meta<typeof XyOsProfile>
|
|
16
12
|
|
|
@@ -21,9 +17,7 @@ const Template: StoryFn<typeof XyOsProfile> = args => (
|
|
|
21
17
|
)
|
|
22
18
|
|
|
23
19
|
const Default = Template.bind({})
|
|
24
|
-
Default.args = {
|
|
25
|
-
xns: '@arietrouw',
|
|
26
|
-
}
|
|
20
|
+
Default.args = { xns: '@arietrouw' }
|
|
27
21
|
|
|
28
22
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
29
23
|
// @ts-ignore
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import type { PaperProps } from '@mui/material'
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
Avatar, Divider, Paper, Typography, useTheme,
|
|
4
|
+
} from '@mui/material'
|
|
3
5
|
import { FlexGrowCol, FlexGrowRow } from '@xylabs/react-flexbox'
|
|
4
6
|
import { format, subHours } from 'date-fns'
|
|
5
7
|
import React from 'react'
|
|
@@ -10,13 +12,16 @@ export interface XyOsProfileProps extends PaperProps {
|
|
|
10
12
|
xns: string
|
|
11
13
|
}
|
|
12
14
|
|
|
13
|
-
|
|
14
|
-
export const XyOsProfile: React.FC<XyOsProfileProps> = ({ xns, pfp, ...props }) => {
|
|
15
|
+
export const XyOsProfile: React.FC<XyOsProfileProps> = ({ xns }) => {
|
|
15
16
|
const theme = useTheme()
|
|
16
17
|
return (
|
|
17
18
|
<FlexGrowCol gap={1} alignItems="flex-start">
|
|
18
19
|
<FlexGrowRow gap={1}>
|
|
19
|
-
<Avatar
|
|
20
|
+
<Avatar
|
|
21
|
+
alt={xns}
|
|
22
|
+
src="https://arietrouw.com/assets/img/arie.jpg"
|
|
23
|
+
sx={{ height: 100, width: 100 }}
|
|
24
|
+
/>
|
|
20
25
|
<FlexGrowCol width="100%" alignItems="flex-start">
|
|
21
26
|
<Typography variant="h5">{xns}</Typography>
|
|
22
27
|
<Typography variant="subtitle2">
|
|
@@ -54,9 +59,21 @@ export const XyOsProfile: React.FC<XyOsProfileProps> = ({ xns, pfp, ...props })
|
|
|
54
59
|
Badges
|
|
55
60
|
</Typography>
|
|
56
61
|
<FlexGrowRow justifyContent="flex-start" width="100%" gap={1}>
|
|
57
|
-
<Avatar sx={{
|
|
58
|
-
|
|
59
|
-
|
|
62
|
+
<Avatar sx={{
|
|
63
|
+
color: theme.palette.primary.main, height: 50, width: 50,
|
|
64
|
+
}}
|
|
65
|
+
>
|
|
66
|
+
</Avatar>
|
|
67
|
+
<Avatar sx={{
|
|
68
|
+
color: theme.palette.primary.main, height: 50, width: 50,
|
|
69
|
+
}}
|
|
70
|
+
>
|
|
71
|
+
</Avatar>
|
|
72
|
+
<Avatar sx={{
|
|
73
|
+
color: theme.palette.primary.main, height: 50, width: 50,
|
|
74
|
+
}}
|
|
75
|
+
>
|
|
76
|
+
</Avatar>
|
|
60
77
|
</FlexGrowRow>
|
|
61
78
|
</Paper>
|
|
62
79
|
</FlexGrowCol>
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { ArrowForwardRounded } from '@mui/icons-material'
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
Avatar, Backdrop, Box, Fade, IconButton, Modal, Typography,
|
|
4
|
+
} from '@mui/material'
|
|
3
5
|
import { FlexGrowCol } from '@xylabs/react-flexbox'
|
|
4
6
|
import * as React from 'react'
|
|
5
7
|
|
|
@@ -27,16 +29,13 @@ export const StatsModal: React.FC = () => {
|
|
|
27
29
|
onClose={handleClose}
|
|
28
30
|
closeAfterTransition
|
|
29
31
|
slots={{ backdrop: Backdrop }}
|
|
30
|
-
slotProps={{
|
|
31
|
-
backdrop: {
|
|
32
|
-
timeout: 500,
|
|
33
|
-
},
|
|
34
|
-
}}
|
|
32
|
+
slotProps={{ backdrop: { timeout: 500 } }}
|
|
35
33
|
>
|
|
36
34
|
<Fade in={open}>
|
|
37
35
|
<Box sx={style}>
|
|
38
36
|
<FlexGrowCol alignItems="center">
|
|
39
|
-
<Avatar sx={{ height: '200px', width: '200px' }}
|
|
37
|
+
<Avatar sx={{ height: '200px', width: '200px' }}>
|
|
38
|
+
</Avatar>
|
|
40
39
|
<Typography id="transition-modal-description" align="center" sx={{ mt: 2 }}>
|
|
41
40
|
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
|
|
42
41
|
</Typography>
|
|
@@ -4,9 +4,7 @@ import React from 'react'
|
|
|
4
4
|
import type { TestComponentProps } from './TestComponent.tsx'
|
|
5
5
|
import { TestComponent } from './TestComponent.tsx'
|
|
6
6
|
|
|
7
|
-
export default {
|
|
8
|
-
title: 'modules/os/TestComponent',
|
|
9
|
-
} as Meta
|
|
7
|
+
export default { title: 'modules/os/TestComponent' } as Meta
|
|
10
8
|
|
|
11
9
|
const Template: StoryFn<React.FC<TestComponentProps>> = (props) => {
|
|
12
10
|
return <TestComponent {...props} />
|
|
@@ -7,11 +7,7 @@ import { XyOsClock } from './XyOsClock.tsx'
|
|
|
7
7
|
const StorybookEntry = {
|
|
8
8
|
argTypes: {},
|
|
9
9
|
component: XyOsClock,
|
|
10
|
-
parameters: {
|
|
11
|
-
docs: {
|
|
12
|
-
page: null,
|
|
13
|
-
},
|
|
14
|
-
},
|
|
10
|
+
parameters: { docs: { page: null } },
|
|
15
11
|
title: 'shared/XyOsClock',
|
|
16
12
|
} as Meta<typeof XyOsClock>
|
|
17
13
|
|
|
@@ -26,9 +22,7 @@ const Template: StoryFn<typeof XyOsClock> = args => (
|
|
|
26
22
|
)
|
|
27
23
|
|
|
28
24
|
const Default = Template.bind({})
|
|
29
|
-
Default.args = {
|
|
30
|
-
clockType: 'appbar',
|
|
31
|
-
}
|
|
25
|
+
Default.args = { clockType: 'appbar' }
|
|
32
26
|
|
|
33
27
|
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
34
28
|
// @ts-ignore
|
|
@@ -25,7 +25,9 @@ export interface XyOsClockProps {
|
|
|
25
25
|
clockType: 'appbar' | 'widget'
|
|
26
26
|
}
|
|
27
27
|
|
|
28
|
-
export const XyOsClock: React.FC<XyOsClockProps> = ({
|
|
28
|
+
export const XyOsClock: React.FC<XyOsClockProps> = ({
|
|
29
|
+
clockType, clockSize, ...props
|
|
30
|
+
}) => {
|
|
29
31
|
const [date, setDate] = useState(Date.now())
|
|
30
32
|
useEffect(() => {
|
|
31
33
|
const timerHandler: TimerHandler = () => setDate(Date.now())
|