From 8bbaa31845601350592b8445dd09c4c9c2a3cc80 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Juan=20Camilo=20Gonz=C3=A1lez?= Date: Mon, 23 Sep 2024 13:25:38 -0500 Subject: [PATCH] =?UTF-8?q?=F0=9F=93=88=20Nueva=20interfaz=20y=20opci?= =?UTF-8?q?=C3=B3n=20de=20visualizar=20apariciones?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 24 ++- package.json | 9 +- src/componentes/categorias.ts | 92 +++++++++ src/componentes/predicciones.ts | 77 +++++++ src/programa.ts | 291 +++++++++++++++----------- src/scss/estilos.scss | 177 +++++++++++----- src/tipos.ts | 12 ++ src/utilidades/ayudas.ts | 12 ++ src/utilidades/colores.ts | 350 ++++++++++++++++++++++++++++++++ yarn.lock | 289 ++++++++++---------------- 10 files changed, 967 insertions(+), 366 deletions(-) create mode 100644 src/componentes/categorias.ts create mode 100644 src/tipos.ts create mode 100644 src/utilidades/ayudas.ts create mode 100644 src/utilidades/colores.ts diff --git a/index.html b/index.html index 780b2fd..6f43f16 100644 --- a/index.html +++ b/index.html @@ -52,6 +52,8 @@ > + +
@@ -59,8 +61,11 @@
- - + + + + +

Confidence level:

@@ -72,15 +77,18 @@ confidence detects less "objects" but the model has more confidence it is detecting the correct object. The default is 50% - just in the middle of confidence and ability to detect.

