@geoql/v-maplibre 1.7.1 → 1.8.0

package/dist/v-maplibre.css

@@ -1,2 +1,525 @@
-.v-layer-control{background:var(--color-card,#fff);border-radius:var(--radius,.5rem);border:1px solid var(--color-border,#e5e7eb);pointer-events:auto;min-width:140px;max-width:280px;margin:10px;padding:8px 10px;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:12px;overflow:hidden;box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a}.v-layer-control-header{justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;display:flex}.v-layer-control-title{color:var(--color-card-foreground,#111827);white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:11px;font-weight:500;line-height:1.2;overflow:hidden}.v-layer-control-toggle{border-radius:calc(var(--radius,.5rem) - 2px);width:22px;height:22px;color:var(--color-foreground,#374151);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background .15s,color .15s;display:flex}.v-layer-control-toggle svg{width:14px;height:14px}.v-layer-control-toggle:hover{background:var(--color-accent,#f3f4f6)}.v-layer-control-toggle.is-hidden{color:var(--color-muted-foreground,#9ca3af)}.v-layer-control-toggle:focus{outline:none}.v-layer-control-toggle:focus-visible{outline:2px solid var(--color-primary,#3b82f6);outline-offset:-2px}.v-layer-control-slider-row{align-items:center;gap:8px;display:flex}.v-layer-control-slider{background:var(--color-secondary,#e5e7eb);cursor:pointer;-webkit-appearance:none;appearance:none;border-radius:2px;flex:1;height:3px}.v-layer-control-slider:disabled{opacity:.4;cursor:not-allowed}.v-layer-control-value{color:var(--color-muted-foreground,#6b7280);font-variant-numeric:tabular-nums;text-align:right;min-width:28px;font-size:10px;font-weight:500}.v-layer-control-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--color-primary,#3b82f6);cursor:pointer;border:2px solid #fff;border-radius:50%;width:12px;height:12px;box-shadow:0 1px 3px #0003}.v-layer-control-slider::-moz-range-thumb{background:var(--color-primary,#3b82f6);cursor:pointer;border:2px solid #fff;border-radius:50%;width:12px;height:12px;box-shadow:0 1px 3px #0003}.v-layer-control-slider:disabled::-webkit-slider-thumb{cursor:not-allowed}.v-layer-control-slider:disabled::-moz-range-thumb{cursor:not-allowed}.v-layer-control-slider:focus{outline:none}.v-layer-control-slider:focus::-webkit-slider-thumb{box-shadow:0 0 0 3px color-mix(in srgb, var(--color-primary,#3b82f6) 20%, transparent)}.v-layer-group{background:var(--color-card,#fff);border-radius:var(--radius,.5rem);border:1px solid var(--color-border,#e5e7eb);pointer-events:auto;min-width:140px;max-width:280px;margin:10px;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:12px;overflow:hidden;box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a}.v-layer-group-header{border:none;border-bottom:1px solid var(--color-border,#e5e7eb);cursor:pointer;text-align:left;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;justify-content:space-between;align-items:center;gap:8px;width:100%;min-height:36px;padding:8px 10px;line-height:1;display:flex}.v-layer-group-header.is-static{cursor:default}.v-layer-group-header:not(.is-static):hover{background:var(--color-accent,#f3f4f6)}.v-layer-group-header:focus{outline:none}.v-layer-group-header:focus-visible{outline:2px solid var(--color-primary,#3b82f6);outline-offset:-2px}.v-layer-group.is-collapsed .v-layer-group-header{border-bottom:none}.v-layer-group-title{color:var(--color-card-foreground,#111827);white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:11px;font-weight:500;line-height:1.2;overflow:hidden}.v-layer-group-chevron{width:14px;height:14px;color:var(--color-muted-foreground,#6b7280);flex-shrink:0;justify-content:center;align-items:center;transition:transform .15s;display:flex}.v-layer-group-chevron.is-collapsed{transform:rotate(-90deg)}.v-layer-group-content{flex-direction:column;display:flex}.v-layer-group-item{border-bottom:1px solid var(--color-border,#e5e7eb);padding:6px 10px 8px}.v-layer-group-item:last-child{border-bottom:none}.v-layer-group-item-header{justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px;display:flex}.v-layer-group-item-title{color:var(--color-foreground,#374151);white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:11px;font-weight:500;line-height:1.2;overflow:hidden}.v-layer-group-toggle{border-radius:calc(var(--radius,.5rem) - 2px);width:20px;height:20px;color:var(--color-foreground,#374151);cursor:pointer;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background .15s,color .15s;display:flex}.v-layer-group-toggle svg{width:14px;height:14px}.v-layer-group-toggle:hover{background:var(--color-accent,#f3f4f6)}.v-layer-group-toggle.is-hidden{color:var(--color-muted-foreground,#9ca3af)}.v-layer-group-slider-row{align-items:center;gap:8px;display:flex}.v-layer-group-slider{background:var(--color-secondary,#e5e7eb);cursor:pointer;-webkit-appearance:none;appearance:none;border-radius:2px;flex:1;height:3px}.v-layer-group-slider:disabled{opacity:.4;cursor:not-allowed}.v-layer-group-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--color-primary,#3b82f6);cursor:pointer;border:2px solid #fff;border-radius:50%;width:10px;height:10px;box-shadow:0 1px 3px #0003}.v-layer-group-slider::-moz-range-thumb{background:var(--color-primary,#3b82f6);cursor:pointer;border:2px solid #fff;border-radius:50%;width:10px;height:10px;box-shadow:0 1px 3px #0003}.v-layer-group-slider:disabled::-webkit-slider-thumb{cursor:not-allowed}.v-layer-group-slider:disabled::-moz-range-thumb{cursor:not-allowed}.v-layer-group-slider:focus{outline:none}.v-layer-group-slider:focus::-webkit-slider-thumb{box-shadow:0 0 0 3px color-mix(in srgb, var(--color-primary,#3b82f6) 20%, transparent)}.v-layer-group-value{color:var(--color-muted-foreground,#6b7280);font-variant-numeric:tabular-nums;text-align:right;min-width:28px;font-size:10px;font-weight:500}.v-legend-control{background:var(--color-card,#fff);border-radius:var(--radius,.5rem);border:1px solid var(--color-border,#e5e7eb);pointer-events:auto;min-width:140px;max-width:200px;margin:10px;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:12px;overflow:hidden;box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a}.v-legend-control-header{border:none;border-bottom:1px solid var(--color-border,#e5e7eb);cursor:pointer;text-align:left;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;justify-content:space-between;align-items:center;gap:12px;width:100%;min-height:44px;padding:8px 10px;line-height:1;display:flex}.v-legend-control.is-collapsed .v-legend-control-header{border-bottom:none}.v-legend-control-header:hover{background:var(--color-accent,#f3f4f6)}.v-legend-control-title{color:var(--color-card-foreground,#111827);font-size:13px;font-weight:500;line-height:1}.v-legend-control-chevron{width:16px;height:16px;color:var(--color-muted-foreground,#6b7280);flex-shrink:0;justify-content:center;align-items:center;transition:transform .15s;display:flex}.v-legend-control-chevron.is-collapsed{transform:rotate(-90deg)}.v-legend-control-content{flex-direction:column;gap:2px;padding:6px;display:flex}.v-legend-control-item{border-radius:calc(var(--radius,.5rem) - 4px);text-align:left;background:0 0;border:none;align-items:center;gap:8px;width:100%;padding:6px 8px;transition:background .1s,opacity .1s;display:flex}.v-legend-control-item.is-interactive{cursor:pointer}.v-legend-control-item.is-interactive:hover{background:var(--color-accent,#f3f4f6)}.v-legend-control-item.is-hidden{opacity:.4}.v-legend-control-item.is-hidden .v-legend-control-label{text-decoration:line-through}.v-legend-control-item:disabled{cursor:default}.v-legend-control-swatch{border-radius:3px;flex-shrink:0;width:12px;height:12px;box-shadow:inset 0 0 0 1px #0000001a}.v-legend-control-label{color:var(--color-foreground,#374151);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:11px;font-weight:500;overflow:hidden}.v-legend-control-count{color:var(--color-muted-foreground,#6b7280);background:var(--color-secondary,#f3f4f6);border-radius:8px;padding:1px 5px;font-size:10px;font-weight:500}.v-legend-control-gradient{border-radius:3px;height:12px;margin:6px 8px 4px}.v-legend-control-gradient-labels{color:var(--color-muted-foreground,#6b7280);justify-content:space-between;padding:0 8px 6px;font-size:10px;font-weight:500;display:flex}.v-legend-control-size-item{align-items:center;gap:8px;padding:4px 8px;display:flex}.v-legend-control-size-circle-wrap{flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;display:flex}.v-legend-control-size-circle{background:var(--color-primary,#3b82f6);border-radius:50%;box-shadow:inset 0 0 0 1px #0000001a}.v-legend-control-table{flex-direction:column;gap:1px;max-height:300px;display:flex;overflow-y:auto}.v-legend-control-table-row{border-radius:calc(var(--radius,.5rem) - 4px);align-items:center;gap:8px;padding:4px 8px;display:flex}.v-legend-control-table-row:hover{background:var(--color-accent,#f3f4f6)}.v-legend-control-table-label{color:var(--color-foreground,#374151);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:11px;font-weight:500;overflow:hidden}.v-legend-control-table-value{color:var(--color-muted-foreground,#6b7280);white-space:nowrap;font-variant-numeric:tabular-nums;font-size:10px;font-weight:600}.v-legend-control:has(.v-legend-control-table){max-width:280px}canvas[data-v-a543ca92]{outline:none}.v-map-container[data-v-a543ca92]{width:100%;height:100%}.absolute{position:absolute!important}
-/*$vite$:1*/
+
+.v-layer-control {
+    min-width: 140px;
+    max-width: 280px;
+    margin: 10px;
+    background: var(--color-card, #fff);
+    border-radius: var(--radius, 0.5rem);
+    border: 1px solid var(--color-border, #e5e7eb);
+    box-shadow:
+      0 1px 3px 0 rgb(0 0 0 / 0.1),
+      0 1px 2px -1px rgb(0 0 0 / 0.1);
+    font-family:
+      ui-sans-serif,
+      system-ui,
+      -apple-system,
+      sans-serif;
+    font-size: 12px;
+    overflow: hidden;
+    padding: 8px 10px;
+    /* Required: MapLibre control containers have pointer-events:none */
+    pointer-events: auto;
+}
+.v-layer-control-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 8px;
+    margin-bottom: 8px;
+}
+.v-layer-control-title {
+    font-weight: 500;
+    font-size: 11px;
+    color: var(--color-card-foreground, #111827);
+    line-height: 1.2;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    min-width: 0;
+}
+.v-layer-control-toggle {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 22px;
+    height: 22px;
+    padding: 0;
+    border: none;
+    border-radius: calc(var(--radius, 0.5rem) - 2px);
+    background: transparent;
+    color: var(--color-foreground, #374151);
+    cursor: pointer;
+    transition:
+      background 0.15s ease,
+      color 0.15s ease;
+    flex-shrink: 0;
+}
+.v-layer-control-toggle svg {
+    width: 14px;
+    height: 14px;
+}
+.v-layer-control-toggle:hover {
+    background: var(--color-accent, #f3f4f6);
+}
+.v-layer-control-toggle.is-hidden {
+    color: var(--color-muted-foreground, #9ca3af);
+}
+.v-layer-control-toggle:focus {
+    outline: none;
+}
+.v-layer-control-toggle:focus-visible {
+    outline: 2px solid var(--color-primary, #3b82f6);
+    outline-offset: -2px;
+}
+.v-layer-control-slider-row {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+.v-layer-control-slider {
+    flex: 1;
+    height: 3px;
+    border-radius: 2px;
+    background: var(--color-secondary, #e5e7eb);
+    cursor: pointer;
+    -webkit-appearance: none;
+    appearance: none;
+}
+.v-layer-control-slider:disabled {
+    opacity: 0.4;
+    cursor: not-allowed;
+}
+.v-layer-control-value {
+    font-size: 10px;
+    font-weight: 500;
+    color: var(--color-muted-foreground, #6b7280);
+    font-variant-numeric: tabular-nums;
+    min-width: 28px;
+    text-align: right;
+}
+.v-layer-control-slider::-webkit-slider-thumb {
+    -webkit-appearance: none;
+    appearance: none;
+    width: 12px;
+    height: 12px;
+    border-radius: 50%;
+    background: var(--color-primary, #3b82f6);
+    cursor: pointer;
+    border: 2px solid #fff;
+    box-shadow: 0 1px 3px rgb(0 0 0 / 0.2);
+}
+.v-layer-control-slider::-moz-range-thumb {
+    width: 12px;
+    height: 12px;
+    border-radius: 50%;
+    background: var(--color-primary, #3b82f6);
+    cursor: pointer;
+    border: 2px solid #fff;
+    box-shadow: 0 1px 3px rgb(0 0 0 / 0.2);
+}
+.v-layer-control-slider:disabled::-webkit-slider-thumb {
+    cursor: not-allowed;
+}
+.v-layer-control-slider:disabled::-moz-range-thumb {
+    cursor: not-allowed;
+}
+.v-layer-control-slider:focus {
+    outline: none;
+}
+.v-layer-control-slider:focus::-webkit-slider-thumb {
+    box-shadow: 0 0 0 3px
+      color-mix(in srgb, var(--color-primary, #3b82f6) 20%, transparent);
+}
+
+.v-layer-group {
+    min-width: 140px;
+    max-width: 280px;
+    margin: 10px;
+    background: var(--color-card, #fff);
+    border-radius: var(--radius, 0.5rem);
+    border: 1px solid var(--color-border, #e5e7eb);
+    box-shadow:
+      0 1px 3px 0 rgb(0 0 0 / 0.1),
+      0 1px 2px -1px rgb(0 0 0 / 0.1);
+    font-family:
+      ui-sans-serif,
+      system-ui,
+      -apple-system,
+      sans-serif;
+    font-size: 12px;
+    overflow: hidden;
+    /* Required: MapLibre control containers have pointer-events:none */
+    pointer-events: auto;
+}
+.v-layer-group-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 8px;
+    width: 100%;
+    min-height: 36px;
+    padding: 8px 10px;
+    border: none;
+    border-bottom: 1px solid var(--color-border, #e5e7eb);
+    background: transparent;
+    cursor: pointer;
+    text-align: left;
+    line-height: 1;
+    touch-action: manipulation;
+    -webkit-tap-highlight-color: transparent;
+}
+.v-layer-group-header.is-static {
+    cursor: default;
+}
+.v-layer-group-header:not(.is-static):hover {
+    background: var(--color-accent, #f3f4f6);
+}
+.v-layer-group-header:focus {
+    outline: none;
+}
+.v-layer-group-header:focus-visible {
+    outline: 2px solid var(--color-primary, #3b82f6);
+    outline-offset: -2px;
+}
+.v-layer-group.is-collapsed .v-layer-group-header {
+    border-bottom: none;
+}
+.v-layer-group-title {
+    font-weight: 500;
+    font-size: 11px;
+    color: var(--color-card-foreground, #111827);
+    line-height: 1.2;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    min-width: 0;
+}
+.v-layer-group-chevron {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 14px;
+    height: 14px;
+    color: var(--color-muted-foreground, #6b7280);
+    transition: transform 0.15s ease;
+    flex-shrink: 0;
+}
+.v-layer-group-chevron.is-collapsed {
+    transform: rotate(-90deg);
+}
+.v-layer-group-content {
+    display: flex;
+    flex-direction: column;
+}
+.v-layer-group-item {
+    padding: 6px 10px 8px;
+    border-bottom: 1px solid var(--color-border, #e5e7eb);
+}
+.v-layer-group-item:last-child {
+    border-bottom: none;
+}
+.v-layer-group-item-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 8px;
+    margin-bottom: 6px;
+}
+.v-layer-group-item-title {
+    font-weight: 500;
+    font-size: 11px;
+    color: var(--color-foreground, #374151);
+    line-height: 1.2;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    min-width: 0;
+}
+.v-layer-group-toggle {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 20px;
+    height: 20px;
+    padding: 0;
+    border: none;
+    border-radius: calc(var(--radius, 0.5rem) - 2px);
+    background: transparent;
+    color: var(--color-foreground, #374151);
+    cursor: pointer;
+    transition:
+      background 0.15s ease,
+      color 0.15s ease;
+    flex-shrink: 0;
+}
+.v-layer-group-toggle svg {
+    width: 14px;
+    height: 14px;
+}
+.v-layer-group-toggle:hover {
+    background: var(--color-accent, #f3f4f6);
+}
+.v-layer-group-toggle.is-hidden {
+    color: var(--color-muted-foreground, #9ca3af);
+}
+.v-layer-group-slider-row {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+.v-layer-group-slider {
+    flex: 1;
+    height: 3px;
+    border-radius: 2px;
+    background: var(--color-secondary, #e5e7eb);
+    cursor: pointer;
+    -webkit-appearance: none;
+    appearance: none;
+}
+.v-layer-group-slider:disabled {
+    opacity: 0.4;
+    cursor: not-allowed;
+}
+.v-layer-group-slider::-webkit-slider-thumb {
+    -webkit-appearance: none;
+    appearance: none;
+    width: 10px;
+    height: 10px;
+    border-radius: 50%;
+    background: var(--color-primary, #3b82f6);
+    cursor: pointer;
+    border: 2px solid #fff;
+    box-shadow: 0 1px 3px rgb(0 0 0 / 0.2);
+}
+.v-layer-group-slider::-moz-range-thumb {
+    width: 10px;
+    height: 10px;
+    border-radius: 50%;
+    background: var(--color-primary, #3b82f6);
+    cursor: pointer;
+    border: 2px solid #fff;
+    box-shadow: 0 1px 3px rgb(0 0 0 / 0.2);
+}
+.v-layer-group-slider:disabled::-webkit-slider-thumb {
+    cursor: not-allowed;
+}
+.v-layer-group-slider:disabled::-moz-range-thumb {
+    cursor: not-allowed;
+}
+.v-layer-group-slider:focus {
+    outline: none;
+}
+.v-layer-group-slider:focus::-webkit-slider-thumb {
+    box-shadow: 0 0 0 3px
+      color-mix(in srgb, var(--color-primary, #3b82f6) 20%, transparent);
+}
+.v-layer-group-value {
+    font-size: 10px;
+    font-weight: 500;
+    color: var(--color-muted-foreground, #6b7280);
+    font-variant-numeric: tabular-nums;
+    min-width: 28px;
+    text-align: right;
+}
+
+.v-legend-control {
+    min-width: 140px;
+    max-width: 200px;
+    margin: 10px;
+    background: var(--color-card, #fff);
+    border-radius: var(--radius, 0.5rem);
+    border: 1px solid var(--color-border, #e5e7eb);
+    box-shadow:
+      0 1px 3px 0 rgb(0 0 0 / 0.1),
+      0 1px 2px -1px rgb(0 0 0 / 0.1);
+    font-family:
+      ui-sans-serif,
+      system-ui,
+      -apple-system,
+      sans-serif;
+    font-size: 12px;
+    overflow: hidden;
+    /* Required: MapLibre control containers have pointer-events:none */
+    pointer-events: auto;
+}
+.v-legend-control-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 12px;
+    width: 100%;
+    min-height: 44px;
+    padding: 8px 10px;
+    border: none;
+    border-bottom: 1px solid var(--color-border, #e5e7eb);
+    background: transparent;
+    cursor: pointer;
+    text-align: left;
+    line-height: 1;
+    touch-action: manipulation;
+    -webkit-tap-highlight-color: transparent;
+}
+.v-legend-control.is-collapsed .v-legend-control-header {
+    border-bottom: none;
+}
+.v-legend-control-header:hover {
+    background: var(--color-accent, #f3f4f6);
+}
+.v-legend-control-title {
+    font-weight: 500;
+    font-size: 13px;
+    color: var(--color-card-foreground, #111827);
+    line-height: 1;
+}
+.v-legend-control-chevron {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 16px;
+    height: 16px;
+    color: var(--color-muted-foreground, #6b7280);
+    transition: transform 0.15s ease;
+    flex-shrink: 0;
+}
+.v-legend-control-chevron.is-collapsed {
+    transform: rotate(-90deg);
+}
+.v-legend-control-content {
+    padding: 6px;
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+}
+.v-legend-control-item {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    width: 100%;
+    padding: 6px 8px;
+    border: none;
+    border-radius: calc(var(--radius, 0.5rem) - 4px);
+    background: transparent;
+    text-align: left;
+    transition:
+      background 0.1s ease,
+      opacity 0.1s ease;
+}
+.v-legend-control-item.is-interactive {
+    cursor: pointer;
+}
+.v-legend-control-item.is-interactive:hover {
+    background: var(--color-accent, #f3f4f6);
+}
+.v-legend-control-item.is-hidden {
+    opacity: 0.4;
+}
+.v-legend-control-item.is-hidden .v-legend-control-label {
+    text-decoration: line-through;
+}
+.v-legend-control-item:disabled {
+    cursor: default;
+}
+.v-legend-control-swatch {
+    width: 12px;
+    height: 12px;
+    border-radius: 3px;
+    flex-shrink: 0;
+    box-shadow: inset 0 0 0 1px rgb(0 0 0 / 0.1);
+}
+.v-legend-control-label {
+    flex: 1;
+    font-size: 11px;
+    font-weight: 500;
+    color: var(--color-foreground, #374151);
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+.v-legend-control-count {
+    font-size: 10px;
+    font-weight: 500;
+    color: var(--color-muted-foreground, #6b7280);
+    background: var(--color-secondary, #f3f4f6);
+    padding: 1px 5px;
+    border-radius: 8px;
+}
+.v-legend-control-gradient {
+    height: 12px;
+    border-radius: 3px;
+    margin: 6px 8px 4px;
+}
+.v-legend-control-gradient-labels {
+    display: flex;
+    justify-content: space-between;
+    padding: 0 8px 6px;
+    font-size: 10px;
+    font-weight: 500;
+    color: var(--color-muted-foreground, #6b7280);
+}
+.v-legend-control-size-item {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 4px 8px;
+}
+.v-legend-control-size-circle-wrap {
+    width: 24px;
+    height: 24px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+}
+.v-legend-control-size-circle {
+    border-radius: 50%;
+    background: var(--color-primary, #3b82f6);
+    box-shadow: inset 0 0 0 1px rgb(0 0 0 / 0.1);
+}
+.v-legend-control-table {
+    max-height: 300px;
+    overflow-y: auto;
+    display: flex;
+    flex-direction: column;
+    gap: 1px;
+}
+.v-legend-control-table-row {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 4px 8px;
+    border-radius: calc(var(--radius, 0.5rem) - 4px);
+}
+.v-legend-control-table-row:hover {
+    background: var(--color-accent, #f3f4f6);
+}
+.v-legend-control-table-label {
+    flex: 1;
+    font-size: 11px;
+    font-weight: 500;
+    color: var(--color-foreground, #374151);
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+.v-legend-control-table-value {
+    font-size: 10px;
+    font-weight: 600;
+    color: var(--color-muted-foreground, #6b7280);
+    white-space: nowrap;
+    font-variant-numeric: tabular-nums;
+}
+.v-legend-control:has(.v-legend-control-table) {
+    max-width: 280px;
+}
+
+canvas[data-v-a543ca92] {
+    outline: none;
+}
+.v-map-container[data-v-a543ca92] {
+    width: 100%;
+    height: 100%;
+}
+
+.absolute {
+    position: absolute !important;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@geoql/v-maplibre",
-  "version": "1.7.1",
+  "version": "1.8.0",
   "private": false,
   "description": "Vue 3 components for MapLibre GL - reactive map components with full TypeScript support",
   "keywords": [
@@ -58,64 +58,68 @@
     "access": "public"
   },
   "scripts": {
-    "dev": "vite",
-    "build": "vite build && vue-tsc --project tsconfig.build.json",
-    "preview": "vite preview",
-    "test": "vitest",
-    "test:ui": "vitest --ui",
-    "test:coverage": "vitest --coverage",
-    "lint": "oxlint",
-    "lint:fix": "oxlint --fix",
-    "format": "oxfmt --write .",
-    "format:check": "oxfmt --check .",
-    "prepublishOnly": "bun run lint && bun run format:check && bun run test:coverage && bun run build"
+    "dev": "vp pack --watch",
+    "build": "vp pack",
+    "test": "vp test",
+    "test:ui": "vp test --ui",
+    "test:coverage": "vp test --coverage",
+    "lint": "vp lint",
+    "lint:fix": "vp lint --fix",
+    "format": "vp fmt --write .",
+    "format:check": "vp fmt --check .",
+    "prepublishOnly": "pnpm run lint && pnpm run format:check && pnpm run test:coverage && pnpm run build"
   },
   "dependencies": {
-    "maplibre-gl": "^5.22.0",
-    "pmtiles": "^4.4.0"
+    "maplibre-gl": "^5.24.0",
+    "pmtiles": "^4.4.1"
   },
   "devDependencies": {
-    "@deck.gl/aggregation-layers": "catalog:pkg:v-maplibre",
-    "@deck.gl/core": "catalog:pkg:v-maplibre",
-    "@deck.gl/geo-layers": "catalog:pkg:v-maplibre",
-    "@deck.gl/layers": "catalog:pkg:v-maplibre",
-    "@deck.gl/mapbox": "catalog:pkg:v-maplibre",
-    "@deck.gl/mesh-layers": "catalog:pkg:v-maplibre",
-    "@developmentseed/deck.gl-geotiff": "catalog:pkg:v-maplibre",
-    "@developmentseed/deck.gl-raster": "catalog:pkg:v-maplibre",
-    "@developmentseed/geotiff": "catalog:pkg:v-maplibre",
-    "@geoql/maplibre-gl-starfield": "catalog:pkg:v-maplibre",
-    "@luma.gl/core": "catalog:pkg:v-maplibre",
-    "@luma.gl/engine": "catalog:pkg:v-maplibre",
-    "@luma.gl/shadertools": "catalog:pkg:v-maplibre",
-    "@types/node": "catalog:pkg:v-maplibre",
-    "@vitejs/plugin-vue": "catalog:pkg:v-maplibre",
-    "@vitest/coverage-v8": "catalog:pkg:v-maplibre",
-    "@vitest/ui": "catalog:pkg:v-maplibre",
-    "@vue/test-utils": "catalog:pkg:v-maplibre",
-    "happy-dom": "catalog:pkg:v-maplibre",
-    "maplibre-gl-lidar": "catalog:pkg:v-maplibre",
-    "maplibre-gl-wind": "catalog:pkg:v-maplibre",
-    "oxfmt": "catalog:default",
-    "oxlint": "catalog:default",
-    "three": "catalog:pkg:v-maplibre",
-    "typescript": "catalog:default",
-    "vite": "catalog:pkg:v-maplibre",
-    "vitest": "catalog:pkg:v-maplibre",
-    "vue": "catalog:default",
-    "vue-tsc": "catalog:pkg:v-maplibre"
+    "@deck.gl/aggregation-layers": "^9.3.2",
+    "@deck.gl/core": "^9.3.2",
+    "@deck.gl/geo-layers": "^9.3.2",
+    "@deck.gl/layers": "^9.3.2",
+    "@deck.gl/mapbox": "^9.3.2",
+    "@deck.gl/mesh-layers": "^9.3.2",
+    "@developmentseed/deck.gl-geotiff": "^0.7.0",
+    "@developmentseed/deck.gl-raster": "^0.7.0",
+    "@developmentseed/deck.gl-zarr": "^0.7.0",
+    "@developmentseed/geotiff": "^0.7.0",
+    "@developmentseed/proj": "^0.7.0",
+    "@geoql/maplibre-gl-starfield": "^0.1.1",
+    "@luma.gl/core": "^9.3.3",
+    "@luma.gl/engine": "^9.3.3",
+    "@luma.gl/shadertools": "^9.3.3",
+    "@tsdown/css": "^0.22.0",
+    "@types/node": "^25.8.0",
+    "@vitejs/plugin-vue": "^6.0.7",
+    "@vitest/coverage-v8": "^4.1.6",
+    "@vue/test-utils": "^2.4.10",
+    "happy-dom": "^20.9.0",
+    "maplibre-gl-lidar": "^0.13.0",
+    "maplibre-gl-wind": "^0.2.0",
+    "three": "^0.184.0",
+    "typescript": "^6.0.3",
+    "unplugin-vue": "^7.2.0",
+    "vite-plus": "^0.1.21",
+    "vue": "^3.5.34",
+    "vue-tsc": "^3.2.9",
+    "zarrita": "^0.7.3"
   },
   "peerDependencies": {
-    "@deck.gl/aggregation-layers": "^9.2.6",
-    "@deck.gl/core": "^9.2.6",
-    "@deck.gl/geo-layers": "^9.2.6",
-    "@deck.gl/layers": "^9.2.6",
-    "@deck.gl/mapbox": "^9.2.6",
-    "@deck.gl/mesh-layers": "^9.2.6",
-    "@developmentseed/deck.gl-geotiff": "^0.3.0",
-    "@developmentseed/deck.gl-raster": "^0.3.0",
+    "@deck.gl/aggregation-layers": "^9.3.0",
+    "@deck.gl/core": "^9.3.0",
+    "@deck.gl/geo-layers": "^9.3.0",
+    "@deck.gl/layers": "^9.3.0",
+    "@deck.gl/mapbox": "^9.3.0",
+    "@deck.gl/mesh-layers": "^9.3.0",
+    "@developmentseed/deck.gl-geotiff": "^0.6.0",
+    "@developmentseed/deck.gl-raster": "^0.6.0",
+    "@developmentseed/deck.gl-zarr": "^0.6.0",
+    "@developmentseed/geotiff": "^0.6.0",
+    "@developmentseed/proj": "^0.6.0",
+    "zarrita": "^0.7.0",
     "@geoql/maplibre-gl-starfield": "^0.1.0",
-    "maplibre-gl-lidar": "^0.11.1",
+    "maplibre-gl-lidar": "^0.13.0",
     "maplibre-gl-wind": "^0.2.0",
     "three": ">=0.176.0",
     "vue": "^3.5.0"
@@ -145,6 +149,18 @@
     "@developmentseed/deck.gl-raster": {
       "optional": true
     },
+    "@developmentseed/deck.gl-zarr": {
+      "optional": true
+    },
+    "@developmentseed/geotiff": {
+      "optional": true
+    },
+    "@developmentseed/proj": {
+      "optional": true
+    },
+    "zarrita": {
+      "optional": true
+    },
     "@geoql/maplibre-gl-starfield": {
       "optional": true
     },
@@ -158,5 +174,5 @@
       "optional": true
     }
   },
-  "packageManager": "bun@1.3.11"
+  "packageManager": "pnpm@11.1.2"
 }