@pisell/private-materials 3.4.105 → 3.4.106

package/lib/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/DeviceInfoPanel.less

@@ -0,0 +1,211 @@
+.device-detail-drawer {
+  &__card {
+    border-radius: 10px;
+
+    & + & {
+      margin-top: 12px;
+    }
+
+    .ant-card-head {
+      min-height: 42px;
+      padding: 0 16px;
+    }
+
+    .ant-card-head-title {
+      padding: 10px 0;
+      font-size: 14px;
+      font-weight: 600;
+    }
+
+    .ant-card-body {
+      padding: 16px;
+    }
+  }
+
+  &__info-list {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+
+  &__info-row {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 16px;
+    font-size: 14px;
+
+    > span:first-child {
+      color: rgba(0, 0, 0, 0.55);
+    }
+
+    strong {
+      font-weight: 600;
+      color: rgba(0, 0, 0, 0.88);
+    }
+  }
+
+  &__info-two-row {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 8px;
+    font-size: 14px;
+
+    > span:first-child {
+      color: rgba(0, 0, 0, 0.55);
+    }
+
+    strong {
+      font-weight: 600;
+      color: rgba(0, 0, 0, 0.88);
+    }
+  }
+
+  &__profile-card {
+    width: 100%;
+    display: inline-flex;
+    align-items: center;
+    gap: 8px;
+    min-width: 180px;
+    padding: 8px 10px;
+    border-radius: 6px;
+    background: #f5f6f8;
+    color: rgba(0, 0, 0, 0.72);
+  }
+
+  &__report-list {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+
+  &__last-seen {
+    font-size: 12px;
+    font-weight: 400;
+    color: rgba(0, 0, 0, 0.45);
+  }
+
+  &__report-card {
+    border-radius: 8px;
+    background: #fafafa;
+
+    .ant-card-head {
+      min-height: 38px;
+      padding: 0 12px;
+    }
+
+    .ant-card-head-title {
+      padding: 8px 0;
+      font-size: 13px;
+      font-weight: 600;
+    }
+
+    .ant-card-body {
+      padding: 12px;
+    }
+  }
+
+  &__report-rows {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+
+  &__report-row {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 16px;
+    font-size: 14px;
+  }
+
+  &__report-label {
+    flex-shrink: 0;
+    color: rgba(0, 0, 0, 0.55);
+  }
+
+  &__report-value,
+  &__json-value {
+    min-width: 0;
+    color: rgba(0, 0, 0, 0.88);
+    text-align: right;
+    word-break: break-word;
+  }
+
+  &__battery-value {
+    display: inline-flex;
+    align-items: center;
+    justify-content: flex-end;
+    gap: 8px;
+  }
+
+  &__battery-icon {
+    position: relative;
+    box-sizing: border-box;
+    width: 24px;
+    height: 12px;
+    border: 1.5px solid rgba(0, 0, 0, 0.65);
+    border-radius: 3px;
+
+    &::before {
+      position: absolute;
+      top: 2px;
+      right: -4px;
+      width: 2px;
+      height: 6px;
+      border-radius: 0 2px 2px 0;
+      background: rgba(0, 0, 0, 0.65);
+      content: '';
+    }
+
+    &.is-charging {
+      border-color: #16a34a;
+
+      &::before {
+        background: #16a34a;
+      }
+    }
+  }
+
+  &__battery-fill {
+    position: absolute;
+    top: 2px;
+    left: 2px;
+    max-width: 17px;
+    height: 5px;
+    border-radius: 1px;
+    background: #16a34a;
+  }
+
+  &__battery-bolt {
+    position: absolute;
+    top: -3px;
+    left: 8px;
+    width: 7px;
+    height: 14px;
+    background: #f59e0b;
+    clip-path: polygon(45% 0, 100% 0, 62% 42%, 100% 42%, 35% 100%, 48% 56%, 0 56%);
+  }
+
+  &__battery-status {
+    color: #16a34a;
+  }
+
+  &__online-status {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+  }
+
+  &__status-dot {
+    width: 6px;
+    height: 6px;
+    border-radius: 50%;
+    background: rgba(0, 0, 0, 0.25);
+
+    &.is-online {
+      background: #16a34a;
+    }
+  }
+}

package/lib/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/DrawerSidebar.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { DeviceKind } from '../../../types';
+export declare type DrawerTabKey = 'info' | 'connections';
+interface DrawerSidebarProps {
+    activeKey: DrawerTabKey;
+    activeKind: DeviceKind;
+    getText: (key: string) => string;
+    onChange: (key: DrawerTabKey) => void;
+}
+declare const DrawerSidebar: React.FC<DrawerSidebarProps>;
+export default DrawerSidebar;

package/lib/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/DrawerSidebar.js

@@ -0,0 +1,73 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/DrawerSidebar.tsx
+var DrawerSidebar_exports = {};
+__export(DrawerSidebar_exports, {
+  default: () => DrawerSidebar_default
+});
+module.exports = __toCommonJS(DrawerSidebar_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_materials = require("@pisell/materials");
+var import_classnames = __toESM(require("classnames"));
+var DrawerSidebar = ({
+  activeKey,
+  activeKind,
+  getText,
+  onChange
+}) => {
+  const items = [
+    {
+      key: "info",
+      icon: "InfoCircleOutlined",
+      label: getText("pisell2.saas.device-planning.drawer.info")
+    }
+  ];
+  if (activeKind !== "integrated") {
+    items.push({
+      key: "connections",
+      icon: "ApiOutlined",
+      label: getText("pisell2.saas.device-planning.drawer.connections")
+    });
+  }
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__sidebar" }, items.map((item) => /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Button,
+    {
+      key: item.key,
+      type: "text",
+      className: (0, import_classnames.default)("device-detail-drawer__sidebar-item", {
+        "is-active": activeKey === item.key
+      }),
+      onClick: () => onChange(item.key)
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: item.icon }),
+    /* @__PURE__ */ import_react.default.createElement("span", null, item.label)
+  )));
+};
+var DrawerSidebar_default = DrawerSidebar;

