@seamapi/react 1.25.0 → 1.27.0

package/lib/seam/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/lib/seam/index.ts"],"names":[],"mappings":"AAAA,cAAc,mCAAmC,CAAA;AACjD,cAAc,oCAAoC,CAAA;AAClD,cAAc,kDAAkD,CAAA;AAChE,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/lib/seam/index.ts"],"names":[],"mappings":"AAAA,cAAc,mCAAmC,CAAA;AACjD,cAAc,oCAAoC,CAAA;AAClD,cAAc,kDAAkD,CAAA;AAChE,cAAc,yBAAyB,CAAA;AACvC,cAAc,mCAAmC,CAAA;AACjD,cAAc,0BAA0B,CAAA;AACxC,cAAc,mBAAmB,CAAA;AACjC,cAAc,sBAAsB,CAAA"}

package/lib/ui/device/OnlineStatus.d.ts

@@ -4,4 +4,5 @@ interface OnlineStatusProps {
     device: CommonDevice;
 }
 export declare function OnlineStatus(props: OnlineStatusProps): JSX.Element;
+export declare const isDeviceAccountOffline: (device: CommonDevice) => boolean;
 export {};

package/lib/ui/device/OnlineStatus.js

@@ -1,26 +1,23 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { OnlineStatusAccountOfflineIcon } from '../../../lib/icons/OnlineStatusAccountOffline.js';
 import { OnlineStatusDeviceOfflineIcon } from '../../../lib/icons/OnlineStatusDeviceOffline.js';
 import { OnlineStatusOnlineIcon } from '../../../lib/icons/OnlineStatusOnline.js';
 export function OnlineStatus(props) {
     const { device } = props;
-    const isAccountOffline = device.errors.filter((error) => error.error_code === 'account_disconnected')
-        .length > 0;
-    if (isAccountOffline) {
-        return _jsx(AccountOfflineContent, {});
-    }
-    return (_jsxs("div", { className: 'seam-online-status', children: [isAccountOffline && _jsx(OnlineStatusAccountOfflineIcon, {}), _jsx(DeviceOnlineContent, { isOnline: device.properties.online })] }));
+    return (_jsx("div", { className: 'seam-online-status', children: isDeviceAccountOffline(device) ? (_jsx(AccountOfflineContent, {})) : (_jsx(AccountOnlineContent, { isOnline: device.properties.online })) }));
 }
 function AccountOfflineContent() {
-    return (_jsxs("div", { className: 'seam-online-status', children: [_jsx(OnlineStatusAccountOfflineIcon, {}), _jsx("span", { className: 'seam-text-danger', children: t.accountOffline })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(OnlineStatusAccountOfflineIcon, {}), _jsx("span", { className: 'seam-text-danger', children: t.accountOffline })] }));
 }
