diff --git a/src/data/hassio/network.ts b/src/data/hassio/network.ts
index 40500360af..1d036a04ee 100644
--- a/src/data/hassio/network.ts
+++ b/src/data/hassio/network.ts
@@ -120,7 +120,7 @@ export const parseAddress = (address: string) => {
const [ip, cidr] = address.split("/");
const isIPv6 = ip.includes(":");
const mask = cidr ? cidrToNetmask(cidr, isIPv6) : null;
- return { ip, mask };
+ return { ip, mask, prefix: cidr };
};
export const formatAddress = (ip: string, mask: string) =>
diff --git a/src/panels/config/network/supervisor-network.ts b/src/panels/config/network/supervisor-network.ts
index 93d03c7db9..c1029580e5 100644
--- a/src/panels/config/network/supervisor-network.ts
+++ b/src/panels/config/network/supervisor-network.ts
@@ -380,7 +380,7 @@ export class HassioNetwork extends LitElement {
? html`
${this._interface![version].address.map(
(address: string, index: number) => {
- const { ip, mask } = parseAddress(address);
+ const { ip, mask, prefix } = parseAddress(address);
return html`
-
-
+ ${version === "ipv6"
+ ? html`
+
+
+ `
+ : html`
+
+
+ `}
${this._interface![version].address.length > 1 &&
!disableInputs
? html`
@@ -667,6 +684,11 @@ export class HassioNetwork extends LitElement {
const { ip } = parseAddress(this._interface![version]!.address![index]);
this._interface[version]!.address![index] = formatAddress(ip, value);
this.requestUpdate("_interface");
+ } else if (id === "prefix") {
+ const index = (ev.target as any).index as number;
+ const { ip } = parseAddress(this._interface![version]!.address![index]);
+ this._interface[version]!.address![index] = `${ip}/${value}`;
+ this.requestUpdate("_interface");
} else if (id === "nameserver") {
const index = (ev.target as any).index as number;
this._interface[version]!.nameservers![index] = value;
diff --git a/src/translations/en.json b/src/translations/en.json
index 2e4330ad0c..38b7b408b5 100644
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -6319,6 +6319,7 @@
"disabled": "Disabled",
"ip": "IP address",
"netmask": "Netmask",
+ "prefix": "Subnet prefix",
"add_address": "Add address",
"gateway": "Gateway address",
"dns_server": "DNS Server",