Merge pull request #6389 from home-assistant/dev

This commit is contained in:
Bram Kragten 2020-07-14 23:53:51 +02:00 committed by GitHub
commit 78914091b1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
162 changed files with 4302 additions and 2641 deletions

View File

@ -11,6 +11,7 @@ const META_PATH = path.resolve(ICON_PACKAGE_PATH, "meta.json");
const PACKAGE_PATH = path.resolve(ICON_PACKAGE_PATH, "package.json");
const ICON_PATH = path.resolve(ICON_PACKAGE_PATH, "svg");
const OUTPUT_DIR = path.resolve(__dirname, "../../build/mdi");
const REMOVED_ICONS_PATH = path.resolve(__dirname, "../removedIcons.json");
const encoding = "utf8";
@ -25,6 +26,13 @@ const getMeta = () => {
});
};
const addRemovedMeta = (meta) => {
const file = fs.readFileSync(REMOVED_ICONS_PATH, { encoding });
const removed = JSON.parse(file);
const combinedMeta = [...meta, ...removed];
return combinedMeta.sort((a, b) => a.name.localeCompare(b.name));
};
const splitBySize = (meta) => {
const chunks = [];
const CHUNK_SIZE = 50000;
@ -69,7 +77,7 @@ const findDifferentiator = (curString, prevString) => {
};
gulp.task("gen-icons-json", (done) => {
const meta = getMeta();
const meta = addRemovedMeta(getMeta());
const split = splitBySize(meta);
if (!fs.existsSync(OUTPUT_DIR)) {

View File

@ -0,0 +1,263 @@
[
{
"path": "M17.5,15.61C17.33,15.37 9.53,5.4 9.27,5.08C9,4.75 9.08,4.65 9.13,4.59C9.22,4.5 9.36,4.5 9.93,4.5C10.26,4.5 13.59,4.5 13.94,4.47C14.66,4.47 14.78,4.53 14.85,4.56C14.93,4.58 15.13,4.75 15.26,4.92C15.33,5 22.32,13.36 22.39,13.45C22.46,13.54 22.59,13.69 22.67,13.84C22.76,14 22.77,14.18 22.64,14.25C22.56,14.3 18.7,15.89 18.59,15.93C18.5,16 18.27,16.06 18.11,16.04C18,16 17.77,15.92 17.5,15.61M21.47,15.42L21.75,15.47C21.75,15.47 22.68,15.65 22.77,15.67C22.87,15.69 22.96,15.76 22.95,15.79C22.94,15.87 22.9,15.91 22.83,15.95C22.77,16 18.58,18.58 18.5,18.62C18.43,18.66 18.33,18.72 18.11,18.75C17.7,18.83 16.91,18.61 16.66,18.56C16.41,18.5 6.15,16.23 6.06,16.2C5.97,16.17 5.91,16.16 5.9,16.08C5.89,15.94 6.11,15.88 6.28,15.81C6.46,15.75 11.28,14 11.45,13.93C11.62,13.86 11.84,13.84 11.95,13.83C12.06,13.82 12.73,13.93 13.03,13.97C13.34,14 14.2,14.15 14.2,14.15L16.16,16.7C16.5,17.09 16.72,17.25 17,17.28C17.15,17.29 17.31,17.25 17.42,17.2C17.5,17.16 21.47,15.42 21.47,15.42M10.25,9.18L11.96,11.37L12,11.45V11.5C11.96,11.54 8.93,14.32 8.91,14.35L5.72,15.5C5.72,15.5 5.63,15.55 5.58,15.58C5.53,15.61 5.47,15.67 5.5,15.82C5.5,15.87 5.5,16.59 5.5,16.79L1.56,18.04C1.37,18.1 1,18.23 0.95,18.19C0.88,18.14 0.97,18.03 1,17.97C1.06,17.91 9.08,10 9.39,9.7C9.84,9.24 10.25,9.18 10.25,9.18",
"name": "accusoft"
},
{
"path": "M4.94,11.12C5.23,11.12 5.5,11.16 5.76,11.23C5.77,9.09 7.5,7.35 9.65,7.35C11.27,7.35 12.67,8.35 13.24,9.77C13.83,9 14.74,8.53 15.76,8.53C17.5,8.53 18.94,9.95 18.94,11.71C18.94,11.95 18.91,12.2 18.86,12.43C19.1,12.34 19.37,12.29 19.65,12.29C20.95,12.29 22,13.35 22,14.65C22,15.95 20.95,17 19.65,17C18.35,17 6.36,17 4.94,17C3.32,17 2,15.68 2,14.06C2,12.43 3.32,11.12 4.94,11.12Z",
"name": "amazon-drive"
},
{
"path": "M8,11.5A1.25,1.25 0 0,0 6.75,12.75A1.25,1.25 0 0,0 8,14A1.25,1.25 0 0,0 9.25,12.75A1.25,1.25 0 0,0 8,11.5M16,11.5A1.25,1.25 0 0,0 14.75,12.75A1.25,1.25 0 0,0 16,14A1.25,1.25 0 0,0 17.25,12.75A1.25,1.25 0 0,0 16,11.5M12,7C13.5,7 14.9,7.33 16.18,7.91L18.34,5.75C18.73,5.36 19.36,5.36 19.75,5.75C20.14,6.14 20.14,6.77 19.75,7.16L17.95,8.96C20.41,10.79 22,13.71 22,17H2C2,13.71 3.59,10.79 6.05,8.96L4.25,7.16C3.86,6.77 3.86,6.14 4.25,5.75C4.64,5.36 5.27,5.36 5.66,5.75L7.82,7.91C9.1,7.33 10.5,7 12,7Z",
"name": "android-head"
},
{
"path": "M2,16.25C2,16.25 4,3.75 12,3.75C20,3.75 22,16.25 22,16.25C22,16.25 20,20.25 12,20.25C4,20.25 2,16.25 2,16.25M3.35,15.65C3.35,15.65 4.3,19 12,19C17,19 20,17.8 20.65,15.85C21.3,13.9 15.65,7.6 14.65,7.6C13.65,7.6 11.2,12 10.45,12C8.45,12 8.9,10 7.15,10C5.4,10 3.35,15.65 3.35,15.65Z",
"name": "basecamp"
},
{
"path": "M7,12A5,5 0 0,0 12,17A5,5 0 0,0 17,12A5,5 0 0,0 12,7C10.87,7 9.84,7.37 9,8V2.46C9.95,2.16 10.95,2 12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12C2,8.3 4,5.07 7,3.34V12M12,9A3,3 0 0,1 15,12A3,3 0 0,1 12,15A3,3 0 0,1 9,12A3,3 0 0,1 12,9Z",
"name": "beats"
},
{
"path": "M19.58,12.27C19.54,11.65 19.33,11.18 18.96,10.86C18.59,10.54 18.13,10.38 17.58,10.38C17,10.38 16.5,10.55 16.19,10.89C15.86,11.23 15.65,11.69 15.57,12.27M21.92,12.04C22,12.45 22,13.04 22,13.81H15.5C15.55,14.71 15.85,15.33 16.44,15.69C16.79,15.92 17.22,16.03 17.73,16.03C18.26,16.03 18.69,15.89 19,15.62C19.2,15.47 19.36,15.27 19.5,15H21.88C21.82,15.54 21.53,16.07 21,16.62C20.22,17.5 19.1,17.92 17.66,17.92C16.47,17.92 15.43,17.55 14.5,16.82C13.62,16.09 13.16,14.9 13.16,13.25C13.16,11.7 13.57,10.5 14.39,9.7C15.21,8.87 16.27,8.46 17.58,8.46C18.35,8.46 19.05,8.6 19.67,8.88C20.29,9.16 20.81,9.59 21.21,10.2C21.58,10.73 21.81,11.34 21.92,12.04M9.58,14.07C9.58,13.42 9.31,12.97 8.79,12.73C8.5,12.6 8.08,12.53 7.54,12.5H4.87V15.84H7.5C8.04,15.84 8.46,15.77 8.76,15.62C9.31,15.35 9.58,14.83 9.58,14.07M4.87,10.46H7.5C8.04,10.46 8.5,10.36 8.82,10.15C9.16,9.95 9.32,9.58 9.32,9.06C9.32,8.5 9.1,8.1 8.66,7.91C8.27,7.78 7.78,7.72 7.19,7.72H4.87M11.72,12.42C12.04,12.92 12.2,13.53 12.2,14.24C12.2,15 12,15.64 11.65,16.23C11.41,16.62 11.12,16.94 10.77,17.21C10.37,17.5 9.9,17.72 9.36,17.83C8.82,17.94 8.24,18 7.61,18H2V5.55H8C9.53,5.58 10.6,6 11.23,6.88C11.61,7.41 11.8,8.04 11.8,8.78C11.8,9.54 11.61,10.15 11.23,10.61C11,10.87 10.7,11.11 10.28,11.32C10.91,11.55 11.39,11.92 11.72,12.42M20.06,7.32H15.05V6.07H20.06V7.32Z",
"name": "behance"
},
{
"path": "M5.45,10.28C6.4,10.28 7.5,11.05 7.5,12C7.5,12.95 6.4,13.72 5.45,13.72H2L2.69,10.28H5.45M6.14,4.76C7.09,4.76 8.21,5.53 8.21,6.5C8.21,7.43 7.09,8.21 6.14,8.21H2.69L3.38,4.76H6.14M13.03,4.76C14,4.76 15.1,5.53 15.1,6.5C15.1,7.43 14,8.21 13.03,8.21H9.41L10.1,4.76H13.03M12.34,10.28C13.3,10.28 14.41,11.05 14.41,12C14.41,12.95 13.3,13.72 12.34,13.72H8.72L9.41,10.28H12.34M10.97,15.79C11.92,15.79 13.03,16.57 13.03,17.5C13.03,18.47 11.92,19.24 10.97,19.24H7.5L8.21,15.79H10.97M18.55,13.72C19.5,13.72 20.62,14.5 20.62,15.45C20.62,16.4 19.5,17.17 18.55,17.17H15.1L15.79,13.72H18.55M19.93,8.21C20.88,8.21 22,9 22,9.93C22,10.88 20.88,11.66 19.93,11.66H16.5L17.17,8.21H19.93Z",
"name": "blackberry"
},
{
"path": "M12,3A9,9 0 0,1 21,12A9,9 0 0,1 12,21A9,9 0 0,1 3,12A9,9 0 0,1 12,3M5.94,8.5C4,11.85 5.15,16.13 8.5,18.06C11.85,20 18.85,7.87 15.5,5.94C12.15,4 7.87,5.15 5.94,8.5Z",
"name": "cisco-webex"
},
{
"path": "M11.9,14.5H10.8V9.5H11.9C13.5,9.5 14.6,10.4 14.6,12C14.6,13.6 13.5,14.5 11.9,14.5M11.9,7H8.1V17H11.8C15.3,17 17.4,14.9 17.4,12V12C17.4,9.1 15.4,7 11.9,7M12,20C10.1,20 8.3,19.3 6.9,18.1L6.2,17.5L4.5,17.7L5.2,16.1L4.9,15.3C4.4,14.2 4.2,13.1 4.2,11.9C4.2,7.5 7.8,3.9 12.1,3.9C16.4,3.9 19.9,7.6 19.9,12C19.9,16.4 16.3,20 12,20M12,2C6.5,2 2.1,6.5 2.1,12C2.1,13.5 2.4,14.9 3,16.2L1.4,20.3L5.7,19.7C7.4,21.2 9.7,22.1 12.1,22.1C17.6,22.1 22,17.6 22,12.1C22,6.6 17.5,2 12,2Z",
"name": "disqus-outline"
},
{
"path": "M16.42,18.42C16,16.5 15.5,14.73 15,13.17C15.5,13.1 16,13.06 16.58,13.06H16.6V13.06H16.6C17.53,13.06 18.55,13.18 19.66,13.43C19.28,15.5 18.08,17.27 16.42,18.42M12,19.8C10.26,19.8 8.66,19.23 7.36,18.26C7.64,17.81 8.23,16.94 9.18,16.04C10.14,15.11 11.5,14.15 13.23,13.58C13.82,15.25 14.36,17.15 14.77,19.29C13.91,19.62 13,19.8 12,19.8M4.2,12C4.2,11.96 4.2,11.93 4.2,11.89C4.42,11.9 4.71,11.9 5.05,11.9H5.06C6.62,11.89 9.36,11.76 12.14,10.89C12.29,11.22 12.44,11.56 12.59,11.92C10.73,12.54 9.27,13.53 8.19,14.5C7.16,15.46 6.45,16.39 6.04,17C4.9,15.66 4.2,13.91 4.2,12M8.55,5C9.1,5.65 10.18,7.06 11.34,9.25C9,9.96 6.61,10.12 5.18,10.12C5.14,10.12 5.1,10.12 5.06,10.12H5.05C4.81,10.12 4.6,10.12 4.43,10.11C5,7.87 6.5,6 8.55,5M12,4.2C13.84,4.2 15.53,4.84 16.86,5.91C15.84,7.14 14.5,8 13.03,8.65C12,6.67 11,5.25 10.34,4.38C10.88,4.27 11.43,4.2 12,4.2M18.13,7.18C19.1,8.42 19.71,9.96 19.79,11.63C18.66,11.39 17.6,11.28 16.6,11.28V11.28H16.59C15.79,11.28 15.04,11.35 14.33,11.47C14.16,11.05 14,10.65 13.81,10.26C15.39,9.57 16.9,8.58 18.13,7.18M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z",
"name": "dribbble"
},
{
"path": "M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3M15.09,16.5C14.81,15.14 14.47,13.91 14.08,12.82L15.2,12.74H15.22V12.74C15.87,12.74 16.59,12.82 17.36,13C17.09,14.44 16.26,15.69 15.09,16.5M12,17.46C10.79,17.46 9.66,17.06 8.76,16.39C8.95,16.07 9.36,15.46 10,14.83C10.7,14.18 11.64,13.5 12.86,13.11C13.28,14.27 13.65,15.6 13.94,17.1C13.33,17.33 12.68,17.46 12,17.46M6.54,12V11.92L7.14,11.93V11.93C8.24,11.93 10.15,11.83 12.1,11.22L12.41,11.94C11.11,12.38 10.09,13.07 9.34,13.76C8.61,14.42 8.12,15.08 7.83,15.5C7.03,14.56 6.54,13.34 6.54,12M9.59,7.11C9.97,7.56 10.73,8.54 11.54,10.08C9.89,10.57 8.23,10.68 7.22,10.68H7.14V10.68H6.7C7.09,9.11 8.17,7.81 9.59,7.11M12,6.54C13.29,6.54 14.47,7 15.41,7.74C14.69,8.6 13.74,9.22 12.72,9.66C12,8.27 11.31,7.28 10.84,6.67C11.21,6.59 11.6,6.54 12,6.54M16.29,8.63C16.97,9.5 17.4,10.57 17.45,11.74C16.66,11.58 15.92,11.5 15.22,11.5V11.5C14.66,11.5 14.13,11.54 13.63,11.63L13.27,10.78C14.37,10.3 15.43,9.61 16.29,8.63M12,5A7,7 0 0,0 5,12A7,7 0 0,0 12,19A7,7 0 0,0 19,12A7,7 0 0,0 12,5Z",
"name": "dribbble-box"
},
{
"path": "M6.72,20.78C8.23,20.71 10.07,20.78 11.87,20.78C13.72,20.78 15.62,20.66 17.12,20.78C17.72,20.83 18.28,21.19 18.77,20.87C19.16,20.38 18.87,19.71 18.96,19.05C19.12,17.78 20.28,16.27 18.59,15.95C17.87,16.61 18.35,17.23 17.95,18.05C17.45,19.03 15.68,19.37 14,19.5C12.54,19.62 10,19.76 9.5,18.77C9.04,17.94 9.29,16.65 9.29,15.58C9.29,14.38 9.16,13.22 9.5,12.3C11.32,12.43 13.7,11.69 15,12.5C15.87,13 15.37,14.06 16.38,14.4C17.07,14.21 16.7,13.32 16.66,12.5C16.63,11.94 16.63,11.19 16.66,10.57C16.69,9.73 17,8.76 16.1,8.74C15.39,9.3 15.93,10.23 15.18,10.75C14.95,10.92 14.43,11 14.08,11C12.7,11.17 10.54,11.05 9.38,10.84C9.23,9.16 9.24,6.87 9.38,5.19C10,4.57 11.45,4.54 12.42,4.55C14.13,4.55 16.79,4.7 17.3,5.55C17.58,6 17.36,7 17.85,7.1C18.85,7.33 18.36,5.55 18.41,4.73C18.44,4.11 18.71,3.72 18.59,3.27C18.27,2.83 17.79,3.05 17.5,3.09C14.35,3.5 9.6,3.27 6.26,3.27C5.86,3.27 5.16,3.07 4.88,3.54C4.68,4.6 6.12,4.16 6.62,4.73C6.79,4.91 7.03,5.73 7.08,6.28C7.23,7.74 7.08,9.97 7.08,12.12C7.08,14.38 7.26,16.67 7.08,18.05C7,18.53 6.73,19.3 6.62,19.41C6,20.04 4.34,19.35 4.5,20.69C5.09,21.08 5.93,20.82 6.72,20.78Z",
"name": "etsy"
},
{
"path": "M12,17.5C10.15,17.5 8.42,16.56 7.41,15L17.41,12.75L22.08,11.75C22.05,10.32 21.71,8.92 21.08,7.64C18.66,2.61 12.62,0.5 7.58,2.92C2.55,5.34 0.44,11.38 2.86,16.41C5.29,21.44 11.33,23.56 16.36,21.14C18.5,20.09 20.25,18.31 21.22,16.11L16.61,15C15.6,16.57 13.86,17.5 12,17.5M12,6.5C13.76,6.5 15.41,7.34 16.44,8.77L6.57,11.19C6.96,8.5 9.28,6.5 12,6.5Z",
"name": "eventbrite"
},
{
"path": "M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3M18,5H15.5A3.5,3.5 0 0,0 12,8.5V11H10V14H12V21H15V14H18V11H15V9A1,1 0 0,1 16,8H18V5Z",
"name": "facebook-box"
},
{
"path": "M21,12A9,9 0 0,1 12,21H4.5L9.74,15.76L11.16,17.17L9.33,19H12A7,7 0 0,0 19,12V7L21,5V12M3,12A9,9 0 0,1 12,3H19.5L14.26,8.24L12.84,6.83L14.67,5H12A7,7 0 0,0 5,12V17L3,19V12Z",
"name": "flattr"
},
{
"path": "M11,12C11,14.5 9,16.5 6.5,16.5C4,16.5 2,14.5 2,12C2,9.5 4,7.5 6.5,7.5C9,7.5 11,9.5 11,12M17.5,7.5C15,7.5 13,9.5 13,12C13,14.5 15,16.5 17.5,16.5C20,16.5 22,14.5 22,12C22,9.5 20,7.5 17.5,7.5Z",
"name": "flickr"
},
{
"path": "M17,5L16.57,7.5C16.5,7.73 16.2,8 15.91,8C15.61,8 12,8 12,8C11.53,8 10.95,8.32 10.95,8.79V9.2C10.95,9.67 11.53,10 12,10C12,10 14.95,10 15.28,10C15.61,10 15.93,10.36 15.86,10.71C15.79,11.07 14.94,13.28 14.9,13.5C14.86,13.67 14.64,14 14.25,14C13.92,14 11.37,14 11.37,14C10.85,14 10.69,14.07 10.34,14.5C10,14.94 7.27,18.1 7.27,18.1C7.24,18.13 7,18.04 7,18V5C7,4.7 7.61,4 8,4C8,4 16.17,4 16.5,4C16.82,4 17.08,4.61 17,5M17,14.45C17.11,13.97 18.78,6.72 19.22,4.55M17.58,2C17.58,2 8.38,2 6.91,2C5.43,2 5,3.11 5,3.8C5,4.5 5,20.76 5,20.76C5,21.54 5.42,21.84 5.66,21.93C5.9,22.03 6.55,22.11 6.94,21.66C6.94,21.66 11.65,16.22 11.74,16.13C11.87,16 11.87,16 12,16C12.26,16 14.2,16 15.26,16C16.63,16 16.85,15 17,14.45C17.11,13.97 18.78,6.72 19.22,4.55C19.56,2.89 19.14,2 17.58,2Z",
"name": "foursquare"
},
{
"path": "M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H14.56C14.24,20.93 14.23,20.32 14.23,20.11L14.24,17.64C14.24,16.8 13.95,16.25 13.63,15.97C15.64,15.75 17.74,15 17.74,11.53C17.74,10.55 17.39,9.74 16.82,9.11C16.91,8.89 17.22,7.97 16.73,6.73C16.73,6.73 15.97,6.5 14.25,7.66C13.53,7.46 12.77,7.36 12,7.35C11.24,7.36 10.46,7.46 9.75,7.66C8.03,6.5 7.27,6.73 7.27,6.73C6.78,7.97 7.09,8.89 7.18,9.11C6.61,9.74 6.26,10.55 6.26,11.53C6.26,15 8.36,15.75 10.36,16C10.1,16.2 9.87,16.6 9.79,17.18C9.27,17.41 7.97,17.81 7.17,16.43C7.17,16.43 6.69,15.57 5.79,15.5C5.79,15.5 4.91,15.5 5.73,16.05C5.73,16.05 6.32,16.33 6.73,17.37C6.73,17.37 7.25,19.12 9.76,18.58L9.77,20.11C9.77,20.32 9.75,20.93 9.43,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3Z",
"name": "github-box"
},
{
"path": "M20.38,8.53C20.54,8.13 21.06,6.54 20.21,4.39C20.21,4.39 18.9,4 15.91,6C14.66,5.67 13.33,5.62 12,5.62C10.68,5.62 9.34,5.67 8.09,6C5.1,3.97 3.79,4.39 3.79,4.39C2.94,6.54 3.46,8.13 3.63,8.53C2.61,9.62 2,11 2,12.72C2,19.16 6.16,20.61 12,20.61C17.79,20.61 22,19.16 22,12.72C22,11 21.39,9.62 20.38,8.53M12,19.38C7.88,19.38 4.53,19.19 4.53,15.19C4.53,14.24 5,13.34 5.8,12.61C7.14,11.38 9.43,12.03 12,12.03C14.59,12.03 16.85,11.38 18.2,12.61C19,13.34 19.5,14.23 19.5,15.19C19.5,19.18 16.13,19.38 12,19.38M8.86,13.12C8.04,13.12 7.36,14.12 7.36,15.34C7.36,16.57 8.04,17.58 8.86,17.58C9.69,17.58 10.36,16.58 10.36,15.34C10.36,14.11 9.69,13.12 8.86,13.12M15.14,13.12C14.31,13.12 13.64,14.11 13.64,15.34C13.64,16.58 14.31,17.58 15.14,17.58C15.96,17.58 16.64,16.58 16.64,15.34C16.64,14.11 16,13.12 15.14,13.12Z",
"name": "github-face"
},
{
"path": "M8,2A3,3 0 0,0 5,5V16.5H8V5H19A3,3 0 0,0 16,2H8M16,7.5V19H5A3,3 0 0,0 8,22H16A3,3 0 0,0 19,19V7.5H16Z",
"name": "glassdoor"
},
{
"path": "M2,22L8.5,2H15.4L9.2,20C9.2,20 8.6,22 7,22C5.9,22 2,22 2,22M16.4,5L13,15L15,20.7C15,20.7 15.4,22 17,22C18.3,22 22,22 22,22L16.4,5Z",
"name": "google-adwords"
},
{
"path": "M19,3H13V8L17,7L16,11H21V5C21,3.89 20.1,3 19,3M17,17L13,16V21H19A2,2 0 0,0 21,19V13H16M8,13H3V19A2,2 0 0,0 5,21H11V16L7,17M3,5V11H8L7,7L11,8V3H5C3.89,3 3,3.89 3,5Z",
"name": "google-pages"
},
{
"path": "M12,1.5A9,9 0 0,1 21,10.5C21,13.11 19.89,15.47 18.11,17.11L17.05,16.05C18.55,14.68 19.5,12.7 19.5,10.5A7.5,7.5 0 0,0 12,3A7.5,7.5 0 0,0 4.5,10.5C4.5,12.7 5.45,14.68 6.95,16.05L5.89,17.11C4.11,15.47 3,13.11 3,10.5A9,9 0 0,1 12,1.5M12,4.5A6,6 0 0,1 18,10.5C18,12.28 17.22,13.89 16,15L14.92,13.92C15.89,13.1 16.5,11.87 16.5,10.5C16.5,8 14.5,6 12,6C9.5,6 7.5,8 7.5,10.5C7.5,11.87 8.11,13.1 9.08,13.92L8,15C6.78,13.89 6,12.28 6,10.5A6,6 0 0,1 12,4.5M8.11,17.65L11.29,14.46C11.68,14.07 12.32,14.07 12.71,14.46L15.89,17.65C16.28,18.04 16.28,18.67 15.89,19.06L12.71,22.24C12.32,22.63 11.68,22.63 11.29,22.24L8.11,19.06C7.72,18.67 7.72,18.04 8.11,17.65Z",
"name": "google-physical-web"
},
{
"path": "M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3M19.5,12H18V10.5H17V12H15.5V13H17V14.5H18V13H19.5V12M9.65,11.36V12.9H12.22C12.09,13.54 11.45,14.83 9.65,14.83C8.11,14.83 6.89,13.54 6.89,12C6.89,10.46 8.11,9.17 9.65,9.17C10.55,9.17 11.13,9.56 11.45,9.88L12.67,8.72C11.9,7.95 10.87,7.5 9.65,7.5C7.14,7.5 5.15,9.5 5.15,12C5.15,14.5 7.14,16.5 9.65,16.5C12.22,16.5 13.96,14.7 13.96,12.13C13.96,11.81 13.96,11.61 13.89,11.36H9.65Z",
"name": "google-plus-box"
},
{
"path": "M14,20.95H20V10.78L8,7.34V3.05H4V20.95H10V15.31H14V20.95Z",
"name": "houzz"
},
{
"path": "M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3M13.5,18.71H18V11.09L9,8.5V5.29H6V18.71H10.5V14.5H13.5V18.71Z",
"name": "houzz-box"
},
{
"path": "M10,5A1,1 0 0,0 9,4H8V2H16V4H15A1,1 0 0,0 14,5V19A1,1 0 0,0 15,20H16V22H8V20H9A1,1 0 0,0 10,19V5Z",
"name": "instapaper"
},
{
"path": "M7.85,17.07C7.03,17.17 3.5,17.67 4.06,20.26C4.69,23.3 9.87,22.59 9.83,19C9.81,16.57 9.83,9.2 9.83,9.2C9.83,9.2 9.76,8.53 10.43,8.39L18.19,6.79C18.19,6.79 18.83,6.65 18.83,7.29C18.83,7.89 18.83,14.2 18.83,14.2C18.83,14.2 18.9,14.83 18.12,15C17.34,15.12 13.91,15.4 14.19,18C14.5,21.07 20,20.65 20,17.07V2.61C20,2.61 20.04,1.62 18.9,1.87L9.5,3.78C9.5,3.78 8.66,3.96 8.66,4.77C8.66,5.5 8.66,16.11 8.66,16.11C8.66,16.11 8.66,16.96 7.85,17.07Z",
"name": "itunes"
},
{
"path": "M2,5.69C8.92,1.07 11.1,7 11.28,10.27C11.46,13.53 8.29,17.64 4.31,14.92V20.3L2,18.77V5.69M4.22,7.4V12.78C7.84,14.95 9.08,13.17 9.08,10.09C9.08,5.74 6.57,5.59 4.22,7.4M15.08,4.15C15.08,4.15 14.9,7.64 15.08,11.07C15.44,14.5 19.69,11.84 19.69,11.84V4.92L22,5.2V14.44C22,20.6 15.85,20.3 15.85,20.3L15.08,18C20.46,18 19.78,14.43 19.78,14.43C13.27,16.97 12.77,12.61 12.77,12.61V5.69L15.08,4.15Z",
"name": "language-python-text"
},
{
"path": "M18,17.93C15.92,17.92 14.81,16.9 14.04,15.09L13.82,14.6L11.92,10.23C11.29,8.69 9.72,7.64 7.96,7.64C5.57,7.64 3.63,9.59 3.63,12C3.63,14.41 5.57,16.36 7.96,16.36C9.62,16.36 11.08,15.41 11.8,14L12.57,15.81C11.5,17.15 9.82,18 7.96,18C4.67,18 2,15.32 2,12C2,8.69 4.67,6 7.96,6C10.44,6 12.45,7.34 13.47,9.7C13.54,9.89 14.54,12.24 15.42,14.24C15.96,15.5 16.42,16.31 17.91,16.36C19.38,16.41 20.39,15.5 20.39,14.37C20.39,13.26 19.62,13 18.32,12.56C16,11.79 14.79,11 14.79,9.15C14.79,7.33 16,6.12 18,6.12C19.31,6.12 20.24,6.7 20.89,7.86L19.62,8.5C19.14,7.84 18.61,7.57 17.94,7.57C17,7.57 16.33,8.23 16.33,9.1C16.33,10.34 17.43,10.53 18.97,11.03C21.04,11.71 22,12.5 22,14.42C22,16.45 20.27,17.93 18,17.93Z",
"name": "lastfm"
},
{
"path": "M19,3A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3H19M18.5,18.5V13.2A3.26,3.26 0 0,0 15.24,9.94C14.39,9.94 13.4,10.46 12.92,11.24V10.13H10.13V18.5H12.92V13.57C12.92,12.8 13.54,12.17 14.31,12.17A1.4,1.4 0 0,1 15.71,13.57V18.5H18.5M6.88,8.56A1.68,1.68 0 0,0 8.56,6.88C8.56,5.95 7.81,5.19 6.88,5.19A1.69,1.69 0 0,0 5.19,6.88C5.19,7.81 5.95,8.56 6.88,8.56M8.27,18.5V10.13H5.5V18.5H8.27Z",
"name": "linkedin-box"
},
{
"path": "M9.56,12.5C9.56,12.6 9.5,12.72 9.4,12.79C9.2,12.97 8.89,12.94 8.71,12.74C8.63,12.65 8.59,12.53 8.59,12.41V8.5H5.66V13.39A2.44,2.44 0 0,0 8.1,15.83C8.68,15.83 9.24,15.62 9.68,15.24C9.64,15.6 9.43,15.93 9.11,16.11C8.75,16.31 8.35,16.42 7.94,16.41C7.46,16.41 7,16.3 6.56,16.09L6.39,16V18.6C7.04,18.86 7.74,19 8.44,19C9.47,19 10.46,18.66 11.25,18C12.08,17.25 12.54,16.18 12.5,15.06V8.5H9.56V12.5M4.93,13.39V5.59H2V12.9C1.84,14.35 2.88,15.65 4.33,15.81C4.41,15.82 4.5,15.83 4.56,15.83V15.83C4.93,15.83 5.29,15.74 5.63,15.59L5.75,15.5L5.65,15.41C5.17,14.85 4.91,14.13 4.93,13.39M22,11.39V8.5H21C20.59,6.38 18.53,5 16.41,5.41C16.17,5.45 15.94,5.5 15.71,5.61C14.28,6.24 13.33,7.62 13.26,9.18V15.83H13.39C14.95,15.76 16.19,14.47 16.19,12.9H17.41V10H16.15V9.17C16.15,8.86 16.32,8.57 16.59,8.41C17.06,8.13 17.68,8.28 17.96,8.76C18.05,8.91 18.09,9.07 18.1,9.24V11.93C18.07,14.05 19.75,15.79 21.87,15.83H22V12.9H22A1,1 0 0,1 21,11.9V11.41L22,11.39Z",
"name": "lyft"
},
{
"path": "M15.45,11.91C15.34,9.7 13.7,8.37 11.72,8.37H11.64C9.35,8.37 8.09,10.17 8.09,12.21C8.09,14.5 9.62,15.95 11.63,15.95C13.88,15.95 15.35,14.3 15.46,12.36M11.65,6.39C13.18,6.39 14.62,7.07 15.67,8.13V8.13C15.67,7.62 16,7.24 16.5,7.24H16.61C17.35,7.24 17.5,7.94 17.5,8.16V16.06C17.46,16.58 18.04,16.84 18.37,16.5C19.64,15.21 21.15,9.81 17.58,6.69C14.25,3.77 9.78,4.25 7.4,5.89C4.88,7.63 3.26,11.5 4.83,15.11C6.54,19.06 11.44,20.24 14.35,19.06C15.83,18.47 16.5,20.46 15,21.11C12.66,22.1 6.23,22 3.22,16.79C1.19,13.27 1.29,7.08 6.68,3.87C10.81,1.42 16.24,2.1 19.5,5.5C22.95,9.1 22.75,15.8 19.4,18.41C17.89,19.59 15.64,18.44 15.66,16.71L15.64,16.15C14.59,17.2 13.18,17.81 11.65,17.81C8.63,17.81 6,15.15 6,12.13C6,9.08 8.63,6.39 11.65,6.39Z",
"name": "mail-ru"
},
{
"path": "M20.93,14C20.66,15.4 18.5,16.95 15.97,17.25C14.66,17.4 13.38,17.55 12,17.5C9.76,17.38 8,16.95 8,16.95L8.03,17.57C8.32,19.78 10.22,19.92 12.03,20C13.85,20.04 15.47,19.53 15.47,19.53L15.55,21.17C15.55,21.17 14.27,21.86 12,22C10.75,22.05 9.2,21.95 7.39,21.47C3.47,20.43 2.79,16.25 2.69,12L2.68,8.57C2.68,4.23 5.5,2.96 5.5,2.96C6.95,2.3 9.41,2 11.97,2H12.03C14.59,2 17.05,2.3 18.5,2.96C18.5,2.96 21.33,4.23 21.33,8.57C21.33,8.57 21.36,11.77 20.93,14M8.33,10.32C8.33,9.54 7.7,8.91 6.93,8.91C6.15,8.91 5.5,9.54 5.5,10.32C5.5,11.09 6.15,11.72 6.93,11.72A1.4,1.4 0 0,0 8.33,10.32M13.41,10.32A1.41,1.41 0 0,0 12,8.91A1.41,1.41 0 0,0 10.59,10.32C10.59,11.09 11.22,11.72 12,11.72C12.78,11.72 13.41,11.09 13.41,10.32M18.5,10.32C18.5,9.54 17.85,8.91 17.07,8.91C16.3,8.91 15.67,9.54 15.67,10.32A1.4,1.4 0 0,0 17.07,11.72C17.85,11.72 18.5,11.09 18.5,10.32Z",
"name": "mastodon-variant"
},
{
"path": "M4.37,7.3C4.4,7.05 4.3,6.81 4.12,6.65L2.25,4.4V4.06H8.05L12.53,13.89L16.47,4.06H22V4.4L20.4,5.93C20.27,6.03 20.2,6.21 20.23,6.38V17.62C20.2,17.79 20.27,17.97 20.4,18.07L21.96,19.6V19.94H14.12V19.6L15.73,18.03C15.89,17.88 15.89,17.83 15.89,17.59V8.5L11.4,19.9H10.8L5.57,8.5V16.14C5.5,16.46 5.63,16.78 5.86,17L7.96,19.57V19.9H2V19.57L4.1,17C4.33,16.78 4.43,16.46 4.37,16.14V7.3Z",
"name": "medium"
},
{
"path": "M19.61,14.86C19.61,16.68 18.3,18.25 16.5,18.55C16.29,18.59 16.07,18.62 15.84,18.61C15.76,18.61 15.73,18.64 15.71,18.71C15.35,19.74 14.64,20.35 13.57,20.5C12.86,20.6 12.22,20.41 11.65,19.97C11.57,19.9 11.5,19.9 11.44,19.96C10.78,20.43 10.04,20.64 9.23,20.59C7.66,20.5 6.33,19.29 6.08,17.74C6.06,17.63 6.04,17.5 6.04,17.41C6.04,17.32 6,17.29 5.92,17.27C5.44,17.18 5,17 4.63,16.68C3.92,16.13 3.5,15.41 3.4,14.5C3.29,13.5 3.61,12.62 4.32,11.89C4.38,11.83 4.38,11.79 4.34,11.72C4.07,11.24 3.94,10.72 3.96,10.17C4,8.79 4.97,7.65 6.31,7.37C6.46,7.33 6.54,7.27 6.61,7.13C7.27,5.71 8.37,4.85 9.91,4.56C11,4.36 12,4.58 12.94,5.13C13,5.18 13.08,5.18 13.17,5.16C14.67,4.72 16,5.04 17.12,6.11C17.78,6.74 18.15,7.54 18.26,8.46C18.28,8.66 18.29,8.86 18.28,9.06C18.27,9.14 18.29,9.17 18.37,9.19C19.04,9.44 19.5,9.91 19.71,10.6C19.96,11.45 19.75,12.21 19.11,12.83C19.05,12.89 19.07,12.92 19.1,12.97C19.44,13.56 19.61,14.18 19.61,14.86M12.93,14.57C12.93,15.34 13.43,16 14.14,16.26C14.5,16.37 14.85,16.43 15.22,16.45C15.5,16.46 15.75,16.44 16,16.32C16.19,16.22 16.28,16.06 16.27,15.85C16.26,15.64 16.16,15.5 15.96,15.4C15.89,15.37 15.82,15.34 15.74,15.33C15.5,15.29 15.3,15.26 15.07,15.21C14.71,15.14 14.55,14.95 14.55,14.57C14.54,14.24 14.63,13.93 14.73,13.63C14.92,13.07 15.17,12.53 15.41,12C15.64,11.47 15.88,10.95 16.04,10.4C16.13,10.1 16.18,9.8 16.09,9.5C15.97,9 15.69,8.7 15.2,8.61C14.75,8.5 14.3,8.5 13.9,8.78C13.76,8.87 13.63,8.85 13.5,8.74C13.43,8.67 13.34,8.58 13.26,8.5C12.84,8.12 12.3,8.1 11.85,8.45C11.67,8.59 11.5,8.76 11.33,8.89C11.16,9 11,9.03 10.79,8.92C10.6,8.83 10.42,8.74 10.23,8.65C10.03,8.57 9.85,8.46 9.63,8.44C8.95,8.38 8.24,8.79 7.94,9.41C7.8,9.68 7.69,9.96 7.59,10.25C7.11,11.57 6.72,12.91 6.32,14.26C6.14,14.86 6.35,15.45 6.86,15.77C7.26,16 7.69,16.09 8.14,15.95C8.5,15.84 8.71,15.55 8.85,15.22C9.31,14.13 9.73,13 10.17,11.91C10.29,11.61 10.41,11.3 10.54,11C10.67,10.7 11.04,10.6 11.26,10.8C11.4,10.92 11.44,11.09 11.42,11.26C11.41,11.45 11.34,11.62 11.27,11.79C11,12.5 10.69,13.24 10.4,13.97C10.34,14.11 10.28,14.26 10.25,14.42C10.21,14.69 10.31,14.93 10.54,15C10.76,15.12 11,15.14 11.23,15.05C11.5,14.95 11.67,14.74 11.79,14.5C12.22,13.65 12.65,12.8 13.08,11.95C13.28,11.56 13.5,11.17 13.68,10.78C13.76,10.64 13.85,10.5 14,10.41C14.12,10.33 14.25,10.33 14.38,10.4C14.5,10.47 14.5,10.6 14.5,10.73C14.5,10.8 14.5,10.87 14.47,10.93C14.41,11.07 14.36,11.2 14.3,11.33C13.94,12.09 13.57,12.84 13.22,13.59C13.07,13.91 12.91,14.23 12.93,14.57M17.96,20.12C17.96,19.62 17.54,19.2 17.04,19.2C16.5,19.2 16.1,19.61 16.1,20.12A0.93,0.93 0 0,0 17.03,21.05A0.93,0.93 0 0,0 17.96,20.12M2.38,12.46C2.86,12.46 3.27,12.05 3.27,11.57C3.27,11.09 2.87,10.69 2.39,10.69C1.89,10.69 1.5,11.08 1.5,11.57C1.5,12.06 1.89,12.46 2.38,12.46M13.26,2.55C12.77,2.55 12.37,2.94 12.37,3.42C12.37,3.91 12.77,4.3 13.25,4.3C13.74,4.3 14.13,3.92 14.13,3.43C14.13,2.95 13.74,2.55 13.26,2.55M20.45,8.03C20.45,7.63 20.11,7.29 19.71,7.29C19.3,7.28 18.95,7.63 18.95,8.04C18.95,8.45 19.28,8.78 19.7,8.78C20.12,8.78 20.46,8.45 20.45,8.03M5.04,5.89C5.04,6.27 5.34,6.56 5.71,6.56C6.09,6.56 6.39,6.26 6.38,5.88C6.38,5.5 6.09,5.22 5.72,5.22C5.33,5.22 5.04,5.5 5.04,5.89M12.06,21.44C12.06,21.12 11.81,20.86 11.5,20.86C11.16,20.86 10.91,21.11 10.91,21.44C10.91,21.75 11.16,22 11.5,22C11.8,22 12.06,21.75 12.06,21.44M21,12.5C20.71,12.5 20.45,12.78 20.45,13.08A0.55,0.55 0 0,0 21,13.63C21.33,13.63 21.57,13.4 21.57,13.08C21.57,12.77 21.33,12.5 21,12.5M7.62,2C7.35,2 7.14,2.2 7.14,2.47C7.14,2.73 7.35,2.94 7.62,2.94A0.47,0.47 0 0,0 8.09,2.47C8.09,2.2 7.89,2 7.62,2M22.08,10C21.86,10 21.67,10.17 21.66,10.4C21.66,10.63 21.85,10.82 22.08,10.82C22.32,10.82 22.5,10.64 22.5,10.41C22.5,10.17 22.32,10 22.08,10M5.5,18.26C5.5,18.04 5.29,17.85 5.06,17.84C4.84,17.84 4.65,18.03 4.65,18.27C4.65,18.5 4.84,18.68 5.07,18.68C5.3,18.68 5.5,18.5 5.5,18.26Z",
"name": "meetup"
},
{
"path": "M21.11,18.5C20.97,18.5 20.83,18.44 20.71,18.36C20.37,18.13 20.28,17.68 20.5,17.34C21.18,16.34 21.54,15.16 21.54,13.93C21.54,12.71 21.18,11.53 20.5,10.5C20.28,10.18 20.37,9.73 20.71,9.5C21.04,9.28 21.5,9.37 21.72,9.7C22.56,10.95 23,12.41 23,13.93C23,15.45 22.56,16.91 21.72,18.16C21.58,18.37 21.35,18.5 21.11,18.5M19,17.29C18.88,17.29 18.74,17.25 18.61,17.17C18.28,16.94 18.19,16.5 18.42,16.15C18.86,15.5 19.1,14.73 19.1,13.93C19.1,13.14 18.86,12.37 18.42,11.71C18.19,11.37 18.28,10.92 18.61,10.69C18.95,10.47 19.4,10.55 19.63,10.89C20.24,11.79 20.56,12.84 20.56,13.93C20.56,15 20.24,16.07 19.63,16.97C19.5,17.18 19.25,17.29 19,17.29M14.9,15.73C15.89,15.73 16.7,14.92 16.7,13.93C16.7,13.17 16.22,12.5 15.55,12.25C15.5,12.55 15.43,12.85 15.34,13.14C15.23,13.44 14.95,13.64 14.64,13.64C14.57,13.64 14.5,13.62 14.41,13.6C14.03,13.47 13.82,13.06 13.95,12.67C14.09,12.24 14.17,11.78 14.17,11.32C14.17,8.93 12.22,7 9.82,7C8.1,7 6.56,8 5.87,9.5C6.54,9.7 7.16,10.04 7.66,10.54C7.95,10.83 7.95,11.29 7.66,11.58C7.38,11.86 6.91,11.86 6.63,11.58C6.17,11.12 5.56,10.86 4.9,10.86C3.56,10.86 2.46,11.96 2.46,13.3C2.46,14.64 3.56,15.73 4.9,15.73H14.9M15.6,10.75C17.06,11.07 18.17,12.37 18.17,13.93C18.17,15.73 16.7,17.19 14.9,17.19H4.9C2.75,17.19 1,15.45 1,13.3C1,11.34 2.45,9.73 4.33,9.45C5.12,7.12 7.33,5.5 9.82,5.5C12.83,5.5 15.31,7.82 15.6,10.75Z",
"name": "mixcloud"
},
{
"path": "M3.25,4.03L19.95,20.73L18.7,22L14.86,18.13C14.77,18.12 14.68,18.09 14.59,18.05C14.26,17.89 14.14,17.62 14.11,17.38L12.18,15.45C12.14,15.53 12.09,15.6 12.05,15.66C11.62,16.26 11.19,16.26 10.86,16.04C10.54,15.83 5.5,12 5.23,11.87C4.95,11.76 4.85,12.03 5.12,13.5C5.39,15 4.95,15.39 4.57,15.45C4.2,15.5 3.06,15.18 3,12.14C2.95,9.11 3.76,8.62 4.14,8.62C4.6,8.62 7.08,10.69 8.84,12.12L2,5.28L3.25,4.03M18.38,16.56C18.75,15.4 19.12,13.8 19.1,12.03V12C19.14,8.5 17.66,5.58 17.66,5.58C17.66,5.58 17.42,4.72 18.12,4.39C18.83,4.06 19.3,4.61 19.3,4.61C21.12,8.22 21,11.64 21,12C21,12.27 21.09,14.96 19.88,18.05L18.38,16.56M15.14,13.31C15.19,12.92 15.22,12.5 15.24,12.03V12C15.14,8.5 14.13,7.21 14.13,7.21C14.13,7.21 13.89,6.34 14.59,6C15.3,5.69 15.77,6.23 15.77,6.23C17.26,8.94 17.16,11.64 17.14,12C17.15,12.2 17.2,13.38 16.82,15L15.14,13.31M10.2,8.38C10.23,7.77 10.59,7.64 10.59,7.64C10.59,7.64 11.19,7.37 11.57,7.8C11.91,8.19 12.72,9.57 12.89,11.07L10.2,8.38Z",
"name": "nfc-off"
},
{ "path": "M20,4H4V20H12V8H16V20H20V4", "name": "npm-variant" },
{
"path": "M3,3V21H21V3H3M6,6H18V18H15V9H12V18H6V6Z",
"name": "npm-variant-outline"
},
{
"path": "M8.32,21.97C8.21,21.92 8.08,21.76 8.06,21.65C8.03,21.5 8,21.76 8.66,17.56C9.26,13.76 9.25,13.82 9.33,13.71C9.46,13.54 9.44,13.54 10.94,13.53C12.26,13.5 12.54,13.5 13.13,13.41C16.38,12.96 18.39,11.05 19.09,7.75C19.13,7.53 19.17,7.34 19.18,7.34C19.18,7.33 19.25,7.38 19.33,7.44C20.36,8.22 20.71,9.66 20.32,11.58C19.86,13.87 18.64,15.39 16.74,16.04C15.93,16.32 15.25,16.43 14.05,16.46C13.25,16.5 13.23,16.5 13,16.65C12.83,16.82 12.84,16.79 12.45,19.2C12.18,20.9 12.08,21.45 12.04,21.55C11.97,21.71 11.83,21.85 11.67,21.93L11.56,22H10C8.71,22 8.38,22 8.32,21.97V21.97M3.82,19.74C3.63,19.64 3.5,19.47 3.5,19.27C3.5,19 6.11,2.68 6.18,2.5C6.27,2.32 6.5,2.13 6.68,2.06L6.83,2H10.36C14.27,2 14.12,2 15,2.2C17.62,2.75 18.82,4.5 18.37,7.13C17.87,10.06 16.39,11.8 13.87,12.43C13,12.64 12.39,12.7 10.73,12.7C9.42,12.7 9.32,12.71 9.06,12.85C8.8,13 8.59,13.27 8.5,13.6C8.46,13.67 8.23,15.07 7.97,16.7C7.71,18.33 7.5,19.69 7.5,19.72L7.47,19.78H5.69C4.11,19.78 3.89,19.78 3.82,19.74V19.74Z",
"name": "paypal"
},
{
"path": "M12,7A2,2 0 0,1 10,9A2,2 0 0,1 8,7C7.37,7.84 7,8.87 7,10A5,5 0 0,0 12,15A5,5 0 0,0 17,10A5,5 0 0,0 12,5C11.57,5 11.16,5.05 10.77,5.15C11.5,5.45 12,6.17 12,7M12,2A8,8 0 0,1 20,10C20,11.05 19.8,12.04 19.43,12.96C17.89,17.38 13.63,22 12,22C10.37,22 6.11,17.38 4.57,12.96C4.2,12.04 4,11.05 4,10A8,8 0 0,1 12,2Z",
"name": "periscope"
},
{
"path": "M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H9.29C9.69,20.33 10.19,19.38 10.39,18.64L11.05,16.34C11.36,16.95 12.28,17.45 13.22,17.45C16.17,17.45 18.22,14.78 18.22,11.45C18.22,8.28 15.64,5.89 12.3,5.89C8.14,5.89 5.97,8.67 5.97,11.72C5.97,13.14 6.69,14.89 7.91,15.45C8.08,15.56 8.19,15.5 8.19,15.34L8.47,14.28C8.5,14.14 8.5,14.06 8.41,14C7.97,13.45 7.69,12.61 7.69,11.78C7.69,9.64 9.3,7.61 12.03,7.61C14.42,7.61 16.08,9.19 16.08,11.5C16.08,14.11 14.75,15.95 13.03,15.95C12.05,15.95 11.39,15.11 11.55,14.17C11.83,13.03 12.39,11.83 12.39,11C12.39,10.22 12,9.61 11.16,9.61C10.22,9.61 9.39,10.61 9.39,11.95C9.39,12.83 9.66,13.39 9.66,13.39L8.55,18.17C8.39,19 8.47,20.25 8.55,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3Z",
"name": "pinterest-box"
},
{
"path": "M21.9,4.26C21.64,3.55 20.96,3.07 20.2,3.07H20.19L18.46,3.07H3.81C3.07,3.07 2.39,3.54 2.12,4.24C2.04,4.45 2,4.66 2,4.88V10.92L2.07,12.12C2.36,14.85 3.78,17.23 5.97,18.9C6,18.93 6.05,18.96 6.09,19H6.11C7.29,19.86 8.6,20.44 10,20.73C10.68,20.86 11.35,20.93 12,20.93C12.63,20.93 13.25,20.87 13.85,20.76C13.93,20.75 14,20.73 14.07,20.72C14.09,20.71 14.11,20.7 14.14,20.69C15.5,20.4 16.76,19.83 17.89,19H17.91C17.95,18.96 18,18.93 18.03,18.9C20.22,17.23 21.64,14.85 21.93,12.12L22,10.92V4.88C22,4.68 21.97,4.47 21.9,4.26M17.67,10.55L12.96,15.06C12.7,15.32 12.35,15.44 12,15.44C11.67,15.44 11.33,15.32 11.06,15.06L6.36,10.55C5.81,10.03 5.79,9.16 6.32,8.61C6.84,8.06 7.71,8.05 8.26,8.57L12,12.17L15.77,8.57C16.31,8.05 17.18,8.07 17.71,8.61C18.23,9.16 18.21,10.03 17.67,10.55Z",
"name": "pocket"
},
{
"path": "M12,3A9,9 0 0,1 21,12C21,13.76 20.5,15.4 19.62,16.79L21,18.17V20A1,1 0 0,1 20,21H18.18L16.79,19.62C15.41,20.5 13.76,21 12,21A9,9 0 0,1 3,12A9,9 0 0,1 12,3M12,7A5,5 0 0,0 7,12A5,5 0 0,0 12,17C12.65,17 13.26,16.88 13.83,16.65L10.95,13.77C10.17,13 10.17,11.72 10.95,10.94C11.73,10.16 13,10.16 13.78,10.94L16.66,13.82C16.88,13.26 17,12.64 17,12A5,5 0 0,0 12,7Z",
"name": "quicktime"
},
{
"path": "M18.61,5.89C18.6,5.79 18.5,5.73 18.44,5.73C18.37,5.72 16.83,5.61 16.83,5.61C16.83,5.61 15.76,4.55 15.65,4.43C15.53,4.31 15.3,4.35 15.21,4.37C15.2,4.37 15,4.44 14.61,4.55C14.25,3.5 13.62,2.58 12.43,2.58C12.11,2.18 11.72,2 11.38,2C8.8,2 7.57,5.22 7.18,6.86C6.18,7.17 5.47,7.39 5.37,7.42C4.82,7.6 4.8,7.62 4.73,8.14C4.67,8.54 3.21,19.86 3.21,19.86L14.61,22L20.79,20.66C20.79,20.66 18.62,6 18.61,5.89M14,4.76C13.69,4.85 13.37,4.95 13,5.06C13,5 13,4.93 13,4.85C13,4.21 12.93,3.7 12.79,3.29C13.35,3.36 13.73,4 14,4.76M12.08,3.42C12.24,3.82 12.34,4.39 12.34,5.16C12.34,5.2 12.34,5.24 12.34,5.27C11.71,5.46 11.03,5.68 10.35,5.89C10.73,4.4 11.45,3.69 12.08,3.42M11.31,2.69C11.42,2.69 11.53,2.73 11.64,2.8C10.81,3.19 9.93,4.17 9.55,6.12C9,6.3 8.47,6.46 8,6.62C8.42,5.12 9.46,2.69 11.31,2.69M12.5,9.15L11.76,11.42C11.76,11.42 11.09,11.06 10.27,11.06C9.07,11.06 9,11.81 9,12C9,13.04 11.71,13.43 11.71,15.86C11.71,17.77 10.5,19 8.87,19C6.91,19 5.91,17.78 5.91,17.78L6.43,16.05C6.43,16.05 7.46,16.93 8.33,16.93C8.9,16.93 9.13,16.5 9.13,16.16C9.13,14.81 6.92,14.75 6.92,12.53C6.92,10.66 8.26,8.85 10.97,8.85C12,8.85 12.5,9.15 12.5,9.15M15.43,5.29L16.75,6.6L17.71,6.68C18.05,9 19.19,16.73 19.66,19.88L14.66,20.97L15.43,5.29Z",
"name": "shopify"
},
{
"path": "M7.47,17.19C7.37,17.95 7.08,18.21 6.19,18.21C5.27,18.21 4.87,17.79 4.81,16.87L4.61,13.65C4.61,12.91 4.87,12.55 5.86,12.55C7.21,12.55 7.04,13.54 7.64,14.5C8.33,15.62 10,16.35 12.31,16.35C15.17,16.35 17,15.14 17,13.57C17,12.23 15.89,11.39 13.85,11.16L11.5,10.89C7.21,10.42 5.1,9.19 5.1,6.62C5.1,4.07 8.06,2 12.21,2C13.5,2 14.81,2.29 16.29,2.76C16.29,2.26 16.58,2.1 17.3,2.1C18.46,2.1 18.55,2.39 18.62,3.08L18.85,5.88C18.85,6.5 18.39,6.83 17.63,6.83C16.35,6.83 16.55,5.88 15.86,5.07C15.17,4.26 13.79,3.73 12.08,3.73C9.44,3.73 7.7,4.89 7.7,6.5C7.7,7.8 8.92,8.56 11.38,8.82L13.95,9.08C17.7,9.5 19.61,10.92 19.61,13.33C19.61,16.17 16.71,18.08 12.21,18.08C10.56,18.08 9.08,17.77 7.47,17.19M1,16H2V21H23V22H1V16Z",
"name": "slackware"
},
{
"path": "M6,3H18A3,3 0 0,1 21,6V18A3,3 0 0,1 18,21H6A3,3 0 0,1 3,18V6A3,3 0 0,1 6,3M7,6A1,1 0 0,0 6,7V17A1,1 0 0,0 7,18H17A1,1 0 0,0 18,17V7A1,1 0 0,0 17,6H7M9.5,9H14.5A0.5,0.5 0 0,1 15,9.5V14.5A0.5,0.5 0 0,1 14.5,15H9.5A0.5,0.5 0 0,1 9,14.5V9.5A0.5,0.5 0 0,1 9.5,9Z",
"name": "square-inc"
},
{
"path": "M5.5,0H18.5A5.5,5.5 0 0,1 24,5.5V18.5A5.5,5.5 0 0,1 18.5,24H5.5A5.5,5.5 0 0,1 0,18.5V5.5A5.5,5.5 0 0,1 5.5,0M15.39,15.18C15.39,16.76 14.5,17.81 12.85,17.95V12.61C14.55,13.13 15.39,13.66 15.39,15.18M11.65,6V10.88C10.34,10.5 9.03,9.93 9.03,8.43C9.03,6.94 10.18,6.12 11.65,6M15.5,7.6L16.5,6.8C15.62,5.66 14.4,4.92 12.85,4.77V3.8H11.65V3.8L11.65,4.75C9.5,4.89 7.68,6.17 7.68,8.5C7.68,11 9.74,11.78 11.65,12.29V17.96C10.54,17.84 9.29,17.31 8.43,16.03L7.3,16.78C8.2,18.12 9.76,19 11.65,19.14V20.2H12.07L12.85,20.2V19.16C15.35,19 16.7,17.34 16.7,15.14C16.7,12.58 14.81,11.76 12.85,11.19V6.05C14,6.22 14.85,6.76 15.5,7.6Z",
"name": "square-inc-cash"
},
{
"path": "M19,3A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V15L6.19,16.31C6.45,17.6 7.6,18.58 8.97,18.58C10.53,18.58 11.8,17.31 11.8,15.75V15.62L15.2,13.19H15.28C17.36,13.19 19.05,11.5 19.05,9.42C19.05,7.34 17.36,5.65 15.28,5.65C13.2,5.65 11.5,7.34 11.5,9.42V9.47L9.13,12.93L8.97,12.92C8.38,12.92 7.83,13.1 7.38,13.41L3,11.6V5A2,2 0 0,1 5,3H19M8.28,17.17C9.08,17.5 10,17.13 10.33,16.33C10.66,15.53 10.28,14.62 9.5,14.29L8.22,13.76C8.71,13.58 9.26,13.57 9.78,13.79C10.31,14 10.72,14.41 10.93,14.94C11.15,15.46 11.15,16.04 10.93,16.56C10.5,17.64 9.23,18.16 8.15,17.71C7.65,17.5 7.27,17.12 7.06,16.67L8.28,17.17M17.8,9.42C17.8,10.81 16.67,11.94 15.28,11.94C13.9,11.94 12.77,10.81 12.77,9.42A2.51,2.51 0 0,1 15.28,6.91C16.67,6.91 17.8,8.04 17.8,9.42M13.4,9.42C13.4,10.46 14.24,11.31 15.29,11.31C16.33,11.31 17.17,10.46 17.17,9.42C17.17,8.38 16.33,7.53 15.29,7.53C14.24,7.53 13.4,8.38 13.4,9.42Z",
"name": "steam-box"
},
{
"path": "M14.92,17.16L16.75,13.53H19.45L14.94,22.5L10.37,13.53H13.07L14.92,17.16M10.63,8.66L8.18,13.55H4.55L10.61,1.5L16.74,13.55H13.11L10.63,8.66Z",
"name": "strava"
},
{
"path": "M12,14C11,14 9,15 9,16C9,18 12,18 12,18V17A1,1 0 0,1 11,16A1,1 0 0,1 12,15V14M12,19C12,19 8,18.5 8,16.5C8,13.5 11,12.75 12,12.75V11.5C11,11.5 7,13 7,16C7,20 12,20 12,20V19M10.07,7.03L11.26,7.56C11.69,5.12 12.84,3.5 12.84,3.5C12.41,4.53 12.13,5.38 11.95,6.05C13.16,3.55 15.61,2 15.61,2C14.43,3.18 13.56,4.46 12.97,5.53C14.55,3.85 16.74,2.75 16.74,2.75C14.05,4.47 12.84,7.2 12.54,7.96L13.09,8.04C13.09,8.56 13.09,9.04 13.34,9.42C14.1,11.31 18,11.47 18,16C18,20.53 13.97,22 11.83,22C9.69,22 5,21.03 5,16C5,10.97 9.95,10.93 10.83,8.92C10.95,8.54 10.07,7.03 10.07,7.03Z",
"name": "tor"
},
{
"path": "M17,11H13V15.5C13,16.44 13.28,17 14.5,17H17V21C17,21 15.54,21.05 14.17,21.05C10.8,21.05 9.5,19 9.5,16.75V11H7V7C10.07,6.74 10.27,4.5 10.5,3H13V7H17",
"name": "tumblr"
},
{
"path": "M16,11H13V14.9C13,15.63 13.14,16 14.1,16H16V19C16,19 14.97,19.1 13.9,19.1C11.25,19.1 10,17.5 10,15.7V11H8V8.2C10.41,8 10.62,6.16 10.8,5H13V8H16M20,2H4C2.89,2 2,2.89 2,4V20A2,2 0 0,0 4,22H20A2,2 0 0,0 22,20V4C22,2.89 21.1,2 20,2Z",
"name": "tumblr-box"
},
{
"path": "M3.75,17L8,12.75V16H18V11.5L20,9.5V16A2,2 0 0,1 18,18H8V21.25L3.75,17M20.25,7L16,11.25V8H6V12.5L4,14.5V8A2,2 0 0,1 6,6H16V2.75L20.25,7Z",
"name": "tumblr-reblog"
},
{
"path": "M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3M17.71,9.33C18.19,8.93 18.75,8.45 19,7.92C18.59,8.13 18.1,8.26 17.56,8.33C18.06,7.97 18.47,7.5 18.68,6.86C18.16,7.14 17.63,7.38 16.97,7.5C15.42,5.63 11.71,7.15 12.37,9.95C9.76,9.79 8.17,8.61 6.85,7.16C6.1,8.38 6.75,10.23 7.64,10.74C7.18,10.71 6.83,10.57 6.5,10.41C6.54,11.95 7.39,12.69 8.58,13.09C8.22,13.16 7.82,13.18 7.44,13.12C7.81,14.19 8.58,14.86 9.9,15C9,15.76 7.34,16.29 6,16.08C7.15,16.81 8.46,17.39 10.28,17.31C14.69,17.11 17.64,13.95 17.71,9.33Z",
"name": "twitter-box"
},
{
"path": "M17.71,9.33C18.19,8.93 18.75,8.45 19,7.92C18.59,8.13 18.1,8.26 17.56,8.33C18.06,7.97 18.47,7.5 18.68,6.86C18.16,7.14 17.63,7.38 16.97,7.5C15.42,5.63 11.71,7.15 12.37,9.95C9.76,9.79 8.17,8.61 6.85,7.16C6.1,8.38 6.75,10.23 7.64,10.74C7.18,10.71 6.83,10.57 6.5,10.41C6.54,11.95 7.39,12.69 8.58,13.09C8.22,13.16 7.82,13.18 7.44,13.12C7.81,14.19 8.58,14.86 9.9,15C9,15.76 7.34,16.29 6,16.08C7.15,16.81 8.46,17.39 10.28,17.31C14.69,17.11 17.64,13.95 17.71,9.33M12,2A10,10 0 0,1 22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2Z",
"name": "twitter-circle"
},
{
"path": "M6.38,13.24V13.24C6.38,11.84 6.38,10.44 6.38,9.04H7.4V15.84H6.39C6.39,15.63 6.39,15.42 6.39,15.21C5.93,15.68 5.29,15.96 4.58,15.96C3.12,15.96 2,14.9 2,13.3V9.04H3V13.24C3,14.33 3.74,15.04 4.7,15.04C5.64,15.04 6.38,14.31 6.38,13.24M9.14,9.04V11.5C9.37,11.29 9.65,11.1 9.95,10.97C10.25,10.85 10.58,10.78 10.91,10.78C12.37,10.78 13.5,11.94 13.5,13.37C13.5,14.8 12.37,15.96 10.91,15.96C10.58,15.96 10.25,15.89 9.95,15.77C9.64,15.64 9.37,15.45 9.13,15.22C9.13,15.43 9.13,15.63 9.13,15.84C8.81,15.84 8.5,15.84 8.16,15.84V9.04H9.14M12.55,13.37V13.37C12.55,12.41 11.77,11.65 10.84,11.65C9.89,11.65 9.13,12.41 9.13,13.37C9.13,14.32 9.88,15.09 10.84,15.09C11.77,15.09 12.55,14.32 12.55,13.37M16.46,10.79C17.9,10.79 18.95,11.89 18.95,13.36V13.69H14.91C15.04,14.5 15.71,15.09 16.55,15.09C17.13,15.09 17.61,14.86 18,14.36L18.7,14.89C18.2,15.55 17.46,15.95 16.55,15.95C15.06,15.95 13.91,14.84 13.91,13.36C13.91,11.97 15,10.79 16.46,10.79M14.92,12.91H17.95C17.79,12.15 17.18,11.65 16.44,11.65C15.71,11.65 15.1,12.15 14.92,12.91M20.5,13V15.84H19.5V10.89C19.82,10.89 20.14,10.89 20.47,10.89V11.5C20.71,11.1 21.11,10.85 21.66,10.85H22V11.76H21.59C20.95,11.76 20.5,12.26 20.5,13",
"name": "uber"
},
{
"path": "M19.5,3C20.14,4.08 20.44,5.19 20.44,6.6C20.44,11.08 16.61,16.91 13.5,21H6.41L3.56,4L9.77,3.39L11.28,15.5C12.69,13.21 14.42,9.61 14.42,7.16C14.42,5.81 14.19,4.9 13.83,4.15L19.5,3Z",
"name": "venmo"
},
{
"path": "M5,3A2,2 0 0,0 3,5V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5A2,2 0 0,0 19,3H5M5.5,8.5H7C7.36,8.5 7.5,8.66 7.64,9.07C8.36,11.17 9.57,13 10.07,13C10.26,13 10.35,12.92 10.35,12.45V10.28C10.29,9.28 9.76,9.19 9.76,8.84C9.76,8.67 9.9,8.5 10.14,8.5H12.45C12.77,8.5 12.87,8.67 12.87,9.04V11.96C12.87,12.27 13,12.38 13.1,12.38C13.29,12.38 13.45,12.27 13.79,11.93C14.85,10.74 15.6,8.92 15.6,8.92C15.7,8.7 15.87,8.5 16.24,8.5H17.71C18.16,8.5 18.26,8.73 18.16,9.04C17.97,9.9 16.18,12.43 16.18,12.43C16,12.68 15.96,12.8 16.18,13.09C16.33,13.3 16.85,13.74 17.19,14.15C17.83,14.86 18.3,15.46 18.44,15.87C18.56,16.29 18.35,16.5 17.93,16.5H16.45C15.89,16.5 15.73,16.05 14.73,15.05C13.85,14.21 13.5,14.1 13.26,14.1C12.96,14.1 12.87,14.18 12.87,14.61V15.93C12.87,16.29 12.76,16.5 11.82,16.5C10.26,16.5 8.54,15.55 7.33,13.8C5.5,11.24 5,9.31 5,8.92C5,8.7 5.08,8.5 5.5,8.5Z",
"name": "vk-box"
},
{
"path": "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,2M5.5,8.5H7C7.36,8.5 7.5,8.66 7.64,9.07C8.36,11.17 9.57,13 10.07,13C10.26,13 10.35,12.92 10.35,12.45V10.28C10.29,9.28 9.76,9.19 9.76,8.84C9.76,8.67 9.9,8.5 10.14,8.5H12.45C12.77,8.5 12.87,8.67 12.87,9.04V11.96C12.87,12.27 13,12.38 13.1,12.38C13.29,12.38 13.45,12.27 13.79,11.93C14.85,10.74 15.6,8.92 15.6,8.92C15.7,8.7 15.87,8.5 16.24,8.5H17.71C18.16,8.5 18.26,8.73 18.16,9.04C17.97,9.9 16.18,12.43 16.18,12.43C16,12.68 15.96,12.8 16.18,13.09C16.33,13.3 16.85,13.74 17.19,14.15C17.83,14.86 18.3,15.46 18.44,15.87C18.56,16.29 18.35,16.5 17.93,16.5H16.45C15.89,16.5 15.73,16.05 14.73,15.05C13.85,14.21 13.5,14.1 13.26,14.1C12.96,14.1 12.87,14.18 12.87,14.61V15.93C12.87,16.29 12.76,16.5 11.82,16.5C10.26,16.5 8.54,15.55 7.33,13.8C5.5,11.24 5,9.31 5,8.92C5,8.7 5.08,8.5 5.5,8.5Z",
"name": "vk-circle"
},
{
"path": "M17,17.5L12,15L7,17.5V5H5V19H19V5H17V17.5M12,12.42L14.25,13.77L13.65,11.22L15.64,9.5L13,9.27L12,6.86L11,9.27L8.36,9.5L10.35,11.22L9.75,13.77L12,12.42M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3Z",
"name": "wunderlist"
},
{
"path": "M0 16.7L3.2 12.9L0 9.1L1.5 7.8L4.5 11.3L7.5 7.8L9 9.1L5.8 12.9L9 16.7L7.5 18L4.5 14.4L1.5 18L0 16.7M24 16.9C24 17.4 23.6 17.9 23 17.9H20C18.9 17.9 18 17 18 15.9V13.9C18 12.8 18.9 11.9 20 11.9H22V9.9H18V8H23C23.5 8 24 8.4 24 9M22 14H20V16H22V14M16 16.9C16 17.4 15.6 17.9 15 17.9H12C10.9 17.9 10 17 10 15.9V9.9C10 8.8 10.9 7.9 12 7.9H14V5H16V16.9M14 15.9V9.9H12V15.9H14Z",
"name": "xda"
},
{
"path": "M4.8,3C3.8,3 3,3.8 3,4.8V19.2C3,20.2 3.8,21 4.8,21H19.2C20.2,21 21,20.2 21,19.2V4.8C21,3.8 20.2,3 19.2,3M16.07,5H18.11C18.23,5 18.33,5.04 18.37,5.13C18.43,5.22 18.43,5.33 18.37,5.44L13.9,13.36L16.75,18.56C16.81,18.67 16.81,18.78 16.75,18.87C16.7,18.95 16.61,19 16.5,19H14.47C14.16,19 14,18.79 13.91,18.61L11.04,13.35C11.18,13.1 15.53,5.39 15.53,5.39C15.64,5.19 15.77,5 16.07,5M7.09,7.76H9.1C9.41,7.76 9.57,7.96 9.67,8.15L11.06,10.57C10.97,10.71 8.88,14.42 8.88,14.42C8.77,14.61 8.63,14.81 8.32,14.81H6.3C6.18,14.81 6.09,14.76 6.04,14.67C6,14.59 6,14.47 6.04,14.36L8.18,10.57L6.82,8.2C6.77,8.09 6.75,8 6.81,7.89C6.86,7.81 6.96,7.76 7.09,7.76Z",
"name": "xing-box"
},
{
"path": "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,2M15.85,6H17.74C17.86,6 17.94,6.04 18,6.12C18.04,6.2 18.04,6.3 18,6.41L13.84,13.76L16.5,18.59C16.53,18.69 16.53,18.8 16.5,18.88C16.43,18.96 16.35,19 16.24,19H14.36C14.07,19 13.93,18.81 13.84,18.64L11.17,13.76C11.31,13.5 15.35,6.36 15.35,6.36C15.45,6.18 15.57,6 15.85,6M7.5,8.57H9.39C9.67,8.57 9.81,8.75 9.9,8.92L11.19,11.17C11.12,11.3 9.17,14.75 9.17,14.75C9.07,14.92 8.94,15.11 8.66,15.11H6.78C6.67,15.11 6.59,15.06 6.54,15C6.5,14.9 6.5,14.8 6.54,14.69L8.53,11.17L7.27,9C7.21,8.87 7.2,8.77 7.25,8.69C7.3,8.61 7.39,8.57 7.5,8.57Z",
"name": "xing-circle"
},
{
"path": "M10.59,2C11.23,2 11.5,2.27 11.58,2.97L11.79,6.14L12.03,10.29C12.05,10.64 12,11 11.86,11.32C11.64,11.77 11.14,11.89 10.73,11.58C10.5,11.39 10.31,11.14 10.15,10.87L6.42,4.55C6.06,3.94 6.17,3.54 6.77,3.16C7.5,2.68 9.73,2 10.59,2M14.83,14.85L15.09,14.91L18.95,16.31C19.61,16.55 19.79,16.92 19.5,17.57C19.06,18.7 18.34,19.66 17.42,20.45C16.96,20.85 16.5,20.78 16.21,20.28L13.94,16.32C13.55,15.61 14.03,14.8 14.83,14.85M4.5,14C4.5,13.26 4.5,12.55 4.75,11.87C4.97,11.2 5.33,11 6,11.27L9.63,12.81C10.09,13 10.35,13.32 10.33,13.84C10.3,14.36 9.97,14.58 9.53,14.73L5.85,15.94C5.15,16.17 4.79,15.96 4.64,15.25C4.55,14.83 4.47,14.4 4.5,14M11.97,21C11.95,21.81 11.6,22.12 10.81,22C9.77,21.8 8.81,21.4 7.96,20.76C7.54,20.44 7.45,19.95 7.76,19.53L10.47,15.97C10.7,15.67 11.03,15.6 11.39,15.74C11.77,15.88 11.97,16.18 11.97,16.59V21M14.45,13.32C13.73,13.33 13.23,12.5 13.64,11.91C14.47,10.67 15.35,9.46 16.23,8.26C16.5,7.85 16.94,7.82 17.31,8.16C18.24,9 18.91,10 19.29,11.22C19.43,11.67 19.25,12.08 18.83,12.2L15.09,13.17L14.45,13.32Z",
"name": "yelp"
}
]

View File

@ -28,7 +28,7 @@ import {
getLovelaceCollection,
LovelaceConfig,
} from "../../../../src/data/lovelace";
import "../../../../src/layouts/loading-screen";
import "../../../../src/layouts/hass-loading-screen";
import { generateDefaultViewConfig } from "../../../../src/panels/lovelace/common/generate-lovelace-config";
import "./hc-layout";
import "@material/mwc-button/mwc-button";
@ -47,7 +47,7 @@ class HcCast extends LitElement {
protected render(): TemplateResult {
if (this.lovelaceConfig === undefined) {
return html` <loading-screen></loading-screen>> `;
return html` <hass-loading-screen no-toolbar></hass-loading-screen>> `;
}
const error =

View File

@ -27,7 +27,7 @@ import {
saveTokens,
} from "../../../../src/common/auth/token_storage";
import "../../../../src/components/ha-icon";
import "../../../../src/layouts/loading-screen";
import "../../../../src/layouts/hass-loading-screen";
import { registerServiceWorker } from "../../../../src/util/register-service-worker";
import "./hc-layout";
@ -98,7 +98,7 @@ export class HcConnect extends LitElement {
}
if (this.castManager === undefined || this.loading) {
return html` <loading-screen></loading-screen> `;
return html` <hass-loading-screen no-toolbar></hass-loading-screen> `;
}
if (this.castManager === null) {

View File

@ -2,7 +2,7 @@ import { html } from "@polymer/polymer/lib/utils/html-tag";
/* eslint-plugin-disable lit */
import { PolymerElement } from "@polymer/polymer/polymer-element";
import "../../../src/components/ha-card";
import "../../../src/dialogs/more-info/controls/more-info-content";
import "../../../src/dialogs/more-info/more-info-content";
import "../../../src/state-summary/state-card-content";
class DemoMoreInfo extends PolymerElement {

View File

@ -420,15 +420,6 @@ export default {
last_changed: "2018-07-19T10:44:46.105940+00:00",
last_updated: "2018-07-19T10:44:46.105940+00:00",
},
"weblink.router": {
entity_id: "weblink.router",
state: "http://192.168.1.1",
attributes: {
friendly_name: "Router",
},
last_changed: "2018-07-19T10:44:46.107286+00:00",
last_updated: "2018-07-19T10:44:46.107286+00:00",
},
"group.all_plants": {
entity_id: "group.all_plants",
state: "ok",
@ -1090,18 +1081,6 @@ export default {
last_changed: "2018-07-19T10:44:46.510448+00:00",
last_updated: "2018-07-19T10:44:46.510448+00:00",
},
"history_graph.recent_switches": {
entity_id: "history_graph.recent_switches",
state: "unknown",
attributes: {
hours_to_show: 1,
refresh: 60,
entity_id: ["switch.ac", "switch.decorative_lights"],
friendly_name: "Recent Switches",
},
last_changed: "2018-07-19T10:44:46.512351+00:00",
last_updated: "2018-07-19T10:44:46.512351+00:00",
},
"scene.switch_on_and_off": {
entity_id: "scene.switch_on_and_off",
state: "scening",

View File

@ -3,7 +3,7 @@ import { html } from "@polymer/polymer/lib/utils/html-tag";
import { PolymerElement } from "@polymer/polymer/polymer-element";
import "../../../src/components/ha-card";
import { SUPPORT_BRIGHTNESS } from "../../../src/data/light";
import "../../../src/dialogs/more-info/controls/more-info-content";
import "../../../src/dialogs/more-info/more-info-content";
import { getEntity } from "../../../src/fake_data/entity";
import { provideHass } from "../../../src/fake_data/provide_hass";
import "../components/demo-more-infos";

View File

@ -19,7 +19,7 @@ import {
reloadHassioAddons,
} from "../../../src/data/hassio/addon";
import "../../../src/layouts/hass-tabs-subpage";
import "../../../src/layouts/loading-screen";
import "../../../src/layouts/hass-loading-screen";
import { HomeAssistant, Route } from "../../../src/types";
import { showRepositoriesDialog } from "../dialogs/repositories/show-dialog-repositories";
import { supervisorTabs } from "../hassio-tabs";
@ -108,7 +108,7 @@ class HassioAddonStore extends LitElement {
</mwc-list-item>
</ha-button-menu>
${repos.length === 0
? html`<loading-screen></loading-screen>`
? html`<hass-loading-screen no-toolbar></hass-loading-screen>`
: html`
<div class="search">
<search-input

View File

@ -71,7 +71,7 @@ class HassioAddonNetwork extends LitElement {
<paper-input
@value-changed=${this._configChanged}
placeholder="disabled"
.value=${String(item.host)}
.value=${item.host ? String(item.host) : ""}
.container=${item.container}
no-label-float
></paper-input>

View File

@ -12,7 +12,7 @@ import {
fetchHassioAddonDocumentation,
HassioAddonDetails,
} from "../../../../src/data/hassio/addon";
import "../../../../src/layouts/loading-screen";
import "../../../../src/layouts/hass-loading-screen";
import "../../../../src/components/ha-circular-progress";
import { haStyle } from "../../../../src/resources/styles";
import { HomeAssistant } from "../../../../src/types";
@ -44,7 +44,7 @@ class HassioAddonDocumentationDashboard extends LitElement {
<div class="card-content">
${this._content
? html`<ha-markdown .content=${this._content}></ha-markdown>`
: html`<loading-screen></loading-screen>`}
: html`<hass-loading-screen no-toolbar></hass-loading-screen>`}
</div>
</ha-card>
</div>

View File

@ -13,7 +13,7 @@ import {
} from "lit-element";
import "../../../src/components/ha-card";
import { fetchHassioLogs } from "../../../src/data/hassio/supervisor";
import "../../../src/layouts/loading-screen";
import "../../../src/layouts/hass-loading-screen";
import { haStyle } from "../../../src/resources/styles";
import { HomeAssistant } from "../../../src/types";
import "../components/hassio-ansi-to-html";
@ -98,7 +98,7 @@ class HassioSupervisorLog extends LitElement {
? html`<hassio-ansi-to-html
.content=${this._content}
></hassio-ansi-to-html>`
: html`<loading-screen></loading-screen>`}
: html`<hass-loading-screen no-toolbar></hass-loading-screen>`}
</div>
<div class="card-actions">
<mwc-button @click=${this._refresh}>Refresh</mwc-button>

View File

@ -25,20 +25,23 @@
"@formatjs/intl-pluralrules": "^1.5.8",
"@fullcalendar/core": "^5.0.0-beta.2",
"@fullcalendar/daygrid": "^5.0.0-beta.2",
"@material/chips": "7.0.0-canary.d92d8c93e.0",
"@material/circular-progress": "7.0.0-canary.d92d8c93e.0",
"@material/mwc-button": "^0.15.0",
"@material/mwc-checkbox": "^0.15.0",
"@material/mwc-dialog": "^0.15.0",
"@material/mwc-fab": "^0.15.0",
"@material/mwc-formfield": "^0.15.0",
"@material/mwc-icon-button": "^0.15.0",
"@material/mwc-list": "^0.15.0",
"@material/mwc-menu": "^0.15.0",
"@material/mwc-ripple": "^0.15.0",
"@material/mwc-switch": "^0.15.0",
"@mdi/js": "4.9.95",
"@mdi/svg": "4.9.95",
"@material/chips": "=8.0.0-canary.a78ceb112.0",
"@material/circular-progress": "=8.0.0-canary.a78ceb112.0",
"@material/mwc-button": "^0.17.2",
"@material/mwc-checkbox": "^0.17.2",
"@material/mwc-dialog": "^0.17.2",
"@material/mwc-fab": "^0.17.2",
"@material/mwc-formfield": "^0.17.2",
"@material/mwc-icon-button": "^0.17.2",
"@material/mwc-list": "^0.17.2",
"@material/mwc-menu": "^0.17.2",
"@material/mwc-ripple": "^0.17.2",
"@material/mwc-switch": "^0.17.2",
"@material/mwc-tab": "^0.17.2",
"@material/mwc-tab-bar": "^0.17.2",
"@material/top-app-bar": "=8.0.0-canary.a78ceb112.0",
"@mdi/js": "5.3.45",
"@mdi/svg": "5.3.45",
"@polymer/app-layout": "^3.0.2",
"@polymer/app-route": "^3.0.2",
"@polymer/app-storage": "^3.0.2",
@ -105,6 +108,7 @@
"resize-observer-polyfill": "^1.5.1",
"roboto-fontface": "^0.10.0",
"superstruct": "^0.6.1",
"svg-gauge": "^1.0.6",
"unfetch": "^4.1.0",
"vue": "^2.6.11",
"vue2-daterange-picker": "^0.5.1",
@ -206,20 +210,7 @@
"@webcomponents/webcomponentsjs": "^2.2.10",
"@polymer/polymer": "3.1.0",
"lit-html": "1.2.1",
"lit-element": "2.3.1",
"@material/animation": "7.0.0-canary.d92d8c93e.0",
"@material/base": "7.0.0-canary.d92d8c93e.0",
"@material/checkbox": "7.0.0-canary.d92d8c93e.0",
"@material/density": "7.0.0-canary.d92d8c93e.0",
"@material/dom": "7.0.0-canary.d92d8c93e.0",
"@material/elevation": "7.0.0-canary.d92d8c93e.0",
"@material/feature-targeting": "7.0.0-canary.d92d8c93e.0",
"@material/ripple": "7.0.0-canary.d92d8c93e.0",
"@material/rtl": "7.0.0-canary.d92d8c93e.0",
"@material/shape": "7.0.0-canary.d92d8c93e.0",
"@material/theme": "7.0.0-canary.d92d8c93e.0",
"@material/touch-target": "7.0.0-canary.d92d8c93e.0",
"@material/typography": "7.0.0-canary.d92d8c93e.0"
"lit-element": "2.3.1"
},
"main": "src/home-assistant.js",
"husky": {

View File

@ -2,7 +2,7 @@ from setuptools import setup, find_packages
setup(
name="home-assistant-frontend",
version="20200702.1",
version="20200714.0",
description="The Home Assistant frontend",
url="https://github.com/home-assistant/home-assistant-polymer",
author="The Home Assistant Authors",

View File

@ -1,131 +0,0 @@
import "@polymer/paper-card/paper-card";
import { html } from "@polymer/polymer/lib/utils/html-tag";
/* eslint-plugin-disable lit */
import { PolymerElement } from "@polymer/polymer/polymer-element";
import { computeStateName } from "../common/entity/compute_state_name";
import "../components/state-history-charts";
import "../data/ha-state-history-data";
import { EventsMixin } from "../mixins/events-mixin";
/*
* @appliesMixin EventsMixin
*/
class HaHistoryGraphCard extends EventsMixin(PolymerElement) {
static get template() {
return html`
<style>
paper-card:not([dialog]) .content {
padding: 0 16px 16px;
}
paper-card[dialog] {
padding-top: 16px;
background-color: transparent;
}
paper-card {
width: 100%;
/* prevent new stacking context, chart tooltip needs to overflow */
position: static;
}
.header {
@apply --paper-font-headline;
line-height: 40px;
color: var(--primary-text-color);
padding: 20px 16px 12px;
@apply --paper-font-common-nowrap;
}
paper-card[dialog] .header {
display: none;
}
</style>
<ha-state-history-data
hass="[[hass]]"
filter-type="recent-entity"
entity-id="[[computeHistoryEntities(stateObj)]]"
data="{{stateHistory}}"
is-loading="{{stateHistoryLoading}}"
cache-config="[[cacheConfig]]"
></ha-state-history-data>
<paper-card
dialog$="[[inDialog]]"
on-click="cardTapped"
elevation="[[computeElevation(inDialog)]]"
>
<div class="header">[[computeTitle(stateObj)]]</div>
<div class="content">
<state-history-charts
hass="[[hass]]"
history-data="[[stateHistory]]"
is-loading-data="[[stateHistoryLoading]]"
up-to-now
no-single
>
</state-history-charts>
</div>
</paper-card>
`;
}
static get properties() {
return {
hass: Object,
stateObj: {
type: Object,
observer: "stateObjObserver",
},
inDialog: {
type: Boolean,
value: false,
},
stateHistory: Object,
stateHistoryLoading: Boolean,
cacheConfig: {
type: Object,
value: {
refresh: 0,
cacheKey: null,
hoursToShow: 24,
},
},
};
}
stateObjObserver(stateObj) {
if (!stateObj) return;
if (
this.cacheConfig.cacheKey !== stateObj.entity_id ||
this.cacheConfig.refresh !== (stateObj.attributes.refresh || 0) ||
this.cacheConfig.hoursToShow !== (stateObj.attributes.hours_to_show || 24)
) {
this.cacheConfig = {
refresh: stateObj.attributes.refresh || 0,
cacheKey: stateObj.entity_id,
hoursToShow: stateObj.attributes.hours_to_show || 24,
};
}
}
computeTitle(stateObj) {
return computeStateName(stateObj);
}
computeContentClass(inDialog) {
return inDialog ? "" : "content";
}
computeHistoryEntities(stateObj) {
return stateObj.attributes.entity_id;
}
computeElevation(inDialog) {
return inDialog ? 0 : 1;
}
cardTapped(ev) {
const mq = window.matchMedia("(min-width: 610px) and (min-height: 550px)");
if (mq.matches) {
ev.stopPropagation();
this.fire("hass-more-info", { entityId: this.stateObj.entity_id });
}
}
}
customElements.define("ha-history_graph-card", HaHistoryGraphCard);

View File

@ -22,7 +22,6 @@ export const DOMAINS_WITH_CARD = [
"timer",
"vacuum",
"water_heater",
"weblink",
];
/** Domains with separate more info dialog. */
@ -36,7 +35,6 @@ export const DOMAINS_WITH_MORE_INFO = [
"cover",
"fan",
"group",
"history_graph",
"humidifier",
"input_datetime",
"light",
@ -58,16 +56,10 @@ export const DOMAINS_HIDE_MORE_INFO = [
"input_select",
"input_text",
"scene",
"weblink",
];
/** Domains that should have the history hidden in the more info dialog. */
export const DOMAINS_MORE_INFO_NO_HISTORY = [
"camera",
"configurator",
"history_graph",
"scene",
];
export const DOMAINS_MORE_INFO_NO_HISTORY = ["camera", "configurator", "scene"];
/** States that we consider "off". */
export const STATES_OFF = ["closed", "locked", "off"];

View File

@ -20,31 +20,24 @@ export default function relativeTime(
let delta = (compareTime.getTime() - dateObj.getTime()) / 1000;
const tense = delta >= 0 ? "past" : "future";
delta = Math.abs(delta);
let timeDesc;
let roundedDelta = Math.round(delta);
let unit = "week";
for (let i = 0; i < tests.length; i++) {
if (delta < tests[i]) {
delta = Math.floor(delta);
timeDesc = localize(
`ui.components.relative_time.duration.${langKey[i]}`,
"count",
delta
);
if (roundedDelta < tests[i]) {
unit = langKey[i];
break;
}
delta /= tests[i];
roundedDelta = Math.round(delta);
}
if (timeDesc === undefined) {
delta = Math.floor(delta);
timeDesc = localize(
"ui.components.relative_time.duration.week",
"count",
delta
);
}
const timeDesc = localize(
`ui.components.relative_time.duration.${unit}`,
"count",
roundedDelta
);
return options.includeTense === false
? timeDesc

View File

@ -22,6 +22,8 @@ const _load = (
(element as HTMLScriptElement).async = true;
if (type) {
(element as HTMLScriptElement).type = type;
// https://github.com/home-assistant/frontend/pull/6328
(element as HTMLScriptElement).crossOrigin = url.substr(0, 1) === "/" ? "use-credentials" : "anonymous";
}
break;
case "link":

View File

@ -0,0 +1,28 @@
/** Return an icon representing a battery state. */
import { HassEntity } from "home-assistant-js-websocket";
export const batteryIcon = (
batteryState: HassEntity,
batteryChargingState?: HassEntity
) => {
const battery = Number(batteryState.state);
const battery_charging =
batteryChargingState && batteryChargingState.state === "on";
if (isNaN(battery)) {
return "hass:battery-unknown";
}
var icon = "hass:battery";
const batteryRound = Math.round(battery / 10) * 10;
if (battery_charging && battery > 10) {
icon += `-charging-${batteryRound}`;
} else if (battery_charging) {
icon += "-outline";
} else if (battery <= 5) {
icon += "-alert";
} else if (battery > 5 && battery < 95) {
icon += `-${batteryRound}`;
}
return icon;
};

View File

@ -13,14 +13,13 @@ const fixedIcons = {
calendar: "hass:calendar",
camera: "hass:video",
climate: "hass:thermostat",
configurator: "hass:settings",
configurator: "hass:cog",
conversation: "hass:text-to-speech",
counter: "hass:counter",
device_tracker: "hass:account",
fan: "hass:fan",
google_assistant: "hass:google-assistant",
group: "hass:google-circles-communities",
history_graph: "hass:chart-line",
homeassistant: "hass:home-assistant",
homekit: "hass:home-automation",
humidifier: "hass:air-humidifier",
@ -29,7 +28,7 @@ const fixedIcons = {
input_datetime: "hass:calendar-clock",
input_number: "hass:ray-vertex",
input_select: "hass:format-list-bulleted",
input_text: "hass:textbox",
input_text: "hass:form-textbox",
light: "hass:lightbulb",
mailbox: "hass:mailbox",
notify: "hass:comment-alert",
@ -44,12 +43,11 @@ const fixedIcons = {
simple_alarm: "hass:bell",
sun: "hass:white-balance-sunny",
switch: "hass:flash",
timer: "hass:timer",
timer: "hass:timer-outline",
updater: "hass:cloud-upload",
vacuum: "hass:robot-vacuum",
water_heater: "hass:thermometer",
weather: "hass:weather-cloudy",
weblink: "hass:open-in-new",
zone: "hass:map-marker-radius",
};

View File

@ -2,6 +2,7 @@
import { HassEntity } from "home-assistant-js-websocket";
import { UNIT_C, UNIT_F } from "../const";
import { domainIcon } from "./domain_icon";
import { batteryIcon } from "./battery_icon";
const fixedDeviceClassIcons = {
humidity: "hass:water-percent",
@ -19,29 +20,7 @@ export const sensorIcon = (state: HassEntity) => {
return fixedDeviceClassIcons[dclass];
}
if (dclass === "battery") {
const battery = Number(state.state);
if (isNaN(battery)) {
return "hass:battery-unknown";
}
const batteryRound = Math.round(battery / 10) * 10;
if (batteryRound >= 100) {
return "hass:battery";
}
if (batteryRound <= 0) {
return "hass:battery-alert";
}
// Will return one of the following icons: (listed so extractor picks up)
// hass:battery-10
// hass:battery-20
// hass:battery-30
// hass:battery-40
// hass:battery-50
// hass:battery-60
// hass:battery-70
// hass:battery-80
// hass:battery-90
// We obscure 'hass' in iconname so this name does not get picked up
return `${"hass"}:battery-${batteryRound}`;
return batteryIcon(state);
}
const unit = state.attributes.unit_of_measurement;

View File

@ -26,6 +26,9 @@ class SearchInput extends LitElement {
@property({ type: Boolean })
public autofocus = false;
@property({ type: String })
public label?: string;
public focus() {
this.shadowRoot!.querySelector("paper-input")!.focus();
}
@ -43,7 +46,7 @@ class SearchInput extends LitElement {
<paper-input
class=${classMap({ "no-underline": this.noUnderline })}
.autofocus=${this.autofocus}
label="Search"
.label=${this.label || "Search"}
.value=${this.filter}
@value-changed=${this._filterInputChanged}
.noLabelFloat=${this.noLabelFloat}

View File

@ -1,19 +1,19 @@
// https://gist.github.com/hagemann/382adfc57adbd5af078dc93feef01fe1
export const slugify = (value: string) => {
export const slugify = (value: string, delimiter = "-") => {
const a =
"àáäâãåăæąçćčđďèéěėëêęğǵḧìíïîįłḿǹńňñòóöôœøṕŕřßşśšșťțùúüûǘůűūųẃẍÿýźžż·/_,:;";
const b =
"aaaaaaaaacccddeeeeeeegghiiiiilmnnnnooooooprrsssssttuuuuuuuuuwxyyzzz------";
const b = `aaaaaaaaacccddeeeeeeegghiiiiilmnnnnooooooprrsssssttuuuuuuuuuwxyyzzz${delimiter}${delimiter}${delimiter}${delimiter}${delimiter}${delimiter}`;
const p = new RegExp(a.split("").join("|"), "g");
return value
.toString()
.toLowerCase()
.replace(/\s+/g, "-") // Replace spaces with -
.replace(/\s+/g, delimiter) // Replace spaces with delimiter
.replace(p, (c) => b.charAt(a.indexOf(c))) // Replace special characters
.replace(/&/g, "-and-") // Replace & with 'and'
.replace(/&/g, `${delimiter}and${delimiter}`) // Replace & with 'and'
.replace(/[^\w-]+/g, "") // Remove all non-word characters
.replace(/--+/g, "-") // Replace multiple - with single -
.replace(/^-+/, "") // Trim - from start of text
.replace(/-+$/, ""); // Trim - from end of text
.replace(/-/, delimiter) // Replace - with delimiter
.replace(new RegExp(`/${delimiter}${delimiter}+/`, "g"), delimiter) // Replace multiple delimiters with single delimiter
.replace(new RegExp(`/^${delimiter}+/`), "") // Trim delimiter from start of text
.replace(new RegExp(`/-+$/`), ""); // Trim delimiter from end of text
};

View File

@ -69,6 +69,7 @@ export interface DataTableColumnData extends DataTableSortColumnData {
width?: string;
maxWidth?: string;
grows?: boolean;
forceLTR?: boolean;
}
export interface DataTableRowData {
@ -352,6 +353,7 @@ export class HaDataTable extends LitElement {
column.type === "icon-button"
),
grows: Boolean(column.grows),
forceLTR: Boolean(column.forceLTR),
})}"
style=${column.width
? styleMap({
@ -604,10 +606,8 @@ export class HaDataTable extends LitElement {
padding-right: 0;
width: 56px;
}
[dir="rtl"] .mdc-data-table__header-cell--checkbox,
.mdc-data-table__header-cell--checkbox[dir="rtl"],
[dir="rtl"] .mdc-data-table__cell--checkbox,
.mdc-data-table__cell--checkbox[dir="rtl"] {
:host([dir="rtl"]) .mdc-data-table__header-cell--checkbox,
:host([dir="rtl"]) .mdc-data-table__cell--checkbox {
/* @noflip */
padding-left: 0;
/* @noflip */
@ -641,8 +641,7 @@ export class HaDataTable extends LitElement {
.mdc-data-table__cell--numeric {
text-align: right;
}
[dir="rtl"] .mdc-data-table__cell--numeric,
.mdc-data-table__cell--numeric[dir="rtl"] {
:host([dir="rtl"]) .mdc-data-table__cell--numeric {
/* @noflip */
text-align: left;
}
@ -660,18 +659,33 @@ export class HaDataTable extends LitElement {
.mdc-data-table__header-cell.mdc-data-table__header-cell--icon {
text-align: center;
}
.mdc-data-table__header-cell.sortable.mdc-data-table__header-cell--icon:hover,
.mdc-data-table__header-cell.sortable.mdc-data-table__header-cell--icon:not(.not-sorted) {
text-align: left;
}
:host([dir="rtl"])
.mdc-data-table__header-cell.sortable.mdc-data-table__header-cell--icon:hover,
:host([dir="rtl"])
.mdc-data-table__header-cell.sortable.mdc-data-table__header-cell--icon:not(.not-sorted) {
text-align: right;
}
.mdc-data-table__cell--icon:first-child ha-icon {
margin-left: 8px;
}
:host([dir="rtl"]) .mdc-data-table__cell--icon:first-child ha-icon {
margin-left: auto;
margin-right: 8px;
}
.mdc-data-table__cell--icon:first-child state-badge {
margin-right: -8px;
}
:host([dir="rtl"]) .mdc-data-table__cell--icon:first-child state-badge {
margin-right: auto;
margin-left: -8px;
}
.mdc-data-table__header-cell--icon-button,
.mdc-data-table__cell--icon-button {
@ -689,12 +703,22 @@ export class HaDataTable extends LitElement {
width: 64px;
padding-left: 16px;
}
:host([dir="rtl"]) .mdc-data-table__header-cell--icon-button:first-child,
:host([dir="rtl"]) .mdc-data-table__cell--icon-button:first-child {
padding-left: auto;
padding-right: 16px;
}
.mdc-data-table__header-cell--icon-button:last-child,
.mdc-data-table__cell--icon-button:last-child {
width: 64px;
padding-right: 16px;
}
:host([dir="rtl"]) .mdc-data-table__header-cell--icon-button:last-child,
:host([dir="rtl"]) .mdc-data-table__cell--icon-button:last-child {
padding-right: auto;
padding-left: 16px;
}
.mdc-data-table__cell--icon-button a {
color: var(--secondary-text-color);
@ -712,8 +736,7 @@ export class HaDataTable extends LitElement {
text-transform: inherit;
text-align: left;
}
[dir="rtl"] .mdc-data-table__header-cell,
.mdc-data-table__header-cell[dir="rtl"] {
:host([dir="rtl"]) .mdc-data-table__header-cell {
/* @noflip */
text-align: right;
}
@ -725,11 +748,15 @@ export class HaDataTable extends LitElement {
.mdc-data-table__header-cell--numeric.sortable:not(.not-sorted) {
text-align: left;
}
[dir="rtl"] .mdc-data-table__header-cell--numeric,
.mdc-data-table__header-cell--numeric[dir="rtl"] {
:host([dir="rtl"]) .mdc-data-table__header-cell--numeric {
/* @noflip */
text-align: left;
}
:host([dir="rtl"]) .mdc-data-table__header-cell--numeric.sortable:hover,
:host([dir="rtl"])
.mdc-data-table__header-cell--numeric.sortable:not(.not-sorted) {
text-align: right;
}
/* custom from here */
@ -750,6 +777,10 @@ export class HaDataTable extends LitElement {
position: relative;
left: 0px;
}
:host([dir="rtl"]) .mdc-data-table__header-cell span {
left: auto;
right: 0px;
}
.mdc-data-table__header-cell.sortable {
cursor: pointer;
@ -757,6 +788,9 @@ export class HaDataTable extends LitElement {
.mdc-data-table__header-cell > * {
transition: left 0.2s ease;
}
:host([dir="rtl"]) .mdc-data-table__header-cell > * {
transition: right 0.2s ease;
}
.mdc-data-table__header-cell ha-icon {
top: -3px;
position: absolute;
@ -764,14 +798,35 @@ export class HaDataTable extends LitElement {
.mdc-data-table__header-cell.not-sorted ha-icon {
left: -20px;
}
:host([dir="rtl"]) .mdc-data-table__header-cell.not-sorted ha-icon {
right: -20px;
}
.mdc-data-table__header-cell.sortable:not(.not-sorted) span,
.mdc-data-table__header-cell.sortable.not-sorted:hover span {
left: 24px;
}
:host([dir="rtl"])
.mdc-data-table__header-cell.sortable:not(.not-sorted)
span,
:host([dir="rtl"])
.mdc-data-table__header-cell.sortable.not-sorted:hover
span {
left: auto;
right: 24px;
}
.mdc-data-table__header-cell.sortable:not(.not-sorted) ha-icon,
.mdc-data-table__header-cell.sortable:hover.not-sorted ha-icon {
left: 12px;
}
:host([dir="rtl"])
.mdc-data-table__header-cell.sortable:not(.not-sorted)
ha-icon,
:host([dir="rtl"])
.mdc-data-table__header-cell.sortable:hover.not-sorted
ha-icon {
left: auto;
right: 12px;
}
.table-header {
border-bottom: 1px solid rgba(var(--rgb-primary-text-color), 0.12);
padding: 0 16px;
@ -802,6 +857,9 @@ export class HaDataTable extends LitElement {
flex-grow: 1;
flex-shrink: 1;
}
.forceLTR {
direction: ltr;
}
`;
}
}

View File

@ -0,0 +1,18 @@
import { batteryIcon } from "../../common/entity/battery_icon";
import "../ha-icon";
import { customElement, html, property, LitElement } from "lit-element";
@customElement("ha-battery-icon")
export class HaBatteryIcon extends LitElement {
@property() public batteryStateObj;
@property() public batteryChargingStateObj;
protected render() {
return html`
<ha-icon
.icon=${batteryIcon(this.batteryStateObj, this.batteryChargingStateObj)}
></ha-icon>
`;
}
}

View File

@ -155,7 +155,9 @@ export class HaStateLabelBadge extends LitElement {
? domainIcon(domain)
: "hass:brightness-3";
case "timer":
return state.state === "active" ? "hass:timer" : "hass:timer-off";
return state.state === "active"
? "hass:timer-outline"
: "hass:timer-off-outline";
default:
return null;
}

View File

@ -19,7 +19,7 @@ class HaCard extends LitElement {
:host {
background: var(
--ha-card-background,
var(--paper-card-background-color, white)
var(--card-background-color, white)
);
border-radius: var(--ha-card-border-radius, 4px);
box-shadow: var(

View File

@ -65,6 +65,7 @@ class HaCoverControls extends PolymerElement {
computeOpenIcon(stateObj) {
switch (stateObj.attributes.device_class) {
case "awning":
case "door":
case "gate":
return "hass:arrow-expand-horizontal";
default:
@ -75,6 +76,7 @@ class HaCoverControls extends PolymerElement {
computeCloseIcon(stateObj) {
switch (stateObj.attributes.device_class) {
case "awning":
case "door":
case "gate":
return "hass:arrow-collapse-horizontal";
default:

View File

@ -5,6 +5,7 @@ import "./ha-icon-button";
import { css, CSSResult, customElement, html } from "lit-element";
import type { Constructor, HomeAssistant } from "../types";
import { mdiClose } from "@mdi/js";
import { computeRTL } from "../common/util/compute_rtl";
const MwcDialog = customElements.get("mwc-dialog") as Constructor<Dialog>;
@ -13,6 +14,7 @@ export const createCloseHeading = (hass: HomeAssistant, title: string) => html`
<mwc-icon-button
aria-label=${hass.localize("ui.dialogs.generic.close")}
dialogAction="close"
?rtl=${computeRTL(hass)}
class="header_button"
>
<ha-svg-icon path=${mdiClose}></ha-svg-icon>
@ -21,6 +23,12 @@ export const createCloseHeading = (hass: HomeAssistant, title: string) => html`
@customElement("ha-dialog")
export class HaDialog extends MwcDialog {
protected renderHeading() {
return html`<slot name="heading">
${super.renderHeading()}
</slot>`;
}
protected static get styles(): CSSResult[] {
return [
style,
@ -38,16 +46,25 @@ export class HaDialog extends MwcDialog {
display: block;
height: 20px;
}
.mdc-dialog__content {
.mdc-dialog .mdc-dialog__content {
position: var(--dialog-content-position, relative);
padding: var(--dialog-content-padding, 20px 24px);
}
.mdc-dialog .mdc-dialog__surface {
position: var(--dialog-content-position, relative);
min-height: var(--mdc-dialog-min-height, auto);
}
.header_button {
position: absolute;
right: 16px;
top: 12px;
top: 10px;
text-decoration: none;
color: inherit;
}
mwc-icon-button[rtl].header_button {
right: auto;
left: 16px;
}
`,
];
}

View File

@ -0,0 +1,47 @@
import {
customElement,
html,
LitElement,
property,
TemplateResult,
CSSResult,
css,
PropertyValues,
} from "lit-element";
import { HaFormElement, HaFormConstantSchema } from "./ha-form";
import { fireEvent } from "../../common/dom/fire_event";
@customElement("ha-form-constant")
export class HaFormConstant extends LitElement implements HaFormElement {
@property({ attribute: false }) public schema!: HaFormConstantSchema;
@property() public label!: string;
protected firstUpdated(changedProps: PropertyValues) {
super.firstUpdated(changedProps);
fireEvent(this, "value-changed", {
value: this.schema.value,
});
}
protected render(): TemplateResult {
return html`<span class="label">${this.label}</span>: ${this.schema.value}`;
}
static get styles(): CSSResult {
return css`
:host {
display: block;
}
.label {
font-weight: 500;
}
`;
}
}
declare global {
interface HTMLElementTagNameMap {
"ha-form-constant": HaFormConstant;
}
}

View File

@ -58,7 +58,9 @@ export class HaFormInteger extends LitElement implements HaFormElement {
.value=${this._value}
.min=${this.schema.valueMin}
.max=${this.schema.valueMax}
.disabled=${this.data === undefined}
.disabled=${this.data === undefined &&
this.schema.optional &&
this.schema.default === undefined}
@value-changed=${this._valueChanged}
></ha-paper-slider>
</div>

View File

@ -15,8 +15,10 @@ import "./ha-form-multi_select";
import "./ha-form-positive_time_period_dict";
import "./ha-form-select";
import "./ha-form-string";
import "./ha-form-constant";
export type HaFormSchema =
| HaFormConstantSchema
| HaFormStringSchema
| HaFormIntegerSchema
| HaFormFloatSchema
@ -33,6 +35,11 @@ export interface HaFormBaseSchema {
description?: { suffix?: string; suggested_value?: HaFormData };
}
export interface HaFormConstantSchema extends HaFormBaseSchema {
type: "constant";
value: string;
}
export interface HaFormIntegerSchema extends HaFormBaseSchema {
type: "integer";
default?: HaFormIntegerData;

View File

@ -14,12 +14,12 @@ export class HaFormfield extends MwcFormfield {
return [
style,
css`
::slotted(ha-switch) {
:host(:not([alignEnd])) ::slotted(ha-switch) {
margin-right: 10px;
}
[dir="rtl"] ::slotted(ha-switch),
::slotted(ha-switch)[dir="rtl"] {
:host([dir="rtl"]:not([alignEnd])) ::slotted(ha-switch) {
margin-left: 10px;
margin-right: auto;
}
`,
];

View File

@ -0,0 +1,47 @@
import { customElement, LitElement, html, unsafeCSS, css } from "lit-element";
// @ts-ignore
import topAppBarStyles from "@material/top-app-bar/dist/mdc.top-app-bar.min.css";
@customElement("ha-header-bar")
export class HaHeaderBar extends LitElement {
protected render() {
return html`<header class="mdc-top-app-bar">
<div class="mdc-top-app-bar__row">
<section
class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start"
id="navigation"
>
<slot name="navigationIcon"></slot>
<span class="mdc-top-app-bar__title">
<slot name="title"></slot>
</span>
</section>
<section
class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end"
id="actions"
role="toolbar"
>
<slot name="actionItems"></slot>
</section>
</div>
</header>`;
}
static get styles() {
return [
unsafeCSS(topAppBarStyles),
css`
.mdc-top-app-bar {
position: static;
color: var(--mdc-theme-on-primary, #fff);
}
`,
];
}
}
declare global {
interface HTMLElementTagNameMap {
"ha-header-bar": HaHeaderBar;
}
}

View File

@ -21,6 +21,205 @@ import {
writeCache,
} from "../data/iconsets";
import { debounce } from "../common/util/debounce";
import { fireEvent } from "../common/dom/fire_event";
const mdiRenameMapping = {
"account-badge": "badge-account",
"account-badge-alert": "badge-account-alert",
"account-badge-alert-outline": "badge-account-alert-outline",
"account-badge-horizontal": "badge-account-horizontal",
"account-badge-horizontal-outline": "badge-account-horizontal-outline",
"account-badge-outline": "badge-account-outline",
"account-card-details": "card-account-details",
"account-card-details-outline": "card-account-details-outline",
airplay: "apple-airplay",
artist: "account-music",
"artist-outline": "account-music-outline",
audiobook: "book-music",
azure: "microsoft-azure",
"azure-devops": "microsoft-azure-devops",
bible: "book-cross",
bowl: "bowl-mix",
"calendar-repeat": "calendar-sync",
"calendar-repeat-outline": "calendar-sync-outline",
"camcorder-box": "video-box",
"camcorder-box-off": "video-box-off",
"cellphone-settings-variant": "cellphone-cog",
"chart-snakey": "chart-sankey",
"chart-snakey-variant": "chart-sankey-variant",
coin: "currency-usd-circle",
"coin-outline": "currency-usd-circle-outline",
"coins-outline": "circle-multiple-outline",
"contact-mail": "card-account-mail",
"contact-mail-outline": "card-account-mail-outline",
"contact-phone": "card-account-phone",
"contact-phone-outline": "card-account-phone-outline",
cowboy: "account-cowboy-hat",
"database-refresh": "database-sync",
dictionary: "book-alphabet",
edge: "microsoft-edge",
"edge-legacy": "microsoft-edge-legacy",
"file-document-box": "text-box",
"file-document-box-check-outline": "text-box-check-outline",
"file-document-box-minus": "text-box-minus",
"file-document-box-minus-outline": "text-box-minus-outline",
"file-document-box-multiple": "text-box-multiple",
"file-document-box-multiple-outline": "text-box-multiple-outline",
"file-document-box-outline": "text-box-outline",
"file-document-box-plus": "text-box-plus",
"file-document-box-plus-outline": "text-box-plus-outline",
"file-document-box-remove": "text-box-remove",
"file-document-box-remove-outline": "text-box-remove-outline",
"file-document-box-search": "text-box-search",
"file-document-box-search-outline": "text-box-search-outline",
"file-settings-variant": "file-cog",
"file-settings-variant-outline": "file-cog-outline",
"folder-settings-variant": "folder-cog",
"folder-settings-variant-outline": "folder-cog-outline",
"github-circle": "github",
"google-adwords": "google-ads",
hackernews: "y-combinator",
hotel: "bed",
"image-filter": "image-multiple-outline",
"internet-explorer": "microsoft-internet-explorer",
json: "code-json",
kotlin: "language-kotlin",
"library-books": "filmstrip-box",
"library-movie": "filmstrip-box-multiple",
"library-music": "music-box-multiple",
"library-music-outline": "music-box-multiple-outline",
"library-video": "play-box-mutiple",
markdown: "language-markdown",
"markdown-outline": "language-markdown-outline",
"message-settings-variant": "message-cog",
"message-settings-variant-outline": "message-cog-outline",
"microsoft-dynamics": "microsoft-dynamics-365",
"network-router": "router-network",
office: "microsoft-office",
onedrive: "microsoft-onedrive",
onenote: "microsoft-onenote",
outlook: "microsoft-outlook",
playstation: "sony-playstation",
"periodic-table-co": "molecule-co",
"periodic-table-co2": "molecule-co2",
pot: "pot-steam",
ruby: "language-ruby",
sailing: "sail-boat",
settings: "cog",
"settings-box": "cog-box",
"settings-outline": "cog-outline",
"settings-transfer": "cog-transfer",
"settings-transfer-outline": "cog-transfer-outline",
"shield-refresh": "shield-sync",
"shield-refresh-outline": "shield-sync-outline",
"sort-alphabetical": "sort-alphabetical-variant",
"sort-alphabetical-ascending": "sort-alphabetical-ascending-variant",
"sort-alphabetical-descending": "sort-alphabetical-descending-variant",
"sort-numeric": "sort-numeric-variant",
"star-half": "star-half-full",
storefront: "storefront-outline",
timer: "timer-outline",
"timer-off": "timer-off-outline",
towing: "tow-truck",
voice: "account-voice",
"wall-sconce-variant": "wall-sconce-round-variant",
wii: "nintendo-wii",
wiiu: "nintendo-wiiu",
windows: "microsoft-windows",
"windows-classic": "microsoft-windows-classic",
worker: "account-hard-hat",
xbox: "microsoft-xbox",
"xbox-controller": "microsoft-xbox-controller",
"xbox-controller-battery-alert": "microsoft-xbox-controller-battery-alert",
"xbox-controller-battery-charging":
"microsoft-xbox-controller-battery-charging",
"xbox-controller-battery-empty": "microsoft-xbox-controller-battery-empty",
"xbox-controller-battery-full": "microsoft-xbox-controller-battery-full",
"xbox-controller-battery-low": "microsoft-xbox-controller-battery-low",
"xbox-controller-battery-medium": "microsoft-xbox-controller-battery-medium",
"xbox-controller-battery-unknown":
"microsoft-xbox-controller-battery-unknown",
"xbox-controller-menu": "microsoft-xbox-controller-menu",
"xbox-controller-off": "microsoft-xbox-controller-off",
"xbox-controller-view": "microsoft-xbox-controller-view",
yammer: "microsoft-yammer",
"youtube-creator-studio": "youtube-studio",
"selection-mutliple": "selection-multiple",
textarea: "form-textarea",
textbox: "form-textbox",
"textbox-lock": "form-textbox-lock",
"textbox-password": "form-textbox-password",
"syllabary-katakana-half-width": "syllabary-katakana-halfwidth",
};
const mdiRemovedIcons = new Set([
"accusoft",
"amazon-drive",
"android-head",
"basecamp",
"beats",
"behance",
"blackberry",
"cisco-webex",
"disqus-outline",
"dribbble",
"dribbble-box",
"etsy",
"eventbrite",
"facebook-box",
"flattr",
"flickr",
"foursquare",
"github-box",
"github-face",
"glassdoor",
"google-adwords",
"google-pages",
"google-physical-web",
"google-plus-box",
"houzz",
"houzz-box",
"instapaper",
"itunes",
"language-python-text",
"lastfm",
"linkedin-box",
"lyft",
"mail-ru",
"mastodon-variant",
"medium",
"meetup",
"mixcloud",
"nfc-off",
"npm-variant",
"npm-variant-outline",
"paypal",
"periscope",
"pinterest-box",
"pocket",
"quicktime",
"shopify",
"slackware",
"square-inc",
"square-inc-cash",
"steam-box",
"strava",
"tor",
"tumblr",
"tumblr-box",
"tumblr-reblog",
"twitter-box",
"twitter-circle",
"uber",
"venmo",
"vk-box",
"vk-circle",
"wunderlist",
"xda",
"xing-box",
"xing-circle",
"yelp",
]);
const chunks: Chunks = {};
@ -65,7 +264,9 @@ export class HaIcon extends LitElement {
if (!this.icon) {
return;
}
const [iconPrefix, iconName] = this.icon.split(":", 2);
const [iconPrefix, origIconName] = this.icon.split(":", 2);
let iconName = origIconName;
if (!iconPrefix || !iconName) {
return;
@ -85,6 +286,25 @@ export class HaIcon extends LitElement {
this._legacy = false;
if (iconName in mdiRenameMapping) {
iconName = mdiRenameMapping[iconName];
const message = `Icon ${iconPrefix}:${origIconName} was renamed to ${iconPrefix}:${iconName}, please change your config, it will be removed in version 0.115.`;
// eslint-disable-next-line no-console
console.warn(message);
fireEvent(this, "write_log", {
level: "warning",
message,
});
} else if (mdiRemovedIcons.has(iconName)) {
const message = `Icon ${this.icon} was removed from MDI, please replace this icon with an other icon in your config, it will be removed in version 0.115.`;
// eslint-disable-next-line no-console
console.warn(message);
fireEvent(this, "write_log", {
level: "warning",
message,
});
}
if (iconName in cachedIcons) {
this._path = cachedIcons[iconName];
return;

View File

@ -10,6 +10,7 @@ class HaLabeledSlider extends PolymerElement {
<style>
:host {
display: block;
border-radius: 4px;
}
.title {
@ -17,13 +18,17 @@ class HaLabeledSlider extends PolymerElement {
opacity: var(--dark-primary-opacity);
}
.slider-container {
display: flex;
}
ha-icon {
float: left;
margin-top: 4px;
opacity: var(--dark-secondary-opacity);
}
ha-paper-slider {
flex-grow: 1;
background-image: var(--ha-slider-background);
}
</style>

View File

@ -96,7 +96,6 @@ export class HaRelatedItems extends SubscribeMixin(LitElement) {
</h3>
<a
href=${`/config/integrations#config_entry=${relatedConfigEntryId}`}
@click=${this._close}
>
${this.hass.localize(`component.${entry.domain}.title`)}:
${entry.title}
@ -116,10 +115,7 @@ export class HaRelatedItems extends SubscribeMixin(LitElement) {
<h3>
${this.hass.localize("ui.components.related-items.device")}:
</h3>
<a
href="/config/devices/device/${relatedDeviceId}"
@click=${this._close}
>
<a href="/config/devices/device/${relatedDeviceId}">
${device.name_by_user || device.name}
</a>
`;
@ -137,7 +133,9 @@ export class HaRelatedItems extends SubscribeMixin(LitElement) {
<h3>
${this.hass.localize("ui.components.related-items.area")}:
</h3>
${area.name}
<a href="/config/areas/area/${relatedAreaId}">
${area.name}
</a>
`;
})
: ""}
@ -290,10 +288,6 @@ export class HaRelatedItems extends SubscribeMixin(LitElement) {
fireEvent(this, "hass-more-info", { entityId });
}
private _close() {
fireEvent(this, "close-dialog");
}
static get styles(): CSSResult {
return css`
a {

View File

@ -1,7 +1,7 @@
import "@material/mwc-icon-button";
import {
mdiBell,
mdiCellphoneSettingsVariant,
mdiCellphoneCog,
mdiMenuOpen,
mdiMenu,
mdiViewDashboard,
@ -219,7 +219,7 @@ class HaSidebar extends LitElement {
<paper-icon-item>
<ha-svg-icon
slot="item-icon"
.path=${mdiCellphoneSettingsVariant}
.path=${mdiCellphoneCog}
></ha-svg-icon>
<span class="item-text">
${hass.localize("ui.sidebar.external_app_configuration")}

View File

@ -20,6 +20,8 @@ export interface AutomationConfig {
trigger: Trigger[];
condition?: Condition[];
action: Action[];
mode?: "single" | "restart" | "queued" | "parallel";
max?: number;
}
export interface ForDict {

View File

@ -17,7 +17,6 @@ export const ENTITY_COMPONENT_DOMAINS = [
"fan",
"geo_location",
"group",
"history_graph",
"image_processing",
"input_boolean",
"input_datetime",

View File

@ -37,6 +37,17 @@ export const findBatteryEntity = (
hass.states[entity.entity_id].attributes.device_class === "battery"
);
export const findBatteryChargingEntity = (
hass: HomeAssistant,
entities: EntityRegistryEntry[]
): EntityRegistryEntry | undefined =>
entities.find(
(entity) =>
hass.states[entity.entity_id] &&
hass.states[entity.entity_id].attributes.device_class ===
"battery_charging"
);
export const computeEntityRegistryName = (
hass: HomeAssistant,
entry: EntityRegistryEntry

View File

@ -1,178 +0,0 @@
import { timeOut } from "@polymer/polymer/lib/utils/async";
import { Debouncer } from "@polymer/polymer/lib/utils/debounce";
/* eslint-plugin-disable lit */
import { PolymerElement } from "@polymer/polymer/polymer-element";
import LocalizeMixin from "../mixins/localize-mixin";
import { getRecent, getRecentWithCache } from "./cached-history";
import { computeHistory, fetchDate } from "./history";
/*
* @appliesMixin LocalizeMixin
*/
class HaStateHistoryData extends LocalizeMixin(PolymerElement) {
static get properties() {
return {
hass: {
type: Object,
observer: "hassChanged",
},
filterType: String,
cacheConfig: Object,
startTime: Date,
endTime: Date,
entityId: String,
isLoading: {
type: Boolean,
value: true,
readOnly: true,
notify: true,
},
data: {
type: Object,
value: null,
readOnly: true,
notify: true,
},
};
}
static get observers() {
return [
"filterChangedDebouncer(filterType, entityId, startTime, endTime, cacheConfig, localize)",
];
}
connectedCallback() {
super.connectedCallback();
this.filterChangedDebouncer(
this.filterType,
this.entityId,
this.startTime,
this.endTime,
this.cacheConfig,
this.localize
);
}
disconnectedCallback() {
if (this._refreshTimeoutId) {
window.clearInterval(this._refreshTimeoutId);
this._refreshTimeoutId = null;
}
super.disconnectedCallback();
}
hassChanged(newHass, oldHass) {
if (!oldHass && !this._madeFirstCall) {
this.filterChangedDebouncer(
this.filterType,
this.entityId,
this.startTime,
this.endTime,
this.cacheConfig,
this.localize
);
}
}
filterChangedDebouncer(...args) {
this._debounceFilterChanged = Debouncer.debounce(
this._debounceFilterChanged,
timeOut.after(0),
() => {
this.filterChanged(...args);
}
);
}
filterChanged(
filterType,
entityId,
startTime,
endTime,
cacheConfig,
localize
) {
if (!this.hass) {
return;
}
if (cacheConfig && !cacheConfig.cacheKey) {
return;
}
if (!localize) {
return;
}
this._madeFirstCall = true;
const language = this.hass.language;
let data;
if (filterType === "date") {
if (!startTime || !endTime) return;
data = fetchDate(this.hass, startTime, endTime).then((dateHistory) =>
computeHistory(this.hass, dateHistory, localize, language)
);
} else if (filterType === "recent-entity") {
if (!entityId) return;
if (cacheConfig) {
data = this.getRecentWithCacheRefresh(
entityId,
cacheConfig,
localize,
language
);
} else {
data = getRecent(
this.hass,
entityId,
startTime,
endTime,
localize,
language
);
}
} else {
return;
}
this._setIsLoading(true);
data.then((stateHistory) => {
this._setData(stateHistory);
this._setIsLoading(false);
});
}
getRecentWithCacheRefresh(entityId, cacheConfig, localize, language) {
if (this._refreshTimeoutId) {
window.clearInterval(this._refreshTimeoutId);
this._refreshTimeoutId = null;
}
if (cacheConfig.refresh) {
this._refreshTimeoutId = window.setInterval(() => {
getRecentWithCache(
this.hass,
entityId,
cacheConfig,
localize,
language
).then((stateHistory) => {
this._setData({ ...stateHistory });
});
}, cacheConfig.refresh * 1000);
}
return getRecentWithCache(
this.hass,
entityId,
cacheConfig,
localize,
language
);
}
}
customElements.define("ha-state-history-data", HaStateHistoryData);

View File

@ -40,6 +40,7 @@ export interface SceneEntity extends HassEntityBase {
export interface SceneConfig {
name: string;
icon?: string;
entities: SceneEntities;
}

View File

@ -7,15 +7,24 @@ import { navigate } from "../common/navigate";
import { HomeAssistant } from "../types";
import { Condition } from "./automation";
export const MODES = ["single", "restart", "queued", "parallel"];
export const MODES_MAX = ["queued", "parallel"];
export interface ScriptEntity extends HassEntityBase {
attributes: HassEntityAttributeBase & {
last_triggered: string;
mode: "single" | "restart" | "queued" | "parallel";
current?: number;
max?: number;
};
}
export interface ScriptConfig {
alias: string;
sequence: Action[];
icon?: string;
mode?: "single" | "restart" | "queued" | "parallel";
max?: number;
}
export interface EventAction {
@ -64,6 +73,20 @@ export const triggerScript = (
variables?: {}
) => hass.callService("script", computeObjectId(entityId), variables);
export const canExcecute = (state: ScriptEntity) => {
if (state.state === "off") {
return true;
}
if (
state.state === "on" &&
MODES_MAX.includes(state.attributes.mode) &&
state.attributes.current! < state.attributes.max!
) {
return true;
}
return false;
};
export const deleteScript = (hass: HomeAssistant, objectId: string) =>
hass.callApi("DELETE", `config/script/config/${objectId}`);

View File

@ -22,6 +22,7 @@ import type { PolymerChangedEvent } from "../../polymer-types";
import { haStyleDialog } from "../../resources/styles";
import type { HomeAssistant } from "../../types";
import { ConfigEntrySystemOptionsDialogParams } from "./show-dialog-config-entry-system-options";
import { computeRTLDirection } from "../../common/util/compute_rtl";
@customElement("dialog-config-entry-system-options")
class DialogConfigEntrySystemOptions extends LitElement {
@ -99,6 +100,7 @@ class DialogConfigEntrySystemOptions extends LitElement {
) || this._params.entry.domain
)}
</p>`}
.dir=${computeRTLDirection(this.hass)}
>
<ha-switch
.checked=${!this._disableNewEntities}

View File

@ -35,6 +35,8 @@ import "./step-flow-external";
import "./step-flow-form";
import "./step-flow-loading";
import "./step-flow-pick-handler";
import { fireEvent } from "../../common/dom/fire_event";
import { computeRTL } from "../../common/util/compute_rtl";
let instance = 0;
@ -113,6 +115,17 @@ class DataEntryFlowDialog extends LitElement {
this._loading = false;
}
public closeDialog() {
if (this._step) {
this._flowDone();
} else if (this._step === null) {
// Flow aborted during picking flow
this._step = undefined;
this._params = undefined;
}
fireEvent(this, "dialog-closed", { dialog: this.localName });
}
protected render(): TemplateResult {
if (!this._params) {
return html``;
@ -121,7 +134,7 @@ class DataEntryFlowDialog extends LitElement {
return html`
<ha-dialog
open
@closing=${this._close}
@closed=${this.closeDialog}
scrimClickAction
escapeKeyAction
hideActions
@ -147,6 +160,7 @@ class DataEntryFlowDialog extends LitElement {
)}
icon="hass:close"
dialogAction="close"
?rtl=${computeRTL(this.hass)}
></ha-icon-button>
${this._step === null
? // Show handler picker
@ -295,16 +309,6 @@ class DataEntryFlowDialog extends LitElement {
}
}
private _close(): void {
if (this._step) {
this._flowDone();
} else if (this._step === null) {
// Flow aborted during picking flow
this._step = undefined;
this._params = undefined;
}
}
static get styles(): CSSResultArray {
return [
haStyleDialog,
@ -318,6 +322,10 @@ class DataEntryFlowDialog extends LitElement {
top: 0;
right: 0;
}
ha-icon-button[rtl] {
right: auto;
left: 0;
}
`,
];
}

View File

@ -81,6 +81,7 @@ class StepFlowPickHandler extends LitElement {
autofocus
.filter=${this.filter}
@value-changed=${this._filterChanged}
.label=${this.hass.localize("ui.panel.config.integrations.search")}
></search-input>
<div
style=${styleMap({

View File

@ -16,6 +16,7 @@ import { PolymerChangedEvent } from "../../polymer-types";
import { haStyleDialog } from "../../resources/styles";
import { HomeAssistant } from "../../types";
import { DialogParams } from "./show-dialog-box";
import { fireEvent } from "../../common/dom/fire_event";
@customElement("dialog-box")
class DialogBox extends LitElement {
@ -32,6 +33,17 @@ class DialogBox extends LitElement {
}
}
public closeDialog(): boolean {
if (this._params?.confirmation || this._params?.prompt) {
this._dismiss();
return true;
}
if (this._params) {
return false;
}
return true;
}
protected render(): TemplateResult {
if (!this._params) {
return html``;
@ -100,11 +112,11 @@ class DialogBox extends LitElement {
this._value = ev.detail.value;
}
private async _dismiss(): Promise<void> {
private _dismiss(): void {
if (this._params!.cancel) {
this._params!.cancel();
}
this._params = undefined;
this._close();
}
private _handleKeyUp(ev: KeyboardEvent) {
@ -113,15 +125,16 @@ class DialogBox extends LitElement {
}
}
private async _confirm(): Promise<void> {
private _confirm(): void {
if (this._params!.confirm) {
this._params!.confirm(this._value);
}
this._dismiss();
this._close();
}
private _close(): void {
this._params = undefined;
fireEvent(this, "dialog-closed", { dialog: this.localName });
}
static get styles(): CSSResult[] {

View File

@ -1,155 +0,0 @@
import "@polymer/paper-dialog-behavior/paper-dialog-shared-styles";
import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
import { html } from "@polymer/polymer/lib/utils/html-tag";
/* eslint-plugin-disable lit */
import { PolymerElement } from "@polymer/polymer/polymer-element";
import { computeStateDomain } from "../common/entity/compute_state_domain";
import DialogMixin from "../mixins/dialog-mixin";
import "../styles/polymer-ha-style-dialog";
import "./more-info/more-info-controls";
/*
* @appliesMixin DialogMixin
*/
class HaMoreInfoDialog extends DialogMixin(PolymerElement) {
static get template() {
return html`
<style include="ha-style-dialog paper-dialog-shared-styles">
:host {
font-size: 14px;
width: 365px;
border-radius: 2px;
}
more-info-controls {
--more-info-header-background: var(--secondary-background-color);
--more-info-header-color: var(--primary-text-color);
--ha-more-info-app-toolbar-title: {
/* Design guideline states 24px, changed to 16 to align with state info */
margin-left: 16px;
line-height: 1.3em;
max-height: 2.6em;
overflow: hidden;
/* webkit and blink still support simple multiline text-overflow */
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
}
}
/* overrule the ha-style-dialog max-height on small screens */
@media all and (max-width: 450px), all and (max-height: 500px) {
more-info-controls {
--more-info-header-background: var(--app-header-background-color);
--more-info-header-color: var(--app-header-text-color, white);
}
:host {
width: 100% !important;
border-radius: 0px;
position: fixed !important;
margin: 0;
}
:host::before {
content: "";
position: fixed;
z-index: -1;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background-color: inherit;
}
}
:host([data-domain="camera"]) {
width: auto;
}
:host([data-domain="history_graph"]),
:host([large]) {
width: 90%;
}
</style>
<more-info-controls
class="no-padding"
hass="[[hass]]"
state-obj="[[stateObj]]"
dialog-element="[[_dialogElement()]]"
large="{{large}}"
></more-info-controls>
`;
}
static get properties() {
return {
hass: Object,
stateObj: {
type: Object,
computed: "_computeStateObj(hass)",
observer: "_stateObjChanged",
},
large: {
type: Boolean,
reflectToAttribute: true,
observer: "_largeChanged",
},
dataDomain: {
computed: "_computeDomain(stateObj)",
reflectToAttribute: true,
},
};
}
static get observers() {
return ["_dialogOpenChanged(opened)"];
}
_dialogElement() {
return this;
}
_computeDomain(stateObj) {
return stateObj ? computeStateDomain(stateObj) : "";
}
_computeStateObj(hass) {
return hass.states[hass.moreInfoEntityId] || null;
}
async _stateObjChanged(newVal) {
if (!newVal) {
this.setProperties({
opened: false,
large: false,
});
return;
}
requestAnimationFrame(() =>
requestAnimationFrame(() => {
// allow dialog to render content before showing it so it will be
// positioned correctly.
this.opened = true;
})
);
}
_dialogOpenChanged(newVal) {
if (!newVal && this.stateObj) {
this.fire("hass-more-info", { entityId: null });
}
}
_equals(a, b) {
return a === b;
}
_largeChanged() {
this.notifyResize();
}
}
customElements.define("ha-more-info-dialog", HaMoreInfoDialog);

View File

@ -6,15 +6,18 @@ declare global {
interface HASSDomEvents {
"show-dialog": ShowDialogParams<unknown>;
"close-dialog": undefined;
"dialog-closed": DialogClosedParams;
}
// for add event listener
interface HTMLElementEventMap {
"show-dialog": HASSDomEvent<ShowDialogParams<unknown>>;
"dialog-closed": HASSDomEvent<DialogClosedParams>;
}
}
interface HassDialog<T = HASSDomEvents[ValidHassDomEvent]> extends HTMLElement {
showDialog(params: T);
closeDialog?: () => boolean | void;
}
interface ShowDialogParams<T> {
@ -23,16 +26,30 @@ interface ShowDialogParams<T> {
dialogParams: T;
}
export interface DialogClosedParams {
dialog: string;
}
export interface DialogState {
dialog: string;
open: boolean;
oldState: null | DialogState;
dialogParams?: unknown;
}
const LOADED = {};
export const showDialog = async (
element: HTMLElement & ProvideHassElement,
root: ShadowRoot | HTMLElement,
dialogImport: () => Promise<unknown>,
dialogTag: string,
dialogParams: unknown
dialogParams: unknown,
dialogImport?: () => Promise<unknown>
) => {
if (!(dialogTag in LOADED)) {
if (!dialogImport) {
return;
}
LOADED[dialogTag] = dialogImport().then(() => {
const dialogEl = document.createElement(dialogTag) as HassDialog;
element.provideHass(dialogEl);
@ -40,19 +57,55 @@ export const showDialog = async (
return dialogEl;
});
}
history.replaceState(
{
dialog: dialogTag,
open: false,
oldState:
history.state?.open && history.state?.dialog !== dialogTag
? history.state
: null,
},
""
);
try {
history.pushState(
{ dialog: dialogTag, dialogParams: dialogParams, open: true },
""
);
} catch (err) {
// dialogParams could not be cloned, probably contains callback
history.pushState(
{ dialog: dialogTag, dialogParams: null, open: true },
""
);
}
const dialogElement = await LOADED[dialogTag];
dialogElement.showDialog(dialogParams);
};
export const closeDialog = async (dialogTag: string): Promise<boolean> => {
if (!(dialogTag in LOADED)) {
return true;
}
const dialogElement = await LOADED[dialogTag];
if (dialogElement.closeDialog) {
return dialogElement.closeDialog() !== false;
}
return true;
};
export const makeDialogManager = (
element: HTMLElement & ProvideHassElement,
root: ShadowRoot | HTMLElement
) => {
element.addEventListener(
"show-dialog",
async (e: HASSDomEvent<ShowDialogParams<unknown>>) => {
(e: HASSDomEvent<ShowDialogParams<unknown>>) => {
const { dialogTag, dialogImport, dialogParams } = e.detail;
showDialog(element, root, dialogImport, dialogTag, dialogParams);
showDialog(element, root, dialogTag, dialogParams, dialogImport);
}
);
};

View File

@ -1,33 +0,0 @@
import { html } from "@polymer/polymer/lib/utils/html-tag";
/* eslint-plugin-disable lit */
import { PolymerElement } from "@polymer/polymer/polymer-element";
import "../../../cards/ha-history_graph-card";
import "../../../components/ha-attributes";
class MoreInfoHistoryGraph extends PolymerElement {
static get template() {
return html`
<style>
:host {
display: block;
margin-bottom: 6px;
}
</style>
<ha-history_graph-card
hass="[[hass]]"
state-obj="[[stateObj]]"
in-dialog=""
>
<ha-attributes state-obj="[[stateObj]]"></ha-attributes>
</ha-history_graph-card>
`;
}
static get properties() {
return {
hass: Object,
stateObj: Object,
};
}
}
customElements.define("more-info-history_graph", MoreInfoHistoryGraph);

View File

@ -28,6 +28,12 @@ class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
return html`
<style include="iron-flex"></style>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
}
.effect_list,
.brightness,
.color_temp,
@ -50,7 +56,6 @@ class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
.segmentationContainer {
position: relative;
width: 100%;
}
ha-color-picker {
@ -118,10 +123,22 @@ class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
--ha-color-picker-marker-bordercolor: white;
}
.control {
width: 100%;
}
.is-unavailable .control {
max-height: 0px;
}
ha-attributes {
width: 100%;
}
ha-paper-dropdown-menu {
width: 100%;
}
paper-item {
cursor: pointer;
}
@ -275,7 +292,10 @@ class MoreInfoLight extends LocalizeMixin(EventsMixin(PolymerElement)) {
}
computeClassNames(stateObj) {
const classes = [featureClassNames(stateObj, FEATURE_CLASS_NAMES)];
const classes = [
"content",
featureClassNames(stateObj, FEATURE_CLASS_NAMES),
];
if (stateObj && stateObj.state === "on") {
classes.push("is-on");
}

View File

@ -0,0 +1,310 @@
import "@material/mwc-button";
import "@material/mwc-icon-button";
import "../../components/ha-header-bar";
import "../../components/ha-dialog";
import "../../components/ha-svg-icon";
import { isComponentLoaded } from "../../common/config/is_component_loaded";
import { DOMAINS_MORE_INFO_NO_HISTORY } from "../../common/const";
import { computeStateName } from "../../common/entity/compute_state_name";
import { navigate } from "../../common/navigate";
import { fireEvent } from "../../common/dom/fire_event";
import "../../components/state-history-charts";
import { removeEntityRegistryEntry } from "../../data/entity_registry";
import { showEntityEditorDialog } from "../../panels/config/entities/show-dialog-entity-editor";
import "../../state-summary/state-card-content";
import { showConfirmationDialog } from "../generic/show-dialog-box";
import "./more-info-content";
import {
customElement,
LitElement,
property,
css,
html,
internalProperty,
} from "lit-element";
import { haStyleDialog } from "../../resources/styles";
import { HomeAssistant } from "../../types";
import { getRecentWithCache } from "../../data/cached-history";
import { computeDomain } from "../../common/entity/compute_domain";
import { mdiClose, mdiCog, mdiPencil } from "@mdi/js";
import { HistoryResult } from "../../data/history";
const DOMAINS_NO_INFO = ["camera", "configurator"];
const EDITABLE_DOMAINS_WITH_ID = ["scene", "automation"];
const EDITABLE_DOMAINS = ["script"];
export interface MoreInfoDialogParams {
entityId: string | null;
}
@customElement("ha-more-info-dialog")
export class MoreInfoDialog extends LitElement {
@property() public hass!: HomeAssistant;
@property({ type: Boolean, reflect: true }) public large = false;
@internalProperty() private _stateHistory?: HistoryResult;
@internalProperty() private _entityId?: string | null;
private _historyRefreshInterval?: number;
public showDialog(params: MoreInfoDialogParams) {
this._entityId = params.entityId;
if (!this._entityId) {
this.closeDialog();
}
this.large = false;
this._stateHistory = undefined;
if (this._computeShowHistoryComponent(this._entityId)) {
this._getStateHistory();
clearInterval(this._historyRefreshInterval);
this._historyRefreshInterval = window.setInterval(() => {
this._getStateHistory();
}, 60 * 1000);
}
}
public closeDialog() {
this._entityId = undefined;
this._stateHistory = undefined;
clearInterval(this._historyRefreshInterval);
this._historyRefreshInterval = undefined;
fireEvent(this, "dialog-closed", { dialog: this.localName });
}
protected render() {
if (!this._entityId) {
return html``;
}
const entityId = this._entityId;
const stateObj = this.hass.states[entityId];
const domain = computeDomain(entityId);
if (!stateObj) {
return html``;
}
return html`
<ha-dialog
open
@closed=${this.closeDialog}
.heading=${true}
hideActions
data-domain=${domain}
>
<ha-header-bar slot="heading">
<mwc-icon-button
slot="navigationIcon"
.label=${this.hass.localize("ui.dialogs.more_info_control.dismiss")}
dialogAction="cancel"
>
<ha-svg-icon .path=${mdiClose}></ha-svg-icon>
</mwc-icon-button>
<div slot="title" class="main-title" @click=${this._enlarge}>
${computeStateName(stateObj)}
</div>
${this.hass.user!.is_admin
? html`<mwc-icon-button
slot="actionItems"
.label=${this.hass.localize(
"ui.dialogs.more_info_control.settings"
)}
@click=${this._gotoSettings}
>
<ha-svg-icon .path=${mdiCog}></ha-svg-icon>
</mwc-icon-button>`
: ""}
${this.hass.user!.is_admin &&
((EDITABLE_DOMAINS_WITH_ID.includes(domain) &&
stateObj.attributes.id) ||
EDITABLE_DOMAINS.includes(domain))
? html` <mwc-icon-button
slot="actionItems"
.label=${this.hass.localize(
"ui.dialogs.more_info_control.edit"
)}
@click=${this._gotoEdit}
>
<ha-svg-icon .path=${mdiPencil}></ha-svg-icon>
</mwc-icon-button>`
: ""}
</ha-header-bar>
<div class="content">
${DOMAINS_NO_INFO.includes(domain)
? ""
: html`
<state-card-content
.stateObj=${stateObj}
.hass=${this.hass}
in-dialog
></state-card-content>
`}
${this._computeShowHistoryComponent(entityId)
? html`
<state-history-charts
.hass=${this.hass}
.historyData=${this._stateHistory}
up-to-now
.isLoadingData=${!this._stateHistory}
></state-history-charts>
`
: ""}
<more-info-content
.stateObj=${stateObj}
.hass=${this.hass}
></more-info-content>
${stateObj.attributes.restored
? html`<p>
${this.hass.localize(
"ui.dialogs.more_info_control.restored.not_provided"
)}
</p>
<p>
${this.hass.localize(
"ui.dialogs.more_info_control.restored.remove_intro"
)}
</p>
<mwc-button class="warning" @click=${this._removeEntity}>
${this.hass.localize(
"ui.dialogs.more_info_control.restored.remove_action"
)}
</mwc-button>`
: ""}
</div>
</ha-dialog>
`;
}
private _enlarge() {
this.large = !this.large;
}
private async _getStateHistory(): Promise<void> {
if (!this._entityId) {
return;
}
this._stateHistory = await getRecentWithCache(
this.hass!,
this._entityId,
{
refresh: 60,
cacheKey: `more_info.${this._entityId}`,
hoursToShow: 24,
},
this.hass!.localize,
this.hass!.language
);
}
private _computeShowHistoryComponent(entityId) {
return (
isComponentLoaded(this.hass, "history") &&
!DOMAINS_MORE_INFO_NO_HISTORY.includes(computeDomain(entityId))
);
}
private _removeEntity() {
const entityId = this._entityId!;
showConfirmationDialog(this, {
title: this.hass.localize(
"ui.dialogs.more_info_control.restored.confirm_remove_title"
),
text: this.hass.localize(
"ui.dialogs.more_info_control.restored.confirm_remove_text"
),
confirmText: this.hass.localize("ui.common.yes"),
dismissText: this.hass.localize("ui.common.no"),
confirm: () => {
removeEntityRegistryEntry(this.hass, entityId);
},
});
}
private _gotoSettings() {
showEntityEditorDialog(this, {
entity_id: this._entityId!,
});
this.closeDialog();
}
private _gotoEdit() {
const stateObj = this.hass.states[this._entityId!];
const domain = computeDomain(this._entityId!);
navigate(
this,
`/config/${domain}/edit/${
EDITABLE_DOMAINS_WITH_ID.includes(domain)
? stateObj.attributes.id
: stateObj.entity_id
}`
);
this.closeDialog();
}
static get styles() {
return [
haStyleDialog,
css`
ha-dialog {
--dialog-content-position: static;
}
ha-header-bar {
--mdc-theme-on-primary: var(--primary-text-color);
--mdc-theme-primary: var(--card-background-color);
flex-shrink: 0;
border-bottom: 1px solid
var(--mdc-dialog-scroll-divider-color, rgba(0, 0, 0, 0.12));
}
@media all and (max-width: 450px), all and (max-height: 500px) {
ha-header-bar {
--mdc-theme-primary: var(--app-header-background-color);
--mdc-theme-on-primary: var(--app-header-text-color, white);
border-bottom: none;
}
}
@media all and (min-width: 451px) and (min-height: 501px) {
ha-dialog {
--mdc-dialog-max-width: 90vw;
}
ha-dialog:not([data-domain="camera"]) app-toolbar {
max-width: 368px;
}
.content {
width: 352px;
}
.main-title {
cursor: default;
}
ha-dialog[data-domain="camera"] .content {
width: auto;
}
:host([large]) .content {
width: calc(90vw - 48px);
}
:host([large]) app-toolbar {
max-width: calc(90vw - 32px);
}
}
state-history-charts {
margin-top: 16px 0;
}
ha-dialog[data-domain="camera"] {
--dialog-content-padding: 0;
}
`,
];
}
}

View File

@ -1,31 +1,30 @@
import { HassEntity } from "home-assistant-js-websocket";
import { property, PropertyValues, UpdatingElement } from "lit-element";
import dynamicContentUpdater from "../../../common/dom/dynamic_content_updater";
import { stateMoreInfoType } from "../../../common/entity/state_more_info_type";
import { HomeAssistant } from "../../../types";
import "./more-info-alarm_control_panel";
import "./more-info-automation";
import "./more-info-camera";
import "./more-info-climate";
import "./more-info-configurator";
import "./more-info-counter";
import "./more-info-cover";
import "./more-info-default";
import "./more-info-fan";
import "./more-info-group";
import "./more-info-history_graph";
import "./more-info-humidifier";
import "./more-info-input_datetime";
import "./more-info-light";
import "./more-info-lock";
import "./more-info-media_player";
import "./more-info-person";
import "./more-info-script";
import "./more-info-sun";
import "./more-info-timer";
import "./more-info-vacuum";
import "./more-info-water_heater";
import "./more-info-weather";
import dynamicContentUpdater from "../../common/dom/dynamic_content_updater";
import { stateMoreInfoType } from "../../common/entity/state_more_info_type";
import { HomeAssistant } from "../../types";
import "./controls/more-info-alarm_control_panel";
import "./controls/more-info-automation";
import "./controls/more-info-camera";
import "./controls/more-info-climate";
import "./controls/more-info-configurator";
import "./controls/more-info-counter";
import "./controls/more-info-cover";
import "./controls/more-info-default";
import "./controls/more-info-fan";
import "./controls/more-info-group";
import "./controls/more-info-humidifier";
import "./controls/more-info-input_datetime";
import "./controls/more-info-light";
import "./controls/more-info-lock";
import "./controls/more-info-media_player";
import "./controls/more-info-person";
import "./controls/more-info-script";
import "./controls/more-info-sun";
import "./controls/more-info-timer";
import "./controls/more-info-vacuum";
import "./controls/more-info-water_heater";
import "./controls/more-info-weather";
class MoreInfoContent extends UpdatingElement {
@property() public hass?: HomeAssistant;

View File

@ -1,284 +0,0 @@
import "@material/mwc-button";
import "@polymer/app-layout/app-toolbar/app-toolbar";
import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
import "../../components/ha-icon-button";
import { html } from "@polymer/polymer/lib/utils/html-tag";
/* eslint-plugin-disable lit */
import { PolymerElement } from "@polymer/polymer/polymer-element";
import { isComponentLoaded } from "../../common/config/is_component_loaded";
import { DOMAINS_MORE_INFO_NO_HISTORY } from "../../common/const";
import { computeStateDomain } from "../../common/entity/compute_state_domain";
import { computeStateName } from "../../common/entity/compute_state_name";
import { navigate } from "../../common/navigate";
import { computeRTL } from "../../common/util/compute_rtl";
import "../../components/state-history-charts";
import { removeEntityRegistryEntry } from "../../data/entity_registry";
import "../../data/ha-state-history-data";
import { EventsMixin } from "../../mixins/events-mixin";
import LocalizeMixin from "../../mixins/localize-mixin";
import { showEntityEditorDialog } from "../../panels/config/entities/show-dialog-entity-editor";
import "../../styles/polymer-ha-style-dialog";
import "../../state-summary/state-card-content";
import { showConfirmationDialog } from "../generic/show-dialog-box";
import "./controls/more-info-content";
const DOMAINS_NO_INFO = ["camera", "configurator", "history_graph"];
const EDITABLE_DOMAINS_WITH_ID = ["scene", "automation"];
const EDITABLE_DOMAINS = ["script"];
/*
* @appliesMixin EventsMixin
*/
class MoreInfoControls extends LocalizeMixin(EventsMixin(PolymerElement)) {
static get template() {
return html`
<style include="ha-style-dialog">
app-toolbar {
color: var(--more-info-header-color);
background-color: var(--more-info-header-background);
}
app-toolbar [main-title] {
@apply --ha-more-info-app-toolbar-title;
}
state-card-content {
display: block;
padding: 16px;
}
state-history-charts {
max-width: 100%;
margin-bottom: 16px;
}
@media all and (min-width: 451px) and (min-height: 501px) {
.main-title {
pointer-events: auto;
cursor: default;
}
}
paper-dialog-scrollable {
padding-bottom: 16px;
}
mwc-button.warning {
--mdc-theme-primary: var(--error-color);
}
:host([domain="camera"]) paper-dialog-scrollable {
margin: 0 -24px -21px;
}
:host([rtl]) app-toolbar {
direction: rtl;
text-align: right;
}
</style>
<app-toolbar>
<ha-icon-button
aria-label$="[[localize('ui.dialogs.more_info_control.dismiss')]]"
icon="hass:close"
dialog-dismiss
></ha-icon-button>
<div class="main-title" main-title="" on-click="enlarge">
[[_computeStateName(stateObj)]]
</div>
<template is="dom-if" if="[[hass.user.is_admin]]">
<ha-icon-button
aria-label$="[[localize('ui.dialogs.more_info_control.settings')]]"
icon="hass:settings"
on-click="_gotoSettings"
></ha-icon-button>
</template>
<template is="dom-if" if="[[_computeEdit(hass, stateObj)]]">
<ha-icon-button
aria-label$="[[localize('ui.dialogs.more_info_control.edit')]]"
icon="hass:pencil"
on-click="_gotoEdit"
></ha-icon-button>
</template>
</app-toolbar>
<template is="dom-if" if="[[_computeShowStateInfo(stateObj)]]" restamp="">
<state-card-content
state-obj="[[stateObj]]"
hass="[[hass]]"
in-dialog=""
></state-card-content>
</template>
<paper-dialog-scrollable dialog-element="[[dialogElement]]">
<template
is="dom-if"
if="[[_computeShowHistoryComponent(hass, stateObj)]]"
restamp=""
>
<ha-state-history-data
hass="[[hass]]"
filter-type="recent-entity"
entity-id="[[stateObj.entity_id]]"
data="{{_stateHistory}}"
is-loading="{{_stateHistoryLoading}}"
cache-config="[[_cacheConfig]]"
></ha-state-history-data>
<state-history-charts
hass="[[hass]]"
history-data="[[_stateHistory]]"
is-loading-data="[[_stateHistoryLoading]]"
up-to-now
></state-history-charts>
</template>
<more-info-content
state-obj="[[stateObj]]"
hass="[[hass]]"
></more-info-content>
<template
is="dom-if"
if="[[_computeShowRestored(stateObj)]]"
restamp=""
>
[[localize('ui.dialogs.more_info_control.restored.not_provided')]] <br />
[[localize('ui.dialogs.more_info_control.restored.remove_intro')]] <br />
<mwc-button class="warning" on-click="_removeEntity">[[localize('ui.dialogs.more_info_control.restored.remove_action')]]</mwc-buttom>
</template>
</paper-dialog-scrollable>
`;
}
static get properties() {
return {
hass: Object,
stateObj: {
type: Object,
observer: "_stateObjChanged",
},
dialogElement: Object,
registryEntry: Object,
domain: {
type: String,
reflectToAttribute: true,
computed: "_computeDomain(stateObj)",
},
_stateHistory: Object,
_stateHistoryLoading: Boolean,
large: {
type: Boolean,
value: false,
notify: true,
},
_cacheConfig: {
type: Object,
value: {
refresh: 60,
cacheKey: null,
hoursToShow: 24,
},
},
rtl: {
type: Boolean,
reflectToAttribute: true,
computed: "_computeRTL(hass)",
},
};
}
enlarge() {
this.large = !this.large;
}
_computeShowStateInfo(stateObj) {
return !stateObj || !DOMAINS_NO_INFO.includes(computeStateDomain(stateObj));
}
_computeShowRestored(stateObj) {
return stateObj && stateObj.attributes.restored;
}
_computeShowHistoryComponent(hass, stateObj) {
return (
hass &&
stateObj &&
isComponentLoaded(hass, "history") &&
!DOMAINS_MORE_INFO_NO_HISTORY.includes(computeStateDomain(stateObj))
);
}
_computeDomain(stateObj) {
return stateObj ? computeStateDomain(stateObj) : "";
}
_computeStateName(stateObj) {
return stateObj ? computeStateName(stateObj) : "";
}
_computeEdit(hass, stateObj) {
const domain = this._computeDomain(stateObj);
return (
stateObj &&
hass.user.is_admin &&
((EDITABLE_DOMAINS_WITH_ID.includes(domain) && stateObj.attributes.id) ||
EDITABLE_DOMAINS.includes(domain))
);
}
_stateObjChanged(newVal) {
if (!newVal) {
return;
}
if (this._cacheConfig.cacheKey !== `more_info.${newVal.entity_id}`) {
this._cacheConfig = {
...this._cacheConfig,
cacheKey: `more_info.${newVal.entity_id}`,
};
}
}
_removeEntity() {
showConfirmationDialog(this, {
title: this.localize(
"ui.dialogs.more_info_control.restored.confirm_remove_title"
),
text: this.localize(
"ui.dialogs.more_info_control.restored.confirm_remove_text"
),
confirmText: this.localize("ui.common.yes"),
dismissText: this.localize("ui.common.no"),
confirm: () =>
removeEntityRegistryEntry(this.hass, this.stateObj.entity_id),
});
}
_gotoSettings() {
showEntityEditorDialog(this, {
entity_id: this.stateObj.entity_id,
});
this.fire("hass-more-info", { entityId: null });
}
_gotoEdit() {
const domain = this._computeDomain(this.stateObj);
navigate(
this,
`/config/${domain}/edit/${
EDITABLE_DOMAINS_WITH_ID.includes(domain)
? this.stateObj.attributes.id
: this.stateObj.entity_id
}`
);
this.fire("hass-more-info", { entityId: null });
}
_computeRTL(hass) {
return computeRTL(hass);
}
}
customElements.define("more-info-controls", MoreInfoControls);

View File

@ -5,8 +5,6 @@ import "../layouts/home-assistant";
import "../util/legacy-support";
setPassiveTouchGestures(true);
/* LastPass createElement workaround. See #428 */
document.createElement = Document.prototype.createElement;
(window as any).frontendVersion = __VERSION__;

View File

@ -74,7 +74,7 @@ export const demoPanels: Panels = {
},
// config: {
// component_name: "config",
// icon: "hass:settings",
// icon: "hass:cog",
// title: "config",
// config: null,
// url_path: "config",

View File

@ -12,29 +12,56 @@ import "./hass-subpage";
@customElement("hass-error-screen")
class HassErrorScreen extends LitElement {
@property()
public error?: string;
@property({ type: Boolean }) public toolbar = true;
@property() public error?: string;
protected render(): TemplateResult {
return html`
<hass-subpage>
<div class="content">
<h3>${this.error}</h3>
<slot>
<mwc-button @click=${this._backTapped}>go back</mwc-button>
</slot>
</div>
</hass-subpage>
${this.toolbar
? html`<div class="toolbar">
<ha-icon-button-arrow-prev
@click=${this._handleBack}
></ha-icon-button-arrow-prev>
</div>`
: ""}
<div class="content">
<h3>${this.error}</h3>
<slot>
<mwc-button @click=${this._handleBack}>go back</mwc-button>
</slot>
</div>
`;
}
private _backTapped(): void {
private _handleBack(): void {
history.back();
}
static get styles(): CSSResultArray {
return [
css`
:host {
display: block;
height: 100%;
background-color: var(--primary-background-color);
}
.toolbar {
display: flex;
align-items: center;
font-size: 20px;
height: 65px;
padding: 0 16px;
pointer-events: none;
background-color: var(--app-header-background-color);
font-weight: 400;
color: var(--app-header-text-color, white);
border-bottom: var(--app-header-border-bottom, none);
box-sizing: border-box;
}
ha-icon-button-arrow-prev {
pointer-events: auto;
}
.content {
height: calc(100% - 64px);
display: flex;

View File

@ -16,7 +16,10 @@ import { HomeAssistant } from "../types";
@customElement("hass-loading-screen")
class HassLoadingScreen extends LitElement {
@property({ type: Boolean }) public rootnav? = false;
@property({ type: Boolean, attribute: "no-toolbar" })
public noToolbar = false;
@property({ type: Boolean }) public rootnav = false;
@property() public hass?: HomeAssistant;
@ -24,20 +27,22 @@ class HassLoadingScreen extends LitElement {
protected render(): TemplateResult {
return html`
<app-toolbar>
${this.rootnav
? html`
<ha-menu-button
.hass=${this.hass}
.narrow=${this.narrow}
></ha-menu-button>
`
: html`
<ha-icon-button-arrow-prev
@click=${this._handleBack}
></ha-icon-button-arrow-prev>
`}
</app-toolbar>
${this.noToolbar
? ""
: html`<div class="toolbar">
${this.rootnav
? html`
<ha-menu-button
.hass=${this.hass}
.narrow=${this.narrow}
></ha-menu-button>
`
: html`
<ha-icon-button-arrow-prev
@click=${this._handleBack}
></ha-icon-button-arrow-prev>
`}
</div>`}
<div class="content">
<ha-circular-progress active></ha-circular-progress>
</div>
@ -57,6 +62,23 @@ class HassLoadingScreen extends LitElement {
height: 100%;
background-color: var(--primary-background-color);
}
.toolbar {
display: flex;
align-items: center;
font-size: 20px;
height: 65px;
padding: 0 16px;
pointer-events: none;
background-color: var(--app-header-background-color);
font-weight: 400;
color: var(--app-header-text-color, white);
border-bottom: var(--app-header-border-bottom, none);
box-sizing: border-box;
}
ha-menu-button,
ha-icon-button-arrow-prev {
pointer-events: auto;
}
.content {
height: calc(100% - 64px);
display: flex;

View File

@ -169,9 +169,9 @@ export class HassRouterPage extends UpdatingElement {
}
// Show error screen
const errorEl = document.createElement("hass-error-screen");
errorEl.error = `Error while loading page ${newPage}.`;
this.appendChild(errorEl);
this.appendChild(
this.createErrorScreen(`Error while loading page ${newPage}.`)
);
});
// If we don't show loading screen, just show the panel.
@ -252,6 +252,12 @@ export class HassRouterPage extends UpdatingElement {
return document.createElement("hass-loading-screen");
}
protected createErrorScreen(error: string) {
const errorEl = document.createElement("hass-error-screen");
errorEl.error = error;
return errorEl;
}
/**
* Rebuild the current panel.
*

View File

@ -36,7 +36,7 @@ class HassSubpage extends LitElement {
class=${classMap({ hidden: !this.showBackButton })}
></ha-icon-button-arrow-prev>
<div main-title>${this.header}</div>
<div class="main-title">${this.header}</div>
<slot name="toolbar-icon"></slot>
</div>
<div class="content" @scroll=${this._saveScrollPos}><slot></slot></div>
@ -74,7 +74,6 @@ class HassSubpage extends LitElement {
box-sizing: border-box;
}
ha-menu-button,
ha-icon-button-arrow-prev,
::slotted([slot="toolbar-icon"]) {
pointer-events: auto;
@ -84,7 +83,7 @@ class HassSubpage extends LitElement {
visibility: hidden;
}
[main-title] {
.main-title {
margin: 0 0 0 24px;
line-height: 20px;
flex-grow: 1;

View File

@ -20,6 +20,7 @@ import type {
import type { HomeAssistant, Route } from "../types";
import "./hass-tabs-subpage";
import type { PageNavigation } from "./hass-tabs-subpage";
import { computeRTLDirection } from "../common/util/compute_rtl";
@customElement("hass-tabs-subpage-data-table")
export class HaTabsSubpageDataTable extends LitElement {
@ -126,6 +127,9 @@ export class HaTabsSubpageDataTable extends LitElement {
no-label-float
no-underline
@value-changed=${this._handleSearchChange}
.label=${this.hass.localize(
"ui.components.data-table.search"
)}
></search-input>
${this.activeFilters
? html`<div class="active-filters">
@ -158,6 +162,7 @@ export class HaTabsSubpageDataTable extends LitElement {
.hasFab=${this.hasFab}
.id=${this.id}
.noDataText=${this.noDataText}
.dir=${computeRTLDirection(this.hass)}
>
${!this.narrow
? html`
@ -170,6 +175,9 @@ export class HaTabsSubpageDataTable extends LitElement {
no-label-float
no-underline
@value-changed=${this._handleSearchChange}
.label=${this.hass.localize(
"ui.components.data-table.search"
)}
>
</search-input>
${this.activeFilters
@ -234,7 +242,6 @@ export class HaTabsSubpageDataTable extends LitElement {
}
search-input.header {
left: -8px;
top: -7px;
}
.active-filters {
color: var(--primary-text-color);

View File

@ -240,7 +240,7 @@ class HassTabsSubpage extends LitElement {
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
max-height: 40px;
max-height: 58px;
line-height: 20px;
}

View File

@ -1,33 +0,0 @@
import {
css,
CSSResult,
customElement,
html,
LitElement,
TemplateResult,
} from "lit-element";
import "../components/ha-circular-progress";
@customElement("loading-screen")
class LoadingScreen extends LitElement {
protected render(): TemplateResult {
return html` <ha-circular-progress active></ha-circular-progress> `;
}
static get styles(): CSSResult {
return css`
:host {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
`;
}
}
declare global {
interface HTMLElementTagNameMap {
"loading-screen": LoadingScreen;
}
}

View File

@ -1,6 +1,4 @@
import "@material/mwc-button";
import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
import "@polymer/paper-input/paper-input";
import {
css,
CSSResult,
@ -14,7 +12,7 @@ import { ifDefined } from "lit-html/directives/if-defined";
import memoizeOne from "memoize-one";
import { isComponentLoaded } from "../../../common/config/is_component_loaded";
import { computeStateName } from "../../../common/entity/compute_state_name";
import "../../../components/dialog/ha-paper-dialog";
import "../../../components/ha-card";
import {
AreaRegistryEntry,
deleteAreaRegistryEntry,
@ -106,7 +104,7 @@ class HaConfigAreaPage extends LitElement {
<ha-icon-button
slot="toolbar-icon"
icon="hass:settings"
icon="hass:cog"
.entry=${area}
@click=${this._showSettings}
></ha-icon-button>

View File

@ -38,6 +38,7 @@ import {
showAreaRegistryDetailDialog,
} from "./show-dialog-area-registry-detail";
import { mdiPlus } from "@mdi/js";
import { computeRTL } from "../../../common/util/compute_rtl";
@customElement("ha-config-areas-dashboard")
export class HaConfigAreasDashboard extends LitElement {
@ -126,6 +127,7 @@ export class HaConfigAreasDashboard extends LitElement {
<mwc-fab
?is-wide=${this.isWide}
?narrow=${this.narrow}
?rtl=${computeRTL(this.hass!)}
title="${this.hass.localize(
"ui.panel.config.areas.picker.create_area"
)}"
@ -194,15 +196,14 @@ export class HaConfigAreasDashboard extends LitElement {
mwc-fab[narrow] {
bottom: 84px;
}
mwc-fab.rtl {
mwc-fab[rtl] {
right: auto;
left: 16px;
}
mwc-fab[is-wide].rtl {
mwc-fab[is-wide][rtl] {
bottom: 24px;
right: auto;
left: 24px;
right: auto;
}
`;
}

View File

@ -1,5 +1,6 @@
import "@polymer/app-layout/app-header/app-header";
import "@polymer/app-layout/app-toolbar/app-toolbar";
import "@polymer/paper-dropdown-menu/paper-dropdown-menu-light";
import "@polymer/paper-input/paper-textarea";
import "../../../components/ha-icon-button";
import {
@ -43,6 +44,10 @@ import "./condition/ha-automation-condition";
import "./trigger/ha-automation-trigger";
import { HaDeviceTrigger } from "./trigger/types/ha-automation-trigger-device";
import { mdiContentSave } from "@mdi/js";
import { PaperListboxElement } from "@polymer/paper-listbox";
const MODES = ["parallel", "single", "restart", "queued"];
const MODES_MAX = ["queued", "parallel"];
export class HaAutomationEditor extends LitElement {
@property() public hass!: HomeAssistant;
@ -129,6 +134,57 @@ export class HaAutomationEditor extends LitElement {
.value=${this._config.description}
@value-changed=${this._valueChanged}
></paper-textarea>
<p>
${this.hass.localize(
"ui.panel.config.automation.editor.modes.description",
"documentation_link",
html`<a
href="https://www.home-assistant.io/docs/automation/#automation-modes"
target="_blank"
rel="noreferrer"
>${this.hass.localize(
"ui.panel.config.automation.editor.modes.documentation"
)}</a
>`
)}
</p>
<paper-dropdown-menu-light
.label=${this.hass.localize(
"ui.panel.config.automation.editor.modes.label"
)}
no-animations
>
<paper-listbox
slot="dropdown-content"
.selected=${this._config.mode
? MODES.indexOf(this._config.mode)
: 0}
@iron-select=${this._modeChanged}
>
${MODES.map(
(mode) => html`
<paper-item .mode=${mode}>
${this.hass.localize(
`ui.panel.config.automation.editor.modes.${mode}`
) || mode}
</paper-item>
`
)}
</paper-listbox>
</paper-dropdown-menu-light>
${this._config.mode &&
MODES_MAX.includes(this._config.mode)
? html` <paper-input
.label=${this.hass.localize(
`ui.panel.config.automation.editor.max.${this._config.mode}`
)}
type="number"
name="max"
.value=${this._config.max || "10"}
@value-changed=${this._valueChanged}
>
</paper-input>`
: html``}
</div>
${stateObj
? html`
@ -343,14 +399,28 @@ export class HaAutomationEditor extends LitElement {
this._entityId = automation?.entity_id;
}
private _modeChanged(ev: CustomEvent) {
const mode = ((ev.target as PaperListboxElement)?.selectedItem as any)
?.mode;
this._config = { ...this._config!, mode };
if (!MODES_MAX.includes(mode)) {
delete this._config.max;
}
this._dirty = true;
}
private _valueChanged(ev: CustomEvent) {
ev.stopPropagation();
const name = (ev.target as any)?.name;
const target = ev.target as any;
const name = target.name;
if (!name) {
return;
}
const newVal = ev.detail.value;
let newVal = ev.detail.value;
if (target.type === "number") {
newVal = Number(newVal);
}
if ((this._config![name] || "") === newVal) {
return;
}
@ -453,6 +523,9 @@ export class HaAutomationEditor extends LitElement {
span[slot="introduction"] a {
color: var(--primary-color);
}
p {
margin-bottom: 0;
}
ha-entity-toggle {
margin-right: 8px;
}

View File

@ -10,6 +10,7 @@ import { fetchCloudSubscriptionInfo } from "../../../../data/cloud";
import "../../../../layouts/hass-subpage";
import { EventsMixin } from "../../../../mixins/events-mixin";
import LocalizeMixin from "../../../../mixins/localize-mixin";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
import "../../../../styles/polymer-ha-style";
import "../../ha-config-section";
import "./cloud-alexa-pref";
@ -33,7 +34,6 @@ class CloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
}
.content {
padding-bottom: 24px;
direction: ltr;
}
.account-row {
display: flex;
@ -132,21 +132,25 @@ class CloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
<cloud-remote-pref
hass="[[hass]]"
cloud-status="[[cloudStatus]]"
dir="[[_rtlDirection]]"
></cloud-remote-pref>
<cloud-alexa-pref
hass="[[hass]]"
cloud-status="[[cloudStatus]]"
dir="[[_rtlDirection]]"
></cloud-alexa-pref>
<cloud-google-pref
hass="[[hass]]"
cloud-status="[[cloudStatus]]"
dir="[[_rtlDirection]]"
></cloud-google-pref>
<cloud-webhooks
hass="[[hass]]"
cloud-status="[[cloudStatus]]"
dir="[[_rtlDirection]]"
></cloud-webhooks>
</ha-config-section>
</div>
@ -163,6 +167,10 @@ class CloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
type: Object,
value: null,
},
_rtlDirection: {
type: Boolean,
computed: "_computeRTLDirection(hass)",
},
};
}
@ -215,6 +223,10 @@ class CloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
return description;
}
_computeRTLDirection(hass) {
return computeRTLDirection(hass);
}
}
customElements.define("cloud-account", CloudAccount);

View File

@ -167,6 +167,10 @@ export class CloudAlexaPref extends LitElement {
right: 24px;
top: 32px;
}
:host([dir="rtl"]) .switch {
right: auto;
left: 24px;
}
.card-actions {
display: flex;
}

View File

@ -205,6 +205,10 @@ export class CloudGooglePref extends LitElement {
right: 24px;
top: 32px;
}
:host([dir="rtl"]) .switch {
right: auto;
left: 24px;
}
ha-call-api-button {
color: var(--primary-color);
font-weight: 500;

View File

@ -150,6 +150,10 @@ export class CloudRemotePref extends LitElement {
right: 24px;
top: 32px;
}
:host([dir="rtl"]) .switch {
right: auto;
left: 24px;
}
.card-actions {
display: flex;
}

View File

@ -34,6 +34,7 @@ import "../../../../layouts/hass-loading-screen";
import "../../../../layouts/hass-subpage";
import type { HomeAssistant } from "../../../../types";
import "../../../../components/ha-formfield";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
const DEFAULT_CONFIG_EXPOSE = true;
const IGNORE_INTERFACES = ["Alexa.EndpointHealth"];
@ -132,6 +133,7 @@ class CloudAlexa extends LitElement {
.label=${this.hass!.localize(
"ui.panel.config.cloud.alexa.expose"
)}
.dir=${computeRTLDirection(this.hass!)}
>
<ha-switch
.entityId=${entity.entity_id}
@ -321,7 +323,7 @@ class CloudAlexa extends LitElement {
color: var(--primary-text-color);
background-color: var(
--ha-card-background,
var(--paper-card-background-color, white)
var(--card-background-color, white)
);
padding: 16px 8px;
text-align: center;

View File

@ -19,7 +19,6 @@ class CloudForgotPassword extends LocalizeMixin(EventsMixin(PolymerElement)) {
<style include="iron-flex ha-style">
.content {
padding-bottom: 24px;
direction: ltr;
}
ha-card {
@ -126,8 +125,9 @@ class CloudForgotPassword extends LocalizeMixin(EventsMixin(PolymerElement)) {
() => {
this._requestInProgress = false;
this.fire("cloud-done", {
flashMessage:
"[[localize('ui.panel.config.cloud.forgot_password.check_your_email')]]",
flashMessage: this.hass.localize(
"ui.panel.config.cloud.forgot_password.check_your_email"
),
});
},
(err) =>

View File

@ -39,6 +39,7 @@ import "../../../../layouts/hass-subpage";
import type { HomeAssistant } from "../../../../types";
import { showToast } from "../../../../util/toast";
import "../../../../components/ha-formfield";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
const DEFAULT_CONFIG_EXPOSE = true;
@ -83,6 +84,7 @@ class CloudGoogleAssistant extends LitElement {
const filterFunc = this._getEntityFilterFunc(
this.cloudStatus.google_entities
);
const dir = computeRTLDirection(this.hass!);
// We will only generate `isInitialExposed` during first render.
// On each subsequent render we will use the same set so that cards
@ -128,32 +130,38 @@ class CloudGoogleAssistant extends LitElement {
.map((trait) => trait.substr(trait.lastIndexOf(".") + 1))
.join(", ")}
</state-info>
<ha-formfield
.label=${this.hass!.localize(
"ui.panel.config.cloud.google.expose"
)}
>
<ha-switch
.entityId=${entity.entity_id}
.disabled=${!emptyFilter}
.checked=${isExposed}
@change=${this._exposeChanged}
<div>
<ha-formfield
.label=${this.hass!.localize(
"ui.panel.config.cloud.google.expose"
)}
.dir=${dir}
>
</ha-switch>
</ha-formfield>
<ha-switch
.entityId=${entity.entity_id}
.disabled=${!emptyFilter}
.checked=${isExposed}
@change=${this._exposeChanged}
>
</ha-switch>
</ha-formfield>
</div>
${entity.might_2fa
? html`
<ha-formfield
.label=${this.hass!.localize(
"ui.panel.config.cloud.google.disable_2FA"
)}
>
<ha-switch
.entityId=${entity.entity_id}
.checked=${Boolean(config.disable_2fa)}
@change=${this._disable2FAChanged}
></ha-switch>
</ha-formfield>
<div>
<ha-formfield
.label=${this.hass!.localize(
"ui.panel.config.cloud.google.disable_2FA"
)}
.dir=${dir}
>
<ha-switch
.entityId=${entity.entity_id}
.checked=${Boolean(config.disable_2fa)}
@change=${this._disable2FAChanged}
></ha-switch>
</ha-formfield>
</div>
`
: ""}
</div>
@ -353,7 +361,7 @@ class CloudGoogleAssistant extends LitElement {
color: var(--primary-text-color);
background-color: var(
--ha-card-background,
var(--paper-card-background-color, white)
var(--card-background-color, white)
);
padding: 16px 8px;
text-align: center;
@ -377,9 +385,6 @@ class CloudGoogleAssistant extends LitElement {
state-info {
cursor: pointer;
}
ha-formfield {
display: block;
}
ha-switch {
padding: 8px 0;
}

View File

@ -16,6 +16,7 @@ import LocalizeMixin from "../../../../mixins/localize-mixin";
import NavigateMixin from "../../../../mixins/navigate-mixin";
import "../../../../styles/polymer-ha-style";
import "../../ha-config-section";
import { computeRTL } from "../../../../common/util/compute_rtl";
/*
* @appliesMixin NavigateMixin
@ -30,7 +31,6 @@ class CloudLogin extends LocalizeMixin(
<style include="iron-flex ha-style">
.content {
padding-bottom: 24px;
direction: ltr;
}
[slot="introduction"] {
margin: -1em 0;
@ -67,10 +67,14 @@ class CloudLogin extends LocalizeMixin(
}
.flash-msg ha-icon-button {
position: absolute;
top: 8px;
top: 4px;
right: 8px;
color: var(--secondary-text-color);
}
:host([rtl]) .flash-msg ha-icon-button {
right: auto;
left: 8px;
}
</style>
<hass-subpage header="[[localize('ui.panel.config.cloud.caption')]]">
<div class="content">
@ -192,6 +196,11 @@ class CloudLogin extends LocalizeMixin(
type: String,
notify: true,
},
rtl: {
type: Boolean,
reflectToAttribute: true,
computed: "_computeRTL(hass)",
},
_error: String,
};
}
@ -307,6 +316,10 @@ class CloudLogin extends LocalizeMixin(
this.flashMessage = "";
}, 200);
}
_computeRTL(hass) {
return computeRTL(hass);
}
}
customElements.define("cloud-login", CloudLogin);

View File

@ -18,10 +18,6 @@ class CloudRegister extends LocalizeMixin(EventsMixin(PolymerElement)) {
static get template() {
return html`
<style include="iron-flex ha-style">
.content {
direction: ltr;
}
[slot=introduction] {
margin: -1em 0;
}

View File

@ -23,6 +23,7 @@ import { HomeAssistant } from "../../../../../../types";
import "./mqtt-discovery-payload";
import "./mqtt-messages";
import { MQTTDeviceDebugInfoDialogParams } from "./show-dialog-mqtt-device-debug-info";
import { computeRTLDirection } from "../../../../../../common/util/compute_rtl";
@customElement("dialog-mqtt-device-debug-info")
class DialogMQTTDeviceDebugInfo extends LitElement {
@ -50,6 +51,8 @@ class DialogMQTTDeviceDebugInfo extends LitElement {
return html``;
}
const dir = computeRTLDirection(this.hass!);
return html`
<ha-dialog
open
@ -65,28 +68,34 @@ class DialogMQTTDeviceDebugInfo extends LitElement {
"ui.dialogs.mqtt_device_debug_info.payload_display"
)}
</h4>
<ha-formfield
.label=${this.hass!.localize(
"ui.dialogs.mqtt_device_debug_info.deserialize"
)}
>
<ha-switch
.checked=${this._showDeserialized}
@change=${this._showDeserializedChanged}
<div>
<ha-formfield
.label=${this.hass!.localize(
"ui.dialogs.mqtt_device_debug_info.deserialize"
)}
.dir=${dir}
>
</ha-switch>
</ha-formfield>
<ha-formfield
.label=${this.hass!.localize(
"ui.dialogs.mqtt_device_debug_info.show_as_yaml"
)}
>
<ha-switch
.checked=${this._showAsYaml}
@change=${this._showAsYamlChanged}
<ha-switch
.checked=${this._showDeserialized}
@change=${this._showDeserializedChanged}
>
</ha-switch>
</ha-formfield>
</div>
<div>
<ha-formfield
.label=${this.hass!.localize(
"ui.dialogs.mqtt_device_debug_info.show_as_yaml"
)}
.dir=${dir}
>
</ha-switch>
</ha-formfield>
<ha-switch
.checked=${this._showAsYaml}
@change=${this._showAsYamlChanged}
>
</ha-switch>
</ha-formfield>
</div>
<h4>
${this.hass!.localize("ui.dialogs.mqtt_device_debug_info.entities")}
</h4>
@ -232,9 +241,6 @@ class DialogMQTTDeviceDebugInfo extends LitElement {
.triggerlistitem {
margin-bottom: 12px;
}
ha-formfield {
display: block;
}
`,
];
}

View File

@ -14,7 +14,7 @@ import { isComponentLoaded } from "../../../common/config/is_component_loaded";
import { computeStateName } from "../../../common/entity/compute_state_name";
import { createValidEntityId } from "../../../common/entity/valid_entity_id";
import { compare } from "../../../common/string/compare";
import "../../../components/entity/ha-state-icon";
import "../../../components/entity/ha-battery-icon";
import "../../../components/ha-icon-next";
import { AreaRegistryEntry } from "../../../data/area_registry";
import { ConfigEntry } from "../../../data/config_entries";
@ -26,6 +26,7 @@ import {
import {
EntityRegistryEntry,
findBatteryEntity,
findBatteryChargingEntity,
updateEntityRegistryEntry,
} from "../../../data/entity_registry";
import { SceneEntities, showSceneEditor } from "../../../data/scene";
@ -117,6 +118,11 @@ export class HaConfigDevicePage extends LitElement {
| EntityRegistryEntry
| undefined => findBatteryEntity(this.hass, entities));
private _batteryChargingEntity = memoizeOne(
(entities: EntityRegistryEntry[]): EntityRegistryEntry | undefined =>
findBatteryChargingEntity(this.hass, entities)
);
protected firstUpdated(changedProps) {
super.firstUpdated(changedProps);
loadDeviceRegistryDetailDialog();
@ -145,9 +151,13 @@ export class HaConfigDevicePage extends LitElement {
const integrations = this._integrations(device, this.entries);
const entities = this._entities(this.deviceId, this.entities);
const batteryEntity = this._batteryEntity(entities);
const batteryChargingEntity = this._batteryChargingEntity(entities);
const batteryState = batteryEntity
? this.hass.states[batteryEntity.entity_id]
: undefined;
const batteryChargingState = batteryChargingEntity
? this.hass.states[batteryChargingEntity.entity_id]
: undefined;
const area = this._computeArea(this.areas, device);
return html`
@ -169,7 +179,7 @@ export class HaConfigDevicePage extends LitElement {
<ha-icon-button
slot="toolbar-icon"
icon="hass:settings"
icon="hass:cog"
@click=${this._showSettings}
></ha-icon-button>
@ -201,10 +211,11 @@ export class HaConfigDevicePage extends LitElement {
? html`
<div class="battery">
${batteryState.state}%
<ha-state-icon
<ha-battery-icon
.hass=${this.hass!}
.stateObj=${batteryState}
></ha-state-icon>
.batteryStateObj=${batteryState}
.batteryChargingStateObj=${batteryChargingState}
></ha-battery-icon>
</div>
`
: ""

View File

@ -14,7 +14,7 @@ import {
DataTableRowData,
RowClickedEvent,
} from "../../../components/data-table/ha-data-table";
import "../../../components/entity/ha-state-icon";
import "../../../components/entity/ha-battery-icon";
import { AreaRegistryEntry } from "../../../data/area_registry";
import { ConfigEntry } from "../../../data/config_entries";
import {
@ -25,6 +25,7 @@ import {
import {
EntityRegistryEntry,
findBatteryEntity,
findBatteryChargingEntity,
} from "../../../data/entity_registry";
import { domainToName } from "../../../data/integration";
import "../../../layouts/hass-tabs-subpage-data-table";
@ -35,7 +36,7 @@ interface DeviceRowData extends DeviceRegistryEntry {
device?: DeviceRowData;
area?: string;
integration?: string;
battery_entity?: string;
battery_entity?: [string | undefined, string | undefined];
}
@customElement("ha-config-devices-dashboard")
@ -167,7 +168,10 @@ export class HaConfigDeviceDashboard extends LitElement {
)
.join(", ")
: "No integration",
battery_entity: this._batteryEntity(device.id, deviceEntityLookup),
battery_entity: [
this._batteryEntity(device.id, deviceEntityLookup),
this._batteryChargingEntity(device.id, deviceEntityLookup),
],
};
});
@ -201,17 +205,25 @@ export class HaConfigDeviceDashboard extends LitElement {
sortable: true,
type: "numeric",
width: "90px",
template: (batteryEntity: string) => {
const battery = batteryEntity
? this.hass.states[batteryEntity]
: undefined;
template: (
batteryEntityPair: DeviceRowData["battery_entity"]
) => {
const battery =
batteryEntityPair && batteryEntityPair[0]
? this.hass.states[batteryEntityPair[0]]
: undefined;
const batteryCharging =
batteryEntityPair && batteryEntityPair[1]
? this.hass.states[batteryEntityPair[1]]
: undefined;
return battery
? html`
${isNaN(battery.state as any) ? "-" : battery.state}%
<ha-state-icon
<ha-battery-icon
.hass=${this.hass!}
.stateObj=${battery}
></ha-state-icon>
.batteryStateObj=${battery}
.batteryChargingStateObj=${batteryCharging}
></ha-battery-icon>
`
: html` - `;
},
@ -267,17 +279,25 @@ export class HaConfigDeviceDashboard extends LitElement {
type: "numeric",
width: "15%",
maxWidth: "90px",
template: (batteryEntity: string) => {
const battery = batteryEntity
? this.hass.states[batteryEntity]
: undefined;
template: (
batteryEntityPair: DeviceRowData["battery_entity"]
) => {
const battery =
batteryEntityPair && batteryEntityPair[0]
? this.hass.states[batteryEntityPair[0]]
: undefined;
const batteryCharging =
batteryEntityPair && batteryEntityPair[1]
? this.hass.states[batteryEntityPair[1]]
: undefined;
return battery && !isNaN(battery.state as any)
? html`
${battery.state}%
<ha-state-icon
<ha-battery-icon
.hass=${this.hass!}
.stateObj=${battery}
></ha-state-icon>
.batteryStateObj=${battery}
.batteryChargingStateObj=${batteryCharging}
></ha-battery-icon>
`
: html` - `;
},
@ -336,6 +356,17 @@ export class HaConfigDeviceDashboard extends LitElement {
return batteryEntity ? batteryEntity.entity_id : undefined;
}
private _batteryChargingEntity(
deviceId: string,
deviceEntityLookup: DeviceEntityLookup
): string | undefined {
const batteryChargingEntity = findBatteryChargingEntity(
this.hass,
deviceEntityLookup[deviceId] || []
);
return batteryChargingEntity ? batteryChargingEntity.entity_id : undefined;
}
private _handleRowClicked(ev: HASSDomEvent<RowClickedEvent>) {
const deviceId = ev.detail.id;
navigate(this, `/config/devices/device/${deviceId}`);

View File

@ -1,8 +1,6 @@
import "@polymer/app-layout/app-toolbar/app-toolbar";
import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
import "../../../components/ha-icon-button";
import "@polymer/paper-tabs/paper-tab";
import "@polymer/paper-tabs/paper-tabs";
import "@material/mwc-tab-bar";
import "@material/mwc-tab";
import "@material/mwc-icon-button";
import { HassEntity } from "home-assistant-js-websocket";
import {
css,
@ -11,27 +9,27 @@ import {
html,
LitElement,
property,
query,
TemplateResult,
} from "lit-element";
import { cache } from "lit-html/directives/cache";
import { dynamicElement } from "../../../common/dom/dynamic-element-directive";
import { fireEvent } from "../../../common/dom/fire_event";
import { dynamicElement } from "../../../common/dom/dynamic-element-directive";
import { computeStateName } from "../../../common/entity/compute_state_name";
import "../../../components/dialog/ha-paper-dialog";
import type { HaPaperDialog } from "../../../components/dialog/ha-paper-dialog";
import "../../../components/ha-dialog";
import "../../../components/ha-header-bar";
import "../../../components/ha-svg-icon";
import "../../../components/ha-related-items";
import {
EntityRegistryEntry,
ExtEntityRegistryEntry,
getExtendedEntityRegistryEntry,
} from "../../../data/entity_registry";
import type { PolymerChangedEvent } from "../../../polymer-types";
import { haStyleDialog } from "../../../resources/styles";
import type { HomeAssistant } from "../../../types";
import { PLATFORMS_WITH_SETTINGS_TAB } from "./const";
import "./entity-registry-settings";
import type { EntityRegistryDetailDialogParams } from "./show-dialog-entity-editor";
import { mdiClose, mdiTune } from "@mdi/js";
interface Tabs {
[key: string]: Tab;
@ -53,14 +51,12 @@ export class DialogEntityEditor extends LitElement {
| ExtEntityRegistryEntry
| null;
@property() private _curTab?: string;
@property() private _curTab = "tab-settings";
@property() private _extraTabs: Tabs = {};
@property() private _settingsElementTag?: string;
@query("ha-paper-dialog") private _dialog!: HaPaperDialog;
private _curTabIndex = 0;
public async showDialog(
@ -76,6 +72,7 @@ export class DialogEntityEditor extends LitElement {
public closeDialog(): void {
this._params = undefined;
fireEvent(this, "dialog-closed", { dialog: this.localName });
}
protected render(): TemplateResult {
@ -87,91 +84,108 @@ export class DialogEntityEditor extends LitElement {
const stateObj: HassEntity | undefined = this.hass.states[entityId];
return html`
<ha-paper-dialog
with-backdrop
opened
@opened-changed=${this._openedChanged}
<ha-dialog
open
.heading=${true}
hideActions
@closed=${this.closeDialog}
@close-dialog=${this.closeDialog}
>
<app-toolbar>
<ha-icon-button
aria-label=${this.hass.localize(
"ui.dialogs.entity_registry.dismiss"
)}
icon="hass:close"
dialog-dismiss
></ha-icon-button>
<div class="main-title" main-title>
${stateObj ? computeStateName(stateObj) : entry?.name || entityId}
</div>
${stateObj
? html`
<ha-icon-button
aria-label=${this.hass.localize(
"ui.dialogs.entity_registry.control"
)}
icon="hass:tune"
@click=${this._openMoreInfo}
></ha-icon-button>
`
: ""}
</app-toolbar>
<paper-tabs
scrollable
hide-scroll-buttons
.selected=${this._curTabIndex}
@selected-item-changed=${this._handleTabSelected}
>
<paper-tab id="tab-settings">
${this.hass.localize("ui.dialogs.entity_registry.settings")}
</paper-tab>
${Object.entries(this._extraTabs).map(
([key, tab]) => html`
<paper-tab id=${key}>
${this.hass.localize(tab.translationKey) || key}
</paper-tab>
`
)}
<paper-tab id="tab-related">
${this.hass.localize("ui.dialogs.entity_registry.related")}
</paper-tab>
</paper-tabs>
${cache(
this._curTab === "tab-settings"
? entry
? this._settingsElementTag
? html`
${dynamicElement(this._settingsElementTag, {
hass: this.hass,
entry,
entityId,
dialogElement: this._dialog,
})}
`
: ""
: html`
<paper-dialog-scrollable>
${this.hass.localize(
"ui.dialogs.entity_registry.no_unique_id"
<div slot="heading">
<ha-header-bar>
<mwc-icon-button
slot="navigationIcon"
.label=${this.hass.localize("ui.dialogs.entity_registry.dismiss")}
dialogAction="cancel"
>
<ha-svg-icon .path=${mdiClose}></ha-svg-icon>
</mwc-icon-button>
<span slot="title">
${stateObj ? computeStateName(stateObj) : entry?.name || entityId}
</span>
${stateObj
? html`
<mwc-icon-button
slot="actionItems"
.label=${this.hass.localize(
"ui.dialogs.entity_registry.control"
)}
</paper-dialog-scrollable>
@click=${this._openMoreInfo}
>
<ha-svg-icon .path=${mdiTune}></ha-svg-icon>
</mwc-icon-button>
`
: this._curTab === "tab-related"
? html`
<paper-dialog-scrollable>
<ha-related-items
.hass=${this.hass}
.itemId=${entityId}
itemType="entity"
></ha-related-items>
</paper-dialog-scrollable>
: ""}
</ha-header-bar>
<mwc-tab-bar
.activeIndex=${this._curTabIndex}
@MDCTabBar:activated=${this._handleTabActivated}
@MDCTab:interacted=${this._handleTabInteracted}
>
<mwc-tab
id="tab-settings"
.label=${this.hass.localize(
"ui.dialogs.entity_registry.settings"
)}
>
</mwc-tab>
${Object.entries(this._extraTabs).map(
([key, tab]) => html`
<mwc-tab
id=${key}
.label=${this.hass.localize(tab.translationKey) || key}
>
</mwc-tab>
`
: html``
)}
</ha-paper-dialog>
)}
<mwc-tab
id="tab-related"
.label=${this.hass.localize("ui.dialogs.entity_registry.related")}
>
</mwc-tab>
</mwc-tab-bar>
</div>
<div class="wrapper">
${cache(this._renderTab())}
</div>
</ha-dialog>
`;
}
private _renderTab() {
switch (this._curTab) {
case "tab-settings":
if (this._entry) {
if (this._settingsElementTag) {
return html`
${dynamicElement(this._settingsElementTag, {
hass: this.hass,
entry: this._entry,
entityId: this._params!.entity_id,
})}
`;
}
return html``;
}
return html`
<div class="content">
${this.hass.localize("ui.dialogs.entity_registry.no_unique_id")}
</div>
`;
case "tab-related":
return html`
<ha-related-items
class="content"
.hass=${this.hass}
.itemId=${this._params!.entity_id}
itemType="entity"
></ha-related-items>
`;
default:
return html``;
}
}
private async _getEntityReg() {
try {
this._entry = await getExtendedEntityRegistryEntry(
@ -184,17 +198,12 @@ export class DialogEntityEditor extends LitElement {
}
}
private _handleTabSelected(ev: CustomEvent): void {
if (!ev.detail.value) {
return;
}
this._curTab = ev.detail.value.id;
this._resizeDialog();
private _handleTabActivated(ev: CustomEvent): void {
this._curTabIndex = ev.detail.index;
}
private async _resizeDialog(): Promise<void> {
await this.updateComplete;
fireEvent(this._dialog as HTMLElement, "iron-resize");
private _handleTabInteracted(ev: CustomEvent): void {
this._curTab = ev.detail.tabId;
}
private async _loadPlatformSettingTabs(): Promise<void> {
@ -219,76 +228,42 @@ export class DialogEntityEditor extends LitElement {
this.closeDialog();
}
private _openedChanged(ev: PolymerChangedEvent<boolean>): void {
if (!(ev.detail as any).value) {
this._params = undefined;
}
}
static get styles(): CSSResult[] {
return [
haStyleDialog,
css`
app-toolbar {
color: var(--primary-text-color);
background-color: var(--secondary-background-color);
margin: 0;
padding: 0 16px;
ha-header-bar {
--mdc-theme-on-primary: var(--primary-text-color);
--mdc-theme-primary: var(--card-background-color);
flex-shrink: 0;
}
app-toolbar [main-title] {
/* Design guideline states 24px, changed to 16 to align with state info */
margin-left: 16px;
line-height: 1.3em;
max-height: 2.6em;
overflow: hidden;
/* webkit and blink still support simple multiline text-overflow */
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
mwc-tab-bar {
border-bottom: 1px solid
var(--mdc-dialog-scroll-divider-color, rgba(0, 0, 0, 0.12));
}
ha-dialog {
--dialog-content-padding: 0;
}
@media all and (min-width: 451px) and (min-height: 501px) {
.main-title {
pointer-events: auto;
cursor: default;
.wrapper {
width: 400px;
}
}
ha-paper-dialog {
width: 450px;
max-height: none !important;
.content {
display: block;
padding: 20px 24px;
}
/* overrule the ha-style-dialog max-height on small screens */
@media all and (max-width: 450px), all and (max-height: 500px) {
app-toolbar {
background-color: var(--app-header-background-color);
color: var(--app-header-text-color, white);
ha-header-bar {
--mdc-theme-primary: var(--app-header-background-color);
--mdc-theme-on-primary: var(--app-header-text-color, white);
}
ha-paper-dialog {
height: 100%;
max-height: 100% !important;
width: 100% !important;
border-radius: 0px;
position: fixed !important;
margin: 0;
}
ha-paper-dialog::before {
content: "";
position: fixed;
z-index: -1;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background-color: inherit;
}
}
paper-dialog-scrollable {
padding-bottom: 16px;
}
mwc-button.warning {
@ -299,15 +274,6 @@ export class DialogEntityEditor extends LitElement {
direction: rtl;
text-align: right;
}
:host {
--paper-font-title_-_white-space: normal;
}
paper-tabs {
--paper-tabs-selection-bar-color: var(--primary-color);
text-transform: uppercase;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
margin-top: 0;
}
`,
];
}

View File

@ -12,7 +12,6 @@ import {
import { isComponentLoaded } from "../../../../../common/config/is_component_loaded";
import { dynamicElement } from "../../../../../common/dom/dynamic-element-directive";
import { fireEvent } from "../../../../../common/dom/fire_event";
import { HaPaperDialog } from "../../../../../components/dialog/ha-paper-dialog";
import {
ExtEntityRegistryEntry,
removeEntityRegistryEntry,
@ -87,8 +86,6 @@ export class EntityRegistrySettingsHelper extends LitElement {
@property() public entry!: ExtEntityRegistryEntry;
@property() public dialogElement!: HaPaperDialog;
@property() private _error?: string;
@property() private _item?: Helper | null;
@ -120,32 +117,30 @@ export class EntityRegistrySettingsHelper extends LitElement {
}
const stateObj = this.hass.states[this.entry.entity_id];
return html`
<paper-dialog-scrollable .dialogElement=${this.dialogElement}>
${this._error ? html` <div class="error">${this._error}</div> ` : ""}
<div class="form">
${!this._componentLoaded
? this.hass.localize(
"ui.dialogs.helper_settings.platform_not_loaded",
"platform",
this.entry.platform
)
: this._item === null
? this.hass.localize("ui.dialogs.helper_settings.yaml_not_editable")
: html`
<div @value-changed=${this._valueChanged}>
${dynamicElement(`ha-${this.entry.platform}-form`, {
hass: this.hass,
item: this._item,
entry: this.entry,
})}
</div>
`}
<ha-registry-basic-editor
.hass=${this.hass}
.entry=${this.entry}
></ha-registry-basic-editor>
</div>
</paper-dialog-scrollable>
${this._error ? html` <div class="error">${this._error}</div> ` : ""}
<div class="form">
${!this._componentLoaded
? this.hass.localize(
"ui.dialogs.helper_settings.platform_not_loaded",
"platform",
this.entry.platform
)
: this._item === null
? this.hass.localize("ui.dialogs.helper_settings.yaml_not_editable")
: html`
<span @value-changed=${this._valueChanged}>
${dynamicElement(`ha-${this.entry.platform}-form`, {
hass: this.hass,
item: this._item,
entry: this.entry,
})}
</span>
`}
<ha-registry-basic-editor
.hass=${this.hass}
.entry=${this.entry}
></ha-registry-basic-editor>
</div>
<div class="buttons">
<mwc-button
class="warning"
@ -173,8 +168,6 @@ export class EntityRegistrySettingsHelper extends LitElement {
private async _getItem() {
const items = await HELPERS[this.entry.platform].fetch(this.hass!);
this._item = items.find((item) => item.id === this.entry.unique_id) || null;
await this.updateComplete;
fireEvent(this.dialogElement as HTMLElement, "iron-resize");
}
private async _updateItem(): Promise<void> {
@ -232,7 +225,7 @@ export class EntityRegistrySettingsHelper extends LitElement {
padding: 0 !important;
}
.form {
padding-bottom: 24px;
padding: 20px 24px;
}
.buttons {
display: flex;

View File

@ -33,8 +33,6 @@ export class EntityRegistrySettings extends LitElement {
@property() public entry!: ExtEntityRegistryEntry;
@property() public dialogElement!: HTMLElement;
@property() private _name!: string;
@property() private _icon!: string;
@ -72,82 +70,76 @@ export class EntityRegistrySettings extends LitElement {
computeDomain(this._entityId.trim()) !==
computeDomain(this.entry.entity_id);
return html`
<paper-dialog-scrollable .dialogElement=${this.dialogElement}>
${!stateObj
? html`
<div>
${this.hass!.localize(
"ui.dialogs.entity_registry.editor.unavailable"
)}
</div>
`
: ""}
${this._error ? html` <div class="error">${this._error}</div> ` : ""}
<div class="form">
<paper-input
.value=${this._name}
@value-changed=${this._nameChanged}
.label=${this.hass.localize(
"ui.dialogs.entity_registry.editor.name"
)}
.placeholder=${this.entry.original_name}
.disabled=${this._submitting}
></paper-input>
<ha-icon-input
.value=${this._icon}
@value-changed=${this._iconChanged}
.label=${this.hass.localize(
"ui.dialogs.entity_registry.editor.icon"
)}
.placeholder=${this.entry.original_icon}
.disabled=${this._submitting}
.errorMessage=${this.hass.localize(
"ui.dialogs.entity_registry.editor.icon_error"
)}
></ha-icon-input>
<paper-input
.value=${this._entityId}
@value-changed=${this._entityIdChanged}
.label=${this.hass.localize(
"ui.dialogs.entity_registry.editor.entity_id"
)}
error-message="Domain needs to stay the same"
.invalid=${invalidDomainUpdate}
.disabled=${this._submitting}
></paper-input>
<div class="row">
<ha-switch
.checked=${!this._disabledBy}
@change=${this._disabledByChanged}
>
</ha-switch>
${!stateObj
? html`
<div>
<div>
${this.hass.localize(
"ui.dialogs.entity_registry.editor.enabled_label"
)}
</div>
<div class="secondary">
${this._disabledBy && this._disabledBy !== "user"
? this.hass.localize(
"ui.dialogs.entity_registry.editor.enabled_cause",
"cause",
this.hass.localize(
`config_entry.disabled_by.${this._disabledBy}`
)
${this.hass!.localize(
"ui.dialogs.entity_registry.editor.unavailable"
)}
</div>
`
: ""}
${this._error ? html` <div class="error">${this._error}</div> ` : ""}
<div class="form">
<paper-input
.value=${this._name}
@value-changed=${this._nameChanged}
.label=${this.hass.localize("ui.dialogs.entity_registry.editor.name")}
.placeholder=${this.entry.original_name}
.disabled=${this._submitting}
></paper-input>
<ha-icon-input
.value=${this._icon}
@value-changed=${this._iconChanged}
.label=${this.hass.localize("ui.dialogs.entity_registry.editor.icon")}
.placeholder=${this.entry.original_icon}
.disabled=${this._submitting}
.errorMessage=${this.hass.localize(
"ui.dialogs.entity_registry.editor.icon_error"
)}
></ha-icon-input>
<paper-input
.value=${this._entityId}
@value-changed=${this._entityIdChanged}
.label=${this.hass.localize(
"ui.dialogs.entity_registry.editor.entity_id"
)}
error-message="Domain needs to stay the same"
.invalid=${invalidDomainUpdate}
.disabled=${this._submitting}
></paper-input>
<div class="row">
<ha-switch
.checked=${!this._disabledBy}
@change=${this._disabledByChanged}
>
</ha-switch>
<div>
<div>
${this.hass.localize(
"ui.dialogs.entity_registry.editor.enabled_label"
)}
</div>
<div class="secondary">
${this._disabledBy && this._disabledBy !== "user"
? this.hass.localize(
"ui.dialogs.entity_registry.editor.enabled_cause",
"cause",
this.hass.localize(
`config_entry.disabled_by.${this._disabledBy}`
)
: ""}
${this.hass.localize(
"ui.dialogs.entity_registry.editor.enabled_description"
)}
<br />${this.hass.localize(
"ui.dialogs.entity_registry.editor.note"
)}
</div>
)
: ""}
${this.hass.localize(
"ui.dialogs.entity_registry.editor.enabled_description"
)}
<br />${this.hass.localize(
"ui.dialogs.entity_registry.editor.note"
)}
</div>
</div>
</div>
</paper-dialog-scrollable>
</div>
<div class="buttons">
<mwc-button
class="warning"
@ -237,7 +229,7 @@ export class EntityRegistrySettings extends LitElement {
padding: 0 !important;
}
.form {
padding-bottom: 24px;
padding: 20px 24px;
}
.buttons {
display: flex;

View File

@ -422,6 +422,9 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) {
no-underline
@value-changed=${this._handleSearchChange}
.filter=${this._filter}
.label=${this.hass.localize(
"ui.panel.config.entities.picker.search"
)}
></search-input
>${activeFilters
? html`<div class="active-filters">
@ -765,8 +768,9 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) {
justify-content: space-between;
align-items: center;
color: var(--secondary-text-color);
position: relative;
top: -8px;
}
.search-toolbar ha-button-menu {
position: static;
}
.selected-txt {
font-weight: bold;

View File

@ -21,7 +21,7 @@ import {
mdiViewDashboard,
mdiAccount,
mdiMapMarkerRadius,
mdiAccountBadgeHorizontal,
mdiBadgeAccountHorizontal,
mdiHomeAssistant,
mdiServer,
mdiInformation,
@ -119,7 +119,7 @@ export const configSections: { [name: string]: PageNavigation[] } = {
component: "users",
path: "/config/users",
translationKey: "ui.panel.config.users.caption",
iconPath: mdiAccountBadgeHorizontal,
iconPath: mdiBadgeAccountHorizontal,
core: true,
},
],

View File

@ -33,6 +33,7 @@ import { HELPER_DOMAINS } from "./const";
import { showHelperDetailDialog } from "./show-dialog-helper-detail";
import "../../../components/ha-svg-icon";
import { mdiPlus } from "@mdi/js";
import { computeRTL } from "../../../common/util/compute_rtl";
@customElement("ha-config-helpers")
export class HaConfigHelpers extends LitElement {
@ -154,11 +155,15 @@ export class HaConfigHelpers extends LitElement {
.data=${this._getItems(this._stateItems)}
@row-click=${this._openEditDialog}
hasFab
.noDataText=${this.hass.localize(
"ui.panel.config.helpers.picker.no_helpers"
)}
>
</hass-tabs-subpage-data-table>
<mwc-fab
?is-wide=${this.isWide}
?narrow=${this.narrow}
?rtl=${computeRTL(this.hass!)}
title="${this.hass.localize(
"ui.panel.config.helpers.picker.add_helper"
)}"
@ -225,6 +230,15 @@ export class HaConfigHelpers extends LitElement {
mwc-fab[narrow] {
bottom: 84px;
}
mwc-fab[rtl] {
right: auto;
left: 16px;
}
mwc-fab[is-wide][rtl] {
bottom: 24px;
left: 24px;
right: auto;
}
`;
}
}

View File

@ -263,6 +263,9 @@ class HaConfigIntegrations extends SubscribeMixin(LitElement) {
no-label-float
no-underline
@value-changed=${this._handleSearchChange}
.label=${this.hass.localize(
"ui.panel.config.integrations.search"
)}
></search-input>
</slot>
</div>
@ -293,6 +296,9 @@ class HaConfigIntegrations extends SubscribeMixin(LitElement) {
no-underline
.filter=${this._filter}
@value-changed=${this._handleSearchChange}
.label=${this.hass.localize(
"ui.panel.config.integrations.search"
)}
></search-input>
</div>
`
@ -673,7 +679,6 @@ class HaConfigIntegrations extends SubscribeMixin(LitElement) {
display: block;
position: relative;
left: -8px;
top: -7px;
color: var(--secondary-text-color);
margin-left: 16px;
}
@ -717,7 +722,7 @@ class HaConfigIntegrations extends SubscribeMixin(LitElement) {
right: auto;
left: 16px;
}
mwc-fab[is-wide].rtl {
mwc-fab[is-wide][rtl] {
bottom: 24px;
left: 24px;
right: auto;

View File

@ -16,6 +16,7 @@ import "../../../../../components/entity/ha-state-icon";
import type { Cluster } from "../../../../../data/zha";
import type { HomeAssistant } from "../../../../../types";
import { formatAsPaddedHex } from "./functions";
import { computeRTLDirection } from "../../../../../common/util/compute_rtl";
export interface ClusterRowData extends Cluster {
cluster?: Cluster;
@ -91,6 +92,7 @@ export class ZHAClustersDataTable extends LitElement {
.id=${"cluster_id"}
selectable
auto-height
.dir=${computeRTLDirection(this.hass)}
></ha-data-table>
`;
}

View File

@ -21,6 +21,7 @@ import type {
ZHAEntityReference,
} from "../../../../../data/zha";
import type { HomeAssistant } from "../../../../../types";
import { computeRTLDirection } from "../../../../../common/util/compute_rtl";
export interface DeviceEndpointRowData extends DataTableRowData {
id: string;
@ -147,6 +148,7 @@ export class ZHADeviceEndpointDataTable extends LitElement {
.data=${this._deviceEndpoints(this.deviceEndpoints)}
.selectable=${this.selectable}
auto-height
.dir=${computeRTLDirection(this.hass)}
></ha-data-table>
`;
}

View File

@ -20,6 +20,7 @@ import { haStyleDialog } from "../../../resources/styles";
import { HomeAssistant } from "../../../types";
import { SystemLogDetailDialogParams } from "./show-dialog-system-log-detail";
import { formatSystemLogTime } from "./util";
import { fireEvent } from "../../../common/dom/fire_event";
class DialogSystemLogDetail extends LitElement {
@property() public hass!: HomeAssistant;
@ -34,6 +35,11 @@ class DialogSystemLogDetail extends LitElement {
await this.updateComplete;
}
public closeDialog() {
this._params = undefined;
fireEvent(this, "dialog-closed", { dialog: this.localName });
}
protected updated(changedProps) {
super.updated(changedProps);
if (!changedProps.has("_params") || !this._params) {
@ -137,7 +143,7 @@ class DialogSystemLogDetail extends LitElement {
private _openedChanged(ev: PolymerChangedEvent<boolean>): void {
if (!(ev.detail as any).value) {
this._params = undefined;
this.closeDialog();
}
}

View File

@ -17,7 +17,7 @@ import { configSections } from "../ha-panel-config";
import "../../../layouts/hass-tabs-subpage";
@customElement("ha-config-logs")
export class HaPanelDevLogs extends LitElement {
export class HaConfigLogs extends LitElement {
@property() public hass!: HomeAssistant;
@property() public narrow!: boolean;
@ -74,6 +74,6 @@ export class HaPanelDevLogs extends LitElement {
declare global {
interface HTMLElementTagNameMap {
"developer-tools-logs": HaPanelDevLogs;
"ha-config-logs": HaConfigLogs;
}
}

View File

@ -24,6 +24,7 @@ import { PolymerChangedEvent } from "../../../../polymer-types";
import { haStyleDialog } from "../../../../resources/styles";
import { HomeAssistant } from "../../../../types";
import { LovelaceDashboardDetailsDialogParams } from "./show-dialog-lovelace-dashboard-detail";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
@customElement("dialog-lovelace-dashboard-detail")
export class DialogLovelaceDashboardDetail extends LitElement {
@ -74,6 +75,8 @@ export class DialogLovelaceDashboardDetail extends LitElement {
this._params.urlPath !== "lovelace" &&
!/^[a-zA-Z0-9_-]+-[a-zA-Z0-9_-]+$/.test(this._urlPath);
const titleInvalid = !this._title.trim();
const dir = computeRTLDirection(this.hass);
return html`
<ha-dialog
open
@ -143,28 +146,34 @@ export class DialogLovelaceDashboardDetail extends LitElement {
></paper-input>
`
: ""}
<ha-formfield
.label=${this.hass.localize(
"ui.panel.config.lovelace.dashboards.detail.show_sidebar"
)}
>
<ha-switch
.checked=${this._showInSidebar}
@change=${this._showSidebarChanged}
<div>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.config.lovelace.dashboards.detail.show_sidebar"
)}
.dir=${dir}
>
</ha-switch>
</ha-formfield>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.config.lovelace.dashboards.detail.require_admin"
)}
>
<ha-switch
.checked=${this._requireAdmin}
@change=${this._requireAdminChanged}
<ha-switch
.checked=${this._showInSidebar}
@change=${this._showSidebarChanged}
>
</ha-switch>
</ha-formfield>
</div>
<div>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.config.lovelace.dashboards.detail.require_admin"
)}
.dir=${dir}
>
</ha-switch>
</ha-formfield>
<ha-switch
.checked=${this._requireAdmin}
@change=${this._requireAdminChanged}
>
</ha-switch>
</ha-formfield>
</div>
</div>
`}
</div>
@ -318,9 +327,6 @@ export class DialogLovelaceDashboardDetail extends LitElement {
ha-switch {
padding: 16px 0;
}
ha-formfield {
display: block;
}
`,
];
}

View File

@ -36,6 +36,7 @@ import { lovelaceTabs } from "../ha-config-lovelace";
import { showDashboardDetailDialog } from "./show-dialog-lovelace-dashboard-detail";
import "../../../../components/ha-svg-icon";
import { mdiPlus } from "@mdi/js";
import { computeRTL } from "../../../../common/util/compute_rtl";
@customElement("ha-config-lovelace-dashboards")
export class HaConfigLovelaceDashboards extends LitElement {
@ -227,6 +228,7 @@ export class HaConfigLovelaceDashboards extends LitElement {
<mwc-fab
?is-wide=${this.isWide}
?narrow=${this.narrow}
?rtl=${computeRTL(this.hass)}
title="${this.hass.localize(
"ui.panel.config.lovelace.dashboards.picker.add_dashboard"
)}"
@ -324,6 +326,10 @@ export class HaConfigLovelaceDashboards extends LitElement {
mwc-fab[narrow] {
bottom: 84px;
}
mwc-fab[rtl] {
left: 16px;
right: auto;
}
`;
}
}

View File

@ -40,6 +40,7 @@ import { lovelaceTabs } from "../ha-config-lovelace";
import { showResourceDetailDialog } from "./show-dialog-lovelace-resource-detail";
import "../../../../components/ha-svg-icon";
import { mdiPlus } from "@mdi/js";
import { computeRTL } from "../../../../common/util/compute_rtl";
@customElement("ha-config-lovelace-resources")
export class HaConfigLovelaceRescources extends LitElement {
@ -64,6 +65,7 @@ export class HaConfigLovelaceRescources extends LitElement {
filterable: true,
direction: "asc",
grows: true,
forceLTR: true,
},
type: {
title: this.hass.localize(
@ -107,6 +109,7 @@ export class HaConfigLovelaceRescources extends LitElement {
<mwc-fab
?is-wide=${this.isWide}
?narrow=${this.narrow}
?rtl=${computeRTL(this.hass!)}
title=${this.hass.localize(
"ui.panel.config.lovelace.resources.picker.add_resource"
)}
@ -215,6 +218,15 @@ export class HaConfigLovelaceRescources extends LitElement {
mwc-fab[narrow] {
bottom: 84px;
}
mwc-fab[rtl] {
right: auto;
left: 16px;
}
mwc-fab[is-wide][rtl] {
bottom: 24px;
left: 24px;
right: auto;
}
`;
}
}

View File

@ -31,6 +31,7 @@ import {
} from "./show-dialog-person-detail";
import "../../../components/ha-svg-icon";
import { mdiPlus } from "@mdi/js";
import { computeRTL } from "../../../common/util/compute_rtl";
class HaConfigPerson extends LitElement {
@property() public hass?: HomeAssistant;
@ -126,6 +127,7 @@ class HaConfigPerson extends LitElement {
<mwc-fab
?is-wide=${this.isWide}
?narrow=${this.narrow}
?rtl=${computeRTL(this.hass!)}
title="${hass.localize("ui.panel.config.person.add_person")}"
@click=${this._createPerson}
>
@ -253,6 +255,15 @@ class HaConfigPerson extends LitElement {
bottom: 24px;
right: 24px;
}
mwc-fab[rtl] {
right: auto;
left: 16px;
}
mwc-fab[is-wide][rtl] {
bottom: 24px;
left: 24px;
right: auto;
}
`;
}
}

View File

@ -24,8 +24,10 @@ import { haStyle } from "../../../resources/styles";
import { HomeAssistant, Route } from "../../../types";
import { showToast } from "../../../util/toast";
import { configSections } from "../ha-panel-config";
import "../../../components/ha-icon";
import "../../../components/ha-svg-icon";
import { mdiPlus } from "@mdi/js";
import { stateIcon } from "../../../common/entity/state_icon";
@customElement("ha-scene-dashboard")
class HaSceneDashboard extends LitElement {
@ -44,6 +46,7 @@ class HaSceneDashboard extends LitElement {
return {
...scene,
name: computeStateName(scene),
icon: stateIcon(scene),
};
});
});
@ -66,6 +69,11 @@ class HaSceneDashboard extends LitElement {
></ha-icon-button>
`,
},
icon: {
title: "",
type: "icon",
template: (icon) => html` <ha-icon .icon=${icon}></ha-icon> `,
},
name: {
title: this.hass.localize(
"ui.panel.config.scene.picker.headers.name"

View File

@ -23,6 +23,7 @@ import { computeRTL } from "../../../common/util/compute_rtl";
import "../../../components/device/ha-device-picker";
import "../../../components/entity/ha-entities-picker";
import "../../../components/ha-card";
import "../../../components/ha-icon-input";
import "@material/mwc-fab";
import {
computeDeviceName,
@ -87,7 +88,7 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) {
@property() private _errors?: string;
@property() private _config!: SceneConfig;
@property() private _config?: SceneConfig;
@property() private _entities: string[] = [];
@ -210,115 +211,68 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) {
rtl: computeRTL(this.hass),
})}"
>
<ha-config-section .isWide=${this.isWide}>
${!this.narrow ? html` <span slot="header">${name}</span> ` : ""}
<div slot="introduction">
${this.hass.localize("ui.panel.config.scene.editor.introduction")}
</div>
<ha-card>
<div class="card-content">
<paper-input
.value=${this._scene ? computeStateName(this._scene) : ""}
@value-changed=${this._nameChanged}
label=${this.hass.localize(
"ui.panel.config.scene.editor.name"
)}
></paper-input>
</div>
</ha-card>
</ha-config-section>
<ha-config-section .isWide=${this.isWide}>
<div slot="header">
${this.hass.localize(
"ui.panel.config.scene.editor.devices.header"
)}
</div>
<div slot="introduction">
${this.hass.localize(
"ui.panel.config.scene.editor.devices.introduction"
)}
</div>
${devices.map(
(device) =>
html`
<ha-card>
<div class="card-header">
${device.name}
<ha-icon-button
icon="hass:delete"
title="${this.hass.localize(
"ui.panel.config.scene.editor.devices.delete"
)}"
.device=${device.id}
@click=${this._deleteDevice}
></ha-icon-button>
</div>
${device.entities.map((entityId) => {
const entityStateObj = this.hass.states[entityId];
if (!entityStateObj) {
return html``;
}
return html`
<paper-icon-item
.entityId=${entityId}
@click=${this._showMoreInfo}
class="device-entity"
>
<state-badge
.stateObj=${entityStateObj}
slot="item-icon"
></state-badge>
<paper-item-body>
${computeStateName(entityStateObj)}
</paper-item-body>
</paper-icon-item>
`;
})}
</ha-card>
`
)}
<ha-card
.header=${this.hass.localize(
"ui.panel.config.scene.editor.devices.add"
)}
>
<div class="card-content">
<ha-device-picker
@value-changed=${this._devicePicked}
.hass=${this.hass}
.label=${this.hass.localize(
"ui.panel.config.scene.editor.devices.add"
)}
></ha-device-picker>
</div>
</ha-card>
</ha-config-section>
${this.showAdvanced
${this._config
? html`
<ha-config-section .isWide=${this.isWide}>
${!this.narrow
? html` <span slot="header">${name}</span> `
: ""}
<div slot="introduction">
${this.hass.localize(
"ui.panel.config.scene.editor.introduction"
)}
</div>
<ha-card>
<div class="card-content">
<paper-input
.value=${this._config.name}
.name=${"name"}
@value-changed=${this._valueChanged}
label=${this.hass.localize(
"ui.panel.config.scene.editor.name"
)}
></paper-input>
<ha-icon-input
.label=${this.hass.localize(
"ui.panel.config.scene.editor.icon"
)}
.name=${"icon"}
.value=${this._config.icon}
@value-changed=${this._valueChanged}
>
</ha-icon-input>
</div>
</ha-card>
</ha-config-section>
<ha-config-section .isWide=${this.isWide}>
<div slot="header">
${this.hass.localize(
"ui.panel.config.scene.editor.entities.header"
"ui.panel.config.scene.editor.devices.header"
)}
</div>
<div slot="introduction">
${this.hass.localize(
"ui.panel.config.scene.editor.entities.introduction"
"ui.panel.config.scene.editor.devices.introduction"
)}
</div>
${entities.length
? html`
<ha-card
class="entities"
.header=${this.hass.localize(
"ui.panel.config.scene.editor.entities.without_device"
)}
>
${entities.map((entityId) => {
${devices.map(
(device) =>
html`
<ha-card>
<div class="card-header">
${device.name}
<ha-icon-button
icon="hass:delete"
title="${this.hass.localize(
"ui.panel.config.scene.editor.devices.delete"
)}"
.device=${device.id}
@click=${this._deleteDevice}
></ha-icon-button>
</div>
${device.entities.map((entityId) => {
const entityStateObj = this.hass.states[entityId];
if (!entityStateObj) {
return html``;
@ -336,41 +290,108 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) {
<paper-item-body>
${computeStateName(entityStateObj)}
</paper-item-body>
<ha-icon-button
icon="hass:delete"
.entityId=${entityId}
.title="${this.hass.localize(
"ui.panel.config.scene.editor.entities.delete"
)}"
@click=${this._deleteEntity}
></ha-icon-button>
</paper-icon-item>
`;
})}
</ha-card>
`
: ""}
)}
<ha-card
header=${this.hass.localize(
"ui.panel.config.scene.editor.entities.add"
.header=${this.hass.localize(
"ui.panel.config.scene.editor.devices.add"
)}
>
<div class="card-content">
${this.hass.localize(
"ui.panel.config.scene.editor.entities.device_entities"
)}
<ha-entity-picker
@value-changed=${this._entityPicked}
.excludeDomains=${SCENE_IGNORED_DOMAINS}
<ha-device-picker
@value-changed=${this._devicePicked}
.hass=${this.hass}
label=${this.hass.localize(
"ui.panel.config.scene.editor.entities.add"
.label=${this.hass.localize(
"ui.panel.config.scene.editor.devices.add"
)}
></ha-entity-picker>
></ha-device-picker>
</div>
</ha-card>
</ha-config-section>
${this.showAdvanced
? html`
<ha-config-section .isWide=${this.isWide}>
<div slot="header">
${this.hass.localize(
"ui.panel.config.scene.editor.entities.header"
)}
</div>
<div slot="introduction">
${this.hass.localize(
"ui.panel.config.scene.editor.entities.introduction"
)}
</div>
${entities.length
? html`
<ha-card
class="entities"
.header=${this.hass.localize(
"ui.panel.config.scene.editor.entities.without_device"
)}
>
${entities.map((entityId) => {
const entityStateObj = this.hass.states[
entityId
];
if (!entityStateObj) {
return html``;
}
return html`
<paper-icon-item
.entityId=${entityId}
@click=${this._showMoreInfo}
class="device-entity"
>
<state-badge
.stateObj=${entityStateObj}
slot="item-icon"
></state-badge>
<paper-item-body>
${computeStateName(entityStateObj)}
</paper-item-body>
<ha-icon-button
icon="hass:delete"
.entityId=${entityId}
.title="${this.hass.localize(
"ui.panel.config.scene.editor.entities.delete"
)}"
@click=${this._deleteEntity}
></ha-icon-button>
</paper-icon-item>
`;
})}
</ha-card>
`
: ""}
<ha-card
header=${this.hass.localize(
"ui.panel.config.scene.editor.entities.add"
)}
>
<div class="card-content">
${this.hass.localize(
"ui.panel.config.scene.editor.entities.device_entities"
)}
<ha-entity-picker
@value-changed=${this._entityPicked}
.excludeDomains=${SCENE_IGNORED_DOMAINS}
.hass=${this.hass}
label=${this.hass.localize(
"ui.panel.config.scene.editor.entities.add"
)}
></ha-entity-picker>
</div>
</ha-card>
</ha-config-section>
`
: ""}
`
: ""}
</div>
@ -532,6 +553,18 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) {
}
this._entities = [...this._entities, entityId];
this._storeState(entityId);
const entityRegistry = this._entityRegistryEntries.find(
(entityReg) => entityReg.entity_id === entityId
);
if (
entityRegistry?.device_id &&
!this._devices.includes(entityRegistry.device_id)
) {
this._devices = [...this._devices, entityRegistry.device_id];
}
this._dirty = true;
}
@ -575,11 +608,21 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) {
this._dirty = true;
}
private _nameChanged(ev: CustomEvent) {
if (!this._config || this._config.name === ev.detail.value) {
private _valueChanged(ev: CustomEvent) {
ev.stopPropagation();
const target = ev.target as any;
const name = target.name;
if (!name) {
return;
}
this._config.name = ev.detail.value;
let newVal = ev.detail.value;
if (target.type === "number") {
newVal = Number(newVal);
}
if ((this._config![name] || "") === newVal) {
return;
}
this._config = { ...this._config!, [name]: newVal };
this._dirty = true;
}
@ -659,7 +702,7 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) {
private async _saveScene(): Promise<void> {
const id = !this.sceneId ? "" + Date.now() : this.sceneId!;
this._config = { ...this._config, entities: this._calculateStates() };
this._config = { ...this._config!, entities: this._calculateStates() };
try {
await saveScene(this.hass, id, this._config);
this._dirty = false;

View File

@ -1,4 +1,5 @@
import "@polymer/app-layout/app-header/app-header";
import "@polymer/paper-dropdown-menu/paper-dropdown-menu-light";
import "@polymer/app-layout/app-toolbar/app-toolbar";
import "../../../components/ha-icon-button";
import {
@ -9,18 +10,22 @@ import {
property,
PropertyValues,
TemplateResult,
internalProperty,
} from "lit-element";
import { classMap } from "lit-html/directives/class-map";
import { computeObjectId } from "../../../common/entity/compute_object_id";
import { navigate } from "../../../common/navigate";
import { computeRTL } from "../../../common/util/compute_rtl";
import "../../../components/ha-card";
import "../../../components/ha-icon-input";
import "@material/mwc-fab";
import {
Action,
deleteScript,
getScriptEditorInitData,
ScriptConfig,
MODES,
MODES_MAX,
} from "../../../data/script";
import { showConfirmationDialog } from "../../../dialogs/generic/show-dialog-box";
import "../../../layouts/ha-app-layout";
@ -32,6 +37,8 @@ import "../ha-config-section";
import { configSections } from "../ha-panel-config";
import "../../../components/ha-svg-icon";
import { mdiContentSave } from "@mdi/js";
import { PaperListboxElement } from "@polymer/paper-listbox";
import { slugify } from "../../../common/string/slugify";
export class HaScriptEditor extends LitElement {
@property() public hass!: HomeAssistant;
@ -44,11 +51,15 @@ export class HaScriptEditor extends LitElement {
@property() public narrow!: boolean;
@property() private _config?: ScriptConfig;
@internalProperty() private _config?: ScriptConfig;
@property() private _dirty?: boolean;
@internalProperty() private _entityId?: string;
@property() private _errors?: string;
@internalProperty() private _idError = false;
@internalProperty() private _dirty?: boolean;
@internalProperty() private _errors?: string;
protected render(): TemplateResult {
return html`
@ -103,8 +114,83 @@ export class HaScriptEditor extends LitElement {
name="alias"
.value=${this._config.alias}
@value-changed=${this._valueChanged}
@change=${this._aliasChanged}
>
</paper-input>
<ha-icon-input
.label=${this.hass.localize(
"ui.panel.config.script.editor.icon"
)}
.name=${"icon"}
.value=${this._config.icon}
@value-changed=${this._valueChanged}
>
</ha-icon-input>
${!this.scriptEntityId
? html` <paper-input
.label=${this.hass.localize(
"ui.panel.config.script.editor.id"
)}
.errorMessage=${this.hass.localize(
"ui.panel.config.script.editor.id_already_exists"
)}
.invalid=${this._idError}
.value=${this._entityId}
@value-changed=${this._idChanged}
>
</paper-input>`
: ""}
<p>
${this.hass.localize(
"ui.panel.config.script.editor.modes.description",
"documentation_link",
html`<a
href="https://www.home-assistant.io/integrations/script/#script-modes"
target="_blank"
rel="noreferrer"
>${this.hass.localize(
"ui.panel.config.script.editor.modes.documentation"
)}</a
>`
)}
</p>
<paper-dropdown-menu-light
.label=${this.hass.localize(
"ui.panel.config.script.editor.modes.label"
)}
no-animations
>
<paper-listbox
slot="dropdown-content"
.selected=${this._config.mode
? MODES.indexOf(this._config.mode)
: 0}
@iron-select=${this._modeChanged}
>
${MODES.map(
(mode) => html`
<paper-item .mode=${mode}>
${this.hass.localize(
`ui.panel.config.script.editor.modes.${mode}`
) || mode}
</paper-item>
`
)}
</paper-listbox>
</paper-dropdown-menu-light>
${this._config.mode &&
MODES_MAX.includes(this._config.mode)
? html` <paper-input
.label=${this.hass.localize(
`ui.panel.config.script.editor.max.${this._config.mode}`
)}
type="number"
name="max"
.value=${this._config.max || "10"}
@value-changed=${this._valueChanged}
>
</paper-input>`
: html``}
</div>
</ha-card>
</ha-config-section>
@ -216,14 +302,52 @@ export class HaScriptEditor extends LitElement {
}
}
private _modeChanged(ev: CustomEvent) {
const mode = ((ev.target as PaperListboxElement)?.selectedItem as any)
?.mode;
this._config = { ...this._config!, mode };
if (!MODES_MAX.includes(mode)) {
delete this._config.max;
}
this._dirty = true;
}
private _aliasChanged(ev: CustomEvent) {
if (this.scriptEntityId || this._entityId) {
return;
}
const aliasSlugify = slugify((ev.target as any).value, "_");
let id = aliasSlugify;
let i = 2;
while (this.hass.states[`script.${id}`]) {
id = `${aliasSlugify}_${i}`;
i++;
}
this._entityId = id;
}
private _idChanged(ev: CustomEvent) {
ev.stopPropagation();
this._entityId = (ev.target as any).value;
if (this.hass.states[`script.${this._entityId}`]) {
this._idError = true;
} else {
this._idError = false;
}
}
private _valueChanged(ev: CustomEvent) {
ev.stopPropagation();
const name = (ev.target as any)?.name;
const target = ev.target as any;
const name = target.name;
if (!name) {
return;
}
const newVal = ev.detail.value;
let newVal = ev.detail.value;
if (target.type === "number") {
newVal = Number(newVal);
}
if ((this._config![name] || "") === newVal) {
return;
}
@ -267,9 +391,15 @@ export class HaScriptEditor extends LitElement {
}
private _saveScript(): void {
if (this._idError) {
this._errors = this.hass.localize(
"ui.panel.config.script.editor.id_already_exists_save_error"
);
return;
}
const id = this.scriptEntityId
? computeObjectId(this.scriptEntityId)
: Date.now();
: this._entityId || Date.now();
this.hass!.callApi("POST", "config/script/config/" + id, this._config).then(
() => {
this._dirty = false;
@ -292,6 +422,9 @@ export class HaScriptEditor extends LitElement {
ha-card {
overflow: hidden;
}
p {
margin-bottom: 0;
}
.errors {
padding: 20px;
font-weight: bold;

View File

@ -25,6 +25,7 @@ import { showToast } from "../../../util/toast";
import { configSections } from "../ha-panel-config";
import "../../../components/ha-svg-icon";
import { mdiPlus } from "@mdi/js";
import { stateIcon } from "../../../common/entity/state_icon";
@customElement("ha-script-picker")
class HaScriptPicker extends LitElement {
@ -43,6 +44,7 @@ class HaScriptPicker extends LitElement {
return {
...script,
name: computeStateName(script),
icon: stateIcon(script),
};
});
});
@ -65,6 +67,11 @@ class HaScriptPicker extends LitElement {
></ha-icon-button>
`,
},
icon: {
title: "",
type: "icon",
template: (icon) => html` <ha-icon .icon=${icon}></ha-icon> `,
},
name: {
title: this.hass.localize(
"ui.panel.config.script.picker.headers.name"

View File

@ -26,6 +26,7 @@ import { PolymerChangedEvent } from "../../../polymer-types";
import { haStyleDialog } from "../../../resources/styles";
import { HomeAssistant } from "../../../types";
import { AddUserDialogParams } from "./show-dialog-add-user";
import { computeRTLDirection } from "../../../common/util/compute_rtl";
@customElement("dialog-add-user")
export class DialogAddUser extends LitElement {
@ -115,6 +116,7 @@ export class DialogAddUser extends LitElement {
></paper-input>
<ha-formfield
.label=${this.hass.localize("ui.panel.config.users.editor.admin")}
.dir=${computeRTLDirection(this.hass)}
>
<ha-switch .checked=${this._isAdmin} @change=${this._adminChanged}>
</ha-switch>

View File

@ -21,6 +21,7 @@ import { PolymerChangedEvent } from "../../../polymer-types";
import { haStyleDialog } from "../../../resources/styles";
import { HomeAssistant } from "../../../types";
import { UserDetailDialogParams } from "./show-dialog-user-detail";
import { computeRTLDirection } from "../../../common/util/compute_rtl";
@customElement("dialog-user-detail")
class DialogUserDetail extends LitElement {
@ -102,6 +103,7 @@ class DialogUserDetail extends LitElement {
></paper-input>
<ha-formfield
.label=${this.hass.localize("ui.panel.config.users.editor.admin")}
.dir=${computeRTLDirection(this.hass)}
>
<ha-switch
.disabled=${user.system_generated}

View File

@ -8,6 +8,7 @@ import {
property,
TemplateResult,
} from "lit-element";
import { fireEvent } from "../../../common/dom/fire_event";
import { addDistanceToCoord } from "../../../common/location/add_distance_to_coord";
import { createCloseHeading } from "../../../components/ha-dialog";
import "../../../components/ha-switch";
@ -22,6 +23,7 @@ import {
import { haStyleDialog } from "../../../resources/styles";
import { HomeAssistant } from "../../../types";
import { ZoneDetailDialogParams } from "./show-dialog-zone-detail";
import { computeRTLDirection } from "../../../common/util/compute_rtl";
class DialogZoneDetail extends LitElement {
@property() public hass!: HomeAssistant;
@ -44,7 +46,7 @@ class DialogZoneDetail extends LitElement {
@property() private _submitting = false;
public async showDialog(params: ZoneDetailDialogParams): Promise<void> {
public showDialog(params: ZoneDetailDialogParams): void {
this._params = params;
this._error = undefined;
if (this._params.entry) {
@ -73,7 +75,11 @@ class DialogZoneDetail extends LitElement {
this._passive = false;
this._radius = 100;
}
await this.updateComplete;
}
public closeDialog(): void {
this._params = undefined;
fireEvent(this, "dialog-closed", { dialog: this.localName });
}
protected render(): TemplateResult {
@ -92,7 +98,7 @@ class DialogZoneDetail extends LitElement {
return html`
<ha-dialog
open
@closing="${this._close}"
@closed="${this.closeDialog}"
scrimClickAction=""
escapeKeyAction=""
.heading=${createCloseHeading(
@ -186,6 +192,7 @@ class DialogZoneDetail extends LitElement {
.label=${this.hass!.localize(
"ui.panel.config.zone.detail.passive"
)}
.dir=${computeRTLDirection(this.hass)}
>
<ha-switch
.checked=${this._passive}
@ -274,10 +281,6 @@ class DialogZoneDetail extends LitElement {
}
}
private _close(): void {
this._params = undefined;
}
static get styles(): CSSResult[] {
return [
haStyleDialog,

Some files were not shown because too many files have changed in this diff Show More