@biela.dev/devices 0.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.
@@ -0,0 +1,292 @@
1
+ import { a as DeviceLayoutData, D as DeviceMeta } from '../contract-types-Cw1rmF3b.cjs';
2
+ import * as react_jsx_runtime from 'react/jsx-runtime';
3
+
4
+ /**
5
+ * iPhone 17 Pro Max — dimensions
6
+ *
7
+ * Screen: 440x956pt (logical points at 1x)
8
+ * Physical: 1320x2868px at 3x DPR
9
+ * Display: 6.9" LTPO Super Retina XDR OLED, 460 PPI
10
+ * Hardware: Dynamic Island, Action Button, Camera Control
11
+ * Frame: Titanium
12
+ */
13
+ declare const IPHONE_17_PRO_MAX_META: DeviceMeta;
14
+ declare const IPHONE_17_PRO_MAX_LAYOUT: DeviceLayoutData;
15
+
16
+ interface DeviceSVGProps$5 {
17
+ colorScheme?: "light" | "dark";
18
+ style?: React.CSSProperties;
19
+ }
20
+ /**
21
+ * iPhone 17 Pro Max SVG Frame
22
+ *
23
+ * Dimensions: 440x956 logical points (screen area)
24
+ * Full frame includes bezels: ~470x1002pt total
25
+ *
26
+ * Structure:
27
+ * - Outer titanium frame with rounded corners
28
+ * - Screen cutout (transparent — content shows through)
29
+ * - Dynamic Island pill overlay
30
+ * - Side buttons (volume, action, power, camera control)
31
+ * - Bottom elements (USB-C, speaker grilles)
32
+ * - data-zone annotations for DLC auto-derivation
33
+ *
34
+ * The SVG sits ON TOP of content with pointer-events: none.
35
+ * Bezels are opaque — they mask any content that spills over.
36
+ * Screen area is transparent — content shows through.
37
+ */
38
+ declare function IPhone17ProMaxSVG({ colorScheme, style }: DeviceSVGProps$5): react_jsx_runtime.JSX.Element;
39
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
40
+ declare const IPHONE_17_PRO_MAX_FRAME: {
41
+ readonly bezelTop: 23;
42
+ readonly bezelBottom: 23;
43
+ readonly bezelLeft: 15;
44
+ readonly bezelRight: 15;
45
+ readonly totalWidth: 470;
46
+ readonly totalHeight: 1002;
47
+ readonly screenWidth: 440;
48
+ readonly screenHeight: 956;
49
+ readonly screenRadius: 55;
50
+ };
51
+
52
+ /**
53
+ * iPhone 17 Pro — dimensions
54
+ *
55
+ * Screen: 402x874pt (logical points at 1x)
56
+ * Physical: 1206x2622px at 3x DPR
57
+ * Display: 6.3" LTPO Super Retina XDR OLED, 460 PPI
58
+ * Hardware: Dynamic Island, Action Button, Camera Control
59
+ * Frame: Titanium
60
+ */
61
+ declare const IPHONE_17_PRO_META: DeviceMeta;
62
+ declare const IPHONE_17_PRO_LAYOUT: DeviceLayoutData;
63
+
64
+ interface DeviceSVGProps$4 {
65
+ colorScheme?: "light" | "dark";
66
+ style?: React.CSSProperties;
67
+ }
68
+ /**
69
+ * iPhone 17 Pro SVG Frame
70
+ *
71
+ * Dimensions: 402x874 logical points (screen area)
72
+ * Full frame includes bezels: ~432x920pt total
73
+ *
74
+ * Structure:
75
+ * - Outer titanium frame with rounded corners
76
+ * - Screen cutout (transparent — content shows through)
77
+ * - Dynamic Island pill overlay
78
+ * - Side buttons (volume, action, power, camera control)
79
+ * - Bottom elements (USB-C, speaker grilles)
80
+ * - data-zone annotations for DLC auto-derivation
81
+ *
82
+ * The SVG sits ON TOP of content with pointer-events: none.
83
+ * Bezels are opaque — they mask any content that spills over.
84
+ * Screen area is transparent — content shows through.
85
+ */
86
+ declare function IPhone17ProSVG({ colorScheme, style }: DeviceSVGProps$4): react_jsx_runtime.JSX.Element;
87
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
88
+ declare const IPHONE_17_PRO_FRAME: {
89
+ readonly bezelTop: 23;
90
+ readonly bezelBottom: 23;
91
+ readonly bezelLeft: 15;
92
+ readonly bezelRight: 15;
93
+ readonly totalWidth: 432;
94
+ readonly totalHeight: 920;
95
+ readonly screenWidth: 402;
96
+ readonly screenHeight: 874;
97
+ readonly screenRadius: 55;
98
+ };
99
+
100
+ /**
101
+ * iPhone Air — dimensions
102
+ *
103
+ * Screen: 420x912pt (logical points at 1x)
104
+ * Physical: 1260x2736px at 3x DPR
105
+ * Display: 6.6" Super Retina XDR OLED, 460 PPI
106
+ * Hardware: Dynamic Island (no Action Button, no Camera Control)
107
+ * Frame: Aluminum (ultra-thin 5.8mm)
108
+ */
109
+ declare const IPHONE_AIR_META: DeviceMeta;
110
+ declare const IPHONE_AIR_LAYOUT: DeviceLayoutData;
111
+
112
+ interface DeviceSVGProps$3 {
113
+ colorScheme?: "light" | "dark";
114
+ style?: React.CSSProperties;
115
+ }
116
+ /**
117
+ * iPhone Air SVG Frame
118
+ *
119
+ * Dimensions: 420x912 logical points (screen area)
120
+ * Full frame includes bezels: ~440x952pt total
121
+ *
122
+ * Structure:
123
+ * - Outer aluminum frame with rounded corners (ultra-thin)
124
+ * - Screen cutout (transparent — content shows through)
125
+ * - Dynamic Island pill overlay
126
+ * - Side buttons (volume, power — no action button, no camera control)
127
+ * - Bottom elements (USB-C, speaker grilles)
128
+ * - data-zone annotations for DLC auto-derivation
129
+ *
130
+ * The SVG sits ON TOP of content with pointer-events: none.
131
+ * Bezels are opaque — they mask any content that spills over.
132
+ * Screen area is transparent — content shows through.
133
+ */
134
+ declare function IPhoneAirSVG({ colorScheme, style }: DeviceSVGProps$3): react_jsx_runtime.JSX.Element;
135
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
136
+ declare const IPHONE_AIR_FRAME: {
137
+ readonly bezelTop: 20;
138
+ readonly bezelBottom: 20;
139
+ readonly bezelLeft: 10;
140
+ readonly bezelRight: 10;
141
+ readonly totalWidth: 440;
142
+ readonly totalHeight: 952;
143
+ readonly screenWidth: 420;
144
+ readonly screenHeight: 912;
145
+ readonly screenRadius: 55;
146
+ };
147
+
148
+ /**
149
+ * iPhone 16e — dimensions (NOTCH device)
150
+ *
151
+ * Screen: 390x844pt (logical points at 1x)
152
+ * Physical: 1170x2532px at 3x DPR
153
+ * Display: 6.1" Super Retina XDR OLED, 460 PPI
154
+ * Hardware: Notch (no Action Button, no Camera Control)
155
+ * Frame: Aluminum
156
+ */
157
+ declare const IPHONE_16E_META: DeviceMeta;
158
+ declare const IPHONE_16E_LAYOUT: DeviceLayoutData;
159
+
160
+ interface DeviceSVGProps$2 {
161
+ colorScheme?: "light" | "dark";
162
+ style?: React.CSSProperties;
163
+ }
164
+ /**
165
+ * iPhone 16e SVG Frame (NOTCH device)
166
+ *
167
+ * Dimensions: 390x844 logical points (screen area)
168
+ * Full frame includes bezels: ~414x884pt total
169
+ *
170
+ * Structure:
171
+ * - Outer aluminum frame with rounded corners
172
+ * - Screen cutout (transparent — content shows through)
173
+ * - Notch cutout at top center (wider, taller than Dynamic Island)
174
+ * - Side buttons (volume, power — no action button, no camera control)
175
+ * - Bottom elements (USB-C, speaker grilles)
176
+ * - data-zone annotations for DLC auto-derivation
177
+ *
178
+ * The SVG sits ON TOP of content with pointer-events: none.
179
+ * Bezels are opaque — they mask any content that spills over.
180
+ * Screen area is transparent — content shows through.
181
+ */
182
+ declare function IPhone16eSVG({ colorScheme, style }: DeviceSVGProps$2): react_jsx_runtime.JSX.Element;
183
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
184
+ declare const IPHONE_16E_FRAME: {
185
+ readonly bezelTop: 20;
186
+ readonly bezelBottom: 20;
187
+ readonly bezelLeft: 12;
188
+ readonly bezelRight: 12;
189
+ readonly totalWidth: 414;
190
+ readonly totalHeight: 884;
191
+ readonly screenWidth: 390;
192
+ readonly screenHeight: 844;
193
+ readonly screenRadius: 50;
194
+ };
195
+
196
+ /**
197
+ * iPhone 16 — VERIFIED dimensions
198
+ *
199
+ * Screen: 393×852pt (logical points at 1x)
200
+ * Physical: 1179×2556px at 3x DPR
201
+ * Display: 6.1" Super Retina XDR OLED, 460 PPI
202
+ * Hardware: Dynamic Island, Camera Control
203
+ */
204
+ declare const IPHONE_16_META: DeviceMeta;
205
+ declare const IPHONE_16_LAYOUT: DeviceLayoutData;
206
+
207
+ interface DeviceSVGProps$1 {
208
+ colorScheme?: "light" | "dark";
209
+ style?: React.CSSProperties;
210
+ }
211
+ /**
212
+ * iPhone 16 SVG Frame
213
+ *
214
+ * Dimensions: 393x852 logical points (screen area)
215
+ * Full frame includes bezels: ~423x898pt total
216
+ *
217
+ * Structure:
218
+ * - Outer aluminum frame with rounded corners
219
+ * - Screen cutout (transparent — content shows through)
220
+ * - Dynamic Island pill overlay
221
+ * - Side buttons (volume, power, camera control — no action button)
222
+ * - Bottom elements (USB-C, speaker grilles)
223
+ * - data-zone annotations for DLC auto-derivation
224
+ *
225
+ * The SVG sits ON TOP of content with pointer-events: none.
226
+ * Bezels are opaque — they mask any content that spills over.
227
+ * Screen area is transparent — content shows through.
228
+ */
229
+ declare function IPhone16SVG({ colorScheme, style }: DeviceSVGProps$1): react_jsx_runtime.JSX.Element;
230
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
231
+ declare const IPHONE_16_FRAME: {
232
+ readonly bezelTop: 23;
233
+ readonly bezelBottom: 23;
234
+ readonly bezelLeft: 15;
235
+ readonly bezelRight: 15;
236
+ readonly totalWidth: 423;
237
+ readonly totalHeight: 898;
238
+ readonly screenWidth: 393;
239
+ readonly screenHeight: 852;
240
+ readonly screenRadius: 48;
241
+ };
242
+
243
+ /**
244
+ * iPhone SE (3rd Gen) — LEGACY device with home button
245
+ *
246
+ * Screen: 375x667pt (logical points at 1x)
247
+ * Physical: 750x1334px at 2x DPR
248
+ * Display: 4.7" Retina HD LCD, 326 PPI
249
+ * Hardware: Physical home button (Touch ID), no notch/island
250
+ * Frame: Aluminum, thick top/bottom bezels
251
+ */
252
+ declare const IPHONE_SE_3_META: DeviceMeta;
253
+ declare const IPHONE_SE_3_LAYOUT: DeviceLayoutData;
254
+
255
+ interface DeviceSVGProps {
256
+ colorScheme?: "light" | "dark";
257
+ style?: React.CSSProperties;
258
+ }
259
+ /**
260
+ * iPhone SE (3rd Gen) SVG Frame — LEGACY home button design
261
+ *
262
+ * Dimensions: 375x667 logical points (screen area)
263
+ * Full frame includes bezels: ~395x807pt total
264
+ *
265
+ * Structure:
266
+ * - Outer aluminum frame with rounded corners
267
+ * - Rectangular screen cutout (nearly square corners, no notch/island)
268
+ * - Thick top bezel with earpiece speaker slot + front camera
269
+ * - Thick bottom bezel with physical circular home button (Touch ID)
270
+ * - Side buttons (volume, power — no action button, no camera control)
271
+ * - Bottom elements (Lightning/USB-C, speaker grilles)
272
+ * - data-zone annotations for DLC auto-derivation
273
+ *
274
+ * The SVG sits ON TOP of content with pointer-events: none.
275
+ * Bezels are opaque — they mask any content that spills over.
276
+ * Screen area is transparent — content shows through.
277
+ */
278
+ declare function IPhoneSE3SVG({ colorScheme, style }: DeviceSVGProps): react_jsx_runtime.JSX.Element;
279
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
280
+ declare const IPHONE_SE_3_FRAME: {
281
+ readonly bezelTop: 70;
282
+ readonly bezelBottom: 70;
283
+ readonly bezelLeft: 10;
284
+ readonly bezelRight: 10;
285
+ readonly totalWidth: 395;
286
+ readonly totalHeight: 807;
287
+ readonly screenWidth: 375;
288
+ readonly screenHeight: 667;
289
+ readonly screenRadius: 5;
290
+ };
291
+
292
+ export { IPHONE_16E_FRAME, IPHONE_16E_LAYOUT, IPHONE_16E_META, IPHONE_16_FRAME, IPHONE_16_LAYOUT, IPHONE_16_META, IPHONE_17_PRO_FRAME, IPHONE_17_PRO_LAYOUT, IPHONE_17_PRO_MAX_FRAME, IPHONE_17_PRO_MAX_LAYOUT, IPHONE_17_PRO_MAX_META, IPHONE_17_PRO_META, IPHONE_AIR_FRAME, IPHONE_AIR_LAYOUT, IPHONE_AIR_META, IPHONE_SE_3_FRAME, IPHONE_SE_3_LAYOUT, IPHONE_SE_3_META, IPhone16SVG, IPhone16eSVG, IPhone17ProMaxSVG, IPhone17ProSVG, IPhoneAirSVG, IPhoneSE3SVG };
@@ -0,0 +1,292 @@
1
+ import { a as DeviceLayoutData, D as DeviceMeta } from '../contract-types-Cw1rmF3b.js';
2
+ import * as react_jsx_runtime from 'react/jsx-runtime';
3
+
4
+ /**
5
+ * iPhone 17 Pro Max — dimensions
6
+ *
7
+ * Screen: 440x956pt (logical points at 1x)
8
+ * Physical: 1320x2868px at 3x DPR
9
+ * Display: 6.9" LTPO Super Retina XDR OLED, 460 PPI
10
+ * Hardware: Dynamic Island, Action Button, Camera Control
11
+ * Frame: Titanium
12
+ */
13
+ declare const IPHONE_17_PRO_MAX_META: DeviceMeta;
14
+ declare const IPHONE_17_PRO_MAX_LAYOUT: DeviceLayoutData;
15
+
16
+ interface DeviceSVGProps$5 {
17
+ colorScheme?: "light" | "dark";
18
+ style?: React.CSSProperties;
19
+ }
20
+ /**
21
+ * iPhone 17 Pro Max SVG Frame
22
+ *
23
+ * Dimensions: 440x956 logical points (screen area)
24
+ * Full frame includes bezels: ~470x1002pt total
25
+ *
26
+ * Structure:
27
+ * - Outer titanium frame with rounded corners
28
+ * - Screen cutout (transparent — content shows through)
29
+ * - Dynamic Island pill overlay
30
+ * - Side buttons (volume, action, power, camera control)
31
+ * - Bottom elements (USB-C, speaker grilles)
32
+ * - data-zone annotations for DLC auto-derivation
33
+ *
34
+ * The SVG sits ON TOP of content with pointer-events: none.
35
+ * Bezels are opaque — they mask any content that spills over.
36
+ * Screen area is transparent — content shows through.
37
+ */
38
+ declare function IPhone17ProMaxSVG({ colorScheme, style }: DeviceSVGProps$5): react_jsx_runtime.JSX.Element;
39
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
40
+ declare const IPHONE_17_PRO_MAX_FRAME: {
41
+ readonly bezelTop: 23;
42
+ readonly bezelBottom: 23;
43
+ readonly bezelLeft: 15;
44
+ readonly bezelRight: 15;
45
+ readonly totalWidth: 470;
46
+ readonly totalHeight: 1002;
47
+ readonly screenWidth: 440;
48
+ readonly screenHeight: 956;
49
+ readonly screenRadius: 55;
50
+ };
51
+
52
+ /**
53
+ * iPhone 17 Pro — dimensions
54
+ *
55
+ * Screen: 402x874pt (logical points at 1x)
56
+ * Physical: 1206x2622px at 3x DPR
57
+ * Display: 6.3" LTPO Super Retina XDR OLED, 460 PPI
58
+ * Hardware: Dynamic Island, Action Button, Camera Control
59
+ * Frame: Titanium
60
+ */
61
+ declare const IPHONE_17_PRO_META: DeviceMeta;
62
+ declare const IPHONE_17_PRO_LAYOUT: DeviceLayoutData;
63
+
64
+ interface DeviceSVGProps$4 {
65
+ colorScheme?: "light" | "dark";
66
+ style?: React.CSSProperties;
67
+ }
68
+ /**
69
+ * iPhone 17 Pro SVG Frame
70
+ *
71
+ * Dimensions: 402x874 logical points (screen area)
72
+ * Full frame includes bezels: ~432x920pt total
73
+ *
74
+ * Structure:
75
+ * - Outer titanium frame with rounded corners
76
+ * - Screen cutout (transparent — content shows through)
77
+ * - Dynamic Island pill overlay
78
+ * - Side buttons (volume, action, power, camera control)
79
+ * - Bottom elements (USB-C, speaker grilles)
80
+ * - data-zone annotations for DLC auto-derivation
81
+ *
82
+ * The SVG sits ON TOP of content with pointer-events: none.
83
+ * Bezels are opaque — they mask any content that spills over.
84
+ * Screen area is transparent — content shows through.
85
+ */
86
+ declare function IPhone17ProSVG({ colorScheme, style }: DeviceSVGProps$4): react_jsx_runtime.JSX.Element;
87
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
88
+ declare const IPHONE_17_PRO_FRAME: {
89
+ readonly bezelTop: 23;
90
+ readonly bezelBottom: 23;
91
+ readonly bezelLeft: 15;
92
+ readonly bezelRight: 15;
93
+ readonly totalWidth: 432;
94
+ readonly totalHeight: 920;
95
+ readonly screenWidth: 402;
96
+ readonly screenHeight: 874;
97
+ readonly screenRadius: 55;
98
+ };
99
+
100
+ /**
101
+ * iPhone Air — dimensions
102
+ *
103
+ * Screen: 420x912pt (logical points at 1x)
104
+ * Physical: 1260x2736px at 3x DPR
105
+ * Display: 6.6" Super Retina XDR OLED, 460 PPI
106
+ * Hardware: Dynamic Island (no Action Button, no Camera Control)
107
+ * Frame: Aluminum (ultra-thin 5.8mm)
108
+ */
109
+ declare const IPHONE_AIR_META: DeviceMeta;
110
+ declare const IPHONE_AIR_LAYOUT: DeviceLayoutData;
111
+
112
+ interface DeviceSVGProps$3 {
113
+ colorScheme?: "light" | "dark";
114
+ style?: React.CSSProperties;
115
+ }
116
+ /**
117
+ * iPhone Air SVG Frame
118
+ *
119
+ * Dimensions: 420x912 logical points (screen area)
120
+ * Full frame includes bezels: ~440x952pt total
121
+ *
122
+ * Structure:
123
+ * - Outer aluminum frame with rounded corners (ultra-thin)
124
+ * - Screen cutout (transparent — content shows through)
125
+ * - Dynamic Island pill overlay
126
+ * - Side buttons (volume, power — no action button, no camera control)
127
+ * - Bottom elements (USB-C, speaker grilles)
128
+ * - data-zone annotations for DLC auto-derivation
129
+ *
130
+ * The SVG sits ON TOP of content with pointer-events: none.
131
+ * Bezels are opaque — they mask any content that spills over.
132
+ * Screen area is transparent — content shows through.
133
+ */
134
+ declare function IPhoneAirSVG({ colorScheme, style }: DeviceSVGProps$3): react_jsx_runtime.JSX.Element;
135
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
136
+ declare const IPHONE_AIR_FRAME: {
137
+ readonly bezelTop: 20;
138
+ readonly bezelBottom: 20;
139
+ readonly bezelLeft: 10;
140
+ readonly bezelRight: 10;
141
+ readonly totalWidth: 440;
142
+ readonly totalHeight: 952;
143
+ readonly screenWidth: 420;
144
+ readonly screenHeight: 912;
145
+ readonly screenRadius: 55;
146
+ };
147
+
148
+ /**
149
+ * iPhone 16e — dimensions (NOTCH device)
150
+ *
151
+ * Screen: 390x844pt (logical points at 1x)
152
+ * Physical: 1170x2532px at 3x DPR
153
+ * Display: 6.1" Super Retina XDR OLED, 460 PPI
154
+ * Hardware: Notch (no Action Button, no Camera Control)
155
+ * Frame: Aluminum
156
+ */
157
+ declare const IPHONE_16E_META: DeviceMeta;
158
+ declare const IPHONE_16E_LAYOUT: DeviceLayoutData;
159
+
160
+ interface DeviceSVGProps$2 {
161
+ colorScheme?: "light" | "dark";
162
+ style?: React.CSSProperties;
163
+ }
164
+ /**
165
+ * iPhone 16e SVG Frame (NOTCH device)
166
+ *
167
+ * Dimensions: 390x844 logical points (screen area)
168
+ * Full frame includes bezels: ~414x884pt total
169
+ *
170
+ * Structure:
171
+ * - Outer aluminum frame with rounded corners
172
+ * - Screen cutout (transparent — content shows through)
173
+ * - Notch cutout at top center (wider, taller than Dynamic Island)
174
+ * - Side buttons (volume, power — no action button, no camera control)
175
+ * - Bottom elements (USB-C, speaker grilles)
176
+ * - data-zone annotations for DLC auto-derivation
177
+ *
178
+ * The SVG sits ON TOP of content with pointer-events: none.
179
+ * Bezels are opaque — they mask any content that spills over.
180
+ * Screen area is transparent — content shows through.
181
+ */
182
+ declare function IPhone16eSVG({ colorScheme, style }: DeviceSVGProps$2): react_jsx_runtime.JSX.Element;
183
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
184
+ declare const IPHONE_16E_FRAME: {
185
+ readonly bezelTop: 20;
186
+ readonly bezelBottom: 20;
187
+ readonly bezelLeft: 12;
188
+ readonly bezelRight: 12;
189
+ readonly totalWidth: 414;
190
+ readonly totalHeight: 884;
191
+ readonly screenWidth: 390;
192
+ readonly screenHeight: 844;
193
+ readonly screenRadius: 50;
194
+ };
195
+
196
+ /**
197
+ * iPhone 16 — VERIFIED dimensions
198
+ *
199
+ * Screen: 393×852pt (logical points at 1x)
200
+ * Physical: 1179×2556px at 3x DPR
201
+ * Display: 6.1" Super Retina XDR OLED, 460 PPI
202
+ * Hardware: Dynamic Island, Camera Control
203
+ */
204
+ declare const IPHONE_16_META: DeviceMeta;
205
+ declare const IPHONE_16_LAYOUT: DeviceLayoutData;
206
+
207
+ interface DeviceSVGProps$1 {
208
+ colorScheme?: "light" | "dark";
209
+ style?: React.CSSProperties;
210
+ }
211
+ /**
212
+ * iPhone 16 SVG Frame
213
+ *
214
+ * Dimensions: 393x852 logical points (screen area)
215
+ * Full frame includes bezels: ~423x898pt total
216
+ *
217
+ * Structure:
218
+ * - Outer aluminum frame with rounded corners
219
+ * - Screen cutout (transparent — content shows through)
220
+ * - Dynamic Island pill overlay
221
+ * - Side buttons (volume, power, camera control — no action button)
222
+ * - Bottom elements (USB-C, speaker grilles)
223
+ * - data-zone annotations for DLC auto-derivation
224
+ *
225
+ * The SVG sits ON TOP of content with pointer-events: none.
226
+ * Bezels are opaque — they mask any content that spills over.
227
+ * Screen area is transparent — content shows through.
228
+ */
229
+ declare function IPhone16SVG({ colorScheme, style }: DeviceSVGProps$1): react_jsx_runtime.JSX.Element;
230
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
231
+ declare const IPHONE_16_FRAME: {
232
+ readonly bezelTop: 23;
233
+ readonly bezelBottom: 23;
234
+ readonly bezelLeft: 15;
235
+ readonly bezelRight: 15;
236
+ readonly totalWidth: 423;
237
+ readonly totalHeight: 898;
238
+ readonly screenWidth: 393;
239
+ readonly screenHeight: 852;
240
+ readonly screenRadius: 48;
241
+ };
242
+
243
+ /**
244
+ * iPhone SE (3rd Gen) — LEGACY device with home button
245
+ *
246
+ * Screen: 375x667pt (logical points at 1x)
247
+ * Physical: 750x1334px at 2x DPR
248
+ * Display: 4.7" Retina HD LCD, 326 PPI
249
+ * Hardware: Physical home button (Touch ID), no notch/island
250
+ * Frame: Aluminum, thick top/bottom bezels
251
+ */
252
+ declare const IPHONE_SE_3_META: DeviceMeta;
253
+ declare const IPHONE_SE_3_LAYOUT: DeviceLayoutData;
254
+
255
+ interface DeviceSVGProps {
256
+ colorScheme?: "light" | "dark";
257
+ style?: React.CSSProperties;
258
+ }
259
+ /**
260
+ * iPhone SE (3rd Gen) SVG Frame — LEGACY home button design
261
+ *
262
+ * Dimensions: 375x667 logical points (screen area)
263
+ * Full frame includes bezels: ~395x807pt total
264
+ *
265
+ * Structure:
266
+ * - Outer aluminum frame with rounded corners
267
+ * - Rectangular screen cutout (nearly square corners, no notch/island)
268
+ * - Thick top bezel with earpiece speaker slot + front camera
269
+ * - Thick bottom bezel with physical circular home button (Touch ID)
270
+ * - Side buttons (volume, power — no action button, no camera control)
271
+ * - Bottom elements (Lightning/USB-C, speaker grilles)
272
+ * - data-zone annotations for DLC auto-derivation
273
+ *
274
+ * The SVG sits ON TOP of content with pointer-events: none.
275
+ * Bezels are opaque — they mask any content that spills over.
276
+ * Screen area is transparent — content shows through.
277
+ */
278
+ declare function IPhoneSE3SVG({ colorScheme, style }: DeviceSVGProps): react_jsx_runtime.JSX.Element;
279
+ /** Frame dimensions needed by DeviceFrame to position content correctly */
280
+ declare const IPHONE_SE_3_FRAME: {
281
+ readonly bezelTop: 70;
282
+ readonly bezelBottom: 70;
283
+ readonly bezelLeft: 10;
284
+ readonly bezelRight: 10;
285
+ readonly totalWidth: 395;
286
+ readonly totalHeight: 807;
287
+ readonly screenWidth: 375;
288
+ readonly screenHeight: 667;
289
+ readonly screenRadius: 5;
290
+ };
291
+
292
+ export { IPHONE_16E_FRAME, IPHONE_16E_LAYOUT, IPHONE_16E_META, IPHONE_16_FRAME, IPHONE_16_LAYOUT, IPHONE_16_META, IPHONE_17_PRO_FRAME, IPHONE_17_PRO_LAYOUT, IPHONE_17_PRO_MAX_FRAME, IPHONE_17_PRO_MAX_LAYOUT, IPHONE_17_PRO_MAX_META, IPHONE_17_PRO_META, IPHONE_AIR_FRAME, IPHONE_AIR_LAYOUT, IPHONE_AIR_META, IPHONE_SE_3_FRAME, IPHONE_SE_3_LAYOUT, IPHONE_SE_3_META, IPhone16SVG, IPhone16eSVG, IPhone17ProMaxSVG, IPhone17ProSVG, IPhoneAirSVG, IPhoneSE3SVG };
@@ -0,0 +1,3 @@
1
+ export { IPHONE_16E_FRAME, IPHONE_16E_LAYOUT, IPHONE_16E_META, IPHONE_16_FRAME, IPHONE_16_LAYOUT, IPHONE_16_META, IPHONE_17_PRO_FRAME, IPHONE_17_PRO_LAYOUT, IPHONE_17_PRO_MAX_FRAME, IPHONE_17_PRO_MAX_LAYOUT, IPHONE_17_PRO_MAX_META, IPHONE_17_PRO_META, IPHONE_AIR_FRAME, IPHONE_AIR_LAYOUT, IPHONE_AIR_META, IPHONE_SE_3_FRAME, IPHONE_SE_3_LAYOUT, IPHONE_SE_3_META, IPhone16SVG, IPhone16eSVG, IPhone17ProMaxSVG, IPhone17ProSVG, IPhoneAirSVG, IPhoneSE3SVG } from '../chunk-DGX4WRAK.js';
2
+ //# sourceMappingURL=index.js.map
3
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}
package/package.json ADDED
@@ -0,0 +1,64 @@
1
+ {
2
+ "name": "@biela.dev/devices",
3
+ "version": "0.1.0",
4
+ "description": "Built-in device SVG library and layout contracts for BielaFrame — 11 devices covering every unique screen class",
5
+ "license": "MIT",
6
+ "author": "Biela Enterprise <alex@cocindau.com>",
7
+ "type": "module",
8
+ "main": "./dist/index.cjs",
9
+ "module": "./dist/index.js",
10
+ "types": "./dist/index.d.ts",
11
+ "exports": {
12
+ ".": {
13
+ "import": {
14
+ "types": "./dist/index.d.ts",
15
+ "default": "./dist/index.js"
16
+ },
17
+ "require": {
18
+ "types": "./dist/index.d.cts",
19
+ "default": "./dist/index.cjs"
20
+ }
21
+ },
22
+ "./ios/*": {
23
+ "import": {
24
+ "types": "./dist/ios/*.d.ts",
25
+ "default": "./dist/ios/*.js"
26
+ },
27
+ "require": {
28
+ "types": "./dist/ios/*.d.cts",
29
+ "default": "./dist/ios/*.cjs"
30
+ }
31
+ },
32
+ "./android/*": {
33
+ "import": {
34
+ "types": "./dist/android/*.d.ts",
35
+ "default": "./dist/android/*.js"
36
+ },
37
+ "require": {
38
+ "types": "./dist/android/*.d.cts",
39
+ "default": "./dist/android/*.cjs"
40
+ }
41
+ }
42
+ },
43
+ "files": ["dist"],
44
+ "sideEffects": false,
45
+ "keywords": ["device", "mockup", "iphone", "android", "pixel", "galaxy", "svg", "react", "mobile"],
46
+ "scripts": {
47
+ "build": "tsup",
48
+ "dev": "tsup --watch",
49
+ "test": "vitest run",
50
+ "test:watch": "vitest",
51
+ "typecheck": "tsc --noEmit",
52
+ "clean": "rm -rf dist"
53
+ },
54
+ "peerDependencies": {
55
+ "react": ">=18.0.0"
56
+ },
57
+ "devDependencies": {
58
+ "@types/react": "^18.3.0",
59
+ "react": "^18.3.0",
60
+ "tsup": "^8.3.0",
61
+ "typescript": "^5.7.0",
62
+ "vitest": "^2.1.0"
63
+ }
64
+ }