@seamapi/react 0.16.0 → 0.17.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.
Files changed (197) hide show
  1. package/README.md +5 -2
  2. package/index.css +403 -71
  3. package/index.css.map +1 -1
  4. package/index.min.css +1 -1
  5. package/index.min.css.map +1 -1
  6. package/lib/NavigationProvider.d.ts +27 -0
  7. package/lib/NavigationProvider.js +36 -0
  8. package/lib/NavigationProvider.js.map +1 -0
  9. package/lib/NavigationView.d.ts +5 -0
  10. package/lib/NavigationView.js +25 -0
  11. package/lib/NavigationView.js.map +1 -0
  12. package/lib/icons/LockLocked.d.ts +2 -0
  13. package/lib/icons/LockLocked.js +5 -0
  14. package/lib/icons/LockLocked.js.map +1 -0
  15. package/lib/icons/LockUnlocked.d.ts +2 -0
  16. package/lib/icons/LockUnlocked.js +5 -0
  17. package/lib/icons/LockUnlocked.js.map +1 -0
  18. package/lib/seam/access-codes/use-access-code.d.ts +8 -0
  19. package/lib/seam/access-codes/use-access-code.js +32 -0
  20. package/lib/seam/access-codes/use-access-code.js.map +1 -0
  21. package/lib/seam/access-codes/use-access-codes.d.ts +9 -0
  22. package/lib/seam/access-codes/use-access-codes.js +18 -0
  23. package/lib/seam/access-codes/use-access-codes.js.map +1 -0
  24. package/lib/seam/devices/types.d.ts +2 -0
  25. package/lib/seam/devices/types.js +2 -0
  26. package/lib/seam/devices/types.js.map +1 -0
  27. package/lib/seam/devices/use-device.d.ts +9 -0
  28. package/lib/seam/devices/use-device.js +56 -0
  29. package/lib/seam/devices/use-device.js.map +1 -0
  30. package/lib/seam/devices/use-devices.d.ts +4 -9
  31. package/lib/seam/devices/use-devices.js +2 -1
  32. package/lib/seam/devices/use-devices.js.map +1 -1
  33. package/lib/seam/index.d.ts +4 -1
  34. package/lib/seam/index.js +4 -1
  35. package/lib/seam/index.js.map +1 -1
  36. package/lib/seam/use-seam-client.js +12 -9
  37. package/lib/seam/use-seam-client.js.map +1 -1
  38. package/lib/seam/use-seam-query-result.js.map +1 -0
  39. package/lib/ui/AccessCodeDetails/AccessCodeDetails.d.ts +4 -0
  40. package/lib/ui/AccessCodeDetails/AccessCodeDetails.js +63 -0
  41. package/lib/ui/AccessCodeDetails/AccessCodeDetails.js.map +1 -0
  42. package/lib/ui/AccessCodeDetails/AccessCodeDevice.d.ts +3 -0
  43. package/lib/ui/AccessCodeDetails/AccessCodeDevice.js +25 -0
  44. package/lib/ui/AccessCodeDetails/AccessCodeDevice.js.map +1 -0
  45. package/lib/ui/AccessCodeTable/AccessCodeTable.d.ts +0 -1
  46. package/lib/ui/AccessCodeTable/AccessCodeTable.js +14 -4
  47. package/lib/ui/AccessCodeTable/AccessCodeTable.js.map +1 -1
  48. package/lib/ui/AccessCodeTable/AccessCodeTableContent.d.ts +5 -0
  49. package/lib/ui/AccessCodeTable/AccessCodeTableContent.js +19 -0
  50. package/lib/ui/AccessCodeTable/AccessCodeTableContent.js.map +1 -0
  51. package/lib/ui/AccessCodeTable/CodeDetails.js +1 -1
  52. package/lib/ui/AccessCodeTable/CodeDetails.js.map +1 -1
  53. package/lib/ui/Button.d.ts +8 -0
  54. package/lib/ui/Button.js +8 -0
  55. package/lib/ui/Button.js.map +1 -0
  56. package/lib/ui/DeviceDetails/DeviceDetails.d.ts +2 -3
  57. package/lib/ui/DeviceDetails/DeviceDetails.js +32 -13
  58. package/lib/ui/DeviceDetails/DeviceDetails.js.map +1 -1
  59. package/lib/ui/DeviceDetails/DeviceModel.d.ts +7 -0
  60. package/lib/ui/DeviceDetails/DeviceModel.js +18 -0
  61. package/lib/ui/DeviceDetails/DeviceModel.js.map +1 -0
  62. package/lib/ui/DeviceTable/DeviceTable.d.ts +7 -0
  63. package/lib/ui/DeviceTable/DeviceTable.js +43 -0
  64. package/lib/ui/DeviceTable/DeviceTable.js.map +1 -0
  65. package/lib/ui/IconButton.js +1 -1
  66. package/lib/ui/IconButton.js.map +1 -1
  67. package/lib/ui/Table/TableRow.d.ts +3 -1
  68. package/lib/ui/Table/TableRow.js +1 -1
  69. package/lib/ui/Table/TableRow.js.map +1 -1
  70. package/lib/ui/TextButton.d.ts +7 -0
  71. package/lib/ui/TextButton.js +5 -0
  72. package/lib/ui/TextButton.js.map +1 -0
  73. package/lib/ui/TextField/SearchTextField.d.ts +1 -1
  74. package/lib/ui/TextField/SearchTextField.js +1 -1
  75. package/lib/ui/TextField/SearchTextField.js.map +1 -1
  76. package/lib/ui/device/BatteryStatus.d.ts +5 -0
  77. package/lib/ui/{DeviceDetails → device}/BatteryStatus.js +5 -6
  78. package/lib/ui/device/BatteryStatus.js.map +1 -0
  79. package/lib/ui/{DeviceDetails → device}/DeviceImage.d.ts +2 -1
  80. package/lib/ui/{DeviceDetails → device}/DeviceImage.js +2 -2
  81. package/lib/ui/device/DeviceImage.js.map +1 -0
  82. package/lib/ui/device/LockStatus.d.ts +5 -0
  83. package/lib/ui/device/LockStatus.js +19 -0
  84. package/lib/ui/device/LockStatus.js.map +1 -0
  85. package/lib/ui/device/OnlineStatus.d.ts +5 -0
  86. package/lib/ui/{DeviceDetails → device}/OnlineStatus.js +4 -5
  87. package/lib/ui/device/OnlineStatus.js.map +1 -0
  88. package/lib/ui/index.d.ts +3 -1
  89. package/lib/ui/index.js +3 -1
  90. package/lib/ui/index.js.map +1 -1
  91. package/lib/ui/layout/ContentHeader.d.ts +1 -2
  92. package/lib/ui/layout/ContentHeader.js +7 -1
  93. package/lib/ui/layout/ContentHeader.js.map +1 -1
  94. package/package.json +8 -7
  95. package/src/icons/lock-locked.svg +8 -0
  96. package/src/icons/lock-unlocked.svg +9 -0
  97. package/src/lib/NavigationProvider.tsx +86 -0
  98. package/src/lib/NavigationView.tsx +32 -0
  99. package/src/lib/icons/LockLocked.tsx +32 -0
  100. package/src/lib/icons/LockUnlocked.tsx +34 -0
  101. package/src/lib/seam/access-codes/use-access-code.ts +45 -0
  102. package/src/lib/seam/access-codes/use-access-codes.ts +39 -0
  103. package/src/lib/seam/devices/types.ts +5 -0
  104. package/src/lib/seam/devices/use-device.ts +79 -0
  105. package/src/lib/seam/devices/use-devices.ts +13 -8
  106. package/src/lib/seam/index.ts +4 -1
  107. package/src/lib/seam/use-seam-client.ts +12 -9
  108. package/src/lib/ui/AccessCodeDetails/AccessCodeDetails.tsx +144 -0
  109. package/src/lib/ui/AccessCodeDetails/AccessCodeDevice.tsx +43 -0
  110. package/src/lib/ui/AccessCodeTable/AccessCodeTable.tsx +20 -16
  111. package/src/lib/ui/AccessCodeTable/AccessCodeTableContent.tsx +57 -0
  112. package/src/lib/ui/AccessCodeTable/CodeDetails.tsx +1 -1
  113. package/src/lib/ui/Button.tsx +26 -0
  114. package/src/lib/ui/DeviceDetails/DeviceDetails.tsx +56 -29
  115. package/src/lib/ui/DeviceDetails/DeviceModel.tsx +34 -0
  116. package/src/lib/ui/DeviceTable/DeviceTable.tsx +94 -0
  117. package/src/lib/ui/IconButton.tsx +1 -1
  118. package/src/lib/ui/Table/TableRow.tsx +8 -2
  119. package/src/lib/ui/TextButton.tsx +15 -0
  120. package/src/lib/ui/TextField/SearchTextField.tsx +1 -1
  121. package/src/lib/ui/{DeviceDetails → device}/BatteryStatus.tsx +12 -14
  122. package/src/lib/ui/device/DeviceImage.tsx +15 -0
  123. package/src/lib/ui/device/LockStatus.tsx +46 -0
  124. package/src/lib/ui/{DeviceDetails → device}/OnlineStatus.tsx +15 -11
  125. package/src/lib/ui/index.ts +3 -1
  126. package/src/lib/ui/layout/ContentHeader.tsx +11 -6
  127. package/src/styles/_access-code-details.scss +121 -0
  128. package/src/styles/_access-code-table.scss +34 -38
  129. package/src/styles/_buttons.scss +125 -8
  130. package/src/styles/_colors.scss +30 -0
  131. package/src/styles/_device-details.scss +28 -9
  132. package/src/styles/_device-table.scss +63 -0
  133. package/src/styles/_icons.scss +9 -0
  134. package/src/styles/_inputs.scss +3 -1
  135. package/src/styles/_layout.scss +5 -2
  136. package/src/styles/_main.scss +10 -16
  137. package/src/styles/_reset.scss +114 -0
  138. package/src/styles/_tables.scss +6 -0
  139. package/src/styles/_typography.scss +18 -2
  140. package/lib/hooks/use-access-codes.d.ts +0 -5
  141. package/lib/hooks/use-access-codes.js +0 -16
  142. package/lib/hooks/use-access-codes.js.map +0 -1
  143. package/lib/hooks/use-device.d.ts +0 -5
  144. package/lib/hooks/use-device.js +0 -17
  145. package/lib/hooks/use-device.js.map +0 -1
  146. package/lib/hooks/use-devices.d.ts +0 -1
  147. package/lib/hooks/use-devices.js +0 -2
  148. package/lib/hooks/use-devices.js.map +0 -1
  149. package/lib/hooks/use-seam-client.d.ts +0 -1
  150. package/lib/hooks/use-seam-client.js +0 -2
  151. package/lib/hooks/use-seam-client.js.map +0 -1
  152. package/lib/seam/devices/index.d.ts +0 -1
  153. package/lib/seam/devices/index.js +0 -2
  154. package/lib/seam/devices/index.js.map +0 -1
  155. package/lib/types/use-seam-query-result.js.map +0 -1
  156. package/lib/ui/AccessCodeTable/index.d.ts +0 -2
  157. package/lib/ui/AccessCodeTable/index.js +0 -3
  158. package/lib/ui/AccessCodeTable/index.js.map +0 -1
  159. package/lib/ui/DeviceDetails/BatteryStatus.d.ts +0 -4
  160. package/lib/ui/DeviceDetails/BatteryStatus.js.map +0 -1
  161. package/lib/ui/DeviceDetails/DeviceImage.js.map +0 -1
  162. package/lib/ui/DeviceDetails/ModelStatus.d.ts +0 -4
  163. package/lib/ui/DeviceDetails/ModelStatus.js +0 -13
  164. package/lib/ui/DeviceDetails/ModelStatus.js.map +0 -1
  165. package/lib/ui/DeviceDetails/OnlineStatus.d.ts +0 -4
  166. package/lib/ui/DeviceDetails/OnlineStatus.js.map +0 -1
  167. package/lib/ui/DeviceDetails/index.d.ts +0 -5
  168. package/lib/ui/DeviceDetails/index.js +0 -6
  169. package/lib/ui/DeviceDetails/index.js.map +0 -1
  170. package/lib/ui/DeviceManager/DeviceManager.d.ts +0 -6
  171. package/lib/ui/DeviceManager/DeviceManager.js +0 -24
  172. package/lib/ui/DeviceManager/DeviceManager.js.map +0 -1
  173. package/lib/ui/DeviceManager/index.d.ts +0 -1
  174. package/lib/ui/DeviceManager/index.js +0 -2
  175. package/lib/ui/DeviceManager/index.js.map +0 -1
  176. package/lib/ui/Table/index.d.ts +0 -5
  177. package/lib/ui/Table/index.js +0 -6
  178. package/lib/ui/Table/index.js.map +0 -1
  179. package/lib/ui/TextField/index.d.ts +0 -2
  180. package/lib/ui/TextField/index.js +0 -3
  181. package/lib/ui/TextField/index.js.map +0 -1
  182. package/src/lib/hooks/use-access-codes.ts +0 -21
  183. package/src/lib/hooks/use-device.ts +0 -26
  184. package/src/lib/hooks/use-devices.ts +0 -1
  185. package/src/lib/hooks/use-seam-client.ts +0 -1
  186. package/src/lib/seam/devices/index.ts +0 -1
  187. package/src/lib/ui/AccessCodeTable/index.ts +0 -2
  188. package/src/lib/ui/DeviceDetails/DeviceImage.tsx +0 -12
  189. package/src/lib/ui/DeviceDetails/ModelStatus.tsx +0 -25
  190. package/src/lib/ui/DeviceDetails/index.ts +0 -5
  191. package/src/lib/ui/DeviceManager/DeviceManager.tsx +0 -52
  192. package/src/lib/ui/DeviceManager/index.ts +0 -1
  193. package/src/lib/ui/Table/index.ts +0 -5
  194. package/src/lib/ui/TextField/index.ts +0 -2
  195. /package/lib/{types → seam}/use-seam-query-result.d.ts +0 -0
  196. /package/lib/{types → seam}/use-seam-query-result.js +0 -0
  197. /package/src/lib/{types → seam}/use-seam-query-result.ts +0 -0