package/lib/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/connectDeviceModal/ConnectDeviceModalHeader.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { DeviceItem, I18nText } from '../../../../types';
+import type { ConnectMode, ConnectStep } from '../../hooks/useConnectDeviceModal';
+interface ConnectDeviceModalHeaderProps {
+    mode: ConnectMode;
+    step: ConnectStep;
+    currentDevice: DeviceItem;
+    currentIsSmart: boolean;
+    getText: (key: string) => string;
+    translation: (val?: I18nText) => string;
+    onBack: () => void;
+}
+declare const ConnectDeviceModalHeader: React.FC<ConnectDeviceModalHeaderProps>;
+export default ConnectDeviceModalHeader;

package/lib/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/connectDeviceModal/ConnectDeviceModalHeader.js

@@ -0,0 +1,61 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/connectDeviceModal/ConnectDeviceModalHeader.tsx
+var ConnectDeviceModalHeader_exports = {};
+__export(ConnectDeviceModalHeader_exports, {
+  default: () => ConnectDeviceModalHeader_default
+});
+module.exports = __toCommonJS(ConnectDeviceModalHeader_exports);
+var import_react = __toESM(require("react"));
+var import_materials = require("@pisell/materials");
+var import_icons = require("@ant-design/icons");
+var ConnectDeviceModalHeader = ({
+  mode,
+  step,
+  currentDevice,
+  currentIsSmart,
+  getText,
+  translation,
+  onBack
+}) => {
+  const deviceName = translation(currentDevice.name) || String(currentDevice.id);
+  const title = mode === "edit" ? getText("pisell2.saas.device-planning.connect.edit-title").replace(
+    "{DeviceName}",
+    deviceName
+  ) : mode === "new" ? getText("pisell2.saas.device-planning.connect.add-new-title").replace(
+    "{DeviceName}",
+    deviceName
+  ) : currentIsSmart ? getText(
+    "pisell2.saas.device-planning.connect.existing-peripheral-title"
+  ).replace("{DeviceName}", deviceName) : getText(
+    "pisell2.saas.device-planning.connect.existing-smart-title"
+  ).replace("{DeviceName}", deviceName);
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__connect-modal-title" }, step === "config" && mode !== "edit" ? /* @__PURE__ */ import_react.default.createElement(import_materials.Button, { type: "text", icon: /* @__PURE__ */ import_react.default.createElement(import_icons.ArrowLeftOutlined, null), onClick: onBack }) : null, /* @__PURE__ */ import_react.default.createElement("span", null, title));
+};
+var ConnectDeviceModalHeader_default = ConnectDeviceModalHeader;

