@pugpigbolt/bridge 0.1.1 → 0.1.3

package/dist/vue.mjs

@@ -1,213 +1 @@
-import { i as setupPugpigUpdate, o as rawBridge, r as triggerPugpigUpdateSequence, s as outgoingActions, t as BOOTSTRAP_METHODS } from "./bootstrap-BzOJNz7-.mjs";
-import { onUnmounted, reactive, ref, toRefs, watchEffect } from "vue";
-//#region src/vue/tooltip.ts
-const tooltipsQueue = ref([]);
-const tooltipsRequests = ref([]);
-const isScrolling = ref(false);
-const createIntersectionObserver = (id, element) => {
-	if (tooltipsRequests.value.includes(id)) return;
-	const observer = new IntersectionObserver(([entry]) => {
-		if (!entry.isIntersecting) return;
-		if (tooltipsRequests.value.includes(id)) return observer.disconnect();
-		tooltipsQueue.value.push({
-			id,
-			el: element
-		});
-		observer.disconnect();
-	}, { threshold: 1 });
-	observer.observe(element);
-	return observer;
-};
-function initToolTips() {
-	window.addEventListener("scroll", () => {
-		isScrolling.value = true;
-		window.clearTimeout(window.scrollTimeout);
-		window.scrollTimeout = setTimeout(() => isScrolling.value = false, 150);
-	}, false);
-	watchEffect(() => {
-		if (isScrolling.value) return;
-		tooltipsQueue.value.forEach((tooltip, index) => {
-			if (tooltipsRequests.value.includes(tooltip.id)) return;
-			const { x, y, width: w, height: h } = tooltip.el.getBoundingClientRect();
-			const source = {
-				w,
-				h,
-				x,
-				y: y + window.scrollY
-			};
-			window.parent?.pugpigBridgeService?.showToolTip?.(JSON.stringify({
-				id: tooltip.id,
-				source
-			}));
-			tooltipsQueue.value.splice(index, 1);
-			tooltipsRequests.value.push(tooltip.id);
-		});
-	});
-}
-function registerToolTips({ attribute = "tooltip", observerOptions } = {}) {
-	if (!window.parent?.pugpigBridgeService?.showToolTip) return;
-	initToolTips();
-	const mutationObserverCallback = (mutations) => {
-		mutations.forEach((mutation) => mutation.addedNodes.forEach((node) => {
-			if (node.nodeType !== Node.ELEMENT_NODE) return;
-			const el = node;
-			const tooltipValue = el.getAttribute(attribute);
-			if (!tooltipValue) return;
-			if (tooltipsRequests.value.includes(tooltipValue)) return;
-			createIntersectionObserver(tooltipValue, el);
-		}));
-	};
-	const mutationObserver = new MutationObserver(mutationObserverCallback);
-	mutationObserverCallback([{ addedNodes: document.body.childNodes }]);
-	mutationObserver.observe(document.body, observerOptions ?? {
-		childList: true,
-		subtree: true
-	});
-}
-function installTooltipDirective(app) {
-	if (!window.parent?.pugpigBridgeService?.showToolTip) {
-		app.directive("tooltip", {});
-		return;
-	}
-	initToolTips();
-	app.directive("tooltip", { mounted: (el, binding) => createIntersectionObserver(binding.value, el) });
-}
-//#endregion
-//#region src/vue/useBridge.ts
-const reactiveBridge = window.boltBridge || reactive(rawBridge);
-function bindAll(obj, ctx) {
-	return Object.fromEntries(Object.entries(obj).map(([k, v]) => [k, typeof v === "function" ? v.bind(ctx) : v]));
-}
-const boundActions = bindAll(outgoingActions, reactiveBridge);
-/**
-* @description Returns the reactive bridge service with all store data as refs and all outgoing action methods bound to the reactive store.
-* @usage const { stories, authorisationStatus, openArticle, sendAnalytics, ... } = useBridge()
-* @returns stories {Ref<Story[]>} Derived story array with locked, hidden, saved, and read flags applied
-* @returns rawStories {Ref<Story[]>} Unprocessed raw stories as received from the bridge
-* @returns feed {Ref<Feed>} Current feed metadata
-* @returns timelines {Ref<Timeline[]>} Available timelines
-* @returns timelinesStates {Ref<Record<string, TimelineState>>} Per-timeline state records
-* @returns themeURL {Ref<string[]>} URLs for the active theme files
-* @returns theme {Ref<Theme>} Active light theme data
-* @returns darkTheme {Ref<Theme>} Active dark theme data
-* @returns timelineMode {Ref<string>} Current timeline display mode
-* @returns timelineType {Ref<string>} Current timeline type (e.g. 'Timeline' | 'SavedTimeline')
-* @returns sourceURL {Ref<string | null>} Source URL of the current feed
-* @returns baseUrl {Ref<string>} Base URL used to resolve relative paths
-* @returns metadataLoaded {Ref<boolean>} Whether feed metadata has been loaded
-* @returns initialBatchSize {Ref<number>} Number of stories in the first rendered batch
-* @returns filter {Ref<Record<string, unknown>>} Active filter state
-* @returns authorisationStatus {Ref<AuthorisationStatus>} Current user authorisation status
-* @returns issueAuthorisationStatus {Ref<IssueAuthorisationStatus>} Per-issue authorisation status
-* @returns openArticle {(story: Story, index: number) => Promise<unknown>} Opens a story in the native reader
-* @returns shareStory {(story: Story, index: number) => Promise<unknown>} Triggers the native share sheet
-* @returns setSaved {(story: Story, index: number, saved: boolean) => Promise<unknown>} Updates the saved state for a story
-* @returns setRead {(story: Story, index: number) => Promise<unknown>} Marks a story as read
-* @returns sendAnalytics {(type: string | Record<string, unknown>, story: Story, index?: number, dimensions?: AnalyticsDimensions) => Promise<unknown>} Sends an analytics event
-* @returns call {(action: string, payload?: unknown) => Promise<unknown>} Dispatches an arbitrary bridge action
-* @returns timelineIsReady {() => void} Signals that the Vue app has mounted
-* @returns fireToast {(type: string, action: string) => Promise<unknown>} Displays a native toast notification
-* @returns openAudio {(story: Story, fallback: Record<string, unknown>, index: number) => Promise<unknown>} Opens the native audio player
-* @returns openImageGallery {(images: StoryImage[] | undefined, initialImage?: number) => Promise<unknown>} Opens the native image gallery
-* @returns addToCalendar {(story: Story, index: number) => Promise<unknown>} Adds an event to the device calendar
-* @returns resolveIssueAccess {(story: Story) => boolean} Resolves whether a story is locked based on issue authorisation
-* @returns $on {(event: string, listener: (...args: unknown[]) => void) => () => void} Subscribes to a bridge event; returns an unsubscribe function
-* @returns $emit {(event: string, ...args: unknown[]) => void} Emits a bridge event
-* @returns $once {(event: string, listener: (...args: unknown[]) => void) => void} Subscribes to a bridge event for a single invocation
-* @returns bridge {BridgeService} The raw reactive bridge instance for direct access
-*/
-function useBridge() {
-	return {
-		...toRefs(reactiveBridge),
-		...boundActions,
-		resolveIssueAccess: reactiveBridge.resolveIssueAccess,
-		$on: (event, listener) => reactiveBridge.$on(event, listener),
-		$emit: (event, ...args) => reactiveBridge.$emit(event, ...args),
-		$once: (event, listener) => reactiveBridge.$once(event, listener),
-		bridge: reactiveBridge
-	};
-}
-//#endregion
-//#region src/vue/bootstrap.ts
-function useBootstrap(options = {}) {
-	const { readyTimeout = 4e3 } = options;
-	if ("scrollRestoration" in history) history.scrollRestoration = "manual";
-	triggerPugpigUpdateSequence();
-	injectThemeAndWait(readyTimeout);
-	applyFeedClasses();
-}
-function injectThemeAndWait(readyTimeout = 4e3) {
-	const loaded = [];
-	const forceReady = setTimeout(() => {
-		globalBridge.logInfo?.("debug", `${readyTimeout}ms have passed, forcing timelineIsReady`);
-		globalBridge.timelineIsReady?.();
-	}, readyTimeout);
-	function onDepLoaded(name) {
-		loaded.push(name);
-		if (!["renderedRequiredStyles", ...globalBridge.themeFileNames ?? []].every((dep) => loaded.includes(dep))) return;
-		clearTimeout(forceReady);
-		document.fonts.ready.then(() => globalBridge.timelineIsReady?.());
-	}
-	for (const url of globalBridge.themeURL ?? []) {
-		const link = document.createElement("link");
-		link.rel = "stylesheet";
-		link.href = url;
-		link.onload = () => onDepLoaded(url);
-		link.onerror = () => onDepLoaded(url);
-		document.head.appendChild(link);
-	}
-	onDepLoaded("renderedRequiredStyles");
-}
-function applyFeedClasses(rootSelector = "#app") {
-	const rootEl = document.querySelector(rootSelector);
-	const classes = [...globalBridge.feed?.classes ?? []];
-	if (globalBridge.isSavedTimeline) classes.push("saved-timeline");
-	if (rootEl && classes.length) rootEl.classList.add(...classes);
-}
-function useDependencyTracker(options = {}) {
-	const { readyTimeout = 4e3 } = options;
-	const loadedDependencies = ref([]);
-	const forceReady = setTimeout(() => {
-		globalBridge.logInfo?.("debug", `${readyTimeout}ms have passed, forcing timelineIsReady`);
-		globalBridge.timelineIsReady?.();
-	}, readyTimeout);
-	function onDependencyLoaded(dependencyName) {
-		if (loadedDependencies.value.includes(dependencyName)) return;
-		loadedDependencies.value.push(dependencyName);
-		const isLoaded = [
-			"mainView",
-			"renderedRequiredStyles",
-			...globalBridge.themeFileNames ?? []
-		].every((dep) => loadedDependencies.value.includes(dep));
-		globalBridge.logInfo?.("debug", `Theme dependency '${dependencyName}' loaded (${performance.now()}ms)`);
-		if (!isLoaded) return;
-		clearTimeout(forceReady);
-		globalBridge.logInfo?.("debug", `Theme dependencies complete: ${loadedDependencies.value.join(", ")}`);
-		document.fonts.ready.then(() => {
-			globalBridge.logInfo?.("debug", `Document fonts loaded (${performance.now()}ms)`);
-			globalBridge.timelineIsReady?.();
-		});
-	}
-	onUnmounted(() => {
-		clearTimeout(forceReady);
-	});
-	return {
-		loadedDependencies,
-		onDependencyLoaded
-	};
-}
-//#endregion
-//#region src/vue/index.ts
-const globalBridge = window.boltBridge || reactive(rawBridge);
-window.boltBridge = globalBridge;
-const isDebug = window.location.search.includes("preview");
-const BoltBridgeVue = (app, callback) => {
-	setupPugpigUpdate(globalBridge);
-	app.config.globalProperties.$bridge = globalBridge;
-	app.provide("globalBridge", globalBridge);
-	app.use(installTooltipDirective);
-	if (isDebug) import("./development-Bl8-5E3g.mjs").then(({ injectBridge }) => injectBridge(app, callback)).then(() => callback?.());
-	else callback?.();
-};
-//#endregion
-export { BOOTSTRAP_METHODS, BoltBridgeVue, applyFeedClasses, globalBridge, injectThemeAndWait, isDebug, registerToolTips, triggerPugpigUpdateSequence, useBootstrap, useBridge, useDependencyTracker };
+import{i as e,o as t,r as n,s as r,t as i}from"./chunks/bootstrap-B7Gwb_jl.mjs";import{onUnmounted as a,reactive as o,ref as s,toRefs as c,watchEffect as l}from"vue";const u=s([]),d=s([]),f=s(!1),p=(e,t)=>{if(d.value.includes(e))return;let n=new IntersectionObserver(([r])=>{if(r.isIntersecting){if(d.value.includes(e))return n.disconnect();u.value.push({id:e,el:t}),n.disconnect()}},{threshold:1});return n.observe(t),n};function m(){window.addEventListener(`scroll`,()=>{f.value=!0,window.clearTimeout(window.scrollTimeout),window.scrollTimeout=setTimeout(()=>f.value=!1,150)},!1),l(()=>{f.value||u.value.forEach((e,t)=>{if(d.value.includes(e.id))return;let{x:n,y:r,width:i,height:a}=e.el.getBoundingClientRect(),o={w:i,h:a,x:n,y:r+window.scrollY};window.parent?.pugpigBridgeService?.showToolTip?.(JSON.stringify({id:e.id,source:o})),u.value.splice(t,1),d.value.push(e.id)})})}function h({attribute:e=`tooltip`,observerOptions:t}={}){if(!window.parent?.pugpigBridgeService?.showToolTip)return;m();let n=t=>{t.forEach(t=>t.addedNodes.forEach(t=>{if(t.nodeType!==Node.ELEMENT_NODE)return;let n=t,r=n.getAttribute(e);r&&(d.value.includes(r)||p(r,n))}))},r=new MutationObserver(n);n([{addedNodes:document.body.childNodes}]),r.observe(document.body,t??{childList:!0,subtree:!0})}function g(e){if(!window.parent?.pugpigBridgeService?.showToolTip){e.directive(`tooltip`,{});return}m(),e.directive(`tooltip`,{mounted:(e,t)=>p(t.value,e)})}const _=window.boltBridge||o(t);function v(e,t){return Object.fromEntries(Object.entries(e).map(([e,n])=>[e,typeof n==`function`?n.bind(t):n]))}const y=v(r,_);function b(){return{...c(_),...y,resolveIssueAccess:_.resolveIssueAccess,$on:(e,t)=>_.$on(e,t),$emit:(e,...t)=>_.$emit(e,...t),$once:(e,t)=>_.$once(e,t),bridge:_}}function x(e={}){let{readyTimeout:t=4e3}=e;`scrollRestoration`in history&&(history.scrollRestoration=`manual`),n(),S(t),C()}function S(e=4e3){let t=[],n=setTimeout(()=>{T.logInfo?.(`debug`,`${e}ms have passed, forcing timelineIsReady`),T.timelineIsReady?.()},e);function r(e){t.push(e),[`renderedRequiredStyles`,...T.themeFileNames??[]].every(e=>t.includes(e))&&(clearTimeout(n),document.fonts.ready.then(()=>T.timelineIsReady?.()))}for(let e of T.themeURL??[]){let t=document.createElement(`link`);t.rel=`stylesheet`,t.href=e,t.onload=()=>r(e),t.onerror=()=>r(e),document.head.appendChild(t)}r(`renderedRequiredStyles`)}function C(e=`#app`){let t=document.querySelector(e),n=[...T.feed?.classes??[]];T.isSavedTimeline&&n.push(`saved-timeline`),t&&n.length&&t.classList.add(...n)}function w(e={}){let{readyTimeout:t=4e3}=e,n=s([]),r=setTimeout(()=>{T.logInfo?.(`debug`,`${t}ms have passed, forcing timelineIsReady`),T.timelineIsReady?.()},t);function i(e){if(n.value.includes(e))return;n.value.push(e);let t=[`mainView`,`renderedRequiredStyles`,...T.themeFileNames??[]].every(e=>n.value.includes(e));T.logInfo?.(`debug`,`Theme dependency '${e}' loaded (${performance.now()}ms)`),t&&(clearTimeout(r),T.logInfo?.(`debug`,`Theme dependencies complete: ${n.value.join(`, `)}`),document.fonts.ready.then(()=>{T.logInfo?.(`debug`,`Document fonts loaded (${performance.now()}ms)`),T.timelineIsReady?.()}))}return a(()=>{clearTimeout(r)}),{loadedDependencies:n,onDependencyLoaded:i}}const T=window.boltBridge||o(t);window.boltBridge=T;const E=window.location.search.includes(`preview`),D=(t,n)=>{e(T),t.config.globalProperties.$bridge=T,t.provide(`globalBridge`,T),t.use(g),E?import(`./chunks/development-CzUmtUQR.mjs`).then(({injectBridge:e})=>e(t,n)).then(()=>n?.()):n?.()};export{i as BOOTSTRAP_METHODS,D as BoltBridgeVue,C as applyFeedClasses,T as globalBridge,S as injectThemeAndWait,E as isDebug,h as registerToolTips,n as triggerPugpigUpdateSequence,x as useBootstrap,b as useBridge,w as useDependencyTracker};

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "@pugpigbolt/bridge",
-  "version": "0.1.1",
+  "version": "0.1.3",
+  "license": "MIT",
   "files": [
     "dist"
   ],