triiiceratops 0.12.7 → 0.12.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -80,7 +80,26 @@
80
80
  <li>
81
81
  <label class="label cursor-pointer py-1">
82
82
  <span class="label-text"
83
- >{m.settings_toolbar_open()}</span
83
+ >{m.settings_toggle_close_button()}</span
84
+ >
85
+ <input
86
+ type="checkbox"
87
+ class="checkbox checkbox-xs"
88
+ checked={config.annotations?.showCloseButton ??
89
+ true}
90
+ onchange={(e) => {
91
+ if (!config.annotations)
92
+ config.annotations = {};
93
+ config.annotations.showCloseButton =
94
+ e.currentTarget.checked;
95
+ }}
96
+ />
97
+ </label>
98
+ </li>
99
+ <li>
100
+ <label class="label cursor-pointer py-1 gap-2">
101
+ <span class="label-text"
102
+ >{m.settings_select_dock_position()}</span
84
103
  >
85
104
  <input
86
105
  type="checkbox"
@@ -501,6 +520,73 @@
501
520
  />
502
521
  </label>
503
522
  </li>
523
+ <li>
524
+ <label class="label cursor-pointer py-1">
525
+ <span class="label-text"
526
+ >{m.settings_toggle_close_button()}</span
527
+ >
528
+ <input
529
+ type="checkbox"
530
+ class="checkbox checkbox-xs"
531
+ checked={config.annotations?.showCloseButton ??
532
+ true}
533
+ onchange={(e) => {
534
+ if (!config.annotations)
535
+ config.annotations = {};
536
+ config.annotations.showCloseButton =
537
+ e.currentTarget.checked;
538
+ }}
539
+ />
540
+ </label>
541
+ </li>
542
+ <li>
543
+ <label class="label cursor-pointer py-1 gap-2">
544
+ <span class="label-text"
545
+ >{m.settings_select_dock_position()}</span
546
+ >
547
+ <select
548
+ class="select select-bordered select-xs w-24"
549
+ value={config.annotations?.position ?? 'right'}
550
+ onchange={(e) => {
551
+ if (!config.annotations)
552
+ config.annotations = {};
553
+ config.annotations.position = (
554
+ e.currentTarget as HTMLSelectElement
555
+ ).value as 'left' | 'right';
556
+ }}
557
+ onclick={(e) => e.stopPropagation()}
558
+ >
559
+ <option value="right"
560
+ >{m.settings_position_right()}</option
561
+ >
562
+ <option value="left"
563
+ >{m.settings_position_left()}</option
564
+ >
565
+ </select>
566
+ </label>
567
+ </li>
568
+ <li>
569
+ <label class="label cursor-pointer py-1 gap-2">
570
+ <span class="label-text"
571
+ >{m.settings_panel_width()}</span
572
+ >
573
+ <input
574
+ type="range"
575
+ min="200"
576
+ max="800"
577
+ value={parseInt(config.annotations?.width ?? '320')}
578
+ class="range range-xs range-primary w-32"
579
+ oninput={(e) => {
580
+ if (!config.annotations)
581
+ config.annotations = {};
582
+ config.annotations.width = `${e.currentTarget.value}px`;
583
+ }}
584
+ />
585
+ <span class="text-xs opacity-50 w-8 text-right"
586
+ >{config.annotations?.width ?? '320px'}</span
587
+ >
588
+ </label>
589
+ </li>
504
590
  </ul>
505
591
  </details>
506
592
  </li>
@@ -12,6 +12,7 @@
12
12
  import Toolbar from './Toolbar.svelte';
13
13
  import MetadataDialog from './MetadataDialog.svelte';
14
14
  import SearchPanel from './SearchPanel.svelte';
15
+ import AnnotationPanel from './AnnotationPanel.svelte';
15
16
  import { m, language } from '../state/i18n.svelte';
16
17
 
17
18
  // SSR-safe browser detection for library consumers
@@ -164,6 +165,8 @@
164
165
  internalViewerState.dockSide === 'left') ||
165
166
  (internalViewerState.showSearchPanel &&
166
167
  internalViewerState.config.search?.position === 'left') ||
168
+ (internalViewerState.showAnnotations &&
169
+ internalViewerState.config.annotations?.position === 'left') ||
167
170
  internalViewerState.pluginPanels.some(
168
171
  (p) => p.position === 'left' && p.isVisible(),
169
172
  ),
