@yogiswara/honcho-editor-ui 3.6.9 → 3.6.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.
@@ -23,7 +23,7 @@ export default function HImageEditorSkeleton(props) {
23
23
  transform: 'scale(0.92)',
24
24
  },
25
25
  transition: 'transform 0.1s ease-in-out',
26
- }, children: _jsx(CardMedia, { title: "back", src: "svg/Back.svg", component: "img" }) }) }), _jsx(Stack, { direction: "row", justifyContent: "flex-end", alignItems: "center", spacing: 0.1, sx: { pt: !isMobile ? "0px" : "2px", pr: isMobile ? "10px" : "6px" }, children: _jsx(Skeleton, { variant: "rounded", width: "110px", height: "18px",
26
+ }, children: _jsx(CardMedia, { title: "back", src: "svg/Back.svg", component: "img" }) }) }), _jsx(Stack, { direction: "row", justifyContent: "flex-end", alignItems: "center", spacing: 0.1, sx: { pt: !isMobile ? "0px" : "2px", pr: isMobile ? "10px" : "10px" }, children: _jsx(Skeleton, { variant: "rounded", width: "110px", height: "18px",
27
27
  // animation="wave"
28
28
  sx: {
29
29
  bgcolor: alpha(colors.background, 0.1),
@@ -36,21 +36,22 @@ export default function HImageEditorSkeleton(props) {
36
36
  p: isMobile ? 2 : 4,
37
37
  } }), !isMobile && (_jsx(Paper, { elevation: 3, sx: {
38
38
  position: 'inherit',
39
- right: '40px',
39
+ right: '50px',
40
40
  top: '55px',
41
- width: '272px',
41
+ width: '320px',
42
42
  pt: '4px',
43
+ pl: '38px',
43
44
  height: 'calc(100vh - 70px)',
44
45
  zIndex: 1200,
45
46
  backgroundColor: '#000000',
46
47
  overflow: 'hidden',
47
- }, children: _jsxs(Stack, { direction: "row", sx: { height: '100%', p: "0px" }, children: [_jsxs(Stack, { direction: "column", sx: { height: '95%' }, children: [_jsx(Box, { sx: { display: 'flex', flexDirection: 'column', p: "0px", pt: "8px" }, children: _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', py: "6px", gap: "8px" }, children: [_jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.1), } }), _jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.07), } })] }) }), _jsx(Box, { sx: { display: 'flex', flexDirection: 'column', p: "0px", pt: "8px" }, children: _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', py: "6px", gap: "8px" }, children: [_jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.1), } }), _jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.07), } })] }) }), _jsx(Box, { sx: { display: 'flex', flexDirection: 'column', p: "0px", pt: "8px" }, children: _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', py: "6px", gap: "8px" }, children: [_jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.1), } }), _jsx(Skeleton, { variant: "rounded", width: "198px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.07), } })] }) })] }), _jsxs(Stack, { justifyContent: "flex-start",
48
+ }, children: _jsxs(Stack, { direction: "row", sx: { height: '100%', p: "0px" }, children: [_jsxs(Stack, { direction: "column", sx: { height: '95%' }, children: [_jsx(Box, { sx: { display: 'flex', flexDirection: 'column', p: "0px", pt: "8px" }, children: _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', py: "6px", gap: "8px" }, children: [_jsx(Skeleton, { variant: "rounded", width: "200px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.1), } }), _jsx(Skeleton, { variant: "rounded", width: "200px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.07), } })] }) }), _jsx(Box, { sx: { display: 'flex', flexDirection: 'column', p: "0px", pt: "8px" }, children: _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', py: "6px", gap: "8px" }, children: [_jsx(Skeleton, { variant: "rounded", width: "200px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.1), } }), _jsx(Skeleton, { variant: "rounded", width: "200px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.07), } })] }) }), _jsx(Box, { sx: { display: 'flex', flexDirection: 'column', p: "0px", pt: "8px" }, children: _jsxs(Box, { sx: { display: 'flex', flexDirection: 'column', py: "6px", gap: "8px" }, children: [_jsx(Skeleton, { variant: "rounded", width: "200px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.1), } }), _jsx(Skeleton, { variant: "rounded", width: "200px", height: "18px", sx: { bgcolor: alpha(colors.background, 0.07), } })] }) })] }), _jsxs(Stack, { justifyContent: "flex-start",
48
49
  // spacing={"15px"}
49
50
  sx: {
50
51
  // width: '10px',
51
52
  flexShrink: 0,
52
53
  pt: "0px",
53
- pl: "8px",
54
+ pl: "12px",
54
55
  }, children: [_jsx(Box, { sx: {
55
56
  width: "50px",
56
57
  height: "48px",
@@ -74,12 +75,12 @@ export default function HImageEditorSkeleton(props) {
74
75
  zIndex: 1300,
75
76
  backgroundColor: 'transparent',
76
77
  }, children: _jsxs(Paper, { sx: { backgroundColor: colors.onBackground, borderRadius: "0px" }, elevation: 3, children: [_jsx(Stack, { direction: "row", justifyContent: "center", alignItems: "center", sx: {
77
- py: "12px",
78
+ py: "28px",
78
79
  pt: "110px",
79
80
  // px: "143px",
80
81
  gap: "10px"
81
82
  }, children: _jsx(Skeleton, { variant: "rounded", width: "260px", height: 18, sx: { bgcolor: alpha(colors.background, 0.1), } }) }), _jsx(Stack, { direction: "row", justifyContent: "center", alignItems: "center", sx: {
82
- pt: "24px",
83
+ pt: "20px",
83
84
  pb: "16px",
84
85
  px: "16px",
85
86
  gap: "24px"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yogiswara/honcho-editor-ui",
3
- "version": "3.6.9",
3
+ "version": "3.6.10",
4
4
  "description": "A complete UI component library for the Honcho photo editor.",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",