react-electronix 1.0.11 → 2.1.0
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/README.md +119 -27
- package/dist/cjs/components/Galaxy/Galaxy.d.ts +3 -0
- package/dist/cjs/components/Galaxy/Galaxy.js +21 -0
- package/dist/cjs/components/Galaxy/Galaxy.js.map +1 -0
- package/dist/cjs/components/Galaxy/Galaxy.props.d.ts +7 -0
- package/dist/cjs/components/Galaxy/Galaxy.props.js +3 -0
- package/dist/cjs/components/Galaxy/Galaxy.props.js.map +1 -0
- package/dist/cjs/components/Galaxy/Galaxy.style.d.ts +90 -0
- package/dist/cjs/components/Galaxy/Galaxy.style.js +165 -0
- package/dist/cjs/components/Galaxy/Galaxy.style.js.map +1 -0
- package/dist/cjs/components/Galaxy/index.d.ts +2 -0
- package/dist/cjs/components/Galaxy/index.js +6 -0
- package/dist/cjs/components/Galaxy/index.js.map +1 -0
- package/dist/cjs/components/IMac/IMac.d.ts +3 -0
- package/dist/cjs/components/IMac/IMac.js +22 -0
- package/dist/cjs/components/IMac/IMac.js.map +1 -0
- package/dist/cjs/components/IMac/IMac.props.d.ts +7 -0
- package/dist/cjs/components/IMac/IMac.props.js +3 -0
- package/dist/cjs/components/IMac/IMac.props.js.map +1 -0
- package/dist/cjs/components/IMac/IMac.styles.d.ts +7 -0
- package/dist/cjs/components/IMac/IMac.styles.js +139 -0
- package/dist/cjs/components/IMac/IMac.styles.js.map +1 -0
- package/dist/cjs/components/IMac/index.d.ts +2 -0
- package/dist/cjs/components/IMac/index.js +6 -0
- package/dist/cjs/components/IMac/index.js.map +1 -0
- package/dist/cjs/components/IPad/IPad.d.ts +3 -0
- package/dist/cjs/components/IPad/IPad.js +21 -0
- package/dist/cjs/components/IPad/IPad.js.map +1 -0
- package/dist/cjs/components/IPad/IPad.props.d.ts +9 -0
- package/dist/cjs/components/IPad/IPad.props.js +3 -0
- package/dist/cjs/components/IPad/IPad.props.js.map +1 -0
- package/dist/cjs/components/IPad/IPad.style.d.ts +105 -0
- package/dist/cjs/components/IPad/IPad.style.js +139 -0
- package/dist/cjs/components/IPad/IPad.style.js.map +1 -0
- package/dist/cjs/components/IPad/index.d.ts +2 -0
- package/dist/cjs/components/IPad/index.js +6 -0
- package/dist/cjs/components/IPad/index.js.map +1 -0
- package/dist/cjs/components/Iphone/Iphone.d.ts +1 -1
- package/dist/cjs/components/Iphone/Iphone.js +13 -13
- package/dist/cjs/components/Iphone/Iphone.js.map +1 -1
- package/dist/cjs/components/Iphone/Iphone.props.d.ts +4 -1
- package/dist/cjs/components/Iphone/Iphone.props.js +1 -1
- package/dist/cjs/components/Iphone/Iphone.props.js.map +0 -0
- package/dist/cjs/components/Iphone/Iphone.style.d.ts +9 -1
- package/dist/cjs/components/Iphone/Iphone.style.js +84 -20
- package/dist/cjs/components/Iphone/Iphone.style.js.map +1 -1
- package/dist/cjs/components/Iphone/index.d.ts +0 -0
- package/dist/cjs/components/Iphone/index.js +1 -1
- package/dist/cjs/components/Iphone/index.js.map +0 -0
- package/dist/cjs/components/Mac/Mac.d.ts +0 -0
- package/dist/cjs/components/Mac/Mac.js +18 -18
- package/dist/cjs/components/Mac/Mac.js.map +1 -1
- package/dist/cjs/components/Mac/Mac.props.d.ts +0 -0
- package/dist/cjs/components/Mac/Mac.props.js +1 -1
- package/dist/cjs/components/Mac/Mac.props.js.map +0 -0
- package/dist/cjs/components/Mac/Mac.styles.d.ts +0 -0
- package/dist/cjs/components/Mac/Mac.styles.js +6 -6
- package/dist/cjs/components/Mac/Mac.styles.js.map +0 -0
- package/dist/cjs/components/Mac/components/Startup/Startup.d.ts +0 -0
- package/dist/cjs/components/Mac/components/Startup/Startup.js +5 -5
- package/dist/cjs/components/Mac/components/Startup/Startup.js.map +1 -1
- package/dist/cjs/components/Mac/components/Startup/Startup.props.d.ts +0 -0
- package/dist/cjs/components/Mac/components/Startup/Startup.props.js +1 -1
- package/dist/cjs/components/Mac/components/Startup/Startup.props.js.map +0 -0
- package/dist/cjs/components/Mac/components/Startup/Startup.style.d.ts +0 -0
- package/dist/cjs/components/Mac/components/Startup/Startup.style.js +1 -1
- package/dist/cjs/components/Mac/components/Startup/Startup.style.js.map +0 -0
- package/dist/cjs/components/Mac/components/Startup/index.d.ts +0 -0
- package/dist/cjs/components/Mac/components/Startup/index.js +1 -1
- package/dist/cjs/components/Mac/components/Startup/index.js.map +0 -0
- package/dist/cjs/components/Mac/index.d.ts +0 -1
- package/dist/cjs/components/Mac/index.js +1 -2
- package/dist/cjs/components/Mac/index.js.map +1 -1
- package/dist/cjs/components/MacbookPro/MacbookPro.d.ts +3 -0
- package/dist/cjs/components/MacbookPro/MacbookPro.js +41 -0
- package/dist/cjs/components/MacbookPro/MacbookPro.js.map +1 -0
- package/dist/cjs/components/MacbookPro/MacbookPro.props.d.ts +13 -0
- package/dist/cjs/components/MacbookPro/MacbookPro.props.js +3 -0
- package/dist/cjs/components/MacbookPro/MacbookPro.props.js.map +1 -0
- package/dist/cjs/components/MacbookPro/MacbookPro.styles.d.ts +10 -0
- package/dist/cjs/components/MacbookPro/MacbookPro.styles.js +160 -0
- package/dist/cjs/components/MacbookPro/MacbookPro.styles.js.map +1 -0
- package/dist/cjs/components/MacbookPro/MacbookProClassic.d.ts +3 -0
- package/dist/cjs/components/MacbookPro/MacbookProClassic.js +38 -0
- package/dist/cjs/components/MacbookPro/MacbookProClassic.js.map +1 -0
- package/dist/cjs/components/MacbookPro/MacbookProClassic.styles.d.ts +8 -0
- package/dist/cjs/components/MacbookPro/MacbookProClassic.styles.js +148 -0
- package/dist/cjs/components/MacbookPro/MacbookProClassic.styles.js.map +1 -0
- package/dist/cjs/components/MacbookPro/components/Startup/Startup.d.ts +3 -0
- package/dist/cjs/components/MacbookPro/components/Startup/Startup.js +26 -0
- package/dist/cjs/components/MacbookPro/components/Startup/Startup.js.map +1 -0
- package/dist/cjs/components/MacbookPro/components/Startup/Startup.props.d.ts +3 -0
- package/dist/cjs/components/MacbookPro/components/Startup/Startup.props.js +3 -0
- package/dist/cjs/components/MacbookPro/components/Startup/Startup.props.js.map +1 -0
- package/dist/cjs/components/MacbookPro/components/Startup/Startup.style.d.ts +25 -0
- package/dist/cjs/components/MacbookPro/components/Startup/Startup.style.js +28 -0
- package/dist/cjs/components/MacbookPro/components/Startup/Startup.style.js.map +1 -0
- package/dist/cjs/components/MacbookPro/components/Startup/index.d.ts +3 -0
- package/dist/cjs/components/MacbookPro/components/Startup/index.js +7 -0
- package/dist/cjs/components/MacbookPro/components/Startup/index.js.map +1 -0
- package/dist/cjs/components/MacbookPro/index.d.ts +2 -0
- package/dist/cjs/components/MacbookPro/index.js +6 -0
- package/dist/cjs/components/MacbookPro/index.js.map +1 -0
- package/dist/cjs/components/index.d.ts +4 -1
- package/dist/cjs/components/index.js +5 -2
- package/dist/cjs/components/index.js.map +1 -1
- package/dist/cjs/index.d.ts +0 -0
- package/dist/cjs/index.js +1 -1
- package/dist/cjs/index.js.map +0 -0
- package/dist/esm/components/Galaxy/Galaxy.d.ts +3 -0
- package/dist/esm/components/Galaxy/Galaxy.js +16 -0
- package/dist/esm/components/Galaxy/Galaxy.js.map +1 -0
- package/dist/esm/components/Galaxy/Galaxy.props.d.ts +7 -0
- package/dist/esm/components/Galaxy/Galaxy.props.js +2 -0
- package/dist/esm/components/Galaxy/Galaxy.props.js.map +1 -0
- package/dist/esm/components/Galaxy/Galaxy.style.d.ts +90 -0
- package/dist/esm/components/Galaxy/Galaxy.style.js +161 -0
- package/dist/esm/components/Galaxy/Galaxy.style.js.map +1 -0
- package/dist/esm/components/Galaxy/index.d.ts +2 -0
- package/dist/esm/components/Galaxy/index.js +3 -0
- package/dist/esm/components/Galaxy/index.js.map +1 -0
- package/dist/esm/components/IMac/IMac.d.ts +3 -0
- package/dist/esm/components/IMac/IMac.js +17 -0
- package/dist/esm/components/IMac/IMac.js.map +1 -0
- package/dist/esm/components/IMac/IMac.props.d.ts +7 -0
- package/dist/esm/components/IMac/IMac.props.js +2 -0
- package/dist/esm/components/IMac/IMac.props.js.map +1 -0
- package/dist/esm/components/IMac/IMac.styles.d.ts +7 -0
- package/dist/esm/components/IMac/IMac.styles.js +135 -0
- package/dist/esm/components/IMac/IMac.styles.js.map +1 -0
- package/dist/esm/components/IMac/index.d.ts +2 -0
- package/dist/esm/components/IMac/index.js +3 -0
- package/dist/esm/components/IMac/index.js.map +1 -0
- package/dist/esm/components/IPad/IPad.d.ts +3 -0
- package/dist/esm/components/IPad/IPad.js +16 -0
- package/dist/esm/components/IPad/IPad.js.map +1 -0
- package/dist/esm/components/IPad/IPad.props.d.ts +9 -0
- package/dist/esm/components/IPad/IPad.props.js +2 -0
- package/dist/esm/components/IPad/IPad.props.js.map +1 -0
- package/dist/esm/components/IPad/IPad.style.d.ts +105 -0
- package/dist/esm/components/IPad/IPad.style.js +135 -0
- package/dist/esm/components/IPad/IPad.style.js.map +1 -0
- package/dist/esm/components/IPad/index.d.ts +2 -0
- package/dist/esm/components/IPad/index.js +3 -0
- package/dist/esm/components/IPad/index.js.map +1 -0
- package/dist/esm/components/Iphone/Iphone.d.ts +1 -1
- package/dist/esm/components/Iphone/Iphone.js +3 -3
- package/dist/esm/components/Iphone/Iphone.js.map +1 -1
- package/dist/esm/components/Iphone/Iphone.props.d.ts +4 -1
- package/dist/esm/components/Iphone/Iphone.props.js +0 -0
- package/dist/esm/components/Iphone/Iphone.props.js.map +0 -0
- package/dist/esm/components/Iphone/Iphone.style.d.ts +9 -1
- package/dist/esm/components/Iphone/Iphone.style.js +83 -19
- package/dist/esm/components/Iphone/Iphone.style.js.map +1 -1
- package/dist/esm/components/Iphone/index.d.ts +0 -0
- package/dist/esm/components/Iphone/index.js +0 -0
- package/dist/esm/components/Iphone/index.js.map +0 -0
- package/dist/esm/components/Mac/Mac.d.ts +0 -0
- package/dist/esm/components/Mac/Mac.js +1 -1
- package/dist/esm/components/Mac/Mac.js.map +1 -1
- package/dist/esm/components/Mac/Mac.props.d.ts +0 -0
- package/dist/esm/components/Mac/Mac.props.js +0 -0
- package/dist/esm/components/Mac/Mac.props.js.map +0 -0
- package/dist/esm/components/Mac/Mac.styles.d.ts +0 -0
- package/dist/esm/components/Mac/Mac.styles.js +5 -5
- package/dist/esm/components/Mac/Mac.styles.js.map +0 -0
- package/dist/esm/components/Mac/components/Startup/Startup.d.ts +0 -0
- package/dist/esm/components/Mac/components/Startup/Startup.js +0 -0
- package/dist/esm/components/Mac/components/Startup/Startup.js.map +1 -1
- package/dist/esm/components/Mac/components/Startup/Startup.props.d.ts +0 -0
- package/dist/esm/components/Mac/components/Startup/Startup.props.js +0 -0
- package/dist/esm/components/Mac/components/Startup/Startup.props.js.map +0 -0
- package/dist/esm/components/Mac/components/Startup/Startup.style.d.ts +0 -0
- package/dist/esm/components/Mac/components/Startup/Startup.style.js +0 -0
- package/dist/esm/components/Mac/components/Startup/Startup.style.js.map +0 -0
- package/dist/esm/components/Mac/components/Startup/index.d.ts +0 -0
- package/dist/esm/components/Mac/components/Startup/index.js +0 -0
- package/dist/esm/components/Mac/components/Startup/index.js.map +0 -0
- package/dist/esm/components/Mac/index.d.ts +0 -1
- package/dist/esm/components/Mac/index.js +0 -1
- package/dist/esm/components/Mac/index.js.map +1 -1
- package/dist/esm/components/MacbookPro/MacbookPro.d.ts +3 -0
- package/dist/esm/components/MacbookPro/MacbookPro.js +37 -0
- package/dist/esm/components/MacbookPro/MacbookPro.js.map +1 -0
- package/dist/esm/components/MacbookPro/MacbookPro.props.d.ts +13 -0
- package/dist/esm/components/MacbookPro/MacbookPro.props.js +2 -0
- package/dist/esm/components/MacbookPro/MacbookPro.props.js.map +1 -0
- package/dist/esm/components/MacbookPro/MacbookPro.styles.d.ts +10 -0
- package/dist/esm/components/MacbookPro/MacbookPro.styles.js +156 -0
- package/dist/esm/components/MacbookPro/MacbookPro.styles.js.map +1 -0
- package/dist/esm/components/MacbookPro/MacbookProClassic.d.ts +3 -0
- package/dist/esm/components/MacbookPro/MacbookProClassic.js +33 -0
- package/dist/esm/components/MacbookPro/MacbookProClassic.js.map +1 -0
- package/dist/esm/components/MacbookPro/MacbookProClassic.styles.d.ts +8 -0
- package/dist/esm/components/MacbookPro/MacbookProClassic.styles.js +144 -0
- package/dist/esm/components/MacbookPro/MacbookProClassic.styles.js.map +1 -0
- package/dist/esm/components/MacbookPro/components/Startup/Startup.d.ts +3 -0
- package/dist/esm/components/MacbookPro/components/Startup/Startup.js +21 -0
- package/dist/esm/components/MacbookPro/components/Startup/Startup.js.map +1 -0
- package/dist/esm/components/MacbookPro/components/Startup/Startup.props.d.ts +3 -0
- package/dist/esm/components/MacbookPro/components/Startup/Startup.props.js +2 -0
- package/dist/esm/components/MacbookPro/components/Startup/Startup.props.js.map +1 -0
- package/dist/esm/components/MacbookPro/components/Startup/Startup.style.d.ts +25 -0
- package/dist/esm/components/MacbookPro/components/Startup/Startup.style.js +24 -0
- package/dist/esm/components/MacbookPro/components/Startup/Startup.style.js.map +1 -0
- package/dist/esm/components/MacbookPro/components/Startup/index.d.ts +3 -0
- package/dist/esm/components/MacbookPro/components/Startup/index.js +4 -0
- package/dist/esm/components/MacbookPro/components/Startup/index.js.map +1 -0
- package/dist/esm/components/MacbookPro/index.d.ts +2 -0
- package/dist/esm/components/MacbookPro/index.js +3 -0
- package/dist/esm/components/MacbookPro/index.js.map +1 -0
- package/dist/esm/components/index.d.ts +4 -1
- package/dist/esm/components/index.js +4 -1
- package/dist/esm/components/index.js.map +1 -1
- package/dist/esm/index.d.ts +0 -0
- package/dist/esm/index.js +0 -0
- package/dist/esm/index.js.map +0 -0
- package/package.json +15 -10
- package/dist/esm/components/Mac/vmToPx.d.ts +0 -0
- package/dist/esm/components/Mac/vmToPx.js +0 -2
- package/dist/esm/components/Mac/vmToPx.js.map +0 -1
- package/dist/esm/utils/vmToPx.d.ts +0 -1
- package/dist/esm/utils/vmToPx.js +0 -9
- package/dist/esm/utils/vmToPx.js.map +0 -1
|
@@ -1,9 +1,68 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useStyles = void 0;
|
|
4
|
+
var IPHONE_COLORS = {
|
|
5
|
+
black: {
|
|
6
|
+
accent: '#3c3c3e',
|
|
7
|
+
highlight: '#5c5c5e',
|
|
8
|
+
mid: '#2c2c2e',
|
|
9
|
+
shadow: '#1c1c1e',
|
|
10
|
+
border: '#4a4a4c',
|
|
11
|
+
frame: '#313131'
|
|
12
|
+
},
|
|
13
|
+
silver: {
|
|
14
|
+
accent: '#e5e5e7',
|
|
15
|
+
highlight: '#ffffff',
|
|
16
|
+
mid: '#f2f2f7',
|
|
17
|
+
shadow: '#aeaeb2',
|
|
18
|
+
border: '#d1d1d6',
|
|
19
|
+
frame: '#e5e5e7'
|
|
20
|
+
},
|
|
21
|
+
sage: {
|
|
22
|
+
accent: '#b4c3a1',
|
|
23
|
+
highlight: '#d4e3c1',
|
|
24
|
+
mid: '#c4d3b1',
|
|
25
|
+
shadow: '#849371',
|
|
26
|
+
border: '#a4b391',
|
|
27
|
+
frame: '#b4c3a1'
|
|
28
|
+
},
|
|
29
|
+
'mist-blue': {
|
|
30
|
+
accent: '#a3b5c7',
|
|
31
|
+
highlight: '#c3d5e7',
|
|
32
|
+
mid: '#b3c5d7',
|
|
33
|
+
shadow: '#738597',
|
|
34
|
+
border: '#93a5b7',
|
|
35
|
+
frame: '#a3b5c7'
|
|
36
|
+
},
|
|
37
|
+
lavender: {
|
|
38
|
+
accent: '#d6cce2',
|
|
39
|
+
highlight: '#f6ecff',
|
|
40
|
+
mid: '#e6dcf2',
|
|
41
|
+
shadow: '#a69cb2',
|
|
42
|
+
border: '#c6bcd2',
|
|
43
|
+
frame: '#d6cce2'
|
|
44
|
+
},
|
|
45
|
+
'cosmic-orange': {
|
|
46
|
+
accent: '#d35e3b',
|
|
47
|
+
highlight: '#f4a485',
|
|
48
|
+
mid: '#c14f31',
|
|
49
|
+
shadow: '#7d2d12',
|
|
50
|
+
border: '#d35e3b',
|
|
51
|
+
frame: '#bd4d28'
|
|
52
|
+
},
|
|
53
|
+
'deep-blue': {
|
|
54
|
+
accent: '#2c3e50',
|
|
55
|
+
highlight: '#546e7a',
|
|
56
|
+
mid: '#1a252f',
|
|
57
|
+
shadow: '#0c141a',
|
|
58
|
+
border: '#2c3e50',
|
|
59
|
+
frame: '#1c2a38'
|
|
60
|
+
}
|
|
61
|
+
};
|
|
4
62
|
var useStyles = function (_a) {
|
|
5
|
-
var width = _a.width;
|
|
6
|
-
|
|
63
|
+
var width = _a.width, _b = _a.color, color = _b === void 0 ? 'black' : _b, _c = _a.scrollable, scrollable = _c === void 0 ? true : _c;
|
|
64
|
+
var theme = IPHONE_COLORS[color];
|
|
65
|
+
return {
|
|
7
66
|
iphone: {
|
|
8
67
|
width: width,
|
|
9
68
|
height: width * 2.07,
|
|
@@ -13,7 +72,7 @@ var useStyles = function (_a) {
|
|
|
13
72
|
},
|
|
14
73
|
display: {
|
|
15
74
|
borderRadius: "".concat(width / 5.8, "px"),
|
|
16
|
-
boxShadow: "inset 0 0 0 ".concat(width * 0.001, "px
|
|
75
|
+
boxShadow: "inset 0 0 0 ".concat(width * 0.001, "px ").concat(theme.frame, ", inset 0 0 0 ").concat(width * 0.002, "px ").concat(theme.shadow, ", inset 0 0 0 ").concat(width * 0.003, "px ").concat(theme.mid, ", inset 0 0 0 ").concat(width * 0.004, "px ").concat(theme.accent, ", inset 0 0 0 ").concat(width * 0.006, "px ").concat(theme.highlight, ", inset 0 0 0 ").concat(width * 0.007, "px ").concat(theme.accent, ", inset 0 0 0 ").concat(width * 0.008, "px ").concat(theme.accent, ", inset 0 0 0 ").concat(width * 0.009, "px ").concat(theme.mid, ", inset 0 0 0 ").concat(width * 0.010, "px ").concat(theme.mid, ", inset 0 0 0 ").concat(width * 0.012, "px ").concat(theme.mid, ", inset 0 0 0 ").concat(width * 0.013, "px #383624, inset 0 0 0 ").concat(width * 0.014, "px #404037, inset 0 0 0 ").concat(width * 0.015, "px #101109, inset 0 0 0 ").concat(width * 0.04, "px black"),
|
|
17
76
|
width: '100%',
|
|
18
77
|
height: '100%',
|
|
19
78
|
background: 'rgb(10, 10, 10)',
|
|
@@ -23,9 +82,14 @@ var useStyles = function (_a) {
|
|
|
23
82
|
children: {
|
|
24
83
|
width: "".concat(width * 0.917, "px"),
|
|
25
84
|
height: "".concat(width * 1.989, "px"),
|
|
26
|
-
overflow: '
|
|
85
|
+
overflow: scrollable ? 'auto' : 'hidden',
|
|
27
86
|
borderRadius: "".concat(width / 7.5, "px"),
|
|
28
|
-
margin: "".concat(width * 0.0415, "px auto")
|
|
87
|
+
margin: "".concat(width * 0.0415, "px auto"),
|
|
88
|
+
'&::-webkit-scrollbar': {
|
|
89
|
+
display: 'none'
|
|
90
|
+
},
|
|
91
|
+
msOverflowStyle: 'none',
|
|
92
|
+
scrollbarWidth: 'none'
|
|
29
93
|
},
|
|
30
94
|
floatinIsland: {
|
|
31
95
|
width: "".concat(width * 0.267, "px"),
|
|
@@ -46,25 +110,25 @@ var useStyles = function (_a) {
|
|
|
46
110
|
width: "".concat(width * 0.0050, "px"),
|
|
47
111
|
position: 'absolute',
|
|
48
112
|
top: "".concat(width * 0.364, "px"),
|
|
49
|
-
left: "-".concat(width * 0.0050, "px")
|
|
113
|
+
left: "-".concat(width * 0.0050, "px"),
|
|
50
114
|
},
|
|
51
115
|
silencer: {
|
|
52
116
|
width: '100%',
|
|
53
117
|
height: "".concat(width * 0.0729, "px"),
|
|
54
118
|
borderRadius: "".concat(width * 0.002, "px 0 0 ").concat(width * 0.002, "px"),
|
|
55
|
-
border: "".concat(width * 0.001, "px solid
|
|
119
|
+
border: "".concat(width * 0.001, "px solid ").concat(theme.border),
|
|
56
120
|
borderRight: 'none',
|
|
57
|
-
backgroundImage:
|
|
58
|
-
boxShadow: "inset ".concat(width * 0.001, "px 0 0
|
|
121
|
+
backgroundImage: "linear-gradient(to bottom, ".concat(theme.mid, " 0%, ").concat(theme.highlight, " 2%, ").concat(theme.shadow, " 4%, ").concat(theme.accent, " 10%, ").concat(theme.accent, " 90%, ").concat(theme.shadow, " 94%, ").concat(theme.highlight, " 98%, ").concat(theme.mid, " 100%)"),
|
|
122
|
+
boxShadow: "inset ".concat(width * 0.001, "px 0 0 ").concat(theme.accent)
|
|
59
123
|
},
|
|
60
124
|
volumeUp: {
|
|
61
125
|
width: '100%',
|
|
62
126
|
height: "".concat(width * 0.144, "px"),
|
|
63
127
|
borderRadius: "".concat(width * 0.002, "px 0 0 ").concat(width * 0.002, "px"),
|
|
64
|
-
border: "".concat(width * 0.001, "px solid
|
|
128
|
+
border: "".concat(width * 0.001, "px solid ").concat(theme.border),
|
|
65
129
|
borderRight: 'none',
|
|
66
|
-
backgroundImage:
|
|
67
|
-
boxShadow: "inset ".concat(width * 0.001, "px 0 0
|
|
130
|
+
backgroundImage: "linear-gradient(to bottom, ".concat(theme.mid, " 0%, ").concat(theme.highlight, " 2%, ").concat(theme.shadow, " 4%, ").concat(theme.accent, " 10%, ").concat(theme.accent, " 90%, ").concat(theme.shadow, " 94%, ").concat(theme.highlight, " 98%, ").concat(theme.mid, " 100%)"),
|
|
131
|
+
boxShadow: "inset ".concat(width * 0.001, "px 0 0 ").concat(theme.accent),
|
|
68
132
|
position: 'absolute',
|
|
69
133
|
top: "".concat(width * 0.137, "px")
|
|
70
134
|
},
|
|
@@ -72,10 +136,10 @@ var useStyles = function (_a) {
|
|
|
72
136
|
width: '100%',
|
|
73
137
|
height: "".concat(width * 0.144, "px"),
|
|
74
138
|
borderRadius: "".concat(width * 0.002, "px 0 0 ").concat(width * 0.002, "px"),
|
|
75
|
-
border: "".concat(width * 0.001, "px solid
|
|
139
|
+
border: "".concat(width * 0.001, "px solid ").concat(theme.border),
|
|
76
140
|
borderRight: 'none',
|
|
77
|
-
backgroundImage:
|
|
78
|
-
boxShadow: "inset ".concat(width * 0.001, "px 0 0
|
|
141
|
+
backgroundImage: "linear-gradient(to bottom, ".concat(theme.mid, " 0%, ").concat(theme.highlight, " 2%, ").concat(theme.shadow, " 4%, ").concat(theme.accent, " 10%, ").concat(theme.accent, " 90%, ").concat(theme.shadow, " 94%, ").concat(theme.highlight, " 98%, ").concat(theme.mid, " 100%)"),
|
|
142
|
+
boxShadow: "inset ".concat(width * 0.001, "px 0 0 ").concat(theme.accent),
|
|
79
143
|
position: 'absolute',
|
|
80
144
|
top: "".concat(width * 0.316, "px")
|
|
81
145
|
},
|
|
@@ -86,17 +150,17 @@ var useStyles = function (_a) {
|
|
|
86
150
|
top: "".concat(width * 0.605, "px"),
|
|
87
151
|
right: "-".concat(width * 0.0050, "px"),
|
|
88
152
|
borderRadius: "".concat(width * 0.002, "px ").concat(width * 0.002, "px 0 0"),
|
|
89
|
-
border: "".concat(width * 0.001, "px solid
|
|
153
|
+
border: "".concat(width * 0.001, "px solid ").concat(theme.border),
|
|
90
154
|
borderRight: 'none',
|
|
91
|
-
backgroundImage:
|
|
92
|
-
boxShadow: "inset -".concat(width * 0.001, "px 0 0
|
|
155
|
+
backgroundImage: "linear-gradient(to bottom, ".concat(theme.mid, " 0%, ").concat(theme.highlight, " 2%, ").concat(theme.shadow, " 4%, ").concat(theme.accent, " 10%, ").concat(theme.accent, " 90%, ").concat(theme.shadow, " 94%, ").concat(theme.highlight, " 98%, ").concat(theme.mid, " 100%)"),
|
|
156
|
+
boxShadow: "inset -".concat(width * 0.001, "px 0 0 ").concat(theme.accent),
|
|
93
157
|
},
|
|
94
158
|
statusBar: {
|
|
95
159
|
backgroundColor: 'white'
|
|
96
160
|
},
|
|
97
161
|
timeContainer: {},
|
|
98
162
|
iconContainer: {}
|
|
99
|
-
}
|
|
163
|
+
};
|
|
100
164
|
};
|
|
101
165
|
exports.useStyles = useStyles;
|
|
102
166
|
//# sourceMappingURL=Iphone.style.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Iphone.style.js","sourceRoot":"","sources":["../../../../src/components/Iphone/Iphone.style.ts"],"names":[],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"Iphone.style.js","sourceRoot":"","sources":["../../../../src/components/Iphone/Iphone.style.ts"],"names":[],"mappings":"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"}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.Mac = void 0;
|
|
4
4
|
var tslib_1 = require("tslib");
|
|
5
5
|
var react_1 = tslib_1.__importStar(require("react"));
|
|
6
|
-
var
|
|
6
|
+
var Mac_styles_1 = require("./Mac.styles");
|
|
7
7
|
var Startup_1 = require("./components/Startup");
|
|
8
8
|
var Mac = function (_a) {
|
|
9
9
|
var startup = _a.startup, animateOpen = _a.animateOpen, open = _a.open, width = _a.width, openAngle = _a.openAngle, children = _a.children, _b = _a.perspective, perspective = _b === void 0 ? 2000 : _b;
|
|
10
10
|
var _c = (0, react_1.useState)(animateOpen ? false : open), macOpen = _c[0], setMacOpen = _c[1];
|
|
11
|
-
var styles = (0,
|
|
11
|
+
var styles = (0, Mac_styles_1.useStyles)({ width: width, macOpen: macOpen, openAngle: openAngle, perspective: perspective });
|
|
12
12
|
(0, react_1.useEffect)(function () {
|
|
13
13
|
if (animateOpen) {
|
|
14
14
|
setTimeout(function () { return setMacOpen(open); }, 100);
|
|
@@ -17,21 +17,21 @@ var Mac = function (_a) {
|
|
|
17
17
|
setMacOpen(open);
|
|
18
18
|
}
|
|
19
19
|
}, [open, animateOpen]);
|
|
20
|
-
return (react_1
|
|
21
|
-
react_1
|
|
22
|
-
react_1
|
|
23
|
-
react_1
|
|
24
|
-
react_1
|
|
25
|
-
react_1
|
|
26
|
-
react_1
|
|
27
|
-
react_1
|
|
28
|
-
react_1
|
|
29
|
-
react_1
|
|
30
|
-
react_1
|
|
31
|
-
react_1
|
|
32
|
-
react_1
|
|
33
|
-
react_1
|
|
34
|
-
react_1
|
|
20
|
+
return (react_1.default.createElement("div", { style: styles.mac },
|
|
21
|
+
react_1.default.createElement("div", { className: 'top-portion', style: styles.topPortion },
|
|
22
|
+
react_1.default.createElement("div", { className: 'lid', style: styles.lid }),
|
|
23
|
+
react_1.default.createElement("div", { className: 'top', style: styles.top },
|
|
24
|
+
react_1.default.createElement("div", { className: 'screen', style: styles.screen },
|
|
25
|
+
react_1.default.createElement("div", { className: "camera", style: styles.camera }),
|
|
26
|
+
react_1.default.createElement(Startup_1.Startup, { show: startup }),
|
|
27
|
+
react_1.default.createElement("div", { style: styles.screenContent }, children)),
|
|
28
|
+
react_1.default.createElement("div", { className: 'engraving', style: styles.engraving }, "Macbook Pro"),
|
|
29
|
+
react_1.default.createElement("div", { className: 'after-screen', style: styles.afterScreen }))),
|
|
30
|
+
react_1.default.createElement("div", { className: 'bottom-portion', style: styles.bottomPortion },
|
|
31
|
+
react_1.default.createElement("div", { className: 'bottom-cover', style: styles.bottomCover }),
|
|
32
|
+
react_1.default.createElement("div", { className: 'bottom', style: styles.bottom },
|
|
33
|
+
react_1.default.createElement("div", { className: "opener", style: styles.opener }),
|
|
34
|
+
react_1.default.createElement("div", { className: "bottom-after", style: styles.bottomAfter })))));
|
|
35
35
|
};
|
|
36
36
|
exports.Mac = Mac;
|
|
37
37
|
//# sourceMappingURL=Mac.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Mac.js","sourceRoot":"","sources":["../../../../src/components/Mac/Mac.tsx"],"names":[],"mappings":";;;;AAAA,qDAAmD;
|
|
1
|
+
{"version":3,"file":"Mac.js","sourceRoot":"","sources":["../../../../src/components/Mac/Mac.tsx"],"names":[],"mappings":";;;;AAAA,qDAAmD;AAEnD,2CAAyC;AACzC,gDAA+C;AAExC,IAAM,GAAG,GAAG,UAAC,EAQT;QAPP,OAAO,aAAA,EACP,WAAW,iBAAA,EACX,IAAI,UAAA,EACJ,KAAK,WAAA,EACL,SAAS,eAAA,EACT,QAAQ,cAAA,EACR,mBAAkB,EAAlB,WAAW,mBAAG,IAAI,KAAA;IAEZ,IAAA,KAAwB,IAAA,gBAAQ,EAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,EAA3D,OAAO,QAAA,EAAE,UAAU,QAAwC,CAAA;IAClE,IAAM,MAAM,GAAG,IAAA,sBAAS,EAAC,EAAE,KAAK,OAAA,EAAE,OAAO,SAAA,EAAE,SAAS,WAAA,EAAE,WAAW,aAAA,EAAE,CAAC,CAAA;IAEpE,IAAA,iBAAS,EAAC;QACN,IAAI,WAAW,EAAE,CAAC;YACd,UAAU,CAAC,cAAM,OAAA,UAAU,CAAC,IAAI,CAAC,EAAhB,CAAgB,EAAE,GAAG,CAAC,CAAA;QAC3C,CAAC;aAAM,CAAC;YACJ,UAAU,CAAC,IAAI,CAAC,CAAA;QACpB,CAAC;IACL,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC,CAAA;IACvB,OAAO,CACH,uCAAK,KAAK,EAAE,MAAM,CAAC,GAAG;QAClB,uCAAK,SAAS,EAAC,aAAa,EAAC,KAAK,EAAE,MAAM,CAAC,UAAU;YACjD,uCAAK,SAAS,EAAC,KAAK,EAAC,KAAK,EAAE,MAAM,CAAC,GAAG,GAAQ;YAC9C,uCAAK,SAAS,EAAC,KAAK,EAAC,KAAK,EAAE,MAAM,CAAC,GAAG;gBAClC,uCAAK,SAAS,EAAC,QAAQ,EAAC,KAAK,EAAE,MAAM,CAAC,MAAM;oBACxC,uCAAK,SAAS,EAAC,QAAQ,EAAC,KAAK,EAAE,MAAM,CAAC,MAAM,GAAQ;oBACpD,8BAAC,iBAAO,IAAC,IAAI,EAAE,OAAO,GAAI;oBAC1B,uCAAK,KAAK,EAAE,MAAM,CAAC,aAAa,IAC3B,QAAQ,CACP,CACJ;gBACN,uCAAK,SAAS,EAAC,WAAW,EAAC,KAAK,EAAE,MAAM,CAAC,SAAS,kBAAmB;gBACrE,uCAAK,SAAS,EAAC,cAAc,EAAC,KAAK,EAAE,MAAM,CAAC,WAAW,GAAQ,CAC7D,CACJ;QACN,uCAAK,SAAS,EAAC,gBAAgB,EAAC,KAAK,EAAE,MAAM,CAAC,aAAa;YACvD,uCAAK,SAAS,EAAC,cAAc,EAAC,KAAK,EAAE,MAAM,CAAC,WAAW,GAAQ;YAC/D,uCAAK,SAAS,EAAC,QAAQ,EAAC,KAAK,EAAE,MAAM,CAAC,MAAM;gBACxC,uCAAK,SAAS,EAAC,QAAQ,EAAC,KAAK,EAAE,MAAM,CAAC,MAAM,GAAQ;gBACpD,uCAAK,SAAS,EAAC,cAAc,EAAC,KAAK,EAAE,MAAM,CAAC,WAAW,GAAQ,CAC7D,CACJ,CACJ,CACT,CAAA;AACL,CAAC,CAAA;AA5CY,QAAA,GAAG,OA4Cf"}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useStyles = void 0;
|
|
4
4
|
var useStyles = function (_a) {
|
|
5
5
|
var width = _a.width, macOpen = _a.macOpen, openAngle = _a.openAngle, perspective = _a.perspective;
|
|
@@ -14,12 +14,12 @@ var useStyles = function (_a) {
|
|
|
14
14
|
perspective: "".concat(perspective, "px"),
|
|
15
15
|
perspectiveOrigin: '50% 100%',
|
|
16
16
|
transition: 'right 1s',
|
|
17
|
-
margin: "0 ".concat(width / 9, "px")
|
|
17
|
+
margin: "0 ".concat(width / 9, "px"),
|
|
18
18
|
},
|
|
19
19
|
topPortion: {
|
|
20
20
|
transformStyle: 'preserve-3d',
|
|
21
21
|
transform: "rotateX(-".concat(macOpen ? openAngle !== null && openAngle !== void 0 ? openAngle : 0 : 90, "deg)"),
|
|
22
|
-
transformOrigin: '50% 100%'
|
|
22
|
+
transformOrigin: '50% 100%',
|
|
23
23
|
},
|
|
24
24
|
lid: {
|
|
25
25
|
position: 'absolute',
|
|
@@ -50,7 +50,7 @@ var useStyles = function (_a) {
|
|
|
50
50
|
boxSizing: 'border-box',
|
|
51
51
|
position: 'relative',
|
|
52
52
|
overflow: 'hidden',
|
|
53
|
-
top: 1
|
|
53
|
+
top: 1,
|
|
54
54
|
},
|
|
55
55
|
engraving: {
|
|
56
56
|
zIndex: 1,
|
|
@@ -80,7 +80,7 @@ var useStyles = function (_a) {
|
|
|
80
80
|
top: -(width * 0.683 * 0.073170731707317) / 2,
|
|
81
81
|
left: '50%',
|
|
82
82
|
transform: 'translate(-50%, -50%)',
|
|
83
|
-
border: "".concat(width / 266.66, " solid rgb(20, 20, 20)")
|
|
83
|
+
border: "".concat(width / 266.66, " solid rgb(20, 20, 20)"),
|
|
84
84
|
},
|
|
85
85
|
innerScreen: {
|
|
86
86
|
position: 'absolute',
|
|
@@ -149,7 +149,7 @@ var useStyles = function (_a) {
|
|
|
149
149
|
left: 0,
|
|
150
150
|
borderBottomRightRadius: "".concat(width * 0.25, "px 100%"),
|
|
151
151
|
borderBottomLeftRadius: "".concat(width * 0.25, "px 100%"),
|
|
152
|
-
boxShadow: 'inset 0 -5px 10px black, 0 5px 10px'
|
|
152
|
+
boxShadow: 'inset 0 -5px 10px black, 0 5px 10px',
|
|
153
153
|
}
|
|
154
154
|
});
|
|
155
155
|
};
|
|
File without changes
|
|
File without changes
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.Startup = void 0;
|
|
4
4
|
var tslib_1 = require("tslib");
|
|
5
5
|
var react_1 = tslib_1.__importStar(require("react"));
|
|
@@ -15,12 +15,12 @@ var Startup = function (_a) {
|
|
|
15
15
|
setTimeout(function () { return setMacShow(false); }, 2500);
|
|
16
16
|
}
|
|
17
17
|
});
|
|
18
|
-
return (react_1
|
|
19
|
-
react_1
|
|
18
|
+
return (react_1.default.createElement(react_1.default.Fragment, null, macShow &&
|
|
19
|
+
react_1.default.createElement("div", { className: 'startup',
|
|
20
20
|
//@ts-ignore - using 'position' property should be legal but ts is screaming at me fsr
|
|
21
21
|
style: styles.startup },
|
|
22
|
-
react_1
|
|
23
|
-
react_1
|
|
22
|
+
react_1.default.createElement("svg", { style: styles.startupSvg, id: "svg2", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 842.32 1000" },
|
|
23
|
+
react_1.default.createElement("path", { id: "path4", d: "M824.67,779.3A544.21,544.21,0,0,1,770.9,876q-42.4,60.45-69.25,83.7-41.49,38.15-89,39.19c-22.78,0-50.25-6.48-82.22-19.62s-61.56-19.57-88.52-19.57q-42.4,0-91,19.57t-78.65,20.67q-45.65,2-91-40.24-29-25.27-72.43-86.67-46.59-65.55-76.6-152.15Q0,627.24,0,539.51,0,439,43.49,366.25q34.19-58.35,91.07-92.12c38-22.53,79-34,123.14-34.75,24.16,0,55.85,7.48,95.23,22.17s64.49,22.21,75.54,22.21c8.27,0,36.28-8.74,83.77-26.16q67.35-24.24,113.85-20.22,126.21,10.19,189.38,99.71Q702.6,405.48,703.74,528.45q1,95.71,69.32,159.07A227.93,227.93,0,0,0,842.32,733Q834,757.11,824.67,779.3ZM631.71,20q0,75-54.69,139.92c-43.95,51.38-97.11,81.08-154.75,76.39a154.5,154.5,0,0,1-1.17-18.95c0-48,20.91-99.39,58-141.4q27.79-31.9,70.68-53.07Q592.58,2.05,630.66,0a181.89,181.89,0,0,1,1.05,20Z" })))));
|
|
24
24
|
};
|
|
25
25
|
exports.Startup = Startup;
|
|
26
26
|
//# sourceMappingURL=Startup.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Startup.js","sourceRoot":"","sources":["../../../../../../src/components/Mac/components/Startup/Startup.tsx"],"names":[],"mappings":";;;;AAAA,qDAAmD;AACnD,sBAA2C;AAEpC,IAAM,OAAO,GAAG,UAAC,EAET;QADX,IAAI,UAAA;IAEE,IAAA,KAAwB,IAAA,gBAAQ,EAAC,IAAI,CAAC,EAArC,OAAO,QAAA,EAAE,UAAU,QAAkB,CAAA;IACtC,IAAA,KAA4B,IAAA,gBAAQ,EAAC,IAAI,CAAC,EAAzC,SAAS,QAAA,EAAE,YAAY,QAAkB,CAAA;IAChD,IAAM,MAAM,GAAG,IAAA,YAAS,EAAC,EAAE,SAAS,WAAA,EAAE,CAAC,CAAC;IAExC,IAAA,iBAAS,EAAC;QACN,IAAI,IAAI,EAAE;
|
|
1
|
+
{"version":3,"file":"Startup.js","sourceRoot":"","sources":["../../../../../../src/components/Mac/components/Startup/Startup.tsx"],"names":[],"mappings":";;;;AAAA,qDAAmD;AACnD,sBAA2C;AAEpC,IAAM,OAAO,GAAG,UAAC,EAET;QADX,IAAI,UAAA;IAEE,IAAA,KAAwB,IAAA,gBAAQ,EAAC,IAAI,CAAC,EAArC,OAAO,QAAA,EAAE,UAAU,QAAkB,CAAA;IACtC,IAAA,KAA4B,IAAA,gBAAQ,EAAC,IAAI,CAAC,EAAzC,SAAS,QAAA,EAAE,YAAY,QAAkB,CAAA;IAChD,IAAM,MAAM,GAAG,IAAA,YAAS,EAAC,EAAE,SAAS,WAAA,EAAE,CAAC,CAAC;IAExC,IAAA,iBAAS,EAAC;QACN,IAAI,IAAI,EAAE,CAAC;YACP,UAAU,CAAC,cAAM,OAAA,YAAY,CAAC,KAAK,CAAC,EAAnB,CAAmB,EAAE,IAAI,CAAC,CAAA;YAC3C,UAAU,CAAC,cAAM,OAAA,UAAU,CAAC,KAAK,CAAC,EAAjB,CAAiB,EAAE,IAAI,CAAC,CAAA;QAC7C,CAAC;IACL,CAAC,CAAC,CAAA;IACF,OAAO,CACH,8DACK,OAAO;QACJ,uCACI,SAAS,EAAC,SAAS;YACnB,sFAAsF;YACtF,KAAK,EAAE,MAAM,CAAC,OAAO;YAErB,uCAAK,KAAK,EAAE,MAAM,CAAC,UAAU,EAAE,EAAE,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,iBAAiB;gBAAC,wCAAM,EAAE,EAAC,OAAO,EAAC,CAAC,EAAC,0vBAA0vB,GAAG,CAAM,CAC13B,CAEX,CACN,CAAA;AACL,CAAC,CAAA;AA1BY,QAAA,OAAO,WA0BnB"}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
exports
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
var tslib_1 = require("tslib");
|
|
4
4
|
tslib_1.__exportStar(require("./Mac"), exports);
|
|
5
5
|
tslib_1.__exportStar(require("./Mac.props"), exports);
|
|
6
|
-
tslib_1.__exportStar(require("./Mac.styles"), exports);
|
|
7
6
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Mac/index.ts"],"names":[],"mappings":";;;AAAA,gDAAqB;AACrB,sDAA4B
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Mac/index.ts"],"names":[],"mappings":";;;AAAA,gDAAqB;AACrB,sDAA4B"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.MacbookPro = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var react_1 = tslib_1.__importStar(require("react"));
|
|
6
|
+
var MacbookPro_styles_1 = require("./MacbookPro.styles");
|
|
7
|
+
var Startup_1 = require("./components/Startup");
|
|
8
|
+
var material_1 = require("@mui/material");
|
|
9
|
+
var MacbookProClassic_1 = require("./MacbookProClassic");
|
|
10
|
+
var MacbookPro = function (props) {
|
|
11
|
+
if (props.old) {
|
|
12
|
+
return react_1.default.createElement(MacbookProClassic_1.MacbookProClassic, tslib_1.__assign({}, props));
|
|
13
|
+
}
|
|
14
|
+
var startup = props.startup, animateOpen = props.animateOpen, open = props.open, width = props.width, openAngle = props.openAngle, children = props.children, _a = props.perspective, perspective = _a === void 0 ? 2500 : _a, _b = props.color, color = _b === void 0 ? 'silver' : _b;
|
|
15
|
+
var _c = (0, react_1.useState)(animateOpen ? false : open), macOpen = _c[0], setMacOpen = _c[1];
|
|
16
|
+
var styles = (0, MacbookPro_styles_1.useStyles)({ width: width, macOpen: macOpen, openAngle: openAngle, perspective: perspective, color: color });
|
|
17
|
+
(0, react_1.useEffect)(function () {
|
|
18
|
+
if (animateOpen) {
|
|
19
|
+
setTimeout(function () { return setMacOpen(open); }, 100);
|
|
20
|
+
}
|
|
21
|
+
else {
|
|
22
|
+
setMacOpen(open);
|
|
23
|
+
}
|
|
24
|
+
}, [open, animateOpen]);
|
|
25
|
+
return (react_1.default.createElement(material_1.Box, { sx: styles.mac },
|
|
26
|
+
react_1.default.createElement(material_1.Box, { className: 'top-portion', sx: styles.topPortion },
|
|
27
|
+
react_1.default.createElement(material_1.Box, { className: 'lid', sx: styles.lid }),
|
|
28
|
+
react_1.default.createElement(material_1.Box, { className: 'top', sx: styles.top },
|
|
29
|
+
react_1.default.createElement(material_1.Box, { className: 'screen', sx: styles.screen },
|
|
30
|
+
react_1.default.createElement(material_1.Box, { className: "notch", sx: styles.notch },
|
|
31
|
+
react_1.default.createElement(material_1.Box, { className: "camera", sx: styles.camera })),
|
|
32
|
+
react_1.default.createElement(Startup_1.Startup, { show: startup }),
|
|
33
|
+
react_1.default.createElement(material_1.Box, { sx: styles.screenContent }, children)),
|
|
34
|
+
react_1.default.createElement(material_1.Box, { className: "underscreen-bar", sx: styles.underscreenBar }))),
|
|
35
|
+
react_1.default.createElement(material_1.Box, { className: 'bottom-portion', sx: styles.bottomPortion },
|
|
36
|
+
react_1.default.createElement(material_1.Box, { className: 'bottom-cover', sx: styles.bottomCover }),
|
|
37
|
+
react_1.default.createElement(material_1.Box, { className: 'bottom', sx: styles.bottom },
|
|
38
|
+
react_1.default.createElement(material_1.Box, { className: "opener", sx: styles.opener })))));
|
|
39
|
+
};
|
|
40
|
+
exports.MacbookPro = MacbookPro;
|
|
41
|
+
//# sourceMappingURL=MacbookPro.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MacbookPro.js","sourceRoot":"","sources":["../../../../src/components/MacbookPro/MacbookPro.tsx"],"names":[],"mappings":";;;;AAAA,qDAAmD;AAEnD,yDAAgD;AAChD,gDAA+C;AAC/C,0CAAoC;AACpC,yDAAwD;AAEjD,IAAM,UAAU,GAAG,UAAC,KAAsB;IAC7C,IAAI,KAAK,CAAC,GAAG,EAAE,CAAC;QACZ,OAAO,8BAAC,qCAAiB,uBAAK,KAAK,EAAI,CAAC;IAC5C,CAAC;IAGG,IAAA,OAAO,GAQP,KAAK,QARE,EACP,WAAW,GAOX,KAAK,YAPM,EACX,IAAI,GAMJ,KAAK,KAND,EACJ,KAAK,GAKL,KAAK,MALA,EACL,SAAS,GAIT,KAAK,UAJI,EACT,QAAQ,GAGR,KAAK,SAHG,EACR,KAEA,KAAK,YAFa,EAAlB,WAAW,mBAAG,IAAI,KAAA,EAClB,KACA,KAAK,MADW,EAAhB,KAAK,mBAAG,QAAQ,KAAA,CACV;IACJ,IAAA,KAAwB,IAAA,gBAAQ,EAAC,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,EAA3D,OAAO,QAAA,EAAE,UAAU,QAAwC,CAAC;IACnE,IAAM,MAAM,GAAG,IAAA,6BAAS,EAAC,EAAE,KAAK,OAAA,EAAE,OAAO,SAAA,EAAE,SAAS,WAAA,EAAE,WAAW,aAAA,EAAE,KAAK,OAAA,EAAE,CAAC,CAAC;IAE5E,IAAA,iBAAS,EAAC;QACN,IAAI,WAAW,EAAE,CAAC;YACd,UAAU,CAAC,cAAM,OAAA,UAAU,CAAC,IAAI,CAAC,EAAhB,CAAgB,EAAE,GAAG,CAAC,CAAC;QAC5C,CAAC;aAAM,CAAC;YACJ,UAAU,CAAC,IAAI,CAAC,CAAC;QACrB,CAAC;IACL,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC;IAExB,OAAO,CACH,8BAAC,cAAG,IAAC,EAAE,EAAE,MAAM,CAAC,GAAG;QACf,8BAAC,cAAG,IAAC,SAAS,EAAC,aAAa,EAAC,EAAE,EAAE,MAAM,CAAC,UAAU;YAC9C,8BAAC,cAAG,IAAC,SAAS,EAAC,KAAK,EAAC,EAAE,EAAE,MAAM,CAAC,GAAG,GAAQ;YAC3C,8BAAC,cAAG,IAAC,SAAS,EAAC,KAAK,EAAC,EAAE,EAAE,MAAM,CAAC,GAAG;gBAC/B,8BAAC,cAAG,IAAC,SAAS,EAAC,QAAQ,EAAC,EAAE,EAAE,MAAM,CAAC,MAAM;oBACrC,8BAAC,cAAG,IAAC,SAAS,EAAC,OAAO,EAAC,EAAE,EAAE,MAAM,CAAC,KAAK;wBACnC,8BAAC,cAAG,IAAC,SAAS,EAAC,QAAQ,EAAC,EAAE,EAAE,MAAM,CAAC,MAAM,GAAQ,CAC/C;oBACN,8BAAC,iBAAO,IAAC,IAAI,EAAE,OAAO,GAAI;oBAC1B,8BAAC,cAAG,IAAC,EAAE,EAAE,MAAM,CAAC,aAAa,IACxB,QAAQ,CACP,CACJ;gBACN,8BAAC,cAAG,IAAC,SAAS,EAAC,iBAAiB,EAAC,EAAE,EAAE,MAAM,CAAC,cAAc,GAAQ,CAChE,CACJ;QACN,8BAAC,cAAG,IAAC,SAAS,EAAC,gBAAgB,EAAC,EAAE,EAAE,MAAM,CAAC,aAAa;YACpD,8BAAC,cAAG,IAAC,SAAS,EAAC,cAAc,EAAC,EAAE,EAAE,MAAM,CAAC,WAAW,GAAQ;YAC5D,8BAAC,cAAG,IAAC,SAAS,EAAC,QAAQ,EAAC,EAAE,EAAE,MAAM,CAAC,MAAM;gBACrC,8BAAC,cAAG,IAAC,SAAS,EAAC,QAAQ,EAAC,EAAE,EAAE,MAAM,CAAC,MAAM,GAAQ,CAE/C,CACJ,CACJ,CACT,CAAC;AACN,CAAC,CAAC;AApDW,QAAA,UAAU,cAoDrB"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ReactNode } from "react";
|
|
2
|
+
export type MacbookProColor = 'silver' | 'space-black';
|
|
3
|
+
export interface MacbookProProps {
|
|
4
|
+
old?: boolean;
|
|
5
|
+
open: boolean;
|
|
6
|
+
width: number;
|
|
7
|
+
startup?: boolean;
|
|
8
|
+
animateOpen?: boolean;
|
|
9
|
+
openAngle?: number;
|
|
10
|
+
children?: ReactNode;
|
|
11
|
+
perspective?: number;
|
|
12
|
+
color?: MacbookProColor;
|
|
13
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"MacbookPro.props.js","sourceRoot":"","sources":["../../../../src/components/MacbookPro/MacbookPro.props.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { MacbookProColor } from './MacbookPro.props';
|
|
2
|
+
export declare const useStyles: ({ width, macOpen, openAngle, perspective, color }: StylesProps) => any;
|
|
3
|
+
interface StylesProps {
|
|
4
|
+
width: number;
|
|
5
|
+
macOpen: boolean;
|
|
6
|
+
openAngle?: number;
|
|
7
|
+
perspective?: number;
|
|
8
|
+
color?: MacbookProColor;
|
|
9
|
+
}
|
|
10
|
+
export {};
|