@seamapi/react 0.13.0 → 0.15.0

package/index.css

@@ -8,6 +8,7 @@
   --bg-a: #f1f3f4;
   --status-red-alert: #e36857;
   --item-hover-bg: #f4f6f8;
+  /* stylelint-disable */
   @import 'the-new-css-reset/css/reset.css';
 }
 .seam-components h1,

package/index.css.map

@@ -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/content-header.scss","src/styles/access-code-table.scss","src/styles/device-details.scss"],"names":[],"mappings":"AAAA;EACE;EAIA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGQ;;ACfV;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;;AAGF;EACE;;AAGF;EACE;;ACdF;EACE;EACA;EACA;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;EACA;;AClCF;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"}
+{"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"}

package/index.min.css.map

@@ -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/content-header.scss","src/styles/access-code-table.scss","src/styles/device-details.scss"],"names":[],"mappings":"AAAA,iBACE,2JAIA,mBACA,uBACA,uBACA,uBACA,wBACA,gBACA,4BACA,yBAGQ,yCCfV,wHAME,gBAGF,+BACE,yBAGF,mCACE,8BCdF,oCACE,aACA,8BACA,mBAGF,mCACE,eACA,iBAEA,iDACE,eACA,iBAIJ,iCACE,aACA,YACA,YAEA,uCACE,mBAGF,6CACE,gBACA,eAIJ,kCACE,aACA,mBACA,YClCF,kCACE,cACA,YACA,qCACA,kBCJF,8BACE,kBACA,oCACA,eAEA,+CACE,gBACA,YACA,cAEA,qDACE,+BCXN,sCACE,YACA,aACA,mBACA,kBACA,uBACA,WAEA,sDACE,kBACA,QACA,6BACA,OACA,eAGF,kDACE,eACA,iBCjBF,8DACE,cAGF,4DACE,mBACA,YACA,eAGF,yDACE,OACA,aACA,mBACA,uBAEA,6DACE,WACA,YACA,aACA,mBACA,uBAIJ,yDACE,OACA,sBACA,uBACA,uBACA,QAEA,mFACE,eACA,iBACA,yBAEA,qGACE,aACA,yBAKN,2DACE,kBACA,aACA,mBACA,uBCjDJ,sCACE,oBAEA,iDACE,aACA,sBACA,SAEA,2DACE,qCACA,kBAEA,yEACE,4BAEA,2FACE,2BACA,aACA,mBACA,8BACA,eAEA,iGACE,gCAIJ,iGACE,yCAGF,qFACE,eACA,iBACA,yBAGF,qFACE,cACA,gBACA,eACA,iBAKN,+DACE,kBACA,mBACA,uBAEA,6EACE,aACA,mBACA,SAEA,yFACE,YACA,aACA,aACA,mBAEA,6FACE,eAKF,0GACE,mBACA,gBACA,eACA,iBAGF,yGACE,aACA,sCACA,mBACA,eACA,iBACA,YACA,gBAEA,qHACE,yBAGF,2HACE,yBAGF,6GACE,UACA,iBAGF,2GACE,aACA,mBAOV,iEACE,OACA,gBACA,aACA,mBACA,uBAEA,qEACE,WACA,YACA,aACA,mBACA,uBAIJ,iEACE,OAGF,mEACE,kBACA,aACA,mBACA","file":"index.min.css"}
+{"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,iBACE,2JAIA,mBACA,uBACA,uBACA,uBACA,wBACA,gBACA,4BACA,yBAIQ,yCCvBR,wHAME,gBAKF,+BACE,yBAKF,mCACE,8BClBF,oCACE,aACA,8BACA,mBAGF,mCACE,eACA,iBAEA,iDACE,eACA,iBAMJ,iCACE,aACA,YACA,YAEA,uCACE,mBAGF,6CACE,gBACA,eAMJ,kCACE,aACA,mBACA,YCtCF,kCACE,cACA,YACA,qCACA,kBCJF,8BACE,kBACA,oCACA,eAEA,+CACE,gBACA,YACA,cAEA,qDACE,+BCXN,sCACE,YACA,aACA,mBACA,kBACA,uBACA,WAEA,sDACE,kBACA,QACA,6BACA,OACA,eAGF,kDACE,eACA,iBCjBF,8DACE,cAGF,4DACE,mBACA,YACA,eAGF,yDACE,OACA,aACA,mBACA,uBAEA,6DACE,WACA,YACA,aACA,mBACA,uBAIJ,yDACE,OACA,sBACA,uBACA,uBACA,QAEA,mFACE,eACA,iBACA,yBAEA,qGACE,aACA,yBAKN,2DACE,kBACA,aACA,mBACA,uBCjDJ,sCACE,oBAEA,iDACE,aACA,sBACA,SAEA,2DACE,qCACA,kBAEA,yEACE,4BAEA,2FACE,2BACA,aACA,mBACA,8BACA,eAEA,iGACE,gCAIJ,iGACE,yCAGF,qFACE,eACA,iBACA,yBAGF,qFACE,cACA,gBACA,eACA,iBAKN,+DACE,kBACA,mBACA,uBAEA,6EACE,aACA,mBACA,SAEA,yFACE,YACA,aACA,aACA,mBAEA,6FACE,eAKF,0GACE,mBACA,gBACA,eACA,iBAGF,yGACE,aACA,sCACA,mBACA,eACA,iBACA,YACA,gBAEA,qHACE,yBAGF,2HACE,yBAGF,6GACE,UACA,iBAGF,2GACE,aACA,mBAOV,iEACE,OACA,gBACA,aACA,mBACA,uBAEA,qEACE,WACA,YACA,aACA,mBACA,uBAIJ,iEACE,OAGF,mEACE,kBACA,aACA,mBACA","file":"index.min.css"}