- + +
+
+ +
+
+ Video + Heatmap
+
-
diff --git a/package.json b/package.json index 0b65772..b0d5c0f 100644 --- a/package.json +++ b/package.json @@ -16,14 +16,15 @@ }, "devDependencies": { "autoprefixer": "^10.4.20", - "cssnano": "^7.0.5", - "postcss": "^8.4.45", + "cssnano": "^7.0.6", + "postcss": "^8.4.47", "prettier": "^3.3.3", - "sass": "^1.78.0", + "sass": "^1.79.3", "typescript": "^5.5.4", - "vite": "^5.4.3" + "vite": "^5.4.7" }, "dependencies": { + "@mediapipe/tasks-vision": "^0.10.16", "@tensorflow-models/coco-ssd": "^2.2.3", "@tensorflow/tfjs": "^4.21.0", "@tensorflow/tfjs-backend-cpu": "^4.21.0", diff --git a/src/componentes/categorias.ts b/src/componentes/categorias.ts new file mode 100644 index 0000000..8b0441a --- /dev/null +++ b/src/componentes/categorias.ts @@ -0,0 +1,92 @@ +import coloresAMil from '../utilidades/colores'; + +const categorias = [ + 'person', + 'bicycle', + 'car', + 'motorcycle', + 'airplane', + 'bus', + 'train', + 'truck', + 'boat', + 'traffic light', + 'fire hydrant', + 'stop sign', + 'parking meter', + 'bench', + 'bird', + 'cat', + 'dog', + 'horse', + 'sheep', + 'cow', + 'elephant', + 'bear', + 'zebra', + 'giraffe', + 'backpack', + 'umbrella', + 'handbag', + 'tie', + 'suitcase', + 'frisbee', + 'skis', + 'snowboard', + 'sports ball', + 'kite', + 'baseball bat', + 'baseball glove', + 'skateboard', + 'surfboard', + 'tennis racket', + 'bottle', + 'wine glass', + 'cup', + 'fork', + 'knife', + 'spoon', + 'bowl', + 'banana', + 'apple', + 'sandwich', + 'orange', + 'broccoli', + 'carrot', + 'hot dog', + 'pizza', + 'donut', + 'cake', + 'chair', + 'couch', + 'potted plant', + 'bed', + 'dining table', + 'toilet', + 'tv', + 'laptop', + 'mouse', + 'remote', + 'keyboard', + 'cell phone', + 'microwave', + 'oven', + 'toaster', + 'sink', + 'refrigerator', + 'book', + 'clock', + 'vase', + 'scissors', + 'teddy bear', + 'hair drier', + 'toothbrush', +]; + +const categoriasConColor: { [nombre: string]: string } = {}; + +categorias.forEach((categoria, i) => { + categoriasConColor[categoria] = coloresAMil[i]; +}); + +export default categoriasConColor; diff --git a/src/componentes/predicciones.ts b/src/componentes/predicciones.ts index e69de29..d055a58 100644 --- a/src/componentes/predicciones.ts +++ b/src/componentes/predicciones.ts @@ -0,0 +1,77 @@ +import type { Aparicion, Cuadro } from '../tipos'; +import categoriasConColor from './categorias'; + +const video = document.getElementById('video') as HTMLVideoElement; +const lienzo2 = document.getElementById('lienzo2') as HTMLCanvasElement; +const lienzo3 = document.getElementById('lienzo3') as HTMLCanvasElement; +const ctx3 = lienzo3.getContext('2d'); +const listaCategorias = document.getElementById('listaCategorias') as HTMLDivElement; +let categorias: { [categoria: string]: { contador: HTMLSpanElement; apariciones: Aparicion[] } } = {}; + +export default { + reiniciar: () => { + listaCategorias.innerHTML = ''; + categorias = {}; + }, + + agregar: (nombreCategoria: string, confianza: number, area: Cuadro, tiempo: number) => { + const categoria = categorias[nombreCategoria]; + + if (!categoria) { + const elemento = document.createElement('div'); + const contador = document.createElement('span'); + const barra = document.createElement('span'); + const color = categoriasConColor[nombreCategoria]; + + elemento.className = 'categoria'; + elemento.innerText = nombreCategoria; + contador.className = 'contadorCategoria'; + contador.innerText = '1'; + barra.className = 'barraColor'; + barra.style.backgroundColor = color; + + elemento.appendChild(barra); + elemento.appendChild(contador); + listaCategorias.appendChild(elemento); + + elemento.onclick = () => { + console.log(`Apariciones de categoría ${nombreCategoria}`, categorias[nombreCategoria].apariciones); + }; + + elemento.onmouseenter = () => { + if (!ctx3) return; + + lienzo2.classList.remove('visible'); + lienzo3.classList.add('visible'); + + ctx3.clearRect(0, 0, lienzo3.width, lienzo3.height); + + const { apariciones } = categorias[nombreCategoria]; + + if (apariciones && apariciones.length) { + ctx3.fillStyle = color; + ctx3.globalAlpha = 0.05; + + apariciones.forEach(({ area }) => { + ctx3.fillRect(area.x, area.y, area.alto, area.alto); + }); + } + }; + + elemento.onmouseleave = () => { + lienzo2.classList.add('visible'); + lienzo3.classList.remove('visible'); + }; + + categorias[nombreCategoria] = { contador, apariciones: [] }; + } else { + categoria.contador.innerText = `${categoria.apariciones.length + 1}`; + } + + categorias[nombreCategoria].apariciones.push({ tiempo, area, confianza }); + }, + + apariciones: () => { + return categorias.apariciones; + }, +}; diff --git a/src/programa.ts b/src/programa.ts index a10f1d1..cdc75e8 100644 --- a/src/programa.ts +++ b/src/programa.ts @@ -1,32 +1,51 @@ import './scss/estilos.scss'; -import '@tensorflow/tfjs-backend-cpu'; -import '@tensorflow/tfjs-backend-webgl'; -import { load } from '@tensorflow-models/coco-ssd'; import { imprimirMensaje } from './componentes/mensajes'; -import type { ObjectDetection, DetectedObject } from '@tensorflow-models/coco-ssd'; import { controlesPantallaCompleta } from './componentes/pantallaCompleta'; +import { FilesetResolver, ObjectDetector } from '@mediapipe/tasks-vision'; +import predicciones from './componentes/predicciones'; +import categoriasConColor from './componentes/categorias'; const lista = document.getElementById('listaVideos') as HTMLUListElement; const video = document.getElementById('video') as HTMLVideoElement; +const lienzo = document.getElementById('lienzo1') as HTMLCanvasElement; +const ctx = lienzo.getContext('2d') as CanvasRenderingContext2D; +const lienzo2 = document.getElementById('lienzo2') as HTMLCanvasElement; +const ctx2 = lienzo2.getContext('2d') as CanvasRenderingContext2D; +const lienzo3 = document.getElementById('lienzo3') as HTMLCanvasElement; -const lienzo = document.getElementById('lienzo') as HTMLCanvasElement; -const ctx = lienzo?.getContext('2d'); -const listaCategorias = document.getElementById('listaCategorias') as HTMLDivElement; -const barraDeRangos = document.getElementById('barraDeRangos') as HTMLInputElement; -const valorConfianza = document.getElementById('valorConfianza') as HTMLInputElement; - -let apariciones = {}; -let modelo: ObjectDetection; let contadorAnim: number; let nombreVideo = ''; +let escala = { x: 1, y: 1 }; +const verVideo = document.getElementById('verVideo'); +const verVis = document.getElementById('verVis'); + +if (verVideo) { + verVideo.onclick = () => { + const activo = verVideo.classList.contains('activo'); + + if (activo) { + verVideo.classList.remove('activo'); + video.classList.remove('visible'); + } else { + verVideo.classList.add('activo'); + video.classList.add('visible'); + } + }; +} -const actualizarConfianza = () => { - const valor = +barraDeRangos.value; - valorConfianza.innerText = `${Math.floor(valor * 100)}%`; -}; - -controlesPantallaCompleta(); -actualizarConfianza(); +if (verVis) { + verVis.onclick = () => { + const activo = verVis.classList.contains('activo'); + + if (activo) { + verVis.classList.remove('activo'); + lienzo2.classList.remove('visible'); + } else { + verVis.classList.add('activo'); + lienzo2.classList.add('visible'); + } + }; +} function cargarVideo(nombre: string, formato: string) { if (!video) return; @@ -37,102 +56,12 @@ function cargarVideo(nombre: string, formato: string) { video.appendChild(fuente); nombreVideo = nombre; video.load(); + predicciones.reiniciar(); } -video.onloadstart = () => { - const nombreArchivo = video.querySelector('source')?.src.split('/').pop(); - imprimirMensaje(`Loading video: ${nombreArchivo}`); -}; - -video.onloadedmetadata = () => { - video.width = lienzo.width = video.videoWidth; - video.height = lienzo.height = video.videoHeight; - if (!ctx) return; - - ctx.lineWidth = 2; - ctx.strokeStyle = 'red'; - imprimirMensaje('Video ready'); -}; - -video.onpause = () => { - window.cancelAnimationFrame(contadorAnim); -}; - -video.onplay = () => { - contadorAnim = requestAnimationFrame(verVideo); -}; - -barraDeRangos.oninput = actualizarConfianza; - -document.getElementById('downloadbutton')?.addEventListener( - 'click', - () => { - download(`apariciones-${nombreVideo}.json`, JSON.stringify(apariciones)); - }, - false -); - -async function verVideo() { - if (!ctx) return; - if (video.readyState > 1) { - const predicciones = await modelo.detect(video, 20, +barraDeRangos.value); - ctx.clearRect(0, 0, lienzo.width, lienzo.height); - - predicciones.forEach((prediccion) => { - const [x, y, ancho, alto] = prediccion.bbox; - const { class: categoria } = prediccion; - const texto = categoria + ` - ${(prediccion.score * 100) | 0}%`; - ctx.beginPath(); - ctx.rect(x, y, ancho, alto); - ctx.stroke(); - ctx.save(); - ctx.fillStyle = 'black'; - ctx.fillRect(x, y, ctx.measureText(texto).width, 20); - ctx.fillStyle = 'white'; - ctx.fillText(texto, x, y + 13); - ctx.restore(); - detector(prediccion); - }); - } - - contadorAnim = requestAnimationFrame(verVideo); -} - -function detector(prediccion: DetectedObject) { - if (!apariciones.hasOwnProperty(prediccion.class)) { - const nombreCategoria = prediccion.class; - apariciones[nombreCategoria] = []; - const elemento = document.createElement('div'); - elemento.className = 'categoria'; - elemento.innerText = nombreCategoria; - listaCategorias.appendChild(elemento); - elemento.onclick = () => { - console.log(`Apariciones de categoría ${prediccion.class}`, apariciones[nombreCategoria]); - }; - } - - apariciones[prediccion.class].push({ - tiempo: video.currentTime, - area: prediccion.bbox, - confianza: prediccion.score, - }); -} - -function download(nombre: string, datos: string) { - const enlace = document.createElement('a'); - enlace.setAttribute('href', 'data:text/plain;charset=utf-8, ' + encodeURIComponent(datos)); - enlace.setAttribute('download', nombre); - document.body.appendChild(enlace); - enlace.click(); -} - -async function inicio() { +async function crearMenuVideos() { const videos = await fetch(`${import.meta.env.BASE_URL}/listaVideos.json`).then((res) => res.json()); - - imprimirMensaje('Loading model, this can take some time...'); - modelo = await load(); - imprimirMensaje('Model loaded, ready to play videos.'); - + /** Crear lista de videos disponibles */ videos.forEach(({ nombre, formato }) => { const btn = document.createElement('li'); btn.classList.add('videoBtn'); @@ -141,15 +70,143 @@ async function inicio() { btn.onclick = () => { const seleccionado = document.querySelector('.seleccionado'); - apariciones = {}; - listaCategorias.innerHTML = ''; - if (seleccionado) seleccionado.classList.remove('seleccionado'); - btn.classList.add('seleccionado'); cargarVideo(nombre, formato); }; }); } -inicio(); +async function inicio() { + const barraDeRangos = document.getElementById('barraDeRangos') as HTMLInputElement; + const valorConfianza = document.getElementById('valorConfianza') as HTMLInputElement; + + imprimirMensaje('Loading model, this can take some time...'); + const vision = await FilesetResolver.forVisionTasks('https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/wasm'); + + const modelo = await ObjectDetector.createFromOptions(vision, { + baseOptions: { + modelAssetPath: `https://storage.googleapis.com/mediapipe-models/object_detector/efficientdet_lite0/float16/1/efficientdet_lite0.tflite`, + delegate: 'GPU', + }, + scoreThreshold: +barraDeRangos.value, + runningMode: 'VIDEO', + }); + + imprimirMensaje('Model loaded, ready to play videos.'); + + await crearMenuVideos(); + + video.onloadstart = () => { + const nombreArchivo = video.querySelector('source')?.src.split('/').pop(); + imprimirMensaje(`Loading video: ${nombreArchivo}`); + }; + + video.onloadedmetadata = () => { + escalar(); + imprimirMensaje('Video ready'); + }; + + video.onpause = () => { + window.cancelAnimationFrame(contadorAnim); + }; + + video.onplay = () => { + contadorAnim = requestAnimationFrame(verVideo); + }; + + let tiempoAnterior = -1; + + async function verVideo() { + let tiempoAhora = performance.now(); + if (video.currentTime !== tiempoAnterior) { + tiempoAnterior = video.currentTime; + const { detections } = modelo.detectForVideo(video, tiempoAhora); + ctx.clearRect(0, 0, lienzo.width, lienzo.height); + + detections.forEach((prediccion) => { + if (prediccion.boundingBox) { + const { originX: x0, originY: y0, width: ancho0, height: alto0 } = prediccion.boundingBox; + const { categoryName: categoria, score } = prediccion.categories[0]; + + const x = x0 * escala.x; + const y = y0 * escala.y; + const ancho = ancho0 * escala.x; + const alto = alto0 * escala.y; + /** Vista normal */ + const texto = categoria + ` - ${(score * 100) | 0}%`; + ctx.strokeStyle = categoriasConColor[categoria]; + ctx.beginPath(); + ctx.rect(x, y, ancho, alto); + ctx.stroke(); + ctx.save(); + ctx.fillStyle = 'black'; + ctx.fillRect(x, y, ctx.measureText(texto).width, 20); + ctx.fillStyle = 'white'; + ctx.fillText(texto, x, y + 13); + ctx.restore(); + + /** Vista Visualización 1 */ + ctx2.save(); + ctx2.fillStyle = categoriasConColor[categoria]; + ctx2.fillRect(x, y, ancho, alto); + ctx2.restore(); + + predicciones.agregar(categoria, score, { x, y, ancho, alto }, video.currentTime); + } + }); + } + contadorAnim = requestAnimationFrame(verVideo); + } + + let reloj: NodeJS.Timeout | null = null; + + async function actualizarConfianza() { + const valor = +barraDeRangos.value; + valorConfianza.innerText = `${Math.floor(valor * 100)}%`; + + if (reloj === null) { + reloj = setTimeout(() => { + modelo.setOptions({ scoreThreshold: +barraDeRangos.value }); + reloj = null; + }, 500); + } + } + + controlesPantallaCompleta(); + actualizarConfianza(); + + barraDeRangos.oninput = actualizarConfianza; + + function escalar() { + video.width = lienzo.width = lienzo2.width = lienzo3.width = video.clientWidth; + video.height = lienzo.height = lienzo2.height = lienzo3.height = video.clientHeight; + + if (lienzo.width > video.videoWidth) escala.x = lienzo.width / video.videoWidth; + else escala.x = video.videoWidth / lienzo.width; + if (lienzo.height > video.videoHeight) escala.y = lienzo.height / video.videoHeight; + else escala.y = video.videoHeight / lienzo.height; + + ctx.lineWidth = 2 * escala.x; + ctx.strokeStyle = 'red'; + ctx2.fillStyle = '#f56468'; + ctx2.globalAlpha = 0.01; + } +} + +const botonDescarga = document.getElementById('descargar'); + +if (botonDescarga) { + botonDescarga.addEventListener('click', () => { + const enlace = document.createElement('a'); + enlace.setAttribute( + 'href', + 'data:text/plain;charset=utf-8, ' + encodeURIComponent(JSON.stringify(predicciones.apariciones())) + ); + enlace.setAttribute('download', `apariciones-${nombreVideo}.json`); + document.body.appendChild(enlace); + enlace.click(); + }); +} + +inicio().catch(console.error); diff --git a/src/scss/estilos.scss b/src/scss/estilos.scss index 775ddaf..be111ac 100644 --- a/src/scss/estilos.scss +++ b/src/scss/estilos.scss @@ -1,8 +1,19 @@ //Fuentes de Google @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Martian+Mono:wght@100..800&display=swap'); //Variables de fuentes $Roboto: 'Roboto', sans-serif; +$altoMenu: 0px; +$altoContenido: calc(100vh - $altoMenu); + +:root { + --negro: #0d0917; + --fondo: #27184f; + --texto: #f56468; + --texto2: #ffea00; + --altoMenu: $altoMenu; +} html { box-sizing: border-box; @@ -21,16 +32,31 @@ body { padding: 0; } +ul { + margin: 0; + padding: 0; +} + main { display: flex; + font-family: 'Martian Mono', monospace; + font-optical-sizing: auto; + font-weight: 100; + font-style: normal; + font-variation-settings: 'wdth' 100; +} + +#menu { + height: $altoMenu; + width: 100%; + background-color: var(--negro); } #controles { - width: 12vw; - max-height: 100vh; + width: 15vw; + max-height: $altoContenido; overflow: auto; z-index: 99; - margin-right: 20px; display: block; &.oculto { @@ -43,91 +69,154 @@ main { padding: 0.5em; font-style: italic; text-align: center; - margin-bottom: 1em; + font-family: $Roboto; border-bottom: 1px dotted; visibility: visible; } #seccionVideo { - min-width: 40vw; width: 70vw; - height: 100vh; + height: $altoContenido; position: relative; + background-color: var(--negro); video { - height: 100vh; - width: auto; max-width: 70vw; + height: 100%; + width: auto; + margin: 0 auto; } - #lienzo { + .lienzo { position: absolute; pointer-events: none; width: auto; - height: 100vh; - max-width: 70vw; + height: $altoContenido; + left: 50%; + transform: translateX(-50%); + z-index: 1; + opacity: 0; + + &.visible { + opacity: 1; + } } -} -#lienzo2 { - width: 40vw; - height: 100%; - background-color: #242424; - position: relative; - border-left: 1px #ffffff solid; + #lienzo1 { + z-index: 9; + } } -#listaCategorias { +#categorias { width: 15vw; - height: 100vh; - background-color: #242424; - position: absolute; - border-left: 1px #ffffff solid; - top: 0px; - left: 71vw; + height: $altoContenido; + background-color: var(--fondo); + color: whitesmoke; + + .columnas { + text-align: center; + margin-top: 1em; + } + + .modo { + cursor: pointer; + padding: 0.3em; + font-family: $Roboto; + opacity: 0.5; + + &.activo { + background-color: whitesmoke; + color: var(--negro); + opacity: 1; + } + + &:hover { + background-color: rgba(245, 245, 245, 0.6); + } + } + + #listaCategorias { + font-weight: 500; + text-transform: capitalize; + padding: 1em; + font-size: 0.9em; + display: flex; + flex-wrap: wrap; + align-items: flex-start; + justify-content: flex-start; + align-content: flex-start; + } + + .categoria { + color: var(--texto2); + margin: 5px; + padding: 7px; + padding-left: 10px; + font-size: 0.95em; + border: 0.5px dotted var(--texto2); + position: relative; + cursor: pointer; + + .barraColor { + width: 4px; + position: absolute; + top: 0; + left: 0; + height: 100%; + } + } + + .contadorCategoria { + font-size: 0.55em; + margin-left: 1em; + } } #tiemposAparicionCategorias { max-width: 15vw; width: 20vw; - height: 100vh; + height: $altoContenido; background-color: #242424; position: relative; - border-left: 1px #ffffff solid; } + #espacioAparicionCategorias { max-width: 15vw; width: 20vw; - height: 100vh; + height: $altoContenido; background-color: #242424; position: relative; - border-left: 1px #ffffff solid; } video { display: block; + opacity: 0; + + &.visible { + opacity: 1; + } } #listaVideos { - font-size: 0.9em; - margin-left: 20px; - padding: 0 15px 4em 0; + font-size: 0.75em; + padding: 1.25em 2em; list-style: none; visibility: visible; } .videoBtn { cursor: pointer; - margin-bottom: 0.7em; - padding: 0.3em; + padding: 0.5em 0.3em 0.8em 0.3em; line-break: anywhere; + border-bottom: 0.5px solid; &:hover { opacity: 0.5; } &.seleccionado { - border: 1px dotted; + border: 2px dotted; + font-weight: 500; } } @@ -140,19 +229,7 @@ video::-webkit-media-controls-fullscreen-button { cursor: pointer; } -.categoria { - padding: 5px; - font-family: $Roboto; - font-weight: bold; - float: left; - background-color: whitesmoke; - margin: 3px; - font-size: 1vw; - text-transform: uppercase; -} - .elementoTiempo { - font-family: $Roboto; padding: 3px; font-weight: bold; float: left; @@ -163,7 +240,6 @@ video::-webkit-media-controls-fullscreen-button { } .elementoEspacio { - font-family: $Roboto; padding: 3px; font-weight: bold; float: left; @@ -172,6 +248,7 @@ video::-webkit-media-controls-fullscreen-button { font-size: 0.5vw; text-transform: uppercase; } + .barraRango { margin: 20px 20px 20px 0; color: white; @@ -195,7 +272,7 @@ video::-webkit-media-controls-fullscreen-button { max-width: 99vw; video, - #lienzo { + .lienzo { max-width: 84vw; } } @@ -205,7 +282,7 @@ video::-webkit-media-controls-fullscreen-button { padding: 4px; } - #listaCategorias { + #categorias { position: absolute; top: 0px; left: 84vw; diff --git a/src/tipos.ts b/src/tipos.ts new file mode 100644 index 0000000..df4f5bd --- /dev/null +++ b/src/tipos.ts @@ -0,0 +1,12 @@ +export type Cuadro = { + x: number; + y: number; + ancho: number; + alto: number; +}; + +export type Aparicion = { + tiempo: number; + area: Cuadro; + confianza: number; +}; diff --git a/src/utilidades/ayudas.ts b/src/utilidades/ayudas.ts new file mode 100644 index 0000000..33e6115 --- /dev/null +++ b/src/utilidades/ayudas.ts @@ -0,0 +1,12 @@ +export const throttle = (callback: Function, delay: number) => { + var wait = false; + return function () { + if (!wait) { + callback(); + wait = true; + setTimeout(function () { + wait = false; + }, delay); + } + }; +}; diff --git a/src/utilidades/colores.ts b/src/utilidades/colores.ts new file mode 100644 index 0000000..38f10b4 --- /dev/null +++ b/src/utilidades/colores.ts @@ -0,0 +1,350 @@ +const coloresAMil = [ + '#FF6633', + '#FFB399', + '#FF33FF', + '#FFFF99', + '#00B3E6', + '#E6B333', + '#3366E6', + '#999966', + '#99FF99', + '#B34D4D', + '#80B300', + '#809900', + '#E6B3B3', + '#6680B3', + '#66991A', + '#FF99E6', + '#CCFF1A', + '#FF1A66', + '#E6331A', + '#33FFCC', + '#66994D', + '#B366CC', + '#4D8000', + '#B33300', + '#CC80CC', + '#66664D', + '#991AFF', + '#E666FF', + '#4DB3FF', + '#1AB399', + '#E666B3', + '#33991A', + '#CC9999', + '#B3B31A', + '#00E680', + '#4D8066', + '#809980', + '#E6FF80', + '#1AFF33', + '#999933', + '#FF3380', + '#CCCC00', + '#66E64D', + '#4D80CC', + '#9900B3', + '#E64D66', + '#4DB380', + '#FF4D4D', + '#99E6E6', + '#6666FF', +]; + +const otricosColores = [ + '#F44336', + '#FFEBEE', + '#FFCDD2', + '#EF9A9A', + '#E57373', + '#EF5350', + '#F44336', + '#E53935', + '#D32F2F', + '#C62828', + '#B71C1C', + '#FF8A80', + '#FF5252', + '#FF1744', + '#D50000', + '#E91E63', + '#FCE4EC', + '#F8BBD0', + '#F48FB1', + '#F06292', + '#EC407A', + '#E91E63', + '#D81B60', + '#C2185B', + '#AD1457', + '#880E4F', + '#FF80AB', + '#FF4081', + '#F50057', + '#C51162', + '#9C27B0', + '#F3E5F5', + '#E1BEE7', + '#CE93D8', + '#BA68C8', + '#AB47BC', + '#9C27B0', + '#8E24AA', + '#7B1FA2', + '#6A1B9A', + '#4A148C', + '#EA80FC', + '#E040FB', + '#D500F9', + '#AA00FF', + '#673AB7', + '#EDE7F6', + '#D1C4E9', + '#B39DDB', + '#9575CD', + '#7E57C2', + '#673AB7', + '#5E35B1', + '#512DA8', + '#4527A0', + '#311B92', + '#B388FF', + '#7C4DFF', + '#651FFF', + '#6200EA', + '#3F51B5', + '#E8EAF6', + '#C5CAE9', + '#9FA8DA', + '#7986CB', + '#5C6BC0', + '#3F51B5', + '#3949AB', + '#303F9F', + '#283593', + '#1A237E', + '#8C9EFF', + '#536DFE', + '#3D5AFE', + '#304FFE', + '#2196F3', + '#E3F2FD', + '#BBDEFB', + '#90CAF9', + '#64B5F6', + '#42A5F5', + '#2196F3', + '#1E88E5', + '#1976D2', + '#1565C0', + '#0D47A1', + '#82B1FF', + '#448AFF', + '#2979FF', + '#2962FF', + '#03A9F4', + '#E1F5FE', + '#B3E5FC', + '#81D4FA', + '#4FC3F7', + '#29B6F6', + '#03A9F4', + '#039BE5', + '#0288D1', + '#0277BD', + '#01579B', + '#80D8FF', + '#40C4FF', + '#00B0FF', + '#0091EA', + '#00BCD4', + '#E0F7FA', + '#B2EBF2', + '#80DEEA', + '#4DD0E1', + '#26C6DA', + '#00BCD4', + '#00ACC1', + '#0097A7', + '#00838F', + '#006064', + '#84FFFF', + '#18FFFF', + '#00E5FF', + '#00B8D4', + '#009688', + '#E0F2F1', + '#B2DFDB', + '#80CBC4', + '#4DB6AC', + '#26A69A', + '#009688', + '#00897B', + '#00796B', + '#00695C', + '#004D40', + '#A7FFEB', + '#64FFDA', + '#1DE9B6', + '#00BFA5', + '#4CAF50', + '#E8F5E9', + '#C8E6C9', + '#A5D6A7', + '#81C784', + '#66BB6A', + '#4CAF50', + '#43A047', + '#388E3C', + '#2E7D32', + '#1B5E20', + '#B9F6CA', + '#69F0AE', + '#00E676', + '#00C853', + '#8BC34A', + '#F1F8E9', + '#DCEDC8', + '#C5E1A5', + '#AED581', + '#9CCC65', + '#8BC34A', + '#7CB342', + '#689F38', + '#558B2F', + '#33691E', + '#CCFF90', + '#B2FF59', + '#76FF03', + '#64DD17', + '#CDDC39', + '#F9FBE7', + '#F0F4C3', + '#E6EE9C', + '#DCE775', + '#D4E157', + '#CDDC39', + '#C0CA33', + '#AFB42B', + '#9E9D24', + '#827717', + '#F4FF81', + '#EEFF41', + '#C6FF00', + '#AEEA00', + '#FFEB3B', + '#FFFDE7', + '#FFF9C4', + '#FFF59D', + '#FFF176', + '#FFEE58', + '#FFEB3B', + '#FDD835', + '#FBC02D', + '#F9A825', + '#F57F17', + '#FFFF8D', + '#FFFF00', + '#FFEA00', + '#FFD600', + '#FFC107', + '#FFF8E1', + '#FFECB3', + '#FFE082', + '#FFD54F', + '#FFCA28', + '#FFC107', + '#FFB300', + '#FFA000', + '#FF8F00', + '#FF6F00', + '#FFE57F', + '#FFD740', + '#FFC400', + '#FFAB00', + '#FF9800', + '#FFF3E0', + '#FFE0B2', + '#FFCC80', + '#FFB74D', + '#FFA726', + '#FF9800', + '#FB8C00', + '#F57C00', + '#EF6C00', + '#E65100', + '#FFD180', + '#FFAB40', + '#FF9100', + '#FF6D00', + '#FF5722', + '#FBE9E7', + '#FFCCBC', + '#FFAB91', + '#FF8A65', + '#FF7043', + '#FF5722', + '#F4511E', + '#E64A19', + '#D84315', + '#BF360C', + '#FF9E80', + '#FF6E40', + '#FF3D00', + '#DD2C00', + '#795548', + '#EFEBE9', + '#D7CCC8', + '#BCAAA4', + '#A1887F', + '#8D6E63', + '#795548', + '#6D4C41', + '#5D4037', + '#4E342E', + '#3E2723', + '#9E9E9E', + '#FAFAFA', + '#F5F5F5', + '#EEEEEE', + '#E0E0E0', + '#BDBDBD', + '#9E9E9E', + '#757575', + '#616161', + '#424242', + '#212121', + '#607D8B', + '#ECEFF1', + '#CFD8DC', + '#B0BEC5', + '#90A4AE', + '#78909C', + '#607D8B', + '#546E7A', + '#455A64', + '#37474F', + '#263238', + '#000000', + '#FFFFFF', +]; + +const totalOtros = otricosColores.length; +const coloresYaAsignados: number[] = []; + +const aleatorio = () => { + const posicionAleatoria = (Math.random() * totalOtros) | 0; + if (!coloresYaAsignados.includes(posicionAleatoria)) { + const nuevoColor = otricosColores[posicionAleatoria]; + coloresYaAsignados.push(posicionAleatoria); + return nuevoColor; + } else { + return aleatorio(); + } +}; + +for (let i = 0; i < 30; i++) { + coloresAMil.push(aleatorio()); +} + +export default coloresAMil; diff --git a/yarn.lock b/yarn.lock index 67158fa..8153c23 100644 --- a/yarn.lock +++ b/yarn.lock @@ -180,6 +180,13 @@ __metadata: languageName: node linkType: hard +"@mediapipe/tasks-vision@npm:^0.10.16": + version: 0.10.16 + resolution: "@mediapipe/tasks-vision@npm:0.10.16" + checksum: 10c0/caac646170b80451e11ba9635f4f838cb67f9b1232057a10554642f302a2ef037afc916ea2ed9037172efc14cb63a933dd4d8333e42fa6df35a568a303474107 + languageName: node + linkType: hard + "@npmcli/agent@npm:^2.0.0": version: 2.2.2 resolution: "@npmcli/agent@npm:2.2.2" @@ -549,16 +556,6 @@ __metadata: languageName: node linkType: hard -"anymatch@npm:~3.1.2": - version: 3.1.3 - resolution: "anymatch@npm:3.1.3" - dependencies: - normalize-path: "npm:^3.0.0" - picomatch: "npm:^2.0.4" - checksum: 10c0/57b06ae984bc32a0d22592c87384cd88fe4511b1dd7581497831c56d41939c8a001b28e7b853e1450f2bf61992dfcaa8ae2d0d161a0a90c4fb631ef07098fbac - languageName: node - linkType: hard - "argparse@npm:^1.0.10": version: 1.0.10 resolution: "argparse@npm:1.0.10" @@ -600,13 +597,6 @@ __metadata: languageName: node linkType: hard -"binary-extensions@npm:^2.0.0": - version: 2.3.0 - resolution: "binary-extensions@npm:2.3.0" - checksum: 10c0/75a59cafc10fb12a11d510e77110c6c7ae3f4ca22463d52487709ca7f18f69d886aa387557cc9864fbdb10153d0bdb4caacabf11541f55e89ed6e18d12ece2b5 - languageName: node - linkType: hard - "boolbase@npm:^1.0.0": version: 1.0.0 resolution: "boolbase@npm:1.0.0" @@ -623,15 +613,6 @@ __metadata: languageName: node linkType: hard -"braces@npm:~3.0.2": - version: 3.0.3 - resolution: "braces@npm:3.0.3" - dependencies: - fill-range: "npm:^7.1.1" - checksum: 10c0/7c6dfd30c338d2997ba77500539227b9d1f85e388a5f43220865201e407e076783d0881f2d297b9f80951b4c957fcf0b51c1d2d24227631643c3f7c284b0aa04 - languageName: node - linkType: hard - "browserslist@npm:^4.0.0, browserslist@npm:^4.23.3": version: 4.23.3 resolution: "browserslist@npm:4.23.3" @@ -695,22 +676,12 @@ __metadata: languageName: node linkType: hard -"chokidar@npm:>=3.0.0 <4.0.0": - version: 3.6.0 - resolution: "chokidar@npm:3.6.0" +"chokidar@npm:^4.0.0": + version: 4.0.0 + resolution: "chokidar@npm:4.0.0" dependencies: - anymatch: "npm:~3.1.2" - braces: "npm:~3.0.2" - fsevents: "npm:~2.3.2" - glob-parent: "npm:~5.1.2" - is-binary-path: "npm:~2.1.0" - is-glob: "npm:~4.0.1" - normalize-path: "npm:~3.0.0" - readdirp: "npm:~3.6.0" - dependenciesMeta: - fsevents: - optional: true - checksum: 10c0/8361dcd013f2ddbe260eacb1f3cb2f2c6f2b0ad118708a343a5ed8158941a39cb8fb1d272e0f389712e74ee90ce8ba864eece9e0e62b9705cb468a2f6d917462 + readdirp: "npm:^4.0.1" + checksum: 10c0/42d03c53b0ad200689e4fae7763133561480561cab8ba5304e8f2298ff45ff84bf0f6065c3f02b9e557b74b156813734439a1a2ff19a1ea6b35692395cd92738 languageName: node linkType: hard @@ -854,26 +825,26 @@ __metadata: languageName: node linkType: hard -"cssnano-preset-default@npm:^7.0.5": - version: 7.0.5 - resolution: "cssnano-preset-default@npm:7.0.5" +"cssnano-preset-default@npm:^7.0.6": + version: 7.0.6 + resolution: "cssnano-preset-default@npm:7.0.6" dependencies: browserslist: "npm:^4.23.3" css-declaration-sorter: "npm:^7.2.0" cssnano-utils: "npm:^5.0.0" - postcss-calc: "npm:^10.0.1" + postcss-calc: "npm:^10.0.2" postcss-colormin: "npm:^7.0.2" - postcss-convert-values: "npm:^7.0.3" - postcss-discard-comments: "npm:^7.0.2" + postcss-convert-values: "npm:^7.0.4" + postcss-discard-comments: "npm:^7.0.3" postcss-discard-duplicates: "npm:^7.0.1" postcss-discard-empty: "npm:^7.0.0" postcss-discard-overridden: "npm:^7.0.0" - postcss-merge-longhand: "npm:^7.0.3" - postcss-merge-rules: "npm:^7.0.3" + postcss-merge-longhand: "npm:^7.0.4" + postcss-merge-rules: "npm:^7.0.4" postcss-minify-font-values: "npm:^7.0.0" postcss-minify-gradients: "npm:^7.0.0" postcss-minify-params: "npm:^7.0.2" - postcss-minify-selectors: "npm:^7.0.3" + postcss-minify-selectors: "npm:^7.0.4" postcss-normalize-charset: "npm:^7.0.0" postcss-normalize-display-values: "npm:^7.0.0" postcss-normalize-positions: "npm:^7.0.0" @@ -887,10 +858,10 @@ __metadata: postcss-reduce-initial: "npm:^7.0.2" postcss-reduce-transforms: "npm:^7.0.0" postcss-svgo: "npm:^7.0.1" - postcss-unique-selectors: "npm:^7.0.2" + postcss-unique-selectors: "npm:^7.0.3" peerDependencies: postcss: ^8.4.31 - checksum: 10c0/ffa7c6fa16c6ad98b7732fc563de74d492e6ad6d243a9f00431c0cbdbc576bcd49226d2695d881465d32dea0a2916add40ac10e7560dd7b5de9fd0fa25ee081b + checksum: 10c0/5c827a9f6b35475267af0512d55f569994b8334eb06565498daa2070ef52f0cdd2013f5efc1cbc0b4664370f491b0080f93c8ee56a7730d38fdf451fb65b030c languageName: node linkType: hard @@ -903,15 +874,15 @@ __metadata: languageName: node linkType: hard -"cssnano@npm:^7.0.5": - version: 7.0.5 - resolution: "cssnano@npm:7.0.5" +"cssnano@npm:^7.0.6": + version: 7.0.6 + resolution: "cssnano@npm:7.0.6" dependencies: - cssnano-preset-default: "npm:^7.0.5" + cssnano-preset-default: "npm:^7.0.6" lilconfig: "npm:^3.1.2" peerDependencies: postcss: ^8.4.31 - checksum: 10c0/cb43ed964787dca33efb44d8f4fea8a49c495db44d1d12940493f0dd5d63db78e01c5b140fe42b480b332733602a25f4c85186d00977eb3070b29f7422761985 + checksum: 10c0/19ff09931a1531e7c0c0d8928da554d99213aa0bb1f3b93cc6b4987727d60a8cd5537b113a5cf4f95cc1db65bba3f2b35476bd63bb57e7469d4eab73e07d736d languageName: node linkType: hard @@ -1022,17 +993,18 @@ __metadata: version: 0.0.0-use.local resolution: "enflujo-emporio-no-benevolente@workspace:." dependencies: + "@mediapipe/tasks-vision": "npm:^0.10.16" "@tensorflow-models/coco-ssd": "npm:^2.2.3" "@tensorflow/tfjs": "npm:^4.21.0" "@tensorflow/tfjs-backend-cpu": "npm:^4.21.0" "@tensorflow/tfjs-backend-webgl": "npm:^4.21.0" autoprefixer: "npm:^10.4.20" - cssnano: "npm:^7.0.5" - postcss: "npm:^8.4.45" + cssnano: "npm:^7.0.6" + postcss: "npm:^8.4.47" prettier: "npm:^3.3.3" - sass: "npm:^1.78.0" + sass: "npm:^1.79.3" typescript: "npm:^5.5.4" - vite: "npm:^5.4.3" + vite: "npm:^5.4.7" languageName: unknown linkType: soft @@ -1151,15 +1123,6 @@ __metadata: languageName: node linkType: hard -"fill-range@npm:^7.1.1": - version: 7.1.1 - resolution: "fill-range@npm:7.1.1" - dependencies: - to-regex-range: "npm:^5.0.1" - checksum: 10c0/b75b691bbe065472f38824f694c2f7449d7f5004aa950426a2c28f0306c60db9b880c0b0e4ed819997ffb882d1da02cfcfc819bddc94d71627f5269682edf018 - languageName: node - linkType: hard - "foreground-child@npm:^3.1.0": version: 3.3.0 resolution: "foreground-child@npm:3.3.0" @@ -1232,15 +1195,6 @@ __metadata: languageName: node linkType: hard -"glob-parent@npm:~5.1.2": - version: 5.1.2 - resolution: "glob-parent@npm:5.1.2" - dependencies: - is-glob: "npm:^4.0.1" - checksum: 10c0/cab87638e2112bee3f839ef5f6e0765057163d39c66be8ec1602f3823da4692297ad4e972de876ea17c44d652978638d2fd583c6713d0eb6591706825020c9ee - languageName: node - linkType: hard - "glob@npm:^10.2.2, glob@npm:^10.3.10": version: 10.4.5 resolution: "glob@npm:10.4.5" @@ -1338,22 +1292,6 @@ __metadata: languageName: node linkType: hard -"is-binary-path@npm:~2.1.0": - version: 2.1.0 - resolution: "is-binary-path@npm:2.1.0" - dependencies: - binary-extensions: "npm:^2.0.0" - checksum: 10c0/a16eaee59ae2b315ba36fad5c5dcaf8e49c3e27318f8ab8fa3cdb8772bf559c8d1ba750a589c2ccb096113bb64497084361a25960899cb6172a6925ab6123d38 - languageName: node - linkType: hard - -"is-extglob@npm:^2.1.1": - version: 2.1.1 - resolution: "is-extglob@npm:2.1.1" - checksum: 10c0/5487da35691fbc339700bbb2730430b07777a3c21b9ebaecb3072512dfd7b4ba78ac2381a87e8d78d20ea08affb3f1971b4af629173a6bf435ff8a4c47747912 - languageName: node - linkType: hard - "is-fullwidth-code-point@npm:^3.0.0": version: 3.0.0 resolution: "is-fullwidth-code-point@npm:3.0.0" @@ -1361,15 +1299,6 @@ __metadata: languageName: node linkType: hard -"is-glob@npm:^4.0.1, is-glob@npm:~4.0.1": - version: 4.0.3 - resolution: "is-glob@npm:4.0.3" - dependencies: - is-extglob: "npm:^2.1.1" - checksum: 10c0/17fb4014e22be3bbecea9b2e3a76e9e34ff645466be702f1693e8f1ee1adac84710d0be0bd9f967d6354036fd51ab7c2741d954d6e91dae6bb69714de92c197a - languageName: node - linkType: hard - "is-lambda@npm:^1.0.1": version: 1.0.1 resolution: "is-lambda@npm:1.0.1" @@ -1377,13 +1306,6 @@ __metadata: languageName: node linkType: hard -"is-number@npm:^7.0.0": - version: 7.0.0 - resolution: "is-number@npm:7.0.0" - checksum: 10c0/b4686d0d3053146095ccd45346461bc8e53b80aeb7671cc52a4de02dbbf7dc0d1d2a986e2fe4ae206984b4d34ef37e8b795ebc4f4295c978373e6575e295d811 - languageName: node - linkType: hard - "isexe@npm:^2.0.0": version: 2.0.0 resolution: "isexe@npm:2.0.0" @@ -1680,13 +1602,6 @@ __metadata: languageName: node linkType: hard -"normalize-path@npm:^3.0.0, normalize-path@npm:~3.0.0": - version: 3.0.0 - resolution: "normalize-path@npm:3.0.0" - checksum: 10c0/e008c8142bcc335b5e38cf0d63cfd39d6cf2d97480af9abdbe9a439221fd4d749763bab492a8ee708ce7a194bb00c9da6d0a115018672310850489137b3da046 - languageName: node - linkType: hard - "normalize-range@npm:^0.1.2": version: 0.1.2 resolution: "normalize-range@npm:0.1.2" @@ -1736,21 +1651,14 @@ __metadata: languageName: node linkType: hard -"picocolors@npm:^1.0.0, picocolors@npm:^1.0.1": +"picocolors@npm:^1.0.0, picocolors@npm:^1.0.1, picocolors@npm:^1.1.0": version: 1.1.0 resolution: "picocolors@npm:1.1.0" checksum: 10c0/86946f6032148801ef09c051c6fb13b5cf942eaf147e30ea79edb91dd32d700934edebe782a1078ff859fb2b816792e97ef4dab03d7f0b804f6b01a0df35e023 languageName: node linkType: hard -"picomatch@npm:^2.0.4, picomatch@npm:^2.2.1": - version: 2.3.1 - resolution: "picomatch@npm:2.3.1" - checksum: 10c0/26c02b8d06f03206fc2ab8d16f19960f2ff9e81a658f831ecb656d8f17d9edc799e8364b1f4a7873e89d9702dff96204be0fa26fe4181f6843f040f819dac4be - languageName: node - linkType: hard - -"postcss-calc@npm:^10.0.1": +"postcss-calc@npm:^10.0.2": version: 10.0.2 resolution: "postcss-calc@npm:10.0.2" dependencies: @@ -1776,26 +1684,26 @@ __metadata: languageName: node linkType: hard -"postcss-convert-values@npm:^7.0.3": - version: 7.0.3 - resolution: "postcss-convert-values@npm:7.0.3" +"postcss-convert-values@npm:^7.0.4": + version: 7.0.4 + resolution: "postcss-convert-values@npm:7.0.4" dependencies: browserslist: "npm:^4.23.3" postcss-value-parser: "npm:^4.2.0" peerDependencies: postcss: ^8.4.31 - checksum: 10c0/dbb6278bd8d8b11e448933d823426c883bff3f6abeaa23c7530cc4668b9da6f714e073840f280273f8a14022c3a99eb461ec732f7539e062b32f5281e1be6526 + checksum: 10c0/9839b29f7c638672115c9fef5ed7df016aa43ea9dd42a4a2ace16e6a49c75246d2c19f3e03a6409ed3bc7c2fa4de6203bf5789cef8268c76618326b68e3bc591 languageName: node linkType: hard -"postcss-discard-comments@npm:^7.0.2": - version: 7.0.2 - resolution: "postcss-discard-comments@npm:7.0.2" +"postcss-discard-comments@npm:^7.0.3": + version: 7.0.3 + resolution: "postcss-discard-comments@npm:7.0.3" dependencies: - postcss-selector-parser: "npm:^6.1.1" + postcss-selector-parser: "npm:^6.1.2" peerDependencies: postcss: ^8.4.31 - checksum: 10c0/c01632e643b6ec1f61ad59efe06a9e8dfc7fcedeb1551ae48fc33fa801353f6222e31954286cd97171c694f34c2b4c7f7a2213fd0f913e37c34d0353258ed234 + checksum: 10c0/7700c8fb9a83c6ea5cc784267b9afd6e2968fda0358d583af5913baa28dfc91b0f2a4bd0b2bd62a86ebcb8dadb2547e287beae25b5a097e21c1f723367ccf112 languageName: node linkType: hard @@ -1826,29 +1734,29 @@ __metadata: languageName: node linkType: hard -"postcss-merge-longhand@npm:^7.0.3": - version: 7.0.3 - resolution: "postcss-merge-longhand@npm:7.0.3" +"postcss-merge-longhand@npm:^7.0.4": + version: 7.0.4 + resolution: "postcss-merge-longhand@npm:7.0.4" dependencies: postcss-value-parser: "npm:^4.2.0" - stylehacks: "npm:^7.0.3" + stylehacks: "npm:^7.0.4" peerDependencies: postcss: ^8.4.31 - checksum: 10c0/b968c3d16f3edc6075b20219a1165c089dc454a6a42951dcdfc94adb932fb96ef7bcd465c6cd21b0e5b55ac08921355ddbbbc7cdcf87a345e4bef8b3cdd2e7e9 + checksum: 10c0/6f50f7775dd361f83daf1acb3e0001d700ed2b7b9bea02df172143adc7fa196ce9209c9e482010ce36fd704512433b62692c5ab2eef5226db71ea3e694654dc7 languageName: node linkType: hard -"postcss-merge-rules@npm:^7.0.3": - version: 7.0.3 - resolution: "postcss-merge-rules@npm:7.0.3" +"postcss-merge-rules@npm:^7.0.4": + version: 7.0.4 + resolution: "postcss-merge-rules@npm:7.0.4" dependencies: browserslist: "npm:^4.23.3" caniuse-api: "npm:^3.0.0" cssnano-utils: "npm:^5.0.0" - postcss-selector-parser: "npm:^6.1.1" + postcss-selector-parser: "npm:^6.1.2" peerDependencies: postcss: ^8.4.31 - checksum: 10c0/3cd20484ab6d15c62eded408248d5eeaba52a573935943f933865680e070a0e75b3a7447802c575bc86e1fae667cf51d9d5766537835d9b8c090337b5adf928e + checksum: 10c0/fffdcef4ada68e92ab8e6dc34a3b9aa2b87188cd4d08f5ba0ff2aff7e3e3c7f086830748ff64db091b5ccb9ac59ac37cfaab1268ed3efb50ab9c4f3714eb5f6d languageName: node linkType: hard @@ -1889,15 +1797,15 @@ __metadata: languageName: node linkType: hard -"postcss-minify-selectors@npm:^7.0.3": - version: 7.0.3 - resolution: "postcss-minify-selectors@npm:7.0.3" +"postcss-minify-selectors@npm:^7.0.4": + version: 7.0.4 + resolution: "postcss-minify-selectors@npm:7.0.4" dependencies: cssesc: "npm:^3.0.0" - postcss-selector-parser: "npm:^6.1.1" + postcss-selector-parser: "npm:^6.1.2" peerDependencies: postcss: ^8.4.31 - checksum: 10c0/5211f63a1672f646a1bab57bd8eac0816d42adacb5e286ad5e6e342a795bb0d086bd6044a1b338311ca28f33f2c1833165ee611eaa671287379821ba3c5d68ad + checksum: 10c0/212b8f3d62eb2a27ed57d4e76b75b0886806ddb9e2497c0bb79308fa75dabaaaa4ed2b97734896e87603272d05231fd74aee2c256a48d77aa468b5b64cc7866a languageName: node linkType: hard @@ -2034,7 +1942,7 @@ __metadata: languageName: node linkType: hard -"postcss-selector-parser@npm:^6.1.1, postcss-selector-parser@npm:^6.1.2": +"postcss-selector-parser@npm:^6.1.2": version: 6.1.2 resolution: "postcss-selector-parser@npm:6.1.2" dependencies: @@ -2056,14 +1964,14 @@ __metadata: languageName: node linkType: hard -"postcss-unique-selectors@npm:^7.0.2": - version: 7.0.2 - resolution: "postcss-unique-selectors@npm:7.0.2" +"postcss-unique-selectors@npm:^7.0.3": + version: 7.0.3 + resolution: "postcss-unique-selectors@npm:7.0.3" dependencies: - postcss-selector-parser: "npm:^6.1.1" + postcss-selector-parser: "npm:^6.1.2" peerDependencies: postcss: ^8.4.31 - checksum: 10c0/cc54c57cd1c5a6e3e166ec63cc036d9e2df80b05e508d9ce754ca4193bf8c1bfcc16b3c6f0d81b8352a3282201d249b90bb87abacfcfb9065c9e3705ea5d110e + checksum: 10c0/2eb90eb0745d1e29d411ea5108f1cd9737de5b8f739cabc717074872bc4015950c9963f870b23b33b9ef45e7887eecfe5560cffee56616d4e0b8d0fac4f7cb10 languageName: node linkType: hard @@ -2074,7 +1982,7 @@ __metadata: languageName: node linkType: hard -"postcss@npm:^8.4.43, postcss@npm:^8.4.45": +"postcss@npm:^8.4.43": version: 8.4.45 resolution: "postcss@npm:8.4.45" dependencies: @@ -2085,6 +1993,17 @@ __metadata: languageName: node linkType: hard +"postcss@npm:^8.4.47": + version: 8.4.47 + resolution: "postcss@npm:8.4.47" + dependencies: + nanoid: "npm:^3.3.7" + picocolors: "npm:^1.1.0" + source-map-js: "npm:^1.2.1" + checksum: 10c0/929f68b5081b7202709456532cee2a145c1843d391508c5a09de2517e8c4791638f71dd63b1898dba6712f8839d7a6da046c72a5e44c162e908f5911f57b5f44 + languageName: node + linkType: hard + "prettier@npm:^3.3.3": version: 3.3.3 resolution: "prettier@npm:3.3.3" @@ -2111,12 +2030,10 @@ __metadata: languageName: node linkType: hard -"readdirp@npm:~3.6.0": - version: 3.6.0 - resolution: "readdirp@npm:3.6.0" - dependencies: - picomatch: "npm:^2.2.1" - checksum: 10c0/6fa848cf63d1b82ab4e985f4cf72bd55b7dcfd8e0a376905804e48c3634b7e749170940ba77b32804d5fe93b3cc521aa95a8d7e7d725f830da6d93f3669ce66b +"readdirp@npm:^4.0.1": + version: 4.0.1 + resolution: "readdirp@npm:4.0.1" + checksum: 10c0/e5a0b547015f68ecc918f115b62b75b2b840611480a9240cb3317090a0ddac01bb9b40315a8fa08acdf52a43eea17b808c89b645263cba3ab64dc557d7f801f1 languageName: node linkType: hard @@ -2218,16 +2135,16 @@ __metadata: languageName: node linkType: hard -"sass@npm:^1.78.0": - version: 1.78.0 - resolution: "sass@npm:1.78.0" +"sass@npm:^1.79.3": + version: 1.79.3 + resolution: "sass@npm:1.79.3" dependencies: - chokidar: "npm:>=3.0.0 <4.0.0" + chokidar: "npm:^4.0.0" immutable: "npm:^4.0.0" source-map-js: "npm:>=0.6.2 <2.0.0" bin: sass: sass.js - checksum: 10c0/6577a87c00b03a5a50f3a11b4b6592f28abce34e61812e381535a3b712151bd94db3ca06467d20395431e0f38a23f99e616d6859d771fb6d4617c359f590c48c + checksum: 10c0/ad171bbbb2d7a789cc47803a59dcf2d0ac92ede34b538bb3fd683b6391a9ac3dc3eabaac264fc9582c770c4e435b85840e011785b7adfc0ac002b51ba91179c9 languageName: node linkType: hard @@ -2305,6 +2222,13 @@ __metadata: languageName: node linkType: hard +"source-map-js@npm:^1.2.1": + version: 1.2.1 + resolution: "source-map-js@npm:1.2.1" + checksum: 10c0/7bda1fc4c197e3c6ff17de1b8b2c20e60af81b63a52cb32ec5a5d67a20a7d42651e2cb34ebe93833c5a2a084377e17455854fee3e21e7925c64a51b6a52b0faf + languageName: node + linkType: hard + "sprintf-js@npm:^1.1.3": version: 1.1.3 resolution: "sprintf-js@npm:1.1.3" @@ -2377,15 +2301,15 @@ __metadata: languageName: node linkType: hard -"stylehacks@npm:^7.0.3": - version: 7.0.3 - resolution: "stylehacks@npm:7.0.3" +"stylehacks@npm:^7.0.4": + version: 7.0.4 + resolution: "stylehacks@npm:7.0.4" dependencies: browserslist: "npm:^4.23.3" - postcss-selector-parser: "npm:^6.1.1" + postcss-selector-parser: "npm:^6.1.2" peerDependencies: postcss: ^8.4.31 - checksum: 10c0/5030334b06ef705b5700444dab120b540b09159e935e75b60f25bd56db1d85f0d11755f0b0f64ce3f12c5a72ff1b6f57fea49c26d18eb0de2334d6a143b94f8d + checksum: 10c0/b4d0b280ba274503ecc04111cc11c713e0d65db079fbcd8b42d6350be1cca20e28611eddee93b419aa208176a0d3a5fff83d83ef958d1876713809b6a2787c0c languageName: node linkType: hard @@ -2429,15 +2353,6 @@ __metadata: languageName: node linkType: hard -"to-regex-range@npm:^5.0.1": - version: 5.0.1 - resolution: "to-regex-range@npm:5.0.1" - dependencies: - is-number: "npm:^7.0.0" - checksum: 10c0/487988b0a19c654ff3e1961b87f471702e708fa8a8dd02a298ef16da7206692e8552a0250e8b3e8759270f62e9d8314616f6da274734d3b558b1fc7b7724e892 - languageName: node - linkType: hard - "tr46@npm:~0.0.3": version: 0.0.3 resolution: "tr46@npm:0.0.3" @@ -2511,9 +2426,9 @@ __metadata: languageName: node linkType: hard -"vite@npm:^5.4.3": - version: 5.4.3 - resolution: "vite@npm:5.4.3" +"vite@npm:^5.4.7": + version: 5.4.7 + resolution: "vite@npm:5.4.7" dependencies: esbuild: "npm:^0.21.3" fsevents: "npm:~2.3.3" @@ -2550,7 +2465,7 @@ __metadata: optional: true bin: vite: bin/vite.js - checksum: 10c0/7afe601bcba82f81980c718fc171ba8f0c45e3bffaeb7ef831b64b84e396f963c3c87818b74da4c8e817d1bce1c179f1efae3bcb14d2e94b4eb635071722c8f2 + checksum: 10c0/0ca7ca60f71c61f3855bbabf7e33909bec32933b35914d4d281813c728183e78e7ce5be05735a7671df3a994613d3881f520a32a80715faa92effb28deee9320 languageName: node linkType: hard