package/README.md CHANGED
@@ -36,14 +36,14 @@ $ npm install @seamapi/react
36
36
  ```ts
37
37
  import '@seamapi/react/index.css'
38
38
 
39
- import { SeamProvider, DeviceManager } from '@seamapi/react'
39
+ import { SeamProvider, DeviceTable } from '@seamapi/react'
40
40
 
41
41
  export const App = () => {
42
42
  return (
43
43
  <SeamProvider publishableKey='your_publishable_key'>
44
44
  <main>
45
45
  <h1>My App</h1>
46
- <DeviceManager />
46
+ <DeviceTable />
47
47
  </main>
48
48
  </SeamProvider>
49
49
  )
@@ -229,6 +229,7 @@ The following repository secrets must be set on [GitHub Actions]:
229
229
  The following repository variables must be set on [GitHub Actions]:
230
230
 
231
231
  - `STORYBOOK_SEAM_PUBLISHABLE_KEY`: The Seam publishable key to use with Storybook.
232
+ - `STORYBOOK_SEAM_USER_IDENTIFIER_KEY`: The Seam user identifer key to use with Storybook.
232
233
 
233
234
  [GitHub Actions]: https://github.com/features/actions
234
235
  [GPG private key]: https://github.com/marketplace/actions/import-gpg#prerequisites
@@ -240,7 +241,9 @@ _Vercel should already be configured: this section is for reference only._
240
241
  The following environment variables must be set on [Vercel]:
241
242
 
242
243
  - `SEAM_PUBLISHABLE_KEY`: The Seam publishable key to use with the examples.
244
+ - `SEAM_USER_IDENTIFIER_KEY`: The Seam user identifer key to use with the examples..
243
245
  - `STORYBOOK_SEAM_PUBLISHABLE_KEY`: The Seam publishable key to use with Storybook.
246
+ - `STORYBOOK_SEAM_USER_IDENTIFIER_KEY`: The Seam user identifer key to use with Storybook.
244
247
 
245
248
  [Vercel]: https://vercel.com/seamapi/react
246
249
 
package/index.css CHANGED
@@ -1,15 +1,108 @@
1
+ /**
2
+ * CSS Reset heavily inspired by Fraser Boag's reset.
3
+ * Source: https://www.boag.online/blog/css-reset
4
+ */
1
5
  .seam-components {
2
6
  font-family: "Source Sans Pro", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
3
- --primary: #007afc;
4
- --text-gray-1: #6e7179;
5
- --text-gray-2: #9da1a9;
6
- --text-gray-3: #d5d8dc;
7
- --input-border: #d5d8dc;
8
- --bg-a: #f1f3f4;
9
- --status-red-alert: #e36857;
10
- --item-hover-bg: #f4f6f8;
11
- /* stylelint-disable */
12
- @import 'the-new-css-reset/css/reset.css';
7
+ }
8
+ .seam-components *,
9
+ .seam-components *::before,
10
+ .seam-components *::after {
11
+ box-sizing: border-box;
12
+ }
13
+ .seam-components html,
14
+ .seam-components body,
15
+ .seam-components div,
16
+ .seam-components span,
17
+ .seam-components object,
18
+ .seam-components iframe,
19
+ .seam-components figure,
20
+ .seam-components h1,
21
+ .seam-components h2,
22
+ .seam-components h3,
23
+ .seam-components h4,
24
+ .seam-components h5,
25
+ .seam-components h6,
26
+ .seam-components p,
27
+ .seam-components blockquote,
28
+ .seam-components pre,
29
+ .seam-components a,
30
+ .seam-components code,
31
+ .seam-components em,
32
+ .seam-components img,
33
+ .seam-components small,
34
+ .seam-components strike,
35
+ .seam-components strong,
36
+ .seam-components sub,
37
+ .seam-components sup,
38
+ .seam-components tt,
39
+ .seam-components b,
40
+ .seam-components u,
41
+ .seam-components i,
42
+ .seam-components ol,
43
+ .seam-components ul,
44
+ .seam-components li,
45
+ .seam-components fieldset,
46
+ .seam-components form,
47
+ .seam-components label,
48
+ .seam-components table,
49
+ .seam-components caption,
50
+ .seam-components tbody,
51
+ .seam-components tfoot,
52
+ .seam-components thead,
53
+ .seam-components tr,
54
+ .seam-components th,
55
+ .seam-components td,
56
+ .seam-components main,
57
+ .seam-components canvas,
58
+ .seam-components embed,
59
+ .seam-components footer,
60
+ .seam-components header,
61
+ .seam-components nav,
62
+ .seam-components section,
63
+ .seam-components video {
64
+ margin: 0;
65
+ padding: 0;
66
+ border: 0;
67
+ font-size: 100%;
68
+ font-family: inherit;
69
+ vertical-align: baseline;
70
+ text-rendering: optimizelegibility;
71
+ -webkit-font-smoothing: antialiased;
72
+ text-size-adjust: none;
73
+ }
74
+ .seam-components footer,
75
+ .seam-components header,
76
+ .seam-components nav,
77
+ .seam-components section,
78
+ .seam-components main {
79
+ display: block;
80
+ }
81
+ .seam-components body {
82
+ line-height: 1;
83
+ }
84
+ .seam-components ol,
85
+ .seam-components ul {
86
+ list-style: none;
87
+ }
88
+ .seam-components blockquote,
89
+ .seam-components q {
90
+ quotes: none;
91
+ }
92
+ .seam-components blockquote::before,
93
+ .seam-components blockquote::after,
94
+ .seam-components q::before,
95
+ .seam-components q::after {
96
+ content: "";
97
+ content: none;
98
+ }
99
+ .seam-components table {
100
+ border-collapse: collapse;
101
+ border-spacing: 0;
102
+ }
103
+ .seam-components input {
104
+ appearance: none;
105
+ border-radius: 0;
13
106
  }
14
107
  .seam-components h1,
15
108
  .seam-components h2,
@@ -20,15 +113,20 @@
20
113
  font-weight: 600;
21
114
  }
22
115
  .seam-components .seam-caption {
23
- color: var(--text-gray-2);
116
+ color: #9da1a9;
24
117
  }
25
118
  .seam-components .seam-text-danger {
26
- color: var(--status-red-alert);
119
+ color: #e36857;
120
+ }
121
+ .seam-components html {
122
+ color: #232b3a;
27
123
  }
28
124
  .seam-components .seam-table-header {
29
125
  display: flex;
30
126
  justify-content: space-between;
31
127
  align-items: center;
128
+ height: 56px;
129
+ padding: 0 16px;
32
130
  }
33
131
  .seam-components .seam-table-title {
34
132
  font-size: 21px;
@@ -42,6 +140,7 @@
42
140
  display: flex;
43
141
  padding: 4px;
44
142
  height: 72px;
143
+ border-bottom: 1px solid #eee;
45
144
  }
46
145
  .seam-components .seam-table-row:hover {
47
146
  background: rgb(244, 246, 248);
@@ -49,6 +148,7 @@
49
148
  .seam-components .seam-table-row .seam-title {
50
149
  font-weight: 600;
51
150
  font-size: 18px;
151
+ line-height: 132%;
52
152
  }
53
153
  .seam-components .seam-table-cell {
54
154
  display: flex;
@@ -58,94 +158,129 @@
58
158
  .seam-components .seam-text-field {
59
159
  padding: 0 8px;
60
160
  height: 40px;
61
- border: 1px solid var(--input-border);
161
+ border: 1px solid #d5d8dc;
162
+ border-radius: 8px;
163
+ }
164
+ .seam-components .seam-btn {
165
+ font-family: "Source Sans Pro", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
166
+ font-weight: 600;
167
+ cursor: pointer;
168
+ }
169
+ .seam-components .seam-btn.seam-btn-small {
170
+ font-size: 14px;
171
+ line-height: 22px;
172
+ border-radius: 6px;
173
+ padding: 4px 10px;
174
+ }
175
+ .seam-components .seam-btn.seam-btn-medium {
176
+ font-size: 16px;
177
+ line-height: 26px;
178
+ border-radius: 7px;
179
+ padding: 6px 16px;
180
+ }
181
+ .seam-components .seam-btn.seam-btn-large {
182
+ font-size: 19px;
183
+ line-height: 30px;
62
184
  border-radius: 8px;
185
+ padding: 8px 22px;
186
+ }
187
+ .seam-components .seam-btn.seam-btn-solid {
188
+ background: #007afc;
189
+ color: #fff;
190
+ border: 1px solid #007afc;
191
+ }
192
+ .seam-components .seam-btn.seam-btn-solid:hover {
193
+ background: #006ee3;
194
+ border-color: #006ee3;
195
+ }
196
+ .seam-components .seam-btn.seam-btn-solid.seam-btn-disabled, .seam-components .seam-btn.seam-btn-solid:disabled {
197
+ background: #c1dfff;
198
+ border-color: #c1dfff;
199
+ }
200
+ .seam-components .seam-btn.seam-btn-outline {
201
+ color: #007afc;
202
+ border: 1px solid #7ebcff;
203
+ background: transparent;
204
+ }
205
+ .seam-components .seam-btn.seam-btn-outline:hover {
206
+ background: #f2f8ff;
207
+ }
208
+ .seam-components .seam-btn.seam-btn-outline.seam-btn-disabled, .seam-components .seam-btn.seam-btn-outline:disabled {
209
+ background: transparent;
210
+ color: #7ebcff;
211
+ }
212
+ .seam-components .seam-btn.seam-btn-neutral {
213
+ color: #6e7179;
214
+ border: 1px solid #b9bec5;
215
+ }
216
+ .seam-components .seam-btn.seam-btn-neutral:hover {
217
+ background: #f1f3f4;
218
+ border-color: #b9bec5;
219
+ }
220
+ .seam-components .seam-btn.seam-btn-neutral.seam-btn-disabled, .seam-components .seam-btn.seam-btn-neutral:disabled {
221
+ color: #b9bec5;
222
+ border-color: #d5d8dc;
223
+ background: #fff;
63
224
  }
64
- .seam-components .seam-button {
225
+ .seam-components .seam-btn.seam-btn-disabled, .seam-components .seam-btn:disabled {
226
+ cursor: not-allowed;
227
+ }
228
+ .seam-components .seam-icon-btn {
65
229
  border-radius: 6px;
66
230
  border: 1px solid rgba(0, 122, 252, 0.5);
67
231
  cursor: pointer;
68
- }
69
- .seam-components .seam-button.seam-icon-button {
70
232
  background: #fff;
71
233
  padding: 6px;
72
234
  line-height: 0;
73
235
  }
74
- .seam-components .seam-button.seam-icon-button:hover {
236
+ .seam-components .seam-icon-btn:hover {
75
237
  background: rgba(0, 122, 252, 0.08);
76
238
  }
239
+ .seam-components .seam-text-btn {
240
+ color: #007afc;
241
+ padding: 0;
242
+ cursor: pointer;
243
+ background: transparent;
244
+ border: 0;
245
+ }
246
+ .seam-components .seam-text-btn:hover {
247
+ text-decoration: underline;
248
+ }
249
+ .seam-components .seam-text-btn.seam-btn-disabled, .seam-components .seam-text-btn:disabled {
250
+ cursor: not-allowed;
251
+ text-decoration: none;
252
+ }
77
253
  .seam-components .seam-content-header {
78
254
  height: 56px;
79
255
  display: flex;
80
256
  align-items: center;
81
257
  position: relative;
82
258
  justify-content: center;
83
- width: 100%;
259
+ margin: 0 16px;
84
260
  }
85
261
  .seam-components .seam-content-header .seam-back-icon {
86
262
  position: absolute;
87
263
  top: 50%;
88
- transform: translate(0, -25%);
264
+ transform: translate(4px, -25%);
89
265
  left: 0;
90
266
  cursor: pointer;
91
267
  }
92
268
  .seam-components .seam-content-header .seam-title {
93
269
  font-size: 16px;
94
270
  line-height: 134%;
271
+ color: #6e7179;
95
272
  }
96
- .seam-components .seam-access-code-table .seam-content-header {
97
- margin: 0 16px;
98
- }
99
- .seam-components .seam-access-code-table .seam-table-header {
100
- margin-bottom: 16px;
101
- height: 56px;
102
- padding: 0 16px;
103
- }
104
- .seam-components .seam-access-code-table .seam-icon-cell {
105
- flex: 0;
106
- display: flex;
107
- align-items: center;
108
- justify-content: center;
109
- }
110
- .seam-components .seam-access-code-table .seam-icon-cell > div {
111
- width: 40px;
112
- height: 40px;
113
- display: flex;
114
- align-items: center;
115
- justify-content: center;
116
- }
117
- .seam-components .seam-access-code-table .seam-name-cell {
118
- flex: 1;
119
- flex-direction: column;
120
- justify-content: center;
121
- align-items: flex-start;
122
- gap: 2px;
123
- }
124
- .seam-components .seam-access-code-table .seam-name-cell .seam-access-code-details {
125
- font-size: 14px;
126
- line-height: 134%;
127
- color: var(--text-gray-1);
128
- }
129
- .seam-components .seam-access-code-table .seam-name-cell .seam-access-code-details .seam-dot-divider {
130
- margin: 0 4px;
131
- color: var(--text-gray-3);
132
- }
133
- .seam-components .seam-access-code-table .seam-action-cell {
134
- margin-right: 12px;
135
- display: flex;
136
- align-items: center;
137
- justify-content: center;
138
- }
139
- .seam-components .seam-device-details {
140
- padding: 0 24px 24px;
273
+ .seam-components .seam-lock-icon * {
274
+ fill: #6e7179;
141
275
  }
142
276
  .seam-components .seam-device-details .seam-body {
143
277
  display: flex;
144
278
  flex-direction: column;
145
279
  gap: 16px;
280
+ margin: 0 24px 24px;
146
281
  }
147
282
  .seam-components .seam-device-details .seam-body .seam-box {
148
- border: 1px solid var(--input-border);
283
+ border: 1px solid #d5d8dc;
149
284
  border-radius: 8px;
150
285
  }
151
286
  .seam-components .seam-device-details .seam-body .seam-box .seam-content {
@@ -159,15 +294,23 @@
159
294
  cursor: pointer;
160
295
  }
161
296
  .seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-access-codes:hover {
162
- background: var(--item-hover-bg);
297
+ background: #f4f6f8;
163
298
  }
164
299
  .seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-access-code-length {
165
- border-top: 1px solid var(--input-border);
300
+ border-top: 1px solid #d5d8dc;
301
+ }
302
+ .seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-lock-status {
303
+ display: flex;
304
+ justify-content: space-between;
305
+ }
306
+ .seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-lock-status > .seam-right {
307
+ display: flex;
308
+ align-items: center;
166
309
  }
167
310
  .seam-components .seam-device-details .seam-body .seam-box .seam-content .seam-label {
168
311
  font-size: 14px;
169
312
  line-height: 134%;
170
- color: var(--text-gray-1);
313
+ color: #6e7179;
171
314
  }
172
315
  .seam-components .seam-device-details .seam-body .seam-box .seam-content .seam-value {
173
316
  display: block;
@@ -178,7 +321,7 @@
178
321
  .seam-components .seam-device-details .seam-body .seam-summary {
179
322
  padding: 24px 16px;
180
323
  border-radius: 16px;
181
- background: var(--bg-a);
324
+ background: #f1f3f4;
182
325
  }
183
326
  .seam-components .seam-device-details .seam-body .seam-summary .seam-content {
184
327
  display: flex;
@@ -194,6 +337,13 @@
194
337
  .seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-image img {
195
338
  max-width: 100%;
196
339
  }
340
+ .seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info > .seam-label {
341
+ color: #6e7179;
342
+ font-weight: 600;
343
+ font-size: 14px;
344
+ line-height: 134%;
345
+ margin-bottom: 4px;
346
+ }
197
347
  .seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-device-name {
198
348
  margin-bottom: 16px;
199
349
  font-weight: 600;
@@ -210,10 +360,10 @@
210
360
  column-gap: 28px;
211
361
  }
212
362
  .seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties .seam-label {
213
- color: var(--text-gray-2);
363
+ color: #9da1a9;
214
364
  }
215
365
  .seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties .seam-status-text {
216
- color: var(--text-gray-1);
366
+ color: #6e7179;
217
367
  }
218
368
  .seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties svg {
219
369
  scale: 0.75;
@@ -246,5 +396,187 @@
246
396
  align-items: center;
247
397
  justify-content: center;
248
398
  }
399
+ .seam-components .seam-device-table .seam-table-row {
400
+ cursor: pointer;
401
+ }
402
+ .seam-components .seam-device-table .seam-table-row .seam-image-cell {
403
+ width: 64px;
404
+ height: 64px;
405
+ padding: 4px;
406
+ }
407
+ .seam-components .seam-device-table .seam-table-row .seam-image-cell img {
408
+ width: 100%;
409
+ }
410
+ .seam-components .seam-device-table .seam-table-row .seam-body-cell {
411
+ flex: 1;
412
+ flex-direction: column;
413
+ justify-content: center;
414
+ align-items: flex-start;
415
+ gap: 2px;
416
+ }
417
+ .seam-components .seam-device-table .seam-table-row .seam-body-cell .seam-bottom {
418
+ display: flex;
419
+ justify-content: space-between;
420
+ align-items: center;
421
+ width: 100%;
422
+ }
423
+ .seam-components .seam-device-table .seam-table-row .seam-body-cell .seam-bottom .seam-device-model {
424
+ font-weight: 400;
425
+ font-size: 14px;
426
+ line-height: 134%;
427
+ color: #6e7179;
428
+ flex: 0 1 190px;
429
+ white-space: nowrap;
430
+ overflow: hidden;
431
+ text-overflow: ellipsis;
432
+ }
433
+ .seam-components .seam-device-table .seam-table-row .seam-body-cell .seam-bottom .seam-device-statuses {
434
+ display: flex;
435
+ align-items: center;
436
+ color: #6e7179;
437
+ font-size: 14px;
438
+ line-height: 134%;
439
+ }
440
+ .seam-components .seam-device-table .seam-table-row .seam-body-cell .seam-bottom .seam-device-statuses > div {
441
+ display: flex;
442
+ align-items: center;
443
+ margin-right: 16px;
444
+ }
445
+ .seam-components .seam-device-table .seam-table-row .seam-body-cell .seam-bottom .seam-device-statuses > div svg {
446
+ scale: 0.75;
447
+ }
448
+ .seam-components .seam-access-code-table .seam-table-row {
449
+ cursor: pointer;
450
+ }
451
+ .seam-components .seam-access-code-table .seam-table-row .seam-icon-cell {
452
+ flex: 0;
453
+ display: flex;
454
+ align-items: center;
455
+ justify-content: center;
456
+ }
457
+ .seam-components .seam-access-code-table .seam-table-row .seam-icon-cell > div {
458
+ width: 40px;
459
+ height: 40px;
460
+ display: flex;
461
+ align-items: center;
462
+ justify-content: center;
463
+ }
464
+ .seam-components .seam-access-code-table .seam-table-row .seam-name-cell {
465
+ flex: 1;
466
+ flex-direction: column;
467
+ justify-content: center;
468
+ align-items: flex-start;
469
+ gap: 2px;
470
+ }
471
+ .seam-components .seam-access-code-table .seam-table-row .seam-name-cell .seam-code-details {
472
+ font-size: 14px;
473
+ line-height: 134%;
474
+ color: #6e7179;
475
+ }
476
+ .seam-components .seam-access-code-table .seam-table-row .seam-name-cell .seam-code-details .seam-dot-divider {
477
+ margin: 0 4px;
478
+ color: #d5d8dc;
479
+ }
480
+ .seam-components .seam-access-code-table .seam-table-row .seam-action-cell {
481
+ margin-right: 12px;
482
+ display: flex;
483
+ align-items: center;
484
+ justify-content: center;
485
+ }
486
+ .seam-components .seam-access-code-details > .seam-summary {
487
+ background: #f1f3f4;
488
+ border-radius: 16px;
489
+ margin: 0 24px 16px;
490
+ }
491
+ .seam-components .seam-access-code-details > .seam-summary > .seam-top {
492
+ padding: 24px 16px;
493
+ }
494
+ .seam-components .seam-access-code-details > .seam-summary > .seam-top > .seam-label {
495
+ font-weight: 600;
496
+ font-size: 14px;
497
+ line-height: 134%;
498
+ color: #6e7179;
499
+ margin-bottom: 4px;
500
+ }
501
+ .seam-components .seam-access-code-details > .seam-summary > .seam-top > .seam-access-code-name {
502
+ font-weight: 600;
503
+ font-size: 21px;
504
+ line-height: 132%;
505
+ margin-bottom: 8px;
506
+ }
507
+ .seam-components .seam-access-code-details > .seam-summary > .seam-top > .seam-code {
508
+ background: #fff;
509
+ border: 1px solid #9da1a9;
510
+ border-radius: 8px;
511
+ padding: 10px 16px;
512
+ font-weight: 600;
513
+ font-size: 24px;
514
+ line-height: 134%;
515
+ margin-bottom: 8px;
516
+ }
517
+ .seam-components .seam-access-code-details > .seam-summary > .seam-top .seam-duration {
518
+ color: #6e7179;
519
+ font-size: 14px;
520
+ line-height: 134%;
521
+ }
522
+ .seam-components .seam-access-code-details > .seam-summary > .seam-top .seam-duration .seam-label {
523
+ font-weight: 600;
524
+ color: #232b3a;
525
+ }
526
+ .seam-components .seam-access-code-details > .seam-summary .seam-access-code-device {
527
+ border-top: 1px solid #dde0e2;
528
+ padding: 8px 16px 8px 8px;
529
+ display: flex;
530
+ align-items: center;
531
+ }
532
+ .seam-components .seam-access-code-details > .seam-summary .seam-access-code-device .seam-device-image {
533
+ width: 72px;
534
+ height: 72px;
535
+ margin-right: 16px;
536
+ }
537
+ .seam-components .seam-access-code-details > .seam-summary .seam-access-code-device .seam-device-image img {
538
+ width: 100%;
539
+ max-height: 100%;
540
+ }
541
+ .seam-components .seam-access-code-details > .seam-summary .seam-access-code-device .seam-body {
542
+ flex: 1;
543
+ font-weight: 400;
544
+ font-size: 14px;
545
+ line-height: 134%;
546
+ margin-right: 8px;
547
+ }
548
+ .seam-components .seam-access-code-details .seam-details {
549
+ font-size: 16px;
550
+ line-height: 134%;
551
+ border-bottom: 1px solid rgba(0, 0, 0, 0.12);
552
+ padding: 0 24px;
553
+ }
554
+ .seam-components .seam-access-code-details .seam-details .seam-row {
555
+ padding: 16px;
556
+ display: flex;
557
+ border-top: 1px solid rgba(0, 0, 0, 0.12);
558
+ }
559
+ .seam-components .seam-access-code-details .seam-details .seam-row .seam-heading {
560
+ width: 112px;
561
+ }
562
+ .seam-components .seam-access-code-details .seam-details .seam-row .seam-content {
563
+ display: flex;
564
+ flex: 1;
565
+ }
566
+ .seam-components .seam-access-code-details .seam-details .seam-row .seam-content .seam-times {
567
+ display: flex;
568
+ flex: 1;
569
+ font-size: 16px;
570
+ line-height: 134%;
571
+ }
572
+ .seam-components .seam-access-code-details .seam-details .seam-row .seam-content .seam-times .seam-label {
573
+ color: #9da1a9;
574
+ }
575
+ .seam-components .seam-access-code-details .seam-details .seam-row .seam-content .seam-times > div div {
576
+ margin-bottom: 4px;
577
+ }
578
+ .seam-components .seam-access-code-details .seam-details .seam-row .seam-content .seam-times > div:first-child {
579
+ flex: 0 1 160px;
580
+ }
249
581
 
250
582
  /*# sourceMappingURL=index.css.map */
package/index.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["src/styles/_main.scss","src/styles/_typography.scss","src/styles/_tables.scss","src/styles/_inputs.scss","src/styles/_buttons.scss","src/styles/_layout.scss","src/styles/_access-code-table.scss","src/styles/_device-details.scss"],"names":[],"mappings":"AAQA;EACE;EAIA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAGA;EACQ;;ACvBR;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;;AAKF;EACE;;AAKF;EACE;;AClBF;EACE;EACA;EACA;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAMJ;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAMJ;EACE;EACA;EACA;;ACtCF;EACE;EACA;EACA;EACA;;ACJF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;ACXN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;ACjBF;EACE;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAKN;EACE;EACA;EACA;EACA;;ACjDJ;EACE;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAKN;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAKF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAOV;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;EACA","file":"index.css"}
1
+ {"version":3,"sourceRoot":"","sources":["src/styles/_reset.scss","src/styles/_main.scss","src/styles/_typography.scss","src/styles/_colors.scss","src/styles/_tables.scss","src/styles/_inputs.scss","src/styles/_buttons.scss","src/styles/_layout.scss","src/styles/_icons.scss","src/styles/_device-details.scss","src/styles/_device-table.scss","src/styles/_access-code-table.scss","src/styles/_access-code-details.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;ACaA;ECVE;;AFGA;AAAA;AAAA;EAGE;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAmDE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;;AAGF;AAAA;EAEE;;AAGF;AAAA;EAEE;;AAGF;AAAA;AAAA;AAAA;EAIE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AEtGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;;AAKF;EACE,OCTU;;ADcZ;EACE,OCPS;;ADYX;EACE,OCvBW;;ACPb;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAMJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;;AAMJ;EACE;EACA;EACA;;AC1CF;EACE;EACA;EACA;EACA;;AC2GF;EJ/GA;EIoHE;EACA;;AAjFF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAKF;EACE,YH7DM;EG8DN;EACA;;AAEA;EACE,YH5DS;EG6DT,cH7DS;;AGgEX;EAEE,YHjEQ;EGkER,cHlEQ;;AGsEZ;EACE,OH9EM;EG+EN;EACA;;AAEA;EACE,YH9EM;;AGiFR;EAEE;EACA,OHxFO;;AG4FX;EACE,OHrFU;EGsFV;;AAEA;EACE,YHjFC;EGkFD,cHxFU;;AG2FZ;EAEE,OH7FU;EG8FV,cH7FQ;EG8FR;;AAcF;EAEE;;AAxHJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAMJ;EACE,OHlBM;EGmBN;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAEE;EACA;;AC9BJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA,OJXQ;;AKPV;EACE,MLMQ;;AMPV;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE,YNIE;;AMAN;EACE;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA,ONnCE;;AMsCJ;EACE;EACA;EACA;EACA;;AAKN;EACE;EACA;EACA,YN1CD;;AM4CC;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAKF;EACE,ONtEA;EMuEA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE,ON7FF;;AMgGA;EACE,ONlGF;;AMqGA;EACE;EACA;;AAGF;EACE;EACA;;AAOV;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;EACA;;AClJJ;EACE;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA,OPvBE;EOwBF;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA,OPjCE;EOkCF;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AClDZ;EACE;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA,ORrBI;;AQuBJ;EACE;EACA,ORtBE;;AQ2BR;EACE;EACA;EACA;EACA;;ACzCJ;EACE,YTcC;ESbD;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA,OTLI;ESMJ;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE,OT5BI;ES6BJ;EACA;;AAEA;EACE;EACA,OTnCG;;ASwCT;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE,OT3FA;;AS+FA;EACE;;AAGF;EACE","file":"index.css"}
package/index.min.css CHANGED
@@ -1 +1 @@
1
- .seam-components{font-family:"Source Sans Pro",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;--primary: #007afc;--text-gray-1: #6e7179;--text-gray-2: #9da1a9;--text-gray-3: #d5d8dc;--input-border: #d5d8dc;--bg-a: #f1f3f4;--status-red-alert: #e36857;--item-hover-bg: #f4f6f8;@import'the-new-css-reset/css/reset.css'}.seam-components h1,.seam-components h2,.seam-components h3,.seam-components h4,.seam-components h5,.seam-components h6{font-weight:600}.seam-components .seam-caption{color:var(--text-gray-2)}.seam-components .seam-text-danger{color:var(--status-red-alert)}.seam-components .seam-table-header{display:flex;justify-content:space-between;align-items:center}.seam-components .seam-table-title{font-size:21px;line-height:132%}.seam-components .seam-table-title .seam-caption{font-size:16px;line-height:134%}.seam-components .seam-table-row{display:flex;padding:4px;height:72px}.seam-components .seam-table-row:hover{background:#f4f6f8}.seam-components .seam-table-row .seam-title{font-weight:600;font-size:18px}.seam-components .seam-table-cell{display:flex;align-items:center;padding:4px}.seam-components .seam-text-field{padding:0 8px;height:40px;border:1px solid var(--input-border);border-radius:8px}.seam-components .seam-button{border-radius:6px;border:1px solid rgba(0,122,252,.5);cursor:pointer}.seam-components .seam-button.seam-icon-button{background:#fff;padding:6px;line-height:0}.seam-components .seam-button.seam-icon-button:hover{background:rgba(0,122,252,.08)}.seam-components .seam-content-header{height:56px;display:flex;align-items:center;position:relative;justify-content:center;width:100%}.seam-components .seam-content-header .seam-back-icon{position:absolute;top:50%;transform:translate(0, -25%);left:0;cursor:pointer}.seam-components .seam-content-header .seam-title{font-size:16px;line-height:134%}.seam-components .seam-access-code-table .seam-content-header{margin:0 16px}.seam-components .seam-access-code-table .seam-table-header{margin-bottom:16px;height:56px;padding:0 16px}.seam-components .seam-access-code-table .seam-icon-cell{flex:0;display:flex;align-items:center;justify-content:center}.seam-components .seam-access-code-table .seam-icon-cell>div{width:40px;height:40px;display:flex;align-items:center;justify-content:center}.seam-components .seam-access-code-table .seam-name-cell{flex:1;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px}.seam-components .seam-access-code-table .seam-name-cell .seam-access-code-details{font-size:14px;line-height:134%;color:var(--text-gray-1)}.seam-components .seam-access-code-table .seam-name-cell .seam-access-code-details .seam-dot-divider{margin:0 4px;color:var(--text-gray-3)}.seam-components .seam-access-code-table .seam-action-cell{margin-right:12px;display:flex;align-items:center;justify-content:center}.seam-components .seam-device-details{padding:0 24px 24px}.seam-components .seam-device-details .seam-body{display:flex;flex-direction:column;gap:16px}.seam-components .seam-device-details .seam-body .seam-box{border:1px solid var(--input-border);border-radius:8px}.seam-components .seam-device-details .seam-body .seam-box .seam-content{padding:12px 12px 12px 16px}.seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-access-codes{padding:12px 8px 12px 16px;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-access-codes:hover{background:var(--item-hover-bg)}.seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-access-code-length{border-top:1px solid var(--input-border)}.seam-components .seam-device-details .seam-body .seam-box .seam-content .seam-label{font-size:14px;line-height:134%;color:var(--text-gray-1)}.seam-components .seam-device-details .seam-body .seam-box .seam-content .seam-value{display:block;font-weight:600;font-size:16px;line-height:134%}.seam-components .seam-device-details .seam-body .seam-summary{padding:24px 16px;border-radius:16px;background:var(--bg-a)}.seam-components .seam-device-details .seam-body .seam-summary .seam-content{display:flex;align-items:center;gap:20px}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-image{width:100px;height:100px;display:flex;align-items:center}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-image img{max-width:100%}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-device-name{margin-bottom:16px;font-weight:600;font-size:21px;line-height:132%}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties{display:grid;grid-template-columns:min-content 1fr;grid-auto-rows:1fr;font-size:14px;line-height:134%;row-gap:4px;column-gap:28px}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties .seam-label{color:var(--text-gray-2)}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties .seam-status-text{color:var(--text-gray-1)}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties svg{scale:.75;margin-right:8px}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties>*{display:flex;align-items:center}.seam-components .seam-device-details .seam-body .seam-icon-cell{flex:0;margin-left:8px;display:flex;align-items:center;justify-content:center}.seam-components .seam-device-details .seam-body .seam-icon-cell>div{width:40px;height:40px;display:flex;align-items:center;justify-content:center}.seam-components .seam-device-details .seam-body .seam-name-cell{flex:1}.seam-components .seam-device-details .seam-body .seam-action-cell{margin-right:12px;display:flex;align-items:center;justify-content:center}/*# sourceMappingURL=index.min.css.map */
1
+ .seam-components{font-family:"Source Sans Pro",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif}.seam-components *,.seam-components *::before,.seam-components *::after{box-sizing:border-box}.seam-components html,.seam-components body,.seam-components div,.seam-components span,.seam-components object,.seam-components iframe,.seam-components figure,.seam-components h1,.seam-components h2,.seam-components h3,.seam-components h4,.seam-components h5,.seam-components h6,.seam-components p,.seam-components blockquote,.seam-components pre,.seam-components a,.seam-components code,.seam-components em,.seam-components img,.seam-components small,.seam-components strike,.seam-components strong,.seam-components sub,.seam-components sup,.seam-components tt,.seam-components b,.seam-components u,.seam-components i,.seam-components ol,.seam-components ul,.seam-components li,.seam-components fieldset,.seam-components form,.seam-components label,.seam-components table,.seam-components caption,.seam-components tbody,.seam-components tfoot,.seam-components thead,.seam-components tr,.seam-components th,.seam-components td,.seam-components main,.seam-components canvas,.seam-components embed,.seam-components footer,.seam-components header,.seam-components nav,.seam-components section,.seam-components video{margin:0;padding:0;border:0;font-size:100%;font-family:inherit;vertical-align:baseline;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;text-size-adjust:none}.seam-components footer,.seam-components header,.seam-components nav,.seam-components section,.seam-components main{display:block}.seam-components body{line-height:1}.seam-components ol,.seam-components ul{list-style:none}.seam-components blockquote,.seam-components q{quotes:none}.seam-components blockquote::before,.seam-components blockquote::after,.seam-components q::before,.seam-components q::after{content:"";content:none}.seam-components table{border-collapse:collapse;border-spacing:0}.seam-components input{appearance:none;border-radius:0}.seam-components h1,.seam-components h2,.seam-components h3,.seam-components h4,.seam-components h5,.seam-components h6{font-weight:600}.seam-components .seam-caption{color:#9da1a9}.seam-components .seam-text-danger{color:#e36857}.seam-components html{color:#232b3a}.seam-components .seam-table-header{display:flex;justify-content:space-between;align-items:center;height:56px;padding:0 16px}.seam-components .seam-table-title{font-size:21px;line-height:132%}.seam-components .seam-table-title .seam-caption{font-size:16px;line-height:134%}.seam-components .seam-table-row{display:flex;padding:4px;height:72px;border-bottom:1px solid #eee}.seam-components .seam-table-row:hover{background:#f4f6f8}.seam-components .seam-table-row .seam-title{font-weight:600;font-size:18px;line-height:132%}.seam-components .seam-table-cell{display:flex;align-items:center;padding:4px}.seam-components .seam-text-field{padding:0 8px;height:40px;border:1px solid #d5d8dc;border-radius:8px}.seam-components .seam-btn{font-family:"Source Sans Pro",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif;font-weight:600;cursor:pointer}.seam-components .seam-btn.seam-btn-small{font-size:14px;line-height:22px;border-radius:6px;padding:4px 10px}.seam-components .seam-btn.seam-btn-medium{font-size:16px;line-height:26px;border-radius:7px;padding:6px 16px}.seam-components .seam-btn.seam-btn-large{font-size:19px;line-height:30px;border-radius:8px;padding:8px 22px}.seam-components .seam-btn.seam-btn-solid{background:#007afc;color:#fff;border:1px solid #007afc}.seam-components .seam-btn.seam-btn-solid:hover{background:#006ee3;border-color:#006ee3}.seam-components .seam-btn.seam-btn-solid.seam-btn-disabled,.seam-components .seam-btn.seam-btn-solid:disabled{background:#c1dfff;border-color:#c1dfff}.seam-components .seam-btn.seam-btn-outline{color:#007afc;border:1px solid #7ebcff;background:rgba(0,0,0,0)}.seam-components .seam-btn.seam-btn-outline:hover{background:#f2f8ff}.seam-components .seam-btn.seam-btn-outline.seam-btn-disabled,.seam-components .seam-btn.seam-btn-outline:disabled{background:rgba(0,0,0,0);color:#7ebcff}.seam-components .seam-btn.seam-btn-neutral{color:#6e7179;border:1px solid #b9bec5}.seam-components .seam-btn.seam-btn-neutral:hover{background:#f1f3f4;border-color:#b9bec5}.seam-components .seam-btn.seam-btn-neutral.seam-btn-disabled,.seam-components .seam-btn.seam-btn-neutral:disabled{color:#b9bec5;border-color:#d5d8dc;background:#fff}.seam-components .seam-btn.seam-btn-disabled,.seam-components .seam-btn:disabled{cursor:not-allowed}.seam-components .seam-icon-btn{border-radius:6px;border:1px solid rgba(0,122,252,.5);cursor:pointer;background:#fff;padding:6px;line-height:0}.seam-components .seam-icon-btn:hover{background:rgba(0,122,252,.08)}.seam-components .seam-text-btn{color:#007afc;padding:0;cursor:pointer;background:rgba(0,0,0,0);border:0}.seam-components .seam-text-btn:hover{text-decoration:underline}.seam-components .seam-text-btn.seam-btn-disabled,.seam-components .seam-text-btn:disabled{cursor:not-allowed;text-decoration:none}.seam-components .seam-content-header{height:56px;display:flex;align-items:center;position:relative;justify-content:center;margin:0 16px}.seam-components .seam-content-header .seam-back-icon{position:absolute;top:50%;transform:translate(4px, -25%);left:0;cursor:pointer}.seam-components .seam-content-header .seam-title{font-size:16px;line-height:134%;color:#6e7179}.seam-components .seam-lock-icon *{fill:#6e7179}.seam-components .seam-device-details .seam-body{display:flex;flex-direction:column;gap:16px;margin:0 24px 24px}.seam-components .seam-device-details .seam-body .seam-box{border:1px solid #d5d8dc;border-radius:8px}.seam-components .seam-device-details .seam-body .seam-box .seam-content{padding:12px 12px 12px 16px}.seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-access-codes{padding:12px 8px 12px 16px;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-access-codes:hover{background:#f4f6f8}.seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-access-code-length{border-top:1px solid #d5d8dc}.seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-lock-status{display:flex;justify-content:space-between}.seam-components .seam-device-details .seam-body .seam-box .seam-content.seam-lock-status>.seam-right{display:flex;align-items:center}.seam-components .seam-device-details .seam-body .seam-box .seam-content .seam-label{font-size:14px;line-height:134%;color:#6e7179}.seam-components .seam-device-details .seam-body .seam-box .seam-content .seam-value{display:block;font-weight:600;font-size:16px;line-height:134%}.seam-components .seam-device-details .seam-body .seam-summary{padding:24px 16px;border-radius:16px;background:#f1f3f4}.seam-components .seam-device-details .seam-body .seam-summary .seam-content{display:flex;align-items:center;gap:20px}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-image{width:100px;height:100px;display:flex;align-items:center}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-image img{max-width:100%}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info>.seam-label{color:#6e7179;font-weight:600;font-size:14px;line-height:134%;margin-bottom:4px}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-device-name{margin-bottom:16px;font-weight:600;font-size:21px;line-height:132%}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties{display:grid;grid-template-columns:min-content 1fr;grid-auto-rows:1fr;font-size:14px;line-height:134%;row-gap:4px;column-gap:28px}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties .seam-label{color:#9da1a9}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties .seam-status-text{color:#6e7179}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties svg{scale:.75;margin-right:8px}.seam-components .seam-device-details .seam-body .seam-summary .seam-content .seam-info .seam-properties>*{display:flex;align-items:center}.seam-components .seam-device-details .seam-body .seam-icon-cell{flex:0;margin-left:8px;display:flex;align-items:center;justify-content:center}.seam-components .seam-device-details .seam-body .seam-icon-cell>div{width:40px;height:40px;display:flex;align-items:center;justify-content:center}.seam-components .seam-device-details .seam-body .seam-name-cell{flex:1}.seam-components .seam-device-details .seam-body .seam-action-cell{margin-right:12px;display:flex;align-items:center;justify-content:center}.seam-components .seam-device-table .seam-table-row{cursor:pointer}.seam-components .seam-device-table .seam-table-row .seam-image-cell{width:64px;height:64px;padding:4px}.seam-components .seam-device-table .seam-table-row .seam-image-cell img{width:100%}.seam-components .seam-device-table .seam-table-row .seam-body-cell{flex:1;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px}.seam-components .seam-device-table .seam-table-row .seam-body-cell .seam-bottom{display:flex;justify-content:space-between;align-items:center;width:100%}.seam-components .seam-device-table .seam-table-row .seam-body-cell .seam-bottom .seam-device-model{font-weight:400;font-size:14px;line-height:134%;color:#6e7179;flex:0 1 190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.seam-components .seam-device-table .seam-table-row .seam-body-cell .seam-bottom .seam-device-statuses{display:flex;align-items:center;color:#6e7179;font-size:14px;line-height:134%}.seam-components .seam-device-table .seam-table-row .seam-body-cell .seam-bottom .seam-device-statuses>div{display:flex;align-items:center;margin-right:16px}.seam-components .seam-device-table .seam-table-row .seam-body-cell .seam-bottom .seam-device-statuses>div svg{scale:.75}.seam-components .seam-access-code-table .seam-table-row{cursor:pointer}.seam-components .seam-access-code-table .seam-table-row .seam-icon-cell{flex:0;display:flex;align-items:center;justify-content:center}.seam-components .seam-access-code-table .seam-table-row .seam-icon-cell>div{width:40px;height:40px;display:flex;align-items:center;justify-content:center}.seam-components .seam-access-code-table .seam-table-row .seam-name-cell{flex:1;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px}.seam-components .seam-access-code-table .seam-table-row .seam-name-cell .seam-code-details{font-size:14px;line-height:134%;color:#6e7179}.seam-components .seam-access-code-table .seam-table-row .seam-name-cell .seam-code-details .seam-dot-divider{margin:0 4px;color:#d5d8dc}.seam-components .seam-access-code-table .seam-table-row .seam-action-cell{margin-right:12px;display:flex;align-items:center;justify-content:center}.seam-components .seam-access-code-details>.seam-summary{background:#f1f3f4;border-radius:16px;margin:0 24px 16px}.seam-components .seam-access-code-details>.seam-summary>.seam-top{padding:24px 16px}.seam-components .seam-access-code-details>.seam-summary>.seam-top>.seam-label{font-weight:600;font-size:14px;line-height:134%;color:#6e7179;margin-bottom:4px}.seam-components .seam-access-code-details>.seam-summary>.seam-top>.seam-access-code-name{font-weight:600;font-size:21px;line-height:132%;margin-bottom:8px}.seam-components .seam-access-code-details>.seam-summary>.seam-top>.seam-code{background:#fff;border:1px solid #9da1a9;border-radius:8px;padding:10px 16px;font-weight:600;font-size:24px;line-height:134%;margin-bottom:8px}.seam-components .seam-access-code-details>.seam-summary>.seam-top .seam-duration{color:#6e7179;font-size:14px;line-height:134%}.seam-components .seam-access-code-details>.seam-summary>.seam-top .seam-duration .seam-label{font-weight:600;color:#232b3a}.seam-components .seam-access-code-details>.seam-summary .seam-access-code-device{border-top:1px solid #dde0e2;padding:8px 16px 8px 8px;display:flex;align-items:center}.seam-components .seam-access-code-details>.seam-summary .seam-access-code-device .seam-device-image{width:72px;height:72px;margin-right:16px}.seam-components .seam-access-code-details>.seam-summary .seam-access-code-device .seam-device-image img{width:100%;max-height:100%}.seam-components .seam-access-code-details>.seam-summary .seam-access-code-device .seam-body{flex:1;font-weight:400;font-size:14px;line-height:134%;margin-right:8px}.seam-components .seam-access-code-details .seam-details{font-size:16px;line-height:134%;border-bottom:1px solid rgba(0,0,0,.12);padding:0 24px}.seam-components .seam-access-code-details .seam-details .seam-row{padding:16px;display:flex;border-top:1px solid rgba(0,0,0,.12)}.seam-components .seam-access-code-details .seam-details .seam-row .seam-heading{width:112px}.seam-components .seam-access-code-details .seam-details .seam-row .seam-content{display:flex;flex:1}.seam-components .seam-access-code-details .seam-details .seam-row .seam-content .seam-times{display:flex;flex:1;font-size:16px;line-height:134%}.seam-components .seam-access-code-details .seam-details .seam-row .seam-content .seam-times .seam-label{color:#9da1a9}.seam-components .seam-access-code-details .seam-details .seam-row .seam-content .seam-times>div div{margin-bottom:4px}.seam-components .seam-access-code-details .seam-details .seam-row .seam-content .seam-times>div:first-child{flex:0 1 160px}/*# sourceMappingURL=index.min.css.map */