@matter-server/dashboard 0.3.3 → 0.3.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +76 -0
- package/dist/esm/pages/components/node-details.js +1 -1
- package/dist/esm/pages/components/node-details.js.map +1 -1
- package/dist/esm/pages/matter-cluster-view.d.ts.map +1 -1
- package/dist/esm/pages/matter-cluster-view.js +9 -4
- package/dist/esm/pages/matter-cluster-view.js.map +1 -1
- package/dist/esm/pages/matter-endpoint-view.d.ts.map +1 -1
- package/dist/esm/pages/matter-endpoint-view.js +8 -2
- package/dist/esm/pages/matter-endpoint-view.js.map +1 -1
- package/dist/esm/pages/matter-node-view.d.ts.map +1 -1
- package/dist/esm/pages/matter-node-view.js +17 -3
- package/dist/esm/pages/matter-node-view.js.map +1 -1
- package/dist/esm/pages/network/base-network-graph.d.ts.map +1 -1
- package/dist/esm/pages/network/base-network-graph.js +10 -2
- package/dist/esm/pages/network/base-network-graph.js.map +1 -1
- package/dist/esm/pages/network/device-icons.js +1 -1
- package/dist/esm/pages/network/network-details.d.ts +31 -1
- package/dist/esm/pages/network/network-details.d.ts.map +1 -1
- package/dist/esm/pages/network/network-details.js +233 -15
- package/dist/esm/pages/network/network-details.js.map +1 -1
- package/dist/esm/pages/network/network-types.d.ts +6 -0
- package/dist/esm/pages/network/network-types.d.ts.map +1 -1
- package/dist/esm/pages/network/network-utils.d.ts +26 -0
- package/dist/esm/pages/network/network-utils.d.ts.map +1 -1
- package/dist/esm/pages/network/network-utils.js +71 -3
- package/dist/esm/pages/network/network-utils.js.map +1 -1
- package/dist/esm/pages/network/thread-graph.d.ts.map +1 -1
- package/dist/esm/pages/network/thread-graph.js +5 -2
- package/dist/esm/pages/network/thread-graph.js.map +1 -1
- package/dist/esm/pages/network/update-connections-dialog.d.ts +55 -0
- package/dist/esm/pages/network/update-connections-dialog.d.ts.map +1 -0
- package/dist/esm/pages/network/update-connections-dialog.js +284 -0
- package/dist/esm/pages/network/update-connections-dialog.js.map +6 -0
- package/dist/esm/pages/network/wifi-graph.d.ts.map +1 -1
- package/dist/esm/pages/network/wifi-graph.js +5 -3
- package/dist/esm/pages/network/wifi-graph.js.map +1 -1
- package/dist/esm/util/format_hex.d.ts +18 -0
- package/dist/esm/util/format_hex.d.ts.map +1 -1
- package/dist/esm/util/format_hex.js +21 -1
- package/dist/esm/util/format_hex.js.map +1 -1
- package/dist/web/js/{commission-node-dialog-B1_khzZb.js → commission-node-dialog-CcMuttYO.js} +5 -5
- package/dist/web/js/{commission-node-existing-RpdajrwF.js → commission-node-existing-CqTRDMAr.js} +2 -2
- package/dist/web/js/{commission-node-thread-5f2itkTG.js → commission-node-thread-DgwtTVwK.js} +2 -2
- package/dist/web/js/{commission-node-wifi-DZ_pWqsa.js → commission-node-wifi-XaN2SEnE.js} +2 -2
- package/dist/web/js/{dialog-box-DEUxM4B1.js → dialog-box-COpDD8i7.js} +2 -2
- package/dist/web/js/{fire_event-BczBMT8E.js → fire_event-mDYWi2sw.js} +1 -1
- package/dist/web/js/{log-level-dialog-Cr3PfX1X.js → log-level-dialog-Bc32kZVw.js} +2 -2
- package/dist/web/js/main.js +1 -1
- package/dist/web/js/{matter-dashboard-app-BuCe_Jxf.js → matter-dashboard-app-CrBHT4fT.js} +1824 -208
- package/dist/web/js/{node-binding-dialog-DMiHNDLA.js → node-binding-dialog-C8fqOJiB.js} +2 -2
- package/dist/web/js/prevent_default-D-ohDGsN.js +8 -0
- package/package.json +4 -4
- package/src/pages/components/node-details.ts +1 -1
- package/src/pages/matter-cluster-view.ts +11 -4
- package/src/pages/matter-endpoint-view.ts +10 -3
- package/src/pages/matter-node-view.ts +19 -4
- package/src/pages/network/base-network-graph.ts +17 -3
- package/src/pages/network/device-icons.ts +1 -1
- package/src/pages/network/network-details.ts +281 -16
- package/src/pages/network/network-types.ts +6 -0
- package/src/pages/network/network-utils.ts +109 -0
- package/src/pages/network/thread-graph.ts +7 -1
- package/src/pages/network/update-connections-dialog.ts +327 -0
- package/src/pages/network/wifi-graph.ts +4 -3
- package/src/util/format_hex.ts +39 -0
- package/dist/web/js/prevent_default-D4FX_PIh.js +0 -774
|
@@ -228,7 +228,7 @@ function c$4({
|
|
|
228
228
|
}
|
|
229
229
|
|
|
230
230
|
// Material Design Icons v7.4.47
|
|
231
|
-
var mdiAccessPoint="M4.93,4.93C3.12,6.74 2,9.24 2,12C2,14.76 3.12,17.26 4.93,19.07L6.34,17.66C4.89,16.22 4,14.22 4,12C4,9.79 4.89,7.78 6.34,6.34L4.93,4.93M19.07,4.93L17.66,6.34C19.11,7.78 20,9.79 20,12C20,14.22 19.11,16.22 17.66,17.66L19.07,19.07C20.88,17.26 22,14.76 22,12C22,9.24 20.88,6.74 19.07,4.93M7.76,7.76C6.67,8.85 6,10.35 6,12C6,13.65 6.67,15.15 7.76,16.24L9.17,14.83C8.45,14.11 8,13.11 8,12C8,10.89 8.45,9.89 9.17,9.17L7.76,7.76M16.24,7.76L14.83,9.17C15.55,9.89 16,10.89 16,12C16,13.11 15.55,14.11 14.83,14.83L16.24,16.24C17.33,15.15 18,13.65 18,12C18,10.35 17.33,8.85 16.24,7.76M12,10A2,2 0 0,0 10,12A2,2 0 0,0 12,14A2,2 0 0,0 14,12A2,2 0 0,0 12,10Z";var mdiArrowLeft="M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z";var mdiBrightnessAuto="M14.3,16L13.6,14H10.4L9.7,16H7.8L11,7H13L16.2,16H14.3M20,8.69V4H15.31L12,0.69L8.69,4H4V8.69L0.69,12L4,15.31V20H8.69L12,23.31L15.31,20H20V15.31L23.31,12L20,8.69M10.85,12.65H13.15L12,9L10.85,12.65Z";var mdiCeilingLight="M8,9H11V4H13V9H16L20,17H4L8,9M14,18A2,2 0 0,1 12,20A2,2 0 0,1 10,18H14Z";var mdiChatProcessing="M12,3C17.5,3 22,6.58 22,11C22,15.42 17.5,19 12,19C10.76,19 9.57,18.82 8.47,18.5C5.55,21 2,21 2,21C4.33,18.67 4.7,17.1 4.75,16.5C3.05,15.07 2,13.13 2,11C2,6.58 6.5,3 12,3M17,12V10H15V12H17M13,12V10H11V12H13M9,12V10H7V12H9Z";var mdiChevronDown="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z";var mdiChevronRight="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z";var mdiClose="M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z";var mdiCog="M12,15.5A3.5,3.5 0 0,1 8.5,12A3.5,3.5 0 0,1 12,8.5A3.5,3.5 0 0,1 15.5,12A3.5,3.5 0 0,1 12,15.5M19.43,12.97C19.47,12.65 19.5,12.33 19.5,12C19.5,11.67 19.47,11.34 19.43,11L21.54,9.37C21.73,9.22 21.78,8.95 21.66,8.73L19.66,5.27C19.54,5.05 19.27,4.96 19.05,5.05L16.56,6.05C16.04,5.66 15.5,5.32 14.87,5.07L14.5,2.42C14.46,2.18 14.25,2 14,2H10C9.75,2 9.54,2.18 9.5,2.42L9.13,5.07C8.5,5.32 7.96,5.66 7.44,6.05L4.95,5.05C4.73,4.96 4.46,5.05 4.34,5.27L2.34,8.73C2.21,8.95 2.27,9.22 2.46,9.37L4.57,11C4.53,11.34 4.5,11.67 4.5,12C4.5,12.33 4.53,12.65 4.57,12.97L2.46,14.63C2.27,14.78 2.21,15.05 2.34,15.27L4.34,18.73C4.46,18.95 4.73,19.03 4.95,18.95L7.44,17.94C7.96,18.34 8.5,18.68 9.13,18.93L9.5,21.58C9.54,21.82 9.75,22 10,22H14C14.25,22 14.46,21.82 14.5,21.58L14.87,18.93C15.5,18.67 16.04,18.34 16.56,17.94L19.05,18.95C19.27,19.03 19.54,18.95 19.66,18.73L21.66,15.27C21.78,15.05 21.73,14.78 21.54,14.63L19.43,12.97Z";var mdiDoorOpen="M12,3C10.89,3 10,3.89 10,5H3V19H2V21H22V19H21V5C21,3.89 20.11,3 19,3H12M12,5H19V19H12V5M5,11H7V13H5V11Z";var mdiEthernet="M7,15H9V18H11V15H13V18H15V15H17V18H19V9H15V6H9V9H5V18H7V15M4.38,3H19.63C20.94,3 22,4.06 22,5.38V19.63A2.37,2.37 0 0,1 19.63,22H4.38C3.06,22 2,20.94 2,19.63V5.38C2,4.06 3.06,3 4.38,3Z";var mdiFan="M12,11A1,1 0 0,0 11,12A1,1 0 0,0 12,13A1,1 0 0,0 13,12A1,1 0 0,0 12,11M12.5,2C17,2 17.11,5.57 14.75,6.75C13.76,7.24 13.32,8.29 13.13,9.22C13.61,9.42 14.03,9.73 14.35,10.13C18.05,8.13 22.03,8.92 22.03,12.5C22.03,17 18.46,17.1 17.28,14.73C16.78,13.74 15.72,13.3 14.79,13.11C14.59,13.59 14.28,14 13.88,14.34C15.87,18.03 15.08,22 11.5,22C7,22 6.91,18.42 9.27,17.24C10.25,16.75 10.69,15.71 10.89,14.79C10.4,14.59 9.97,14.27 9.65,13.87C5.96,15.85 2,15.07 2,11.5C2,7 5.56,6.89 6.74,9.26C7.24,10.25 8.29,10.68 9.22,10.87C9.41,10.39 9.73,9.97 10.14,9.65C8.15,5.96 8.94,2 12.5,2Z";var mdiFile="M13,9V3.5L18.5,9M6,2C4.89,2 4,2.89 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2H6Z";var mdiFitToScreen="M17 4H20C21.1 4 22 4.9 22 6V8H20V6H17V4M4 8V6H7V4H4C2.9 4 2 4.9 2 6V8H4M20 16V18H17V20H20C21.1 20 22 19.1 22 18V16H20M7 18H4V16H2V18C2 19.1 2.9 20 4 20H7V18M18 8H6V16H18V8Z";var mdiGauge="M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,4A8,8 0 0,1 20,12C20,14.4 19,16.5 17.3,18C15.9,16.7 14,16 12,16C10,16 8.2,16.7 6.7,18C5,16.5 4,14.4 4,12A8,8 0 0,1 12,4M14,5.89C13.62,5.9 13.26,6.15 13.1,6.54L11.81,9.77L11.71,10C11,10.13 10.41,10.6 10.14,11.26C9.73,12.29 10.23,13.45 11.26,13.86C12.29,14.27 13.45,13.77 13.86,12.74C14.12,12.08 14,11.32 13.57,10.76L13.67,10.5L14.96,7.29L14.97,7.26C15.17,6.75 14.92,6.17 14.41,5.96C14.28,5.91 14.15,5.89 14,5.89M10,6A1,1 0 0,0 9,7A1,1 0 0,0 10,8A1,1 0 0,0 11,7A1,1 0 0,0 10,6M7,9A1,1 0 0,0 6,10A1,1 0 0,0 7,11A1,1 0 0,0 8,10A1,1 0 0,0 7,9M17,9A1,1 0 0,0 16,10A1,1 0 0,0 17,11A1,1 0 0,0 18,10A1,1 0 0,0 17,9Z";var mdiGraphOutline="M19.5 17C19.36 17 19.24 17 19.11 17.04L17.5 13.8C17.95 13.35 18.25 12.71 18.25 12C18.25 10.62 17.13 9.5 15.75 9.5C15.61 9.5 15.5 9.5 15.35 9.54L13.74 6.3C14.21 5.84 14.5 5.21 14.5 4.5C14.5 3.12 13.38 2 12 2S9.5 3.12 9.5 4.5C9.5 5.2 9.79 5.84 10.26 6.29L8.65 9.54C8.5 9.5 8.39 9.5 8.25 9.5C6.87 9.5 5.75 10.62 5.75 12C5.75 12.71 6.04 13.34 6.5 13.79L4.89 17.04C4.76 17 4.64 17 4.5 17C3.12 17 2 18.12 2 19.5C2 20.88 3.12 22 4.5 22S7 20.88 7 19.5C7 18.8 6.71 18.16 6.24 17.71L7.86 14.46C8 14.5 8.12 14.5 8.25 14.5C8.38 14.5 8.5 14.5 8.63 14.46L10.26 17.71C9.79 18.16 9.5 18.8 9.5 19.5C9.5 20.88 10.62 22 12 22S14.5 20.88 14.5 19.5C14.5 18.12 13.38 17 12 17C11.87 17 11.74 17 11.61 17.04L10 13.8C10.45 13.35 10.75 12.71 10.75 12C10.75 11.3 10.46 10.67 10 10.21L11.61 6.96C11.74 7 11.87 7 12 7C12.13 7 12.26 7 12.39 6.96L14 10.21C13.54 10.66 13.25 11.3 13.25 12C13.25 13.38 14.37 14.5 15.75 14.5C15.88 14.5 16 14.5 16.13 14.46L17.76 17.71C17.29 18.16 17 18.8 17 19.5C17 20.88 18.12 22 19.5 22S22 20.88 22 19.5C22 18.12 20.88 17 19.5 17M4.5 20.5C3.95 20.5 3.5 20.05 3.5 19.5S3.95 18.5 4.5 18.5 5.5 18.95 5.5 19.5 5.05 20.5 4.5 20.5M13 19.5C13 20.05 12.55 20.5 12 20.5S11 20.05 11 19.5 11.45 18.5 12 18.5 13 18.95 13 19.5M7.25 12C7.25 11.45 7.7 11 8.25 11S9.25 11.45 9.25 12 8.8 13 8.25 13 7.25 12.55 7.25 12M11 4.5C11 3.95 11.45 3.5 12 3.5S13 3.95 13 4.5 12.55 5.5 12 5.5 11 5.05 11 4.5M14.75 12C14.75 11.45 15.2 11 15.75 11S16.75 11.45 16.75 12 16.3 13 15.75 13 14.75 12.55 14.75 12M19.5 20.5C18.95 20.5 18.5 20.05 18.5 19.5S18.95 18.5 19.5 18.5 20.5 18.95 20.5 19.5 20.05 20.5 19.5 20.5Z";var mdiHelp="M10,19H13V22H10V19M12,2C17.35,2.22 19.68,7.62 16.5,11.67C15.67,12.67 14.33,13.33 13.67,14.17C13,15 13,16 13,17H10C10,15.33 10,13.92 10.67,12.92C11.33,11.92 12.67,11.33 13.5,10.67C15.92,8.43 15.32,5.26 12,5A3,3 0 0,0 9,8H6A6,6 0 0,1 12,2Z";var mdiHome="M10,20V14H14V20H19V12H22L12,3L2,12H5V20H10Z";var mdiLightbulb="M12,2A7,7 0 0,0 5,9C5,11.38 6.19,13.47 8,14.74V17A1,1 0 0,0 9,18H15A1,1 0 0,0 16,17V14.74C17.81,13.47 19,11.38 19,9A7,7 0 0,0 12,2M9,21A1,1 0 0,0 10,22H14A1,1 0 0,0 15,21V20H9V21Z";var mdiLink="M3.9,12C3.9,10.29 5.29,8.9 7,8.9H11V7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H11V15.1H7C5.29,15.1 3.9,13.71 3.9,12M8,13H16V11H8V13M17,7H13V8.9H17C18.71,8.9 20.1,10.29 20.1,12C20.1,13.71 18.71,15.1 17,15.1H13V17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7Z";var mdiLock="M12,17A2,2 0 0,0 14,15C14,13.89 13.1,13 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6A2,2 0 0,1 4,20V10C4,8.89 4.9,8 6,8H7V6A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,3A3,3 0 0,0 9,6V8H15V6A3,3 0 0,0 12,3Z";var mdiLogout="M17 7L15.59 8.41L18.17 11H8V13H18.17L15.59 15.58L17 17L22 12M4 5H12V3H4C2.9 3 2 3.9 2 5V19C2 20.1 2.9 21 4 21H12V19H4V5Z";var mdiMotionSensor="M10,0.2C9,0.2 8.2,1 8.2,2C8.2,3 9,3.8 10,3.8C11,3.8 11.8,3 11.8,2C11.8,1 11,0.2 10,0.2M15.67,1A7.33,7.33 0 0,0 23,8.33V7A6,6 0 0,1 17,1H15.67M18.33,1C18.33,3.58 20.42,5.67 23,5.67V4.33C21.16,4.33 19.67,2.84 19.67,1H18.33M21,1A2,2 0 0,0 23,3V1H21M7.92,4.03C7.75,4.03 7.58,4.06 7.42,4.11L2,5.8V11H3.8V7.33L5.91,6.67L2,22H3.8L6.67,13.89L9,17V22H10.8V15.59L8.31,11.05L9.04,8.18L10.12,10H15V8.2H11.38L9.38,4.87C9.08,4.37 8.54,4.03 7.92,4.03Z";var mdiPlus="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z";var mdiPowerPlug="M16,7V3H14V7H10V3H8V7H8C7,7 6,8 6,9V14.5L9.5,18V21H14.5V18L18,14.5V9C18,8 17,7 16,7Z";var mdiRefresh="M17.65,6.35C16.2,4.9 14.21,4 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20C15.73,20 18.84,17.45 19.73,14H17.65C16.83,16.33 14.61,18 12,18A6,6 0 0,1 6,12A6,6 0 0,1 12,6C13.66,6 15.14,6.69 16.22,7.78L13,11H20V4L17.65,6.35Z";var mdiRouter="M12 2C6.5 2 2 6.5 2 12C2 17.5 6.5 22 12 22C17.5 22 22 17.5 22 12C22 6.5 17.5 2 12 2M12 20C7.58 20 4 16.42 4 12C4 7.58 7.58 4 12 4C16.42 4 20 7.58 20 12C20 16.42 16.42 20 12 20M13 13V16H15L12 19L9 16H11V13M5 13H8V15L11 12L8 9V11H5M11 11V8H9L12 5L15 8H13V11M19 11H16V9L13 12L16 15V13H19";var mdiShareVariant="M18,16.08C17.24,16.08 16.56,16.38 16.04,16.85L8.91,12.7C8.96,12.47 9,12.24 9,12C9,11.76 8.96,11.53 8.91,11.3L15.96,7.19C16.5,7.69 17.21,8 18,8A3,3 0 0,0 21,5A3,3 0 0,0 18,2A3,3 0 0,0 15,5C15,5.24 15.04,5.47 15.09,5.7L8.04,9.81C7.5,9.31 6.79,9 6,9A3,3 0 0,0 3,12A3,3 0 0,0 6,15C6.79,15 7.5,14.69 8.04,14.19L15.16,18.34C15.11,18.55 15.08,18.77 15.08,19C15.08,20.61 16.39,21.91 18,21.91C19.61,21.91 20.92,20.61 20.92,19A2.92,2.92 0 0,0 18,16.08Z";var mdiSignal="M3,21H6V18H3M8,21H11V14H8M13,21H16V9H13M18,21H21V3H18V21Z";var mdiSignalCellular1="M19.5,5.5V18.5H17.5V5.5H19.5M12.5,10.5V18.5H10.5V10.5H12.5M21,4H16V20H21V4M14,9H9V20H14V9M7,14H2V20H7V14Z";var mdiSignalCellular2="M19.5,5.5V18.5H17.5V5.5H19.5M21,4H16V20H21V4M14,9H9V20H14V9M7,14H2V20H7V14Z";var mdiSpeaker="M12,12A3,3 0 0,0 9,15A3,3 0 0,0 12,18A3,3 0 0,0 15,15A3,3 0 0,0 12,12M12,20A5,5 0 0,1 7,15A5,5 0 0,1 12,10A5,5 0 0,1 17,15A5,5 0 0,1 12,20M12,4A2,2 0 0,1 14,6A2,2 0 0,1 12,8C10.89,8 10,7.1 10,6C10,4.89 10.89,4 12,4M17,2H7C5.89,2 5,2.89 5,4V20A2,2 0 0,0 7,22H17A2,2 0 0,0 19,20V4C19,2.89 18.1,2 17,2Z";var mdiTelevision="M21,17H3V5H21M21,3H3A2,2 0 0,0 1,5V17A2,2 0 0,0 3,19H8V21H16V19H21A2,2 0 0,0 23,17V5A2,2 0 0,0 21,3Z";var mdiThermometer="M15 13V5A3 3 0 0 0 9 5V13A5 5 0 1 0 15 13M12 4A1 1 0 0 1 13 5V8H11V5A1 1 0 0 1 12 4Z";var mdiToggleSwitch="M17,7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7M17,15A3,3 0 0,1 14,12A3,3 0 0,1 17,9A3,3 0 0,1 20,12A3,3 0 0,1 17,15Z";var mdiTrashCan="M9,3V4H4V6H5V19A2,2 0 0,0 7,21H17A2,2 0 0,0 19,19V6H20V4H15V3H9M9,8H11V17H9V8M13,8H15V17H13V8Z";var mdiUpdate="M21,10.12H14.22L16.96,7.3C14.23,4.6 9.81,4.5 7.08,7.2C4.35,9.91 4.35,14.28 7.08,17C9.81,19.7 14.23,19.7 16.96,17C18.32,15.65 19,14.08 19,12.1H21C21,14.08 20.12,16.65 18.36,18.39C14.85,21.87 9.15,21.87 5.64,18.39C2.14,14.92 2.11,9.28 5.62,5.81C9.13,2.34 14.76,2.34 18.27,5.81L21,3V10.12M12.5,8V12.25L16,14.33L15.28,15.54L11,13V8H12.5Z";var mdiWater="M12,20A6,6 0 0,1 6,14C6,10 12,3.25 12,3.25C12,3.25 18,10 18,14A6,6 0 0,1 12,20Z";var mdiWeatherNight="M17.75,4.09L15.22,6.03L16.13,9.09L13.5,7.28L10.87,9.09L11.78,6.03L9.25,4.09L12.44,4L13.5,1L14.56,4L17.75,4.09M21.25,11L19.61,12.25L20.2,14.23L18.5,13.06L16.8,14.23L17.39,12.25L15.75,11L17.81,10.95L18.5,9L19.19,10.95L21.25,11M18.97,15.95C19.8,15.87 20.69,17.05 20.16,17.8C19.84,18.25 19.5,18.67 19.08,19.07C15.17,23 8.84,23 4.94,19.07C1.03,15.17 1.03,8.83 4.94,4.93C5.34,4.53 5.76,4.17 6.21,3.85C6.96,3.32 8.14,4.21 8.06,5.04C7.79,7.9 8.75,10.87 10.95,13.06C13.14,15.26 16.1,16.22 18.97,15.95M17.33,17.97C14.5,17.81 11.7,16.64 9.53,14.5C7.36,12.31 6.2,9.5 6.04,6.68C3.23,9.82 3.34,14.64 6.35,17.66C9.37,20.67 14.19,20.78 17.33,17.97Z";var mdiWeatherSunny="M12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9M12,2L14.39,5.42C13.65,5.15 12.84,5 12,5C11.16,5 10.35,5.15 9.61,5.42L12,2M3.34,7L7.5,6.65C6.9,7.16 6.36,7.78 5.94,8.5C5.5,9.24 5.25,10 5.11,10.79L3.34,7M3.36,17L5.12,13.23C5.26,14 5.53,14.78 5.95,15.5C6.37,16.24 6.91,16.86 7.5,17.37L3.36,17M20.65,7L18.88,10.79C18.74,10 18.47,9.23 18.05,8.5C17.63,7.78 17.1,7.15 16.5,6.64L20.65,7M20.64,17L16.5,17.36C17.09,16.85 17.62,16.22 18.04,15.5C18.46,14.77 18.73,14 18.87,13.21L20.64,17M12,22L9.59,18.56C10.33,18.83 11.14,19 12,19C12.82,19 13.63,18.83 14.37,18.56L12,22Z";var mdiWifi="M12,21L15.6,16.2C14.6,15.45 13.35,15 12,15C10.65,15 9.4,15.45 8.4,16.2L12,21M12,3C7.95,3 4.21,4.34 1.2,6.6L3,9C5.5,7.12 8.62,6 12,6C15.38,6 18.5,7.12 21,9L22.8,6.6C19.79,4.34 16.05,3 12,3M12,9C9.3,9 6.81,9.89 4.8,11.4L6.6,13.8C8.1,12.67 9.97,12 12,12C14.03,12 15.9,12.67 17.4,13.8L19.2,11.4C17.19,9.89 14.7,9 12,9Z";
|
|
231
|
+
var mdiAccessPoint="M4.93,4.93C3.12,6.74 2,9.24 2,12C2,14.76 3.12,17.26 4.93,19.07L6.34,17.66C4.89,16.22 4,14.22 4,12C4,9.79 4.89,7.78 6.34,6.34L4.93,4.93M19.07,4.93L17.66,6.34C19.11,7.78 20,9.79 20,12C20,14.22 19.11,16.22 17.66,17.66L19.07,19.07C20.88,17.26 22,14.76 22,12C22,9.24 20.88,6.74 19.07,4.93M7.76,7.76C6.67,8.85 6,10.35 6,12C6,13.65 6.67,15.15 7.76,16.24L9.17,14.83C8.45,14.11 8,13.11 8,12C8,10.89 8.45,9.89 9.17,9.17L7.76,7.76M16.24,7.76L14.83,9.17C15.55,9.89 16,10.89 16,12C16,13.11 15.55,14.11 14.83,14.83L16.24,16.24C17.33,15.15 18,13.65 18,12C18,10.35 17.33,8.85 16.24,7.76M12,10A2,2 0 0,0 10,12A2,2 0 0,0 12,14A2,2 0 0,0 14,12A2,2 0 0,0 12,10Z";var mdiArrowLeft="M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z";var mdiBrightnessAuto="M14.3,16L13.6,14H10.4L9.7,16H7.8L11,7H13L16.2,16H14.3M20,8.69V4H15.31L12,0.69L8.69,4H4V8.69L0.69,12L4,15.31V20H8.69L12,23.31L15.31,20H20V15.31L23.31,12L20,8.69M10.85,12.65H13.15L12,9L10.85,12.65Z";var mdiCeilingLight="M8,9H11V4H13V9H16L20,17H4L8,9M14,18A2,2 0 0,1 12,20A2,2 0 0,1 10,18H14Z";var mdiChatProcessing="M12,3C17.5,3 22,6.58 22,11C22,15.42 17.5,19 12,19C10.76,19 9.57,18.82 8.47,18.5C5.55,21 2,21 2,21C4.33,18.67 4.7,17.1 4.75,16.5C3.05,15.07 2,13.13 2,11C2,6.58 6.5,3 12,3M17,12V10H15V12H17M13,12V10H11V12H13M9,12V10H7V12H9Z";var mdiChevronDown="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z";var mdiChevronRight="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z";var mdiClose="M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z";var mdiCog="M12,15.5A3.5,3.5 0 0,1 8.5,12A3.5,3.5 0 0,1 12,8.5A3.5,3.5 0 0,1 15.5,12A3.5,3.5 0 0,1 12,15.5M19.43,12.97C19.47,12.65 19.5,12.33 19.5,12C19.5,11.67 19.47,11.34 19.43,11L21.54,9.37C21.73,9.22 21.78,8.95 21.66,8.73L19.66,5.27C19.54,5.05 19.27,4.96 19.05,5.05L16.56,6.05C16.04,5.66 15.5,5.32 14.87,5.07L14.5,2.42C14.46,2.18 14.25,2 14,2H10C9.75,2 9.54,2.18 9.5,2.42L9.13,5.07C8.5,5.32 7.96,5.66 7.44,6.05L4.95,5.05C4.73,4.96 4.46,5.05 4.34,5.27L2.34,8.73C2.21,8.95 2.27,9.22 2.46,9.37L4.57,11C4.53,11.34 4.5,11.67 4.5,12C4.5,12.33 4.53,12.65 4.57,12.97L2.46,14.63C2.27,14.78 2.21,15.05 2.34,15.27L4.34,18.73C4.46,18.95 4.73,19.03 4.95,18.95L7.44,17.94C7.96,18.34 8.5,18.68 9.13,18.93L9.5,21.58C9.54,21.82 9.75,22 10,22H14C14.25,22 14.46,21.82 14.5,21.58L14.87,18.93C15.5,18.67 16.04,18.34 16.56,17.94L19.05,18.95C19.27,19.03 19.54,18.95 19.66,18.73L21.66,15.27C21.78,15.05 21.73,14.78 21.54,14.63L19.43,12.97Z";var mdiDoorOpen="M12,3C10.89,3 10,3.89 10,5H3V19H2V21H22V19H21V5C21,3.89 20.11,3 19,3H12M12,5H19V19H12V5M5,11H7V13H5V11Z";var mdiEthernet="M7,15H9V18H11V15H13V18H15V15H17V18H19V9H15V6H9V9H5V18H7V15M4.38,3H19.63C20.94,3 22,4.06 22,5.38V19.63A2.37,2.37 0 0,1 19.63,22H4.38C3.06,22 2,20.94 2,19.63V5.38C2,4.06 3.06,3 4.38,3Z";var mdiFan="M12,11A1,1 0 0,0 11,12A1,1 0 0,0 12,13A1,1 0 0,0 13,12A1,1 0 0,0 12,11M12.5,2C17,2 17.11,5.57 14.75,6.75C13.76,7.24 13.32,8.29 13.13,9.22C13.61,9.42 14.03,9.73 14.35,10.13C18.05,8.13 22.03,8.92 22.03,12.5C22.03,17 18.46,17.1 17.28,14.73C16.78,13.74 15.72,13.3 14.79,13.11C14.59,13.59 14.28,14 13.88,14.34C15.87,18.03 15.08,22 11.5,22C7,22 6.91,18.42 9.27,17.24C10.25,16.75 10.69,15.71 10.89,14.79C10.4,14.59 9.97,14.27 9.65,13.87C5.96,15.85 2,15.07 2,11.5C2,7 5.56,6.89 6.74,9.26C7.24,10.25 8.29,10.68 9.22,10.87C9.41,10.39 9.73,9.97 10.14,9.65C8.15,5.96 8.94,2 12.5,2Z";var mdiFile="M13,9V3.5L18.5,9M6,2C4.89,2 4,2.89 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2H6Z";var mdiFitToScreen="M17 4H20C21.1 4 22 4.9 22 6V8H20V6H17V4M4 8V6H7V4H4C2.9 4 2 4.9 2 6V8H4M20 16V18H17V20H20C21.1 20 22 19.1 22 18V16H20M7 18H4V16H2V18C2 19.1 2.9 20 4 20H7V18M18 8H6V16H18V8Z";var mdiGauge="M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,4A8,8 0 0,1 20,12C20,14.4 19,16.5 17.3,18C15.9,16.7 14,16 12,16C10,16 8.2,16.7 6.7,18C5,16.5 4,14.4 4,12A8,8 0 0,1 12,4M14,5.89C13.62,5.9 13.26,6.15 13.1,6.54L11.81,9.77L11.71,10C11,10.13 10.41,10.6 10.14,11.26C9.73,12.29 10.23,13.45 11.26,13.86C12.29,14.27 13.45,13.77 13.86,12.74C14.12,12.08 14,11.32 13.57,10.76L13.67,10.5L14.96,7.29L14.97,7.26C15.17,6.75 14.92,6.17 14.41,5.96C14.28,5.91 14.15,5.89 14,5.89M10,6A1,1 0 0,0 9,7A1,1 0 0,0 10,8A1,1 0 0,0 11,7A1,1 0 0,0 10,6M7,9A1,1 0 0,0 6,10A1,1 0 0,0 7,11A1,1 0 0,0 8,10A1,1 0 0,0 7,9M17,9A1,1 0 0,0 16,10A1,1 0 0,0 17,11A1,1 0 0,0 18,10A1,1 0 0,0 17,9Z";var mdiGraphOutline="M19.5 17C19.36 17 19.24 17 19.11 17.04L17.5 13.8C17.95 13.35 18.25 12.71 18.25 12C18.25 10.62 17.13 9.5 15.75 9.5C15.61 9.5 15.5 9.5 15.35 9.54L13.74 6.3C14.21 5.84 14.5 5.21 14.5 4.5C14.5 3.12 13.38 2 12 2S9.5 3.12 9.5 4.5C9.5 5.2 9.79 5.84 10.26 6.29L8.65 9.54C8.5 9.5 8.39 9.5 8.25 9.5C6.87 9.5 5.75 10.62 5.75 12C5.75 12.71 6.04 13.34 6.5 13.79L4.89 17.04C4.76 17 4.64 17 4.5 17C3.12 17 2 18.12 2 19.5C2 20.88 3.12 22 4.5 22S7 20.88 7 19.5C7 18.8 6.71 18.16 6.24 17.71L7.86 14.46C8 14.5 8.12 14.5 8.25 14.5C8.38 14.5 8.5 14.5 8.63 14.46L10.26 17.71C9.79 18.16 9.5 18.8 9.5 19.5C9.5 20.88 10.62 22 12 22S14.5 20.88 14.5 19.5C14.5 18.12 13.38 17 12 17C11.87 17 11.74 17 11.61 17.04L10 13.8C10.45 13.35 10.75 12.71 10.75 12C10.75 11.3 10.46 10.67 10 10.21L11.61 6.96C11.74 7 11.87 7 12 7C12.13 7 12.26 7 12.39 6.96L14 10.21C13.54 10.66 13.25 11.3 13.25 12C13.25 13.38 14.37 14.5 15.75 14.5C15.88 14.5 16 14.5 16.13 14.46L17.76 17.71C17.29 18.16 17 18.8 17 19.5C17 20.88 18.12 22 19.5 22S22 20.88 22 19.5C22 18.12 20.88 17 19.5 17M4.5 20.5C3.95 20.5 3.5 20.05 3.5 19.5S3.95 18.5 4.5 18.5 5.5 18.95 5.5 19.5 5.05 20.5 4.5 20.5M13 19.5C13 20.05 12.55 20.5 12 20.5S11 20.05 11 19.5 11.45 18.5 12 18.5 13 18.95 13 19.5M7.25 12C7.25 11.45 7.7 11 8.25 11S9.25 11.45 9.25 12 8.8 13 8.25 13 7.25 12.55 7.25 12M11 4.5C11 3.95 11.45 3.5 12 3.5S13 3.95 13 4.5 12.55 5.5 12 5.5 11 5.05 11 4.5M14.75 12C14.75 11.45 15.2 11 15.75 11S16.75 11.45 16.75 12 16.3 13 15.75 13 14.75 12.55 14.75 12M19.5 20.5C18.95 20.5 18.5 20.05 18.5 19.5S18.95 18.5 19.5 18.5 20.5 18.95 20.5 19.5 20.05 20.5 19.5 20.5Z";var mdiHelp="M10,19H13V22H10V19M12,2C17.35,2.22 19.68,7.62 16.5,11.67C15.67,12.67 14.33,13.33 13.67,14.17C13,15 13,16 13,17H10C10,15.33 10,13.92 10.67,12.92C11.33,11.92 12.67,11.33 13.5,10.67C15.92,8.43 15.32,5.26 12,5A3,3 0 0,0 9,8H6A6,6 0 0,1 12,2Z";var mdiHome="M10,20V14H14V20H19V12H22L12,3L2,12H5V20H10Z";var mdiLightbulb="M12,2A7,7 0 0,0 5,9C5,11.38 6.19,13.47 8,14.74V17A1,1 0 0,0 9,18H15A1,1 0 0,0 16,17V14.74C17.81,13.47 19,11.38 19,9A7,7 0 0,0 12,2M9,21A1,1 0 0,0 10,22H14A1,1 0 0,0 15,21V20H9V21Z";var mdiLink="M3.9,12C3.9,10.29 5.29,8.9 7,8.9H11V7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H11V15.1H7C5.29,15.1 3.9,13.71 3.9,12M8,13H16V11H8V13M17,7H13V8.9H17C18.71,8.9 20.1,10.29 20.1,12C20.1,13.71 18.71,15.1 17,15.1H13V17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7Z";var mdiLoading="M12,4V2A10,10 0 0,0 2,12H4A8,8 0 0,1 12,4Z";var mdiLock="M12,17A2,2 0 0,0 14,15C14,13.89 13.1,13 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6A2,2 0 0,1 4,20V10C4,8.89 4.9,8 6,8H7V6A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,3A3,3 0 0,0 9,6V8H15V6A3,3 0 0,0 12,3Z";var mdiLogout="M17 7L15.59 8.41L18.17 11H8V13H18.17L15.59 15.58L17 17L22 12M4 5H12V3H4C2.9 3 2 3.9 2 5V19C2 20.1 2.9 21 4 21H12V19H4V5Z";var mdiMotionSensor="M10,0.2C9,0.2 8.2,1 8.2,2C8.2,3 9,3.8 10,3.8C11,3.8 11.8,3 11.8,2C11.8,1 11,0.2 10,0.2M15.67,1A7.33,7.33 0 0,0 23,8.33V7A6,6 0 0,1 17,1H15.67M18.33,1C18.33,3.58 20.42,5.67 23,5.67V4.33C21.16,4.33 19.67,2.84 19.67,1H18.33M21,1A2,2 0 0,0 23,3V1H21M7.92,4.03C7.75,4.03 7.58,4.06 7.42,4.11L2,5.8V11H3.8V7.33L5.91,6.67L2,22H3.8L6.67,13.89L9,17V22H10.8V15.59L8.31,11.05L9.04,8.18L10.12,10H15V8.2H11.38L9.38,4.87C9.08,4.37 8.54,4.03 7.92,4.03Z";var mdiPlus="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z";var mdiPowerPlug="M16,7V3H14V7H10V3H8V7H8C7,7 6,8 6,9V14.5L9.5,18V21H14.5V18L18,14.5V9C18,8 17,7 16,7Z";var mdiRefresh="M17.65,6.35C16.2,4.9 14.21,4 12,4A8,8 0 0,0 4,12A8,8 0 0,0 12,20C15.73,20 18.84,17.45 19.73,14H17.65C16.83,16.33 14.61,18 12,18A6,6 0 0,1 6,12A6,6 0 0,1 12,6C13.66,6 15.14,6.69 16.22,7.78L13,11H20V4L17.65,6.35Z";var mdiRouter="M12 2C6.5 2 2 6.5 2 12C2 17.5 6.5 22 12 22C17.5 22 22 17.5 22 12C22 6.5 17.5 2 12 2M12 20C7.58 20 4 16.42 4 12C4 7.58 7.58 4 12 4C16.42 4 20 7.58 20 12C20 16.42 16.42 20 12 20M13 13V16H15L12 19L9 16H11V13M5 13H8V15L11 12L8 9V11H5M11 11V8H9L12 5L15 8H13V11M19 11H16V9L13 12L16 15V13H19";var mdiShareVariant="M18,16.08C17.24,16.08 16.56,16.38 16.04,16.85L8.91,12.7C8.96,12.47 9,12.24 9,12C9,11.76 8.96,11.53 8.91,11.3L15.96,7.19C16.5,7.69 17.21,8 18,8A3,3 0 0,0 21,5A3,3 0 0,0 18,2A3,3 0 0,0 15,5C15,5.24 15.04,5.47 15.09,5.7L8.04,9.81C7.5,9.31 6.79,9 6,9A3,3 0 0,0 3,12A3,3 0 0,0 6,15C6.79,15 7.5,14.69 8.04,14.19L15.16,18.34C15.11,18.55 15.08,18.77 15.08,19C15.08,20.61 16.39,21.91 18,21.91C19.61,21.91 20.92,20.61 20.92,19A2.92,2.92 0 0,0 18,16.08Z";var mdiSignal="M3,21H6V18H3M8,21H11V14H8M13,21H16V9H13M18,21H21V3H18V21Z";var mdiSignalCellular1="M19.5,5.5V18.5H17.5V5.5H19.5M12.5,10.5V18.5H10.5V10.5H12.5M21,4H16V20H21V4M14,9H9V20H14V9M7,14H2V20H7V14Z";var mdiSignalCellular2="M19.5,5.5V18.5H17.5V5.5H19.5M21,4H16V20H21V4M14,9H9V20H14V9M7,14H2V20H7V14Z";var mdiSpeaker="M12,12A3,3 0 0,0 9,15A3,3 0 0,0 12,18A3,3 0 0,0 15,15A3,3 0 0,0 12,12M12,20A5,5 0 0,1 7,15A5,5 0 0,1 12,10A5,5 0 0,1 17,15A5,5 0 0,1 12,20M12,4A2,2 0 0,1 14,6A2,2 0 0,1 12,8C10.89,8 10,7.1 10,6C10,4.89 10.89,4 12,4M17,2H7C5.89,2 5,2.89 5,4V20A2,2 0 0,0 7,22H17A2,2 0 0,0 19,20V4C19,2.89 18.1,2 17,2Z";var mdiTelevision="M21,17H3V5H21M21,3H3A2,2 0 0,0 1,5V17A2,2 0 0,0 3,19H8V21H16V19H21A2,2 0 0,0 23,17V5A2,2 0 0,0 21,3Z";var mdiThermometer="M15 13V5A3 3 0 0 0 9 5V13A5 5 0 1 0 15 13M12 4A1 1 0 0 1 13 5V8H11V5A1 1 0 0 1 12 4Z";var mdiToggleSwitch="M17,7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7M17,15A3,3 0 0,1 14,12A3,3 0 0,1 17,9A3,3 0 0,1 20,12A3,3 0 0,1 17,15Z";var mdiTrashCan="M9,3V4H4V6H5V19A2,2 0 0,0 7,21H17A2,2 0 0,0 19,19V6H20V4H15V3H9M9,8H11V17H9V8M13,8H15V17H13V8Z";var mdiUpdate="M21,10.12H14.22L16.96,7.3C14.23,4.6 9.81,4.5 7.08,7.2C4.35,9.91 4.35,14.28 7.08,17C9.81,19.7 14.23,19.7 16.96,17C18.32,15.65 19,14.08 19,12.1H21C21,14.08 20.12,16.65 18.36,18.39C14.85,21.87 9.15,21.87 5.64,18.39C2.14,14.92 2.11,9.28 5.62,5.81C9.13,2.34 14.76,2.34 18.27,5.81L21,3V10.12M12.5,8V12.25L16,14.33L15.28,15.54L11,13V8H12.5Z";var mdiWater="M12,20A6,6 0 0,1 6,14C6,10 12,3.25 12,3.25C12,3.25 18,10 18,14A6,6 0 0,1 12,20Z";var mdiWeatherNight="M17.75,4.09L15.22,6.03L16.13,9.09L13.5,7.28L10.87,9.09L11.78,6.03L9.25,4.09L12.44,4L13.5,1L14.56,4L17.75,4.09M21.25,11L19.61,12.25L20.2,14.23L18.5,13.06L16.8,14.23L17.39,12.25L15.75,11L17.81,10.95L18.5,9L19.19,10.95L21.25,11M18.97,15.95C19.8,15.87 20.69,17.05 20.16,17.8C19.84,18.25 19.5,18.67 19.08,19.07C15.17,23 8.84,23 4.94,19.07C1.03,15.17 1.03,8.83 4.94,4.93C5.34,4.53 5.76,4.17 6.21,3.85C6.96,3.32 8.14,4.21 8.06,5.04C7.79,7.9 8.75,10.87 10.95,13.06C13.14,15.26 16.1,16.22 18.97,15.95M17.33,17.97C14.5,17.81 11.7,16.64 9.53,14.5C7.36,12.31 6.2,9.5 6.04,6.68C3.23,9.82 3.34,14.64 6.35,17.66C9.37,20.67 14.19,20.78 17.33,17.97Z";var mdiWeatherSunny="M12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9M12,2L14.39,5.42C13.65,5.15 12.84,5 12,5C11.16,5 10.35,5.15 9.61,5.42L12,2M3.34,7L7.5,6.65C6.9,7.16 6.36,7.78 5.94,8.5C5.5,9.24 5.25,10 5.11,10.79L3.34,7M3.36,17L5.12,13.23C5.26,14 5.53,14.78 5.95,15.5C6.37,16.24 6.91,16.86 7.5,17.37L3.36,17M20.65,7L18.88,10.79C18.74,10 18.47,9.23 18.05,8.5C17.63,7.78 17.1,7.15 16.5,6.64L20.65,7M20.64,17L16.5,17.36C17.09,16.85 17.62,16.22 18.04,15.5C18.46,14.77 18.73,14 18.87,13.21L20.64,17M12,22L9.59,18.56C10.33,18.83 11.14,19 12,19C12.82,19 13.63,18.83 14.37,18.56L12,22Z";var mdiWifi="M12,21L15.6,16.2C14.6,15.45 13.35,15 12,15C10.65,15 9.4,15.45 8.4,16.2L12,21M12,3C7.95,3 4.21,4.34 1.2,6.6L3,9C5.5,7.12 8.62,6 12,6C15.38,6 18.5,7.12 21,9L22.8,6.6C19.79,4.34 16.05,3 12,3M12,9C9.3,9 6.81,9.89 4.8,11.4L6.6,13.8C8.1,12.67 9.97,12 12,12C14.03,12 15.9,12.67 17.4,13.8L19.2,11.4C17.19,9.89 14.7,9 12,9Z";
|
|
232
232
|
|
|
233
233
|
/**
|
|
234
234
|
* @license
|
|
@@ -1074,12 +1074,12 @@ function o$3(o) {
|
|
|
1074
1074
|
*/
|
|
1075
1075
|
const clientContext = n$6("client");
|
|
1076
1076
|
|
|
1077
|
-
var __defProp$
|
|
1078
|
-
var __getOwnPropDesc$
|
|
1079
|
-
var __decorateClass$
|
|
1080
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$
|
|
1077
|
+
var __defProp$f = Object.defineProperty;
|
|
1078
|
+
var __getOwnPropDesc$i = Object.getOwnPropertyDescriptor;
|
|
1079
|
+
var __decorateClass$k = (decorators, target, key, kind) => {
|
|
1080
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$i(target, key) : target;
|
|
1081
1081
|
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
1082
|
-
if (kind && result) __defProp$
|
|
1082
|
+
if (kind && result) __defProp$f(target, key, result);
|
|
1083
1083
|
return result;
|
|
1084
1084
|
};
|
|
1085
1085
|
let HaSvgIcon = class extends i$5 {
|
|
@@ -1126,10 +1126,10 @@ let HaSvgIcon = class extends i$5 {
|
|
|
1126
1126
|
`;
|
|
1127
1127
|
}
|
|
1128
1128
|
};
|
|
1129
|
-
__decorateClass$
|
|
1130
|
-
__decorateClass$
|
|
1131
|
-
__decorateClass$
|
|
1132
|
-
HaSvgIcon = __decorateClass$
|
|
1129
|
+
__decorateClass$k([n$2()], HaSvgIcon.prototype, "path", 2);
|
|
1130
|
+
__decorateClass$k([n$2()], HaSvgIcon.prototype, "secondaryPath", 2);
|
|
1131
|
+
__decorateClass$k([n$2()], HaSvgIcon.prototype, "viewBox", 2);
|
|
1132
|
+
HaSvgIcon = __decorateClass$k([t$1("ha-svg-icon")], HaSvgIcon);
|
|
1133
1133
|
|
|
1134
1134
|
/**
|
|
1135
1135
|
* @license
|
|
@@ -1391,7 +1391,7 @@ const HANDLED_BY_FOCUS_RING = Symbol('handledByFocusRing');
|
|
|
1391
1391
|
* SPDX-License-Identifier: Apache-2.0
|
|
1392
1392
|
*/
|
|
1393
1393
|
// Generated stylesheet for ./focus/internal/focus-ring-styles.css.
|
|
1394
|
-
const styles$
|
|
1394
|
+
const styles$j = i$8`:host{animation-delay:0s,calc(var(--md-focus-ring-duration, 600ms)*.25);animation-duration:calc(var(--md-focus-ring-duration, 600ms)*.25),calc(var(--md-focus-ring-duration, 600ms)*.75);animation-timing-function:cubic-bezier(0.2, 0, 0, 1);box-sizing:border-box;color:var(--md-focus-ring-color, var(--md-sys-color-secondary, #625b71));display:none;pointer-events:none;position:absolute}:host([visible]){display:flex}:host(:not([inward])){animation-name:outward-grow,outward-shrink;border-end-end-radius:calc(var(--md-focus-ring-shape-end-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));border-end-start-radius:calc(var(--md-focus-ring-shape-end-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));border-start-end-radius:calc(var(--md-focus-ring-shape-start-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));border-start-start-radius:calc(var(--md-focus-ring-shape-start-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) + var(--md-focus-ring-outward-offset, 2px));inset:calc(-1*var(--md-focus-ring-outward-offset, 2px));outline:var(--md-focus-ring-width, 3px) solid currentColor}:host([inward]){animation-name:inward-grow,inward-shrink;border-end-end-radius:calc(var(--md-focus-ring-shape-end-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border-end-start-radius:calc(var(--md-focus-ring-shape-end-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border-start-end-radius:calc(var(--md-focus-ring-shape-start-end, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border-start-start-radius:calc(var(--md-focus-ring-shape-start-start, var(--md-focus-ring-shape, var(--md-sys-shape-corner-full, 9999px))) - var(--md-focus-ring-inward-offset, 0px));border:var(--md-focus-ring-width, 3px) solid currentColor;inset:var(--md-focus-ring-inward-offset, 0px)}@keyframes outward-grow{from{outline-width:0}to{outline-width:var(--md-focus-ring-active-width, 8px)}}@keyframes outward-shrink{from{outline-width:var(--md-focus-ring-active-width, 8px)}}@keyframes inward-grow{from{border-width:0}to{border-width:var(--md-focus-ring-active-width, 8px)}}@keyframes inward-shrink{from{border-width:var(--md-focus-ring-active-width, 8px)}}@media(prefers-reduced-motion){:host{animation:none}}
|
|
1395
1395
|
`;
|
|
1396
1396
|
|
|
1397
1397
|
/**
|
|
@@ -1406,7 +1406,7 @@ const styles$h = i$8`:host{animation-delay:0s,calc(var(--md-focus-ring-duration,
|
|
|
1406
1406
|
* @suppress {visibility}
|
|
1407
1407
|
*/
|
|
1408
1408
|
let MdFocusRing = class MdFocusRing extends FocusRing {};
|
|
1409
|
-
MdFocusRing.styles = [styles$
|
|
1409
|
+
MdFocusRing.styles = [styles$j];
|
|
1410
1410
|
MdFocusRing = __decorate([t$1('md-focus-ring')], MdFocusRing);
|
|
1411
1411
|
|
|
1412
1412
|
/**
|
|
@@ -1957,7 +1957,7 @@ __decorate([e$5('.surface')], Ripple.prototype, "mdRoot", void 0);
|
|
|
1957
1957
|
* SPDX-License-Identifier: Apache-2.0
|
|
1958
1958
|
*/
|
|
1959
1959
|
// Generated stylesheet for ./ripple/internal/ripple-styles.css.
|
|
1960
|
-
const styles$
|
|
1960
|
+
const styles$i = i$8`:host{display:flex;margin:auto;pointer-events:none}:host([disabled]){display:none}@media(forced-colors: active){:host{display:none}}:host,.surface{border-radius:inherit;position:absolute;inset:0;overflow:hidden}.surface{-webkit-tap-highlight-color:rgba(0,0,0,0)}.surface::before,.surface::after{content:"";opacity:0;position:absolute}.surface::before{background-color:var(--md-ripple-hover-color, var(--md-sys-color-on-surface, #1d1b20));inset:0;transition:opacity 15ms linear,background-color 15ms linear}.surface::after{background:radial-gradient(closest-side, var(--md-ripple-pressed-color, var(--md-sys-color-on-surface, #1d1b20)) max(100% - 70px, 65%), transparent 100%);transform-origin:center center;transition:opacity 375ms linear}.hovered::before{background-color:var(--md-ripple-hover-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-ripple-hover-opacity, 0.08)}.pressed::after{opacity:var(--md-ripple-pressed-opacity, 0.12);transition-duration:105ms}
|
|
1961
1961
|
`;
|
|
1962
1962
|
|
|
1963
1963
|
/**
|
|
@@ -1979,7 +1979,7 @@ const styles$g = i$8`:host{display:flex;margin:auto;pointer-events:none}:host([d
|
|
|
1979
1979
|
* @suppress {visibility}
|
|
1980
1980
|
*/
|
|
1981
1981
|
let MdRipple = class MdRipple extends Ripple {};
|
|
1982
|
-
MdRipple.styles = [styles$
|
|
1982
|
+
MdRipple.styles = [styles$i];
|
|
1983
1983
|
MdRipple = __decorate([t$1('md-ripple')], MdRipple);
|
|
1984
1984
|
|
|
1985
1985
|
/**
|
|
@@ -2638,7 +2638,7 @@ class OutlinedButton extends Button {
|
|
|
2638
2638
|
* SPDX-License-Identifier: Apache-2.0
|
|
2639
2639
|
*/
|
|
2640
2640
|
// Generated stylesheet for ./button/internal/outlined-styles.css.
|
|
2641
|
-
const styles$
|
|
2641
|
+
const styles$h = i$8`:host{--_container-height: var(--md-outlined-button-container-height, 40px);--_disabled-label-text-color: var(--md-outlined-button-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-outlined-button-disabled-label-text-opacity, 0.38);--_disabled-outline-color: var(--md-outlined-button-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-outlined-button-disabled-outline-opacity, 0.12);--_focus-label-text-color: var(--md-outlined-button-focus-label-text-color, var(--md-sys-color-primary, #6750a4));--_hover-label-text-color: var(--md-outlined-button-hover-label-text-color, var(--md-sys-color-primary, #6750a4));--_hover-state-layer-color: var(--md-outlined-button-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_hover-state-layer-opacity: var(--md-outlined-button-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-outlined-button-label-text-color, var(--md-sys-color-primary, #6750a4));--_label-text-font: var(--md-outlined-button-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-outlined-button-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-outlined-button-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));--_label-text-weight: var(--md-outlined-button-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_outline-color: var(--md-outlined-button-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-outlined-button-outline-width, 1px);--_pressed-label-text-color: var(--md-outlined-button-pressed-label-text-color, var(--md-sys-color-primary, #6750a4));--_pressed-outline-color: var(--md-outlined-button-pressed-outline-color, var(--md-sys-color-outline, #79747e));--_pressed-state-layer-color: var(--md-outlined-button-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_pressed-state-layer-opacity: var(--md-outlined-button-pressed-state-layer-opacity, 0.12);--_disabled-icon-color: var(--md-outlined-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-outlined-button-disabled-icon-opacity, 0.38);--_focus-icon-color: var(--md-outlined-button-focus-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-icon-color: var(--md-outlined-button-hover-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-color: var(--md-outlined-button-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-size: var(--md-outlined-button-icon-size, 18px);--_pressed-icon-color: var(--md-outlined-button-pressed-icon-color, var(--md-sys-color-primary, #6750a4));--_container-shape-start-start: var(--md-outlined-button-container-shape-start-start, var(--md-outlined-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-outlined-button-container-shape-start-end, var(--md-outlined-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-outlined-button-container-shape-end-end, var(--md-outlined-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-outlined-button-container-shape-end-start, var(--md-outlined-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_leading-space: var(--md-outlined-button-leading-space, 24px);--_trailing-space: var(--md-outlined-button-trailing-space, 24px);--_with-leading-icon-leading-space: var(--md-outlined-button-with-leading-icon-leading-space, 16px);--_with-leading-icon-trailing-space: var(--md-outlined-button-with-leading-icon-trailing-space, 24px);--_with-trailing-icon-leading-space: var(--md-outlined-button-with-trailing-icon-leading-space, 24px);--_with-trailing-icon-trailing-space: var(--md-outlined-button-with-trailing-icon-trailing-space, 16px);--_container-color: none;--_disabled-container-color: none;--_disabled-container-opacity: 0}.outline{inset:0;border-style:solid;position:absolute;box-sizing:border-box;border-color:var(--_outline-color);border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-start-radius:var(--_container-shape-end-start);border-end-end-radius:var(--_container-shape-end-end)}:host(:active) .outline{border-color:var(--_pressed-outline-color)}:host(:is([disabled],[soft-disabled])) .outline{border-color:var(--_disabled-outline-color);opacity:var(--_disabled-outline-opacity)}@media(forced-colors: active){:host(:is([disabled],[soft-disabled])) .background{border-color:GrayText}:host(:is([disabled],[soft-disabled])) .outline{opacity:1}}.outline,md-ripple{border-width:var(--_outline-width)}md-ripple{inline-size:calc(100% - 2*var(--_outline-width));block-size:calc(100% - 2*var(--_outline-width));border-style:solid;border-color:rgba(0,0,0,0)}
|
|
2642
2642
|
`;
|
|
2643
2643
|
|
|
2644
2644
|
/**
|
|
@@ -2647,7 +2647,7 @@ const styles$f = i$8`:host{--_container-height: var(--md-outlined-button-contain
|
|
|
2647
2647
|
* SPDX-License-Identifier: Apache-2.0
|
|
2648
2648
|
*/
|
|
2649
2649
|
// Generated stylesheet for ./button/internal/shared-styles.css.
|
|
2650
|
-
const styles$
|
|
2650
|
+
const styles$g = i$8`:host{border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-start-radius:var(--_container-shape-end-start);border-end-end-radius:var(--_container-shape-end-end);box-sizing:border-box;cursor:pointer;display:inline-flex;gap:8px;min-height:var(--_container-height);outline:none;padding-block:calc((var(--_container-height) - max(var(--_label-text-line-height),var(--_icon-size)))/2);padding-inline-start:var(--_leading-space);padding-inline-end:var(--_trailing-space);place-content:center;place-items:center;position:relative;font-family:var(--_label-text-font);font-size:var(--_label-text-size);line-height:var(--_label-text-line-height);font-weight:var(--_label-text-weight);text-overflow:ellipsis;text-wrap:nowrap;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);vertical-align:top;--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}md-focus-ring{--md-focus-ring-shape-start-start: var(--_container-shape-start-start);--md-focus-ring-shape-start-end: var(--_container-shape-start-end);--md-focus-ring-shape-end-end: var(--_container-shape-end-end);--md-focus-ring-shape-end-start: var(--_container-shape-end-start)}:host(:is([disabled],[soft-disabled])){cursor:default;pointer-events:none}.button{border-radius:inherit;cursor:inherit;display:inline-flex;align-items:center;justify-content:center;border:none;outline:none;-webkit-appearance:none;vertical-align:middle;background:rgba(0,0,0,0);text-decoration:none;min-width:calc(64px - var(--_leading-space) - var(--_trailing-space));width:100%;z-index:0;height:100%;font:inherit;color:var(--_label-text-color);padding:0;gap:inherit;text-transform:inherit}.button::-moz-focus-inner{padding:0;border:0}:host(:hover) .button{color:var(--_hover-label-text-color)}:host(:focus-within) .button{color:var(--_focus-label-text-color)}:host(:active) .button{color:var(--_pressed-label-text-color)}.background{background:var(--_container-color);border-radius:inherit;inset:0;position:absolute}.label{overflow:hidden}:is(.button,.label,.label slot),.label ::slotted(*){text-overflow:inherit}:host(:is([disabled],[soft-disabled])) .label{color:var(--_disabled-label-text-color);opacity:var(--_disabled-label-text-opacity)}:host(:is([disabled],[soft-disabled])) .background{background:var(--_disabled-container-color);opacity:var(--_disabled-container-opacity)}@media(forced-colors: active){.background{border:1px solid CanvasText}:host(:is([disabled],[soft-disabled])){--_disabled-icon-color: GrayText;--_disabled-icon-opacity: 1;--_disabled-container-opacity: 1;--_disabled-label-text-color: GrayText;--_disabled-label-text-opacity: 1}}:host([has-icon]:not([trailing-icon])){padding-inline-start:var(--_with-leading-icon-leading-space);padding-inline-end:var(--_with-leading-icon-trailing-space)}:host([has-icon][trailing-icon]){padding-inline-start:var(--_with-trailing-icon-leading-space);padding-inline-end:var(--_with-trailing-icon-trailing-space)}::slotted([slot=icon]){display:inline-flex;position:relative;writing-mode:horizontal-tb;fill:currentColor;flex-shrink:0;color:var(--_icon-color);font-size:var(--_icon-size);inline-size:var(--_icon-size);block-size:var(--_icon-size)}:host(:hover) ::slotted([slot=icon]){color:var(--_hover-icon-color)}:host(:focus-within) ::slotted([slot=icon]){color:var(--_focus-icon-color)}:host(:active) ::slotted([slot=icon]){color:var(--_pressed-icon-color)}:host(:is([disabled],[soft-disabled])) ::slotted([slot=icon]){color:var(--_disabled-icon-color);opacity:var(--_disabled-icon-opacity)}.touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_container-height))/2) 0}:host([touch-target=none]) .touch{display:none}
|
|
2651
2651
|
`;
|
|
2652
2652
|
|
|
2653
2653
|
/**
|
|
@@ -2678,7 +2678,7 @@ const styles$e = i$8`:host{border-start-start-radius:var(--_container-shape-star
|
|
|
2678
2678
|
* @suppress {visibility}
|
|
2679
2679
|
*/
|
|
2680
2680
|
let MdOutlinedButton = class MdOutlinedButton extends OutlinedButton {};
|
|
2681
|
-
MdOutlinedButton.styles = [styles$
|
|
2681
|
+
MdOutlinedButton.styles = [styles$g, styles$h];
|
|
2682
2682
|
MdOutlinedButton = __decorate([t$1('md-outlined-button')], MdOutlinedButton);
|
|
2683
2683
|
|
|
2684
2684
|
/**
|
|
@@ -2727,7 +2727,7 @@ __decorate([n$2({
|
|
|
2727
2727
|
* SPDX-License-Identifier: Apache-2.0
|
|
2728
2728
|
*/
|
|
2729
2729
|
// Generated stylesheet for ./divider/internal/divider-styles.css.
|
|
2730
|
-
const styles$
|
|
2730
|
+
const styles$f = i$8`:host{box-sizing:border-box;color:var(--md-divider-color, var(--md-sys-color-outline-variant, #cac4d0));display:flex;height:var(--md-divider-thickness, 1px);width:100%}:host([inset]),:host([inset-start]){padding-inline-start:16px}:host([inset]),:host([inset-end]){padding-inline-end:16px}:host::before{background:currentColor;content:"";height:100%;width:100%}@media(forced-colors: active){:host::before{background:CanvasText}}
|
|
2731
2731
|
`;
|
|
2732
2732
|
|
|
2733
2733
|
/**
|
|
@@ -2746,7 +2746,7 @@ const styles$d = i$8`:host{box-sizing:border-box;color:var(--md-divider-color, v
|
|
|
2746
2746
|
* @suppress {visibility}
|
|
2747
2747
|
*/
|
|
2748
2748
|
let MdDivider = class MdDivider extends Divider {};
|
|
2749
|
-
MdDivider.styles = [styles$
|
|
2749
|
+
MdDivider.styles = [styles$f];
|
|
2750
2750
|
MdDivider = __decorate([t$1('md-divider')], MdDivider);
|
|
2751
2751
|
|
|
2752
2752
|
/**
|
|
@@ -3069,7 +3069,7 @@ __decorate([r$2()], IconButton.prototype, "flipIcon", void 0);
|
|
|
3069
3069
|
* SPDX-License-Identifier: Apache-2.0
|
|
3070
3070
|
*/
|
|
3071
3071
|
// Generated stylesheet for ./iconbutton/internal/shared-styles.css.
|
|
3072
|
-
const styles$
|
|
3072
|
+
const styles$e = i$8`:host{display:inline-flex;outline:none;-webkit-tap-highlight-color:rgba(0,0,0,0);height:var(--_container-height);width:var(--_container-width);justify-content:center}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_container-height))/2) max(0px,(48px - var(--_container-width))/2)}md-focus-ring{--md-focus-ring-shape-start-start: var(--_container-shape-start-start);--md-focus-ring-shape-start-end: var(--_container-shape-start-end);--md-focus-ring-shape-end-end: var(--_container-shape-end-end);--md-focus-ring-shape-end-start: var(--_container-shape-end-start)}:host(:is([disabled],[soft-disabled])){pointer-events:none}.icon-button{place-items:center;background:none;border:none;box-sizing:border-box;cursor:pointer;display:flex;place-content:center;outline:none;padding:0;position:relative;text-decoration:none;user-select:none;z-index:0;flex:1;border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-start-radius:var(--_container-shape-end-start);border-end-end-radius:var(--_container-shape-end-end)}.icon ::slotted(*){font-size:var(--_icon-size);height:var(--_icon-size);width:var(--_icon-size);font-weight:inherit}md-ripple{z-index:-1;border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-start-radius:var(--_container-shape-end-start);border-end-end-radius:var(--_container-shape-end-end)}.flip-icon .icon{transform:scaleX(-1)}.icon{display:inline-flex}.link{display:grid;height:100%;outline:none;place-items:center;position:absolute;width:100%}.touch{position:absolute;height:max(48px,100%);width:max(48px,100%)}:host([touch-target=none]) .touch{display:none}@media(forced-colors: active){:host(:is([disabled],[soft-disabled])){--_disabled-icon-color: GrayText;--_disabled-icon-opacity: 1}}
|
|
3073
3073
|
`;
|
|
3074
3074
|
|
|
3075
3075
|
/**
|
|
@@ -3078,7 +3078,7 @@ const styles$c = i$8`:host{display:inline-flex;outline:none;-webkit-tap-highligh
|
|
|
3078
3078
|
* SPDX-License-Identifier: Apache-2.0
|
|
3079
3079
|
*/
|
|
3080
3080
|
// Generated stylesheet for ./iconbutton/internal/standard-styles.css.
|
|
3081
|
-
const styles$
|
|
3081
|
+
const styles$d = i$8`:host{--_disabled-icon-color: var(--md-icon-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-icon-button-disabled-icon-opacity, 0.38);--_icon-size: var(--md-icon-button-icon-size, 24px);--_selected-focus-icon-color: var(--md-icon-button-selected-focus-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-icon-color: var(--md-icon-button-selected-hover-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-color: var(--md-icon-button-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-hover-state-layer-opacity: var(--md-icon-button-selected-hover-state-layer-opacity, 0.08);--_selected-icon-color: var(--md-icon-button-selected-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-icon-color: var(--md-icon-button-selected-pressed-icon-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-state-layer-color: var(--md-icon-button-selected-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_selected-pressed-state-layer-opacity: var(--md-icon-button-selected-pressed-state-layer-opacity, 0.12);--_state-layer-height: var(--md-icon-button-state-layer-height, 40px);--_state-layer-shape: var(--md-icon-button-state-layer-shape, var(--md-sys-shape-corner-full, 9999px));--_state-layer-width: var(--md-icon-button-state-layer-width, 40px);--_focus-icon-color: var(--md-icon-button-focus-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-icon-color: var(--md-icon-button-hover-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-icon-button-hover-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-opacity: var(--md-icon-button-hover-state-layer-opacity, 0.08);--_icon-color: var(--md-icon-button-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-icon-color: var(--md-icon-button-pressed-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-color: var(--md-icon-button-pressed-state-layer-color, var(--md-sys-color-on-surface-variant, #49454f));--_pressed-state-layer-opacity: var(--md-icon-button-pressed-state-layer-opacity, 0.12);--_container-shape-start-start: 0;--_container-shape-start-end: 0;--_container-shape-end-end: 0;--_container-shape-end-start: 0;--_container-height: 0;--_container-width: 0;height:var(--_state-layer-height);width:var(--_state-layer-width)}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--_state-layer-height))/2) max(0px,(48px - var(--_state-layer-width))/2)}md-focus-ring{--md-focus-ring-shape-start-start: var(--_state-layer-shape);--md-focus-ring-shape-start-end: var(--_state-layer-shape);--md-focus-ring-shape-end-end: var(--_state-layer-shape);--md-focus-ring-shape-end-start: var(--_state-layer-shape)}.standard{background-color:rgba(0,0,0,0);color:var(--_icon-color);--md-ripple-hover-color: var(--_hover-state-layer-color);--md-ripple-hover-opacity: var(--_hover-state-layer-opacity);--md-ripple-pressed-color: var(--_pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_pressed-state-layer-opacity)}.standard:hover{color:var(--_hover-icon-color)}.standard:focus{color:var(--_focus-icon-color)}.standard:active{color:var(--_pressed-icon-color)}.standard:is(:disabled,[aria-disabled=true]){color:var(--_disabled-icon-color)}md-ripple{border-radius:var(--_state-layer-shape)}.standard:is(:disabled,[aria-disabled=true]){opacity:var(--_disabled-icon-opacity)}.selected:not(:disabled,[aria-disabled=true]){color:var(--_selected-icon-color)}.selected:not(:disabled,[aria-disabled=true]):hover{color:var(--_selected-hover-icon-color)}.selected:not(:disabled,[aria-disabled=true]):focus{color:var(--_selected-focus-icon-color)}.selected:not(:disabled,[aria-disabled=true]):active{color:var(--_selected-pressed-icon-color)}.selected{--md-ripple-hover-color: var(--_selected-hover-state-layer-color);--md-ripple-hover-opacity: var(--_selected-hover-state-layer-opacity);--md-ripple-pressed-color: var(--_selected-pressed-state-layer-color);--md-ripple-pressed-opacity: var(--_selected-pressed-state-layer-opacity)}
|
|
3082
3082
|
`;
|
|
3083
3083
|
|
|
3084
3084
|
/**
|
|
@@ -3112,7 +3112,7 @@ let MdIconButton = class MdIconButton extends IconButton {
|
|
|
3112
3112
|
};
|
|
3113
3113
|
}
|
|
3114
3114
|
};
|
|
3115
|
-
MdIconButton.styles = [styles$
|
|
3115
|
+
MdIconButton.styles = [styles$e, styles$d];
|
|
3116
3116
|
MdIconButton = __decorate([t$1('md-icon-button')], MdIconButton);
|
|
3117
3117
|
|
|
3118
3118
|
/**
|
|
@@ -3580,7 +3580,7 @@ __decorate([o$3({
|
|
|
3580
3580
|
* SPDX-License-Identifier: Apache-2.0
|
|
3581
3581
|
*/
|
|
3582
3582
|
// Generated stylesheet for ./list/internal/list-styles.css.
|
|
3583
|
-
const styles$
|
|
3583
|
+
const styles$c = i$8`:host{background:var(--md-list-container-color, var(--md-sys-color-surface, #fef7ff));color:unset;display:flex;flex-direction:column;outline:none;padding:8px 0;position:relative}
|
|
3584
3584
|
`;
|
|
3585
3585
|
|
|
3586
3586
|
/**
|
|
@@ -3608,7 +3608,7 @@ const styles$a = i$8`:host{background:var(--md-list-container-color, var(--md-sy
|
|
|
3608
3608
|
* @suppress {visibility}
|
|
3609
3609
|
*/
|
|
3610
3610
|
let MdList = class MdList extends List {};
|
|
3611
|
-
MdList.styles = [styles$
|
|
3611
|
+
MdList.styles = [styles$c];
|
|
3612
3612
|
MdList = __decorate([t$1('md-list')], MdList);
|
|
3613
3613
|
|
|
3614
3614
|
/**
|
|
@@ -3694,7 +3694,7 @@ function slotHasContent(slot) {
|
|
|
3694
3694
|
* SPDX-License-Identifier: Apache-2.0
|
|
3695
3695
|
*/
|
|
3696
3696
|
// Generated stylesheet for ./labs/item/internal/item-styles.css.
|
|
3697
|
-
const styles$
|
|
3697
|
+
const styles$b = i$8`:host{color:var(--md-sys-color-on-surface, #1d1b20);font-family:var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto));font-size:var(--md-sys-typescale-body-large-size, 1rem);font-weight:var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400));line-height:var(--md-sys-typescale-body-large-line-height, 1.5rem);align-items:center;box-sizing:border-box;display:flex;gap:16px;min-height:56px;overflow:hidden;padding:12px 16px;position:relative;text-overflow:ellipsis}:host([multiline]){min-height:72px}[name=overline]{color:var(--md-sys-color-on-surface-variant, #49454f);font-family:var(--md-sys-typescale-label-small-font, var(--md-ref-typeface-plain, Roboto));font-size:var(--md-sys-typescale-label-small-size, 0.6875rem);font-weight:var(--md-sys-typescale-label-small-weight, var(--md-ref-typeface-weight-medium, 500));line-height:var(--md-sys-typescale-label-small-line-height, 1rem)}[name=supporting-text]{color:var(--md-sys-color-on-surface-variant, #49454f);font-family:var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, Roboto));font-size:var(--md-sys-typescale-body-medium-size, 0.875rem);font-weight:var(--md-sys-typescale-body-medium-weight, var(--md-ref-typeface-weight-regular, 400));line-height:var(--md-sys-typescale-body-medium-line-height, 1.25rem)}[name=trailing-supporting-text]{color:var(--md-sys-color-on-surface-variant, #49454f);font-family:var(--md-sys-typescale-label-small-font, var(--md-ref-typeface-plain, Roboto));font-size:var(--md-sys-typescale-label-small-size, 0.6875rem);font-weight:var(--md-sys-typescale-label-small-weight, var(--md-ref-typeface-weight-medium, 500));line-height:var(--md-sys-typescale-label-small-line-height, 1rem)}[name=container]::slotted(*){inset:0;position:absolute}.default-slot{display:inline}.default-slot,.text ::slotted(*){overflow:hidden;text-overflow:ellipsis}.text{display:flex;flex:1;flex-direction:column;overflow:hidden}
|
|
3698
3698
|
`;
|
|
3699
3699
|
|
|
3700
3700
|
/**
|
|
@@ -3762,7 +3762,7 @@ const styles$9 = i$8`:host{color:var(--md-sys-color-on-surface, #1d1b20);font-fa
|
|
|
3762
3762
|
* @suppress {visibility}
|
|
3763
3763
|
*/
|
|
3764
3764
|
let MdItem = class MdItem extends Item {};
|
|
3765
|
-
MdItem.styles = [styles$
|
|
3765
|
+
MdItem.styles = [styles$b];
|
|
3766
3766
|
MdItem = __decorate([t$1('md-item')], MdItem);
|
|
3767
3767
|
|
|
3768
3768
|
/**
|
|
@@ -3963,7 +3963,7 @@ __decorate([e$5('.list-item')], ListItemEl.prototype, "listItemRoot", void 0);
|
|
|
3963
3963
|
* SPDX-License-Identifier: Apache-2.0
|
|
3964
3964
|
*/
|
|
3965
3965
|
// Generated stylesheet for ./list/internal/listitem/list-item-styles.css.
|
|
3966
|
-
const styles$
|
|
3966
|
+
const styles$a = i$8`:host{display:flex;-webkit-tap-highlight-color:rgba(0,0,0,0);--md-ripple-hover-color: var(--md-list-item-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-hover-opacity: var(--md-list-item-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-list-item-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-pressed-opacity: var(--md-list-item-pressed-state-layer-opacity, 0.12)}:host(:is([type=button]:not([disabled]),[type=link])){cursor:pointer}md-focus-ring{z-index:1;--md-focus-ring-shape: 8px}a,button,li{background:none;border:none;cursor:inherit;padding:0;margin:0;text-align:unset;text-decoration:none}.list-item{border-radius:inherit;display:flex;flex:1;max-width:inherit;min-width:inherit;outline:none;-webkit-tap-highlight-color:rgba(0,0,0,0);width:100%}.list-item.interactive{cursor:pointer}.list-item.disabled{opacity:var(--md-list-item-disabled-opacity, 0.3);pointer-events:none}[slot=container]{pointer-events:none}md-ripple{border-radius:inherit}md-item{border-radius:inherit;flex:1;height:100%;color:var(--md-list-item-label-text-color, var(--md-sys-color-on-surface, #1d1b20));font-family:var(--md-list-item-label-text-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));font-size:var(--md-list-item-label-text-size, var(--md-sys-typescale-body-large-size, 1rem));line-height:var(--md-list-item-label-text-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));font-weight:var(--md-list-item-label-text-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));min-height:var(--md-list-item-one-line-container-height, 56px);padding-top:var(--md-list-item-top-space, 12px);padding-bottom:var(--md-list-item-bottom-space, 12px);padding-inline-start:var(--md-list-item-leading-space, 16px);padding-inline-end:var(--md-list-item-trailing-space, 16px)}md-item[multiline]{min-height:var(--md-list-item-two-line-container-height, 72px)}[slot=supporting-text]{color:var(--md-list-item-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));font-family:var(--md-list-item-supporting-text-font, var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, Roboto)));font-size:var(--md-list-item-supporting-text-size, var(--md-sys-typescale-body-medium-size, 0.875rem));line-height:var(--md-list-item-supporting-text-line-height, var(--md-sys-typescale-body-medium-line-height, 1.25rem));font-weight:var(--md-list-item-supporting-text-weight, var(--md-sys-typescale-body-medium-weight, var(--md-ref-typeface-weight-regular, 400)))}[slot=trailing-supporting-text]{color:var(--md-list-item-trailing-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));font-family:var(--md-list-item-trailing-supporting-text-font, var(--md-sys-typescale-label-small-font, var(--md-ref-typeface-plain, Roboto)));font-size:var(--md-list-item-trailing-supporting-text-size, var(--md-sys-typescale-label-small-size, 0.6875rem));line-height:var(--md-list-item-trailing-supporting-text-line-height, var(--md-sys-typescale-label-small-line-height, 1rem));font-weight:var(--md-list-item-trailing-supporting-text-weight, var(--md-sys-typescale-label-small-weight, var(--md-ref-typeface-weight-medium, 500)))}:is([slot=start],[slot=end])::slotted(*){fill:currentColor}[slot=start]{color:var(--md-list-item-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f))}[slot=end]{color:var(--md-list-item-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f))}@media(forced-colors: active){.disabled slot{color:GrayText}.list-item.disabled{color:GrayText;opacity:1}}
|
|
3967
3967
|
`;
|
|
3968
3968
|
|
|
3969
3969
|
/**
|
|
@@ -4010,7 +4010,7 @@ const styles$8 = i$8`:host{display:flex;-webkit-tap-highlight-color:rgba(0,0,0,0
|
|
|
4010
4010
|
* @suppress {visibility}
|
|
4011
4011
|
*/
|
|
4012
4012
|
let MdListItem = class MdListItem extends ListItemEl {};
|
|
4013
|
-
MdListItem.styles = [styles$
|
|
4013
|
+
MdListItem.styles = [styles$a];
|
|
4014
4014
|
MdListItem = __decorate([t$1('md-list-item')], MdListItem);
|
|
4015
4015
|
|
|
4016
4016
|
/**
|
|
@@ -4020,18 +4020,18 @@ MdListItem = __decorate([t$1('md-list-item')], MdListItem);
|
|
|
4020
4020
|
*/
|
|
4021
4021
|
const showLogLevelDialog = async client => {
|
|
4022
4022
|
var _document$querySelect;
|
|
4023
|
-
await import('./log-level-dialog-
|
|
4023
|
+
await import('./log-level-dialog-Bc32kZVw.js');
|
|
4024
4024
|
const dialog = document.createElement("log-level-dialog");
|
|
4025
4025
|
dialog.client = client;
|
|
4026
4026
|
(_document$querySelect = document.querySelector("matter-dashboard-app")) === null || _document$querySelect === void 0 || _document$querySelect.renderRoot.appendChild(dialog);
|
|
4027
4027
|
};
|
|
4028
4028
|
|
|
4029
|
-
var __defProp$
|
|
4030
|
-
var __getOwnPropDesc$
|
|
4031
|
-
var __decorateClass$
|
|
4032
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$
|
|
4029
|
+
var __defProp$e = Object.defineProperty;
|
|
4030
|
+
var __getOwnPropDesc$h = Object.getOwnPropertyDescriptor;
|
|
4031
|
+
var __decorateClass$j = (decorators, target, key, kind) => {
|
|
4032
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$h(target, key) : target;
|
|
4033
4033
|
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
4034
|
-
if (kind && result) __defProp$
|
|
4034
|
+
if (kind && result) __defProp$e(target, key, result);
|
|
4035
4035
|
return result;
|
|
4036
4036
|
};
|
|
4037
4037
|
let DashboardHeader = class extends i$5 {
|
|
@@ -4218,18 +4218,18 @@ DashboardHeader.styles = i$8`
|
|
|
4218
4218
|
}
|
|
4219
4219
|
}
|
|
4220
4220
|
`;
|
|
4221
|
-
__decorateClass$
|
|
4222
|
-
__decorateClass$
|
|
4223
|
-
__decorateClass$
|
|
4224
|
-
__decorateClass$
|
|
4221
|
+
__decorateClass$j([n$2()], DashboardHeader.prototype, "backButton", 2);
|
|
4222
|
+
__decorateClass$j([n$2()], DashboardHeader.prototype, "actions", 2);
|
|
4223
|
+
__decorateClass$j([n$2()], DashboardHeader.prototype, "activeView", 2);
|
|
4224
|
+
__decorateClass$j([n$2({
|
|
4225
4225
|
type: Boolean
|
|
4226
4226
|
})], DashboardHeader.prototype, "hasThreadDevices", 2);
|
|
4227
|
-
__decorateClass$
|
|
4227
|
+
__decorateClass$j([n$2({
|
|
4228
4228
|
type: Boolean
|
|
4229
4229
|
})], DashboardHeader.prototype, "hasWifiDevices", 2);
|
|
4230
|
-
__decorateClass$
|
|
4231
|
-
__decorateClass$
|
|
4232
|
-
DashboardHeader = __decorateClass$
|
|
4230
|
+
__decorateClass$j([r$2()], DashboardHeader.prototype, "_themePreference", 2);
|
|
4231
|
+
__decorateClass$j([r$2()], DashboardHeader.prototype, "_effectiveTheme", 2);
|
|
4232
|
+
DashboardHeader = __decorateClass$j([t$1("dashboard-header")], DashboardHeader);
|
|
4233
4233
|
|
|
4234
4234
|
/**
|
|
4235
4235
|
* @license
|
|
@@ -15674,7 +15674,7 @@ const clusters = {
|
|
|
15674
15674
|
* SPDX-License-Identifier: Apache-2.0
|
|
15675
15675
|
*/
|
|
15676
15676
|
const showDialogBox = async (type, dialogParams) => {
|
|
15677
|
-
await import('./dialog-box-
|
|
15677
|
+
await import('./dialog-box-COpDD8i7.js');
|
|
15678
15678
|
return new Promise(resolve => {
|
|
15679
15679
|
const dialog = document.createElement("dialog-box");
|
|
15680
15680
|
dialog.params = dialogParams;
|
|
@@ -15712,7 +15712,7 @@ class Elevation extends i$5 {
|
|
|
15712
15712
|
* SPDX-License-Identifier: Apache-2.0
|
|
15713
15713
|
*/
|
|
15714
15714
|
// Generated stylesheet for ./elevation/internal/elevation-styles.css.
|
|
15715
|
-
const styles$
|
|
15715
|
+
const styles$9 = i$8`:host,.shadow,.shadow::before,.shadow::after{border-radius:inherit;inset:0;position:absolute;transition-duration:inherit;transition-property:inherit;transition-timing-function:inherit}:host{display:flex;pointer-events:none;transition-property:box-shadow,opacity}.shadow::before,.shadow::after{content:"";transition-property:box-shadow,opacity;--_level: var(--md-elevation-level, 0);--_shadow-color: var(--md-elevation-shadow-color, var(--md-sys-color-shadow, #000))}.shadow::before{box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 3,1) + 2*clamp(0,var(--_level) - 4,1))) calc(1px*(2*clamp(0,var(--_level),1) + clamp(0,var(--_level) - 2,1) + clamp(0,var(--_level) - 4,1))) 0px var(--_shadow-color);opacity:.3}.shadow::after{box-shadow:0px calc(1px*(clamp(0,var(--_level),1) + clamp(0,var(--_level) - 1,1) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(3*clamp(0,var(--_level),2) + 2*clamp(0,var(--_level) - 2,3))) calc(1px*(clamp(0,var(--_level),4) + 2*clamp(0,var(--_level) - 4,1))) var(--_shadow-color);opacity:.15}
|
|
15716
15716
|
`;
|
|
15717
15717
|
|
|
15718
15718
|
/**
|
|
@@ -15729,7 +15729,7 @@ const styles$7 = i$8`:host,.shadow,.shadow::before,.shadow::after{border-radius:
|
|
|
15729
15729
|
* @suppress {visibility}
|
|
15730
15730
|
*/
|
|
15731
15731
|
let MdElevation = class MdElevation extends Elevation {};
|
|
15732
|
-
MdElevation.styles = [styles$
|
|
15732
|
+
MdElevation.styles = [styles$9];
|
|
15733
15733
|
MdElevation = __decorate([t$1('md-elevation')], MdElevation);
|
|
15734
15734
|
|
|
15735
15735
|
/**
|
|
@@ -15752,7 +15752,7 @@ class FilledButton extends Button {
|
|
|
15752
15752
|
* SPDX-License-Identifier: Apache-2.0
|
|
15753
15753
|
*/
|
|
15754
15754
|
// Generated stylesheet for ./button/internal/filled-styles.css.
|
|
15755
|
-
const styles$
|
|
15755
|
+
const styles$8 = i$8`:host{--_container-color: var(--md-filled-button-container-color, var(--md-sys-color-primary, #6750a4));--_container-elevation: var(--md-filled-button-container-elevation, 0);--_container-height: var(--md-filled-button-container-height, 40px);--_container-shadow-color: var(--md-filled-button-container-shadow-color, var(--md-sys-color-shadow, #000));--_disabled-container-color: var(--md-filled-button-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-container-elevation: var(--md-filled-button-disabled-container-elevation, 0);--_disabled-container-opacity: var(--md-filled-button-disabled-container-opacity, 0.12);--_disabled-label-text-color: var(--md-filled-button-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-filled-button-disabled-label-text-opacity, 0.38);--_focus-container-elevation: var(--md-filled-button-focus-container-elevation, 0);--_focus-label-text-color: var(--md-filled-button-focus-label-text-color, var(--md-sys-color-on-primary, #fff));--_hover-container-elevation: var(--md-filled-button-hover-container-elevation, 1);--_hover-label-text-color: var(--md-filled-button-hover-label-text-color, var(--md-sys-color-on-primary, #fff));--_hover-state-layer-color: var(--md-filled-button-hover-state-layer-color, var(--md-sys-color-on-primary, #fff));--_hover-state-layer-opacity: var(--md-filled-button-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-filled-button-label-text-color, var(--md-sys-color-on-primary, #fff));--_label-text-font: var(--md-filled-button-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-filled-button-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-filled-button-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));--_label-text-weight: var(--md-filled-button-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_pressed-container-elevation: var(--md-filled-button-pressed-container-elevation, 0);--_pressed-label-text-color: var(--md-filled-button-pressed-label-text-color, var(--md-sys-color-on-primary, #fff));--_pressed-state-layer-color: var(--md-filled-button-pressed-state-layer-color, var(--md-sys-color-on-primary, #fff));--_pressed-state-layer-opacity: var(--md-filled-button-pressed-state-layer-opacity, 0.12);--_disabled-icon-color: var(--md-filled-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-filled-button-disabled-icon-opacity, 0.38);--_focus-icon-color: var(--md-filled-button-focus-icon-color, var(--md-sys-color-on-primary, #fff));--_hover-icon-color: var(--md-filled-button-hover-icon-color, var(--md-sys-color-on-primary, #fff));--_icon-color: var(--md-filled-button-icon-color, var(--md-sys-color-on-primary, #fff));--_icon-size: var(--md-filled-button-icon-size, 18px);--_pressed-icon-color: var(--md-filled-button-pressed-icon-color, var(--md-sys-color-on-primary, #fff));--_container-shape-start-start: var(--md-filled-button-container-shape-start-start, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-filled-button-container-shape-start-end, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-filled-button-container-shape-end-end, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-filled-button-container-shape-end-start, var(--md-filled-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_leading-space: var(--md-filled-button-leading-space, 24px);--_trailing-space: var(--md-filled-button-trailing-space, 24px);--_with-leading-icon-leading-space: var(--md-filled-button-with-leading-icon-leading-space, 16px);--_with-leading-icon-trailing-space: var(--md-filled-button-with-leading-icon-trailing-space, 24px);--_with-trailing-icon-leading-space: var(--md-filled-button-with-trailing-icon-leading-space, 24px);--_with-trailing-icon-trailing-space: var(--md-filled-button-with-trailing-icon-trailing-space, 16px)}
|
|
15756
15756
|
`;
|
|
15757
15757
|
|
|
15758
15758
|
/**
|
|
@@ -15761,7 +15761,7 @@ const styles$6 = i$8`:host{--_container-color: var(--md-filled-button-container-
|
|
|
15761
15761
|
* SPDX-License-Identifier: Apache-2.0
|
|
15762
15762
|
*/
|
|
15763
15763
|
// Generated stylesheet for ./button/internal/shared-elevation-styles.css.
|
|
15764
|
-
const styles$
|
|
15764
|
+
const styles$7 = i$8`md-elevation{transition-duration:280ms}:host(:is([disabled],[soft-disabled])) md-elevation{transition:none}md-elevation{--md-elevation-level: var(--_container-elevation);--md-elevation-shadow-color: var(--_container-shadow-color)}:host(:focus-within) md-elevation{--md-elevation-level: var(--_focus-container-elevation)}:host(:hover) md-elevation{--md-elevation-level: var(--_hover-container-elevation)}:host(:active) md-elevation{--md-elevation-level: var(--_pressed-container-elevation)}:host(:is([disabled],[soft-disabled])) md-elevation{--md-elevation-level: var(--_disabled-container-elevation)}
|
|
15765
15765
|
`;
|
|
15766
15766
|
|
|
15767
15767
|
/**
|
|
@@ -15790,7 +15790,7 @@ const styles$5 = i$8`md-elevation{transition-duration:280ms}:host(:is([disabled]
|
|
|
15790
15790
|
* @suppress {visibility}
|
|
15791
15791
|
*/
|
|
15792
15792
|
let MdFilledButton = class MdFilledButton extends FilledButton {};
|
|
15793
|
-
MdFilledButton.styles = [styles$
|
|
15793
|
+
MdFilledButton.styles = [styles$g, styles$7, styles$8];
|
|
15794
15794
|
MdFilledButton = __decorate([t$1('md-filled-button')], MdFilledButton);
|
|
15795
15795
|
|
|
15796
15796
|
/**
|
|
@@ -15809,7 +15809,7 @@ class TextButton extends Button {}
|
|
|
15809
15809
|
* SPDX-License-Identifier: Apache-2.0
|
|
15810
15810
|
*/
|
|
15811
15811
|
// Generated stylesheet for ./button/internal/text-styles.css.
|
|
15812
|
-
const styles$
|
|
15812
|
+
const styles$6 = i$8`:host{--_container-height: var(--md-text-button-container-height, 40px);--_disabled-label-text-color: var(--md-text-button-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-text-button-disabled-label-text-opacity, 0.38);--_focus-label-text-color: var(--md-text-button-focus-label-text-color, var(--md-sys-color-primary, #6750a4));--_hover-label-text-color: var(--md-text-button-hover-label-text-color, var(--md-sys-color-primary, #6750a4));--_hover-state-layer-color: var(--md-text-button-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--_hover-state-layer-opacity: var(--md-text-button-hover-state-layer-opacity, 0.08);--_label-text-color: var(--md-text-button-label-text-color, var(--md-sys-color-primary, #6750a4));--_label-text-font: var(--md-text-button-label-text-font, var(--md-sys-typescale-label-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-text-button-label-text-line-height, var(--md-sys-typescale-label-large-line-height, 1.25rem));--_label-text-size: var(--md-text-button-label-text-size, var(--md-sys-typescale-label-large-size, 0.875rem));--_label-text-weight: var(--md-text-button-label-text-weight, var(--md-sys-typescale-label-large-weight, var(--md-ref-typeface-weight-medium, 500)));--_pressed-label-text-color: var(--md-text-button-pressed-label-text-color, var(--md-sys-color-primary, #6750a4));--_pressed-state-layer-color: var(--md-text-button-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--_pressed-state-layer-opacity: var(--md-text-button-pressed-state-layer-opacity, 0.12);--_disabled-icon-color: var(--md-text-button-disabled-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-icon-opacity: var(--md-text-button-disabled-icon-opacity, 0.38);--_focus-icon-color: var(--md-text-button-focus-icon-color, var(--md-sys-color-primary, #6750a4));--_hover-icon-color: var(--md-text-button-hover-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-color: var(--md-text-button-icon-color, var(--md-sys-color-primary, #6750a4));--_icon-size: var(--md-text-button-icon-size, 18px);--_pressed-icon-color: var(--md-text-button-pressed-icon-color, var(--md-sys-color-primary, #6750a4));--_container-shape-start-start: var(--md-text-button-container-shape-start-start, var(--md-text-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-start-end: var(--md-text-button-container-shape-start-end, var(--md-text-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-end: var(--md-text-button-container-shape-end-end, var(--md-text-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_container-shape-end-start: var(--md-text-button-container-shape-end-start, var(--md-text-button-container-shape, var(--md-sys-shape-corner-full, 9999px)));--_leading-space: var(--md-text-button-leading-space, 12px);--_trailing-space: var(--md-text-button-trailing-space, 12px);--_with-leading-icon-leading-space: var(--md-text-button-with-leading-icon-leading-space, 12px);--_with-leading-icon-trailing-space: var(--md-text-button-with-leading-icon-trailing-space, 16px);--_with-trailing-icon-leading-space: var(--md-text-button-with-trailing-icon-leading-space, 16px);--_with-trailing-icon-trailing-space: var(--md-text-button-with-trailing-icon-trailing-space, 12px);--_container-color: none;--_disabled-container-color: none;--_disabled-container-opacity: 0}
|
|
15813
15813
|
`;
|
|
15814
15814
|
|
|
15815
15815
|
/**
|
|
@@ -15838,7 +15838,7 @@ const styles$4 = i$8`:host{--_container-height: var(--md-text-button-container-h
|
|
|
15838
15838
|
* @suppress {visibility}
|
|
15839
15839
|
*/
|
|
15840
15840
|
let MdTextButton = class MdTextButton extends TextButton {};
|
|
15841
|
-
MdTextButton.styles = [styles$
|
|
15841
|
+
MdTextButton.styles = [styles$g, styles$6];
|
|
15842
15842
|
MdTextButton = __decorate([t$1('md-text-button')], MdTextButton);
|
|
15843
15843
|
|
|
15844
15844
|
/**
|
|
@@ -15848,7 +15848,7 @@ MdTextButton = __decorate([t$1('md-text-button')], MdTextButton);
|
|
|
15848
15848
|
*/
|
|
15849
15849
|
const showNodeBindingDialog = async (client, node, endpoint) => {
|
|
15850
15850
|
var _document$querySelect;
|
|
15851
|
-
await import('./node-binding-dialog-
|
|
15851
|
+
await import('./node-binding-dialog-C8fqOJiB.js');
|
|
15852
15852
|
const dialog = document.createElement("node-binding-dialog");
|
|
15853
15853
|
dialog.client = client;
|
|
15854
15854
|
dialog.node = node;
|
|
@@ -15913,13 +15913,31 @@ function formatNodeAddress(fabricIndex, nodeId) {
|
|
|
15913
15913
|
const fabricPart = fabricIndex !== void 0 ? fabricIndex : "?";
|
|
15914
15914
|
return `@${fabricPart}:${nodeId.toString(16)}`;
|
|
15915
15915
|
}
|
|
15916
|
+
function getEffectiveFabricIndex(serverFabricIndex, isTestNode) {
|
|
15917
|
+
return isTestNode || serverFabricIndex === void 0 ? void 0 : serverFabricIndex;
|
|
15918
|
+
}
|
|
15919
|
+
function formatNodeAddressFromAny(fabricIndex, nodeId) {
|
|
15920
|
+
let numericId;
|
|
15921
|
+
if (typeof nodeId === "bigint") {
|
|
15922
|
+
numericId = nodeId;
|
|
15923
|
+
} else if (typeof nodeId === "number") {
|
|
15924
|
+
numericId = BigInt(nodeId);
|
|
15925
|
+
} else {
|
|
15926
|
+
try {
|
|
15927
|
+
numericId = BigInt(nodeId);
|
|
15928
|
+
} catch {
|
|
15929
|
+
return "";
|
|
15930
|
+
}
|
|
15931
|
+
}
|
|
15932
|
+
return formatNodeAddress(fabricIndex, numericId);
|
|
15933
|
+
}
|
|
15916
15934
|
|
|
15917
|
-
var __defProp$
|
|
15918
|
-
var __getOwnPropDesc$
|
|
15919
|
-
var __decorateClass$
|
|
15920
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$
|
|
15935
|
+
var __defProp$d = Object.defineProperty;
|
|
15936
|
+
var __getOwnPropDesc$g = Object.getOwnPropertyDescriptor;
|
|
15937
|
+
var __decorateClass$i = (decorators, target, key, kind) => {
|
|
15938
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$g(target, key) : target;
|
|
15921
15939
|
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
15922
|
-
if (kind && result) __defProp$
|
|
15940
|
+
if (kind && result) __defProp$d(target, key, result);
|
|
15923
15941
|
return result;
|
|
15924
15942
|
};
|
|
15925
15943
|
function getUniqueClusters(node, endpoint) {
|
|
@@ -15948,9 +15966,11 @@ let MatterEndpointView = class extends i$5 {
|
|
|
15948
15966
|
<button @click=${this._goBack}>Back</button>
|
|
15949
15967
|
`;
|
|
15950
15968
|
}
|
|
15969
|
+
const fabricIndex = getEffectiveFabricIndex(this.client.serverInfo.fabric_index, isTestNodeId(this.node.node_id));
|
|
15970
|
+
const nodeHex = formatNodeAddress(fabricIndex, this.node.node_id);
|
|
15951
15971
|
return b`
|
|
15952
15972
|
<dashboard-header
|
|
15953
|
-
.title=${`Node ${this.node.node_id} | Endpoint ${this.endpoint}`}
|
|
15973
|
+
.title=${`Node ${this.node.node_id} ${nodeHex} | Endpoint ${this.endpoint}`}
|
|
15954
15974
|
.backButton=${`#node/${this.node.node_id}`}
|
|
15955
15975
|
.client=${this.client}
|
|
15956
15976
|
></dashboard-header>
|
|
@@ -16032,9 +16052,9 @@ MatterEndpointView.styles = i$8`
|
|
|
16032
16052
|
font-size: 0.8em;
|
|
16033
16053
|
}
|
|
16034
16054
|
`;
|
|
16035
|
-
__decorateClass$
|
|
16036
|
-
__decorateClass$
|
|
16037
|
-
MatterEndpointView = __decorateClass$
|
|
16055
|
+
__decorateClass$i([n$2()], MatterEndpointView.prototype, "node", 2);
|
|
16056
|
+
__decorateClass$i([n$2()], MatterEndpointView.prototype, "endpoint", 2);
|
|
16057
|
+
MatterEndpointView = __decorateClass$i([t$1("matter-endpoint-view")], MatterEndpointView);
|
|
16038
16058
|
|
|
16039
16059
|
/**
|
|
16040
16060
|
* @license
|
|
@@ -16043,12 +16063,12 @@ MatterEndpointView = __decorateClass$h([t$1("matter-endpoint-view")], MatterEndp
|
|
|
16043
16063
|
*/
|
|
16044
16064
|
const bindingContext = n$6("binding");
|
|
16045
16065
|
|
|
16046
|
-
var __defProp$
|
|
16047
|
-
var __getOwnPropDesc$
|
|
16048
|
-
var __decorateClass$
|
|
16049
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$
|
|
16066
|
+
var __defProp$c = Object.defineProperty;
|
|
16067
|
+
var __getOwnPropDesc$f = Object.getOwnPropertyDescriptor;
|
|
16068
|
+
var __decorateClass$h = (decorators, target, key, kind) => {
|
|
16069
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$f(target, key) : target;
|
|
16050
16070
|
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
16051
|
-
if (kind && result) __defProp$
|
|
16071
|
+
if (kind && result) __defProp$c(target, key, result);
|
|
16052
16072
|
return result;
|
|
16053
16073
|
};
|
|
16054
16074
|
const UPDATE_STATE_LABELS = {
|
|
@@ -16090,7 +16110,7 @@ let NodeDetails = class extends i$5 {
|
|
|
16090
16110
|
<md-list>
|
|
16091
16111
|
<md-list-item>
|
|
16092
16112
|
<div slot="headline">
|
|
16093
|
-
<b
|
|
16113
|
+
<b>${this.node.nodeLabel || "Node Info"}</b>
|
|
16094
16114
|
${this.node.available ? A : b`<span class="status">OFFLINE</span>`}
|
|
16095
16115
|
</div>
|
|
16096
16116
|
</md-list-item>
|
|
@@ -16279,14 +16299,14 @@ NodeDetails.styles = i$8`
|
|
|
16279
16299
|
font-size: 0.8em;
|
|
16280
16300
|
}
|
|
16281
16301
|
`;
|
|
16282
|
-
__decorateClass$
|
|
16283
|
-
__decorateClass$
|
|
16284
|
-
__decorateClass$
|
|
16302
|
+
__decorateClass$h([n$2()], NodeDetails.prototype, "node", 2);
|
|
16303
|
+
__decorateClass$h([r$2()], NodeDetails.prototype, "_updateInitiated", 2);
|
|
16304
|
+
__decorateClass$h([c$4({
|
|
16285
16305
|
context: bindingContext
|
|
16286
16306
|
}), n$2({
|
|
16287
16307
|
attribute: false
|
|
16288
16308
|
})], NodeDetails.prototype, "endpoint", 2);
|
|
16289
|
-
NodeDetails = __decorateClass$
|
|
16309
|
+
NodeDetails = __decorateClass$h([t$1("node-details")], NodeDetails);
|
|
16290
16310
|
|
|
16291
16311
|
/**
|
|
16292
16312
|
* @license
|
|
@@ -16302,11 +16322,11 @@ function getClusterCommandsTag(clusterId) {
|
|
|
16302
16322
|
}
|
|
16303
16323
|
|
|
16304
16324
|
var _staticBlock$1;
|
|
16305
|
-
var __defProp$
|
|
16306
|
-
var __decorateClass$
|
|
16325
|
+
var __defProp$b = Object.defineProperty;
|
|
16326
|
+
var __decorateClass$g = (decorators, target, key, kind) => {
|
|
16307
16327
|
var result = void 0 ;
|
|
16308
16328
|
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (decorator(target, key, result) ) || result;
|
|
16309
|
-
if (result) __defProp$
|
|
16329
|
+
if (result) __defProp$b(target, key, result);
|
|
16310
16330
|
return result;
|
|
16311
16331
|
};
|
|
16312
16332
|
class BaseClusterCommands extends i$5 {
|
|
@@ -16404,16 +16424,16 @@ class BaseClusterCommands extends i$5 {
|
|
|
16404
16424
|
`;
|
|
16405
16425
|
}
|
|
16406
16426
|
_staticBlock$1();
|
|
16407
|
-
__decorateClass$
|
|
16427
|
+
__decorateClass$g([n$2({
|
|
16408
16428
|
attribute: false
|
|
16409
16429
|
})], BaseClusterCommands.prototype, "client");
|
|
16410
|
-
__decorateClass$
|
|
16430
|
+
__decorateClass$g([n$2({
|
|
16411
16431
|
attribute: false
|
|
16412
16432
|
})], BaseClusterCommands.prototype, "node");
|
|
16413
|
-
__decorateClass$
|
|
16433
|
+
__decorateClass$g([n$2({
|
|
16414
16434
|
type: Number
|
|
16415
16435
|
})], BaseClusterCommands.prototype, "endpoint");
|
|
16416
|
-
__decorateClass$
|
|
16436
|
+
__decorateClass$g([n$2({
|
|
16417
16437
|
type: Number
|
|
16418
16438
|
})], BaseClusterCommands.prototype, "cluster");
|
|
16419
16439
|
|
|
@@ -16803,7 +16823,7 @@ class OutlinedField extends Field {
|
|
|
16803
16823
|
* SPDX-License-Identifier: Apache-2.0
|
|
16804
16824
|
*/
|
|
16805
16825
|
// Generated stylesheet for ./field/internal/outlined-styles.css.
|
|
16806
|
-
const styles$3 = i$8`@layer styles{:host{--_bottom-space: var(--md-outlined-field-bottom-space, 16px);--_content-color: var(--md-outlined-field-content-color, var(--md-sys-color-on-surface, #1d1b20));--_content-font: var(--md-outlined-field-content-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_content-line-height: var(--md-outlined-field-content-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_content-size: var(--md-outlined-field-content-size, var(--md-sys-typescale-body-large-size, 1rem));--_content-space: var(--md-outlined-field-content-space, 16px);--_content-weight: var(--md-outlined-field-content-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_disabled-content-color: var(--md-outlined-field-disabled-content-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-content-opacity: var(--md-outlined-field-disabled-content-opacity, 0.38);--_disabled-label-text-color: var(--md-outlined-field-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-outlined-field-disabled-label-text-opacity, 0.38);--_disabled-leading-content-color: var(--md-outlined-field-disabled-leading-content-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-content-opacity: var(--md-outlined-field-disabled-leading-content-opacity, 0.38);--_disabled-outline-color: var(--md-outlined-field-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-outlined-field-disabled-outline-opacity, 0.12);--_disabled-outline-width: var(--md-outlined-field-disabled-outline-width, 1px);--_disabled-supporting-text-color: var(--md-outlined-field-disabled-supporting-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-supporting-text-opacity: var(--md-outlined-field-disabled-supporting-text-opacity, 0.38);--_disabled-trailing-content-color: var(--md-outlined-field-disabled-trailing-content-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-content-opacity: var(--md-outlined-field-disabled-trailing-content-opacity, 0.38);--_error-content-color: var(--md-outlined-field-error-content-color, var(--md-sys-color-on-surface, #1d1b20));--_error-focus-content-color: var(--md-outlined-field-error-focus-content-color, var(--md-sys-color-on-surface, #1d1b20));--_error-focus-label-text-color: var(--md-outlined-field-error-focus-label-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-leading-content-color: var(--md-outlined-field-error-focus-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-focus-outline-color: var(--md-outlined-field-error-focus-outline-color, var(--md-sys-color-error, #b3261e));--_error-focus-supporting-text-color: var(--md-outlined-field-error-focus-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-trailing-content-color: var(--md-outlined-field-error-focus-trailing-content-color, var(--md-sys-color-error, #b3261e));--_error-hover-content-color: var(--md-outlined-field-error-hover-content-color, var(--md-sys-color-on-surface, #1d1b20));--_error-hover-label-text-color: var(--md-outlined-field-error-hover-label-text-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-leading-content-color: var(--md-outlined-field-error-hover-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-hover-outline-color: var(--md-outlined-field-error-hover-outline-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-supporting-text-color: var(--md-outlined-field-error-hover-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-hover-trailing-content-color: var(--md-outlined-field-error-hover-trailing-content-color, var(--md-sys-color-on-error-container, #410e0b));--_error-label-text-color: var(--md-outlined-field-error-label-text-color, var(--md-sys-color-error, #b3261e));--_error-leading-content-color: var(--md-outlined-field-error-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-outline-color: var(--md-outlined-field-error-outline-color, var(--md-sys-color-error, #b3261e));--_error-supporting-text-color: var(--md-outlined-field-error-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-trailing-content-color: var(--md-outlined-field-error-trailing-content-color, var(--md-sys-color-error, #b3261e));--_focus-content-color: var(--md-outlined-field-focus-content-color, var(--md-sys-color-on-surface, #1d1b20));--_focus-label-text-color: var(--md-outlined-field-focus-label-text-color, var(--md-sys-color-primary, #6750a4));--_focus-leading-content-color: var(--md-outlined-field-focus-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-outline-color: var(--md-outlined-field-focus-outline-color, var(--md-sys-color-primary, #6750a4));--_focus-outline-width: var(--md-outlined-field-focus-outline-width, 3px);--_focus-supporting-text-color: var(--md-outlined-field-focus-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-trailing-content-color: var(--md-outlined-field-focus-trailing-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-content-color: var(--md-outlined-field-hover-content-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-label-text-color: var(--md-outlined-field-hover-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-leading-content-color: var(--md-outlined-field-hover-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-outline-color: var(--md-outlined-field-hover-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-outline-width: var(--md-outlined-field-hover-outline-width, 1px);--_hover-supporting-text-color: var(--md-outlined-field-hover-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-content-color: var(--md-outlined-field-hover-trailing-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_label-text-color: var(--md-outlined-field-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_label-text-font: var(--md-outlined-field-label-text-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-outlined-field-label-text-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_label-text-padding-bottom: var(--md-outlined-field-label-text-padding-bottom, 8px);--_label-text-populated-line-height: var(--md-outlined-field-label-text-populated-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_label-text-populated-size: var(--md-outlined-field-label-text-populated-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_label-text-size: var(--md-outlined-field-label-text-size, var(--md-sys-typescale-body-large-size, 1rem));--_label-text-weight: var(--md-outlined-field-label-text-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_leading-content-color: var(--md-outlined-field-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_leading-space: var(--md-outlined-field-leading-space, 16px);--_outline-color: var(--md-outlined-field-outline-color, var(--md-sys-color-outline, #79747e));--_outline-label-padding: var(--md-outlined-field-outline-label-padding, 4px);--_outline-width: var(--md-outlined-field-outline-width, 1px);--_supporting-text-color: var(--md-outlined-field-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_supporting-text-font: var(--md-outlined-field-supporting-text-font, var(--md-sys-typescale-body-small-font, var(--md-ref-typeface-plain, Roboto)));--_supporting-text-leading-space: var(--md-outlined-field-supporting-text-leading-space, 16px);--_supporting-text-line-height: var(--md-outlined-field-supporting-text-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_supporting-text-size: var(--md-outlined-field-supporting-text-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_supporting-text-top-space: var(--md-outlined-field-supporting-text-top-space, 4px);--_supporting-text-trailing-space: var(--md-outlined-field-supporting-text-trailing-space, 16px);--_supporting-text-weight: var(--md-outlined-field-supporting-text-weight, var(--md-sys-typescale-body-small-weight, var(--md-ref-typeface-weight-regular, 400)));--_top-space: var(--md-outlined-field-top-space, 16px);--_trailing-content-color: var(--md-outlined-field-trailing-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-space: var(--md-outlined-field-trailing-space, 16px);--_with-leading-content-leading-space: var(--md-outlined-field-with-leading-content-leading-space, 12px);--_with-trailing-content-trailing-space: var(--md-outlined-field-with-trailing-content-trailing-space, 12px);--_container-shape-start-start: var(--md-outlined-field-container-shape-start-start, var(--md-outlined-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-start-end: var(--md-outlined-field-container-shape-start-end, var(--md-outlined-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-end-end: var(--md-outlined-field-container-shape-end-end, var(--md-outlined-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-end-start: var(--md-outlined-field-container-shape-end-start, var(--md-outlined-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)))}.outline{border-color:var(--_outline-color);border-radius:inherit;display:flex;pointer-events:none;height:100%;position:absolute;width:100%;z-index:1}.outline-start::before,.outline-start::after,.outline-panel-inactive::before,.outline-panel-inactive::after,.outline-panel-active::before,.outline-panel-active::after,.outline-end::before,.outline-end::after{border:inherit;content:"";inset:0;position:absolute}.outline-start,.outline-end{border:inherit;border-radius:inherit;box-sizing:border-box;position:relative}.outline-start::before,.outline-start::after,.outline-end::before,.outline-end::after{border-bottom-style:solid;border-top-style:solid}.outline-start::after,.outline-end::after{opacity:0;transition:opacity 150ms cubic-bezier(0.2, 0, 0, 1)}.focused .outline-start::after,.focused .outline-end::after{opacity:1}.outline-start::before,.outline-start::after{border-inline-start-style:solid;border-inline-end-style:none;border-start-start-radius:inherit;border-start-end-radius:0;border-end-start-radius:inherit;border-end-end-radius:0;margin-inline-end:var(--_outline-label-padding)}.outline-end{flex-grow:1;margin-inline-start:calc(-1*var(--_outline-label-padding))}.outline-end::before,.outline-end::after{border-inline-start-style:none;border-inline-end-style:solid;border-start-start-radius:0;border-start-end-radius:inherit;border-end-start-radius:0;border-end-end-radius:inherit}.outline-notch{align-items:flex-start;border:inherit;display:flex;margin-inline-start:calc(-1*var(--_outline-label-padding));margin-inline-end:var(--_outline-label-padding);max-width:calc(100% - var(--_leading-space) - var(--_trailing-space));padding:0 var(--_outline-label-padding);position:relative}.no-label .outline-notch{display:none}.outline-panel-inactive,.outline-panel-active{border:inherit;border-bottom-style:solid;inset:0;position:absolute}.outline-panel-inactive::before,.outline-panel-inactive::after,.outline-panel-active::before,.outline-panel-active::after{border-top-style:solid;border-bottom:none;bottom:auto;transform:scaleX(1);transition:transform 150ms cubic-bezier(0.2, 0, 0, 1)}.outline-panel-inactive::before,.outline-panel-active::before{right:50%;transform-origin:top left}.outline-panel-inactive::after,.outline-panel-active::after{left:50%;transform-origin:top right}.populated .outline-panel-inactive::before,.populated .outline-panel-inactive::after,.populated .outline-panel-active::before,.populated .outline-panel-active::after,.focused .outline-panel-inactive::before,.focused .outline-panel-inactive::after,.focused .outline-panel-active::before,.focused .outline-panel-active::after{transform:scaleX(0)}.outline-panel-active{opacity:0;transition:opacity 150ms cubic-bezier(0.2, 0, 0, 1)}.focused .outline-panel-active{opacity:1}.outline-label{display:flex;max-width:100%;transform:translateY(calc(-100% + var(--_label-text-padding-bottom)))}.outline-start,.field:not(.with-start) .content ::slotted(*){padding-inline-start:max(var(--_leading-space),max(var(--_container-shape-start-start),var(--_container-shape-end-start)) + var(--_outline-label-padding))}.field:not(.with-start) .label-wrapper{margin-inline-start:max(var(--_leading-space),max(var(--_container-shape-start-start),var(--_container-shape-end-start)) + var(--_outline-label-padding))}.field:not(.with-end) .content ::slotted(*){padding-inline-end:max(var(--_trailing-space),max(var(--_container-shape-start-end),var(--_container-shape-end-end)))}.field:not(.with-end) .label-wrapper{margin-inline-end:max(var(--_trailing-space),max(var(--_container-shape-start-end),var(--_container-shape-end-end)))}.outline-start::before,.outline-end::before,.outline-panel-inactive,.outline-panel-inactive::before,.outline-panel-inactive::after{border-width:var(--_outline-width)}:hover .outline{border-color:var(--_hover-outline-color);color:var(--_hover-outline-color)}:hover .outline-start::before,:hover .outline-end::before,:hover .outline-panel-inactive,:hover .outline-panel-inactive::before,:hover .outline-panel-inactive::after{border-width:var(--_hover-outline-width)}.focused .outline{border-color:var(--_focus-outline-color);color:var(--_focus-outline-color)}.outline-start::after,.outline-end::after,.outline-panel-active,.outline-panel-active::before,.outline-panel-active::after{border-width:var(--_focus-outline-width)}.disabled .outline{border-color:var(--_disabled-outline-color);color:var(--_disabled-outline-color)}.disabled .outline-start,.disabled .outline-end,.disabled .outline-panel-inactive{opacity:var(--_disabled-outline-opacity)}.disabled .outline-start::before,.disabled .outline-end::before,.disabled .outline-panel-inactive,.disabled .outline-panel-inactive::before,.disabled .outline-panel-inactive::after{border-width:var(--_disabled-outline-width)}.error .outline{border-color:var(--_error-outline-color);color:var(--_error-outline-color)}.error:hover .outline{border-color:var(--_error-hover-outline-color);color:var(--_error-hover-outline-color)}.error.focused .outline{border-color:var(--_error-focus-outline-color);color:var(--_error-focus-outline-color)}.resizable .container{bottom:var(--_focus-outline-width);inset-inline-end:var(--_focus-outline-width);clip-path:inset(var(--_focus-outline-width) 0 0 var(--_focus-outline-width))}.resizable .container>*{top:var(--_focus-outline-width);inset-inline-start:var(--_focus-outline-width)}.resizable .container:dir(rtl){clip-path:inset(var(--_focus-outline-width) var(--_focus-outline-width) 0 0)}}@layer hcm{@media(forced-colors: active){.disabled .outline{border-color:GrayText;color:GrayText}.disabled :is(.outline-start,.outline-end,.outline-panel-inactive){opacity:1}}}
|
|
16826
|
+
const styles$5 = i$8`@layer styles{:host{--_bottom-space: var(--md-outlined-field-bottom-space, 16px);--_content-color: var(--md-outlined-field-content-color, var(--md-sys-color-on-surface, #1d1b20));--_content-font: var(--md-outlined-field-content-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_content-line-height: var(--md-outlined-field-content-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_content-size: var(--md-outlined-field-content-size, var(--md-sys-typescale-body-large-size, 1rem));--_content-space: var(--md-outlined-field-content-space, 16px);--_content-weight: var(--md-outlined-field-content-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_disabled-content-color: var(--md-outlined-field-disabled-content-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-content-opacity: var(--md-outlined-field-disabled-content-opacity, 0.38);--_disabled-label-text-color: var(--md-outlined-field-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-outlined-field-disabled-label-text-opacity, 0.38);--_disabled-leading-content-color: var(--md-outlined-field-disabled-leading-content-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-content-opacity: var(--md-outlined-field-disabled-leading-content-opacity, 0.38);--_disabled-outline-color: var(--md-outlined-field-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-outlined-field-disabled-outline-opacity, 0.12);--_disabled-outline-width: var(--md-outlined-field-disabled-outline-width, 1px);--_disabled-supporting-text-color: var(--md-outlined-field-disabled-supporting-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-supporting-text-opacity: var(--md-outlined-field-disabled-supporting-text-opacity, 0.38);--_disabled-trailing-content-color: var(--md-outlined-field-disabled-trailing-content-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-content-opacity: var(--md-outlined-field-disabled-trailing-content-opacity, 0.38);--_error-content-color: var(--md-outlined-field-error-content-color, var(--md-sys-color-on-surface, #1d1b20));--_error-focus-content-color: var(--md-outlined-field-error-focus-content-color, var(--md-sys-color-on-surface, #1d1b20));--_error-focus-label-text-color: var(--md-outlined-field-error-focus-label-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-leading-content-color: var(--md-outlined-field-error-focus-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-focus-outline-color: var(--md-outlined-field-error-focus-outline-color, var(--md-sys-color-error, #b3261e));--_error-focus-supporting-text-color: var(--md-outlined-field-error-focus-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-trailing-content-color: var(--md-outlined-field-error-focus-trailing-content-color, var(--md-sys-color-error, #b3261e));--_error-hover-content-color: var(--md-outlined-field-error-hover-content-color, var(--md-sys-color-on-surface, #1d1b20));--_error-hover-label-text-color: var(--md-outlined-field-error-hover-label-text-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-leading-content-color: var(--md-outlined-field-error-hover-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-hover-outline-color: var(--md-outlined-field-error-hover-outline-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-supporting-text-color: var(--md-outlined-field-error-hover-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-hover-trailing-content-color: var(--md-outlined-field-error-hover-trailing-content-color, var(--md-sys-color-on-error-container, #410e0b));--_error-label-text-color: var(--md-outlined-field-error-label-text-color, var(--md-sys-color-error, #b3261e));--_error-leading-content-color: var(--md-outlined-field-error-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-outline-color: var(--md-outlined-field-error-outline-color, var(--md-sys-color-error, #b3261e));--_error-supporting-text-color: var(--md-outlined-field-error-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-trailing-content-color: var(--md-outlined-field-error-trailing-content-color, var(--md-sys-color-error, #b3261e));--_focus-content-color: var(--md-outlined-field-focus-content-color, var(--md-sys-color-on-surface, #1d1b20));--_focus-label-text-color: var(--md-outlined-field-focus-label-text-color, var(--md-sys-color-primary, #6750a4));--_focus-leading-content-color: var(--md-outlined-field-focus-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-outline-color: var(--md-outlined-field-focus-outline-color, var(--md-sys-color-primary, #6750a4));--_focus-outline-width: var(--md-outlined-field-focus-outline-width, 3px);--_focus-supporting-text-color: var(--md-outlined-field-focus-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-trailing-content-color: var(--md-outlined-field-focus-trailing-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-content-color: var(--md-outlined-field-hover-content-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-label-text-color: var(--md-outlined-field-hover-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-leading-content-color: var(--md-outlined-field-hover-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-outline-color: var(--md-outlined-field-hover-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-outline-width: var(--md-outlined-field-hover-outline-width, 1px);--_hover-supporting-text-color: var(--md-outlined-field-hover-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-content-color: var(--md-outlined-field-hover-trailing-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_label-text-color: var(--md-outlined-field-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_label-text-font: var(--md-outlined-field-label-text-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-outlined-field-label-text-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_label-text-padding-bottom: var(--md-outlined-field-label-text-padding-bottom, 8px);--_label-text-populated-line-height: var(--md-outlined-field-label-text-populated-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_label-text-populated-size: var(--md-outlined-field-label-text-populated-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_label-text-size: var(--md-outlined-field-label-text-size, var(--md-sys-typescale-body-large-size, 1rem));--_label-text-weight: var(--md-outlined-field-label-text-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_leading-content-color: var(--md-outlined-field-leading-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_leading-space: var(--md-outlined-field-leading-space, 16px);--_outline-color: var(--md-outlined-field-outline-color, var(--md-sys-color-outline, #79747e));--_outline-label-padding: var(--md-outlined-field-outline-label-padding, 4px);--_outline-width: var(--md-outlined-field-outline-width, 1px);--_supporting-text-color: var(--md-outlined-field-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_supporting-text-font: var(--md-outlined-field-supporting-text-font, var(--md-sys-typescale-body-small-font, var(--md-ref-typeface-plain, Roboto)));--_supporting-text-leading-space: var(--md-outlined-field-supporting-text-leading-space, 16px);--_supporting-text-line-height: var(--md-outlined-field-supporting-text-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_supporting-text-size: var(--md-outlined-field-supporting-text-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_supporting-text-top-space: var(--md-outlined-field-supporting-text-top-space, 4px);--_supporting-text-trailing-space: var(--md-outlined-field-supporting-text-trailing-space, 16px);--_supporting-text-weight: var(--md-outlined-field-supporting-text-weight, var(--md-sys-typescale-body-small-weight, var(--md-ref-typeface-weight-regular, 400)));--_top-space: var(--md-outlined-field-top-space, 16px);--_trailing-content-color: var(--md-outlined-field-trailing-content-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-space: var(--md-outlined-field-trailing-space, 16px);--_with-leading-content-leading-space: var(--md-outlined-field-with-leading-content-leading-space, 12px);--_with-trailing-content-trailing-space: var(--md-outlined-field-with-trailing-content-trailing-space, 12px);--_container-shape-start-start: var(--md-outlined-field-container-shape-start-start, var(--md-outlined-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-start-end: var(--md-outlined-field-container-shape-start-end, var(--md-outlined-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-end-end: var(--md-outlined-field-container-shape-end-end, var(--md-outlined-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-end-start: var(--md-outlined-field-container-shape-end-start, var(--md-outlined-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)))}.outline{border-color:var(--_outline-color);border-radius:inherit;display:flex;pointer-events:none;height:100%;position:absolute;width:100%;z-index:1}.outline-start::before,.outline-start::after,.outline-panel-inactive::before,.outline-panel-inactive::after,.outline-panel-active::before,.outline-panel-active::after,.outline-end::before,.outline-end::after{border:inherit;content:"";inset:0;position:absolute}.outline-start,.outline-end{border:inherit;border-radius:inherit;box-sizing:border-box;position:relative}.outline-start::before,.outline-start::after,.outline-end::before,.outline-end::after{border-bottom-style:solid;border-top-style:solid}.outline-start::after,.outline-end::after{opacity:0;transition:opacity 150ms cubic-bezier(0.2, 0, 0, 1)}.focused .outline-start::after,.focused .outline-end::after{opacity:1}.outline-start::before,.outline-start::after{border-inline-start-style:solid;border-inline-end-style:none;border-start-start-radius:inherit;border-start-end-radius:0;border-end-start-radius:inherit;border-end-end-radius:0;margin-inline-end:var(--_outline-label-padding)}.outline-end{flex-grow:1;margin-inline-start:calc(-1*var(--_outline-label-padding))}.outline-end::before,.outline-end::after{border-inline-start-style:none;border-inline-end-style:solid;border-start-start-radius:0;border-start-end-radius:inherit;border-end-start-radius:0;border-end-end-radius:inherit}.outline-notch{align-items:flex-start;border:inherit;display:flex;margin-inline-start:calc(-1*var(--_outline-label-padding));margin-inline-end:var(--_outline-label-padding);max-width:calc(100% - var(--_leading-space) - var(--_trailing-space));padding:0 var(--_outline-label-padding);position:relative}.no-label .outline-notch{display:none}.outline-panel-inactive,.outline-panel-active{border:inherit;border-bottom-style:solid;inset:0;position:absolute}.outline-panel-inactive::before,.outline-panel-inactive::after,.outline-panel-active::before,.outline-panel-active::after{border-top-style:solid;border-bottom:none;bottom:auto;transform:scaleX(1);transition:transform 150ms cubic-bezier(0.2, 0, 0, 1)}.outline-panel-inactive::before,.outline-panel-active::before{right:50%;transform-origin:top left}.outline-panel-inactive::after,.outline-panel-active::after{left:50%;transform-origin:top right}.populated .outline-panel-inactive::before,.populated .outline-panel-inactive::after,.populated .outline-panel-active::before,.populated .outline-panel-active::after,.focused .outline-panel-inactive::before,.focused .outline-panel-inactive::after,.focused .outline-panel-active::before,.focused .outline-panel-active::after{transform:scaleX(0)}.outline-panel-active{opacity:0;transition:opacity 150ms cubic-bezier(0.2, 0, 0, 1)}.focused .outline-panel-active{opacity:1}.outline-label{display:flex;max-width:100%;transform:translateY(calc(-100% + var(--_label-text-padding-bottom)))}.outline-start,.field:not(.with-start) .content ::slotted(*){padding-inline-start:max(var(--_leading-space),max(var(--_container-shape-start-start),var(--_container-shape-end-start)) + var(--_outline-label-padding))}.field:not(.with-start) .label-wrapper{margin-inline-start:max(var(--_leading-space),max(var(--_container-shape-start-start),var(--_container-shape-end-start)) + var(--_outline-label-padding))}.field:not(.with-end) .content ::slotted(*){padding-inline-end:max(var(--_trailing-space),max(var(--_container-shape-start-end),var(--_container-shape-end-end)))}.field:not(.with-end) .label-wrapper{margin-inline-end:max(var(--_trailing-space),max(var(--_container-shape-start-end),var(--_container-shape-end-end)))}.outline-start::before,.outline-end::before,.outline-panel-inactive,.outline-panel-inactive::before,.outline-panel-inactive::after{border-width:var(--_outline-width)}:hover .outline{border-color:var(--_hover-outline-color);color:var(--_hover-outline-color)}:hover .outline-start::before,:hover .outline-end::before,:hover .outline-panel-inactive,:hover .outline-panel-inactive::before,:hover .outline-panel-inactive::after{border-width:var(--_hover-outline-width)}.focused .outline{border-color:var(--_focus-outline-color);color:var(--_focus-outline-color)}.outline-start::after,.outline-end::after,.outline-panel-active,.outline-panel-active::before,.outline-panel-active::after{border-width:var(--_focus-outline-width)}.disabled .outline{border-color:var(--_disabled-outline-color);color:var(--_disabled-outline-color)}.disabled .outline-start,.disabled .outline-end,.disabled .outline-panel-inactive{opacity:var(--_disabled-outline-opacity)}.disabled .outline-start::before,.disabled .outline-end::before,.disabled .outline-panel-inactive,.disabled .outline-panel-inactive::before,.disabled .outline-panel-inactive::after{border-width:var(--_disabled-outline-width)}.error .outline{border-color:var(--_error-outline-color);color:var(--_error-outline-color)}.error:hover .outline{border-color:var(--_error-hover-outline-color);color:var(--_error-hover-outline-color)}.error.focused .outline{border-color:var(--_error-focus-outline-color);color:var(--_error-focus-outline-color)}.resizable .container{bottom:var(--_focus-outline-width);inset-inline-end:var(--_focus-outline-width);clip-path:inset(var(--_focus-outline-width) 0 0 var(--_focus-outline-width))}.resizable .container>*{top:var(--_focus-outline-width);inset-inline-start:var(--_focus-outline-width)}.resizable .container:dir(rtl){clip-path:inset(var(--_focus-outline-width) var(--_focus-outline-width) 0 0)}}@layer hcm{@media(forced-colors: active){.disabled .outline{border-color:GrayText;color:GrayText}.disabled :is(.outline-start,.outline-end,.outline-panel-inactive){opacity:1}}}
|
|
16807
16827
|
`;
|
|
16808
16828
|
|
|
16809
16829
|
/**
|
|
@@ -16812,7 +16832,7 @@ const styles$3 = i$8`@layer styles{:host{--_bottom-space: var(--md-outlined-fiel
|
|
|
16812
16832
|
* SPDX-License-Identifier: Apache-2.0
|
|
16813
16833
|
*/
|
|
16814
16834
|
// Generated stylesheet for ./field/internal/shared-styles.css.
|
|
16815
|
-
const styles$
|
|
16835
|
+
const styles$4 = i$8`:host{display:inline-flex;resize:both}.field{display:flex;flex:1;flex-direction:column;writing-mode:horizontal-tb;max-width:100%}.container-overflow{border-start-start-radius:var(--_container-shape-start-start);border-start-end-radius:var(--_container-shape-start-end);border-end-end-radius:var(--_container-shape-end-end);border-end-start-radius:var(--_container-shape-end-start);display:flex;height:100%;position:relative}.container{align-items:center;border-radius:inherit;display:flex;flex:1;max-height:100%;min-height:100%;min-width:min-content;position:relative}.field,.container-overflow{resize:inherit}.resizable:not(.disabled) .container{resize:inherit;overflow:hidden}.disabled{pointer-events:none}slot[name=container]{border-radius:inherit}slot[name=container]::slotted(*){border-radius:inherit;inset:0;pointer-events:none;position:absolute}@layer styles{.start,.middle,.end{display:flex;box-sizing:border-box;height:100%;position:relative}.start{color:var(--_leading-content-color)}.end{color:var(--_trailing-content-color)}.start,.end{align-items:center;justify-content:center}.with-start .start{margin-inline:var(--_with-leading-content-leading-space) var(--_content-space)}.with-end .end{margin-inline:var(--_content-space) var(--_with-trailing-content-trailing-space)}.middle{align-items:stretch;align-self:baseline;flex:1}.content{color:var(--_content-color);display:flex;flex:1;opacity:0;transition:opacity 83ms cubic-bezier(0.2, 0, 0, 1)}.no-label .content,.focused .content,.populated .content{opacity:1;transition-delay:67ms}:is(.disabled,.disable-transitions) .content{transition:none}.content ::slotted(*){all:unset;color:currentColor;font-family:var(--_content-font);font-size:var(--_content-size);line-height:var(--_content-line-height);font-weight:var(--_content-weight);width:100%;overflow-wrap:revert;white-space:revert}.content ::slotted(:not(textarea)){padding-top:var(--_top-space);padding-bottom:var(--_bottom-space)}.content ::slotted(textarea){margin-top:var(--_top-space);margin-bottom:var(--_bottom-space)}:hover .content{color:var(--_hover-content-color)}:hover .start{color:var(--_hover-leading-content-color)}:hover .end{color:var(--_hover-trailing-content-color)}.focused .content{color:var(--_focus-content-color)}.focused .start{color:var(--_focus-leading-content-color)}.focused .end{color:var(--_focus-trailing-content-color)}.disabled .content{color:var(--_disabled-content-color)}.disabled.no-label .content,.disabled.focused .content,.disabled.populated .content{opacity:var(--_disabled-content-opacity)}.disabled .start{color:var(--_disabled-leading-content-color);opacity:var(--_disabled-leading-content-opacity)}.disabled .end{color:var(--_disabled-trailing-content-color);opacity:var(--_disabled-trailing-content-opacity)}.error .content{color:var(--_error-content-color)}.error .start{color:var(--_error-leading-content-color)}.error .end{color:var(--_error-trailing-content-color)}.error:hover .content{color:var(--_error-hover-content-color)}.error:hover .start{color:var(--_error-hover-leading-content-color)}.error:hover .end{color:var(--_error-hover-trailing-content-color)}.error.focused .content{color:var(--_error-focus-content-color)}.error.focused .start{color:var(--_error-focus-leading-content-color)}.error.focused .end{color:var(--_error-focus-trailing-content-color)}}@layer hcm{@media(forced-colors: active){.disabled :is(.start,.content,.end){color:GrayText;opacity:1}}}@layer styles{.label{box-sizing:border-box;color:var(--_label-text-color);overflow:hidden;max-width:100%;text-overflow:ellipsis;white-space:nowrap;z-index:1;font-family:var(--_label-text-font);font-size:var(--_label-text-size);line-height:var(--_label-text-line-height);font-weight:var(--_label-text-weight);width:min-content}.label-wrapper{inset:0;pointer-events:none;position:absolute}.label.resting{position:absolute;top:var(--_top-space)}.label.floating{font-size:var(--_label-text-populated-size);line-height:var(--_label-text-populated-line-height);transform-origin:top left}.label.hidden{opacity:0}.no-label .label{display:none}.label-wrapper{inset:0;position:absolute;text-align:initial}:hover .label{color:var(--_hover-label-text-color)}.focused .label{color:var(--_focus-label-text-color)}.disabled .label{color:var(--_disabled-label-text-color)}.disabled .label:not(.hidden){opacity:var(--_disabled-label-text-opacity)}.error .label{color:var(--_error-label-text-color)}.error:hover .label{color:var(--_error-hover-label-text-color)}.error.focused .label{color:var(--_error-focus-label-text-color)}}@layer hcm{@media(forced-colors: active){.disabled .label:not(.hidden){color:GrayText;opacity:1}}}@layer styles{.supporting-text{color:var(--_supporting-text-color);display:flex;font-family:var(--_supporting-text-font);font-size:var(--_supporting-text-size);line-height:var(--_supporting-text-line-height);font-weight:var(--_supporting-text-weight);gap:16px;justify-content:space-between;padding-inline-start:var(--_supporting-text-leading-space);padding-inline-end:var(--_supporting-text-trailing-space);padding-top:var(--_supporting-text-top-space)}.supporting-text :nth-child(2){flex-shrink:0}:hover .supporting-text{color:var(--_hover-supporting-text-color)}.focus .supporting-text{color:var(--_focus-supporting-text-color)}.disabled .supporting-text{color:var(--_disabled-supporting-text-color);opacity:var(--_disabled-supporting-text-opacity)}.error .supporting-text{color:var(--_error-supporting-text-color)}.error:hover .supporting-text{color:var(--_error-hover-supporting-text-color)}.error.focus .supporting-text{color:var(--_error-focus-supporting-text-color)}}@layer hcm{@media(forced-colors: active){.disabled .supporting-text{color:GrayText;opacity:1}}}
|
|
16816
16836
|
`;
|
|
16817
16837
|
|
|
16818
16838
|
/**
|
|
@@ -16826,7 +16846,7 @@ const styles$2 = i$8`:host{display:inline-flex;resize:both}.field{display:flex;f
|
|
|
16826
16846
|
* @suppress {visibility}
|
|
16827
16847
|
*/
|
|
16828
16848
|
let MdOutlinedField = class MdOutlinedField extends OutlinedField {};
|
|
16829
|
-
MdOutlinedField.styles = [styles$
|
|
16849
|
+
MdOutlinedField.styles = [styles$4, styles$5];
|
|
16830
16850
|
MdOutlinedField = __decorate([t$1('md-outlined-field')], MdOutlinedField);
|
|
16831
16851
|
|
|
16832
16852
|
/**
|
|
@@ -16835,7 +16855,7 @@ MdOutlinedField = __decorate([t$1('md-outlined-field')], MdOutlinedField);
|
|
|
16835
16855
|
* SPDX-License-Identifier: Apache-2.0
|
|
16836
16856
|
*/
|
|
16837
16857
|
// Generated stylesheet for ./textfield/internal/outlined-styles.css.
|
|
16838
|
-
const styles$1 = i$8`:host{--_caret-color: var(--md-outlined-text-field-caret-color, var(--md-sys-color-primary, #6750a4));--_disabled-input-text-color: var(--md-outlined-text-field-disabled-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-input-text-opacity: var(--md-outlined-text-field-disabled-input-text-opacity, 0.38);--_disabled-label-text-color: var(--md-outlined-text-field-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-outlined-text-field-disabled-label-text-opacity, 0.38);--_disabled-leading-icon-color: var(--md-outlined-text-field-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-outlined-text-field-disabled-leading-icon-opacity, 0.38);--_disabled-outline-color: var(--md-outlined-text-field-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-outlined-text-field-disabled-outline-opacity, 0.12);--_disabled-outline-width: var(--md-outlined-text-field-disabled-outline-width, 1px);--_disabled-supporting-text-color: var(--md-outlined-text-field-disabled-supporting-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-supporting-text-opacity: var(--md-outlined-text-field-disabled-supporting-text-opacity, 0.38);--_disabled-trailing-icon-color: var(--md-outlined-text-field-disabled-trailing-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-icon-opacity: var(--md-outlined-text-field-disabled-trailing-icon-opacity, 0.38);--_error-focus-caret-color: var(--md-outlined-text-field-error-focus-caret-color, var(--md-sys-color-error, #b3261e));--_error-focus-input-text-color: var(--md-outlined-text-field-error-focus-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-focus-label-text-color: var(--md-outlined-text-field-error-focus-label-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-leading-icon-color: var(--md-outlined-text-field-error-focus-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-focus-outline-color: var(--md-outlined-text-field-error-focus-outline-color, var(--md-sys-color-error, #b3261e));--_error-focus-supporting-text-color: var(--md-outlined-text-field-error-focus-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-trailing-icon-color: var(--md-outlined-text-field-error-focus-trailing-icon-color, var(--md-sys-color-error, #b3261e));--_error-hover-input-text-color: var(--md-outlined-text-field-error-hover-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-hover-label-text-color: var(--md-outlined-text-field-error-hover-label-text-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-leading-icon-color: var(--md-outlined-text-field-error-hover-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-hover-outline-color: var(--md-outlined-text-field-error-hover-outline-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-supporting-text-color: var(--md-outlined-text-field-error-hover-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-hover-trailing-icon-color: var(--md-outlined-text-field-error-hover-trailing-icon-color, var(--md-sys-color-on-error-container, #410e0b));--_error-input-text-color: var(--md-outlined-text-field-error-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-label-text-color: var(--md-outlined-text-field-error-label-text-color, var(--md-sys-color-error, #b3261e));--_error-leading-icon-color: var(--md-outlined-text-field-error-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-outline-color: var(--md-outlined-text-field-error-outline-color, var(--md-sys-color-error, #b3261e));--_error-supporting-text-color: var(--md-outlined-text-field-error-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-trailing-icon-color: var(--md-outlined-text-field-error-trailing-icon-color, var(--md-sys-color-error, #b3261e));--_focus-input-text-color: var(--md-outlined-text-field-focus-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_focus-label-text-color: var(--md-outlined-text-field-focus-label-text-color, var(--md-sys-color-primary, #6750a4));--_focus-leading-icon-color: var(--md-outlined-text-field-focus-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-outline-color: var(--md-outlined-text-field-focus-outline-color, var(--md-sys-color-primary, #6750a4));--_focus-outline-width: var(--md-outlined-text-field-focus-outline-width, 3px);--_focus-supporting-text-color: var(--md-outlined-text-field-focus-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-trailing-icon-color: var(--md-outlined-text-field-focus-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-input-text-color: var(--md-outlined-text-field-hover-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-label-text-color: var(--md-outlined-text-field-hover-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-leading-icon-color: var(--md-outlined-text-field-hover-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-outline-color: var(--md-outlined-text-field-hover-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-outline-width: var(--md-outlined-text-field-hover-outline-width, 1px);--_hover-supporting-text-color: var(--md-outlined-text-field-hover-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-icon-color: var(--md-outlined-text-field-hover-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-color: var(--md-outlined-text-field-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_input-text-font: var(--md-outlined-text-field-input-text-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_input-text-line-height: var(--md-outlined-text-field-input-text-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_input-text-placeholder-color: var(--md-outlined-text-field-input-text-placeholder-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-prefix-color: var(--md-outlined-text-field-input-text-prefix-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-size: var(--md-outlined-text-field-input-text-size, var(--md-sys-typescale-body-large-size, 1rem));--_input-text-suffix-color: var(--md-outlined-text-field-input-text-suffix-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-weight: var(--md-outlined-text-field-input-text-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_label-text-color: var(--md-outlined-text-field-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_label-text-font: var(--md-outlined-text-field-label-text-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-outlined-text-field-label-text-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_label-text-populated-line-height: var(--md-outlined-text-field-label-text-populated-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_label-text-populated-size: var(--md-outlined-text-field-label-text-populated-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_label-text-size: var(--md-outlined-text-field-label-text-size, var(--md-sys-typescale-body-large-size, 1rem));--_label-text-weight: var(--md-outlined-text-field-label-text-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_leading-icon-color: var(--md-outlined-text-field-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_leading-icon-size: var(--md-outlined-text-field-leading-icon-size, 24px);--_outline-color: var(--md-outlined-text-field-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-outlined-text-field-outline-width, 1px);--_supporting-text-color: var(--md-outlined-text-field-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_supporting-text-font: var(--md-outlined-text-field-supporting-text-font, var(--md-sys-typescale-body-small-font, var(--md-ref-typeface-plain, Roboto)));--_supporting-text-line-height: var(--md-outlined-text-field-supporting-text-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_supporting-text-size: var(--md-outlined-text-field-supporting-text-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_supporting-text-weight: var(--md-outlined-text-field-supporting-text-weight, var(--md-sys-typescale-body-small-weight, var(--md-ref-typeface-weight-regular, 400)));--_trailing-icon-color: var(--md-outlined-text-field-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-icon-size: var(--md-outlined-text-field-trailing-icon-size, 24px);--_container-shape-start-start: var(--md-outlined-text-field-container-shape-start-start, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-start-end: var(--md-outlined-text-field-container-shape-start-end, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-end-end: var(--md-outlined-text-field-container-shape-end-end, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-end-start: var(--md-outlined-text-field-container-shape-end-start, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_icon-input-space: var(--md-outlined-text-field-icon-input-space, 16px);--_leading-space: var(--md-outlined-text-field-leading-space, 16px);--_trailing-space: var(--md-outlined-text-field-trailing-space, 16px);--_top-space: var(--md-outlined-text-field-top-space, 16px);--_bottom-space: var(--md-outlined-text-field-bottom-space, 16px);--_input-text-prefix-trailing-space: var(--md-outlined-text-field-input-text-prefix-trailing-space, 2px);--_input-text-suffix-leading-space: var(--md-outlined-text-field-input-text-suffix-leading-space, 2px);--_focus-caret-color: var(--md-outlined-text-field-focus-caret-color, var(--md-sys-color-primary, #6750a4));--_with-leading-icon-leading-space: var(--md-outlined-text-field-with-leading-icon-leading-space, 12px);--_with-trailing-icon-trailing-space: var(--md-outlined-text-field-with-trailing-icon-trailing-space, 12px);--md-outlined-field-bottom-space: var(--_bottom-space);--md-outlined-field-container-shape-end-end: var(--_container-shape-end-end);--md-outlined-field-container-shape-end-start: var(--_container-shape-end-start);--md-outlined-field-container-shape-start-end: var(--_container-shape-start-end);--md-outlined-field-container-shape-start-start: var(--_container-shape-start-start);--md-outlined-field-content-color: var(--_input-text-color);--md-outlined-field-content-font: var(--_input-text-font);--md-outlined-field-content-line-height: var(--_input-text-line-height);--md-outlined-field-content-size: var(--_input-text-size);--md-outlined-field-content-space: var(--_icon-input-space);--md-outlined-field-content-weight: var(--_input-text-weight);--md-outlined-field-disabled-content-color: var(--_disabled-input-text-color);--md-outlined-field-disabled-content-opacity: var(--_disabled-input-text-opacity);--md-outlined-field-disabled-label-text-color: var(--_disabled-label-text-color);--md-outlined-field-disabled-label-text-opacity: var(--_disabled-label-text-opacity);--md-outlined-field-disabled-leading-content-color: var(--_disabled-leading-icon-color);--md-outlined-field-disabled-leading-content-opacity: var(--_disabled-leading-icon-opacity);--md-outlined-field-disabled-outline-color: var(--_disabled-outline-color);--md-outlined-field-disabled-outline-opacity: var(--_disabled-outline-opacity);--md-outlined-field-disabled-outline-width: var(--_disabled-outline-width);--md-outlined-field-disabled-supporting-text-color: var(--_disabled-supporting-text-color);--md-outlined-field-disabled-supporting-text-opacity: var(--_disabled-supporting-text-opacity);--md-outlined-field-disabled-trailing-content-color: var(--_disabled-trailing-icon-color);--md-outlined-field-disabled-trailing-content-opacity: var(--_disabled-trailing-icon-opacity);--md-outlined-field-error-content-color: var(--_error-input-text-color);--md-outlined-field-error-focus-content-color: var(--_error-focus-input-text-color);--md-outlined-field-error-focus-label-text-color: var(--_error-focus-label-text-color);--md-outlined-field-error-focus-leading-content-color: var(--_error-focus-leading-icon-color);--md-outlined-field-error-focus-outline-color: var(--_error-focus-outline-color);--md-outlined-field-error-focus-supporting-text-color: var(--_error-focus-supporting-text-color);--md-outlined-field-error-focus-trailing-content-color: var(--_error-focus-trailing-icon-color);--md-outlined-field-error-hover-content-color: var(--_error-hover-input-text-color);--md-outlined-field-error-hover-label-text-color: var(--_error-hover-label-text-color);--md-outlined-field-error-hover-leading-content-color: var(--_error-hover-leading-icon-color);--md-outlined-field-error-hover-outline-color: var(--_error-hover-outline-color);--md-outlined-field-error-hover-supporting-text-color: var(--_error-hover-supporting-text-color);--md-outlined-field-error-hover-trailing-content-color: var(--_error-hover-trailing-icon-color);--md-outlined-field-error-label-text-color: var(--_error-label-text-color);--md-outlined-field-error-leading-content-color: var(--_error-leading-icon-color);--md-outlined-field-error-outline-color: var(--_error-outline-color);--md-outlined-field-error-supporting-text-color: var(--_error-supporting-text-color);--md-outlined-field-error-trailing-content-color: var(--_error-trailing-icon-color);--md-outlined-field-focus-content-color: var(--_focus-input-text-color);--md-outlined-field-focus-label-text-color: var(--_focus-label-text-color);--md-outlined-field-focus-leading-content-color: var(--_focus-leading-icon-color);--md-outlined-field-focus-outline-color: var(--_focus-outline-color);--md-outlined-field-focus-outline-width: var(--_focus-outline-width);--md-outlined-field-focus-supporting-text-color: var(--_focus-supporting-text-color);--md-outlined-field-focus-trailing-content-color: var(--_focus-trailing-icon-color);--md-outlined-field-hover-content-color: var(--_hover-input-text-color);--md-outlined-field-hover-label-text-color: var(--_hover-label-text-color);--md-outlined-field-hover-leading-content-color: var(--_hover-leading-icon-color);--md-outlined-field-hover-outline-color: var(--_hover-outline-color);--md-outlined-field-hover-outline-width: var(--_hover-outline-width);--md-outlined-field-hover-supporting-text-color: var(--_hover-supporting-text-color);--md-outlined-field-hover-trailing-content-color: var(--_hover-trailing-icon-color);--md-outlined-field-label-text-color: var(--_label-text-color);--md-outlined-field-label-text-font: var(--_label-text-font);--md-outlined-field-label-text-line-height: var(--_label-text-line-height);--md-outlined-field-label-text-populated-line-height: var(--_label-text-populated-line-height);--md-outlined-field-label-text-populated-size: var(--_label-text-populated-size);--md-outlined-field-label-text-size: var(--_label-text-size);--md-outlined-field-label-text-weight: var(--_label-text-weight);--md-outlined-field-leading-content-color: var(--_leading-icon-color);--md-outlined-field-leading-space: var(--_leading-space);--md-outlined-field-outline-color: var(--_outline-color);--md-outlined-field-outline-width: var(--_outline-width);--md-outlined-field-supporting-text-color: var(--_supporting-text-color);--md-outlined-field-supporting-text-font: var(--_supporting-text-font);--md-outlined-field-supporting-text-line-height: var(--_supporting-text-line-height);--md-outlined-field-supporting-text-size: var(--_supporting-text-size);--md-outlined-field-supporting-text-weight: var(--_supporting-text-weight);--md-outlined-field-top-space: var(--_top-space);--md-outlined-field-trailing-content-color: var(--_trailing-icon-color);--md-outlined-field-trailing-space: var(--_trailing-space);--md-outlined-field-with-leading-content-leading-space: var(--_with-leading-icon-leading-space);--md-outlined-field-with-trailing-content-trailing-space: var(--_with-trailing-icon-trailing-space)}
|
|
16858
|
+
const styles$3 = i$8`:host{--_caret-color: var(--md-outlined-text-field-caret-color, var(--md-sys-color-primary, #6750a4));--_disabled-input-text-color: var(--md-outlined-text-field-disabled-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-input-text-opacity: var(--md-outlined-text-field-disabled-input-text-opacity, 0.38);--_disabled-label-text-color: var(--md-outlined-text-field-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-outlined-text-field-disabled-label-text-opacity, 0.38);--_disabled-leading-icon-color: var(--md-outlined-text-field-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-outlined-text-field-disabled-leading-icon-opacity, 0.38);--_disabled-outline-color: var(--md-outlined-text-field-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-outlined-text-field-disabled-outline-opacity, 0.12);--_disabled-outline-width: var(--md-outlined-text-field-disabled-outline-width, 1px);--_disabled-supporting-text-color: var(--md-outlined-text-field-disabled-supporting-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-supporting-text-opacity: var(--md-outlined-text-field-disabled-supporting-text-opacity, 0.38);--_disabled-trailing-icon-color: var(--md-outlined-text-field-disabled-trailing-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-icon-opacity: var(--md-outlined-text-field-disabled-trailing-icon-opacity, 0.38);--_error-focus-caret-color: var(--md-outlined-text-field-error-focus-caret-color, var(--md-sys-color-error, #b3261e));--_error-focus-input-text-color: var(--md-outlined-text-field-error-focus-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-focus-label-text-color: var(--md-outlined-text-field-error-focus-label-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-leading-icon-color: var(--md-outlined-text-field-error-focus-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-focus-outline-color: var(--md-outlined-text-field-error-focus-outline-color, var(--md-sys-color-error, #b3261e));--_error-focus-supporting-text-color: var(--md-outlined-text-field-error-focus-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-trailing-icon-color: var(--md-outlined-text-field-error-focus-trailing-icon-color, var(--md-sys-color-error, #b3261e));--_error-hover-input-text-color: var(--md-outlined-text-field-error-hover-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-hover-label-text-color: var(--md-outlined-text-field-error-hover-label-text-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-leading-icon-color: var(--md-outlined-text-field-error-hover-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-hover-outline-color: var(--md-outlined-text-field-error-hover-outline-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-supporting-text-color: var(--md-outlined-text-field-error-hover-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-hover-trailing-icon-color: var(--md-outlined-text-field-error-hover-trailing-icon-color, var(--md-sys-color-on-error-container, #410e0b));--_error-input-text-color: var(--md-outlined-text-field-error-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-label-text-color: var(--md-outlined-text-field-error-label-text-color, var(--md-sys-color-error, #b3261e));--_error-leading-icon-color: var(--md-outlined-text-field-error-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-outline-color: var(--md-outlined-text-field-error-outline-color, var(--md-sys-color-error, #b3261e));--_error-supporting-text-color: var(--md-outlined-text-field-error-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-trailing-icon-color: var(--md-outlined-text-field-error-trailing-icon-color, var(--md-sys-color-error, #b3261e));--_focus-input-text-color: var(--md-outlined-text-field-focus-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_focus-label-text-color: var(--md-outlined-text-field-focus-label-text-color, var(--md-sys-color-primary, #6750a4));--_focus-leading-icon-color: var(--md-outlined-text-field-focus-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-outline-color: var(--md-outlined-text-field-focus-outline-color, var(--md-sys-color-primary, #6750a4));--_focus-outline-width: var(--md-outlined-text-field-focus-outline-width, 3px);--_focus-supporting-text-color: var(--md-outlined-text-field-focus-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-trailing-icon-color: var(--md-outlined-text-field-focus-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-input-text-color: var(--md-outlined-text-field-hover-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-label-text-color: var(--md-outlined-text-field-hover-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-leading-icon-color: var(--md-outlined-text-field-hover-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-outline-color: var(--md-outlined-text-field-hover-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-outline-width: var(--md-outlined-text-field-hover-outline-width, 1px);--_hover-supporting-text-color: var(--md-outlined-text-field-hover-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-icon-color: var(--md-outlined-text-field-hover-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-color: var(--md-outlined-text-field-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_input-text-font: var(--md-outlined-text-field-input-text-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_input-text-line-height: var(--md-outlined-text-field-input-text-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_input-text-placeholder-color: var(--md-outlined-text-field-input-text-placeholder-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-prefix-color: var(--md-outlined-text-field-input-text-prefix-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-size: var(--md-outlined-text-field-input-text-size, var(--md-sys-typescale-body-large-size, 1rem));--_input-text-suffix-color: var(--md-outlined-text-field-input-text-suffix-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-weight: var(--md-outlined-text-field-input-text-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_label-text-color: var(--md-outlined-text-field-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_label-text-font: var(--md-outlined-text-field-label-text-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-outlined-text-field-label-text-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_label-text-populated-line-height: var(--md-outlined-text-field-label-text-populated-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_label-text-populated-size: var(--md-outlined-text-field-label-text-populated-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_label-text-size: var(--md-outlined-text-field-label-text-size, var(--md-sys-typescale-body-large-size, 1rem));--_label-text-weight: var(--md-outlined-text-field-label-text-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_leading-icon-color: var(--md-outlined-text-field-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_leading-icon-size: var(--md-outlined-text-field-leading-icon-size, 24px);--_outline-color: var(--md-outlined-text-field-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-outlined-text-field-outline-width, 1px);--_supporting-text-color: var(--md-outlined-text-field-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_supporting-text-font: var(--md-outlined-text-field-supporting-text-font, var(--md-sys-typescale-body-small-font, var(--md-ref-typeface-plain, Roboto)));--_supporting-text-line-height: var(--md-outlined-text-field-supporting-text-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_supporting-text-size: var(--md-outlined-text-field-supporting-text-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_supporting-text-weight: var(--md-outlined-text-field-supporting-text-weight, var(--md-sys-typescale-body-small-weight, var(--md-ref-typeface-weight-regular, 400)));--_trailing-icon-color: var(--md-outlined-text-field-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-icon-size: var(--md-outlined-text-field-trailing-icon-size, 24px);--_container-shape-start-start: var(--md-outlined-text-field-container-shape-start-start, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-start-end: var(--md-outlined-text-field-container-shape-start-end, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-end-end: var(--md-outlined-text-field-container-shape-end-end, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-end-start: var(--md-outlined-text-field-container-shape-end-start, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_icon-input-space: var(--md-outlined-text-field-icon-input-space, 16px);--_leading-space: var(--md-outlined-text-field-leading-space, 16px);--_trailing-space: var(--md-outlined-text-field-trailing-space, 16px);--_top-space: var(--md-outlined-text-field-top-space, 16px);--_bottom-space: var(--md-outlined-text-field-bottom-space, 16px);--_input-text-prefix-trailing-space: var(--md-outlined-text-field-input-text-prefix-trailing-space, 2px);--_input-text-suffix-leading-space: var(--md-outlined-text-field-input-text-suffix-leading-space, 2px);--_focus-caret-color: var(--md-outlined-text-field-focus-caret-color, var(--md-sys-color-primary, #6750a4));--_with-leading-icon-leading-space: var(--md-outlined-text-field-with-leading-icon-leading-space, 12px);--_with-trailing-icon-trailing-space: var(--md-outlined-text-field-with-trailing-icon-trailing-space, 12px);--md-outlined-field-bottom-space: var(--_bottom-space);--md-outlined-field-container-shape-end-end: var(--_container-shape-end-end);--md-outlined-field-container-shape-end-start: var(--_container-shape-end-start);--md-outlined-field-container-shape-start-end: var(--_container-shape-start-end);--md-outlined-field-container-shape-start-start: var(--_container-shape-start-start);--md-outlined-field-content-color: var(--_input-text-color);--md-outlined-field-content-font: var(--_input-text-font);--md-outlined-field-content-line-height: var(--_input-text-line-height);--md-outlined-field-content-size: var(--_input-text-size);--md-outlined-field-content-space: var(--_icon-input-space);--md-outlined-field-content-weight: var(--_input-text-weight);--md-outlined-field-disabled-content-color: var(--_disabled-input-text-color);--md-outlined-field-disabled-content-opacity: var(--_disabled-input-text-opacity);--md-outlined-field-disabled-label-text-color: var(--_disabled-label-text-color);--md-outlined-field-disabled-label-text-opacity: var(--_disabled-label-text-opacity);--md-outlined-field-disabled-leading-content-color: var(--_disabled-leading-icon-color);--md-outlined-field-disabled-leading-content-opacity: var(--_disabled-leading-icon-opacity);--md-outlined-field-disabled-outline-color: var(--_disabled-outline-color);--md-outlined-field-disabled-outline-opacity: var(--_disabled-outline-opacity);--md-outlined-field-disabled-outline-width: var(--_disabled-outline-width);--md-outlined-field-disabled-supporting-text-color: var(--_disabled-supporting-text-color);--md-outlined-field-disabled-supporting-text-opacity: var(--_disabled-supporting-text-opacity);--md-outlined-field-disabled-trailing-content-color: var(--_disabled-trailing-icon-color);--md-outlined-field-disabled-trailing-content-opacity: var(--_disabled-trailing-icon-opacity);--md-outlined-field-error-content-color: var(--_error-input-text-color);--md-outlined-field-error-focus-content-color: var(--_error-focus-input-text-color);--md-outlined-field-error-focus-label-text-color: var(--_error-focus-label-text-color);--md-outlined-field-error-focus-leading-content-color: var(--_error-focus-leading-icon-color);--md-outlined-field-error-focus-outline-color: var(--_error-focus-outline-color);--md-outlined-field-error-focus-supporting-text-color: var(--_error-focus-supporting-text-color);--md-outlined-field-error-focus-trailing-content-color: var(--_error-focus-trailing-icon-color);--md-outlined-field-error-hover-content-color: var(--_error-hover-input-text-color);--md-outlined-field-error-hover-label-text-color: var(--_error-hover-label-text-color);--md-outlined-field-error-hover-leading-content-color: var(--_error-hover-leading-icon-color);--md-outlined-field-error-hover-outline-color: var(--_error-hover-outline-color);--md-outlined-field-error-hover-supporting-text-color: var(--_error-hover-supporting-text-color);--md-outlined-field-error-hover-trailing-content-color: var(--_error-hover-trailing-icon-color);--md-outlined-field-error-label-text-color: var(--_error-label-text-color);--md-outlined-field-error-leading-content-color: var(--_error-leading-icon-color);--md-outlined-field-error-outline-color: var(--_error-outline-color);--md-outlined-field-error-supporting-text-color: var(--_error-supporting-text-color);--md-outlined-field-error-trailing-content-color: var(--_error-trailing-icon-color);--md-outlined-field-focus-content-color: var(--_focus-input-text-color);--md-outlined-field-focus-label-text-color: var(--_focus-label-text-color);--md-outlined-field-focus-leading-content-color: var(--_focus-leading-icon-color);--md-outlined-field-focus-outline-color: var(--_focus-outline-color);--md-outlined-field-focus-outline-width: var(--_focus-outline-width);--md-outlined-field-focus-supporting-text-color: var(--_focus-supporting-text-color);--md-outlined-field-focus-trailing-content-color: var(--_focus-trailing-icon-color);--md-outlined-field-hover-content-color: var(--_hover-input-text-color);--md-outlined-field-hover-label-text-color: var(--_hover-label-text-color);--md-outlined-field-hover-leading-content-color: var(--_hover-leading-icon-color);--md-outlined-field-hover-outline-color: var(--_hover-outline-color);--md-outlined-field-hover-outline-width: var(--_hover-outline-width);--md-outlined-field-hover-supporting-text-color: var(--_hover-supporting-text-color);--md-outlined-field-hover-trailing-content-color: var(--_hover-trailing-icon-color);--md-outlined-field-label-text-color: var(--_label-text-color);--md-outlined-field-label-text-font: var(--_label-text-font);--md-outlined-field-label-text-line-height: var(--_label-text-line-height);--md-outlined-field-label-text-populated-line-height: var(--_label-text-populated-line-height);--md-outlined-field-label-text-populated-size: var(--_label-text-populated-size);--md-outlined-field-label-text-size: var(--_label-text-size);--md-outlined-field-label-text-weight: var(--_label-text-weight);--md-outlined-field-leading-content-color: var(--_leading-icon-color);--md-outlined-field-leading-space: var(--_leading-space);--md-outlined-field-outline-color: var(--_outline-color);--md-outlined-field-outline-width: var(--_outline-width);--md-outlined-field-supporting-text-color: var(--_supporting-text-color);--md-outlined-field-supporting-text-font: var(--_supporting-text-font);--md-outlined-field-supporting-text-line-height: var(--_supporting-text-line-height);--md-outlined-field-supporting-text-size: var(--_supporting-text-size);--md-outlined-field-supporting-text-weight: var(--_supporting-text-weight);--md-outlined-field-top-space: var(--_top-space);--md-outlined-field-trailing-content-color: var(--_trailing-icon-color);--md-outlined-field-trailing-space: var(--_trailing-space);--md-outlined-field-with-leading-content-leading-space: var(--_with-leading-icon-leading-space);--md-outlined-field-with-trailing-content-trailing-space: var(--_with-trailing-icon-trailing-space)}
|
|
16839
16859
|
`;
|
|
16840
16860
|
|
|
16841
16861
|
/**
|
|
@@ -18519,7 +18539,7 @@ class OutlinedTextField extends TextField {
|
|
|
18519
18539
|
* SPDX-License-Identifier: Apache-2.0
|
|
18520
18540
|
*/
|
|
18521
18541
|
// Generated stylesheet for ./textfield/internal/shared-styles.css.
|
|
18522
|
-
const styles = i$8`:host{display:inline-flex;outline:none;resize:both;text-align:start;-webkit-tap-highlight-color:rgba(0,0,0,0)}.text-field,.field{width:100%}.text-field{display:inline-flex}.field{cursor:text}.disabled .field{cursor:default}.text-field,.textarea .field{resize:inherit}slot[name=container]{border-radius:inherit}.icon{color:currentColor;display:flex;align-items:center;justify-content:center;fill:currentColor;position:relative}.icon ::slotted(*){display:flex;position:absolute}[has-start] .icon.leading{font-size:var(--_leading-icon-size);height:var(--_leading-icon-size);width:var(--_leading-icon-size)}[has-end] .icon.trailing{font-size:var(--_trailing-icon-size);height:var(--_trailing-icon-size);width:var(--_trailing-icon-size)}.input-wrapper{display:flex}.input-wrapper>*{all:inherit;padding:0}.input{caret-color:var(--_caret-color);overflow-x:hidden;text-align:inherit}.input::placeholder{color:currentColor;opacity:1}.input::-webkit-calendar-picker-indicator{display:none}.input::-webkit-search-decoration,.input::-webkit-search-cancel-button{display:none}@media(forced-colors: active){.input{background:none}}.no-spinner .input::-webkit-inner-spin-button,.no-spinner .input::-webkit-outer-spin-button{display:none}.no-spinner .input[type=number]{-moz-appearance:textfield}:focus-within .input{caret-color:var(--_focus-caret-color)}.error:focus-within .input{caret-color:var(--_error-focus-caret-color)}.text-field:not(.disabled) .prefix{color:var(--_input-text-prefix-color)}.text-field:not(.disabled) .suffix{color:var(--_input-text-suffix-color)}.text-field:not(.disabled) .input::placeholder{color:var(--_input-text-placeholder-color)}.prefix,.suffix{text-wrap:nowrap;width:min-content}.prefix{padding-inline-end:var(--_input-text-prefix-trailing-space)}.suffix{padding-inline-start:var(--_input-text-suffix-leading-space)}
|
|
18542
|
+
const styles$2 = i$8`:host{display:inline-flex;outline:none;resize:both;text-align:start;-webkit-tap-highlight-color:rgba(0,0,0,0)}.text-field,.field{width:100%}.text-field{display:inline-flex}.field{cursor:text}.disabled .field{cursor:default}.text-field,.textarea .field{resize:inherit}slot[name=container]{border-radius:inherit}.icon{color:currentColor;display:flex;align-items:center;justify-content:center;fill:currentColor;position:relative}.icon ::slotted(*){display:flex;position:absolute}[has-start] .icon.leading{font-size:var(--_leading-icon-size);height:var(--_leading-icon-size);width:var(--_leading-icon-size)}[has-end] .icon.trailing{font-size:var(--_trailing-icon-size);height:var(--_trailing-icon-size);width:var(--_trailing-icon-size)}.input-wrapper{display:flex}.input-wrapper>*{all:inherit;padding:0}.input{caret-color:var(--_caret-color);overflow-x:hidden;text-align:inherit}.input::placeholder{color:currentColor;opacity:1}.input::-webkit-calendar-picker-indicator{display:none}.input::-webkit-search-decoration,.input::-webkit-search-cancel-button{display:none}@media(forced-colors: active){.input{background:none}}.no-spinner .input::-webkit-inner-spin-button,.no-spinner .input::-webkit-outer-spin-button{display:none}.no-spinner .input[type=number]{-moz-appearance:textfield}:focus-within .input{caret-color:var(--_focus-caret-color)}.error:focus-within .input{caret-color:var(--_error-focus-caret-color)}.text-field:not(.disabled) .prefix{color:var(--_input-text-prefix-color)}.text-field:not(.disabled) .suffix{color:var(--_input-text-suffix-color)}.text-field:not(.disabled) .input::placeholder{color:var(--_input-text-placeholder-color)}.prefix,.suffix{text-wrap:nowrap;width:min-content}.prefix{padding-inline-end:var(--_input-text-prefix-trailing-space)}.suffix{padding-inline-start:var(--_input-text-suffix-leading-space)}
|
|
18523
18543
|
`;
|
|
18524
18544
|
|
|
18525
18545
|
/**
|
|
@@ -18538,15 +18558,15 @@ let MdOutlinedTextField = class MdOutlinedTextField extends OutlinedTextField {
|
|
|
18538
18558
|
this.fieldTag = i$3`md-outlined-field`;
|
|
18539
18559
|
}
|
|
18540
18560
|
};
|
|
18541
|
-
MdOutlinedTextField.styles = [styles, styles$
|
|
18561
|
+
MdOutlinedTextField.styles = [styles$2, styles$3];
|
|
18542
18562
|
MdOutlinedTextField = __decorate([t$1('md-outlined-text-field')], MdOutlinedTextField);
|
|
18543
18563
|
|
|
18544
|
-
var __defProp$
|
|
18545
|
-
var __getOwnPropDesc$
|
|
18546
|
-
var __decorateClass$
|
|
18547
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$
|
|
18564
|
+
var __defProp$a = Object.defineProperty;
|
|
18565
|
+
var __getOwnPropDesc$e = Object.getOwnPropertyDescriptor;
|
|
18566
|
+
var __decorateClass$f = (decorators, target, key, kind) => {
|
|
18567
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$e(target, key) : target;
|
|
18548
18568
|
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
18549
|
-
if (kind && result) __defProp$
|
|
18569
|
+
if (kind && result) __defProp$a(target, key, result);
|
|
18550
18570
|
return result;
|
|
18551
18571
|
};
|
|
18552
18572
|
const CLUSTER_ID$2 = 40;
|
|
@@ -18668,17 +18688,17 @@ BasicInformationClusterCommands.styles = [BaseClusterCommands.styles, i$8`
|
|
|
18668
18688
|
border-radius: 4px;
|
|
18669
18689
|
}
|
|
18670
18690
|
`];
|
|
18671
|
-
__decorateClass$
|
|
18672
|
-
__decorateClass$
|
|
18673
|
-
BasicInformationClusterCommands = __decorateClass$
|
|
18691
|
+
__decorateClass$f([r$2()], BasicInformationClusterCommands.prototype, "_nodeLabel", 2);
|
|
18692
|
+
__decorateClass$f([r$2()], BasicInformationClusterCommands.prototype, "_saving", 2);
|
|
18693
|
+
BasicInformationClusterCommands = __decorateClass$f([t$1("basic-information-cluster-commands")], BasicInformationClusterCommands);
|
|
18674
18694
|
registerClusterCommands(CLUSTER_ID$2, "basic-information-cluster-commands");
|
|
18675
18695
|
|
|
18676
|
-
var __defProp$
|
|
18677
|
-
var __getOwnPropDesc$
|
|
18678
|
-
var __decorateClass$
|
|
18679
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$
|
|
18696
|
+
var __defProp$9 = Object.defineProperty;
|
|
18697
|
+
var __getOwnPropDesc$d = Object.getOwnPropertyDescriptor;
|
|
18698
|
+
var __decorateClass$e = (decorators, target, key, kind) => {
|
|
18699
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$d(target, key) : target;
|
|
18680
18700
|
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
18681
|
-
if (kind && result) __defProp$
|
|
18701
|
+
if (kind && result) __defProp$9(target, key, result);
|
|
18682
18702
|
return result;
|
|
18683
18703
|
};
|
|
18684
18704
|
const CLUSTER_ID$1 = 8;
|
|
@@ -18782,15 +18802,15 @@ let LevelControlClusterCommands = class extends BaseClusterCommands {
|
|
|
18782
18802
|
});
|
|
18783
18803
|
}
|
|
18784
18804
|
};
|
|
18785
|
-
__decorateClass$
|
|
18786
|
-
__decorateClass$
|
|
18787
|
-
__decorateClass$
|
|
18788
|
-
LevelControlClusterCommands = __decorateClass$
|
|
18805
|
+
__decorateClass$e([r$2()], LevelControlClusterCommands.prototype, "_targetLevel", 2);
|
|
18806
|
+
__decorateClass$e([r$2()], LevelControlClusterCommands.prototype, "_transitionTime", 2);
|
|
18807
|
+
__decorateClass$e([r$2()], LevelControlClusterCommands.prototype, "_executeIfOff", 2);
|
|
18808
|
+
LevelControlClusterCommands = __decorateClass$e([t$1("level-control-cluster-commands")], LevelControlClusterCommands);
|
|
18789
18809
|
registerClusterCommands(CLUSTER_ID$1, "level-control-cluster-commands");
|
|
18790
18810
|
|
|
18791
|
-
var __getOwnPropDesc$
|
|
18792
|
-
var __decorateClass$
|
|
18793
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$
|
|
18811
|
+
var __getOwnPropDesc$c = Object.getOwnPropertyDescriptor;
|
|
18812
|
+
var __decorateClass$d = (decorators, target, key, kind) => {
|
|
18813
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$c(target, key) : target;
|
|
18794
18814
|
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (decorator(result)) || result;
|
|
18795
18815
|
return result;
|
|
18796
18816
|
};
|
|
@@ -18822,15 +18842,15 @@ let OnOffClusterCommands = class extends BaseClusterCommands {
|
|
|
18822
18842
|
await this.sendCommand("Toggle");
|
|
18823
18843
|
}
|
|
18824
18844
|
};
|
|
18825
|
-
OnOffClusterCommands = __decorateClass$
|
|
18845
|
+
OnOffClusterCommands = __decorateClass$d([t$1("on-off-cluster-commands")], OnOffClusterCommands);
|
|
18826
18846
|
registerClusterCommands(CLUSTER_ID, "on-off-cluster-commands");
|
|
18827
18847
|
|
|
18828
|
-
var __defProp$
|
|
18829
|
-
var __getOwnPropDesc$
|
|
18830
|
-
var __decorateClass$
|
|
18831
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$
|
|
18848
|
+
var __defProp$8 = Object.defineProperty;
|
|
18849
|
+
var __getOwnPropDesc$b = Object.getOwnPropertyDescriptor;
|
|
18850
|
+
var __decorateClass$c = (decorators, target, key, kind) => {
|
|
18851
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$b(target, key) : target;
|
|
18832
18852
|
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
18833
|
-
if (kind && result) __defProp$
|
|
18853
|
+
if (kind && result) __defProp$8(target, key, result);
|
|
18834
18854
|
return result;
|
|
18835
18855
|
};
|
|
18836
18856
|
const GLOBAL_ATTRIBUTE_MIN = 65520;
|
|
@@ -18863,9 +18883,11 @@ let MatterClusterView = class extends i$5 {
|
|
|
18863
18883
|
<button @click=${this._goBack}>Back</button>
|
|
18864
18884
|
`;
|
|
18865
18885
|
}
|
|
18886
|
+
const fabricIndex = getEffectiveFabricIndex(this.client.serverInfo.fabric_index, isTestNodeId(this.node.node_id));
|
|
18887
|
+
const nodeHex = formatNodeAddress(fabricIndex, this.node.node_id);
|
|
18866
18888
|
return b`
|
|
18867
18889
|
<dashboard-header
|
|
18868
|
-
.title=${`Node ${this.node.node_id} | Endpoint ${this.endpoint} | Cluster ${this.cluster}`}
|
|
18890
|
+
.title=${`Node ${this.node.node_id} ${nodeHex} | Endpoint ${this.endpoint} | Cluster ${this.cluster}`}
|
|
18869
18891
|
.backButton=${`#node/${this.node.node_id}/${this.endpoint}`}
|
|
18870
18892
|
.client=${this.client}
|
|
18871
18893
|
></dashboard-header>
|
|
@@ -18998,16 +19020,16 @@ MatterClusterView.styles = i$8`
|
|
|
18998
19020
|
background-color: rgba(128, 128, 128, 0.1);
|
|
18999
19021
|
}
|
|
19000
19022
|
`;
|
|
19001
|
-
__decorateClass$
|
|
19002
|
-
__decorateClass$
|
|
19023
|
+
__decorateClass$c([n$2()], MatterClusterView.prototype, "node", 2);
|
|
19024
|
+
__decorateClass$c([e$a({
|
|
19003
19025
|
context: bindingContext
|
|
19004
19026
|
}), n$2()], MatterClusterView.prototype, "endpoint", 2);
|
|
19005
|
-
__decorateClass$
|
|
19006
|
-
MatterClusterView = __decorateClass$
|
|
19027
|
+
__decorateClass$c([n$2()], MatterClusterView.prototype, "cluster", 2);
|
|
19028
|
+
MatterClusterView = __decorateClass$c([t$1("matter-cluster-view")], MatterClusterView);
|
|
19007
19029
|
|
|
19008
|
-
var __getOwnPropDesc$
|
|
19009
|
-
var __decorateClass$
|
|
19010
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$
|
|
19030
|
+
var __getOwnPropDesc$a = Object.getOwnPropertyDescriptor;
|
|
19031
|
+
var __decorateClass$b = (decorators, target, key, kind) => {
|
|
19032
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$a(target, key) : target;
|
|
19011
19033
|
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (decorator(result)) || result;
|
|
19012
19034
|
return result;
|
|
19013
19035
|
};
|
|
@@ -19036,7 +19058,7 @@ DashboardFooter.styles = i$8`
|
|
|
19036
19058
|
color: var(--md-sys-color-on-surface);
|
|
19037
19059
|
}
|
|
19038
19060
|
`;
|
|
19039
|
-
DashboardFooter = __decorateClass$
|
|
19061
|
+
DashboardFooter = __decorateClass$b([t$1("dashboard-footer")], DashboardFooter);
|
|
19040
19062
|
|
|
19041
19063
|
/**
|
|
19042
19064
|
* @license
|
|
@@ -19176,6 +19198,53 @@ function parseNeighborTable(node) {
|
|
|
19176
19198
|
};
|
|
19177
19199
|
});
|
|
19178
19200
|
}
|
|
19201
|
+
function parseRouteTable(node) {
|
|
19202
|
+
const routeTable = node.attributes["0/53/8"];
|
|
19203
|
+
if (!Array.isArray(routeTable)) {
|
|
19204
|
+
return [];
|
|
19205
|
+
}
|
|
19206
|
+
return routeTable.map(entry => {
|
|
19207
|
+
const rawExtAddr = entry["0"] ?? entry.extAddress;
|
|
19208
|
+
const extAddress = normalizeExtAddress(rawExtAddr);
|
|
19209
|
+
return {
|
|
19210
|
+
extAddress,
|
|
19211
|
+
// Field 1: rloc16
|
|
19212
|
+
rloc16: entry["1"] ?? entry.rloc16 ?? 0,
|
|
19213
|
+
// Field 2: routerId
|
|
19214
|
+
routerId: entry["2"] ?? entry.routerId ?? 0,
|
|
19215
|
+
// Field 3: nextHop
|
|
19216
|
+
nextHop: entry["3"] ?? entry.nextHop ?? 0,
|
|
19217
|
+
// Field 4: pathCost
|
|
19218
|
+
pathCost: entry["4"] ?? entry.pathCost ?? 0,
|
|
19219
|
+
// Field 5: lqiIn
|
|
19220
|
+
lqiIn: entry["5"] ?? entry.lqiIn ?? 0,
|
|
19221
|
+
// Field 6: lqiOut
|
|
19222
|
+
lqiOut: entry["6"] ?? entry.lqiOut ?? 0,
|
|
19223
|
+
// Field 7: age
|
|
19224
|
+
age: entry["7"] ?? entry.age ?? 0,
|
|
19225
|
+
// Field 8: allocated
|
|
19226
|
+
allocated: entry["8"] ?? entry.allocated ?? false,
|
|
19227
|
+
// Field 9: linkEstablished
|
|
19228
|
+
linkEstablished: entry["9"] ?? entry.linkEstablished ?? false
|
|
19229
|
+
};
|
|
19230
|
+
});
|
|
19231
|
+
}
|
|
19232
|
+
function findRouteByExtAddress(node, targetExtAddr) {
|
|
19233
|
+
const routes = parseRouteTable(node);
|
|
19234
|
+
return routes.find(route => route.extAddress === targetExtAddr && route.linkEstablished);
|
|
19235
|
+
}
|
|
19236
|
+
function getRoutableDestinationsCount(node) {
|
|
19237
|
+
const routes = parseRouteTable(node);
|
|
19238
|
+
return routes.filter(route => route.allocated && route.linkEstablished).length;
|
|
19239
|
+
}
|
|
19240
|
+
function getRouteBidirectionalLqi(route) {
|
|
19241
|
+
if (route.lqiIn > 0 && route.lqiOut > 0) {
|
|
19242
|
+
return Math.round((route.lqiIn + route.lqiOut) / 2);
|
|
19243
|
+
}
|
|
19244
|
+
if (route.lqiIn > 0) return route.lqiIn;
|
|
19245
|
+
if (route.lqiOut > 0) return route.lqiOut;
|
|
19246
|
+
return void 0;
|
|
19247
|
+
}
|
|
19179
19248
|
function buildExtAddrMap(nodes) {
|
|
19180
19249
|
const extAddrMap = /* @__PURE__ */new Map();
|
|
19181
19250
|
for (const node of Object.values(nodes)) {
|
|
@@ -19242,6 +19311,15 @@ function getSignalColor(neighbor) {
|
|
|
19242
19311
|
}
|
|
19243
19312
|
return SIGNAL_COLOR_WEAK;
|
|
19244
19313
|
}
|
|
19314
|
+
function getSignalColorFromLqi(lqi) {
|
|
19315
|
+
if (lqi > LQI_STRONG_THRESHOLD) {
|
|
19316
|
+
return SIGNAL_COLOR_STRONG;
|
|
19317
|
+
}
|
|
19318
|
+
if (lqi > LQI_MEDIUM_THRESHOLD) {
|
|
19319
|
+
return SIGNAL_COLOR_MEDIUM;
|
|
19320
|
+
}
|
|
19321
|
+
return SIGNAL_COLOR_WEAK;
|
|
19322
|
+
}
|
|
19245
19323
|
function getDeviceName(node) {
|
|
19246
19324
|
if (node.nodeLabel) {
|
|
19247
19325
|
return node.nodeLabel;
|
|
@@ -19373,12 +19451,43 @@ function buildThreadConnections(nodes, extAddrMap, unknownDevices) {
|
|
|
19373
19451
|
continue;
|
|
19374
19452
|
}
|
|
19375
19453
|
seenConnections.add(connectionKey);
|
|
19454
|
+
const routeEntry = findRouteByExtAddress(node, neighbor.extAddress);
|
|
19455
|
+
const bidirectionalLqi = routeEntry ? getRouteBidirectionalLqi(routeEntry) : void 0;
|
|
19376
19456
|
connections.push({
|
|
19377
19457
|
fromNodeId,
|
|
19378
19458
|
toNodeId,
|
|
19379
19459
|
signalColor: getSignalColor(neighbor),
|
|
19380
19460
|
lqi: neighbor.lqi,
|
|
19381
|
-
rssi: neighbor.avgRssi ?? neighbor.lastRssi
|
|
19461
|
+
rssi: neighbor.avgRssi ?? neighbor.lastRssi,
|
|
19462
|
+
pathCost: routeEntry === null || routeEntry === void 0 ? void 0 : routeEntry.pathCost,
|
|
19463
|
+
bidirectionalLqi
|
|
19464
|
+
});
|
|
19465
|
+
}
|
|
19466
|
+
const routes = parseRouteTable(node);
|
|
19467
|
+
for (const route of routes) {
|
|
19468
|
+
if (!route.linkEstablished || !route.allocated) continue;
|
|
19469
|
+
let toNodeId = extAddrMap.get(route.extAddress);
|
|
19470
|
+
if (toNodeId === void 0) {
|
|
19471
|
+
toNodeId = unknownExtAddrMap.get(route.extAddress);
|
|
19472
|
+
}
|
|
19473
|
+
if (toNodeId === void 0 || toNodeId === fromNodeId) continue;
|
|
19474
|
+
const connectionKey = `${fromNodeId}-${toNodeId}`;
|
|
19475
|
+
const reverseKey = `${toNodeId}-${fromNodeId}`;
|
|
19476
|
+
if (seenConnections.has(connectionKey) || seenConnections.has(reverseKey)) {
|
|
19477
|
+
continue;
|
|
19478
|
+
}
|
|
19479
|
+
seenConnections.add(connectionKey);
|
|
19480
|
+
const bidirectionalLqi = getRouteBidirectionalLqi(route);
|
|
19481
|
+
const signalColor = bidirectionalLqi !== void 0 ? getSignalColorFromLqi(bidirectionalLqi) : "var(--md-sys-color-outline, grey)";
|
|
19482
|
+
connections.push({
|
|
19483
|
+
fromNodeId,
|
|
19484
|
+
toNodeId,
|
|
19485
|
+
signalColor,
|
|
19486
|
+
lqi: bidirectionalLqi ?? 0,
|
|
19487
|
+
rssi: null,
|
|
19488
|
+
pathCost: route.pathCost,
|
|
19489
|
+
bidirectionalLqi,
|
|
19490
|
+
fromRouteTable: true
|
|
19382
19491
|
});
|
|
19383
19492
|
}
|
|
19384
19493
|
}
|
|
@@ -19397,6 +19506,8 @@ function getNodeConnections(nodeId, nodes, extAddrMap) {
|
|
|
19397
19506
|
const isUnknown = connectedNodeId === void 0;
|
|
19398
19507
|
const displayId = isUnknown ? `unknown_${neighbor.extAddress.toString(16).toUpperCase().padStart(16, "0")}` : connectedNodeId;
|
|
19399
19508
|
seenConnectedIds.add(displayId);
|
|
19509
|
+
const routeEntry = findRouteByExtAddress(node, neighbor.extAddress);
|
|
19510
|
+
const bidirectionalLqi = routeEntry ? getRouteBidirectionalLqi(routeEntry) : void 0;
|
|
19400
19511
|
connections.push({
|
|
19401
19512
|
connectedNodeId: displayId,
|
|
19402
19513
|
connectedNode,
|
|
@@ -19405,7 +19516,9 @@ function getNodeConnections(nodeId, nodes, extAddrMap) {
|
|
|
19405
19516
|
lqi: neighbor.lqi,
|
|
19406
19517
|
rssi: neighbor.avgRssi ?? neighbor.lastRssi,
|
|
19407
19518
|
isOutgoing: true,
|
|
19408
|
-
isUnknown
|
|
19519
|
+
isUnknown,
|
|
19520
|
+
pathCost: routeEntry === null || routeEntry === void 0 ? void 0 : routeEntry.pathCost,
|
|
19521
|
+
bidirectionalLqi
|
|
19409
19522
|
});
|
|
19410
19523
|
}
|
|
19411
19524
|
if (thisExtAddr !== void 0) {
|
|
@@ -19418,6 +19531,8 @@ function getNodeConnections(nodeId, nodes, extAddrMap) {
|
|
|
19418
19531
|
if (reverseEntry) {
|
|
19419
19532
|
const otherExtAddr = getThreadExtendedAddress(otherNode);
|
|
19420
19533
|
const extAddrHex = otherExtAddr ? otherExtAddr.toString(16).toUpperCase().padStart(16, "0") : "Unknown";
|
|
19534
|
+
const routeEntry = findRouteByExtAddress(otherNode, thisExtAddr);
|
|
19535
|
+
const bidirectionalLqi = routeEntry ? getRouteBidirectionalLqi(routeEntry) : void 0;
|
|
19421
19536
|
connections.push({
|
|
19422
19537
|
connectedNodeId: otherNodeId,
|
|
19423
19538
|
connectedNode: otherNode,
|
|
@@ -19426,7 +19541,9 @@ function getNodeConnections(nodeId, nodes, extAddrMap) {
|
|
|
19426
19541
|
lqi: reverseEntry.lqi,
|
|
19427
19542
|
rssi: reverseEntry.avgRssi ?? reverseEntry.lastRssi,
|
|
19428
19543
|
isOutgoing: false,
|
|
19429
|
-
isUnknown: false
|
|
19544
|
+
isUnknown: false,
|
|
19545
|
+
pathCost: routeEntry === null || routeEntry === void 0 ? void 0 : routeEntry.pathCost,
|
|
19546
|
+
bidirectionalLqi
|
|
19430
19547
|
});
|
|
19431
19548
|
}
|
|
19432
19549
|
}
|
|
@@ -19434,12 +19551,12 @@ function getNodeConnections(nodeId, nodes, extAddrMap) {
|
|
|
19434
19551
|
return connections;
|
|
19435
19552
|
}
|
|
19436
19553
|
|
|
19437
|
-
var __defProp$
|
|
19438
|
-
var __getOwnPropDesc$
|
|
19439
|
-
var __decorateClass$
|
|
19440
|
-
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$
|
|
19554
|
+
var __defProp$7 = Object.defineProperty;
|
|
19555
|
+
var __getOwnPropDesc$9 = Object.getOwnPropertyDescriptor;
|
|
19556
|
+
var __decorateClass$a = (decorators, target, key, kind) => {
|
|
19557
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$9(target, key) : target;
|
|
19441
19558
|
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
19442
|
-
if (kind && result) __defProp$
|
|
19559
|
+
if (kind && result) __defProp$7(target, key, result);
|
|
19443
19560
|
return result;
|
|
19444
19561
|
};
|
|
19445
19562
|
let DevicePanel = class extends i$5 {
|
|
@@ -19581,81 +19698,1357 @@ DevicePanel.styles = i$8`
|
|
|
19581
19698
|
display: none;
|
|
19582
19699
|
}
|
|
19583
19700
|
`;
|
|
19584
|
-
__decorateClass$
|
|
19585
|
-
__decorateClass$
|
|
19701
|
+
__decorateClass$a([n$2()], DevicePanel.prototype, "type", 2);
|
|
19702
|
+
__decorateClass$a([n$2({
|
|
19586
19703
|
type: Array
|
|
19587
19704
|
})], DevicePanel.prototype, "nodeIds", 2);
|
|
19588
|
-
__decorateClass$
|
|
19705
|
+
__decorateClass$a([n$2({
|
|
19589
19706
|
type: Object
|
|
19590
19707
|
})], DevicePanel.prototype, "nodes", 2);
|
|
19591
|
-
__decorateClass$
|
|
19708
|
+
__decorateClass$a([n$2({
|
|
19592
19709
|
type: Boolean
|
|
19593
19710
|
})], DevicePanel.prototype, "expanded", 2);
|
|
19594
|
-
__decorateClass$
|
|
19595
|
-
DevicePanel = __decorateClass$
|
|
19711
|
+
__decorateClass$a([r$2()], DevicePanel.prototype, "_isExpanded", 2);
|
|
19712
|
+
DevicePanel = __decorateClass$a([t$1("device-panel")], DevicePanel);
|
|
19596
19713
|
|
|
19597
|
-
|
|
19598
|
-
|
|
19599
|
-
|
|
19600
|
-
|
|
19601
|
-
|
|
19602
|
-
|
|
19603
|
-
|
|
19604
|
-
|
|
19605
|
-
|
|
19606
|
-
|
|
19607
|
-
|
|
19608
|
-
this.
|
|
19609
|
-
|
|
19610
|
-
|
|
19611
|
-
|
|
19714
|
+
/**
|
|
19715
|
+
* @license
|
|
19716
|
+
* Copyright 2023 Google LLC
|
|
19717
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
19718
|
+
*/
|
|
19719
|
+
/**
|
|
19720
|
+
* A validator that provides constraint validation that emulates
|
|
19721
|
+
* `<input type="checkbox">` validation.
|
|
19722
|
+
*/
|
|
19723
|
+
class CheckboxValidator extends Validator$2 {
|
|
19724
|
+
computeValidity(state) {
|
|
19725
|
+
if (!this.checkboxControl) {
|
|
19726
|
+
// Lazily create the platform input
|
|
19727
|
+
this.checkboxControl = document.createElement('input');
|
|
19728
|
+
this.checkboxControl.type = 'checkbox';
|
|
19729
|
+
}
|
|
19730
|
+
this.checkboxControl.checked = state.checked;
|
|
19731
|
+
this.checkboxControl.required = state.required;
|
|
19732
|
+
return {
|
|
19733
|
+
validity: this.checkboxControl.validity,
|
|
19734
|
+
validationMessage: this.checkboxControl.validationMessage
|
|
19735
|
+
};
|
|
19612
19736
|
}
|
|
19613
|
-
|
|
19614
|
-
|
|
19615
|
-
bubbles: true,
|
|
19616
|
-
composed: true
|
|
19617
|
-
}));
|
|
19737
|
+
equals(prev, next) {
|
|
19738
|
+
return prev.checked === next.checked && prev.required === next.required;
|
|
19618
19739
|
}
|
|
19619
|
-
|
|
19620
|
-
|
|
19621
|
-
|
|
19622
|
-
|
|
19623
|
-
|
|
19624
|
-
|
|
19625
|
-
|
|
19626
|
-
}
|
|
19740
|
+
copy({
|
|
19741
|
+
checked,
|
|
19742
|
+
required
|
|
19743
|
+
}) {
|
|
19744
|
+
return {
|
|
19745
|
+
checked,
|
|
19746
|
+
required
|
|
19747
|
+
};
|
|
19627
19748
|
}
|
|
19628
|
-
|
|
19629
|
-
|
|
19630
|
-
|
|
19631
|
-
|
|
19632
|
-
|
|
19749
|
+
}
|
|
19750
|
+
|
|
19751
|
+
/**
|
|
19752
|
+
* @license
|
|
19753
|
+
* Copyright 2019 Google LLC
|
|
19754
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
19755
|
+
*/
|
|
19756
|
+
// Separate variable needed for closure.
|
|
19757
|
+
const checkboxBaseClass = mixinDelegatesAria(mixinConstraintValidation(mixinFormAssociated(mixinElementInternals(i$5))));
|
|
19758
|
+
/**
|
|
19759
|
+
* A checkbox component.
|
|
19760
|
+
*
|
|
19761
|
+
*
|
|
19762
|
+
* @fires change {Event} The native `change` event on
|
|
19763
|
+
* [`<input>`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/change_event)
|
|
19764
|
+
* --bubbles
|
|
19765
|
+
* @fires input {InputEvent} The native `input` event on
|
|
19766
|
+
* [`<input>`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event)
|
|
19767
|
+
* --bubbles --composed
|
|
19768
|
+
*/
|
|
19769
|
+
class Checkbox extends checkboxBaseClass {
|
|
19770
|
+
constructor() {
|
|
19771
|
+
super();
|
|
19772
|
+
/**
|
|
19773
|
+
* Whether or not the checkbox is selected.
|
|
19774
|
+
*/
|
|
19775
|
+
this.checked = false;
|
|
19776
|
+
/**
|
|
19777
|
+
* Whether or not the checkbox is indeterminate.
|
|
19778
|
+
*
|
|
19779
|
+
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#indeterminate_state_checkboxes
|
|
19780
|
+
*/
|
|
19781
|
+
this.indeterminate = false;
|
|
19782
|
+
/**
|
|
19783
|
+
* When true, require the checkbox to be selected when participating in
|
|
19784
|
+
* form submission.
|
|
19785
|
+
*
|
|
19786
|
+
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#validation
|
|
19787
|
+
*/
|
|
19788
|
+
this.required = false;
|
|
19789
|
+
/**
|
|
19790
|
+
* The value of the checkbox that is submitted with a form when selected.
|
|
19791
|
+
*
|
|
19792
|
+
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#value
|
|
19793
|
+
*/
|
|
19794
|
+
this.value = 'on';
|
|
19795
|
+
this.prevChecked = false;
|
|
19796
|
+
this.prevDisabled = false;
|
|
19797
|
+
this.prevIndeterminate = false;
|
|
19798
|
+
{
|
|
19799
|
+
this.addEventListener('click', event => {
|
|
19800
|
+
if (!isActivationClick(event) || !this.input) {
|
|
19801
|
+
return;
|
|
19802
|
+
}
|
|
19803
|
+
this.focus();
|
|
19804
|
+
dispatchActivationClick(this.input);
|
|
19805
|
+
});
|
|
19633
19806
|
}
|
|
19634
19807
|
}
|
|
19635
|
-
|
|
19636
|
-
if (
|
|
19637
|
-
|
|
19638
|
-
|
|
19808
|
+
update(changed) {
|
|
19809
|
+
if (changed.has('checked') || changed.has('disabled') || changed.has('indeterminate')) {
|
|
19810
|
+
this.prevChecked = changed.get('checked') ?? this.checked;
|
|
19811
|
+
this.prevDisabled = changed.get('disabled') ?? this.disabled;
|
|
19812
|
+
this.prevIndeterminate = changed.get('indeterminate') ?? this.indeterminate;
|
|
19639
19813
|
}
|
|
19640
|
-
|
|
19814
|
+
super.update(changed);
|
|
19641
19815
|
}
|
|
19642
|
-
|
|
19643
|
-
const
|
|
19644
|
-
|
|
19645
|
-
|
|
19646
|
-
|
|
19816
|
+
render() {
|
|
19817
|
+
const prevNone = !this.prevChecked && !this.prevIndeterminate;
|
|
19818
|
+
const prevChecked = this.prevChecked && !this.prevIndeterminate;
|
|
19819
|
+
const prevIndeterminate = this.prevIndeterminate;
|
|
19820
|
+
const isChecked = this.checked && !this.indeterminate;
|
|
19821
|
+
const isIndeterminate = this.indeterminate;
|
|
19822
|
+
const containerClasses = e$2({
|
|
19823
|
+
'disabled': this.disabled,
|
|
19824
|
+
'selected': isChecked || isIndeterminate,
|
|
19825
|
+
'unselected': !isChecked && !isIndeterminate,
|
|
19826
|
+
'checked': isChecked,
|
|
19827
|
+
'indeterminate': isIndeterminate,
|
|
19828
|
+
'prev-unselected': prevNone,
|
|
19829
|
+
'prev-checked': prevChecked,
|
|
19830
|
+
'prev-indeterminate': prevIndeterminate,
|
|
19831
|
+
'prev-disabled': this.prevDisabled
|
|
19832
|
+
});
|
|
19833
|
+
// Needed for closure conformance
|
|
19834
|
+
const {
|
|
19835
|
+
ariaLabel,
|
|
19836
|
+
ariaInvalid
|
|
19837
|
+
} = this;
|
|
19838
|
+
// Note: <input> needs to be rendered before the <svg> for
|
|
19839
|
+
// form.reportValidity() to work in Chrome.
|
|
19840
|
+
return b`
|
|
19841
|
+
<div class="container ${containerClasses}">
|
|
19842
|
+
<input
|
|
19843
|
+
type="checkbox"
|
|
19844
|
+
id="input"
|
|
19845
|
+
aria-checked=${isIndeterminate ? 'mixed' : A}
|
|
19846
|
+
aria-label=${ariaLabel || A}
|
|
19847
|
+
aria-invalid=${ariaInvalid || A}
|
|
19848
|
+
?disabled=${this.disabled}
|
|
19849
|
+
?required=${this.required}
|
|
19850
|
+
.indeterminate=${this.indeterminate}
|
|
19851
|
+
.checked=${this.checked}
|
|
19852
|
+
@input=${this.handleInput}
|
|
19853
|
+
@change=${this.handleChange} />
|
|
19854
|
+
|
|
19855
|
+
<div class="outline"></div>
|
|
19856
|
+
<div class="background"></div>
|
|
19857
|
+
<md-focus-ring part="focus-ring" for="input"></md-focus-ring>
|
|
19858
|
+
<md-ripple for="input" ?disabled=${this.disabled}></md-ripple>
|
|
19859
|
+
<svg class="icon" viewBox="0 0 18 18" aria-hidden="true">
|
|
19860
|
+
<rect class="mark short" />
|
|
19861
|
+
<rect class="mark long" />
|
|
19862
|
+
</svg>
|
|
19863
|
+
</div>
|
|
19864
|
+
`;
|
|
19647
19865
|
}
|
|
19648
|
-
|
|
19649
|
-
|
|
19650
|
-
|
|
19651
|
-
|
|
19866
|
+
handleInput(event) {
|
|
19867
|
+
const target = event.target;
|
|
19868
|
+
this.checked = target.checked;
|
|
19869
|
+
this.indeterminate = target.indeterminate;
|
|
19870
|
+
// <input> 'input' event bubbles and is composed, don't re-dispatch it.
|
|
19652
19871
|
}
|
|
19653
|
-
|
|
19654
|
-
|
|
19655
|
-
|
|
19656
|
-
|
|
19872
|
+
handleChange(event) {
|
|
19873
|
+
// <input> 'change' event is not composed, re-dispatch it.
|
|
19874
|
+
redispatchEvent(this, event);
|
|
19875
|
+
}
|
|
19876
|
+
[getFormValue]() {
|
|
19877
|
+
if (!this.checked || this.indeterminate) {
|
|
19878
|
+
return null;
|
|
19657
19879
|
}
|
|
19658
|
-
|
|
19880
|
+
return this.value;
|
|
19881
|
+
}
|
|
19882
|
+
[getFormState]() {
|
|
19883
|
+
return String(this.checked);
|
|
19884
|
+
}
|
|
19885
|
+
formResetCallback() {
|
|
19886
|
+
// The checked property does not reflect, so the original attribute set by
|
|
19887
|
+
// the user is used to determine the default value.
|
|
19888
|
+
this.checked = this.hasAttribute('checked');
|
|
19889
|
+
}
|
|
19890
|
+
formStateRestoreCallback(state) {
|
|
19891
|
+
this.checked = state === 'true';
|
|
19892
|
+
}
|
|
19893
|
+
[createValidator]() {
|
|
19894
|
+
return new CheckboxValidator(() => this);
|
|
19895
|
+
}
|
|
19896
|
+
[getValidityAnchor]() {
|
|
19897
|
+
return this.input;
|
|
19898
|
+
}
|
|
19899
|
+
}
|
|
19900
|
+
/** @nocollapse */
|
|
19901
|
+
Checkbox.shadowRootOptions = {
|
|
19902
|
+
...i$5.shadowRootOptions,
|
|
19903
|
+
delegatesFocus: true
|
|
19904
|
+
};
|
|
19905
|
+
__decorate([n$2({
|
|
19906
|
+
type: Boolean
|
|
19907
|
+
})], Checkbox.prototype, "checked", void 0);
|
|
19908
|
+
__decorate([n$2({
|
|
19909
|
+
type: Boolean
|
|
19910
|
+
})], Checkbox.prototype, "indeterminate", void 0);
|
|
19911
|
+
__decorate([n$2({
|
|
19912
|
+
type: Boolean
|
|
19913
|
+
})], Checkbox.prototype, "required", void 0);
|
|
19914
|
+
__decorate([n$2()], Checkbox.prototype, "value", void 0);
|
|
19915
|
+
__decorate([r$2()], Checkbox.prototype, "prevChecked", void 0);
|
|
19916
|
+
__decorate([r$2()], Checkbox.prototype, "prevDisabled", void 0);
|
|
19917
|
+
__decorate([r$2()], Checkbox.prototype, "prevIndeterminate", void 0);
|
|
19918
|
+
__decorate([e$5('input')], Checkbox.prototype, "input", void 0);
|
|
19919
|
+
|
|
19920
|
+
/**
|
|
19921
|
+
* @license
|
|
19922
|
+
* Copyright 2024 Google LLC
|
|
19923
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
19924
|
+
*/
|
|
19925
|
+
// Generated stylesheet for ./checkbox/internal/checkbox-styles.css.
|
|
19926
|
+
const styles$1 = i$8`:host{border-start-start-radius:var(--md-checkbox-container-shape-start-start, var(--md-checkbox-container-shape, 2px));border-start-end-radius:var(--md-checkbox-container-shape-start-end, var(--md-checkbox-container-shape, 2px));border-end-end-radius:var(--md-checkbox-container-shape-end-end, var(--md-checkbox-container-shape, 2px));border-end-start-radius:var(--md-checkbox-container-shape-end-start, var(--md-checkbox-container-shape, 2px));display:inline-flex;height:var(--md-checkbox-container-size, 18px);position:relative;vertical-align:top;width:var(--md-checkbox-container-size, 18px);-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer}:host([disabled]){cursor:default}:host([touch-target=wrapper]){margin:max(0px,(48px - var(--md-checkbox-container-size, 18px))/2)}md-focus-ring{height:44px;inset:unset;width:44px}input{appearance:none;height:48px;margin:0;opacity:0;outline:none;position:absolute;width:48px;z-index:1;cursor:inherit}:host([touch-target=none]) input{height:100%;width:100%}.container{border-radius:inherit;display:flex;height:100%;place-content:center;place-items:center;position:relative;width:100%}.outline,.background,.icon{inset:0;position:absolute}.outline,.background{border-radius:inherit}.outline{border-color:var(--md-checkbox-outline-color, var(--md-sys-color-on-surface-variant, #49454f));border-style:solid;border-width:var(--md-checkbox-outline-width, 2px);box-sizing:border-box}.background{background-color:var(--md-checkbox-selected-container-color, var(--md-sys-color-primary, #6750a4))}.background,.icon{opacity:0;transition-duration:150ms,50ms;transition-property:transform,opacity;transition-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15),linear;transform:scale(0.6)}:where(.selected) :is(.background,.icon){opacity:1;transition-duration:350ms,50ms;transition-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1),linear;transform:scale(1)}md-ripple{border-radius:var(--md-checkbox-state-layer-shape, var(--md-sys-shape-corner-full, 9999px));height:var(--md-checkbox-state-layer-size, 40px);inset:unset;width:var(--md-checkbox-state-layer-size, 40px);--md-ripple-hover-color: var(--md-checkbox-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-hover-opacity: var(--md-checkbox-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-checkbox-pressed-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-pressed-opacity: var(--md-checkbox-pressed-state-layer-opacity, 0.12)}.selected md-ripple{--md-ripple-hover-color: var(--md-checkbox-selected-hover-state-layer-color, var(--md-sys-color-primary, #6750a4));--md-ripple-hover-opacity: var(--md-checkbox-selected-hover-state-layer-opacity, 0.08);--md-ripple-pressed-color: var(--md-checkbox-selected-pressed-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--md-ripple-pressed-opacity: var(--md-checkbox-selected-pressed-state-layer-opacity, 0.12)}.icon{fill:var(--md-checkbox-selected-icon-color, var(--md-sys-color-on-primary, #fff));height:var(--md-checkbox-icon-size, 18px);width:var(--md-checkbox-icon-size, 18px)}.mark.short{height:2px;transition-property:transform,height;width:2px}.mark.long{height:2px;transition-property:transform,width;width:10px}.mark{animation-duration:150ms;animation-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15);transition-duration:150ms;transition-timing-function:cubic-bezier(0.3, 0, 0.8, 0.15)}.selected .mark{animation-duration:350ms;animation-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1);transition-duration:350ms;transition-timing-function:cubic-bezier(0.05, 0.7, 0.1, 1)}.checked .mark,.prev-checked.unselected .mark{transform:scaleY(-1) translate(7px, -14px) rotate(45deg)}.checked .mark.short,.prev-checked.unselected .mark.short{height:5.6568542495px}.checked .mark.long,.prev-checked.unselected .mark.long{width:11.313708499px}.indeterminate .mark,.prev-indeterminate.unselected .mark{transform:scaleY(-1) translate(4px, -10px) rotate(0deg)}.prev-unselected .mark{transition-property:none}.prev-unselected.checked .mark.long{animation-name:prev-unselected-to-checked}@keyframes prev-unselected-to-checked{from{width:0}}:where(:hover) .outline{border-color:var(--md-checkbox-hover-outline-color, var(--md-sys-color-on-surface, #1d1b20));border-width:var(--md-checkbox-hover-outline-width, 2px)}:where(:hover) .background{background:var(--md-checkbox-selected-hover-container-color, var(--md-sys-color-primary, #6750a4))}:where(:hover) .icon{fill:var(--md-checkbox-selected-hover-icon-color, var(--md-sys-color-on-primary, #fff))}:where(:focus-within) .outline{border-color:var(--md-checkbox-focus-outline-color, var(--md-sys-color-on-surface, #1d1b20));border-width:var(--md-checkbox-focus-outline-width, 2px)}:where(:focus-within) .background{background:var(--md-checkbox-selected-focus-container-color, var(--md-sys-color-primary, #6750a4))}:where(:focus-within) .icon{fill:var(--md-checkbox-selected-focus-icon-color, var(--md-sys-color-on-primary, #fff))}:where(:active) .outline{border-color:var(--md-checkbox-pressed-outline-color, var(--md-sys-color-on-surface, #1d1b20));border-width:var(--md-checkbox-pressed-outline-width, 2px)}:where(:active) .background{background:var(--md-checkbox-selected-pressed-container-color, var(--md-sys-color-primary, #6750a4))}:where(:active) .icon{fill:var(--md-checkbox-selected-pressed-icon-color, var(--md-sys-color-on-primary, #fff))}:where(.disabled,.prev-disabled) :is(.background,.icon,.mark){animation-duration:0s;transition-duration:0s}:where(.disabled) .outline{border-color:var(--md-checkbox-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));border-width:var(--md-checkbox-disabled-outline-width, 2px);opacity:var(--md-checkbox-disabled-container-opacity, 0.38)}:where(.selected.disabled) .outline{visibility:hidden}:where(.selected.disabled) .background{background:var(--md-checkbox-selected-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));opacity:var(--md-checkbox-selected-disabled-container-opacity, 0.38)}:where(.disabled) .icon{fill:var(--md-checkbox-selected-disabled-icon-color, var(--md-sys-color-surface, #fef7ff))}@media(forced-colors: active){.background{background-color:CanvasText}.selected.disabled .background{background-color:GrayText;opacity:1}.outline{border-color:CanvasText}.disabled .outline{border-color:GrayText;opacity:1}.icon{fill:Canvas}}
|
|
19927
|
+
`;
|
|
19928
|
+
|
|
19929
|
+
/**
|
|
19930
|
+
* @license
|
|
19931
|
+
* Copyright 2018 Google LLC
|
|
19932
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
19933
|
+
*/
|
|
19934
|
+
/**
|
|
19935
|
+
* @summary Checkboxes allow users to select one or more items from a set.
|
|
19936
|
+
* Checkboxes can turn an option on or off.
|
|
19937
|
+
*
|
|
19938
|
+
* @description
|
|
19939
|
+
* Use checkboxes to:
|
|
19940
|
+
* - Select one or more options from a list
|
|
19941
|
+
* - Present a list containing sub-selections
|
|
19942
|
+
* - Turn an item on or off in a desktop environment
|
|
19943
|
+
*
|
|
19944
|
+
* @final
|
|
19945
|
+
* @suppress {visibility}
|
|
19946
|
+
*/
|
|
19947
|
+
let MdCheckbox = class MdCheckbox extends Checkbox {};
|
|
19948
|
+
MdCheckbox.styles = [styles$1];
|
|
19949
|
+
MdCheckbox = __decorate([t$1('md-checkbox')], MdCheckbox);
|
|
19950
|
+
|
|
19951
|
+
/**
|
|
19952
|
+
* @license
|
|
19953
|
+
* Copyright 2023 Google LLC
|
|
19954
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
19955
|
+
*/
|
|
19956
|
+
/**
|
|
19957
|
+
* The default dialog open animation.
|
|
19958
|
+
*/
|
|
19959
|
+
const DIALOG_DEFAULT_OPEN_ANIMATION = {
|
|
19960
|
+
dialog: [[
|
|
19961
|
+
// Dialog slide down
|
|
19962
|
+
[{
|
|
19963
|
+
'transform': 'translateY(-50px)'
|
|
19964
|
+
}, {
|
|
19965
|
+
'transform': 'translateY(0)'
|
|
19966
|
+
}], {
|
|
19967
|
+
duration: 500,
|
|
19968
|
+
easing: EASING.EMPHASIZED
|
|
19969
|
+
}]],
|
|
19970
|
+
scrim: [[
|
|
19971
|
+
// Scrim fade in
|
|
19972
|
+
[{
|
|
19973
|
+
'opacity': 0
|
|
19974
|
+
}, {
|
|
19975
|
+
'opacity': 0.32
|
|
19976
|
+
}], {
|
|
19977
|
+
duration: 500,
|
|
19978
|
+
easing: 'linear'
|
|
19979
|
+
}]],
|
|
19980
|
+
container: [[
|
|
19981
|
+
// Container fade in
|
|
19982
|
+
[{
|
|
19983
|
+
'opacity': 0
|
|
19984
|
+
}, {
|
|
19985
|
+
'opacity': 1
|
|
19986
|
+
}], {
|
|
19987
|
+
duration: 50,
|
|
19988
|
+
easing: 'linear',
|
|
19989
|
+
pseudoElement: '::before'
|
|
19990
|
+
}], [
|
|
19991
|
+
// Container grow
|
|
19992
|
+
// Note: current spec says to grow from 0dp->100% and shrink from
|
|
19993
|
+
// 100%->35%. We change this to 35%->100% to simplify the animation that
|
|
19994
|
+
// is supposed to clip content as it grows. From 0dp it's possible to see
|
|
19995
|
+
// text/actions appear before the container has fully grown.
|
|
19996
|
+
[{
|
|
19997
|
+
'height': '35%'
|
|
19998
|
+
}, {
|
|
19999
|
+
'height': '100%'
|
|
20000
|
+
}], {
|
|
20001
|
+
duration: 500,
|
|
20002
|
+
easing: EASING.EMPHASIZED,
|
|
20003
|
+
pseudoElement: '::before'
|
|
20004
|
+
}]],
|
|
20005
|
+
headline: [[
|
|
20006
|
+
// Headline fade in
|
|
20007
|
+
[{
|
|
20008
|
+
'opacity': 0
|
|
20009
|
+
}, {
|
|
20010
|
+
'opacity': 0,
|
|
20011
|
+
offset: 0.2
|
|
20012
|
+
}, {
|
|
20013
|
+
'opacity': 1
|
|
20014
|
+
}], {
|
|
20015
|
+
duration: 250,
|
|
20016
|
+
easing: 'linear',
|
|
20017
|
+
fill: 'forwards'
|
|
20018
|
+
}]],
|
|
20019
|
+
content: [[
|
|
20020
|
+
// Content fade in
|
|
20021
|
+
[{
|
|
20022
|
+
'opacity': 0
|
|
20023
|
+
}, {
|
|
20024
|
+
'opacity': 0,
|
|
20025
|
+
offset: 0.2
|
|
20026
|
+
}, {
|
|
20027
|
+
'opacity': 1
|
|
20028
|
+
}], {
|
|
20029
|
+
duration: 250,
|
|
20030
|
+
easing: 'linear',
|
|
20031
|
+
fill: 'forwards'
|
|
20032
|
+
}]],
|
|
20033
|
+
actions: [[
|
|
20034
|
+
// Actions fade in
|
|
20035
|
+
[{
|
|
20036
|
+
'opacity': 0
|
|
20037
|
+
}, {
|
|
20038
|
+
'opacity': 0,
|
|
20039
|
+
offset: 0.5
|
|
20040
|
+
}, {
|
|
20041
|
+
'opacity': 1
|
|
20042
|
+
}], {
|
|
20043
|
+
duration: 300,
|
|
20044
|
+
easing: 'linear',
|
|
20045
|
+
fill: 'forwards'
|
|
20046
|
+
}]]
|
|
20047
|
+
};
|
|
20048
|
+
/**
|
|
20049
|
+
* The default dialog close animation.
|
|
20050
|
+
*/
|
|
20051
|
+
const DIALOG_DEFAULT_CLOSE_ANIMATION = {
|
|
20052
|
+
dialog: [[
|
|
20053
|
+
// Dialog slide up
|
|
20054
|
+
[{
|
|
20055
|
+
'transform': 'translateY(0)'
|
|
20056
|
+
}, {
|
|
20057
|
+
'transform': 'translateY(-50px)'
|
|
20058
|
+
}], {
|
|
20059
|
+
duration: 150,
|
|
20060
|
+
easing: EASING.EMPHASIZED_ACCELERATE
|
|
20061
|
+
}]],
|
|
20062
|
+
scrim: [[
|
|
20063
|
+
// Scrim fade out
|
|
20064
|
+
[{
|
|
20065
|
+
'opacity': 0.32
|
|
20066
|
+
}, {
|
|
20067
|
+
'opacity': 0
|
|
20068
|
+
}], {
|
|
20069
|
+
duration: 150,
|
|
20070
|
+
easing: 'linear'
|
|
20071
|
+
}]],
|
|
20072
|
+
container: [[
|
|
20073
|
+
// Container shrink
|
|
20074
|
+
[{
|
|
20075
|
+
'height': '100%'
|
|
20076
|
+
}, {
|
|
20077
|
+
'height': '35%'
|
|
20078
|
+
}], {
|
|
20079
|
+
duration: 150,
|
|
20080
|
+
easing: EASING.EMPHASIZED_ACCELERATE,
|
|
20081
|
+
pseudoElement: '::before'
|
|
20082
|
+
}], [
|
|
20083
|
+
// Container fade out
|
|
20084
|
+
[{
|
|
20085
|
+
'opacity': '1'
|
|
20086
|
+
}, {
|
|
20087
|
+
'opacity': '0'
|
|
20088
|
+
}], {
|
|
20089
|
+
delay: 100,
|
|
20090
|
+
duration: 50,
|
|
20091
|
+
easing: 'linear',
|
|
20092
|
+
pseudoElement: '::before'
|
|
20093
|
+
}]],
|
|
20094
|
+
headline: [[
|
|
20095
|
+
// Headline fade out
|
|
20096
|
+
[{
|
|
20097
|
+
'opacity': 1
|
|
20098
|
+
}, {
|
|
20099
|
+
'opacity': 0
|
|
20100
|
+
}], {
|
|
20101
|
+
duration: 100,
|
|
20102
|
+
easing: 'linear',
|
|
20103
|
+
fill: 'forwards'
|
|
20104
|
+
}]],
|
|
20105
|
+
content: [[
|
|
20106
|
+
// Content fade out
|
|
20107
|
+
[{
|
|
20108
|
+
'opacity': 1
|
|
20109
|
+
}, {
|
|
20110
|
+
'opacity': 0
|
|
20111
|
+
}], {
|
|
20112
|
+
duration: 100,
|
|
20113
|
+
easing: 'linear',
|
|
20114
|
+
fill: 'forwards'
|
|
20115
|
+
}]],
|
|
20116
|
+
actions: [[
|
|
20117
|
+
// Actions fade out
|
|
20118
|
+
[{
|
|
20119
|
+
'opacity': 1
|
|
20120
|
+
}, {
|
|
20121
|
+
'opacity': 0
|
|
20122
|
+
}], {
|
|
20123
|
+
duration: 100,
|
|
20124
|
+
easing: 'linear',
|
|
20125
|
+
fill: 'forwards'
|
|
20126
|
+
}]]
|
|
20127
|
+
};
|
|
20128
|
+
|
|
20129
|
+
/**
|
|
20130
|
+
* @license
|
|
20131
|
+
* Copyright 2023 Google LLC
|
|
20132
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
20133
|
+
*/
|
|
20134
|
+
// Separate variable needed for closure.
|
|
20135
|
+
const dialogBaseClass = mixinDelegatesAria(i$5);
|
|
20136
|
+
/**
|
|
20137
|
+
* A dialog component.
|
|
20138
|
+
*
|
|
20139
|
+
* @fires open {Event} Dispatched when the dialog is opening before any animations.
|
|
20140
|
+
* @fires opened {Event} Dispatched when the dialog has opened after any animations.
|
|
20141
|
+
* @fires close {Event} Dispatched when the dialog is closing before any animations.
|
|
20142
|
+
* @fires closed {Event} Dispatched when the dialog has closed after any animations.
|
|
20143
|
+
* @fires cancel {Event} Dispatched when the dialog has been canceled by clicking
|
|
20144
|
+
* on the scrim or pressing Escape.
|
|
20145
|
+
*/
|
|
20146
|
+
class Dialog extends dialogBaseClass {
|
|
20147
|
+
// We do not use `delegatesFocus: true` due to a Chromium bug with
|
|
20148
|
+
// selecting text.
|
|
20149
|
+
// See https://bugs.chromium.org/p/chromium/issues/detail?id=950357
|
|
20150
|
+
/**
|
|
20151
|
+
* Opens the dialog when set to `true` and closes it when set to `false`.
|
|
20152
|
+
*/
|
|
20153
|
+
get open() {
|
|
20154
|
+
return this.isOpen;
|
|
20155
|
+
}
|
|
20156
|
+
set open(open) {
|
|
20157
|
+
if (open === this.isOpen) {
|
|
20158
|
+
return;
|
|
20159
|
+
}
|
|
20160
|
+
this.isOpen = open;
|
|
20161
|
+
if (open) {
|
|
20162
|
+
this.setAttribute('open', '');
|
|
20163
|
+
this.show();
|
|
20164
|
+
} else {
|
|
20165
|
+
this.removeAttribute('open');
|
|
20166
|
+
this.close();
|
|
20167
|
+
}
|
|
20168
|
+
}
|
|
20169
|
+
constructor() {
|
|
20170
|
+
super();
|
|
20171
|
+
/**
|
|
20172
|
+
* Skips the opening and closing animations.
|
|
20173
|
+
*/
|
|
20174
|
+
this.quick = false;
|
|
20175
|
+
/**
|
|
20176
|
+
* Gets or sets the dialog's return value, usually to indicate which button
|
|
20177
|
+
* a user pressed to close it.
|
|
20178
|
+
*
|
|
20179
|
+
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/returnValue
|
|
20180
|
+
*/
|
|
20181
|
+
this.returnValue = '';
|
|
20182
|
+
/**
|
|
20183
|
+
* Disables focus trapping, which by default keeps keyboard Tab navigation
|
|
20184
|
+
* within the dialog.
|
|
20185
|
+
*
|
|
20186
|
+
* When disabled, after focusing the last element of a dialog, pressing Tab
|
|
20187
|
+
* again will release focus from the window back to the browser (such as the
|
|
20188
|
+
* URL bar).
|
|
20189
|
+
*
|
|
20190
|
+
* Focus trapping is recommended for accessibility, and should not typically
|
|
20191
|
+
* be disabled. Only turn this off if the use case of a dialog is more
|
|
20192
|
+
* accessible without focus trapping.
|
|
20193
|
+
*/
|
|
20194
|
+
this.noFocusTrap = false;
|
|
20195
|
+
/**
|
|
20196
|
+
* Gets the opening animation for a dialog. Set to a new function to customize
|
|
20197
|
+
* the animation.
|
|
20198
|
+
*/
|
|
20199
|
+
this.getOpenAnimation = () => DIALOG_DEFAULT_OPEN_ANIMATION;
|
|
20200
|
+
/**
|
|
20201
|
+
* Gets the closing animation for a dialog. Set to a new function to customize
|
|
20202
|
+
* the animation.
|
|
20203
|
+
*/
|
|
20204
|
+
this.getCloseAnimation = () => DIALOG_DEFAULT_CLOSE_ANIMATION;
|
|
20205
|
+
this.isOpen = false;
|
|
20206
|
+
this.isOpening = false;
|
|
20207
|
+
this.isConnectedPromise = this.getIsConnectedPromise();
|
|
20208
|
+
this.isAtScrollTop = false;
|
|
20209
|
+
this.isAtScrollBottom = false;
|
|
20210
|
+
this.nextClickIsFromContent = false;
|
|
20211
|
+
// Dialogs should not be SSR'd while open, so we can just use runtime checks.
|
|
20212
|
+
this.hasHeadline = false;
|
|
20213
|
+
this.hasActions = false;
|
|
20214
|
+
this.hasIcon = false;
|
|
20215
|
+
// See https://bugs.chromium.org/p/chromium/issues/detail?id=1512224
|
|
20216
|
+
// Chrome v120 has a bug where escape keys do not trigger cancels. If we get
|
|
20217
|
+
// a dialog "close" event that is triggered without a "cancel" after an escape
|
|
20218
|
+
// keydown, then we need to manually trigger our closing logic.
|
|
20219
|
+
//
|
|
20220
|
+
// This bug occurs when pressing escape to close a dialog without first
|
|
20221
|
+
// interacting with the dialog's content.
|
|
20222
|
+
//
|
|
20223
|
+
// Cleanup tracking:
|
|
20224
|
+
// https://github.com/material-components/material-web/issues/5330
|
|
20225
|
+
// This can be removed when full CloseWatcher support added and the above bug
|
|
20226
|
+
// in Chromium is fixed to fire 'cancel' with one escape press and close with
|
|
20227
|
+
// multiple.
|
|
20228
|
+
this.escapePressedWithoutCancel = false;
|
|
20229
|
+
// This TreeWalker is used to walk through a dialog's children to find
|
|
20230
|
+
// focusable elements. TreeWalker is faster than `querySelectorAll('*')`.
|
|
20231
|
+
// We check for isServer because there isn't a "document" during an SSR
|
|
20232
|
+
// run.
|
|
20233
|
+
this.treewalker = document.createTreeWalker(this, NodeFilter.SHOW_ELEMENT);
|
|
20234
|
+
{
|
|
20235
|
+
this.addEventListener('submit', this.handleSubmit);
|
|
20236
|
+
}
|
|
20237
|
+
}
|
|
20238
|
+
/**
|
|
20239
|
+
* Opens the dialog and fires a cancelable `open` event. After a dialog's
|
|
20240
|
+
* animation, an `opened` event is fired.
|
|
20241
|
+
*
|
|
20242
|
+
* Add an `autofocus` attribute to a child of the dialog that should
|
|
20243
|
+
* receive focus after opening.
|
|
20244
|
+
*
|
|
20245
|
+
* @return A Promise that resolves after the animation is finished and the
|
|
20246
|
+
* `opened` event was fired.
|
|
20247
|
+
*/
|
|
20248
|
+
async show() {
|
|
20249
|
+
var _this$querySelector;
|
|
20250
|
+
this.isOpening = true;
|
|
20251
|
+
// Dialogs can be opened before being attached to the DOM, so we need to
|
|
20252
|
+
// wait until we're connected before calling `showModal()`.
|
|
20253
|
+
await this.isConnectedPromise;
|
|
20254
|
+
await this.updateComplete;
|
|
20255
|
+
const dialog = this.dialog;
|
|
20256
|
+
// Check if already opened or if `dialog.close()` was called while awaiting.
|
|
20257
|
+
if (dialog.open || !this.isOpening) {
|
|
20258
|
+
this.isOpening = false;
|
|
20259
|
+
return;
|
|
20260
|
+
}
|
|
20261
|
+
const preventOpen = !this.dispatchEvent(new Event('open', {
|
|
20262
|
+
cancelable: true
|
|
20263
|
+
}));
|
|
20264
|
+
if (preventOpen) {
|
|
20265
|
+
this.open = false;
|
|
20266
|
+
this.isOpening = false;
|
|
20267
|
+
return;
|
|
20268
|
+
}
|
|
20269
|
+
// All Material dialogs are modal.
|
|
20270
|
+
dialog.showModal();
|
|
20271
|
+
this.open = true;
|
|
20272
|
+
// Reset scroll position if re-opening a dialog with the same content.
|
|
20273
|
+
if (this.scroller) {
|
|
20274
|
+
this.scroller.scrollTop = 0;
|
|
20275
|
+
}
|
|
20276
|
+
// Native modal dialogs ignore autofocus and instead force focus to the
|
|
20277
|
+
// first focusable child. Override this behavior if there is a child with
|
|
20278
|
+
// an autofocus attribute.
|
|
20279
|
+
(_this$querySelector = this.querySelector('[autofocus]')) === null || _this$querySelector === void 0 || _this$querySelector.focus();
|
|
20280
|
+
await this.animateDialog(this.getOpenAnimation());
|
|
20281
|
+
this.dispatchEvent(new Event('opened'));
|
|
20282
|
+
this.isOpening = false;
|
|
20283
|
+
}
|
|
20284
|
+
/**
|
|
20285
|
+
* Closes the dialog and fires a cancelable `close` event. After a dialog's
|
|
20286
|
+
* animation, a `closed` event is fired.
|
|
20287
|
+
*
|
|
20288
|
+
* @param returnValue A return value usually indicating which button was used
|
|
20289
|
+
* to close a dialog. If a dialog is canceled by clicking the scrim or
|
|
20290
|
+
* pressing Escape, it will not change the return value after closing.
|
|
20291
|
+
* @return A Promise that resolves after the animation is finished and the
|
|
20292
|
+
* `closed` event was fired.
|
|
20293
|
+
*/
|
|
20294
|
+
async close(returnValue = this.returnValue) {
|
|
20295
|
+
this.isOpening = false;
|
|
20296
|
+
if (!this.isConnected) {
|
|
20297
|
+
// Disconnected dialogs do not fire close events or animate.
|
|
20298
|
+
this.open = false;
|
|
20299
|
+
return;
|
|
20300
|
+
}
|
|
20301
|
+
await this.updateComplete;
|
|
20302
|
+
const dialog = this.dialog;
|
|
20303
|
+
// Check if already closed or if `dialog.show()` was called while awaiting.
|
|
20304
|
+
if (!dialog.open || this.isOpening) {
|
|
20305
|
+
this.open = false;
|
|
20306
|
+
return;
|
|
20307
|
+
}
|
|
20308
|
+
const prevReturnValue = this.returnValue;
|
|
20309
|
+
this.returnValue = returnValue;
|
|
20310
|
+
const preventClose = !this.dispatchEvent(new Event('close', {
|
|
20311
|
+
cancelable: true
|
|
20312
|
+
}));
|
|
20313
|
+
if (preventClose) {
|
|
20314
|
+
this.returnValue = prevReturnValue;
|
|
20315
|
+
return;
|
|
20316
|
+
}
|
|
20317
|
+
await this.animateDialog(this.getCloseAnimation());
|
|
20318
|
+
dialog.close(returnValue);
|
|
20319
|
+
this.open = false;
|
|
20320
|
+
this.dispatchEvent(new Event('closed'));
|
|
20321
|
+
}
|
|
20322
|
+
connectedCallback() {
|
|
20323
|
+
super.connectedCallback();
|
|
20324
|
+
this.isConnectedPromiseResolve();
|
|
20325
|
+
}
|
|
20326
|
+
disconnectedCallback() {
|
|
20327
|
+
super.disconnectedCallback();
|
|
20328
|
+
this.isConnectedPromise = this.getIsConnectedPromise();
|
|
20329
|
+
}
|
|
20330
|
+
render() {
|
|
20331
|
+
const scrollable = this.open && !(this.isAtScrollTop && this.isAtScrollBottom);
|
|
20332
|
+
const classes = {
|
|
20333
|
+
'has-headline': this.hasHeadline,
|
|
20334
|
+
'has-actions': this.hasActions,
|
|
20335
|
+
'has-icon': this.hasIcon,
|
|
20336
|
+
'scrollable': scrollable,
|
|
20337
|
+
'show-top-divider': scrollable && !this.isAtScrollTop,
|
|
20338
|
+
'show-bottom-divider': scrollable && !this.isAtScrollBottom
|
|
20339
|
+
};
|
|
20340
|
+
// The focus trap sentinels are only added after the dialog opens, since
|
|
20341
|
+
// dialog.showModal() will try to autofocus them, even with tabindex="-1".
|
|
20342
|
+
const showFocusTrap = this.open && !this.noFocusTrap;
|
|
20343
|
+
const focusTrap = b`
|
|
20344
|
+
<div
|
|
20345
|
+
class="focus-trap"
|
|
20346
|
+
tabindex="0"
|
|
20347
|
+
aria-hidden="true"
|
|
20348
|
+
@focus=${this.handleFocusTrapFocus}></div>
|
|
20349
|
+
`;
|
|
20350
|
+
const {
|
|
20351
|
+
ariaLabel
|
|
20352
|
+
} = this;
|
|
20353
|
+
return b`
|
|
20354
|
+
<div class="scrim"></div>
|
|
20355
|
+
<dialog
|
|
20356
|
+
class=${e$2(classes)}
|
|
20357
|
+
aria-label=${ariaLabel || A}
|
|
20358
|
+
aria-labelledby=${this.hasHeadline ? 'headline' : A}
|
|
20359
|
+
role=${this.type === 'alert' ? 'alertdialog' : A}
|
|
20360
|
+
@cancel=${this.handleCancel}
|
|
20361
|
+
@click=${this.handleDialogClick}
|
|
20362
|
+
@close=${this.handleClose}
|
|
20363
|
+
@keydown=${this.handleKeydown}
|
|
20364
|
+
.returnValue=${this.returnValue || A}>
|
|
20365
|
+
${showFocusTrap ? focusTrap : A}
|
|
20366
|
+
<div class="container" @click=${this.handleContentClick}>
|
|
20367
|
+
<div class="headline">
|
|
20368
|
+
<div class="icon" aria-hidden="true">
|
|
20369
|
+
<slot name="icon" @slotchange=${this.handleIconChange}></slot>
|
|
20370
|
+
</div>
|
|
20371
|
+
<h2 id="headline" aria-hidden=${!this.hasHeadline || A}>
|
|
20372
|
+
<slot
|
|
20373
|
+
name="headline"
|
|
20374
|
+
@slotchange=${this.handleHeadlineChange}></slot>
|
|
20375
|
+
</h2>
|
|
20376
|
+
<md-divider></md-divider>
|
|
20377
|
+
</div>
|
|
20378
|
+
<div class="scroller">
|
|
20379
|
+
<div class="content">
|
|
20380
|
+
<div class="top anchor"></div>
|
|
20381
|
+
<slot name="content"></slot>
|
|
20382
|
+
<div class="bottom anchor"></div>
|
|
20383
|
+
</div>
|
|
20384
|
+
</div>
|
|
20385
|
+
<div class="actions">
|
|
20386
|
+
<md-divider></md-divider>
|
|
20387
|
+
<slot name="actions" @slotchange=${this.handleActionsChange}></slot>
|
|
20388
|
+
</div>
|
|
20389
|
+
</div>
|
|
20390
|
+
${showFocusTrap ? focusTrap : A}
|
|
20391
|
+
</dialog>
|
|
20392
|
+
`;
|
|
20393
|
+
}
|
|
20394
|
+
firstUpdated() {
|
|
20395
|
+
this.intersectionObserver = new IntersectionObserver(entries => {
|
|
20396
|
+
for (const entry of entries) {
|
|
20397
|
+
this.handleAnchorIntersection(entry);
|
|
20398
|
+
}
|
|
20399
|
+
}, {
|
|
20400
|
+
root: this.scroller
|
|
20401
|
+
});
|
|
20402
|
+
this.intersectionObserver.observe(this.topAnchor);
|
|
20403
|
+
this.intersectionObserver.observe(this.bottomAnchor);
|
|
20404
|
+
}
|
|
20405
|
+
handleDialogClick() {
|
|
20406
|
+
if (this.nextClickIsFromContent) {
|
|
20407
|
+
// Avoid doing a layout calculation below if we know the click came from
|
|
20408
|
+
// content.
|
|
20409
|
+
this.nextClickIsFromContent = false;
|
|
20410
|
+
return;
|
|
20411
|
+
}
|
|
20412
|
+
// Click originated on the backdrop. Native `<dialog>`s will not cancel,
|
|
20413
|
+
// but Material dialogs do.
|
|
20414
|
+
const preventDefault = !this.dispatchEvent(new Event('cancel', {
|
|
20415
|
+
cancelable: true
|
|
20416
|
+
}));
|
|
20417
|
+
if (preventDefault) {
|
|
20418
|
+
return;
|
|
20419
|
+
}
|
|
20420
|
+
this.close();
|
|
20421
|
+
}
|
|
20422
|
+
handleContentClick() {
|
|
20423
|
+
this.nextClickIsFromContent = true;
|
|
20424
|
+
}
|
|
20425
|
+
handleSubmit(event) {
|
|
20426
|
+
const form = event.target;
|
|
20427
|
+
const {
|
|
20428
|
+
submitter
|
|
20429
|
+
} = event;
|
|
20430
|
+
if (form.getAttribute('method') !== 'dialog' || !submitter) {
|
|
20431
|
+
return;
|
|
20432
|
+
}
|
|
20433
|
+
// Close reason is the submitter's value attribute, or the dialog's
|
|
20434
|
+
// `returnValue` if there is no attribute.
|
|
20435
|
+
this.close(submitter.getAttribute('value') ?? this.returnValue);
|
|
20436
|
+
}
|
|
20437
|
+
handleCancel(event) {
|
|
20438
|
+
if (event.target !== this.dialog) {
|
|
20439
|
+
// Ignore any cancel events dispatched by content.
|
|
20440
|
+
return;
|
|
20441
|
+
}
|
|
20442
|
+
this.escapePressedWithoutCancel = false;
|
|
20443
|
+
const preventDefault = !redispatchEvent(this, event);
|
|
20444
|
+
// We always prevent default on the original dialog event since we'll
|
|
20445
|
+
// animate closing it before it actually closes.
|
|
20446
|
+
event.preventDefault();
|
|
20447
|
+
if (preventDefault) {
|
|
20448
|
+
return;
|
|
20449
|
+
}
|
|
20450
|
+
this.close();
|
|
20451
|
+
}
|
|
20452
|
+
handleClose() {
|
|
20453
|
+
var _this$dialog;
|
|
20454
|
+
if (!this.escapePressedWithoutCancel) {
|
|
20455
|
+
return;
|
|
20456
|
+
}
|
|
20457
|
+
this.escapePressedWithoutCancel = false;
|
|
20458
|
+
(_this$dialog = this.dialog) === null || _this$dialog === void 0 || _this$dialog.dispatchEvent(new Event('cancel', {
|
|
20459
|
+
cancelable: true
|
|
20460
|
+
}));
|
|
20461
|
+
}
|
|
20462
|
+
handleKeydown(event) {
|
|
20463
|
+
if (event.key !== 'Escape') {
|
|
20464
|
+
return;
|
|
20465
|
+
}
|
|
20466
|
+
// An escape key was pressed. If a "close" event fires next without a
|
|
20467
|
+
// "cancel" event first, then we know we're in the Chrome v120 bug.
|
|
20468
|
+
this.escapePressedWithoutCancel = true;
|
|
20469
|
+
// Wait a full task for the cancel/close event listeners to fire, then
|
|
20470
|
+
// reset the flag.
|
|
20471
|
+
setTimeout(() => {
|
|
20472
|
+
this.escapePressedWithoutCancel = false;
|
|
20473
|
+
});
|
|
20474
|
+
}
|
|
20475
|
+
async animateDialog(animation) {
|
|
20476
|
+
var _this$cancelAnimation;
|
|
20477
|
+
// Always cancel the previous animations. Animations can include `fill`
|
|
20478
|
+
// modes that need to be cleared when `quick` is toggled. If not, content
|
|
20479
|
+
// that faded out will remain hidden when a `quick` dialog re-opens after
|
|
20480
|
+
// previously opening and closing without `quick`.
|
|
20481
|
+
(_this$cancelAnimation = this.cancelAnimations) === null || _this$cancelAnimation === void 0 || _this$cancelAnimation.abort();
|
|
20482
|
+
this.cancelAnimations = new AbortController();
|
|
20483
|
+
if (this.quick) {
|
|
20484
|
+
return;
|
|
20485
|
+
}
|
|
20486
|
+
const {
|
|
20487
|
+
dialog,
|
|
20488
|
+
scrim,
|
|
20489
|
+
container,
|
|
20490
|
+
headline,
|
|
20491
|
+
content,
|
|
20492
|
+
actions
|
|
20493
|
+
} = this;
|
|
20494
|
+
if (!dialog || !scrim || !container || !headline || !content || !actions) {
|
|
20495
|
+
return;
|
|
20496
|
+
}
|
|
20497
|
+
const {
|
|
20498
|
+
container: containerAnimate,
|
|
20499
|
+
dialog: dialogAnimate,
|
|
20500
|
+
scrim: scrimAnimate,
|
|
20501
|
+
headline: headlineAnimate,
|
|
20502
|
+
content: contentAnimate,
|
|
20503
|
+
actions: actionsAnimate
|
|
20504
|
+
} = animation;
|
|
20505
|
+
const elementAndAnimation = [[dialog, dialogAnimate ?? []], [scrim, scrimAnimate ?? []], [container, containerAnimate ?? []], [headline, headlineAnimate ?? []], [content, contentAnimate ?? []], [actions, actionsAnimate ?? []]];
|
|
20506
|
+
const animations = [];
|
|
20507
|
+
for (const [element, animation] of elementAndAnimation) {
|
|
20508
|
+
for (const animateArgs of animation) {
|
|
20509
|
+
const animation = element.animate(...animateArgs);
|
|
20510
|
+
this.cancelAnimations.signal.addEventListener('abort', () => {
|
|
20511
|
+
animation.cancel();
|
|
20512
|
+
});
|
|
20513
|
+
animations.push(animation);
|
|
20514
|
+
}
|
|
20515
|
+
}
|
|
20516
|
+
await Promise.all(animations.map(animation => animation.finished.catch(() => {
|
|
20517
|
+
// Ignore intentional AbortErrors when calling `animation.cancel()`.
|
|
20518
|
+
})));
|
|
20519
|
+
}
|
|
20520
|
+
handleHeadlineChange(event) {
|
|
20521
|
+
const slot = event.target;
|
|
20522
|
+
this.hasHeadline = slot.assignedElements().length > 0;
|
|
20523
|
+
}
|
|
20524
|
+
handleActionsChange(event) {
|
|
20525
|
+
const slot = event.target;
|
|
20526
|
+
this.hasActions = slot.assignedElements().length > 0;
|
|
20527
|
+
}
|
|
20528
|
+
handleIconChange(event) {
|
|
20529
|
+
const slot = event.target;
|
|
20530
|
+
this.hasIcon = slot.assignedElements().length > 0;
|
|
20531
|
+
}
|
|
20532
|
+
handleAnchorIntersection(entry) {
|
|
20533
|
+
const {
|
|
20534
|
+
target,
|
|
20535
|
+
isIntersecting
|
|
20536
|
+
} = entry;
|
|
20537
|
+
if (target === this.topAnchor) {
|
|
20538
|
+
this.isAtScrollTop = isIntersecting;
|
|
20539
|
+
}
|
|
20540
|
+
if (target === this.bottomAnchor) {
|
|
20541
|
+
this.isAtScrollBottom = isIntersecting;
|
|
20542
|
+
}
|
|
20543
|
+
}
|
|
20544
|
+
getIsConnectedPromise() {
|
|
20545
|
+
return new Promise(resolve => {
|
|
20546
|
+
this.isConnectedPromiseResolve = resolve;
|
|
20547
|
+
});
|
|
20548
|
+
}
|
|
20549
|
+
handleFocusTrapFocus(event) {
|
|
20550
|
+
const [firstFocusableChild, lastFocusableChild] = this.getFirstAndLastFocusableChildren();
|
|
20551
|
+
if (!firstFocusableChild || !lastFocusableChild) {
|
|
20552
|
+
var _this$dialog2;
|
|
20553
|
+
// When a dialog does not have focusable children, the dialog itself
|
|
20554
|
+
// receives focus.
|
|
20555
|
+
(_this$dialog2 = this.dialog) === null || _this$dialog2 === void 0 || _this$dialog2.focus();
|
|
20556
|
+
return;
|
|
20557
|
+
}
|
|
20558
|
+
// To determine which child to focus, we need to know which focus trap
|
|
20559
|
+
// received focus...
|
|
20560
|
+
const isFirstFocusTrap = event.target === this.firstFocusTrap;
|
|
20561
|
+
const isLastFocusTrap = !isFirstFocusTrap;
|
|
20562
|
+
// ...and where the focus came from (what was previously focused).
|
|
20563
|
+
const focusCameFromFirstChild = event.relatedTarget === firstFocusableChild;
|
|
20564
|
+
const focusCameFromLastChild = event.relatedTarget === lastFocusableChild;
|
|
20565
|
+
// Although this is a focus trap, focus can come from outside the trap.
|
|
20566
|
+
// This can happen when elements are programmatically `focus()`'d. It also
|
|
20567
|
+
// happens when focus leaves and returns to the window, such as clicking on
|
|
20568
|
+
// the browser's URL bar and pressing Tab, or switching focus between
|
|
20569
|
+
// iframes.
|
|
20570
|
+
const focusCameFromOutsideDialog = !focusCameFromFirstChild && !focusCameFromLastChild;
|
|
20571
|
+
// Focus the dialog's first child when we reach the end of the dialog and
|
|
20572
|
+
// focus is moving forward. Or, when focus is moving forwards into the
|
|
20573
|
+
// dialog from outside of the window.
|
|
20574
|
+
const shouldFocusFirstChild = isLastFocusTrap && focusCameFromLastChild || isFirstFocusTrap && focusCameFromOutsideDialog;
|
|
20575
|
+
if (shouldFocusFirstChild) {
|
|
20576
|
+
firstFocusableChild.focus();
|
|
20577
|
+
return;
|
|
20578
|
+
}
|
|
20579
|
+
// Focus the dialog's last child when we reach the beginning of the dialog
|
|
20580
|
+
// and focus is moving backward. Or, when focus is moving backwards into the
|
|
20581
|
+
// dialog from outside of the window.
|
|
20582
|
+
const shouldFocusLastChild = isFirstFocusTrap && focusCameFromFirstChild || isLastFocusTrap && focusCameFromOutsideDialog;
|
|
20583
|
+
if (shouldFocusLastChild) {
|
|
20584
|
+
lastFocusableChild.focus();
|
|
20585
|
+
return;
|
|
20586
|
+
}
|
|
20587
|
+
// The booleans above are verbose for readability, but code executation
|
|
20588
|
+
// won't actually reach here.
|
|
20589
|
+
}
|
|
20590
|
+
getFirstAndLastFocusableChildren() {
|
|
20591
|
+
if (!this.treewalker) {
|
|
20592
|
+
return [null, null];
|
|
20593
|
+
}
|
|
20594
|
+
let firstFocusableChild = null;
|
|
20595
|
+
let lastFocusableChild = null;
|
|
20596
|
+
// Reset the current node back to the root host element.
|
|
20597
|
+
this.treewalker.currentNode = this.treewalker.root;
|
|
20598
|
+
while (this.treewalker.nextNode()) {
|
|
20599
|
+
// Cast as Element since the TreeWalker filter only accepts Elements.
|
|
20600
|
+
const nextChild = this.treewalker.currentNode;
|
|
20601
|
+
if (!isFocusable(nextChild)) {
|
|
20602
|
+
continue;
|
|
20603
|
+
}
|
|
20604
|
+
if (!firstFocusableChild) {
|
|
20605
|
+
firstFocusableChild = nextChild;
|
|
20606
|
+
}
|
|
20607
|
+
lastFocusableChild = nextChild;
|
|
20608
|
+
}
|
|
20609
|
+
// We set lastFocusableChild immediately after finding a
|
|
20610
|
+
// firstFocusableChild, which means the pair is either both null or both
|
|
20611
|
+
// non-null. Cast since TypeScript does not recognize this.
|
|
20612
|
+
return [firstFocusableChild, lastFocusableChild];
|
|
20613
|
+
}
|
|
20614
|
+
}
|
|
20615
|
+
__decorate([n$2({
|
|
20616
|
+
type: Boolean
|
|
20617
|
+
})], Dialog.prototype, "open", null);
|
|
20618
|
+
__decorate([n$2({
|
|
20619
|
+
type: Boolean
|
|
20620
|
+
})], Dialog.prototype, "quick", void 0);
|
|
20621
|
+
__decorate([n$2({
|
|
20622
|
+
attribute: false
|
|
20623
|
+
})], Dialog.prototype, "returnValue", void 0);
|
|
20624
|
+
__decorate([n$2()], Dialog.prototype, "type", void 0);
|
|
20625
|
+
__decorate([n$2({
|
|
20626
|
+
type: Boolean,
|
|
20627
|
+
attribute: 'no-focus-trap'
|
|
20628
|
+
})], Dialog.prototype, "noFocusTrap", void 0);
|
|
20629
|
+
__decorate([e$5('dialog')], Dialog.prototype, "dialog", void 0);
|
|
20630
|
+
__decorate([e$5('.scrim')], Dialog.prototype, "scrim", void 0);
|
|
20631
|
+
__decorate([e$5('.container')], Dialog.prototype, "container", void 0);
|
|
20632
|
+
__decorate([e$5('.headline')], Dialog.prototype, "headline", void 0);
|
|
20633
|
+
__decorate([e$5('.content')], Dialog.prototype, "content", void 0);
|
|
20634
|
+
__decorate([e$5('.actions')], Dialog.prototype, "actions", void 0);
|
|
20635
|
+
__decorate([r$2()], Dialog.prototype, "isAtScrollTop", void 0);
|
|
20636
|
+
__decorate([r$2()], Dialog.prototype, "isAtScrollBottom", void 0);
|
|
20637
|
+
__decorate([e$5('.scroller')], Dialog.prototype, "scroller", void 0);
|
|
20638
|
+
__decorate([e$5('.top.anchor')], Dialog.prototype, "topAnchor", void 0);
|
|
20639
|
+
__decorate([e$5('.bottom.anchor')], Dialog.prototype, "bottomAnchor", void 0);
|
|
20640
|
+
__decorate([e$5('.focus-trap')], Dialog.prototype, "firstFocusTrap", void 0);
|
|
20641
|
+
__decorate([r$2()], Dialog.prototype, "hasHeadline", void 0);
|
|
20642
|
+
__decorate([r$2()], Dialog.prototype, "hasActions", void 0);
|
|
20643
|
+
__decorate([r$2()], Dialog.prototype, "hasIcon", void 0);
|
|
20644
|
+
function isFocusable(element) {
|
|
20645
|
+
var _element$shadowRoot;
|
|
20646
|
+
// Check if the element is a known built-in focusable element:
|
|
20647
|
+
// - <a> and <area> with `href` attributes.
|
|
20648
|
+
// - Form controls that are not disabled.
|
|
20649
|
+
// - `contenteditable` elements.
|
|
20650
|
+
// - Anything with a non-negative `tabindex`.
|
|
20651
|
+
const knownFocusableElements = ':is(button,input,select,textarea,object,:is(a,area)[href],[tabindex],[contenteditable=true])';
|
|
20652
|
+
const notDisabled = ':not(:disabled,[disabled])';
|
|
20653
|
+
const notNegativeTabIndex = ':not([tabindex^="-"])';
|
|
20654
|
+
if (element.matches(knownFocusableElements + notDisabled + notNegativeTabIndex)) {
|
|
20655
|
+
return true;
|
|
20656
|
+
}
|
|
20657
|
+
const isCustomElement = element.localName.includes('-');
|
|
20658
|
+
if (!isCustomElement) {
|
|
20659
|
+
return false;
|
|
20660
|
+
}
|
|
20661
|
+
// If a custom element does not have a tabindex, it may still be focusable
|
|
20662
|
+
// if it delegates focus with a shadow root. We also need to check again if
|
|
20663
|
+
// the custom element is a disabled form control.
|
|
20664
|
+
if (!element.matches(notDisabled)) {
|
|
20665
|
+
return false;
|
|
20666
|
+
}
|
|
20667
|
+
return ((_element$shadowRoot = element.shadowRoot) === null || _element$shadowRoot === void 0 ? void 0 : _element$shadowRoot.delegatesFocus) ?? false;
|
|
20668
|
+
}
|
|
20669
|
+
|
|
20670
|
+
/**
|
|
20671
|
+
* @license
|
|
20672
|
+
* Copyright 2024 Google LLC
|
|
20673
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
20674
|
+
*/
|
|
20675
|
+
// Generated stylesheet for ./dialog/internal/dialog-styles.css.
|
|
20676
|
+
const styles = i$8`:host{border-start-start-radius:var(--md-dialog-container-shape-start-start, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-start-end-radius:var(--md-dialog-container-shape-start-end, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-end-end-radius:var(--md-dialog-container-shape-end-end, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));border-end-start-radius:var(--md-dialog-container-shape-end-start, var(--md-dialog-container-shape, var(--md-sys-shape-corner-extra-large, 28px)));display:contents;margin:auto;max-height:min(560px,100% - 48px);max-width:min(560px,100% - 48px);min-height:140px;min-width:280px;position:fixed;height:fit-content;width:fit-content}dialog{background:rgba(0,0,0,0);border:none;border-radius:inherit;flex-direction:column;height:inherit;margin:inherit;max-height:inherit;max-width:inherit;min-height:inherit;min-width:inherit;outline:none;overflow:visible;padding:0;width:inherit}dialog[open]{display:flex}::backdrop{background:none}.scrim{background:var(--md-sys-color-scrim, #000);display:none;inset:0;opacity:32%;pointer-events:none;position:fixed;z-index:1}:host([open]) .scrim{display:flex}h2{all:unset;align-self:stretch}.headline{align-items:center;color:var(--md-dialog-headline-color, var(--md-sys-color-on-surface, #1d1b20));display:flex;flex-direction:column;font-family:var(--md-dialog-headline-font, var(--md-sys-typescale-headline-small-font, var(--md-ref-typeface-brand, Roboto)));font-size:var(--md-dialog-headline-size, var(--md-sys-typescale-headline-small-size, 1.5rem));line-height:var(--md-dialog-headline-line-height, var(--md-sys-typescale-headline-small-line-height, 2rem));font-weight:var(--md-dialog-headline-weight, var(--md-sys-typescale-headline-small-weight, var(--md-ref-typeface-weight-regular, 400)));position:relative}slot[name=headline]::slotted(*){align-items:center;align-self:stretch;box-sizing:border-box;display:flex;gap:8px;padding:24px 24px 0}.icon{display:flex}slot[name=icon]::slotted(*){color:var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625b71));fill:currentColor;font-size:var(--md-dialog-icon-size, 24px);margin-top:24px;height:var(--md-dialog-icon-size, 24px);width:var(--md-dialog-icon-size, 24px)}.has-icon slot[name=headline]::slotted(*){justify-content:center;padding-top:16px}.scrollable slot[name=headline]::slotted(*){padding-bottom:16px}.scrollable.has-headline slot[name=content]::slotted(*){padding-top:8px}.container{border-radius:inherit;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;position:relative;transform-origin:top}.container::before{background:var(--md-dialog-container-color, var(--md-sys-color-surface-container-high, #ece6f0));border-radius:inherit;content:"";inset:0;position:absolute}.scroller{display:flex;flex:1;flex-direction:column;overflow:hidden;z-index:1}.scrollable .scroller{overflow-y:scroll}.content{color:var(--md-dialog-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));font-family:var(--md-dialog-supporting-text-font, var(--md-sys-typescale-body-medium-font, var(--md-ref-typeface-plain, Roboto)));font-size:var(--md-dialog-supporting-text-size, var(--md-sys-typescale-body-medium-size, 0.875rem));line-height:var(--md-dialog-supporting-text-line-height, var(--md-sys-typescale-body-medium-line-height, 1.25rem));flex:1;font-weight:var(--md-dialog-supporting-text-weight, var(--md-sys-typescale-body-medium-weight, var(--md-ref-typeface-weight-regular, 400)));height:min-content;position:relative}slot[name=content]::slotted(*){box-sizing:border-box;padding:24px}.anchor{position:absolute}.top.anchor{top:0}.bottom.anchor{bottom:0}.actions{position:relative}slot[name=actions]::slotted(*){box-sizing:border-box;display:flex;gap:8px;justify-content:flex-end;padding:16px 24px 24px}.has-actions slot[name=content]::slotted(*){padding-bottom:8px}md-divider{display:none;position:absolute}.has-headline.show-top-divider .headline md-divider,.has-actions.show-bottom-divider .actions md-divider{display:flex}.headline md-divider{bottom:0}.actions md-divider{top:0}@media(forced-colors: active){dialog{outline:2px solid WindowText}}
|
|
20677
|
+
`;
|
|
20678
|
+
|
|
20679
|
+
/**
|
|
20680
|
+
* @license
|
|
20681
|
+
* Copyright 2023 Google LLC
|
|
20682
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
20683
|
+
*/
|
|
20684
|
+
/**
|
|
20685
|
+
* @summary Dialogs can require an action, communicate information, or help
|
|
20686
|
+
* users accomplish a task. There are two types of dialogs: basic and
|
|
20687
|
+
* full-screen.
|
|
20688
|
+
*
|
|
20689
|
+
* @description
|
|
20690
|
+
* A dialog is a modal window that appears in front of app content to provide
|
|
20691
|
+
* critical information or ask for a decision. Dialogs disable all app
|
|
20692
|
+
* functionality when they appear, and remain on screen until confirmed,
|
|
20693
|
+
* dismissed, or a required action has been taken.
|
|
20694
|
+
*
|
|
20695
|
+
* Dialogs are purposefully interruptive, so they should be used sparingly.
|
|
20696
|
+
* A less disruptive alternative is to use a menu, which provides options
|
|
20697
|
+
* without interrupting a user’s experience.
|
|
20698
|
+
*
|
|
20699
|
+
* On mobile devices only, complex dialogs should be displayed fullscreen.
|
|
20700
|
+
*
|
|
20701
|
+
* __Example usages:__
|
|
20702
|
+
* - Common use cases for basic dialogs include alerts, quick selection, and
|
|
20703
|
+
* confirmation.
|
|
20704
|
+
* - More complex dialogs may contain actions that require a series of tasks
|
|
20705
|
+
* to complete. One example is creating a calendar entry with the event title,
|
|
20706
|
+
* date, location, and time.
|
|
20707
|
+
*
|
|
20708
|
+
* @final
|
|
20709
|
+
* @suppress {visibility}
|
|
20710
|
+
*/
|
|
20711
|
+
let MdDialog = class MdDialog extends Dialog {};
|
|
20712
|
+
MdDialog.styles = [styles];
|
|
20713
|
+
MdDialog = __decorate([t$1('md-dialog')], MdDialog);
|
|
20714
|
+
|
|
20715
|
+
var __defProp$6 = Object.defineProperty;
|
|
20716
|
+
var __getOwnPropDesc$8 = Object.getOwnPropertyDescriptor;
|
|
20717
|
+
var __decorateClass$9 = (decorators, target, key, kind) => {
|
|
20718
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$8(target, key) : target;
|
|
20719
|
+
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
20720
|
+
if (kind && result) __defProp$6(target, key, result);
|
|
20721
|
+
return result;
|
|
20722
|
+
};
|
|
20723
|
+
const THREAD_ATTRIBUTE_PATHS = ["0/53/7", "0/53/8", "0/51/0"];
|
|
20724
|
+
const WIFI_ATTRIBUTE_PATHS = ["0/54/0", "0/54/3", "0/54/4"];
|
|
20725
|
+
let UpdateConnectionsDialog = class extends i$5 {
|
|
20726
|
+
constructor() {
|
|
20727
|
+
super(...arguments);
|
|
20728
|
+
this.nodes = {};
|
|
20729
|
+
this.selectedNodeType = "online";
|
|
20730
|
+
this.selectedNodeName = "";
|
|
20731
|
+
this.selectedNodeId = null;
|
|
20732
|
+
this.onlineNeighborIds = [];
|
|
20733
|
+
this._includeNeighbors = false;
|
|
20734
|
+
this._isUpdating = false;
|
|
20735
|
+
/** Timeout ID for auto-close */
|
|
20736
|
+
this._timeoutId = null;
|
|
20737
|
+
/** Track if we've already dispatched close event to prevent double-firing */
|
|
20738
|
+
this._hasClosedEvent = false;
|
|
20739
|
+
}
|
|
20740
|
+
firstUpdated() {
|
|
20741
|
+
var _this$shadowRoot;
|
|
20742
|
+
const dialog = (_this$shadowRoot = this.shadowRoot) === null || _this$shadowRoot === void 0 ? void 0 : _this$shadowRoot.querySelector("md-dialog");
|
|
20743
|
+
dialog === null || dialog === void 0 || dialog.show();
|
|
20744
|
+
}
|
|
20745
|
+
disconnectedCallback() {
|
|
20746
|
+
super.disconnectedCallback();
|
|
20747
|
+
if (this._timeoutId) {
|
|
20748
|
+
clearTimeout(this._timeoutId);
|
|
20749
|
+
this._timeoutId = null;
|
|
20750
|
+
}
|
|
20751
|
+
}
|
|
20752
|
+
/**
|
|
20753
|
+
* Get the number of nodes that will be updated.
|
|
20754
|
+
*/
|
|
20755
|
+
get _updateCount() {
|
|
20756
|
+
if (this.selectedNodeType === "online") {
|
|
20757
|
+
return this._includeNeighbors ? 1 + this.onlineNeighborIds.length : 1;
|
|
20758
|
+
}
|
|
20759
|
+
return this.onlineNeighborIds.length;
|
|
20760
|
+
}
|
|
20761
|
+
/**
|
|
20762
|
+
* Get the attribute paths to read for a node based on its network type.
|
|
20763
|
+
*/
|
|
20764
|
+
_getAttributePathsForNode(nodeId) {
|
|
20765
|
+
const node = this.nodes[nodeId];
|
|
20766
|
+
if (!node) return [];
|
|
20767
|
+
const networkType = getNetworkType(node);
|
|
20768
|
+
if (networkType === "thread") {
|
|
20769
|
+
return THREAD_ATTRIBUTE_PATHS;
|
|
20770
|
+
}
|
|
20771
|
+
if (networkType === "wifi") {
|
|
20772
|
+
return WIFI_ATTRIBUTE_PATHS;
|
|
20773
|
+
}
|
|
20774
|
+
return [];
|
|
20775
|
+
}
|
|
20776
|
+
/**
|
|
20777
|
+
* Get the list of node IDs to update based on current state.
|
|
20778
|
+
*/
|
|
20779
|
+
_getNodeIdsToUpdate() {
|
|
20780
|
+
if (this.selectedNodeType === "online") {
|
|
20781
|
+
const nodeIds = [String(this.selectedNodeId)];
|
|
20782
|
+
if (this._includeNeighbors) {
|
|
20783
|
+
nodeIds.push(...this.onlineNeighborIds);
|
|
20784
|
+
}
|
|
20785
|
+
return nodeIds;
|
|
20786
|
+
}
|
|
20787
|
+
return this.onlineNeighborIds;
|
|
20788
|
+
}
|
|
20789
|
+
async _executeUpdate() {
|
|
20790
|
+
if (this._isUpdating || this._updateCount === 0) return;
|
|
20791
|
+
this._isUpdating = true;
|
|
20792
|
+
this._timeoutId = setTimeout(() => {
|
|
20793
|
+
console.warn("Update connections timed out after 30s");
|
|
20794
|
+
this._closeDialog();
|
|
20795
|
+
}, 3e4);
|
|
20796
|
+
try {
|
|
20797
|
+
const nodeIds = this._getNodeIdsToUpdate();
|
|
20798
|
+
const updatePromises = nodeIds.map(async nodeIdStr => {
|
|
20799
|
+
const node = this.nodes[nodeIdStr];
|
|
20800
|
+
if (!node) return;
|
|
20801
|
+
const paths = this._getAttributePathsForNode(nodeIdStr);
|
|
20802
|
+
if (paths.length === 0) return;
|
|
20803
|
+
await this.client.readAttribute(node.node_id, paths);
|
|
20804
|
+
});
|
|
20805
|
+
await Promise.all(updatePromises);
|
|
20806
|
+
this._closeDialog();
|
|
20807
|
+
} catch (error) {
|
|
20808
|
+
console.error("Failed to update connections:", error);
|
|
20809
|
+
this._closeDialog();
|
|
20810
|
+
} finally {
|
|
20811
|
+
if (this._timeoutId) {
|
|
20812
|
+
clearTimeout(this._timeoutId);
|
|
20813
|
+
this._timeoutId = null;
|
|
20814
|
+
}
|
|
20815
|
+
this._isUpdating = false;
|
|
20816
|
+
}
|
|
20817
|
+
}
|
|
20818
|
+
_closeDialog() {
|
|
20819
|
+
var _this$shadowRoot2;
|
|
20820
|
+
if (this._hasClosedEvent) return;
|
|
20821
|
+
this._hasClosedEvent = true;
|
|
20822
|
+
const dialog = (_this$shadowRoot2 = this.shadowRoot) === null || _this$shadowRoot2 === void 0 ? void 0 : _this$shadowRoot2.querySelector("md-dialog");
|
|
20823
|
+
dialog === null || dialog === void 0 || dialog.close();
|
|
20824
|
+
this.dispatchEvent(new CustomEvent("dialog-closed", {
|
|
20825
|
+
bubbles: true,
|
|
20826
|
+
composed: true
|
|
20827
|
+
}));
|
|
20828
|
+
}
|
|
20829
|
+
/** Handle native dialog closed event (ESC key, backdrop click, etc.) */
|
|
20830
|
+
_handleDialogClosed() {
|
|
20831
|
+
this._closeDialog();
|
|
20832
|
+
}
|
|
20833
|
+
_handleCheckboxChange(e) {
|
|
20834
|
+
const checkbox = e.target;
|
|
20835
|
+
this._includeNeighbors = checkbox.checked;
|
|
20836
|
+
}
|
|
20837
|
+
_renderOnlineContent() {
|
|
20838
|
+
return b`
|
|
20839
|
+
<p>Refresh network information for "<strong>${this.selectedNodeName}</strong>".</p>
|
|
20840
|
+
${this.onlineNeighborIds.length > 0 ? b`
|
|
20841
|
+
<label class="checkbox-row">
|
|
20842
|
+
<md-checkbox
|
|
20843
|
+
?checked=${this._includeNeighbors}
|
|
20844
|
+
@change=${this._handleCheckboxChange}
|
|
20845
|
+
?disabled=${this._isUpdating}
|
|
20846
|
+
></md-checkbox>
|
|
20847
|
+
<span
|
|
20848
|
+
>Include ${this.onlineNeighborIds.length} connected online
|
|
20849
|
+
neighbor${this.onlineNeighborIds.length !== 1 ? "s" : ""}</span
|
|
20850
|
+
>
|
|
20851
|
+
</label>
|
|
20852
|
+
` : A}
|
|
20853
|
+
`;
|
|
20854
|
+
}
|
|
20855
|
+
_renderOfflineContent() {
|
|
20856
|
+
return b`
|
|
20857
|
+
<p>"<strong>${this.selectedNodeName}</strong>" appears to be offline.</p>
|
|
20858
|
+
${this.onlineNeighborIds.length > 0 ? b`
|
|
20859
|
+
<p>
|
|
20860
|
+
Update network data from its ${this.onlineNeighborIds.length} online
|
|
20861
|
+
neighbor${this.onlineNeighborIds.length !== 1 ? "s" : ""} to refresh connection info.
|
|
20862
|
+
</p>
|
|
20863
|
+
` : b` <p>No online neighbors available to update.</p> `}
|
|
20864
|
+
`;
|
|
20865
|
+
}
|
|
20866
|
+
_renderUnknownContent() {
|
|
20867
|
+
return b`
|
|
20868
|
+
<p>This device is not commissioned to this fabric and cannot be queried directly.</p>
|
|
20869
|
+
${this.onlineNeighborIds.length > 0 ? b`
|
|
20870
|
+
<p>
|
|
20871
|
+
Update network data from ${this.onlineNeighborIds.length}
|
|
20872
|
+
node${this.onlineNeighborIds.length !== 1 ? "s" : ""} that
|
|
20873
|
+
see${this.onlineNeighborIds.length === 1 ? "s" : ""} this device to refresh info.
|
|
20874
|
+
</p>
|
|
20875
|
+
` : b` <p>No online nodes available that see this device.</p> `}
|
|
20876
|
+
`;
|
|
20877
|
+
}
|
|
20878
|
+
render() {
|
|
20879
|
+
const buttonText = this._updateCount === 0 ? "No nodes to update" : `Update ${this._updateCount} node${this._updateCount !== 1 ? "s" : ""}`;
|
|
20880
|
+
return b`
|
|
20881
|
+
<md-dialog @closed=${this._handleDialogClosed}>
|
|
20882
|
+
<div slot="headline">Update Connection Data</div>
|
|
20883
|
+
<div slot="content">
|
|
20884
|
+
${this.selectedNodeType === "online" ? this._renderOnlineContent() : this.selectedNodeType === "offline" ? this._renderOfflineContent() : this._renderUnknownContent()}
|
|
20885
|
+
</div>
|
|
20886
|
+
<div slot="actions">
|
|
20887
|
+
<md-text-button @click=${this._closeDialog} ?disabled=${this._isUpdating}>Cancel</md-text-button>
|
|
20888
|
+
<md-filled-button
|
|
20889
|
+
@click=${this._executeUpdate}
|
|
20890
|
+
?disabled=${this._isUpdating || this._updateCount === 0}
|
|
20891
|
+
>
|
|
20892
|
+
${this._isUpdating ? b`<span class="updating-content"
|
|
20893
|
+
>${w`<svg class="spinner" viewBox="0 0 24 24" width="18" height="18"><path fill="currentColor" d="${mdiLoading}"/></svg>`}Updating...</span
|
|
20894
|
+
>` : buttonText}
|
|
20895
|
+
</md-filled-button>
|
|
20896
|
+
</div>
|
|
20897
|
+
</md-dialog>
|
|
20898
|
+
`;
|
|
20899
|
+
}
|
|
20900
|
+
};
|
|
20901
|
+
UpdateConnectionsDialog.styles = i$8`
|
|
20902
|
+
md-dialog {
|
|
20903
|
+
--md-dialog-container-color: var(--md-sys-color-surface, #fff);
|
|
20904
|
+
}
|
|
20905
|
+
|
|
20906
|
+
[slot="content"] {
|
|
20907
|
+
padding: 0 24px;
|
|
20908
|
+
}
|
|
20909
|
+
|
|
20910
|
+
[slot="content"] p {
|
|
20911
|
+
margin: 0 0 16px 0;
|
|
20912
|
+
font-size: 0.875rem;
|
|
20913
|
+
line-height: 1.5;
|
|
20914
|
+
color: var(--md-sys-color-on-surface, #333);
|
|
20915
|
+
}
|
|
20916
|
+
|
|
20917
|
+
[slot="content"] p:last-child {
|
|
20918
|
+
margin-bottom: 0;
|
|
20919
|
+
}
|
|
20920
|
+
|
|
20921
|
+
.checkbox-row {
|
|
20922
|
+
display: flex;
|
|
20923
|
+
align-items: center;
|
|
20924
|
+
gap: 8px;
|
|
20925
|
+
cursor: pointer;
|
|
20926
|
+
font-size: 0.875rem;
|
|
20927
|
+
color: var(--md-sys-color-on-surface, #333);
|
|
20928
|
+
}
|
|
20929
|
+
|
|
20930
|
+
.updating-content {
|
|
20931
|
+
display: inline-flex;
|
|
20932
|
+
align-items: center;
|
|
20933
|
+
gap: 8px;
|
|
20934
|
+
}
|
|
20935
|
+
|
|
20936
|
+
.spinner {
|
|
20937
|
+
animation: spin 1s linear infinite;
|
|
20938
|
+
flex-shrink: 0;
|
|
20939
|
+
}
|
|
20940
|
+
|
|
20941
|
+
.updating-content svg {
|
|
20942
|
+
color: inherit;
|
|
20943
|
+
}
|
|
20944
|
+
|
|
20945
|
+
@keyframes spin {
|
|
20946
|
+
from {
|
|
20947
|
+
transform: rotate(0deg);
|
|
20948
|
+
}
|
|
20949
|
+
to {
|
|
20950
|
+
transform: rotate(360deg);
|
|
20951
|
+
}
|
|
20952
|
+
}
|
|
20953
|
+
|
|
20954
|
+
md-filled-button {
|
|
20955
|
+
min-width: 140px;
|
|
20956
|
+
}
|
|
20957
|
+
`;
|
|
20958
|
+
__decorateClass$9([n$2({
|
|
20959
|
+
type: Object
|
|
20960
|
+
})], UpdateConnectionsDialog.prototype, "client", 2);
|
|
20961
|
+
__decorateClass$9([n$2({
|
|
20962
|
+
type: Object
|
|
20963
|
+
})], UpdateConnectionsDialog.prototype, "nodes", 2);
|
|
20964
|
+
__decorateClass$9([n$2({
|
|
20965
|
+
type: String
|
|
20966
|
+
})], UpdateConnectionsDialog.prototype, "selectedNodeType", 2);
|
|
20967
|
+
__decorateClass$9([n$2({
|
|
20968
|
+
type: String
|
|
20969
|
+
})], UpdateConnectionsDialog.prototype, "selectedNodeName", 2);
|
|
20970
|
+
__decorateClass$9([n$2()], UpdateConnectionsDialog.prototype, "selectedNodeId", 2);
|
|
20971
|
+
__decorateClass$9([n$2({
|
|
20972
|
+
type: Array
|
|
20973
|
+
})], UpdateConnectionsDialog.prototype, "onlineNeighborIds", 2);
|
|
20974
|
+
__decorateClass$9([r$2()], UpdateConnectionsDialog.prototype, "_includeNeighbors", 2);
|
|
20975
|
+
__decorateClass$9([r$2()], UpdateConnectionsDialog.prototype, "_isUpdating", 2);
|
|
20976
|
+
UpdateConnectionsDialog = __decorateClass$9([t$1("update-connections-dialog")], UpdateConnectionsDialog);
|
|
20977
|
+
|
|
20978
|
+
var __defProp$5 = Object.defineProperty;
|
|
20979
|
+
var __getOwnPropDesc$7 = Object.getOwnPropertyDescriptor;
|
|
20980
|
+
var __decorateClass$8 = (decorators, target, key, kind) => {
|
|
20981
|
+
var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$7(target, key) : target;
|
|
20982
|
+
for (var i = decorators.length - 1, decorator; i >= 0; i--) if (decorator = decorators[i]) result = (kind ? decorator(target, key, result) : decorator(result)) || result;
|
|
20983
|
+
if (kind && result) __defProp$5(target, key, result);
|
|
20984
|
+
return result;
|
|
20985
|
+
};
|
|
20986
|
+
let NetworkDetails = class extends i$5 {
|
|
20987
|
+
constructor() {
|
|
20988
|
+
super(...arguments);
|
|
20989
|
+
this.selectedNodeId = null;
|
|
20990
|
+
this.nodes = {};
|
|
20991
|
+
this.unknownDevices = /* @__PURE__ */new Map();
|
|
20992
|
+
this.wifiAccessPoints = /* @__PURE__ */new Map();
|
|
20993
|
+
this._showUpdateDialog = false;
|
|
20994
|
+
}
|
|
20995
|
+
_handleClose() {
|
|
20996
|
+
this.dispatchEvent(new CustomEvent("close", {
|
|
20997
|
+
bubbles: true,
|
|
20998
|
+
composed: true
|
|
20999
|
+
}));
|
|
21000
|
+
}
|
|
21001
|
+
_handleSelectNode(nodeId) {
|
|
21002
|
+
this.dispatchEvent(new CustomEvent("select-node", {
|
|
21003
|
+
detail: {
|
|
21004
|
+
nodeId
|
|
21005
|
+
},
|
|
21006
|
+
bubbles: true,
|
|
21007
|
+
composed: true
|
|
21008
|
+
}));
|
|
21009
|
+
}
|
|
21010
|
+
/** Handle keyboard interaction for clickable elements (Enter/Space activates) */
|
|
21011
|
+
_handleKeyDown(event, nodeId) {
|
|
21012
|
+
if (event.key === "Enter" || event.key === " ") {
|
|
21013
|
+
event.preventDefault();
|
|
21014
|
+
this._handleSelectNode(nodeId);
|
|
21015
|
+
}
|
|
21016
|
+
}
|
|
21017
|
+
_formatExtAddress(extAddr) {
|
|
21018
|
+
if (extAddr === void 0 || extAddr === "") return "Unknown";
|
|
21019
|
+
if (typeof extAddr === "bigint") {
|
|
21020
|
+
return extAddr.toString(16).toUpperCase().padStart(16, "0");
|
|
21021
|
+
}
|
|
21022
|
+
return extAddr;
|
|
21023
|
+
}
|
|
21024
|
+
_getSignalIcon(neighbor) {
|
|
21025
|
+
const color = getSignalColor(neighbor);
|
|
21026
|
+
if (color === "#4caf50") return mdiSignal;
|
|
21027
|
+
if (color === "#ff9800") return mdiSignalCellular2;
|
|
21028
|
+
return mdiSignalCellular1;
|
|
21029
|
+
}
|
|
21030
|
+
_getSignalIconFromColor(color) {
|
|
21031
|
+
if (color === "#4caf50") return mdiSignal;
|
|
21032
|
+
if (color === "#ff9800") return mdiSignalCellular2;
|
|
21033
|
+
return mdiSignalCellular1;
|
|
21034
|
+
}
|
|
21035
|
+
/**
|
|
21036
|
+
* Format a node ID as hex for Matter log format display.
|
|
21037
|
+
* Returns format like "@1:7b" for node ID 123.
|
|
21038
|
+
*/
|
|
21039
|
+
_formatNodeIdHex(nodeId) {
|
|
21040
|
+
var _this$client;
|
|
21041
|
+
const node = this.nodes[String(nodeId)];
|
|
21042
|
+
const isTestNode = node ? isTestNodeId(node.node_id) : false;
|
|
21043
|
+
const fabricIndex = getEffectiveFabricIndex((_this$client = this.client) === null || _this$client === void 0 || (_this$client = _this$client.serverInfo) === null || _this$client === void 0 ? void 0 : _this$client.fabric_index, isTestNode);
|
|
21044
|
+
return formatNodeAddressFromAny(fabricIndex, nodeId);
|
|
21045
|
+
}
|
|
21046
|
+
_renderWiFiInfo(node) {
|
|
21047
|
+
const wifiDiag = getWiFiDiagnostics(node);
|
|
21048
|
+
if (!wifiDiag.bssid && wifiDiag.rssi === null) {
|
|
21049
|
+
return A;
|
|
21050
|
+
}
|
|
21051
|
+
const signalColor = getSignalColorFromRssi(wifiDiag.rssi);
|
|
19659
21052
|
return b`
|
|
19660
21053
|
<div class="section">
|
|
19661
21054
|
<h4>WiFi Network</h4>
|
|
@@ -19718,6 +21111,19 @@ let NetworkDetails = class extends i$5 {
|
|
|
19718
21111
|
<span class="value mono">${extAddressHex}</span>
|
|
19719
21112
|
</div>
|
|
19720
21113
|
` : A}
|
|
21114
|
+
<div class="info-row">
|
|
21115
|
+
<span class="label">Direct neighbors:</span>
|
|
21116
|
+
<span class="value">${connections.length}</span>
|
|
21117
|
+
</div>
|
|
21118
|
+
${(() => {
|
|
21119
|
+
const routableCount = getRoutableDestinationsCount(node);
|
|
21120
|
+
return routableCount > 0 ? b`
|
|
21121
|
+
<div class="info-row">
|
|
21122
|
+
<span class="label">Routable destinations:</span>
|
|
21123
|
+
<span class="value">${routableCount}</span>
|
|
21124
|
+
</div>
|
|
21125
|
+
` : A;
|
|
21126
|
+
})()}
|
|
19721
21127
|
</div>
|
|
19722
21128
|
|
|
19723
21129
|
${connections.length > 0 ? b`
|
|
@@ -19740,12 +21146,15 @@ let NetworkDetails = class extends i$5 {
|
|
|
19740
21146
|
></ha-svg-icon>
|
|
19741
21147
|
<div class="neighbor-info">
|
|
19742
21148
|
<div class="neighbor-name">
|
|
19743
|
-
${conn.connectedNode ? b`Node ${conn.connectedNodeId}
|
|
19744
|
-
|
|
21149
|
+
${conn.connectedNode ? b`Node ${conn.connectedNodeId}
|
|
21150
|
+
<span class="node-id-hex"
|
|
21151
|
+
>${this._formatNodeIdHex(conn.connectedNodeId)}</span
|
|
21152
|
+
>: ${getDeviceName(conn.connectedNode)}` : b`External: <span class="mono">${conn.extAddressHex}</span>`}
|
|
19745
21153
|
</div>
|
|
19746
21154
|
<div class="neighbor-signal">
|
|
19747
|
-
${conn.rssi !== null ? b`RSSI: ${conn.rssi} dBm, ` : A}
|
|
19748
|
-
|
|
21155
|
+
${conn.rssi !== null ? b`RSSI: ${conn.rssi} dBm` : A}${conn.rssi !== null && conn.lqi !== null ? ", " : A}${conn.lqi !== null ? b`LQI: ${conn.lqi}` : A}${conn.bidirectionalLqi !== void 0 ? b`<span class="route-info"
|
|
21156
|
+
>, Bidir: ${conn.bidirectionalLqi}</span
|
|
21157
|
+
>` : A}${conn.pathCost !== void 0 ? b`<span class="route-info">, Cost: ${conn.pathCost}</span>` : A}
|
|
19749
21158
|
${!conn.isOutgoing ? b`<span class="direction-hint">(reverse)</span>` : A}
|
|
19750
21159
|
</div>
|
|
19751
21160
|
</div>
|
|
@@ -19866,7 +21275,11 @@ let NetworkDetails = class extends i$5 {
|
|
|
19866
21275
|
></ha-svg-icon>
|
|
19867
21276
|
` : A}
|
|
19868
21277
|
<div class="neighbor-info">
|
|
19869
|
-
<div class="neighbor-name">
|
|
21278
|
+
<div class="neighbor-name">
|
|
21279
|
+
Node ${nodeId}
|
|
21280
|
+
<span class="node-id-hex">${this._formatNodeIdHex(nodeId)}</span>:
|
|
21281
|
+
${getDeviceName(node)}
|
|
21282
|
+
</div>
|
|
19870
21283
|
${neighborEntry ? b`
|
|
19871
21284
|
<div class="neighbor-signal">
|
|
19872
21285
|
${rssi !== null ? b`RSSI: ${rssi} dBm, ` : A}
|
|
@@ -19890,6 +21303,87 @@ let NetworkDetails = class extends i$5 {
|
|
|
19890
21303
|
</div>
|
|
19891
21304
|
`;
|
|
19892
21305
|
}
|
|
21306
|
+
/**
|
|
21307
|
+
* Determine if update connections button should be shown.
|
|
21308
|
+
*/
|
|
21309
|
+
_canUpdateConnections() {
|
|
21310
|
+
if (this.selectedNodeId === null) return false;
|
|
21311
|
+
const isAccessPoint = typeof this.selectedNodeId === "string" && this.selectedNodeId.startsWith("ap_");
|
|
21312
|
+
if (isAccessPoint) return false;
|
|
21313
|
+
const isUnknown = typeof this.selectedNodeId === "string" && this.selectedNodeId.startsWith("unknown_");
|
|
21314
|
+
if (isUnknown) {
|
|
21315
|
+
return this._getOnlineSeenByNodes().length > 0;
|
|
21316
|
+
}
|
|
21317
|
+
const node = this.nodes[this.selectedNodeId.toString()];
|
|
21318
|
+
if (!node) return false;
|
|
21319
|
+
const networkType = getNetworkType(node);
|
|
21320
|
+
if (networkType === "ethernet" || networkType === "unknown") return false;
|
|
21321
|
+
return true;
|
|
21322
|
+
}
|
|
21323
|
+
/**
|
|
21324
|
+
* Get the type of the currently selected node for dialog variant.
|
|
21325
|
+
*/
|
|
21326
|
+
_getSelectedNodeType() {
|
|
21327
|
+
if (typeof this.selectedNodeId === "string" && this.selectedNodeId.startsWith("unknown_")) {
|
|
21328
|
+
return "unknown";
|
|
21329
|
+
}
|
|
21330
|
+
const node = this.nodes[this.selectedNodeId.toString()];
|
|
21331
|
+
if (!node || node.available === false) {
|
|
21332
|
+
return "offline";
|
|
21333
|
+
}
|
|
21334
|
+
return "online";
|
|
21335
|
+
}
|
|
21336
|
+
/**
|
|
21337
|
+
* Get online neighbors for a Thread node.
|
|
21338
|
+
*/
|
|
21339
|
+
_getOnlineNeighbors(nodeId) {
|
|
21340
|
+
const node = this.nodes[nodeId];
|
|
21341
|
+
if (!node) return [];
|
|
21342
|
+
const networkType = getNetworkType(node);
|
|
21343
|
+
if (networkType === "thread") {
|
|
21344
|
+
const extAddrMap = buildExtAddrMap(this.nodes);
|
|
21345
|
+
const connections = getNodeConnections(nodeId, this.nodes, extAddrMap);
|
|
21346
|
+
return connections.filter(conn => {
|
|
21347
|
+
if (typeof conn.connectedNodeId === "string" && conn.connectedNodeId.startsWith("unknown_")) {
|
|
21348
|
+
return false;
|
|
21349
|
+
}
|
|
21350
|
+
const connectedNode = this.nodes[String(conn.connectedNodeId)];
|
|
21351
|
+
return (connectedNode === null || connectedNode === void 0 ? void 0 : connectedNode.available) === true;
|
|
21352
|
+
}).map(conn => String(conn.connectedNodeId));
|
|
21353
|
+
}
|
|
21354
|
+
return [];
|
|
21355
|
+
}
|
|
21356
|
+
/**
|
|
21357
|
+
* Get online nodes that see an unknown device.
|
|
21358
|
+
*/
|
|
21359
|
+
_getOnlineSeenByNodes() {
|
|
21360
|
+
if (typeof this.selectedNodeId !== "string" || !this.selectedNodeId.startsWith("unknown_")) {
|
|
21361
|
+
return [];
|
|
21362
|
+
}
|
|
21363
|
+
const unknown = this.unknownDevices.get(this.selectedNodeId);
|
|
21364
|
+
if (!unknown) return [];
|
|
21365
|
+
return unknown.seenBy.filter(nodeId => {
|
|
21366
|
+
const node = this.nodes[nodeId.toString()];
|
|
21367
|
+
return (node === null || node === void 0 ? void 0 : node.available) === true;
|
|
21368
|
+
});
|
|
21369
|
+
}
|
|
21370
|
+
/**
|
|
21371
|
+
* Get the name of the selected node for display in dialog.
|
|
21372
|
+
*/
|
|
21373
|
+
_getSelectedNodeName() {
|
|
21374
|
+
if (typeof this.selectedNodeId === "string" && this.selectedNodeId.startsWith("unknown_")) {
|
|
21375
|
+
const unknown = this.unknownDevices.get(this.selectedNodeId);
|
|
21376
|
+
return unknown ? `Unknown (${unknown.extAddressHex.slice(-8)})` : "Unknown Device";
|
|
21377
|
+
}
|
|
21378
|
+
const node = this.nodes[this.selectedNodeId.toString()];
|
|
21379
|
+
return node ? getDeviceName(node) : "Unknown";
|
|
21380
|
+
}
|
|
21381
|
+
_handleUpdateConnections() {
|
|
21382
|
+
this._showUpdateDialog = true;
|
|
21383
|
+
}
|
|
21384
|
+
_handleDialogClose() {
|
|
21385
|
+
this._showUpdateDialog = false;
|
|
21386
|
+
}
|
|
19893
21387
|
_renderWiFiAccessPointInfo(apId) {
|
|
19894
21388
|
const ap = this.wifiAccessPoints.get(apId);
|
|
19895
21389
|
if (!ap) {
|
|
@@ -19925,7 +21419,11 @@ let NetworkDetails = class extends i$5 {
|
|
|
19925
21419
|
@click=${() => this._handleSelectNode(nodeId)}
|
|
19926
21420
|
@keydown=${e => this._handleKeyDown(e, nodeId)}
|
|
19927
21421
|
>
|
|
19928
|
-
<div class="node-name">
|
|
21422
|
+
<div class="node-name">
|
|
21423
|
+
Node ${nodeId}
|
|
21424
|
+
<span class="node-id-hex">${this._formatNodeIdHex(nodeId)}</span>:
|
|
21425
|
+
${getDeviceName(node)}
|
|
21426
|
+
</div>
|
|
19929
21427
|
${wifiDiag.rssi !== null ? b`<div class="node-signal" style="color: ${signalColor}">
|
|
19930
21428
|
${wifiDiag.rssi} dBm
|
|
19931
21429
|
</div>` : A}
|
|
@@ -19953,16 +21451,40 @@ let NetworkDetails = class extends i$5 {
|
|
|
19953
21451
|
}
|
|
19954
21452
|
const isUnknown = typeof this.selectedNodeId === "string" && this.selectedNodeId.startsWith("unknown_");
|
|
19955
21453
|
if (isUnknown) {
|
|
21454
|
+
const onlineSeenByNodes = this._getOnlineSeenByNodes();
|
|
19956
21455
|
return b`
|
|
19957
21456
|
<div class="details-panel">
|
|
19958
21457
|
<div class="header">
|
|
19959
21458
|
<h3>External Device</h3>
|
|
19960
|
-
<
|
|
19961
|
-
|
|
19962
|
-
|
|
21459
|
+
<div class="header-actions">
|
|
21460
|
+
${onlineSeenByNodes.length > 0 ? b`
|
|
21461
|
+
<button
|
|
21462
|
+
class="action-button"
|
|
21463
|
+
@click=${this._handleUpdateConnections}
|
|
21464
|
+
aria-label="Update connection data"
|
|
21465
|
+
title="Update connection data"
|
|
21466
|
+
>
|
|
21467
|
+
<ha-svg-icon .path=${mdiRefresh}></ha-svg-icon>
|
|
21468
|
+
</button>
|
|
21469
|
+
` : A}
|
|
21470
|
+
<button class="close-button" @click=${this._handleClose} aria-label="Close details panel">
|
|
21471
|
+
<ha-svg-icon .path=${mdiClose}></ha-svg-icon>
|
|
21472
|
+
</button>
|
|
21473
|
+
</div>
|
|
19963
21474
|
</div>
|
|
19964
21475
|
<div class="content">${this._renderUnknownDeviceInfo(this.selectedNodeId)}</div>
|
|
19965
21476
|
</div>
|
|
21477
|
+
${this._showUpdateDialog ? b`
|
|
21478
|
+
<update-connections-dialog
|
|
21479
|
+
.client=${this.client}
|
|
21480
|
+
.nodes=${this.nodes}
|
|
21481
|
+
selectedNodeType="unknown"
|
|
21482
|
+
.selectedNodeName=${this._getSelectedNodeName()}
|
|
21483
|
+
.selectedNodeId=${this.selectedNodeId}
|
|
21484
|
+
.onlineNeighborIds=${onlineSeenByNodes}
|
|
21485
|
+
@dialog-closed=${this._handleDialogClose}
|
|
21486
|
+
></update-connections-dialog>
|
|
21487
|
+
` : A}
|
|
19966
21488
|
`;
|
|
19967
21489
|
}
|
|
19968
21490
|
const isAccessPoint = typeof this.selectedNodeId === "string" && this.selectedNodeId.startsWith("ap_");
|
|
@@ -19987,19 +21509,48 @@ let NetworkDetails = class extends i$5 {
|
|
|
19987
21509
|
</div>
|
|
19988
21510
|
`;
|
|
19989
21511
|
}
|
|
21512
|
+
const canUpdate = this._canUpdateConnections();
|
|
21513
|
+
const nodeType = this._getSelectedNodeType();
|
|
21514
|
+
const onlineNeighbors = this._getOnlineNeighbors(String(this.selectedNodeId));
|
|
19990
21515
|
return b`
|
|
19991
21516
|
<div class="details-panel">
|
|
19992
21517
|
<div class="header">
|
|
19993
|
-
<h3>
|
|
19994
|
-
|
|
19995
|
-
<
|
|
19996
|
-
</
|
|
21518
|
+
<h3>
|
|
21519
|
+
Node ${this.selectedNodeId}
|
|
21520
|
+
<span class="node-id-hex">${this._formatNodeIdHex(this.selectedNodeId)}</span>
|
|
21521
|
+
</h3>
|
|
21522
|
+
<div class="header-actions">
|
|
21523
|
+
${canUpdate ? b`
|
|
21524
|
+
<button
|
|
21525
|
+
class="action-button"
|
|
21526
|
+
@click=${this._handleUpdateConnections}
|
|
21527
|
+
aria-label="Update connection data"
|
|
21528
|
+
title="Update connection data"
|
|
21529
|
+
>
|
|
21530
|
+
<ha-svg-icon .path=${mdiRefresh}></ha-svg-icon>
|
|
21531
|
+
</button>
|
|
21532
|
+
` : A}
|
|
21533
|
+
<button class="close-button" @click=${this._handleClose} aria-label="Close details panel">
|
|
21534
|
+
<ha-svg-icon .path=${mdiClose}></ha-svg-icon>
|
|
21535
|
+
</button>
|
|
21536
|
+
</div>
|
|
19997
21537
|
</div>
|
|
19998
21538
|
<div class="content">${this._renderNodeInfo(node)}</div>
|
|
19999
21539
|
<div class="footer">
|
|
20000
21540
|
<a href="#node/${this.selectedNodeId}" class="view-link">View node details</a>
|
|
20001
21541
|
</div>
|
|
20002
21542
|
</div>
|
|
21543
|
+
${this._showUpdateDialog ? b`
|
|
21544
|
+
<update-connections-dialog
|
|
21545
|
+
.client=${this.client}
|
|
21546
|
+
.nodes=${this.nodes}
|
|
21547
|
+
.selectedNodeType=${nodeType}
|
|
21548
|
+
.selectedNodeName=${this._getSelectedNodeName()}
|
|
21549
|
+
.selectedNodeId=${this.selectedNodeId}
|
|
21550
|
+
.onlineNeighborIds=${onlineNeighbors}
|
|
21551
|
+
@dialog-closed=${this._handleDialogClose}
|
|
21552
|
+
></update-connections-dialog>
|
|
21553
|
+
` : A}
|
|
20003
21554
|
`;
|
|
20004
21555
|
}
|
|
20005
21556
|
};
|
|
@@ -20045,6 +21596,38 @@ NetworkDetails.styles = i$8`
|
|
|
20045
21596
|
color: var(--md-sys-color-on-surface, #333);
|
|
20046
21597
|
}
|
|
20047
21598
|
|
|
21599
|
+
.node-id-hex {
|
|
21600
|
+
font-size: 0.75em;
|
|
21601
|
+
font-weight: 400;
|
|
21602
|
+
color: var(--md-sys-color-on-surface-variant, #666);
|
|
21603
|
+
font-family: monospace;
|
|
21604
|
+
}
|
|
21605
|
+
|
|
21606
|
+
.header-actions {
|
|
21607
|
+
display: flex;
|
|
21608
|
+
align-items: center;
|
|
21609
|
+
gap: 4px;
|
|
21610
|
+
}
|
|
21611
|
+
|
|
21612
|
+
.action-button {
|
|
21613
|
+
background: none;
|
|
21614
|
+
border: none;
|
|
21615
|
+
padding: 4px;
|
|
21616
|
+
cursor: pointer;
|
|
21617
|
+
border-radius: 50%;
|
|
21618
|
+
display: flex;
|
|
21619
|
+
align-items: center;
|
|
21620
|
+
justify-content: center;
|
|
21621
|
+
}
|
|
21622
|
+
|
|
21623
|
+
.action-button:hover {
|
|
21624
|
+
background-color: var(--md-sys-color-surface-container-high, #e8e8e8);
|
|
21625
|
+
}
|
|
21626
|
+
|
|
21627
|
+
.action-button ha-svg-icon {
|
|
21628
|
+
--icon-primary-color: var(--md-sys-color-on-surface-variant, #666);
|
|
21629
|
+
}
|
|
21630
|
+
|
|
20048
21631
|
.close-button {
|
|
20049
21632
|
background: none;
|
|
20050
21633
|
border: none;
|
|
@@ -20166,6 +21749,11 @@ NetworkDetails.styles = i$8`
|
|
|
20166
21749
|
opacity: 0.8;
|
|
20167
21750
|
}
|
|
20168
21751
|
|
|
21752
|
+
.route-info {
|
|
21753
|
+
color: var(--md-sys-color-tertiary, #7d5260);
|
|
21754
|
+
font-size: 0.85em;
|
|
21755
|
+
}
|
|
21756
|
+
|
|
20169
21757
|
.footer {
|
|
20170
21758
|
padding: 12px 16px;
|
|
20171
21759
|
border-top: 1px solid var(--md-sys-color-outline-variant, #ccc);
|
|
@@ -20241,6 +21829,10 @@ __decorateClass$8([n$2({
|
|
|
20241
21829
|
__decorateClass$8([n$2({
|
|
20242
21830
|
type: Object
|
|
20243
21831
|
})], NetworkDetails.prototype, "wifiAccessPoints", 2);
|
|
21832
|
+
__decorateClass$8([c$4({
|
|
21833
|
+
context: clientContext
|
|
21834
|
+
})], NetworkDetails.prototype, "client", 2);
|
|
21835
|
+
__decorateClass$8([r$2()], NetworkDetails.prototype, "_showUpdateDialog", 2);
|
|
20244
21836
|
NetworkDetails = __decorateClass$8([t$1("network-details")], NetworkDetails);
|
|
20245
21837
|
|
|
20246
21838
|
/**
|
|
@@ -28303,15 +29895,25 @@ class BaseNetworkGraph extends i$5 {
|
|
|
28303
29895
|
this._resizeObserver.observe(this._container);
|
|
28304
29896
|
}
|
|
28305
29897
|
this._themeUnsubscribe = ThemeService.subscribe(() => {
|
|
28306
|
-
if (this._network) {
|
|
29898
|
+
if (this._network && this._nodesDataSet) {
|
|
29899
|
+
const fontColor = this._getFontColor();
|
|
28307
29900
|
this._network.setOptions({
|
|
28308
29901
|
nodes: {
|
|
28309
29902
|
font: {
|
|
28310
|
-
color:
|
|
29903
|
+
color: fontColor
|
|
28311
29904
|
}
|
|
28312
29905
|
}
|
|
28313
29906
|
});
|
|
28314
29907
|
this._updateGraph();
|
|
29908
|
+
const allNodes = this._nodesDataSet.get();
|
|
29909
|
+
const nodeUpdates = allNodes.map(node => ({
|
|
29910
|
+
id: node.id,
|
|
29911
|
+
font: {
|
|
29912
|
+
color: fontColor
|
|
29913
|
+
}
|
|
29914
|
+
}));
|
|
29915
|
+
this._nodesDataSet.update(nodeUpdates);
|
|
29916
|
+
this._network.redraw();
|
|
28315
29917
|
}
|
|
28316
29918
|
});
|
|
28317
29919
|
}
|
|
@@ -28747,7 +30349,7 @@ function createUnknownDeviceIconDataUrl(isRouter = false, isSelected = false) {
|
|
|
28747
30349
|
return createIconDataUrl(iconPath, color);
|
|
28748
30350
|
}
|
|
28749
30351
|
function createWiFiRouterIconDataUrl(isSelected = false) {
|
|
28750
|
-
const color = isSelected ? "#1976d2" : "#
|
|
30352
|
+
const color = isSelected ? "#1976d2" : "#ff9800";
|
|
28751
30353
|
return createIconDataUrl(mdiWifi, color);
|
|
28752
30354
|
}
|
|
28753
30355
|
|
|
@@ -28820,6 +30422,9 @@ let ThreadGraph = class extends BaseNetworkGraph {
|
|
|
28820
30422
|
}
|
|
28821
30423
|
const graphEdges = connections.map((conn, index) => {
|
|
28822
30424
|
const isToUnknown = typeof conn.toNodeId === "string" && conn.toNodeId.startsWith("unknown_");
|
|
30425
|
+
const fromNode = this.nodes[String(conn.fromNodeId)];
|
|
30426
|
+
const toNode = this.nodes[String(conn.toNodeId)];
|
|
30427
|
+
const hasOfflineEndpoint = (fromNode === null || fromNode === void 0 ? void 0 : fromNode.available) === false || (toNode === null || toNode === void 0 ? void 0 : toNode.available) === false;
|
|
28823
30428
|
return {
|
|
28824
30429
|
id: `edge_${index}`,
|
|
28825
30430
|
from: conn.fromNodeId,
|
|
@@ -28830,8 +30435,8 @@ let ThreadGraph = class extends BaseNetworkGraph {
|
|
|
28830
30435
|
},
|
|
28831
30436
|
width: 2,
|
|
28832
30437
|
title: conn.rssi !== null ? `RSSI: ${conn.rssi} dBm, LQI: ${conn.lqi}` : `LQI: ${conn.lqi}`,
|
|
28833
|
-
dashes: isToUnknown
|
|
28834
|
-
// Dashed lines to unknown devices
|
|
30438
|
+
dashes: isToUnknown || hasOfflineEndpoint
|
|
30439
|
+
// Dashed lines to unknown or offline devices
|
|
28835
30440
|
};
|
|
28836
30441
|
});
|
|
28837
30442
|
const existingNodeIds = this._nodesDataSet.getIds();
|
|
@@ -28905,7 +30510,7 @@ let WiFiGraph = class extends BaseNetworkGraph {
|
|
|
28905
30510
|
if (!this._nodesDataSet || !this._edgesDataSet) return;
|
|
28906
30511
|
this._clearOriginalEdgeColors();
|
|
28907
30512
|
const categorized = categorizeDevices(this.nodes);
|
|
28908
|
-
const wifiNodeIds =
|
|
30513
|
+
const wifiNodeIds = categorized.wifi;
|
|
28909
30514
|
if (wifiNodeIds.length === 0) {
|
|
28910
30515
|
this._nodesDataSet.clear();
|
|
28911
30516
|
this._edgesDataSet.clear();
|
|
@@ -28971,7 +30576,9 @@ let WiFiGraph = class extends BaseNetworkGraph {
|
|
|
28971
30576
|
highlight: signalColor
|
|
28972
30577
|
},
|
|
28973
30578
|
width: 2,
|
|
28974
|
-
title: wifiDiag.rssi !== null ? `RSSI: ${wifiDiag.rssi} dBm` : "RSSI: Unknown"
|
|
30579
|
+
title: wifiDiag.rssi !== null ? `RSSI: ${wifiDiag.rssi} dBm` : "RSSI: Unknown",
|
|
30580
|
+
dashes: isOffline
|
|
30581
|
+
// Dashed lines for offline devices
|
|
28975
30582
|
});
|
|
28976
30583
|
}
|
|
28977
30584
|
}
|
|
@@ -28987,7 +30594,7 @@ let WiFiGraph = class extends BaseNetworkGraph {
|
|
|
28987
30594
|
}
|
|
28988
30595
|
render() {
|
|
28989
30596
|
const categorized = categorizeDevices(this.nodes);
|
|
28990
|
-
const wifiCount = categorized.wifi.length
|
|
30597
|
+
const wifiCount = categorized.wifi.length;
|
|
28991
30598
|
if (wifiCount === 0) {
|
|
28992
30599
|
return b`
|
|
28993
30600
|
<div class="empty-state">
|
|
@@ -29310,9 +30917,11 @@ let MatterNodeView = class extends i$5 {
|
|
|
29310
30917
|
const showGraphButton = networkType === "thread" || networkType === "wifi" || networkType === "ethernet";
|
|
29311
30918
|
const graphViewType = networkType === "ethernet" ? "wifi" : networkType;
|
|
29312
30919
|
const graphUrl = showGraphButton ? `#${graphViewType}/${this.node.node_id}` : null;
|
|
30920
|
+
const fabricIndex = getEffectiveFabricIndex(this.client.serverInfo.fabric_index, isTestNodeId(this.node.node_id));
|
|
30921
|
+
const nodeHex = formatNodeAddress(fabricIndex, this.node.node_id);
|
|
29313
30922
|
return b`
|
|
29314
30923
|
<dashboard-header
|
|
29315
|
-
.title=${
|
|
30924
|
+
.title=${`Node ${this.node.node_id} ${nodeHex}`}
|
|
29316
30925
|
.client=${this.client}
|
|
29317
30926
|
backButton="#"
|
|
29318
30927
|
></dashboard-header>
|
|
@@ -29320,7 +30929,7 @@ let MatterNodeView = class extends i$5 {
|
|
|
29320
30929
|
<!-- node details section -->
|
|
29321
30930
|
<div class="container">
|
|
29322
30931
|
<div class="node-title-bar">
|
|
29323
|
-
<h2>Node ${this.node.node_id}</h2>
|
|
30932
|
+
<h2>Node ${this.node.node_id} <span class="node-id-hex">${nodeHex}</span></h2>
|
|
29324
30933
|
${showGraphButton ? b`
|
|
29325
30934
|
<a href=${graphUrl} class="show-in-graph-button" title="Show in ${graphViewType} graph">
|
|
29326
30935
|
<ha-svg-icon .path=${mdiGraphOutline}></ha-svg-icon>
|
|
@@ -29405,6 +31014,13 @@ MatterNodeView.styles = i$8`
|
|
|
29405
31014
|
color: var(--md-sys-color-on-background, #333);
|
|
29406
31015
|
}
|
|
29407
31016
|
|
|
31017
|
+
.node-id-hex {
|
|
31018
|
+
font-size: 0.75em;
|
|
31019
|
+
font-weight: 400;
|
|
31020
|
+
color: var(--md-sys-color-on-surface-variant, #666);
|
|
31021
|
+
font-family: monospace;
|
|
31022
|
+
}
|
|
31023
|
+
|
|
29408
31024
|
.show-in-graph-button {
|
|
29409
31025
|
display: inline-flex;
|
|
29410
31026
|
align-items: center;
|
|
@@ -29456,7 +31072,7 @@ MatterNodeView = __decorateClass$3([t$1("matter-node-view")], MatterNodeView);
|
|
|
29456
31072
|
*/
|
|
29457
31073
|
const showCommissionNodeDialog = async client => {
|
|
29458
31074
|
var _document$querySelect;
|
|
29459
|
-
await import('./commission-node-dialog-
|
|
31075
|
+
await import('./commission-node-dialog-CcMuttYO.js');
|
|
29460
31076
|
const dialog = document.createElement("commission-node-dialog");
|
|
29461
31077
|
dialog.client = client;
|
|
29462
31078
|
(_document$querySelect = document.querySelector("matter-dashboard-app")) === null || _document$querySelect === void 0 || _document$querySelect.renderRoot.appendChild(dialog);
|