Add Style & Times Property Component

This commit is contained in:
ingalls
2025-12-10 21:13:56 -07:00
parent 6e11e34a46
commit 79eea47c54
4 changed files with 497 additions and 319 deletions

View File

@@ -1,12 +1,12 @@
{
"name": "@tak-ps/CloudTAK.web",
"version": "12.24.2",
"version": "12.26.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "@tak-ps/CloudTAK.web",
"version": "12.24.2",
"version": "12.26.0",
"dependencies": {
"@react-hookz/deep-equal": "^3.0.3",
"@tabler/core": "^1.4.0",
@@ -82,9 +82,9 @@
}
},
"node_modules/@acemir/cssom": {
"version": "0.9.28",
"resolved": "https://registry.npmjs.org/@acemir/cssom/-/cssom-0.9.28.tgz",
"integrity": "sha512-LuS6IVEivI75vKN8S04qRD+YySP0RmU/cV8UNukhQZvprxF+76Z43TNo/a08eCodaGhT1Us8etqS1ZRY9/Or0A==",
"version": "0.9.29",
"resolved": "https://registry.npmjs.org/@acemir/cssom/-/cssom-0.9.29.tgz",
"integrity": "sha512-G90x0VW+9nW4dFajtjCoT+NM0scAfH9Mb08IcjgFHYbfiL/lU04dTF9JuVOi3/OH+DJCQdcIseSXkdCB9Ky6JA==",
"dev": true,
"license": "MIT"
},
@@ -1113,9 +1113,9 @@
}
},
"node_modules/@maplibre/maplibre-gl-style-spec": {
"version": "24.3.1",
"resolved": "https://registry.npmjs.org/@maplibre/maplibre-gl-style-spec/-/maplibre-gl-style-spec-24.3.1.tgz",
"integrity": "sha512-TUM5JD40H2mgtVXl5IwWz03BuQabw8oZQLJTmPpJA0YTYF+B+oZppy5lNMO6bMvHzB+/5mxqW9VLG3wFdeqtOw==",
"version": "24.4.0",
"resolved": "https://registry.npmjs.org/@maplibre/maplibre-gl-style-spec/-/maplibre-gl-style-spec-24.4.0.tgz",
"integrity": "sha512-VVuNV2Yf0+yQoth4qbdIPE0qKS6nIG5Atki9BVHZ7R7+0lZyxqxwrh0XVNA5YkuKuytFg/1i3VMyJQnp2EtOqw==",
"license": "ISC",
"dependencies": {
"@mapbox/jsonlint-lines-primitives": "~2.0.2",
@@ -1617,9 +1617,9 @@
"license": "MIT"
},
"node_modules/@redocly/openapi-core": {
"version": "1.34.5",
"resolved": "https://registry.npmjs.org/@redocly/openapi-core/-/openapi-core-1.34.5.tgz",
"integrity": "sha512-0EbE8LRbkogtcCXU7liAyC00n9uNG9hJ+eMyHFdUsy9lB/WGqnEBgwjA9q2cyzAVcdTkQqTBBU1XePNnN3OijA==",
"version": "1.34.6",
"resolved": "https://registry.npmjs.org/@redocly/openapi-core/-/openapi-core-1.34.6.tgz",
"integrity": "sha512-2+O+riuIUgVSuLl3Lyh5AplWZyVMNuG2F98/o6NrutKJfW4/GTZdPpZlIphS0HGgcOHgmWcCSHj+dWFlZaGSHw==",
"dev": true,
"license": "MIT",
"dependencies": {
@@ -2081,9 +2081,9 @@
}
},
"node_modules/@tak-ps/vue-tabler": {
"version": "3.85.0",
"resolved": "https://registry.npmjs.org/@tak-ps/vue-tabler/-/vue-tabler-3.85.0.tgz",
"integrity": "sha512-Ky3+F8RdGpM1lh0tNSY68l5bOSXpQREn39rrrz5VD5IPZZnX2y2AZUnqXaJ8n4kTjww5lsgSeajhVMMdZEUJUQ==",
"version": "3.86.0",
"resolved": "https://registry.npmjs.org/@tak-ps/vue-tabler/-/vue-tabler-3.86.0.tgz",
"integrity": "sha512-sWT4V38cVvzJmuEG6UuQ1mDXXqOPzNUghMYUzeBcFx7XidgK9WhIHVUbicnHnBe+uSKbYdeDqiBYt9lE7FT67w==",
"license": "ISC",
"dependencies": {
"@tabler/icons-vue": "^3.0.0",
@@ -2745,9 +2745,9 @@
"license": "MIT"
},
"node_modules/@types/node": {
"version": "24.10.2",
"resolved": "https://registry.npmjs.org/@types/node/-/node-24.10.2.tgz",
"integrity": "sha512-WOhQTZ4G8xZ1tjJTvKOpyEVSGgOTvJAfDK3FNFgELyaTpzhdgHVHeqW8V+UJvzF5BT+/B54T/1S2K6gd9c7bbA==",
"version": "25.0.0",
"resolved": "https://registry.npmjs.org/@types/node/-/node-25.0.0.tgz",
"integrity": "sha512-rl78HwuZlaDIUSeUKkmogkhebA+8K1Hy7tddZuJ3D0xV8pZSfsYGTsliGUol1JPzu9EKnTxPC4L1fiWouStRew==",
"license": "MIT",
"dependencies": {
"undici-types": "~7.16.0"
@@ -7254,9 +7254,9 @@
"license": "MIT"
},
"node_modules/sass": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass/-/sass-1.93.3.tgz",
"integrity": "sha512-elOcIZRTM76dvxNAjqYrucTSI0teAF/L2Lv0s6f6b7FOwcwIuA357bIE871580AjHJuSvLIRUosgV+lIWx6Rgg==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass/-/sass-1.96.0.tgz",
"integrity": "sha512-8u4xqqUeugGNCYwr9ARNtQKTOj4KmYiJAVKXf2CTIivTCR51j96htbMKWDru8H5SaQWpyVgTfOF8Ylyf5pun1Q==",
"dev": true,
"license": "MIT",
"optional": true,
@@ -7276,9 +7276,9 @@
}
},
"node_modules/sass-embedded": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded/-/sass-embedded-1.93.3.tgz",
"integrity": "sha512-+VUy01yfDqNmIVMd/LLKl2TTtY0ovZN0rTonh+FhKr65mFwIYgU9WzgIZKS7U9/SPCQvWTsTGx9jyt+qRm/XFw==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded/-/sass-embedded-1.96.0.tgz",
"integrity": "sha512-z9PQ7owvdhn7UuZGrpPccdkcH9xJd9iCv+UQhcPqppBslYEp0R9LRQVyyPTZg7jfA77bGxz/I8V48LXJR5LjXQ==",
"dev": true,
"license": "MIT",
"dependencies": {
@@ -7298,30 +7298,30 @@
"node": ">=16.0.0"
},
"optionalDependencies": {
"sass-embedded-all-unknown": "1.93.3",
"sass-embedded-android-arm": "1.93.3",
"sass-embedded-android-arm64": "1.93.3",
"sass-embedded-android-riscv64": "1.93.3",
"sass-embedded-android-x64": "1.93.3",
"sass-embedded-darwin-arm64": "1.93.3",
"sass-embedded-darwin-x64": "1.93.3",
"sass-embedded-linux-arm": "1.93.3",
"sass-embedded-linux-arm64": "1.93.3",
"sass-embedded-linux-musl-arm": "1.93.3",
"sass-embedded-linux-musl-arm64": "1.93.3",
"sass-embedded-linux-musl-riscv64": "1.93.3",
"sass-embedded-linux-musl-x64": "1.93.3",
"sass-embedded-linux-riscv64": "1.93.3",
"sass-embedded-linux-x64": "1.93.3",
"sass-embedded-unknown-all": "1.93.3",
"sass-embedded-win32-arm64": "1.93.3",
"sass-embedded-win32-x64": "1.93.3"
"sass-embedded-all-unknown": "1.96.0",
"sass-embedded-android-arm": "1.96.0",
"sass-embedded-android-arm64": "1.96.0",
"sass-embedded-android-riscv64": "1.96.0",
"sass-embedded-android-x64": "1.96.0",
"sass-embedded-darwin-arm64": "1.96.0",
"sass-embedded-darwin-x64": "1.96.0",
"sass-embedded-linux-arm": "1.96.0",
"sass-embedded-linux-arm64": "1.96.0",
"sass-embedded-linux-musl-arm": "1.96.0",
"sass-embedded-linux-musl-arm64": "1.96.0",
"sass-embedded-linux-musl-riscv64": "1.96.0",
"sass-embedded-linux-musl-x64": "1.96.0",
"sass-embedded-linux-riscv64": "1.96.0",
"sass-embedded-linux-x64": "1.96.0",
"sass-embedded-unknown-all": "1.96.0",
"sass-embedded-win32-arm64": "1.96.0",
"sass-embedded-win32-x64": "1.96.0"
}
},
"node_modules/sass-embedded-all-unknown": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-all-unknown/-/sass-embedded-all-unknown-1.93.3.tgz",
"integrity": "sha512-3okGgnE41eg+CPLtAPletu6nQ4N0ij7AeW+Sl5Km4j29XcmqZQeFwYjHe1AlKTEgLi/UAONk1O8i8/lupeKMbw==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-all-unknown/-/sass-embedded-all-unknown-1.96.0.tgz",
"integrity": "sha512-UfUHoWZtxmsDjDfK+fKCy0aJe6zThu7oaIQx0c/vnHgvprcddEPIay01qTXhiUa3cFcsMmvlBvPTVw0gjKVtVQ==",
"cpu": [
"!arm",
"!arm64",
@@ -7332,13 +7332,13 @@
"license": "MIT",
"optional": true,
"dependencies": {
"sass": "1.93.3"
"sass": "1.96.0"
}
},
"node_modules/sass-embedded-android-arm": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-android-arm/-/sass-embedded-android-arm-1.93.3.tgz",
"integrity": "sha512-8xOw9bywfOD6Wv24BgCmgjkk6tMrsOTTHcb28KDxeJtFtoxiUyMbxo0vChpPAfp2Hyg2tFFKS60s0s4JYk+Raw==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-android-arm/-/sass-embedded-android-arm-1.96.0.tgz",
"integrity": "sha512-0mwVRBFig9hH8vFcRExBuBoR+CfUOcWdwarZwbxIFGI1IyH4BLBGiX85vVn6ssSCVNydpE6lFGm45CN8O0tQig==",
"cpu": [
"arm"
],
@@ -7353,9 +7353,9 @@
}
},
"node_modules/sass-embedded-android-arm64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-android-arm64/-/sass-embedded-android-arm64-1.93.3.tgz",
"integrity": "sha512-uqUl3Kt1IqdGVAcAdbmC+NwuUJy8tM+2ZnB7/zrt6WxWVShVCRdFnWR9LT8HJr7eJN7AU8kSXxaVX/gedanPsg==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-android-arm64/-/sass-embedded-android-arm64-1.96.0.tgz",
"integrity": "sha512-TJiebTo4TBF5Wrn+lFkUfSN3wazvl8kkFm9a1nA9ZtRdaE0nsJLGnMM6KLQLP2Vl+IOf6ovetZseISkClRoGXw==",
"cpu": [
"arm64"
],
@@ -7370,9 +7370,9 @@
}
},
"node_modules/sass-embedded-android-riscv64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-android-riscv64/-/sass-embedded-android-riscv64-1.93.3.tgz",
"integrity": "sha512-2jNJDmo+3qLocjWqYbXiBDnfgwrUeZgZFHJIwAefU7Fn66Ot7rsXl+XPwlokaCbTpj7eMFIqsRAZ/uDueXNCJg==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-android-riscv64/-/sass-embedded-android-riscv64-1.96.0.tgz",
"integrity": "sha512-7AVu/EeJqKN3BGNhm+tc1XzmoqbOtCwHG2VgN6j6Lyqh1JZlx0dglRtyQuKDZ7odTKiWmotEIuYZ6OxLmr2Ejg==",
"cpu": [
"riscv64"
],
@@ -7387,9 +7387,9 @@
}
},
"node_modules/sass-embedded-android-x64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-android-x64/-/sass-embedded-android-x64-1.93.3.tgz",
"integrity": "sha512-y0RoAU6ZenQFcjM9PjQd3cRqRTjqwSbtWLL/p68y2oFyh0QGN0+LQ826fc0ZvU/AbqCsAizkqjzOn6cRZJxTTQ==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-android-x64/-/sass-embedded-android-x64-1.96.0.tgz",
"integrity": "sha512-ei/UsT0q8rF5JzWhn1A7B0M1y/IiWVY3l4zibQrXk5MGaOXHlCM6ffZD+2j7C613Jm9/KAQ7yX1NIIu72LPgDQ==",
"cpu": [
"x64"
],
@@ -7404,9 +7404,9 @@
}
},
"node_modules/sass-embedded-darwin-arm64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-darwin-arm64/-/sass-embedded-darwin-arm64-1.93.3.tgz",
"integrity": "sha512-7zb/hpdMOdKteK17BOyyypemglVURd1Hdz6QGsggy60aUFfptTLQftLRg8r/xh1RbQAUKWFbYTNaM47J9yPxYg==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-darwin-arm64/-/sass-embedded-darwin-arm64-1.96.0.tgz",
"integrity": "sha512-OMvN5NWcrrisC24ZR3GyaWJ1uFxw25qLnUkpEso9TSlaMWiomjU82/uQ/AkQvIMl+EMlJqeYLxZWvq/byLH5Xg==",
"cpu": [
"arm64"
],
@@ -7421,9 +7421,9 @@
}
},
"node_modules/sass-embedded-darwin-x64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-darwin-x64/-/sass-embedded-darwin-x64-1.93.3.tgz",
"integrity": "sha512-Ek1Vp8ZDQEe327Lz0b7h3hjvWH3u9XjJiQzveq74RPpJQ2q6d9LfWpjiRRohM4qK6o4XOHw1X10OMWPXJtdtWg==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-darwin-x64/-/sass-embedded-darwin-x64-1.96.0.tgz",
"integrity": "sha512-J/R5sv0eW+/DU98rccHPO1f3lsTFjVTpdkU9d3P1yB7BFmQjw5PYde9BVRlXeOawPwfgT3p/hvY4RELScICdww==",
"cpu": [
"x64"
],
@@ -7438,9 +7438,9 @@
}
},
"node_modules/sass-embedded-linux-arm": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-arm/-/sass-embedded-linux-arm-1.93.3.tgz",
"integrity": "sha512-yeiv2y+dp8B4wNpd3+JsHYD0mvpXSfov7IGyQ1tMIR40qv+ROkRqYiqQvAOXf76Qwh4Y9OaYZtLpnsPjfeq6mA==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-arm/-/sass-embedded-linux-arm-1.96.0.tgz",
"integrity": "sha512-XuQvV6gNld5Bz3rX0SFLtKPGMu4UQdXNp//9A+bDmtVGZ6yu8REIqphQBxOMpgkAKsA4JZLKKk1N97woeVsIlA==",
"cpu": [
"arm"
],
@@ -7455,9 +7455,9 @@
}
},
"node_modules/sass-embedded-linux-arm64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-arm64/-/sass-embedded-linux-arm64-1.93.3.tgz",
"integrity": "sha512-RBrHWgfd8Dd8w4fbmdRVXRrhh8oBAPyeWDTKAWw8ZEmuXfVl4ytjDuyxaVilh6rR1xTRTNpbaA/YWApBlLrrNw==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-arm64/-/sass-embedded-linux-arm64-1.96.0.tgz",
"integrity": "sha512-VcbVjK0/O/mru0h0FC1WSUWIzMqRrzuJ8eZNMXTs4vApfkh28pxNaUodwU81f1L1nngJ3vpFDBniUKpW6NwJhw==",
"cpu": [
"arm64"
],
@@ -7472,9 +7472,9 @@
}
},
"node_modules/sass-embedded-linux-musl-arm": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm/-/sass-embedded-linux-musl-arm-1.93.3.tgz",
"integrity": "sha512-fU0fwAwbp7sBE3h5DVU5UPzvaLg7a4yONfFWkkcCp6ZrOiPuGRHXXYriWQ0TUnWy4wE+svsVuWhwWgvlb/tkKg==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm/-/sass-embedded-linux-musl-arm-1.96.0.tgz",
"integrity": "sha512-qK7FrnczCVECZXtyYOoI3azFlMDZn70GI1yJPPuZLpWvwIPYoZOLv3u6JSec5o3wT6KeKyWG3ZpGIpigLUjPig==",
"cpu": [
"arm"
],
@@ -7489,9 +7489,9 @@
}
},
"node_modules/sass-embedded-linux-musl-arm64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm64/-/sass-embedded-linux-musl-arm64-1.93.3.tgz",
"integrity": "sha512-PS829l+eUng+9W4PFclXGb4uA2+965NHV3/Sa5U7qTywjeeUUYTZg70dJHSqvhrBEfCc2XJABeW3adLJbyQYkw==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm64/-/sass-embedded-linux-musl-arm64-1.96.0.tgz",
"integrity": "sha512-lVyLObEeu8Wgw8riC6dSMlkF7jVNAjdZ1jIBhvX1yDsrQwwaI60pM21YXmnZSFyCE6KVFkKAgwRQNO/IkoCwMA==",
"cpu": [
"arm64"
],
@@ -7506,9 +7506,9 @@
}
},
"node_modules/sass-embedded-linux-musl-riscv64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-riscv64/-/sass-embedded-linux-musl-riscv64-1.93.3.tgz",
"integrity": "sha512-cK1oBY+FWQquaIGEeQ5H74KTO8cWsSWwXb/WaildOO9U6wmUypTgUYKQ0o5o/29nZbWWlM1PHuwVYTSnT23Jjg==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-riscv64/-/sass-embedded-linux-musl-riscv64-1.96.0.tgz",
"integrity": "sha512-Y+DuGVRsM2zGl268QN5aF/Y6OFYTILb3f+6huEXKlGL6FK2MXadsmeoVbmKVrTamQHzyA2bWWMU1C0jhVFtlzg==",
"cpu": [
"riscv64"
],
@@ -7523,9 +7523,9 @@
}
},
"node_modules/sass-embedded-linux-musl-x64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-x64/-/sass-embedded-linux-musl-x64-1.93.3.tgz",
"integrity": "sha512-A7wkrsHu2/I4Zpa0NMuPGkWDVV7QGGytxGyUq3opSXgAexHo/vBPlGoDXoRlSdex0cV+aTMRPjoGIfdmNlHwyg==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-x64/-/sass-embedded-linux-musl-x64-1.96.0.tgz",
"integrity": "sha512-sAQtUQ8fFNxnxSf3fncOh892Hfxa4PW4e5qrnSE0Y1IGV/wsTzk7m5Z6IeT7sa3BsvXh5TFN6+JGbUoOJ5RigA==",
"cpu": [
"x64"
],
@@ -7540,9 +7540,9 @@
}
},
"node_modules/sass-embedded-linux-riscv64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-riscv64/-/sass-embedded-linux-riscv64-1.93.3.tgz",
"integrity": "sha512-vWkW1+HTF5qcaHa6hO80gx/QfB6GGjJUP0xLbnAoY4pwEnw5ulGv6RM8qYr8IDhWfVt/KH+lhJ2ZFxnJareisQ==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-riscv64/-/sass-embedded-linux-riscv64-1.96.0.tgz",
"integrity": "sha512-Bf6bAjuUm6sfGHo0XoZEstjVkEWwmmtOSomGoPuAwXFS9GQnFcqDz9EXKNkZEOsQi2D+aDeDxs8HcU9/OLMT9g==",
"cpu": [
"riscv64"
],
@@ -7557,9 +7557,9 @@
}
},
"node_modules/sass-embedded-linux-x64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-x64/-/sass-embedded-linux-x64-1.93.3.tgz",
"integrity": "sha512-k6uFxs+e5jSuk1Y0niCwuq42F9ZC5UEP7P+RIOurIm8w/5QFa0+YqeW+BPWEW5M1FqVOsNZH3qGn4ahqvAEjPA==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-x64/-/sass-embedded-linux-x64-1.96.0.tgz",
"integrity": "sha512-U4GROkS0XM6ekqs/ubroWwFAGY9N35wqrt5q6Y+MJCpTK5bHPHlgFo7J75ZUSaEObL+UrDqvMDQkCdYEFiiQbg==",
"cpu": [
"x64"
],
@@ -7574,9 +7574,9 @@
}
},
"node_modules/sass-embedded-unknown-all": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-unknown-all/-/sass-embedded-unknown-all-1.93.3.tgz",
"integrity": "sha512-o5wj2rLpXH0C+GJKt/VpWp6AnMsCCbfFmnMAttcrsa+U3yrs/guhZ3x55KAqqUsE8F47e3frbsDL+1OuQM5DAA==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-unknown-all/-/sass-embedded-unknown-all-1.96.0.tgz",
"integrity": "sha512-OHzGEr2VElK2SaQdkkTX0O0KwTbiv1N/EhnHgzXYaZWOTvv0gxEfR7q7x/oScCBIZc2x8dSfvThfBnohIClo/w==",
"dev": true,
"license": "MIT",
"optional": true,
@@ -7587,13 +7587,13 @@
"!win32"
],
"dependencies": {
"sass": "1.93.3"
"sass": "1.96.0"
}
},
"node_modules/sass-embedded-win32-arm64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-win32-arm64/-/sass-embedded-win32-arm64-1.93.3.tgz",
"integrity": "sha512-0dOfT9moy9YmBolodwYYXtLwNr4jL4HQC9rBfv6mVrD7ud8ue2kDbn+GVzj1hEJxvEexVSmDCf7MHUTLcGs9xQ==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-win32-arm64/-/sass-embedded-win32-arm64-1.96.0.tgz",
"integrity": "sha512-KKz1h5pr45fwrKcxrxHsujo3f/HgVkX64YNJ9PRPuOuX7lU8g18IEgDxoTGQ64PPBQ5RXOt6jxpT+x2OLPVnCw==",
"cpu": [
"arm64"
],
@@ -7608,9 +7608,9 @@
}
},
"node_modules/sass-embedded-win32-x64": {
"version": "1.93.3",
"resolved": "https://registry.npmjs.org/sass-embedded-win32-x64/-/sass-embedded-win32-x64-1.93.3.tgz",
"integrity": "sha512-wHFVfxiS9hU/sNk7KReD+lJWRp3R0SLQEX4zfOnRP2zlvI2X4IQR5aZr9GNcuMP6TmNpX0nQPZTegS8+h9RrEg==",
"version": "1.96.0",
"resolved": "https://registry.npmjs.org/sass-embedded-win32-x64/-/sass-embedded-win32-x64-1.96.0.tgz",
"integrity": "sha512-MDreKaWcgiyKD5YPShaRvUBoe5dC2y8IPJK49G7iQjoMfw9INDCBkDdLcz00Mn0eJq4nJJp5UEE98M6ljIrBRg==",
"cpu": [
"x64"
],

View File

@@ -445,23 +445,42 @@
v-if='cot.properties.remarks !== undefined'
class='col-12 py-2'
>
<div class='col-12'>
<div
class='d-flex align-items-center cursor-pointer user-select-none py-2 px-2 rounded transition-all mx-2'
:class='{ "bg-accent": remarksExpanded, "hover": !remarksExpanded }'
@click='remarksExpanded = !remarksExpanded'
>
<IconBlockquote
:size='18'
stroke='1'
color='#6b7990'
class='ms-2 me-1'
/>
<label class='subheader user-select-none'>Remarks</label>
<label class='subheader cursor-pointer m-0'>Remarks</label>
<div class='ms-auto d-flex align-items-center'>
<IconChevronDown
class='transition-transform'
:class='{ "rotate-180": !remarksExpanded }'
:size='18'
/>
</div>
</div>
<div class='px-2'>
<CopyField
:model-value='cot.properties.remarks'
:rows='10'
:edit='is_editable'
:hover='is_editable'
@submit='updateProperty("remarks", $event)'
/>
<div
class='grid-transition'
:class='{ expanded: remarksExpanded }'
>
<div class='overflow-hidden'>
<div class='px-2 pt-2'>
<CopyField
:model-value='cot.properties.remarks'
:rows='10'
:edit='is_editable'
:hover='is_editable'
@submit='updateProperty("remarks", $event)'
/>
</div>
</div>
</div>
</div>
@@ -517,46 +536,10 @@
:links='cot.properties.links'
/>
<div
<PropertyTimes
v-if='!cot.properties.archived'
class='col-12 pb-2'
>
<div class='d-flex mx-3'>
<label class='subheader user-select-none'>Times</label>
<div class='ms-auto cursor-pointer text-blue subheader'>
<span
v-if='time === "relative"'
@click='time = "absolute"'
>Absolute</span>
<span
v-if='time === "absolute"'
@click='time = "relative"'
>Relative</span>
</div>
</div>
<div class='table-responsive rounded mx-2 py-2 px-2'>
<table class='table card-table table-hover table-vcenter datatable'>
<thead>
<tr>
<th>Key</th>
<th>Value</th>
</tr>
</thead>
<tbody class='bg-accent'>
<tr>
<td>Time</td><td v-text='timeProp' />
</tr>
<tr>
<td>Start</td><td v-text='startProp' />
</tr>
<tr>
<td>Stale</td><td v-text='staleProp' />
</tr>
</tbody>
</table>
</div>
</div>
:cot='cot'
/>
<PropertySensor
v-if='cot.properties.sensor !== undefined'
@@ -573,127 +556,10 @@
:model-value='cot.properties.milsym.id'
/>
<div
<PropertyStyle
v-if='is_editable && !cot.is_self'
class='pb-2 col-12'
>
<div class='col-12'>
<IconPaint
:size='18'
stroke='1'
color='#6b7990'
class='ms-2 me-1'
/>
<label class='subheader user-select-none'>Style</label>
</div>
<div class='px-2 py-3'>
<div class='row g-2 rounded px-2 bg-accent pb-2'>
<template v-if='cot.geometry.type === "Point"'>
<div class='col-12'>
<IconSelect
:model-value='cot.properties.icon'
label='Point Icon'
:size='32'
stroke='1'
@update:model-value='updatePropertyIcon($event)'
/>
</div>
<div class='col-12'>
<label class='subheader user-select-none'>Point Color</label>
<TablerInput
:model-value='cot.properties["marker-color"]'
label=''
default='#FFFFFF'
type='color'
class='pb-2'
@update:model-value='updateProperty("marker-color", $event)'
/>
</div>
<div class='col-12'>
<label class='subheader user-select-none'>Point Opacity</label>
<TablerRange
:model-value='cot.properties["marker-opacity"]'
label=''
:default='1'
:min='0'
:max='1'
:step='0.01'
@update:model-value='updateProperty("marker-opacity", $event)'
/>
</div>
</template>
<template v-else>
<div class='col-12'>
<label class='subheader user-select-none'>Line Colour</label>
<TablerInput
:model-value='cot.properties["stroke"]'
label=''
type='color'
@update:model-value='updateProperty("stroke", $event)'
/>
</div>
<div class='col-12'>
<label class='subheader user-select-none'>Line Style</label>
<TablerEnum
:model-value='cot.properties["stroke-style"]'
label=''
:options='["solid", "dashed", "dotted", "outlined"]'
default='solid'
@update:model-value='updateProperty("stroke-style", $event)'
/>
</div>
<div class='col-12'>
<label class='subheader user-select-none'>Line Thickness</label>
<TablerRange
:model-value='cot.properties["stroke-width"]'
label=''
:default='1'
:min='1'
:max='6'
:step='1'
@update:model-value='updateProperty("stroke-width", $event)'
/>
</div>
<div class='col-12'>
<label class='subheader user-select-none'>Line Opacity</label>
<TablerRange
:model-value='cot.properties["stroke-opacity"]'
label=''
:default='1'
:min='0'
:max='1'
:step='0.01'
@update:model-value='updateProperty("stroke-opacity", $event)'
/>
</div>
</template>
<template v-if='cot.geometry.type === "Polygon"'>
<div class='col-12'>
<label class='subheader user-select-none'>Fill Colour</label>
<TablerInput
:model-value='cot.properties["fill"]'
label=''
type='color'
@update:model-value='updateProperty("fill", $event)'
/>
</div>
<div class='col-12 round'>
<label class='subheader user-select-none'>Fill Opacity</label>
<TablerRange
:model-value='cot.properties["fill-opacity"]'
label=''
:default='1'
:min='0'
:max='1'
:step='0.01'
@update:model-value='updateProperty("fill-opacity", $event)'
/>
</div>
</template>
</div>
</div>
</div>
:cot='cot'
/>
<div
v-if='cot.properties.creator && cot.properties.creator'
@@ -806,17 +672,13 @@ import { OriginMode } from '../../base/cot.ts'
import Subscription from '../../base/subscription.ts'
import {
TablerNone,
TablerInput,
TablerDelete,
TablerToggle,
TablerEnum,
TablerRange,
TablerDropdown,
TablerIconButton,
} from '@tak-ps/vue-tabler';
import CopyField from './util/CopyField.vue';
import IconSelect from '../util/IconSelect.vue';
import Share from './util/Share.vue';
import LineLength from './util/LineLength.vue';
import PolygonArea from './util/PolygonArea.vue';
@@ -835,6 +697,8 @@ import Breadcrumb from './util/Breadcrumb.vue';
import PropertyElevation from './util/PropertyElevation.vue';
import PropertyAttachments from './util/PropertyAttachments.vue';
import PropertyLinks from './util/PropertyLinks.vue';
import PropertyTimes from './util/PropertyTimes.vue';
import PropertyStyle from './util/PropertyStyle.vue';
import {
IconPencil,
IconFence,
@@ -855,13 +719,11 @@ import {
IconShare2,
IconZoomPan,
IconCode,
IconPaint,
IconAffiliate,
IconInfoCircle,
IconPaperclip,
} from '@tabler/icons-vue';
import Subscriptions from './util/Subscriptions.vue';
import timediff from '../../timediff.ts';
import { std } from '../../std.ts';
import { useMapStore } from '../../stores/map.ts';
import { useFloatStore } from '../../stores/float.ts';
@@ -887,10 +749,10 @@ const chevrons = ref<Set<string>>(new Set());
const username = ref<string | undefined>();
const type = ref<COTType | undefined>();
const mode = ref('default');
const remarksExpanded = ref(true);
const currentTime = ref(new Date());
const interval = ref<ReturnType<typeof setInterval> | undefined>();
const time = ref('relative');
watch(cot, async () => {
if (cot.value) {
@@ -977,21 +839,6 @@ async function load_cot() {
}
}
const staleProp = computed(() => {
if (!cot.value) return '';
return (currentTime.value && time.value === 'relative') ? timediff(cot.value.properties.stale) : cot.value.properties.stale;
});
const startProp = computed(() => {
if (!cot.value) return '';
return (currentTime.value && time.value === 'relative') ? timediff(cot.value.properties.start) : cot.value.properties.start;
});
const timeProp = computed(() => {
if (!cot.value) return '';
return (currentTime.value && time.value === 'relative') ? timediff(cot.value.properties.time) : cot.value.properties.time;
});
// eslint-disable-next-line @typescript-eslint/no-explicit-any
function updateProperty(key: string, event: any) {
if (!cot.value) return;
@@ -1007,37 +854,6 @@ function updateProperty(key: string, event: any) {
}
}
function updatePropertyIcon(event: string | null) {
if (!cot.value) return;
if (event) {
event = event.replace(/\.png$/g, '').replace(':', '/');
}
if (
event
&& (
!cot.value.properties.icon
|| (
cot.value.properties.icon
&& event !== cot.value.properties.icon
)
)
) {
cot.value.properties.icon = event;
cot.value.properties["marker-color"] = '#FFFFFF';
cot.value.update({});
} else if (cot.value.properties.icon && !event) {
if (cot.value.properties.type !== 'u-d-p') {
cot.value.properties.icon = cot.value.properties.type;
} else {
cot.value.properties.icon = undefined;
}
cot.value.update({});
}
}
function updatePropertyType(type: string): void {
if (!cot.value) return;
@@ -1096,3 +912,23 @@ async function deleteCOT() {
router.push('/');
}
</script>
<style scoped>
.grid-transition {
display: grid;
grid-template-rows: 0fr;
transition: grid-template-rows 0.3s ease-out;
}
.grid-transition.expanded {
grid-template-rows: 1fr;
}
.rotate-180 {
transform: rotate(-90deg);
}
.transition-transform {
transition: transform 0.3s ease-out;
}
</style>

View File

@@ -0,0 +1,223 @@
<template>
<div class='col-12 pb-2'>
<div
class='d-flex align-items-center cursor-pointer user-select-none py-2 px-2 rounded transition-all mx-2'
:class='{ "bg-accent": expanded, "hover": !expanded }'
@click='expanded = !expanded'
>
<IconPaint
:size='18'
stroke='1'
color='#6b7990'
class='ms-2 me-1'
/>
<label class='subheader cursor-pointer m-0'>Style</label>
<div class='ms-auto d-flex align-items-center'>
<IconChevronDown
class='transition-transform'
:class='{ "rotate-180": !expanded }'
:size='18'
/>
</div>
</div>
<div
class='grid-transition'
:class='{ expanded: expanded }'
>
<div class='overflow-hidden'>
<div class='px-2 py-3'>
<div class='row g-2 rounded px-2 bg-accent pb-2'>
<template v-if='cot.geometry.type === "Point"'>
<div class='col-12'>
<IconSelect
:model-value='cot.properties.icon'
label='Point Icon'
:size='32'
stroke='1'
@update:model-value='updatePropertyIcon($event)'
/>
</div>
<div class='col-12'>
<label class='subheader user-select-none'>Point Color</label>
<TablerInput
:model-value='cot.properties["marker-color"]'
label=''
default='#FFFFFF'
type='color'
class='pb-2'
@update:model-value='updateProperty("marker-color", $event)'
/>
</div>
<div class='col-12'>
<label class='subheader user-select-none'>Point Opacity</label>
<TablerRange
:model-value='cot.properties["marker-opacity"]'
label=''
:default='1'
:min='0'
:max='1'
:step='0.01'
@update:model-value='updateProperty("marker-opacity", $event)'
/>
</div>
</template>
<template v-else>
<div class='col-12'>
<label class='subheader user-select-none'>Line Colour</label>
<TablerInput
:model-value='cot.properties["stroke"]'
label=''
type='color'
@update:model-value='updateProperty("stroke", $event)'
/>
</div>
<div class='col-12'>
<label class='subheader user-select-none'>Line Style</label>
<TablerEnum
:model-value='cot.properties["stroke-style"]'
label=''
:options='["solid", "dashed", "dotted", "outlined"]'
default='solid'
@update:model-value='updateProperty("stroke-style", $event)'
/>
</div>
<div class='col-12'>
<label class='subheader user-select-none'>Line Thickness</label>
<TablerRange
:model-value='cot.properties["stroke-width"]'
label=''
:default='1'
:min='1'
:max='6'
:step='1'
@update:model-value='updateProperty("stroke-width", $event)'
/>
</div>
<div class='col-12'>
<label class='subheader user-select-none'>Line Opacity</label>
<TablerRange
:model-value='cot.properties["stroke-opacity"]'
label=''
:default='1'
:min='0'
:max='1'
:step='0.01'
@update:model-value='updateProperty("stroke-opacity", $event)'
/>
</div>
</template>
<template v-if='cot.geometry.type === "Polygon"'>
<div class='col-12'>
<label class='subheader user-select-none'>Fill Colour</label>
<TablerInput
:model-value='cot.properties["fill"]'
label=''
type='color'
@update:model-value='updateProperty("fill", $event)'
/>
</div>
<div class='col-12 round'>
<label class='subheader user-select-none'>Fill Opacity</label>
<TablerRange
:model-value='cot.properties["fill-opacity"]'
label=''
:default='1'
:min='0'
:max='1'
:step='0.01'
@update:model-value='updateProperty("fill-opacity", $event)'
/>
</div>
</template>
</div>
</div>
</div>
</div>
</div>
</template>
<script setup lang='ts'>
import { ref } from 'vue';
import { IconPaint, IconChevronDown } from '@tabler/icons-vue';
import {
TablerInput,
TablerRange,
TablerEnum,
} from '@tak-ps/vue-tabler';
import IconSelect from '../../util/IconSelect.vue';
import type COT from '../../../base/cot';
const props = defineProps<{
cot: COT
}>();
const expanded = ref(false);
// eslint-disable-next-line @typescript-eslint/no-explicit-any
function updateProperty(key: string, event: any) {
if (!props.cot) return;
if (typeof event === 'string' || typeof event === 'number') {
if (props.cot.properties[key] !== event) {
props.cot.properties[key] = event;
props.cot.update({})
}
} else {
props.cot.properties[key] = event;
props.cot.update({})
}
}
function updatePropertyIcon(event: string | null) {
if (!props.cot) return;
if (event) {
event = event.replace(/\.png$/g, '').replace(':', '/');
}
if (
event
&& (
!props.cot.properties.icon
|| (
props.cot.properties.icon
&& event !== props.cot.properties.icon
)
)
) {
props.cot.properties.icon = event;
props.cot.properties["marker-color"] = '#FFFFFF';
props.cot.update({});
} else if (props.cot.properties.icon && !event) {
if (props.cot.properties.type !== 'u-d-p') {
props.cot.properties.icon = props.cot.properties.type;
} else {
props.cot.properties.icon = undefined;
}
props.cot.update({});
}
}
</script>
<style scoped>
.grid-transition {
display: grid;
grid-template-rows: 0fr;
transition: grid-template-rows 0.3s ease-out;
}
.grid-transition.expanded {
grid-template-rows: 1fr;
}
.rotate-180 {
transform: rotate(-90deg);
}
.transition-transform {
transition: transform 0.3s ease-out;
}
</style>

View File

@@ -0,0 +1,119 @@
<template>
<div class='col-12 pb-2'>
<div
class='d-flex align-items-center cursor-pointer user-select-none py-2 px-2 rounded transition-all mx-2'
:class='{ "bg-accent": expanded, "hover": !expanded }'
@click='expanded = !expanded'
>
<IconClock
:size='18'
stroke='1'
color='#6b7990'
class='ms-2 me-1'
/>
<label class='subheader cursor-pointer m-0'>Times</label>
<div class='ms-auto d-flex align-items-center'>
<IconChevronDown
class='transition-transform'
:class='{ "rotate-180": !expanded }'
:size='18'
/>
</div>
</div>
<div
class='grid-transition'
:class='{ expanded: expanded }'
>
<div class='overflow-hidden'>
<div class='d-flex mx-3 pt-2 pb-2'>
<div class='ms-auto cursor-pointer text-blue subheader'>
<span
v-if='mode === "relative"'
@click='mode = "absolute"'
>Absolute</span>
<span
v-if='mode === "absolute"'
@click='mode = "relative"'
>Relative</span>
</div>
</div>
<div class='list-group list-group-flush bg-accent rounded mx-2 mb-2'>
<div class='list-group-item bg-transparent d-flex justify-content-between align-items-center border-0'>
<span class='text-muted'>Time</span>
<span class='font-weight-medium'>{{ timeProp }}</span>
</div>
<div class='list-group-item bg-transparent d-flex justify-content-between align-items-center border-0'>
<span class='text-muted'>Start</span>
<span class='font-weight-medium'>{{ startProp }}</span>
</div>
<div class='list-group-item bg-transparent d-flex justify-content-between align-items-center border-0'>
<span class='text-muted'>Stale</span>
<span class='font-weight-medium'>{{ staleProp }}</span>
</div>
</div>
</div>
</div>
</div>
</template>
<script setup lang='ts'>
import { ref, computed, onMounted, onUnmounted } from 'vue';
import { IconClock, IconChevronDown } from '@tabler/icons-vue';
import timediff from '../../../timediff';
import type COT from '../../../base/cot';
const props = defineProps<{
cot: COT
}>();
const expanded = ref(false);
const mode = ref('relative');
const currentTime = ref(new Date());
const interval = ref<ReturnType<typeof setInterval> | undefined>();
const staleProp = computed(() => {
if (!props.cot) return '';
return (currentTime.value && mode.value === 'relative') ? timediff(props.cot.properties.stale) : props.cot.properties.stale;
});
const startProp = computed(() => {
if (!props.cot) return '';
return (currentTime.value && mode.value === 'relative') ? timediff(props.cot.properties.start) : props.cot.properties.start;
});
const timeProp = computed(() => {
if (!props.cot) return '';
return (currentTime.value && mode.value === 'relative') ? timediff(props.cot.properties.time) : props.cot.properties.time;
});
onMounted(() => {
interval.value = setInterval(() => {
currentTime.value = new Date();
}, 1000);
});
onUnmounted(() => {
if (interval.value) clearInterval(interval.value);
});
</script>
<style scoped>
.grid-transition {
display: grid;
grid-template-rows: 0fr;
transition: grid-template-rows 0.3s ease-out;
}
.grid-transition.expanded {
grid-template-rows: 1fr;
}
.rotate-180 {
transform: rotate(-90deg);
}
.transition-transform {
transition: transform 0.3s ease-out;
}
</style>