package/lib/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/connectDeviceModal/ConnectionConfigFields.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { NetworkMethod } from '../../hooks/useConnectDeviceModal';
+interface ConnectionConfigFieldsProps {
+    connectionType?: string;
+    networkMethod: NetworkMethod;
+    profileRequired: boolean;
+    profileOptions: Array<{
+        label: string;
+        value: number;
+    }>;
+    getText: (key: string) => string;
+}
+declare const ConnectionConfigFields: React.FC<ConnectionConfigFieldsProps>;
+export default ConnectionConfigFields;

package/lib/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/connectDeviceModal/ConnectionConfigFields.js

@@ -0,0 +1,171 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/connectDeviceModal/ConnectionConfigFields.tsx
+var ConnectionConfigFields_exports = {};
+__export(ConnectionConfigFields_exports, {
+  default: () => ConnectionConfigFields_default
+});
+module.exports = __toCommonJS(ConnectionConfigFields_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_materials = require("@pisell/materials");
+var import_icons = require("@ant-design/icons");
+var import_utils = require("../../../../utils");
+var BluetoothIcon = () => /* @__PURE__ */ import_react.default.createElement(
+  "svg",
+  {
+    viewBox: "0 0 1024 1024",
+    width: "1em",
+    height: "1em",
+    fill: "currentColor",
+    "aria-hidden": "true",
+    focusable: "false"
+  },
+  /* @__PURE__ */ import_react.default.createElement("path", { d: "M844.799642 674.803923 538.533306 521.15859l307.696917-177.029926c10.583033-5.006014 17.398252-15.59621 17.569144-27.302833s-6.332219-22.491247-16.764825-27.804253L475.584626 65.954131c-9.517771-4.846378-20.869307-4.39817-29.974685 1.181919-9.105379 5.581112-14.656815 15.493879-14.656815 26.174126l0 288.760636L210.662931 196.715267c-12.974499-10.915607-32.339546-9.248641-43.255153 3.724835-10.915607 12.973476-9.248641 32.339546 3.724835 43.255153L430.953126 462.312344l0 102.83511L171.558307 775.571954c-13.166881 10.68127-15.181771 30.013571-4.500501 43.180452 6.068206 7.480368 14.924921 11.360745 23.859407 11.360745 6.794753 0 13.634532-2.245134 19.322068-6.859221l220.714867-179.046862 0 283.065937c0 10.689457 5.561669 20.61041 14.680351 26.188452 4.903683 2.99931 10.455119 4.510734 16.019859 4.510734 4.78498 0 9.580193-1.118474 13.980409-3.368724l371.449917-224.085638c10.664897-5.456269 17.182334-16.618493 16.691147-28.589129C863.284645 689.959088 855.875908 679.368892 844.799642 674.803923zM763.458055 315.360458 492.351498 475.082182l0-21.60711c0.563842-3.368724 0.558725-6.801916 0-10.153244L492.351498 143.395898 763.458055 315.360458zM492.351498 877.084952 492.351498 584.489988c0.558725-3.347235 0.562818-6.777357 0-10.146081l0-5.809309 267.472797 137.65822L492.351498 877.084952z" })
+);
+var CONNECT_CONNECTION_TYPE_OPTIONS = import_utils.CONNECTION_TYPE_OPTIONS.filter(
+  (option) => option.value !== "serial"
+).map((option) => ({
+  ...option,
+  icon: option.value === "usb" ? /* @__PURE__ */ import_react.default.createElement(import_icons.UsbOutlined, null) : option.value === "ethernet" ? /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "ApiOutlined" }) : option.value === "wifi" ? /* @__PURE__ */ import_react.default.createElement(import_icons.WifiOutlined, null) : option.value === "bluetooth" ? /* @__PURE__ */ import_react.default.createElement(BluetoothIcon, null) : null
+}));
+var IPV4_PATTERN = /^(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}$/;
+var needsNetworkConfig = (connectionType) => connectionType === "ethernet" || connectionType === "wifi";
+var validateRequired = (message) => [
+  {
+    required: true,
+    message
+  }
+];
+var ConnectionConfigFields = ({
+  connectionType,
+  networkMethod,
+  profileRequired,
+  profileOptions,
+  getText
+}) => {
+  const validateIpAddress = (_rule, value) => {
+    const ipValue = String(value || "").trim();
+    if (!ipValue || IPV4_PATTERN.test(ipValue)) {
+      return Promise.resolve();
+    }
+    return Promise.reject(
+      new Error(getText("pisell2.saas.device-planning.connect.ip-address"))
+    );
+  };
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__connect-section-title" }, /* @__PURE__ */ import_react.default.createElement(import_icons.SettingOutlined, null), getText("pisell2.saas.device-planning.connect.configuration")), /* @__PURE__ */ import_react.default.createElement("div", { style: { height: "8px" } }), /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Form.Item,
+    {
+      name: "connection_type",
+      label: getText("pisell2.saas.device-planning.connect.connection-type"),
+      required: true,
+      rules: validateRequired(
+        getText("pisell2.saas.device-planning.connect.connection-type")
+      )
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_antd.Radio.Group, { className: "device-detail-drawer__connect-option-grid" }, CONNECT_CONNECTION_TYPE_OPTIONS.map((option) => /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Radio,
+      {
+        key: option.value,
+        value: option.value,
+        className: "device-detail-drawer__connect-option"
+      },
+      option.icon,
+      option.label
+    )))
+  ), needsNetworkConfig(connectionType) ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Form.Item,
+    {
+      name: "connection_method",
+      label: getText(
+        "pisell2.saas.device-planning.connect.network-config"
+      ),
+      required: true,
+      rules: validateRequired(
+        getText("pisell2.saas.device-planning.connect.network-config")
+      )
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_antd.Radio.Group, { className: "device-detail-drawer__connect-option-grid" }, ["auto", "manual"].map((method) => /* @__PURE__ */ import_react.default.createElement(
+      import_antd.Radio,
+      {
+        key: method,
+        value: method,
+        className: "device-detail-drawer__connect-option"
+      },
+      getText(
+        method === "auto" ? "pisell2.saas.device-planning.connect.auto-discovery" : "pisell2.saas.device-planning.connect.manual-ip"
+      )
+    )))
+  ), networkMethod === "manual" ? /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Form.Item,
+    {
+      name: "connection_ip",
+      label: getText("pisell2.saas.device-planning.connect.ip-address"),
+      required: true,
+      rules: [
+        ...validateRequired(
+          getText("pisell2.saas.device-planning.connect.ip-address")
+        ),
+        { validator: validateIpAddress }
+      ]
+    },
+    /* @__PURE__ */ import_react.default.createElement(import_materials.Input, { placeholder: "192.168.1.100" })
+  ) : null) : null, /* @__PURE__ */ import_react.default.createElement(
+    import_antd.Form.Item,
+    {
+      name: "profile_ids",
+      label: getText(
+        "pisell2.saas.device-planning.connect.peripheral-profiles"
+      ),
+      required: profileRequired,
+      rules: profileRequired ? [
+        {
+          type: "array",
+          required: true,
+          min: 1,
+          message: getText(
+            "pisell2.saas.device-planning.add.device-profile-required"
+          )
+        }
+      ] : [],
+      extra: /* @__PURE__ */ import_react.default.createElement("div", { className: "device-detail-drawer__connect-help" }, getText("pisell2.saas.device-planning.connect.profiles-help"))
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      import_materials.Select,
+      {
+        mode: "multiple",
+        options: profileOptions,
+        placeholder: getText(
+          "pisell2.saas.device-planning.connect.select-profiles"
+        )
+      }
+    )
+  ));
+};
+var ConnectionConfigFields_default = ConnectionConfigFields;