-function DeviceOnlineContent(props) {
+function AccountOnlineContent(props) {
     const { isOnline } = props;
     if (isOnline) {
         return (_jsxs(_Fragment, { children: [_jsx(OnlineStatusOnlineIcon, {}), _jsx("span", { className: 'seam-status-text', children: t.online })] }));
     }
     return (_jsxs(_Fragment, { children: [_jsx(OnlineStatusDeviceOfflineIcon, {}), _jsx("span", { className: 'seam-text-danger', children: t.deviceOffline })] }));
 }
+export const isDeviceAccountOffline = (device) => device.errors.filter((error) => error.error_code === 'account_disconnected')
+    .length > 0;
 const t = {
     online: 'Online',
     accountOffline: 'Account Offline',

package/lib/ui/device/OnlineStatus.js.map

@@ -1 +1 @@
-{"version":3,"file":"OnlineStatus.js","sourceRoot":"","sources":["../../../src/lib/ui/device/OnlineStatus.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,8BAA8B,EAAE,MAAM,yCAAyC,CAAA;AACxF,OAAO,EAAE,6BAA6B,EAAE,MAAM,wCAAwC,CAAA;AACtF,OAAO,EAAE,sBAAsB,EAAE,MAAM,iCAAiC,CAAA;AAMxE,MAAM,UAAU,YAAY,CAAC,KAAwB;IACnD,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAA;IAExB,MAAM,gBAAgB,GACpB,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,UAAU,KAAK,sBAAsB,CAAC;SACzE,MAAM,GAAG,CAAC,CAAA;IAEf,IAAI,gBAAgB,EAAE;QACpB,OAAO,KAAC,qBAAqB,KAAG,CAAA;KACjC;IAED,OAAO,CACL,eAAK,SAAS,EAAC,oBAAoB,aAChC,gBAAgB,IAAI,KAAC,8BAA8B,KAAG,EACvD,KAAC,mBAAmB,IAAC,QAAQ,EAAE,MAAM,CAAC,UAAU,CAAC,MAAM,GAAI,IACvD,CACP,CAAA;AACH,CAAC;AAED,SAAS,qBAAqB;IAC5B,OAAO,CACL,eAAK,SAAS,EAAC,oBAAoB,aACjC,KAAC,8BAA8B,KAAG,EAClC,eAAM,SAAS,EAAC,kBAAkB,YAAE,CAAC,CAAC,cAAc,GAAQ,IACxD,CACP,CAAA;AACH,CAAC;AAED,SAAS,mBAAmB,CAAC,KAA4B;IACvD,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAA;IAC1B,IAAI,QAAQ,EAAE;QACZ,OAAO,CACL,8BACE,KAAC,sBAAsB,KAAG,EAC1B,eAAM,SAAS,EAAC,kBAAkB,YAAE,CAAC,CAAC,MAAM,GAAQ,IACnD,CACJ,CAAA;KACF;IAED,OAAO,CACL,8BACE,KAAC,6BAA6B,KAAG,EACjC,eAAM,SAAS,EAAC,kBAAkB,YAAE,CAAC,CAAC,aAAa,GAAQ,IAC1D,CACJ,CAAA;AACH,CAAC;AAED,MAAM,CAAC,GAAG;IACR,MAAM,EAAE,QAAQ;IAChB,cAAc,EAAE,iBAAiB;IACjC,aAAa,EAAE,gBAAgB;CAChC,CAAA"}
+{"version":3,"file":"OnlineStatus.js","sourceRoot":"","sources":["../../../src/lib/ui/device/OnlineStatus.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,8BAA8B,EAAE,MAAM,yCAAyC,CAAA;AACxF,OAAO,EAAE,6BAA6B,EAAE,MAAM,wCAAwC,CAAA;AACtF,OAAO,EAAE,sBAAsB,EAAE,MAAM,iCAAiC,CAAA;AAMxE,MAAM,UAAU,YAAY,CAAC,KAAwB;IACnD,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAA;IAExB,OAAO,CACL,cAAK,SAAS,EAAC,oBAAoB,YAChC,sBAAsB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAChC,KAAC,qBAAqB,KAAG,CAC1B,CAAC,CAAC,CAAC,CACF,KAAC,oBAAoB,IAAC,QAAQ,EAAE,MAAM,CAAC,UAAU,CAAC,MAAM,GAAI,CAC7D,GACG,CACP,CAAA;AACH,CAAC;AAED,SAAS,qBAAqB;IAC5B,OAAO,CACL,8BACE,KAAC,8BAA8B,KAAG,EAClC,eAAM,SAAS,EAAC,kBAAkB,YAAE,CAAC,CAAC,cAAc,GAAQ,IAC3D,CACJ,CAAA;AACH,CAAC;AAED,SAAS,oBAAoB,CAAC,KAA4B;IACxD,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAA;IAC1B,IAAI,QAAQ,EAAE;QACZ,OAAO,CACL,8BACE,KAAC,sBAAsB,KAAG,EAC1B,eAAM,SAAS,EAAC,kBAAkB,YAAE,CAAC,CAAC,MAAM,GAAQ,IACnD,CACJ,CAAA;KACF;IAED,OAAO,CACL,8BACE,KAAC,6BAA6B,KAAG,EACjC,eAAM,SAAS,EAAC,kBAAkB,YAAE,CAAC,CAAC,aAAa,GAAQ,IAC1D,CACJ,CAAA;AACH,CAAC;AAED,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,MAAoB,EAAW,EAAE,CACtE,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,UAAU,KAAK,sBAAsB,CAAC;KACzE,MAAM,GAAG,CAAC,CAAA;AAEf,MAAM,CAAC,GAAG;IACR,MAAM,EAAE,QAAQ;IAChB,cAAc,EAAE,iBAAiB;IACjC,aAAa,EAAE,gBAAgB;CAChC,CAAA"}

package/lib/version.d.ts

@@ -1,2 +1,2 @@
-declare const seamapiReactVersion = "1.25.0";
+declare const seamapiReactVersion = "1.27.0";
 export default seamapiReactVersion;

package/lib/version.js

@@ -1,3 +1,3 @@
-const seamapiReactVersion = '1.25.0';
+const seamapiReactVersion = '1.27.0';
 export default seamapiReactVersion;
 //# sourceMappingURL=version.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seamapi/react",
-  "version": "1.25.0",
+  "version": "1.27.0",
   "description": "Seam Components.",
   "type": "module",
   "main": "index.js",
@@ -103,8 +103,18 @@
     "npm": ">= 8.1.0"
   },
   "peerDependencies": {
-    "react": ">=18.0.0",
-    "react-dom": ">=18.0.0"
+    "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+    "@types/react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
+    "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+    "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@types/react": {
+      "optional": true
+    },
+    "@types/react-dom": {
+      "optional": true
+    }
   },
   "dependencies": {
     "@tanstack/react-query": "^4.28.0",
@@ -123,13 +133,11 @@
     "@r2wc/react-to-web-component": "^2.0.2",
     "@seamapi/fake-seam-connect": "^0.10.0",
     "@storybook/addon-essentials": "^7.0.2",
-    "@storybook/addon-interactions": "^7.0.2",
     "@storybook/addon-links": "^7.0.2",
     "@storybook/addon-styling": "^1.0.5",
     "@storybook/blocks": "^7.0.2",
     "@storybook/react": "^7.0.2",
     "@storybook/react-webpack5": "^7.0.2",
-    "@storybook/testing-library": "^0.1.0",
     "@svgr/cli": "^8.0.1",
     "@testing-library/react": "^14.0.0",
     "@types/jest": "^29.5.0",
@@ -145,9 +153,10 @@
     "del-cli": "^5.0.0",
     "eslint": "^8.9.0",
     "eslint-config-prettier": "^8.4.0",
+    "eslint-config-standard": "^17.1.0",
     "eslint-config-standard-jsx": "^11.0.0",
     "eslint-config-standard-react": "^13.0.0",
-    "eslint-config-standard-with-typescript": "^35.0.0",
+    "eslint-config-standard-with-typescript": "^36.0.0",
     "eslint-plugin-simple-import-sort": "^10.0.0",
     "eslint-plugin-storybook": "^0.6.11",
     "eslint-plugin-unused-imports": "^2.0.0",
@@ -164,11 +173,11 @@
     "storybook": "^7.0.2",
     "storybook-addon-designs": "^7.0.0-beta.2",
     "stylelint": "^15.6.0",
-    "stylelint-config-standard-scss": "^9.0.0",
+    "stylelint-config-standard-scss": "^10.0.0",
     "ts-jest": "^29.1.0",
     "tsc-alias": "^1.8.5",
     "tsconfig-paths-webpack-plugin": "^4.0.1",
-    "typescript": "^5.0.2",
+    "typescript": "~5.0.0",
     "vite": "^4.2.1",
     "vite-tsconfig-paths": "^4.0.8",
     "zustand-hoist": "^1.0.0"

package/src/lib/element.tsx

@@ -56,7 +56,7 @@ export const defineCustomElement = ({
 function withProvider<P extends JSX.IntrinsicAttributes>(
   Component: ComponentType<P>
 ) {
-  return ({
+  return function ({
     publishableKey,
     userIdentifierKey,
     clientSessionToken,
@@ -65,7 +65,7 @@ function withProvider<P extends JSX.IntrinsicAttributes>(
     unminifiyCss,
     container: _container,
     ...props
-  }: ProviderProps & { container: Container } & P): JSX.Element | null => {
+  }: ProviderProps & { container: Container } & P): JSX.Element | null {
     return (
       <SeamProvider
         publishableKey={publishableKey}

package/src/lib/icons/AccessCodeKey.tsx

@@ -1,19 +1,23 @@
+/*
+ * Automaically generated by SVGR from assets/icons/*.svg.
+ * Do not edit this file or add other components to this directory.
+ */
 import type { SVGProps } from 'react'
-export const AccessCodeKeyIcon = (
-  props: SVGProps<SVGSVGElement>
-): JSX.Element => (
-  <svg
-    xmlns='http://www.w3.org/2000/svg'
-    width={24}
-    height={24}
-    fill='none'
-    {...props}
-  >
-    <path
-      fill='#232B3A'
-      fillRule='evenodd'
-      d='m20.493 14.743 1.558-1.451.058-.06c.599-.701.598-1.855 0-2.556a.73.73 0 0 0-.07-.07l-.547-.49a1.863 1.863 0 0 0-1.377-.612L16.444 9.5l-.45-.575c-.18-.23-.411-.416-.819-.416H12.93a5.992 5.992 0 0 0-4.877-2.52c-3.311-.004-5.996 2.684-5.995 6.005.001 3.32 2.686 6.013 5.995 6.017a5.978 5.978 0 0 0 5.056-2.774l.011-.017.015-.026h6.008l.065.002c.26.006.85.02 1.285-.453Zm-.149-3.4.513.458a.484.484 0 0 1-.003.31l-1.505 1.401H12.717a.937.937 0 0 0-.804.456l-.223.374a4.303 4.303 0 0 1-3.635 1.987 4.333 4.333 0 0 1-4.32-4.335A4.315 4.315 0 0 1 8.05 7.67a4.32 4.32 0 0 1 3.617 1.966l.105.21c.217.407.944.407.944.407s1.421-.032 2.186 0l.443.567c.177.227.449.36.736.36l4.03.005c.056 0 .108.024.144.067a.948.948 0 0 0 .088.09Zm-13.92 1.86a1.2 1.2 0 0 0 1.2-1.202 1.2 1.2 0 0 0-1.2-1.203A1.2 1.2 0 0 0 5.225 12a1.2 1.2 0 0 0 1.2 1.202Z'
-      clipRule='evenodd'
-    />
-  </svg>
-)
+export function AccessCodeKeyIcon(props: SVGProps<SVGSVGElement>): JSX.Element {
+  return (
+    <svg
+      xmlns='http://www.w3.org/2000/svg'
+      width={24}
+      height={24}
+      fill='none'
+      {...props}
+    >
+      <path
+        fill='#232B3A'
+        fillRule='evenodd'
+        d='m20.493 14.743 1.558-1.451.058-.06c.599-.701.598-1.855 0-2.556a.73.73 0 0 0-.07-.07l-.547-.49a1.863 1.863 0 0 0-1.377-.612L16.444 9.5l-.45-.575c-.18-.23-.411-.416-.819-.416H12.93a5.992 5.992 0 0 0-4.877-2.52c-3.311-.004-5.996 2.684-5.995 6.005.001 3.32 2.686 6.013 5.995 6.017a5.978 5.978 0 0 0 5.056-2.774l.011-.017.015-.026h6.008l.065.002c.26.006.85.02 1.285-.453Zm-.149-3.4.513.458a.484.484 0 0 1-.003.31l-1.505 1.401H12.717a.937.937 0 0 0-.804.456l-.223.374a4.303 4.303 0 0 1-3.635 1.987 4.333 4.333 0 0 1-4.32-4.335A4.315 4.315 0 0 1 8.05 7.67a4.32 4.32 0 0 1 3.617 1.966l.105.21c.217.407.944.407.944.407s1.421-.032 2.186 0l.443.567c.177.227.449.36.736.36l4.03.005c.056 0 .108.024.144.067a.948.948 0 0 0 .088.09Zm-13.92 1.86a1.2 1.2 0 0 0 1.2-1.202 1.2 1.2 0 0 0-1.2-1.203A1.2 1.2 0 0 0 5.225 12a1.2 1.2 0 0 0 1.2 1.202Z'
+        clipRule='evenodd'
+      />
+    </svg>
+  )
+}

package/src/lib/icons/ArrowBack.tsx

@@ -1,30 +1,36 @@
+/*
+ * Automaically generated by SVGR from assets/icons/*.svg.
+ * Do not edit this file or add other components to this directory.
+ */
 import type { SVGProps } from 'react'
-export const ArrowBackIcon = (props: SVGProps<SVGSVGElement>): JSX.Element => (
-  <svg
-    xmlns='http://www.w3.org/2000/svg'
-    width={24}
-    height={24}
-    fill='none'
-    {...props}
-  >
-    <mask
-      id='arrow-back_svg__a'
+export function ArrowBackIcon(props: SVGProps<SVGSVGElement>): JSX.Element {
+  return (
+    <svg
+      xmlns='http://www.w3.org/2000/svg'
       width={24}
       height={24}
-      x={0}
-      y={0}
-      maskUnits='userSpaceOnUse'
-      style={{
-        maskType: 'alpha',
-      }}
+      fill='none'
+      {...props}
     >
-      <path fill='#D9D9D9' d='M0 0h24v24H0z' />
-    </mask>
-    <g mask='url(#arrow-back_svg__a)'>
-      <path
-        fill='#6E7179'
-        d='m12 20-8-8 8-8 1.425 1.4-5.6 5.6H20v2H7.825l5.6 5.6L12 20Z'
-      />
-    </g>
-  </svg>
-)
+      <mask
+        id='arrow-back_svg__a'
+        width={24}
+        height={24}
+        x={0}
+        y={0}
+        maskUnits='userSpaceOnUse'
+        style={{
+          maskType: 'alpha',
+        }}
+      >
+        <path fill='#D9D9D9' d='M0 0h24v24H0z' />
+      </mask>
+      <g mask='url(#arrow-back_svg__a)'>
+        <path
+          fill='#6E7179'
+          d='m12 20-8-8 8-8 1.425 1.4-5.6 5.6H20v2H7.825l5.6 5.6L12 20Z'
+        />
+      </g>
+    </svg>
+  )
+}

package/src/lib/icons/ArrowRestart.tsx

@@ -1,32 +1,36 @@
+/*
+ * Automaically generated by SVGR from assets/icons/*.svg.
+ * Do not edit this file or add other components to this directory.
+ */
 import type { SVGProps } from 'react'
-export const ArrowRestartIcon = (
-  props: SVGProps<SVGSVGElement>
-): JSX.Element => (
-  <svg
-    xmlns='http://www.w3.org/2000/svg'
-    width={24}
-    height={24}
-    fill='none'
-    {...props}
-  >
-    <mask
-      id='arrow-restart_svg__a'
+export function ArrowRestartIcon(props: SVGProps<SVGSVGElement>): JSX.Element {
+  return (
+    <svg
+      xmlns='http://www.w3.org/2000/svg'
       width={24}
       height={24}
-      x={0}
-      y={0}
-      maskUnits='userSpaceOnUse'
-      style={{
-        maskType: 'alpha',
-      }}
+      fill='none'
+      {...props}
     >
-      <path fill='#D9D9D9' d='M0 0h24v24H0z' />
-    </mask>
-    <g mask='url(#arrow-restart_svg__a)'>
-      <path
-        fill='#232B3A'
-        d='M12 20c2.233 0 4.125-.775 5.675-2.325C19.225 16.125 20 14.233 20 12c0-2.233-.775-4.125-2.325-5.675C16.125 4.775 14.233 4 12 4c-1.15 0-2.25.238-3.3.713A7.617 7.617 0 0 0 6 6.75V4H4v7h7V9H6.8a5.838 5.838 0 0 1 2.187-2.2A5.93 5.93 0 0 1 12 6c1.667 0 3.083.583 4.25 1.75C17.417 8.917 18 10.333 18 12c0 1.667-.583 3.083-1.75 4.25C15.083 17.417 13.667 18 12 18a5.863 5.863 0 0 1-3.475-1.1A5.809 5.809 0 0 1 6.35 14h-2.1c.467 1.767 1.417 3.208 2.85 4.325S10.167 20 12 20Z'
-      />
-    </g>
-  </svg>
-)
+      <mask
+        id='arrow-restart_svg__a'
+        width={24}
+        height={24}
+        x={0}
+        y={0}
+        maskUnits='userSpaceOnUse'
+        style={{
+          maskType: 'alpha',
+        }}
+      >
+        <path fill='#D9D9D9' d='M0 0h24v24H0z' />
+      </mask>
+      <g mask='url(#arrow-restart_svg__a)'>
+        <path
+          fill='#232B3A'
+          d='M12 20c2.233 0 4.125-.775 5.675-2.325C19.225 16.125 20 14.233 20 12c0-2.233-.775-4.125-2.325-5.675C16.125 4.775 14.233 4 12 4c-1.15 0-2.25.238-3.3.713A7.617 7.617 0 0 0 6 6.75V4H4v7h7V9H6.8a5.838 5.838 0 0 1 2.187-2.2A5.93 5.93 0 0 1 12 6c1.667 0 3.083.583 4.25 1.75C17.417 8.917 18 10.333 18 12c0 1.667-.583 3.083-1.75 4.25C15.083 17.417 13.667 18 12 18a5.863 5.863 0 0 1-3.475-1.1A5.809 5.809 0 0 1 6.35 14h-2.1c.467 1.767 1.417 3.208 2.85 4.325S10.167 20 12 20Z'
+        />
+      </g>
+    </svg>
+  )
+}

package/src/lib/icons/BatteryLevelCritical.tsx

@@ -1,27 +1,33 @@
+/*
+ * Automaically generated by SVGR from assets/icons/*.svg.
+ * Do not edit this file or add other components to this directory.
+ */
 import type { SVGProps } from 'react'
-export const BatteryLevelCriticalIcon = (
+export function BatteryLevelCriticalIcon(
   props: SVGProps<SVGSVGElement>
-): JSX.Element => (
-  <svg
-    xmlns='http://www.w3.org/2000/svg'
-    width={24}
-    height={25}
-    fill='none'
-    {...props}
-  >
-    <rect
-      width={1.855}
-      height={6}
-      x={17.147}
-      y={9.5}
-      fill='#E36857'
-      rx={0.75}
-    />
-    <path
-      fill='#E36857'
-      fillRule='evenodd'
-      d='M19.52 6.269H5.5c-1.684 0-2.734 1.19-2.734 2.66v.804c-.765.23-1.352 1.02-1.352 1.962v1.558c0 .941.587 1.733 1.352 1.962v.764c0 1.473 1.044 2.748 2.734 2.748h14c1.646 0 2.736-.897 2.736-2.768V9c0-1.87-1.07-2.73-2.716-2.73Zm-14.793 2c.186-.207.484-.363.919-.363h13.627c.777 0 1.3.489 1.3 1.373v6.446c0 .884-.523 1.374-1.3 1.374H5.646c-.435 0-.733-.157-.92-.363-.183-.204-.322-.529-.322-1.01v-1.939H3.232c-.208 0-.251-.15-.251-.28v-2.02c0-.168.083-.267.25-.267h1.173V9.28c0-.482.139-.807.323-1.01Z'
-      clipRule='evenodd'
-    />
-  </svg>
-)
+): JSX.Element {
+  return (
+    <svg
+      xmlns='http://www.w3.org/2000/svg'
+      width={24}
+      height={25}
+      fill='none'
+      {...props}
+    >
+      <rect
+        width={1.855}
+        height={6}
+        x={17.147}
+        y={9.5}
+        fill='#E36857'
+        rx={0.75}
+      />
+      <path
+        fill='#E36857'
+        fillRule='evenodd'
+        d='M19.52 6.269H5.5c-1.684 0-2.734 1.19-2.734 2.66v.804c-.765.23-1.352 1.02-1.352 1.962v1.558c0 .941.587 1.733 1.352 1.962v.764c0 1.473 1.044 2.748 2.734 2.748h14c1.646 0 2.736-.897 2.736-2.768V9c0-1.87-1.07-2.73-2.716-2.73Zm-14.793 2c.186-.207.484-.363.919-.363h13.627c.777 0 1.3.489 1.3 1.373v6.446c0 .884-.523 1.374-1.3 1.374H5.646c-.435 0-.733-.157-.92-.363-.183-.204-.322-.529-.322-1.01v-1.939H3.232c-.208 0-.251-.15-.251-.28v-2.02c0-.168.083-.267.25-.267h1.173V9.28c0-.482.139-.807.323-1.01Z'
+        clipRule='evenodd'
+      />
+    </svg>
+  )
+}

package/src/lib/icons/BatteryLevelFull.tsx

@@ -1,20 +1,33 @@
+/*
+ * Automaically generated by SVGR from assets/icons/*.svg.
+ * Do not edit this file or add other components to this directory.
+ */
 import type { SVGProps } from 'react'
-export const BatteryLevelFullIcon = (
+export function BatteryLevelFullIcon(
   props: SVGProps<SVGSVGElement>
-): JSX.Element => (
-  <svg
-    xmlns='http://www.w3.org/2000/svg'
-    width={24}
-    height={25}
-    fill='none'
-    {...props}
-  >
-    <rect width={13.06} height={6} x={5.941} y={9.5} fill='#27AE60' rx={0.75} />
-    <path
-      fill='#9DA1A9'
-      fillRule='evenodd'
-      d='M19.52 6.269H5.5c-1.684 0-2.734 1.19-2.734 2.66v.804c-.765.23-1.352 1.02-1.352 1.962v1.558c0 .941.587 1.733 1.352 1.962v.764c0 1.473 1.044 2.748 2.734 2.748h14c1.646 0 2.736-.897 2.736-2.768V9c0-1.87-1.07-2.73-2.716-2.73Zm-14.793 2c.186-.207.484-.363.919-.363h13.627c.777 0 1.3.489 1.3 1.373v6.446c0 .884-.523 1.374-1.3 1.374H5.646c-.435 0-.733-.157-.92-.363-.183-.204-.322-.529-.322-1.01v-1.939H3.232c-.208 0-.251-.15-.251-.28v-2.02c0-.168.083-.267.25-.267h1.173V9.28c0-.482.139-.807.323-1.01Z'
-      clipRule='evenodd'
-    />
-  </svg>
-)
+): JSX.Element {
+  return (
+    <svg
+      xmlns='http://www.w3.org/2000/svg'
+      width={24}
+      height={25}
+      fill='none'
+      {...props}
+    >
+      <rect
+        width={13.06}
+        height={6}
+        x={5.941}
+        y={9.5}
+        fill='#27AE60'
+        rx={0.75}
+      />
+      <path
+        fill='#9DA1A9'
+        fillRule='evenodd'
+        d='M19.52 6.269H5.5c-1.684 0-2.734 1.19-2.734 2.66v.804c-.765.23-1.352 1.02-1.352 1.962v1.558c0 .941.587 1.733 1.352 1.962v.764c0 1.473 1.044 2.748 2.734 2.748h14c1.646 0 2.736-.897 2.736-2.768V9c0-1.87-1.07-2.73-2.716-2.73Zm-14.793 2c.186-.207.484-.363.919-.363h13.627c.777 0 1.3.489 1.3 1.373v6.446c0 .884-.523 1.374-1.3 1.374H5.646c-.435 0-.733-.157-.92-.363-.183-.204-.322-.529-.322-1.01v-1.939H3.232c-.208 0-.251-.15-.251-.28v-2.02c0-.168.083-.267.25-.267h1.173V9.28c0-.482.139-.807.323-1.01Z'
+        clipRule='evenodd'
+      />
+    </svg>
+  )
+}

package/src/lib/icons/BatteryLevelHigh.tsx

@@ -1,27 +1,33 @@
+/*
+ * Automaically generated by SVGR from assets/icons/*.svg.
+ * Do not edit this file or add other components to this directory.
+ */
 import type { SVGProps } from 'react'
-export const BatteryLevelHighIcon = (
+export function BatteryLevelHighIcon(
   props: SVGProps<SVGSVGElement>
-): JSX.Element => (
-  <svg
-    xmlns='http://www.w3.org/2000/svg'
-    width={24}
-    height={25}
-    fill='none'
-    {...props}
-  >
-    <rect
-      width={10.303}
-      height={6}
-      x={8.699}
-      y={9.5}
-      fill='#27AE60'
-      rx={0.75}
-    />
-    <path
-      fill='#9DA1A9'
-      fillRule='evenodd'
-      d='M19.52 6.269H5.5c-1.684 0-2.734 1.19-2.734 2.66v.804c-.765.23-1.352 1.02-1.352 1.962v1.558c0 .941.587 1.733 1.352 1.962v.764c0 1.473 1.044 2.748 2.734 2.748h14c1.646 0 2.736-.897 2.736-2.768V9c0-1.87-1.07-2.73-2.716-2.73Zm-14.793 2c.186-.207.484-.363.919-.363h13.627c.777 0 1.3.489 1.3 1.373v6.446c0 .884-.523 1.374-1.3 1.374H5.646c-.435 0-.733-.157-.92-.363-.183-.204-.322-.529-.322-1.01v-1.939H3.232c-.208 0-.251-.15-.251-.28v-2.02c0-.168.083-.267.25-.267h1.173V9.28c0-.482.139-.807.323-1.01Z'
-      clipRule='evenodd'
-    />
-  </svg>
-)
+): JSX.Element {
+  return (
+    <svg
+      xmlns='http://www.w3.org/2000/svg'
+      width={24}
+      height={25}
+      fill='none'
+      {...props}
+    >
+      <rect
+        width={10.303}
+        height={6}
+        x={8.699}
+        y={9.5}
+        fill='#27AE60'
+        rx={0.75}
+      />
+      <path
+        fill='#9DA1A9'
+        fillRule='evenodd'
+        d='M19.52 6.269H5.5c-1.684 0-2.734 1.19-2.734 2.66v.804c-.765.23-1.352 1.02-1.352 1.962v1.558c0 .941.587 1.733 1.352 1.962v.764c0 1.473 1.044 2.748 2.734 2.748h14c1.646 0 2.736-.897 2.736-2.768V9c0-1.87-1.07-2.73-2.716-2.73Zm-14.793 2c.186-.207.484-.363.919-.363h13.627c.777 0 1.3.489 1.3 1.373v6.446c0 .884-.523 1.374-1.3 1.374H5.646c-.435 0-.733-.157-.92-.363-.183-.204-.322-.529-.322-1.01v-1.939H3.232c-.208 0-.251-.15-.251-.28v-2.02c0-.168.083-.267.25-.267h1.173V9.28c0-.482.139-.807.323-1.01Z'
+        clipRule='evenodd'
+      />
+    </svg>
+  )
+}

package/src/lib/icons/BatteryLevelLow.tsx

@@ -1,27 +1,33 @@
+/*
+ * Automaically generated by SVGR from assets/icons/*.svg.
+ * Do not edit this file or add other components to this directory.
+ */
 import type { SVGProps } from 'react'
-export const BatteryLevelLowIcon = (
+export function BatteryLevelLowIcon(
   props: SVGProps<SVGSVGElement>
-): JSX.Element => (
-  <svg
-    xmlns='http://www.w3.org/2000/svg'
-    width={24}
-    height={25}
-    fill='none'
-    {...props}
-  >
-    <rect
-      width={4.829}
-      height={6}
-      x={14.172}
-      y={9.5}
-      fill='#E36857'
-      rx={0.75}
-    />
-    <path
-      fill='#9DA1A9'
-      fillRule='evenodd'
-      d='M19.52 6.269H5.5c-1.684 0-2.734 1.19-2.734 2.66v.804c-.765.23-1.352 1.02-1.352 1.962v1.558c0 .941.587 1.733 1.352 1.962v.764c0 1.473 1.044 2.748 2.734 2.748h14c1.646 0 2.736-.897 2.736-2.768V9c0-1.87-1.07-2.73-2.716-2.73Zm-14.793 2c.186-.207.484-.363.919-.363h13.627c.777 0 1.3.489 1.3 1.373v6.446c0 .884-.523 1.374-1.3 1.374H5.646c-.435 0-.733-.157-.92-.363-.183-.204-.322-.529-.322-1.01v-1.939H3.232c-.208 0-.251-.15-.251-.28v-2.02c0-.168.083-.267.25-.267h1.173V9.28c0-.482.139-.807.323-1.01Z'
-      clipRule='evenodd'
-    />
-  </svg>
-)
+): JSX.Element {
+  return (
+    <svg
+      xmlns='http://www.w3.org/2000/svg'
+      width={24}
+      height={25}
+      fill='none'
+      {...props}
+    >
+      <rect
+        width={4.829}
+        height={6}
+        x={14.172}
+        y={9.5}
+        fill='#E36857'
+        rx={0.75}
+      />
+      <path
+        fill='#9DA1A9'
+        fillRule='evenodd'
+        d='M19.52 6.269H5.5c-1.684 0-2.734 1.19-2.734 2.66v.804c-.765.23-1.352 1.02-1.352 1.962v1.558c0 .941.587 1.733 1.352 1.962v.764c0 1.473 1.044 2.748 2.734 2.748h14c1.646 0 2.736-.897 2.736-2.768V9c0-1.87-1.07-2.73-2.716-2.73Zm-14.793 2c.186-.207.484-.363.919-.363h13.627c.777 0 1.3.489 1.3 1.373v6.446c0 .884-.523 1.374-1.3 1.374H5.646c-.435 0-.733-.157-.92-.363-.183-.204-.322-.529-.322-1.01v-1.939H3.232c-.208 0-.251-.15-.251-.28v-2.02c0-.168.083-.267.25-.267h1.173V9.28c0-.482.139-.807.323-1.01Z'
+        clipRule='evenodd'
+      />
+    </svg>
+  )
+}

package/src/lib/icons/BatteryLevelWired.tsx

@@ -1,34 +1,40 @@
+/*
+ * Automaically generated by SVGR from assets/icons/*.svg.
+ * Do not edit this file or add other components to this directory.
+ */
 import type { SVGProps } from 'react'
-export const BatteryLevelWiredIcon = (
+export function BatteryLevelWiredIcon(
   props: SVGProps<SVGSVGElement>
-): JSX.Element => (
-  <svg
-    xmlns='http://www.w3.org/2000/svg'
-    width={24}
-    height={25}
-    fill='none'
-    {...props}
-  >
-    <mask
-      id='battery-level-wired_svg__a'
+): JSX.Element {
+  return (
+    <svg
+      xmlns='http://www.w3.org/2000/svg'
       width={24}
       height={25}
-      x={0}
-      y={0}
-      maskUnits='userSpaceOnUse'
-      style={{
-        maskType: 'alpha',
-      }}
+      fill='none'
+      {...props}
     >
-      <path fill='#D9D9D9' d='M0 .5h24v24H0z' />
-    </mask>
-    <g mask='url(#battery-level-wired_svg__a)'>
-      <path
-        fill='#6E7179'
-        fillRule='evenodd'
-        d='M14.5 18.505a1 1 0 1 0 2 0V15.5h5a1 1 0 1 0 0-2h-5v-3h5a1 1 0 1 0 0-2h-5V5.444a1 1 0 1 0-2 0v.117h-3.576c-2.096 0-3.265 1.922-3.892 3.068-.226.413-.378.518-.548.518H2.51c-1.258 0-2.01.993-2.01 1.96v1.873c0 .968.725 2.196 2.01 2.196h3.996c.21 0 .287.154.405.393.04.082.085.172.142.27.645 1.118 1.817 2.55 3.871 2.55H14.5v.116Zm-3.089-2.065c-2.458 0-3.589-3.46-3.589-3.46H2.51v-1.873h5.312s1.131-3.57 3.59-3.57h3.052v8.903H11.41Z'
-        clipRule='evenodd'
-      />
-    </g>
-  </svg>
-)
+      <mask
+        id='battery-level-wired_svg__a'
+        width={24}
+        height={25}
+        x={0}
+        y={0}
+        maskUnits='userSpaceOnUse'
+        style={{
+          maskType: 'alpha',
+        }}
+      >
+        <path fill='#D9D9D9' d='M0 .5h24v24H0z' />
+      </mask>
+      <g mask='url(#battery-level-wired_svg__a)'>
+        <path
+          fill='#6E7179'
+          fillRule='evenodd'
+          d='M14.5 18.505a1 1 0 1 0 2 0V15.5h5a1 1 0 1 0 0-2h-5v-3h5a1 1 0 1 0 0-2h-5V5.444a1 1 0 1 0-2 0v.117h-3.576c-2.096 0-3.265 1.922-3.892 3.068-.226.413-.378.518-.548.518H2.51c-1.258 0-2.01.993-2.01 1.96v1.873c0 .968.725 2.196 2.01 2.196h3.996c.21 0 .287.154.405.393.04.082.085.172.142.27.645 1.118 1.817 2.55 3.871 2.55H14.5v.116Zm-3.089-2.065c-2.458 0-3.589-3.46-3.589-3.46H2.51v-1.873h5.312s1.131-3.57 3.59-3.57h3.052v8.903H11.41Z'
+          clipRule='evenodd'
+        />
+      </g>
+    </svg>
+  )
+}