@docmentis/udoc-viewer 0.6.10 → 0.6.12

package/dist/src/ui/viewer/styles-inline.js

@@ -14,13 +14,13 @@ export const inlineStyles = `.udoc-viewer-root {
     --udoc-text-primary: rgba(0, 0, 0, 0.8);
     --udoc-text-secondary: rgba(0, 0, 0, 0.7);
     --udoc-text-tertiary: rgba(0, 0, 0, 0.6);
-    --udoc-text-muted: rgba(0, 0, 0, 0.5);
-    --udoc-text-faint: rgba(0, 0, 0, 0.4);
+    --udoc-text-muted: rgba(0, 0, 0, 0.58);
+    --udoc-text-faint: rgba(0, 0, 0, 0.52);
     --udoc-text-disabled: rgba(0, 0, 0, 0.25);
     --udoc-text-heading: #333;
     --udoc-text-body: #555;
     --udoc-text-label: #666;
-    --udoc-text-subtle: #888;
+    --udoc-text-subtle: #767676;
     --udoc-text-placeholder: #999;
     --udoc-text-on-primary: #fff;
 
@@ -107,13 +107,13 @@ export const inlineStyles = `.udoc-viewer-root {
     --udoc-text-primary: rgba(255, 255, 255, 0.87);
     --udoc-text-secondary: rgba(255, 255, 255, 0.7);
     --udoc-text-tertiary: rgba(255, 255, 255, 0.6);
-    --udoc-text-muted: rgba(255, 255, 255, 0.5);
-    --udoc-text-faint: rgba(255, 255, 255, 0.38);
+    --udoc-text-muted: rgba(255, 255, 255, 0.64);
+    --udoc-text-faint: rgba(255, 255, 255, 0.56);
     --udoc-text-disabled: rgba(255, 255, 255, 0.25);
     --udoc-text-heading: #e0e0e0;
     --udoc-text-body: #bbb;
     --udoc-text-label: #aaa;
-    --udoc-text-subtle: #888;
+    --udoc-text-subtle: #a0a0a0;
     --udoc-text-placeholder: #777;
     --udoc-text-on-primary: #fff;
 
@@ -281,7 +281,8 @@ export const inlineStyles = `.udoc-viewer-root {
     display: flex;
     align-items: center;
     gap: 4px;
-    padding: 6px 10px;
+    height: 40px;
+    padding: 0 10px;
     background: var(--udoc-bg-surface);
     border-radius: 8px;
     box-shadow: var(--udoc-shadow-toolbar);
@@ -2146,42 +2147,6 @@ export const inlineStyles = `.udoc-viewer-root {
     fill: #818cf8;
 }
 
-.udoc-viewer-root .udoc-loading-attribution {
-    margin-top: 12px;
-    text-decoration: none;
-    display: inline-flex;
-}
-
-/* Brand logo on page slots while rendering */
-.udoc-viewer-root .udoc-spread__slot-attribution {
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    transform: translate(-50%, -50%);
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    gap: 6px;
-    pointer-events: none;
-    z-index: 1;
-    user-select: none;
-    opacity: 0.3;
-}
-
-.udoc-viewer-root .udoc-spread__slot-attribution-text {
-    font-size: 11px;
-    font-weight: 500;
-    color: #0f172a;
-}
-
-.udoc-viewer-dark .udoc-spread__slot-attribution-text {
-    color: #e2e8f0;
-}
-
-.udoc-viewer-root .udoc-spread__slot:not(.udoc-spread__slot--loading) .udoc-spread__slot-attribution {
-    display: none;
-}
-
 /* =============================================================================
    Search Panel
    ============================================================================= */
@@ -2399,5 +2364,145 @@ export const inlineStyles = `.udoc-viewer-root {
 .udoc-viewer-root.udoc-viewer-dark .udoc-search-highlight {
     mix-blend-mode: screen;
 }
+
+/* === Accessibility === */
+
+/* Screen-reader-only utility (visually hidden but accessible) */
+.udoc-viewer-root .udoc-sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+}
+
+/* Skip navigation link */
+.udoc-viewer-root .udoc-skip-link {
+    position: absolute;
+    top: -100px;
+    left: 0;
+    z-index: 10000;
+    padding: 8px 16px;
+    background: var(--udoc-bg-surface);
+    color: var(--udoc-text-heading);
+    text-decoration: none;
+    font-size: 14px;
+    border-radius: 0 0 4px 0;
+    box-shadow: var(--udoc-shadow-sm);
+}
+
+.udoc-viewer-root .udoc-skip-link:focus {
+    top: 0;
+}
+
+/* Keyboard focus indicators */
+.udoc-viewer-root :focus-visible {
+    outline: 2px solid var(--udoc-primary);
+    outline-offset: 2px;
+}
+
+.udoc-viewer-root :focus:not(:focus-visible) {
+    outline: none;
+}
+
+/* Reduced motion */
+@media (prefers-reduced-motion: reduce) {
+    .udoc-viewer-root,
+    .udoc-viewer-root * {
+        animation-duration: 0.01ms !important;
+        animation-iteration-count: 1 !important;
+        transition-duration: 0.01ms !important;
+        scroll-behavior: auto !important;
+    }
+}
+
+/* High contrast preference */
+@media (prefers-contrast: more) {
+    .udoc-viewer-root {
+        --udoc-border: #000;
+        --udoc-border-input: #000;
+        --udoc-text-muted: rgba(0, 0, 0, 0.7);
+        --udoc-text-faint: rgba(0, 0, 0, 0.6);
+        --udoc-primary-focus-ring: rgba(0, 102, 204, 0.5);
+    }
+
+    .udoc-viewer-root.udoc-viewer-dark {
+        --udoc-border: #aaa;
+        --udoc-border-input: #aaa;
+        --udoc-text-muted: rgba(255, 255, 255, 0.7);
+        --udoc-text-faint: rgba(255, 255, 255, 0.6);
+        --udoc-primary-focus-ring: rgba(77, 166, 255, 0.5);
+    }
+
+    .udoc-viewer-root :focus-visible {
+        outline-width: 3px;
+    }
+}
+
+/* Forced colors (Windows High Contrast) */
+@media (forced-colors: active) {
+    .udoc-viewer-root .udoc-thumbnail-item--active {
+        outline: 3px solid Highlight;
+    }
+
+    .udoc-viewer-root .udoc-toolbar__btn,
+    .udoc-viewer-root .udoc-floating-toolbar__btn,
+    .udoc-viewer-root .udoc-left-panel__tab {
+        border: 1px solid ButtonText;
+    }
+
+    .udoc-viewer-root .udoc-left-panel__tab--active {
+        background: Highlight;
+        color: HighlightText;
+    }
+
+    .udoc-viewer-root .udoc-search-highlight {
+        outline: 2px solid Highlight;
+    }
+}
+
+/* Resize handle focus styles */
+.udoc-viewer-root .udoc-left-panel__resize-handle:focus-visible,
+.udoc-viewer-root .udoc-right-panel__resize-handle:focus-visible {
+    background: var(--udoc-primary-muted);
+    outline: 2px solid var(--udoc-primary);
+    outline-offset: -2px;
+}
+
+/* Touch target sizes for coarse pointers */
+@media (pointer: coarse) {
+    .udoc-viewer-root .udoc-toolbar__btn {
+        min-width: 44px;
+        min-height: 44px;
+    }
+
+    .udoc-viewer-root .udoc-toolbar__btn--nav {
+        min-width: 44px;
+        min-height: 44px;
+    }
+
+    .udoc-viewer-root .udoc-left-panel__tab {
+        width: 44px;
+        height: 44px;
+    }
+
+    .udoc-viewer-root .udoc-left-panel__tabs {
+        width: 44px;
+    }
+
+    .udoc-viewer-root .udoc-zoom-dropdown__chevron {
+        min-width: 44px;
+        min-height: 44px;
+    }
+
+    .udoc-viewer-root .udoc-outline-item__toggle {
+        min-width: 44px;
+        min-height: 44px;
+    }
+}
 `;
 //# sourceMappingURL=styles-inline.js.map

package/dist/src/ui/viewer/styles-inline.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles-inline.js","sourceRoot":"","sources":["../../../../src/ui/viewer/styles-inline.ts"],"names":[],"mappings":"AAAA,0DAA0D;AAC1D,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAg2E3B,CAAC"}
+{"version":3,"file":"styles-inline.js","sourceRoot":"","sources":["../../../../src/ui/viewer/styles-inline.ts"],"names":[],"mappings":"AAAA,0DAA0D;AAC1D,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAy8E3B,CAAC"}

package/dist/src/ui/viewer/transition.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Slide transition animations for PPTX spread-mode navigation.
+ *
+ * IMPORTANT: Effects must NEVER set `transform` on the incoming element.
+ * The incoming element is the real spread — transforms on it would change
+ * its layout position, causing scrollbar flicker, resize-observer loops,
+ * and page-jump bugs. Only use `opacity` and `clip-path` on incoming.
+ * The outgoing element is a disposable snapshot overlay, so `transform`
+ * and `opacity` are safe on it.
+ */
+import type { PageTransition } from "../../worker/index.js";
+export interface TransitionHandle {
+    /** Cancel the in-flight transition, jumping to the final state. */
+    cancel(): void;
+}
+/**
+ * Run a slide transition animation between two spread elements.
+ *
+ * @param outgoing   The snapshot overlay (will be removed on complete)
+ * @param incoming   The real spread element (already mounted and positioned)
+ * @param transition Transition descriptor from PageInfo
+ * @param forward    Navigation direction (true = forward, false = backward)
+ * @param onComplete Called when the transition finishes (or is cancelled)
+ */
+export declare function runTransition(outgoing: HTMLElement, incoming: HTMLElement, transition: PageTransition, forward: boolean, onComplete: () => void): TransitionHandle;
+//# sourceMappingURL=transition.d.ts.map

package/dist/src/ui/viewer/transition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"transition.d.ts","sourceRoot":"","sources":["../../../../src/ui/viewer/transition.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAAK,EACR,cAAc,EAKjB,MAAM,uBAAuB,CAAC;AAM/B,MAAM,WAAW,gBAAgB;IAC7B,mEAAmE;IACnE,MAAM,IAAI,IAAI,CAAC;CAClB;AAED;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CACzB,QAAQ,EAAE,WAAW,EACrB,QAAQ,EAAE,WAAW,EACrB,UAAU,EAAE,cAAc,EAC1B,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,MAAM,IAAI,GACvB,gBAAgB,CA0DlB"}