package/lib/ui/AccessCodeTable/AccessCodeTable.d.ts

@@ -1,5 +1,6 @@
 import type { AccessCode } from 'seamapi';
-export declare function AccessCodeTable(props: {
+export interface AccessCodeTableProps {
     accessCodes: AccessCode[];
     onClickBack?: () => void;
-}): JSX.Element;
+}
+export declare function AccessCodeTable(props: AccessCodeTableProps): JSX.Element;

package/lib/ui/AccessCodeTable/AccessCodeTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccessCodeTable.js","sourceRoot":"","sources":["../../../src/lib/ui/AccessCodeTable/AccessCodeTable.tsx"],"names":[],"mappings":";AAEA,OAAO,EACL,SAAS,EACT,SAAS,EACT,WAAW,EACX,QAAQ,EACR,UAAU,GACX,MAAM,uBAAuB,CAAA;AAE9B,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAA;AAC9D,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAA;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAA;AAC9D,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAA;AACtD,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAA;AAElD,MAAM,UAAU,eAAe,CAAC,KAG/B;IACC,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,KAAK,CAAA;IAE1C,OAAO,CACL,eAAK,SAAS,EAAC,wBAAwB,aACrC,KAAC,aAAa,IAAC,WAAW,EAAE,WAAW,GAAI,EAC3C,KAAC,WAAW,cACV,MAAC,UAAU,eACR,CAAC,CAAC,WAAW,OAAE,MAAC,OAAO,oBAAG,WAAW,CAAC,MAAM,SAAY,IAC9C,GACD,EACd,KAAC,SAAS,cACP,WAAW,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACzB,MAAC,QAAQ,eACP,KAAC,SAAS,IAAC,SAAS,EAAC,gBAAgB,YACnC,wBACE,KAAC,iBAAiB,KAAG,GACjB,GACI,EACZ,MAAC,SAAS,IAAC,SAAS,EAAC,gBAAgB,aACnC,KAAC,KAAK,cAAE,IAAI,CAAC,IAAI,GAAS,EAC1B,KAAC,WAAW,IAAC,UAAU,EAAE,IAAI,GAAI,IACvB,EACZ,KAAC,SAAS,IAAC,SAAS,EAAC,kBAAkB,GAI3B,KAdC,IAAI,CAAC,cAAc,CAevB,CACZ,CAAC,GACQ,IACR,CACP,CAAA;AACH,CAAC;AAED,MAAM,CAAC,GAAG;IACR,WAAW,EAAE,cAAc;CAC5B,CAAA"}
+{"version":3,"file":"AccessCodeTable.js","sourceRoot":"","sources":["../../../src/lib/ui/AccessCodeTable/AccessCodeTable.tsx"],"names":[],"mappings":";AAEA,OAAO,EACL,SAAS,EACT,SAAS,EACT,WAAW,EACX,QAAQ,EACR,UAAU,GACX,MAAM,uBAAuB,CAAA;AAE9B,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAA;AAC9D,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAA;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAA;AAC9D,OAAO,EAAE,OAAO,EAAE,MAAM,8BAA8B,CAAA;AACtD,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAA;AAOlD,MAAM,UAAU,eAAe,CAAC,KAA2B;IACzD,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,GAAG,KAAK,CAAA;IAE1C,OAAO,CACL,eAAK,SAAS,EAAC,wBAAwB,aACrC,KAAC,aAAa,IAAC,WAAW,EAAE,WAAW,GAAI,EAC3C,KAAC,WAAW,cACV,MAAC,UAAU,eACR,CAAC,CAAC,WAAW,OAAE,MAAC,OAAO,oBAAG,WAAW,CAAC,MAAM,SAAY,IAC9C,GACD,EACd,KAAC,SAAS,cACP,WAAW,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACzB,MAAC,QAAQ,eACP,KAAC,SAAS,IAAC,SAAS,EAAC,gBAAgB,YACnC,wBACE,KAAC,iBAAiB,KAAG,GACjB,GACI,EACZ,MAAC,SAAS,IAAC,SAAS,EAAC,gBAAgB,aACnC,KAAC,KAAK,cAAE,IAAI,CAAC,IAAI,GAAS,EAC1B,KAAC,WAAW,IAAC,UAAU,EAAE,IAAI,GAAI,IACvB,EACZ,KAAC,SAAS,IAAC,SAAS,EAAC,kBAAkB,GAI3B,KAdC,IAAI,CAAC,cAAc,CAevB,CACZ,CAAC,GACQ,IACR,CACP,CAAA;AACH,CAAC;AAED,MAAM,CAAC,GAAG;IACR,WAAW,EAAE,cAAc;CAC5B,CAAA"}