package/lib/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/connectDeviceModal/DeviceConnectionSummary.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { DeviceItem, DeviceModelItem, I18nText } from '../../../../types';
+import type { ConnectMode } from '../../hooks/useConnectDeviceModal';
+interface DeviceConnectionSummaryProps {
+    mode: ConnectMode;
+    smartDevice?: DeviceItem;
+    peripheral?: DeviceItem;
+    selectedModel?: DeviceModelItem;
+    translation: (val?: I18nText) => string;
+}
+declare const DeviceConnectionSummary: React.FC<DeviceConnectionSummaryProps>;
+export default DeviceConnectionSummary;

package/lib/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/connectDeviceModal/DeviceConnectionSummary.js

@@ -0,0 +1,78 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/connectDeviceModal/DeviceConnectionSummary.tsx
+var DeviceConnectionSummary_exports = {};
+__export(DeviceConnectionSummary_exports, {
+  default: () => DeviceConnectionSummary_default
+});
+module.exports = __toCommonJS(DeviceConnectionSummary_exports);
+var import_react = __toESM(require("react"));
+var import_materials = require("@pisell/materials");
+var import_icons = require("@ant-design/icons");
+var import_utils = require("../../../../utils");
+var DeviceCard = ({ device, model, translation }) => {
+  var _a, _b, _c, _d;
+  return /* @__PURE__ */ import_react.default.createElement(
+    "div",
+    {
+      className: `device-detail-drawer__connect-summary-card is-${(device == null ? void 0 : device.type_kind) || "dumb"}`
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      "span",
+      {
+        className: `device-detail-drawer__connect-device-icon is-${(device == null ? void 0 : device.type_kind) || "dumb"}`
+      },
+      /* @__PURE__ */ import_react.default.createElement(
+        import_materials.Icon,
+        {
+          type: ((_a = device == null ? void 0 : device.type) == null ? void 0 : _a.icon) || ((_b = model == null ? void 0 : model.type) == null ? void 0 : _b.icon) || "DesktopOutlined",
+          color: import_utils.DEVICE_ICON_COLOR[(device == null ? void 0 : device.type_kind) || "dumb"]
+        }
+      )
+    ),
+    /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("strong", null, device ? translation(device.name) || device.id : translation(model == null ? void 0 : model.name) || (model == null ? void 0 : model.code)), /* @__PURE__ */ import_react.default.createElement("span", null, device ? translation((_c = device.type) == null ? void 0 : _c.name) || device.type_code : translation((_d = model == null ? void 0 : model.type) == null ? void 0 : _d.name) || (model == null ? void 0 : model.type_code)))
+  );
+};
+var DeviceConnectionSummary = ({
+  mode,
+  smartDevice,
+  peripheral,
+  selectedModel,
+  translation
+}) => /* @__PURE__ */ import_react.default.createElement(
+  "div",
+  {
+    className: "device-detail-drawer__connect-summary",
+    style: { marginBottom: "16px" }
+  },
+  /* @__PURE__ */ import_react.default.createElement(DeviceCard, { device: smartDevice, translation }),
+  /* @__PURE__ */ import_react.default.createElement(import_icons.LinkOutlined, null),
+  mode === "new" ? /* @__PURE__ */ import_react.default.createElement(DeviceCard, { model: selectedModel, translation }) : /* @__PURE__ */ import_react.default.createElement(DeviceCard, { device: peripheral, translation })
+);
+var DeviceConnectionSummary_default = DeviceConnectionSummary;

package/lib/plus/saasDevice/devicePlanning/components/DeviceDetailDrawer/components/connectDeviceModal/NewPeripheralInfoFields.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { I18nText, WorkAreaItem } from '../../../../types';
+interface NewPeripheralInfoFieldsProps {
+    workAreas: WorkAreaItem[];
+    workAreaId?: number;
+    currentWorkAreaId?: number;
+    getText: (key: string) => string;
+    translation: (val?: I18nText) => string;
+}
+declare const NewPeripheralInfoFields: React.FC<NewPeripheralInfoFieldsProps>;
+export default NewPeripheralInfoFields;