@@ -172,6 +175,8 @@
172
175
  let isRightSidebarVisible = $derived(
173
176
  (internalViewerState.showSearchPanel &&
174
177
  internalViewerState.config.search?.position !== 'left') ||
178
+ (internalViewerState.showAnnotations &&
179
+ internalViewerState.config.annotations?.position !== 'left') ||
175
180
  (internalViewerState.showThumbnailGallery &&
176
181
  internalViewerState.dockSide === 'right') ||
177
182
  internalViewerState.pluginPanels.some(
@@ -429,6 +434,13 @@
429
434
  </div>
430
435
  {/if}
431
436
 
437
+ <!-- Annotations Panel (when configured left) -->
438
+ {#if internalViewerState.showAnnotations && internalViewerState.config.annotations?.position === 'left'}
439
+ <div class="h-full relative pointer-events-auto">
440
+ <AnnotationPanel />
441
+ </div>
442
+ {/if}
443
+
432
444
  <!-- Gallery (when docked left) -->
433
445
  {#if internalViewerState.showThumbnailGallery && internalViewerState.dockSide === 'left'}
434
446
  <div
@@ -565,6 +577,13 @@
565
577
  </div>
566
578
  {/if}
567
579
 
580
+ <!-- Annotations Panel (when configured right) -->
581
+ {#if internalViewerState.showAnnotations && internalViewerState.config.annotations?.position !== 'left'}
582
+ <div class="h-full relative pointer-events-auto">
583
+ <AnnotationPanel />
584
+ </div>
585
+ {/if}
586
+
568
587
  <!-- Gallery (when docked right) -->
569
588
  {#if internalViewerState.showThumbnailGallery && internalViewerState.dockSide === 'right'}
570
589
  <div
@@ -1,4 +1,4 @@
1
- import { a as t } from "./X-B3XldraD.js";
1
+ import { a as t } from "./X-DaQiCkfE.js";
2
2
  const s = (
3
3
  /** @type {(inputs: {}) => LocalizedString} */
4
4
  () => (
@@ -4,9 +4,9 @@ var B = (V, t, a) => Me(V, typeof t != "symbol" ? t + "" : t, a);
4
4
  import "svelte/internal/disclose-version";
5
5
  import * as e from "svelte/internal/client";
6
6
  import { getContext as He, untrack as Ce, onMount as Le, onDestroy as Se } from "svelte";
7
- import { m as _e, g as re, l as ze, s as Ie, X as we, c as Te, V as De } from "../X-B3XldraD.js";
8
- import { A as Ee } from "../ArrowCounterClockwise-BkrSndVO.js";
9
- import { q as je, h as Ue, c as Re, j as Pe, k as Oe, t as Be, u as Fe, v as qe, r as We, s as Ke, m as Ne, C as Je, i as Xe, g as Ye, a as Ge, n as Qe, f as $e, e as et, b as tt, d as at, o as ot, l as nt, p as rt } from "../Check-CB_Zdp64.js";
7
+ import { m as _e, g as re, l as ze, s as Ie, X as we, c as Te, V as De } from "../X-DaQiCkfE.js";
8
+ import { A as Ee } from "../ArrowCounterClockwise-DvXnnh0Z.js";
9
+ import { q as je, h as Ue, c as Re, j as Pe, k as Oe, t as Be, u as Fe, v as qe, r as We, s as Ke, m as Ne, C as Je, i as Xe, g as Ye, a as Ge, n as Qe, f as $e, e as et, b as tt, d as at, o as ot, l as nt, p as rt } from "../Check-BUdiej1n.js";
10
10
  class ue {
11
11
  constructor() {
12
12
  B(this, "id", "localStorage");
@@ -1,9 +1,9 @@
1
1
  import "svelte/internal/disclose-version";
2
2
  import * as e from "svelte/internal/client";
3
3
  import { getContext as s0 } from "svelte";
4
- import { l as l0, s as i0, X as n0, c as o0, V as c0, g as v0 } from "../X-B3XldraD.js";
5
- import { A as d0 } from "../ArrowCounterClockwise-BkrSndVO.js";
6
- import { i as _0, a as g0, b as f0, g as u0, c as h0, e as m0, d as p0, f as b0 } from "../image_filters_reset-jtpS22ff.js";
4
+ import { l as l0, s as i0, X as n0, c as o0, V as c0, g as v0 } from "../X-DaQiCkfE.js";
5
+ import { A as d0 } from "../ArrowCounterClockwise-DvXnnh0Z.js";
6
+ import { i as _0, a as g0, b as f0, g as u0, c as h0, e as m0, d as p0, f as b0 } from "../image_filters_reset-P5hB896L.js";
7
7
  const G = {
8
8
  brightness: 100,
9
9
  contrast: 100,
@@ -38,6 +38,7 @@ export declare class ViewerState {
38
38
  showMetadataDialog: boolean;
39
39
  dockSide: string;
40
40
  visibleAnnotationIds: SvelteSet<string>;
41
+ hoveredAnnotationId: string | null;
41
42
  config: ViewerConfig;
42
43
  get showToggle(): boolean;
43
44
  get showCanvasNav(): boolean;
@@ -12,6 +12,7 @@ export class ViewerState {
12
12
  showMetadataDialog = $state(false);
13
13
  dockSide = $state('bottom');
14
14
  visibleAnnotationIds = new SvelteSet();
15
+ hoveredAnnotationId = $state(null);
15
16
  // UI Configuration
16
17
  config = $state({});
17
18
  // Derived configuration specific getters