@seamapi/react 2.6.0 → 2.8.0

package/lib/seam/components/SupportedDeviceTable/SupportedDeviceManufacturerSection.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import classNames from 'classnames';
 import { ChevronRightIcon } from '../../../../lib/icons/ChevronRight.js';
+import { InfoBlueIcon } from '../../../../lib/icons/InfoBlue.js';
 import { HiddenDevicesOverlay } from '../../../../lib/seam/components/SupportedDeviceTable/HiddenDevicesOverlay.js';
 import { ShowAllDevicesButton } from '../../../../lib/seam/components/SupportedDeviceTable/ShowAllDevicesButton.js';
 import { SupportedDeviceRow } from '../../../../lib/seam/components/SupportedDeviceTable/SupportedDeviceRow.js';
@@ -27,7 +28,10 @@ export function SupportedDeviceManufacturerSection({ manufacturerId, deviceModel
     return (_jsxs("div", { className: classNames('seam-manufacturer-section', {
             'can-expand': canExpand,
             expanded,
-        }), children: [_jsxs("div", { className: 'seam-header', onClick: handleHeaderClick, children: [_jsx("img", { src: manufacturer?.logo?.url, alt: manufacturer?.display_name, className: 'seam-manufacturer-image' }), _jsxs("h5", { className: 'seam-manufacturer-name', children: [manufacturer?.display_name, " ", t.devices] }), canExpand && _jsx(ChevronRightIcon, { className: 'chevron' })] }), _jsx("div", { className: 'seam-supported-device-table-content', children: visibleDevices.map((deviceModel) => (_jsx(SupportedDeviceRow, { deviceModel: deviceModel }, deviceModel.device_model_id))) }), _jsx(ShowAllDevicesButton, { visible: canExpand, onClick: toggleExpand, expanded: expanded, totalDeviceCount: deviceModels.length }), _jsx(HiddenDevicesOverlay, { visible: canExpand && !expanded })] }));
+        }), children: [_jsxs("div", { className: 'seam-header', onClick: handleHeaderClick, children: [_jsx("img", { src: manufacturer?.logo?.url, alt: manufacturer?.display_name, className: 'seam-manufacturer-image' }), _jsxs("h5", { className: 'seam-manufacturer-name', children: [manufacturer?.display_name, " ", t.devices] }), canExpand && _jsx(ChevronRightIcon, { className: 'chevron' })] }), manufacturer?.annotations.map((annotation, idx) => (_jsx(ManufacturerAnnotationBox, { annotation: annotation }, [annotation.annotation_code, idx].join('_')))), _jsx("div", { className: 'seam-supported-device-table-content', children: visibleDevices.map((deviceModel) => (_jsx(SupportedDeviceRow, { deviceModel: deviceModel }, deviceModel.device_model_id))) }), _jsx(ShowAllDevicesButton, { visible: canExpand, onClick: toggleExpand, expanded: expanded, totalDeviceCount: deviceModels.length }), _jsx(HiddenDevicesOverlay, { visible: canExpand && !expanded })] }));
+}
+function ManufacturerAnnotationBox({ annotation, }) {
+    return (_jsxs("div", { className: 'seam-manufacturer-annotation-box', children: [_jsx(InfoBlueIcon, {}), _jsx("p", { className: 'seam-annotation', children: annotation.message })] }));
 }
 const t = {
     devices: 'Devices',

package/lib/seam/components/SupportedDeviceTable/SupportedDeviceManufacturerSection.js.map

@@ -1 +1 @@
-{"version":3,"file":"SupportedDeviceManufacturerSection.js","sourceRoot":"","sources":["../../../../src/lib/seam/components/SupportedDeviceTable/SupportedDeviceManufacturerSection.tsx"],"names":[],"mappings":";AACA,OAAO,UAAU,MAAM,YAAY,CAAA;AAEnC,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAA;AAC5D,OAAO,EAAE,oBAAoB,EAAE,MAAM,kEAAkE,CAAA;AACvG,OAAO,EAAE,oBAAoB,EAAE,MAAM,kEAAkE,CAAA;AACvG,OAAO,EAAE,kBAAkB,EAAE,MAAM,gEAAgE,CAAA;AACnG,OAAO,EAAE,eAAe,EAAE,MAAM,8DAA8D,CAAA;AAC9F,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAA;AAEhD;;;GAGG;AACH,MAAM,0BAA0B,GAAG,CAAC,CAAA;AAOpC,MAAM,UAAU,kCAAkC,CAAC,EACjD,cAAc,EACd,YAAY,GAC4B;IACxC,MAAM,EAAE,YAAY,EAAE,GAAG,eAAe,CAAC,EAAE,eAAe,EAAE,cAAc,EAAE,CAAC,CAAA;IAE7E,MAAM,CAAC,QAAQ,EAAE,YAAY,CAAC,GAAG,SAAS,EAAE,CAAA;IAE5C,MAAM,SAAS,GAAG,YAAY,CAAC,MAAM,GAAG,0BAA0B,CAAA;IAElE,MAAM,cAAc,GAClB,CAAC,SAAS,IAAI,QAAQ;QACpB,CAAC,CAAC,YAAY;QACd,CAAC,CAAC,YAAY,CAAC,MAAM,CACjB,CAAC,YAAY,EAAE,KAAK,EAAE,EAAE,CAAC,KAAK,GAAG,0BAA0B,CAC5D,CAAA;IAEP,MAAM,iBAAiB,GAAG,GAAS,EAAE;QACnC,IAAI,CAAC,SAAS,EAAE,CAAC;YACf,OAAM;QACR,CAAC;QAED,YAAY,EAAE,CAAA;IAChB,CAAC,CAAA;IAED,OAAO,CACL,eACE,SAAS,EAAE,UAAU,CAAC,2BAA2B,EAAE;YACjD,YAAY,EAAE,SAAS;YACvB,QAAQ;SACT,CAAC,aAEF,eAAK,SAAS,EAAC,aAAa,EAAC,OAAO,EAAE,iBAAiB,aACrD,cACE,GAAG,EAAE,YAAY,EAAE,IAAI,EAAE,GAAG,EAC5B,GAAG,EAAE,YAAY,EAAE,YAAY,EAC/B,SAAS,EAAC,yBAAyB,GACnC,EACF,cAAI,SAAS,EAAC,wBAAwB,aACnC,YAAY,EAAE,YAAY,OAAG,CAAC,CAAC,OAAO,IACpC,EACJ,SAAS,IAAI,KAAC,gBAAgB,IAAC,SAAS,EAAC,SAAS,GAAG,IAClD,EACN,cAAK,SAAS,EAAC,qCAAqC,YACjD,cAAc,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC,CACnC,KAAC,kBAAkB,IAEjB,WAAW,EAAE,WAAW,IADnB,WAAW,CAAC,eAAe,CAEhC,CACH,CAAC,GACE,EACN,KAAC,oBAAoB,IACnB,OAAO,EAAE,SAAS,EAClB,OAAO,EAAE,YAAY,EACrB,QAAQ,EAAE,QAAQ,EAClB,gBAAgB,EAAE,YAAY,CAAC,MAAM,GACrC,EACF,KAAC,oBAAoB,IAAC,OAAO,EAAE,SAAS,IAAI,CAAC,QAAQ,GAAI,IACrD,CACP,CAAA;AACH,CAAC;AAED,MAAM,CAAC,GAAG;IACR,OAAO,EAAE,SAAS;CACnB,CAAA"}
+{"version":3,"file":"SupportedDeviceManufacturerSection.js","sourceRoot":"","sources":["../../../../src/lib/seam/components/SupportedDeviceTable/SupportedDeviceManufacturerSection.tsx"],"names":[],"mappings":"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"}

package/lib/seam/components/SupportedDeviceTable/use-filtered-device-models.d.ts

@@ -1,8 +1,10 @@
+import type { ManufacturerIntegrationSupportLevel } from '@seamapi/types/devicedb';
 import { useDeviceModels } from '../../../../lib/seam/components/SupportedDeviceTable/use-device-models.js';
 export interface DeviceModelFilters {
     supportedOnly: boolean;
     manufacturer: string | null;
 }
+export declare const supportedIntegrationSupportLevels: ManufacturerIntegrationSupportLevel[];
 export declare const useFilteredDeviceModels: ({ filterValue, filters, includeIf, excludeIf, ...manufacturersParams }: {
     filterValue: string;
     filters: DeviceModelFilters;

package/lib/seam/components/SupportedDeviceTable/use-filtered-device-models.js

@@ -1,7 +1,13 @@
 import { useDeviceModels, } from '../../../../lib/seam/components/SupportedDeviceTable/use-device-models.js';
 import { useFilteredManufacturers } from './use-filtered-manufacturers.js';
+export const supportedIntegrationSupportLevels = ['stable', 'beta'];
 export const useFilteredDeviceModels = ({ filterValue, filters, includeIf, excludeIf, ...manufacturersParams }) => {
-    const { manufacturers } = useFilteredManufacturers(manufacturersParams);
+    const { manufacturers } = useFilteredManufacturers({
+        ...manufacturersParams,
+        integrationSupportLevels: filters.supportedOnly
+            ? supportedIntegrationSupportLevels
+            : null,
+    });
     const params = {};
     if (excludeIf.length > 0) {
         params.exclude_if = excludeIf;
@@ -14,7 +20,7 @@ export const useFilteredDeviceModels = ({ filterValue, filters, includeIf, exclu
         params.text_search = filterValue.trim();
     }
     if (filters.supportedOnly) {
-        params.integration_status = 'stable';
+        params.integration_support_levels = supportedIntegrationSupportLevels;
     }
     if (filters.manufacturer !== null) {
         const manufacturer = manufacturers?.find((manufacturer) => manufacturer.display_name === filters.manufacturer);

package/lib/seam/components/SupportedDeviceTable/use-filtered-device-models.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-filtered-device-models.js","sourceRoot":"","sources":["../../../../src/lib/seam/components/SupportedDeviceTable/use-filtered-device-models.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,GAEhB,MAAM,+DAA+D,CAAA;AAEtE,OAAO,EAAE,wBAAwB,EAAE,MAAM,iCAAiC,CAAA;AAO1E,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,EACtC,WAAW,EACX,OAAO,EACP,SAAS,EACT,SAAS,EACT,GAAG,mBAAmB,EAQvB,EAAsC,EAAE;IACvC,MAAM,EAAE,aAAa,EAAE,GAAG,wBAAwB,CAAC,mBAAmB,CAAC,CAAA;IAEvE,MAAM,MAAM,GAA0B,EAAE,CAAA;IAExC,IAAI,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QACzB,MAAM,CAAC,UAAU,GAAG,SAAS,CAAA;IAC/B,CAAC;IAED,6DAA6D;IAC7D,IAAI,SAAS,IAAI,IAAI,IAAI,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QAC9C,MAAM,CAAC,UAAU,GAAG,SAAS,CAAA;IAC/B,CAAC;IAED,IAAI,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC;QAC9B,MAAM,CAAC,WAAW,GAAG,WAAW,CAAC,IAAI,EAAE,CAAA;IACzC,CAAC;IAED,IAAI,OAAO,CAAC,aAAa,EAAE,CAAC;QAC1B,MAAM,CAAC,kBAAkB,GAAG,QAAQ,CAAA;IACtC,CAAC;IAED,IAAI,OAAO,CAAC,YAAY,KAAK,IAAI,EAAE,CAAC;QAClC,MAAM,YAAY,GAAG,aAAa,EAAE,IAAI,CACtC,CAAC,YAAY,EAAE,EAAE,CAAC,YAAY,CAAC,YAAY,KAAK,OAAO,CAAC,YAAY,CACrE,CAAA;QAED,IAAI,YAAY,IAAI,IAAI,EAAE,CAAC;YACzB,MAAM,CAAC,eAAe,GAAG,YAAY,CAAC,eAAe,CAAA;QACvD,CAAC;IACH,CAAC;IAED,IAAI,OAAO,CAAC,YAAY,IAAI,IAAI,IAAI,aAAa,IAAI,IAAI,EAAE,CAAC;QAC1D,MAAM,CAAC,gBAAgB,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,CAAC,CAAA;IACvE,CAAC;IAED,MAAM,EAAE,YAAY,EAAE,GAAG,IAAI,EAAE,GAAG,eAAe,CAAC,MAAM,CAAC,CAAA;IAEzD,OAAO;QACL,GAAG,IAAI;QACP,YAAY;QACV,6DAA6D;QAC7D,SAAS,EAAE,MAAM,KAAK,CAAC;YACrB,CAAC,CAAC,EAAE;YACJ,CAAC,CAAC,YAAY,EAAE,MAAM,CAClB,CAAC,WAAW,EAAE,EAAE,CACd,aAAa,EAAE,IAAI,CACjB,CAAC,YAAY,EAAE,EAAE,CACf,WAAW,CAAC,YAAY,CAAC,eAAe;gBACxC,YAAY,CAAC,eAAe,CAC/B,CACJ;KACR,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"use-filtered-device-models.js","sourceRoot":"","sources":["../../../../src/lib/seam/components/SupportedDeviceTable/use-filtered-device-models.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,eAAe,GAEhB,MAAM,+DAA+D,CAAA;AAEtE,OAAO,EAAE,wBAAwB,EAAE,MAAM,iCAAiC,CAAA;AAO1E,MAAM,CAAC,MAAM,iCAAiC,GAC5C,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAA;AAEpB,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,EACtC,WAAW,EACX,OAAO,EACP,SAAS,EACT,SAAS,EACT,GAAG,mBAAmB,EAQvB,EAAsC,EAAE;IACvC,MAAM,EAAE,aAAa,EAAE,GAAG,wBAAwB,CAAC;QACjD,GAAG,mBAAmB;QACtB,wBAAwB,EAAE,OAAO,CAAC,aAAa;YAC7C,CAAC,CAAC,iCAAiC;YACnC,CAAC,CAAC,IAAI;KACT,CAAC,CAAA;IAEF,MAAM,MAAM,GAA0B,EAAE,CAAA;IAExC,IAAI,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QACzB,MAAM,CAAC,UAAU,GAAG,SAAS,CAAA;IAC/B,CAAC;IAED,6DAA6D;IAC7D,IAAI,SAAS,IAAI,IAAI,IAAI,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QAC9C,MAAM,CAAC,UAAU,GAAG,SAAS,CAAA;IAC/B,CAAC;IAED,IAAI,WAAW,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC;QAC9B,MAAM,CAAC,WAAW,GAAG,WAAW,CAAC,IAAI,EAAE,CAAA;IACzC,CAAC;IAED,IAAI,OAAO,CAAC,aAAa,EAAE,CAAC;QAC1B,MAAM,CAAC,0BAA0B,GAAG,iCAAiC,CAAA;IACvE,CAAC;IAED,IAAI,OAAO,CAAC,YAAY,KAAK,IAAI,EAAE,CAAC;QAClC,MAAM,YAAY,GAAG,aAAa,EAAE,IAAI,CACtC,CAAC,YAAY,EAAE,EAAE,CAAC,YAAY,CAAC,YAAY,KAAK,OAAO,CAAC,YAAY,CACrE,CAAA;QAED,IAAI,YAAY,IAAI,IAAI,EAAE,CAAC;YACzB,MAAM,CAAC,eAAe,GAAG,YAAY,CAAC,eAAe,CAAA;QACvD,CAAC;IACH,CAAC;IAED,IAAI,OAAO,CAAC,YAAY,IAAI,IAAI,IAAI,aAAa,IAAI,IAAI,EAAE,CAAC;QAC1D,MAAM,CAAC,gBAAgB,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,CAAC,CAAA;IACvE,CAAC;IAED,MAAM,EAAE,YAAY,EAAE,GAAG,IAAI,EAAE,GAAG,eAAe,CAAC,MAAM,CAAC,CAAA;IAEzD,OAAO;QACL,GAAG,IAAI;QACP,YAAY;QACV,6DAA6D;QAC7D,SAAS,EAAE,MAAM,KAAK,CAAC;YACrB,CAAC,CAAC,EAAE;YACJ,CAAC,CAAC,YAAY,EAAE,MAAM,CAClB,CAAC,WAAW,EAAE,EAAE,CACd,aAAa,EAAE,IAAI,CACjB,CAAC,YAAY,EAAE,EAAE,CACf,WAAW,CAAC,YAAY,CAAC,eAAe;gBACxC,YAAY,CAAC,eAAe,CAC/B,CACJ;KACR,CAAA;AACH,CAAC,CAAA"}

package/lib/seam/components/SupportedDeviceTable/use-filtered-manufacturers.d.ts

@@ -1,8 +1,10 @@
+import type { ManufacturerIntegrationSupportLevel } from '@seamapi/types/devicedb';
 import { useManufacturers } from '../../../../lib/seam/components/SupportedDeviceTable/use-manufacturers.js';
 interface Params {
     manufacturers: string[] | null;
     excludedManufacturers: string[];
+    integrationSupportLevels: ManufacturerIntegrationSupportLevel[] | null;
 }
-export declare const useFilteredManufacturers: (params: Params) => ReturnType<typeof useManufacturers>;
-export declare const createLiqeQuery: ({ manufacturers, excludedManufacturers, }: Params) => string | undefined;
+export declare const useFilteredManufacturers: ({ integrationSupportLevels, ...params }: Params) => ReturnType<typeof useManufacturers>;
+export declare const createLiqeQuery: ({ manufacturers, excludedManufacturers, }: Pick<Params, 'manufacturers' | 'excludedManufacturers'>) => string | undefined;
 export {};

package/lib/seam/components/SupportedDeviceTable/use-filtered-manufacturers.js

@@ -1,6 +1,7 @@
 import { useManufacturers } from '../../../../lib/seam/components/SupportedDeviceTable/use-manufacturers.js';
-export const useFilteredManufacturers = (params) => {
+export const useFilteredManufacturers = ({ integrationSupportLevels, ...params }) => {
     const { manufacturers, ...rest } = useManufacturers({
+        integration_support_levels: integrationSupportLevels ?? undefined,
         liqe_query: createLiqeQuery(params),
     });
     return {

package/lib/seam/components/SupportedDeviceTable/use-filtered-manufacturers.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-filtered-manufacturers.js","sourceRoot":"","sources":["../../../../src/lib/seam/components/SupportedDeviceTable/use-filtered-manufacturers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,+DAA+D,CAAA;AAMhG,MAAM,CAAC,MAAM,wBAAwB,GAAG,CACtC,MAAc,EACuB,EAAE;IACvC,MAAM,EAAE,aAAa,EAAE,GAAG,IAAI,EAAE,GAAG,gBAAgB,CAAC;QAClD,UAAU,EAAE,eAAe,CAAC,MAAM,CAAC;KACpC,CAAC,CAAA;IAEF,OAAO;QACL,GAAG,IAAI;QACP,aAAa,EAAE,aAAa,EAAE,MAAM,CAClC,CAAC,YAAY,EAAE,EAAE,CAAC,YAAY,CAAC,kBAAkB,GAAG,CAAC,CACtD;KACF,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAC9B,aAAa,EACb,qBAAqB,GACd,EAAsB,EAAE;IAC/B,IACE,CAAC,aAAa,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,KAAK,CAAC;QAC9C,qBAAqB,CAAC,IAAI,CAAC,cAAc,CAAC,EAC1C,CAAC;QACD,OAAO,SAAS,CAAA;IAClB,CAAC;IAED,MAAM,2BAA2B,GAAG,QAAQ,qBAAqB;SAC9D,GAAG,CAAC,qBAAqB,CAAC;SAC1B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAA;IAElB,IAAI,aAAa,IAAI,IAAI,EAAE,CAAC;QAC1B,IAAI,qBAAqB,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO,SAAS,CAAA;QACxD,OAAO,2BAA2B,CAAA;IACpC,CAAC;IAED,IAAI,aAAa,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC/B,OAAO,sBAAsB,CAAA;IAC/B,CAAC;IAED,MAAM,2BAA2B,GAAG,IAAI,aAAa;SAClD,GAAG,CAAC,qBAAqB,CAAC;SAC1B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAA;IAElB,IAAI,qBAAqB,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,2BAA2B,CAAA;IAE1E,OAAO,GAAG,2BAA2B,QAAQ,2BAA2B,EAAE,CAAA;AAC5E,CAAC,CAAA;AAED,MAAM,qBAAqB,GAAG,CAAC,KAAa,EAAU,EAAE;IACtD,MAAM,CAAC,YAAY,EAAE,IAAI,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;IAC7C,IAAI,IAAI,IAAI,IAAI;QAAE,OAAO,oBAAoB,IAAI,GAAG,CAAA;IACpD,OAAO,iBAAiB,YAAY,GAAG,CAAA;AACzC,CAAC,CAAA;AAED,MAAM,cAAc,GAAG,CAAC,KAAa,EAAW,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAA"}
+{"version":3,"file":"use-filtered-manufacturers.js","sourceRoot":"","sources":["../../../../src/lib/seam/components/SupportedDeviceTable/use-filtered-manufacturers.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,+DAA+D,CAAA;AAQhG,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,EACvC,wBAAwB,EACxB,GAAG,MAAM,EACF,EAAuC,EAAE;IAChD,MAAM,EAAE,aAAa,EAAE,GAAG,IAAI,EAAE,GAAG,gBAAgB,CAAC;QAClD,0BAA0B,EAAE,wBAAwB,IAAI,SAAS;QACjE,UAAU,EAAE,eAAe,CAAC,MAAM,CAAC;KACpC,CAAC,CAAA;IAEF,OAAO;QACL,GAAG,IAAI;QACP,aAAa,EAAE,aAAa,EAAE,MAAM,CAClC,CAAC,YAAY,EAAE,EAAE,CAAC,YAAY,CAAC,kBAAkB,GAAG,CAAC,CACtD;KACF,CAAA;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,EAC9B,aAAa,EACb,qBAAqB,GACmC,EAE5C,EAAE;IACd,IACE,CAAC,aAAa,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,KAAK,CAAC;QAC9C,qBAAqB,CAAC,IAAI,CAAC,cAAc,CAAC,EAC1C,CAAC;QACD,OAAO,SAAS,CAAA;IAClB,CAAC;IAED,MAAM,2BAA2B,GAAG,QAAQ,qBAAqB;SAC9D,GAAG,CAAC,qBAAqB,CAAC;SAC1B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAA;IAElB,IAAI,aAAa,IAAI,IAAI,EAAE,CAAC;QAC1B,IAAI,qBAAqB,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO,SAAS,CAAA;QACxD,OAAO,2BAA2B,CAAA;IACpC,CAAC;IAED,IAAI,aAAa,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC/B,OAAO,sBAAsB,CAAA;IAC/B,CAAC;IAED,MAAM,2BAA2B,GAAG,IAAI,aAAa;SAClD,GAAG,CAAC,qBAAqB,CAAC;SAC1B,IAAI,CAAC,MAAM,CAAC,GAAG,CAAA;IAElB,IAAI,qBAAqB,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,2BAA2B,CAAA;IAE1E,OAAO,GAAG,2BAA2B,QAAQ,2BAA2B,EAAE,CAAA;AAC5E,CAAC,CAAA;AAED,MAAM,qBAAqB,GAAG,CAAC,KAAa,EAAU,EAAE;IACtD,MAAM,CAAC,YAAY,EAAE,IAAI,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAA;IAC7C,IAAI,IAAI,IAAI,IAAI;QAAE,OAAO,oBAAoB,IAAI,GAAG,CAAA;IACpD,OAAO,iBAAiB,YAAY,GAAG,CAAA;AACzC,CAAC,CAAA;AAED,MAAM,cAAc,GAAG,CAAC,KAAa,EAAW,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAA"}

package/lib/version.d.ts

@@ -1,2 +1,2 @@
-declare const seamapiReactVersion = "2.6.0";
+declare const seamapiReactVersion = "2.8.0";
 export default seamapiReactVersion;

package/lib/version.js

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@seamapi/react",
-  "version": "2.6.0",
+  "version": "2.8.0",
   "description": "Seam Components.",
   "type": "module",
   "main": "index.js",
@@ -140,10 +140,10 @@
     "@mui/icons-material": "^5.11.16",
     "@mui/material": "^5.12.2",
     "@rxfork/r2wc-react-to-web-component": "^2.4.0",
-    "@seamapi/fake-devicedb": "^1.3.0",
-    "@seamapi/fake-seam-connect": "^1.42.0",
+    "@seamapi/fake-devicedb": "^1.4.0",
+    "@seamapi/fake-seam-connect": "^1.44.3",
     "@seamapi/http": "^0.2.1",
-    "@seamapi/types": "^1.64.0",
+    "@seamapi/types": "^1.68.0",
     "@storybook/addon-designs": "^7.0.1",
     "@storybook/addon-essentials": "^7.0.2",
     "@storybook/addon-links": "^7.0.2",

package/src/lib/icons/InfoBlue.tsx

@@ -0,0 +1,36 @@
+/*
+ * Automatically 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 function InfoBlueIcon(props: SVGProps<SVGSVGElement>): JSX.Element {
+  return (
+    <svg
+      xmlns='http://www.w3.org/2000/svg'
+      width={16}
+      height={16}
+      fill='none'
+      {...props}
+    >
+      <mask
+        id='info-blue_svg__a'
+        width={16}
+        height={16}
+        x={0}
+        y={0}
+        maskUnits='userSpaceOnUse'
+        style={{
+          maskType: 'alpha',
+        }}
+      >
+        <path fill='#D9D9D9' d='M0 0h16v16H0z' />
+      </mask>
+      <g mask='url(#info-blue_svg__a)'>
+        <path
+          fill='#007AFC'
+          d='M7.333 11.333h1.334v-4H7.333zM8 6a.645.645 0 0 0 .475-.192.645.645 0 0 0 .192-.475.645.645 0 0 0-.192-.475A.645.645 0 0 0 8 4.667a.645.645 0 0 0-.475.191.645.645 0 0 0-.192.475c0 .19.064.348.192.475A.645.645 0 0 0 8 6m0 8.667a6.492 6.492 0 0 1-2.6-.525 6.732 6.732 0 0 1-2.117-1.425A6.733 6.733 0 0 1 1.858 10.6 6.492 6.492 0 0 1 1.333 8c0-.922.175-1.789.525-2.6a6.732 6.732 0 0 1 1.425-2.117c.6-.6 1.306-1.075 2.117-1.425A6.492 6.492 0 0 1 8 1.333c.922 0 1.789.175 2.6.525.811.35 1.517.825 2.117 1.425.6.6 1.075 1.306 1.425 2.117.35.811.525 1.678.525 2.6 0 .922-.175 1.789-.525 2.6a6.733 6.733 0 0 1-1.425 2.117c-.6.6-1.306 1.075-2.117 1.425a6.492 6.492 0 0 1-2.6.525'
+        />
+      </g>
+    </svg>
+  )
+}

package/src/lib/seam/components/SupportedDeviceTable/SupportedDeviceFilterArea.tsx

@@ -1,7 +1,10 @@
 import type { Dispatch, SetStateAction } from 'react'
 
 import { FilterCategoryMenu } from 'lib/seam/components/SupportedDeviceTable/FilterCategoryMenu.js'
-import type { DeviceModelFilters } from 'lib/seam/components/SupportedDeviceTable/use-filtered-device-models.js'
+import {
+  type DeviceModelFilters,
+  supportedIntegrationSupportLevels,
+} from 'lib/seam/components/SupportedDeviceTable/use-filtered-device-models.js'
 import { Button } from 'lib/ui/Button.js'
 import { Menu } from 'lib/ui/Menu/Menu.js'
 import { SearchTextField } from 'lib/ui/TextField/SearchTextField.js'
@@ -28,6 +31,9 @@ export function SupportedDeviceFilterArea({
   const appliedFiltersCount = getAppliedFilterCount(filters)
 
   const { manufacturers: manufacturersData } = useFilteredManufacturers({
+    integrationSupportLevels: filters.supportedOnly
+      ? supportedIntegrationSupportLevels
+      : null,
     manufacturers,
     excludedManufacturers,
   })
@@ -44,16 +50,6 @@ export function SupportedDeviceFilterArea({
 
   const allLabel = t.all
 
-  const options =
-    manufacturersData
-      ?.filter((manufacturer) => {
-        if (filters.supportedOnly) {
-          return ['stable', 'beta'].includes(manufacturer.integration)
-        }
-        return true
-      })
-      ?.map((manufacturer) => manufacturer.display_name) ?? []
-
   return (
     <div className='seam-supported-device-table-filter-area'>
       <div className='seam-deliberate-block' />
@@ -79,7 +75,11 @@ export function SupportedDeviceFilterArea({
               <FilterCategoryMenu
                 label={t.manufacturer}
                 allLabel={allLabel}
-                options={options}
+                options={
+                  manufacturersData?.map(
+                    (manufacturer) => manufacturer.display_name
+                  ) ?? []
+                }
                 onSelect={(manufacturer: string) => {
                   setFilters((filters) => ({
                     ...filters,

package/src/lib/seam/components/SupportedDeviceTable/SupportedDeviceManufacturerSection.tsx

@@ -1,7 +1,11 @@
-import type { DeviceModelV1 } from '@seamapi/types/devicedb'
+import type {
+  DeviceModelV1,
+  ManufacturerAnnotation,
+} from '@seamapi/types/devicedb'
 import classNames from 'classnames'
 
 import { ChevronRightIcon } from 'lib/icons/ChevronRight.js'
+import { InfoBlueIcon } from 'lib/icons/InfoBlue.js'
 import { HiddenDevicesOverlay } from 'lib/seam/components/SupportedDeviceTable/HiddenDevicesOverlay.js'
 import { ShowAllDevicesButton } from 'lib/seam/components/SupportedDeviceTable/ShowAllDevicesButton.js'
 import { SupportedDeviceRow } from 'lib/seam/components/SupportedDeviceTable/SupportedDeviceRow.js'
@@ -62,6 +66,12 @@ export function SupportedDeviceManufacturerSection({
         </h5>
         {canExpand && <ChevronRightIcon className='chevron' />}
       </div>
+      {manufacturer?.annotations.map((annotation, idx) => (
+        <ManufacturerAnnotationBox
+          key={[annotation.annotation_code, idx].join('_')}
+          annotation={annotation}
+        />
+      ))}
       <div className='seam-supported-device-table-content'>
         {visibleDevices.map((deviceModel) => (
           <SupportedDeviceRow
@@ -81,6 +91,19 @@ export function SupportedDeviceManufacturerSection({
   )
 }
 
+function ManufacturerAnnotationBox({
+  annotation,
+}: {
+  annotation: ManufacturerAnnotation
+}): JSX.Element {
+  return (
+    <div className='seam-manufacturer-annotation-box'>
+      <InfoBlueIcon />
+      <p className='seam-annotation'>{annotation.message}</p>
+    </div>
+  )
+}
+
 const t = {
   devices: 'Devices',
 }

package/src/lib/seam/components/SupportedDeviceTable/use-filtered-device-models.ts

@@ -1,3 +1,5 @@
+import type { ManufacturerIntegrationSupportLevel } from '@seamapi/types/devicedb'
+
 import {
   useDeviceModels,
   type UseDeviceModelsParams,
@@ -10,6 +12,9 @@ export interface DeviceModelFilters {
   manufacturer: string | null
 }
 
+export const supportedIntegrationSupportLevels: ManufacturerIntegrationSupportLevel[] =
+  ['stable', 'beta']
+
 export const useFilteredDeviceModels = ({
   filterValue,
   filters,
@@ -24,7 +29,12 @@ export const useFilteredDeviceModels = ({
   includeIf: string[] | null
   excludeIf: string[]
 }): ReturnType<typeof useDeviceModels> => {
-  const { manufacturers } = useFilteredManufacturers(manufacturersParams)
+  const { manufacturers } = useFilteredManufacturers({
+    ...manufacturersParams,
+    integrationSupportLevels: filters.supportedOnly
+      ? supportedIntegrationSupportLevels
+      : null,
+  })
 
   const params: UseDeviceModelsParams = {}
 
@@ -42,7 +52,7 @@ export const useFilteredDeviceModels = ({
   }
 
   if (filters.supportedOnly) {
-    params.integration_status = 'stable'
+    params.integration_support_levels = supportedIntegrationSupportLevels
   }
 
   if (filters.manufacturer !== null) {

package/src/lib/seam/components/SupportedDeviceTable/use-filtered-manufacturers.ts

@@ -1,13 +1,19 @@
+import type { ManufacturerIntegrationSupportLevel } from '@seamapi/types/devicedb'
+
 import { useManufacturers } from 'lib/seam/components/SupportedDeviceTable/use-manufacturers.js'
 
 interface Params {
   manufacturers: string[] | null
   excludedManufacturers: string[]
+  integrationSupportLevels: ManufacturerIntegrationSupportLevel[] | null
 }
-export const useFilteredManufacturers = (
-  params: Params
-): ReturnType<typeof useManufacturers> => {
+
+export const useFilteredManufacturers = ({
+  integrationSupportLevels,
+  ...params
+}: Params): ReturnType<typeof useManufacturers> => {
   const { manufacturers, ...rest } = useManufacturers({
+    integration_support_levels: integrationSupportLevels ?? undefined,
     liqe_query: createLiqeQuery(params),
   })
 
@@ -22,7 +28,9 @@ export const useFilteredManufacturers = (
 export const createLiqeQuery = ({
   manufacturers,
   excludedManufacturers,
-}: Params): string | undefined => {
+}: Pick<Params, 'manufacturers' | 'excludedManufacturers'>):
+  | string
+  | undefined => {
   if (
     (manufacturers?.some(isInvalidInput) ?? false) ||
     excludedManufacturers.some(isInvalidInput)

package/src/lib/version.ts

@@ -1,3 +1,3 @@
-const seamapiReactVersion = '2.6.0'
+const seamapiReactVersion = '2.8.0'
 
 export default seamapiReactVersion

package/src/styles/_colors.scss

@@ -8,6 +8,7 @@ $primary-8: color.scale($primary, $lightness: 92%);
 $primary-5: color.scale($primary, $lightness: 95%);
 $primary-dark: color.scale($primary, $lightness: -10%);
 $primary-dim: color.scale($primary-15, $lightness: -5%);
+$primary-transparent: color.adjust($primary, $alpha: 0.08 - 1);
 $text-default: #232b3a;
 $text-gray-1: #6e7179;
 $text-gray-2: #9da1a9;

package/src/styles/_supported-device-table.scss

@@ -99,6 +99,37 @@ $row-padding: 8px;
   .seam-manufacturer-section {
     margin-bottom: 32px;
     position: relative;
+    display: flex;
+    padding: 8px 16px 16px;
+    flex-direction: column;
+    justify-content: center;
+    align-items: flex-start;
+    gap: 10px;
+    align-self: stretch;
+
+    .seam-manufacturer-annotation-box {
+      display: flex;
+      padding: 8px;
+      align-items: center;
+      align-content: center;
+      gap: 0 8px;
+      align-self: stretch;
+      flex-wrap: wrap;
+      border-radius: 6px;
+      background-color: colors.$primary-transparent;
+
+      .seam-annotation {
+        display: flex;
+        align-items: flex-start;
+        align-content: flex-start;
+        gap: 2px;
+        flex: 1 0 0;
+        flex-wrap: wrap;
+        color: colors.$text-gray-1;
+        font-size: 14px;
+        line-height: 120%;
+      }
+    }
 
     .seam-header {
       display: flex;