package/lib/ui/DeviceDetails/DeviceDetails.d.ts

@@ -1,4 +1,5 @@
 import { type LockDevice } from 'seamapi';
-export declare function DeviceDetails(props: {
+export interface DeviceDetailsProps {
     device: LockDevice;
-}): JSX.Element;
+}
+export declare function DeviceDetails(props: DeviceDetailsProps): JSX.Element;

package/lib/ui/DeviceDetails/DeviceDetails.js.map

@@ -1 +1 @@
-{"version":3,"file":"DeviceDetails.js","sourceRoot":"","sources":["../../../src/lib/ui/DeviceDetails/DeviceDetails.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"DeviceDetails.js","sourceRoot":"","sources":["../../../src/lib/ui/DeviceDetails/DeviceDetails.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seamapi/react",
-  "version": "0.13.0",
+  "version": "0.15.0",
   "description": "Seam React component library.",
   "type": "module",
   "main": "index.js",

package/src/lib/ui/AccessCodeTable/AccessCodeTable.tsx

@@ -14,10 +14,12 @@ import { ContentHeader } from 'lib/ui/layout/ContentHeader.js'
 import { Caption } from 'lib/ui/typography/Caption.js'
 import { Title } from 'lib/ui/typography/Title.js'
 
-export function AccessCodeTable(props: {
+export interface AccessCodeTableProps {
   accessCodes: AccessCode[]
   onClickBack?: () => void
-}): JSX.Element {
+}
+
+export function AccessCodeTable(props: AccessCodeTableProps): JSX.Element {
   const { accessCodes, onClickBack } = props
 
   return (

package/src/lib/ui/DeviceDetails/DeviceDetails.tsx

@@ -9,7 +9,11 @@ import { OnlineStatus } from 'lib/ui/DeviceDetails/OnlineStatus.js'
 import { ContentHeader } from 'lib/ui/layout/ContentHeader.js'
 import useToggle from 'lib/use-toggle.js'
 
-export function DeviceDetails(props: { device: LockDevice }): JSX.Element {
+export interface DeviceDetailsProps {
+  device: LockDevice
+}
+
+export function DeviceDetails(props: DeviceDetailsProps): JSX.Element {
   const { device } = props
 
   const lockStatus = device.properties.locked ? t.locked : t.unlocked

package/src/styles/_access-code-table.scss

@@ -0,0 +1,54 @@
+@mixin all {
+  .seam-access-code-table {
+    .seam-content-header {
+      margin: 0 16px;
+    }
+
+    .seam-table-header {
+      margin-bottom: 16px;
+      height: 56px;
+      padding: 0 16px;
+    }
+
+    .seam-icon-cell {
+      flex: 0;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      > div {
+        width: 40px;
+        height: 40px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+    }
+
+    .seam-name-cell {
+      flex: 1;
+      flex-direction: column;
+      justify-content: center;
+      align-items: flex-start;
+      gap: 2px;
+
+      .seam-access-code-details {
+        font-size: 14px;
+        line-height: 134%;
+        color: var(--text-gray-1);
+
+        .seam-dot-divider {
+          margin: 0 4px;
+          color: var(--text-gray-3);
+        }
+      }
+    }
+
+    .seam-action-cell {
+      margin-right: 12px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+  }
+}

package/src/styles/_buttons.scss

@@ -0,0 +1,17 @@
+@mixin all {
+  .seam-button {
+    border-radius: 6px;
+    border: 1px solid rgb(0 122 252 / 50%);
+    cursor: pointer;
+
+    &.seam-icon-button {
+      background: #fff;
+      padding: 6px;
+      line-height: 0;
+
+      &:hover {
+        background: rgb(0 122 252 / 8%);
+      }
+    }
+  }
+}

package/src/styles/_device-details.scss

@@ -0,0 +1,136 @@
+@mixin all {
+  .seam-device-details {
+    padding: 0 24px 24px;
+
+    .seam-body {
+      display: flex;
+      flex-direction: column;
+      gap: 16px;
+
+      .seam-box {
+        border: 1px solid var(--input-border);
+        border-radius: 8px;
+
+        .seam-content {
+          padding: 12px 12px 12px 16px;
+
+          &.seam-access-codes {
+            padding: 12px 8px 12px 16px;
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+            cursor: pointer;
+
+            &:hover {
+              background: var(--item-hover-bg);
+            }
+          }
+
+          &.seam-access-code-length {
+            border-top: 1px solid var(--input-border);
+          }
+
+          .seam-label {
+            font-size: 14px;
+            line-height: 134%;
+            color: var(--text-gray-1);
+          }
+
+          .seam-value {
+            display: block;
+            font-weight: 600;
+            font-size: 16px;
+            line-height: 134%;
+          }
+        }
+      }
+
+      .seam-summary {
+        padding: 24px 16px;
+        border-radius: 16px;
+        background: var(--bg-a);
+
+        .seam-content {
+          display: flex;
+          align-items: center;
+          gap: 20px;
+
+          .seam-image {
+            width: 100px;
+            height: 100px;
+            display: flex;
+            align-items: center;
+
+            img {
+              max-width: 100%;
+            }
+          }
+
+          .seam-info {
+            .seam-device-name {
+              margin-bottom: 16px;
+              font-weight: 600;
+              font-size: 21px;
+              line-height: 132%;
+            }
+
+            .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-label {
+                color: var(--text-gray-2);
+              }
+
+              .seam-status-text {
+                color: var(--text-gray-1);
+              }
+
+              svg {
+                scale: 0.75;
+                margin-right: 8px;
+              }
+
+              > * {
+                display: flex;
+                align-items: center;
+              }
+            }
+          }
+        }
+      }
+
+      .seam-icon-cell {
+        flex: 0;
+        margin-left: 8px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+
+        > div {
+          width: 40px;
+          height: 40px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+        }
+      }
+
+      .seam-name-cell {
+        flex: 1;
+      }
+
+      .seam-action-cell {
+        margin-right: 12px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+    }
+  }
+}

package/src/styles/_inputs.scss

@@ -0,0 +1,12 @@
+@mixin text-field {
+  .seam-text-field {
+    padding: 0 8px;
+    height: 40px;
+    border: 1px solid var(--input-border);
+    border-radius: 8px;
+  }
+}
+
+@mixin all {
+  @include text-field;
+}

package/src/styles/_layout.scss

@@ -0,0 +1,27 @@
+@mixin header {
+  .seam-content-header {
+    height: 56px;
+    display: flex;
+    align-items: center;
+    position: relative;
+    justify-content: center;
+    width: 100%;
+
+    .seam-back-icon {
+      position: absolute;
+      top: 50%;
+      transform: translate(0, -25%);
+      left: 0;
+      cursor: pointer;
+    }
+
+    .seam-title {
+      font-size: 16px;
+      line-height: 134%;
+    }
+  }
+}
+
+@mixin all {
+  @include header;
+}

package/src/styles/{main.scss → _main.scss}

@@ -1,3 +1,11 @@
+@use './typography';
+@use './tables';
+@use './inputs';
+@use './buttons';
+@use './layout';
+@use './access-code-table';
+@use './device-details';
+
 .seam-components {
   font-family: 'Source Sans Pro', system-ui, -apple-system, BlinkMacSystemFont,
     'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',
@@ -13,16 +21,17 @@
   --item-hover-bg: #f4f6f8;
 
   // Reset
+  /* stylelint-disable */
   @import 'the-new-css-reset/css/reset.css';
 
   // Globals
-  @import './typography';
-  @import './tables';
-  @import './inputs';
-  @import './buttons';
-  @import './content-header';
+  @include typography.all;
+  @include tables.all;
+  @include inputs.all;
+  @include buttons.all;
+  @include layout.all;
 
   // Components
-  @import './access-code-table';
-  @import './device-details';
+  @include access-code-table.all;
+  @include device-details.all;
 }

package/src/styles/_tables.scss

@@ -0,0 +1,48 @@
+@mixin header {
+  .seam-table-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .seam-table-title {
+    font-size: 21px;
+    line-height: 132%;
+
+    .seam-caption {
+      font-size: 16px;
+      line-height: 134%;
+    }
+  }
+}
+
+@mixin row {
+  .seam-table-row {
+    display: flex;
+    padding: 4px;
+    height: 72px;
+
+    &:hover {
+      background: rgb(244 246 248 / 100%);
+    }
+
+    .seam-title {
+      font-weight: 600;
+      font-size: 18px;
+    }
+  }
+}
+
+@mixin cell {
+  .seam-table-cell {
+    display: flex;
+    align-items: center;
+    padding: 4px;
+  }
+}
+
+@mixin all {
+  @include header;
+  @include row;
+  @include cell;
+}

package/src/styles/_typography.scss

@@ -0,0 +1,28 @@
+@mixin headers {
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    font-weight: 600;
+  }
+}
+
+@mixin caption {
+  .seam-caption {
+    color: var(--text-gray-2);
+  }
+}
+
+@mixin danger-text {
+  .seam-text-danger {
+    color: var(--status-red-alert);
+  }
+}
+
+@mixin all {
+  @include headers;
+  @include caption;
+  @include danger-text;
+}

package/src/styles/access-code-table.scss

@@ -1,52 +0,0 @@
-.seam-access-code-table {
-  .seam-content-header {
-    margin: 0 16px;
-  }
-
-  .seam-table-header {
-    margin-bottom: 16px;
-    height: 56px;
-    padding: 0 16px;
-  }
-
-  .seam-icon-cell {
-    flex: 0;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    > div {
-      width: 40px;
-      height: 40px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
-  }
-
-  .seam-name-cell {
-    flex: 1;
-    flex-direction: column;
-    justify-content: center;
-    align-items: flex-start;
-    gap: 2px;
-
-    .seam-access-code-details {
-      font-size: 14px;
-      line-height: 134%;
-      color: var(--text-gray-1);
-
-      .seam-dot-divider {
-        margin: 0 4px;
-        color: var(--text-gray-3);
-      }
-    }
-  }
-
-  .seam-action-cell {
-    margin-right: 12px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-}

package/src/styles/buttons.scss

@@ -1,15 +0,0 @@
-.seam-button {
-  border-radius: 6px;
-  border: 1px solid rgb(0 122 252 / 50%);
-  cursor: pointer;
-
-  &.seam-icon-button {
-    background: #fff;
-    padding: 6px;
-    line-height: 0;
-
-    &:hover {
-      background: rgb(0 122 252 / 8%);
-    }
-  }
-}

package/src/styles/content-header.scss

@@ -1,21 +0,0 @@
-.seam-content-header {
-  height: 56px;
-  display: flex;
-  align-items: center;
-  position: relative;
-  justify-content: center;
-  width: 100%;
-
-  .seam-back-icon {
-    position: absolute;
-    top: 50%;
-    transform: translate(0, -25%);
-    left: 0;
-    cursor: pointer;
-  }
-
-  .seam-title {
-    font-size: 16px;
-    line-height: 134%;
-  }
-}

package/src/styles/device-details.scss

@@ -1,134 +0,0 @@
-.seam-device-details {
-  padding: 0 24px 24px;
-
-  .seam-body {
-    display: flex;
-    flex-direction: column;
-    gap: 16px;
-
-    .seam-box {
-      border: 1px solid var(--input-border);
-      border-radius: 8px;
-
-      .seam-content {
-        padding: 12px 12px 12px 16px;
-
-        &.seam-access-codes {
-          padding: 12px 8px 12px 16px;
-          display: flex;
-          align-items: center;
-          justify-content: space-between;
-          cursor: pointer;
-
-          &:hover {
-            background: var(--item-hover-bg);
-          }
-        }
-
-        &.seam-access-code-length {
-          border-top: 1px solid var(--input-border);
-        }
-
-        .seam-label {
-          font-size: 14px;
-          line-height: 134%;
-          color: var(--text-gray-1);
-        }
-
-        .seam-value {
-          display: block;
-          font-weight: 600;
-          font-size: 16px;
-          line-height: 134%;
-        }
-      }
-    }
-
-    .seam-summary {
-      padding: 24px 16px;
-      border-radius: 16px;
-      background: var(--bg-a);
-
-      .seam-content {
-        display: flex;
-        align-items: center;
-        gap: 20px;
-
-        .seam-image {
-          width: 100px;
-          height: 100px;
-          display: flex;
-          align-items: center;
-
-          img {
-            max-width: 100%;
-          }
-        }
-
-        .seam-info {
-          .seam-device-name {
-            margin-bottom: 16px;
-            font-weight: 600;
-            font-size: 21px;
-            line-height: 132%;
-          }
-
-          .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-label {
-              color: var(--text-gray-2);
-            }
-
-            .seam-status-text {
-              color: var(--text-gray-1);
-            }
-
-            svg {
-              scale: 0.75;
-              margin-right: 8px;
-            }
-
-            > * {
-              display: flex;
-              align-items: center;
-            }
-          }
-        }
-      }
-    }
-
-    .seam-icon-cell {
-      flex: 0;
-      margin-left: 8px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-
-      > div {
-        width: 40px;
-        height: 40px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-      }
-    }
-
-    .seam-name-cell {
-      flex: 1;
-    }
-
-    .seam-action-cell {
-      margin-right: 12px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
-  }
-}

package/src/styles/inputs.scss

@@ -1,6 +0,0 @@
-.seam-text-field {
-  padding: 0 8px;
-  height: 40px;
-  border: 1px solid var(--input-border);
-  border-radius: 8px;
-}

package/src/styles/tables.scss

@@ -1,36 +0,0 @@
-.seam-table-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.seam-table-title {
-  font-size: 21px;
-  line-height: 132%;
-
-  .seam-caption {
-    font-size: 16px;
-    line-height: 134%;
-  }
-}
-
-.seam-table-row {
-  display: flex;
-  padding: 4px;
-  height: 72px;
-
-  &:hover {
-    background: rgb(244 246 248 / 100%);
-  }
-
-  .seam-title {
-    font-weight: 600;
-    font-size: 18px;
-  }
-}
-
-.seam-table-cell {
-  display: flex;
-  align-items: center;
-  padding: 4px;
-}

package/src/styles/typography.scss

@@ -1,16 +0,0 @@
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-weight: 600;
-}
-
-.seam-caption {
-  color: var(--text-gray-2);
-}
-
-.seam-text-danger {
-  color: var(--status-red-alert);
-}