@networkpro/web 1.10.1 → 1.12.2

package/src/lib/stores/trackingPreferences.js

@@ -0,0 +1,222 @@
+/* ==========================================================================
+src/lib/stores/trackingPreferences.js
+
+Copyright © 2025 Network Pro Strategies (Network Pro™)
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * NOTE: Legacy logic from `trackingCookies.js` was merged here in June 2025.
+ * That file has been removed to consolidate stateful tracking logic into a
+ * reactive store with SSR compatibility.
+ */
+
+/**
+ * @file trackingPreferences.js
+ * @description Reactive store for tracking preferences derived from
+ * cookies and browser signals (DNT / GPC). Safe for SSR.
+ * @module src/lib/stores
+ */
+
+import { browser } from "$app/environment";
+import { derived, writable } from "svelte/store";
+
+/**
+ * @typedef {object} TrackingState
+ * @property {boolean} optedIn - User explicitly opted in via cookie
+ * @property {boolean} optedOut - User explicitly opted out via cookie
+ * @property {boolean} dnt - Do Not Track browser signal
+ * @property {boolean} gpc - Global Privacy Control browser signal
+ * @property {boolean} enabled - Whether tracking is permitted
+ * @property {string} status - Human-readable description of tracking state
+ */
+
+/**
+ * @returns {string} Raw document.cookie or empty string (SSR-safe)
+ */
+function readCookies() {
+  return browser ? document.cookie || "" : "";
+}
+
+/**
+ * Check if a specific cookie exists
+ * @param {string} name
+ * @returns {boolean}
+ */
+function cookieExists(name) {
+  return readCookies().includes(`${name}=true`);
+}
+
+/**
+ * Set a cookie with boolean true, 1-year duration
+ * @param {string} name
+ * @returns {void}
+ */
+function setCookie(name) {
+  if (browser) {
+    document.cookie = `${name}=true; path=/; max-age=31536000; samesite=lax`;
+  }
+}
+
+/**
+ * Remove a cookie by setting zero max-age
+ * @param {string} name
+ * @returns {void}
+ */
+function removeCookie(name) {
+  if (browser) {
+    document.cookie = `${name}=; Max-Age=0; path=/; samesite=lax`;
+  }
+}
+
+/**
+ * Write tracking_consent_timestamp cookie
+ * @returns {void}
+ */
+function setConsentTimestamp() {
+  if (browser) {
+    document.cookie = `tracking_consent_timestamp=${Date.now()}; path=/; max-age=31536000; samesite=lax`;
+  }
+}
+
+/**
+ * Remove tracking_consent_timestamp cookie
+ * @returns {void}
+ */
+function removeConsentTimestamp() {
+  if (browser) {
+    document.cookie = `tracking_consent_timestamp=; Max-Age=0; path=/; samesite=lax`;
+  }
+}
+
+/**
+ * @returns {{ dnt: boolean, gpc: boolean }}
+ */
+function getPrivacySignals() {
+  if (!browser) return { dnt: false, gpc: false };
+
+  const dnt = navigator.doNotTrack === "1";
+  // @ts-expect-error: Non-standard GPC property
+  const gpc = navigator.globalPrivacyControl === true;
+
+  return { dnt, gpc };
+}
+
+/**
+ * @param {object} args
+ * @param {boolean} args.optedOut
+ * @param {boolean} args.optedIn
+ * @param {boolean} args.dnt
+ * @param {boolean} args.gpc
+ * @returns {string}
+ */
+function deriveStatus({ optedOut, optedIn, dnt, gpc }) {
+  if (optedOut) return "🔒 Tracking disabled (manual opt-out)";
+  if (optedIn) return "✅ Tracking enabled (manual opt-in)";
+  if (dnt || gpc) return "🛑 Tracking disabled (via browser signal)";
+  return "⚙️ Using default settings (tracking enabled)";
+}
+
+/**
+ * @returns {TrackingState}
+ */
+function computePreferences() {
+  const optedOut = cookieExists("disable_tracking");
+  const optedIn = cookieExists("enable_tracking");
+  const { dnt, gpc } = getPrivacySignals();
+
+  const enabled = optedIn || (!optedOut && !dnt && !gpc);
+  const status = deriveStatus({ optedOut, optedIn, dnt, gpc });
+
+  return { optedIn, optedOut, dnt, gpc, enabled, status };
+}
+
+// --- Writable store ---
+/** @type {import('svelte/store').Writable<TrackingState>} */
+export const trackingPreferences = writable(
+  browser
+    ? computePreferences()
+    : {
+        optedIn: false,
+        optedOut: false,
+        dnt: false,
+        gpc: false,
+        enabled: false,
+        status: "⏳ Checking tracking preferences...",
+      },
+);
+
+/**
+ * Returns true if the user manually set a tracking preference cookie.
+ * @returns {boolean}
+ */
+function hasUserManuallySetTrackingPreference() {
+  const cookies = readCookies();
+  return (
+    cookies.includes("enable_tracking=true") ||
+    cookies.includes("disable_tracking=true")
+  );
+}
+
+/**
+ * Determines if user should be reminded to reconsent (after 6 months).
+ *
+ * @param {TrackingState} $prefs - The current tracking preferences.
+ * @returns {boolean}
+ * @type {import("svelte/store").Readable<boolean>}
+ */
+export const remindUserToReconsent = derived(trackingPreferences, (_prefs) => {
+  if (!browser) return false;
+  if (!hasUserManuallySetTrackingPreference()) return false;
+
+  const match = readCookies().match(/tracking_consent_timestamp=(\d+)/);
+  if (!match) return true;
+
+  const timestamp = Number(match[1]);
+  if (isNaN(timestamp)) return true;
+
+  const age = Date.now() - timestamp;
+  return age > 1000 * 60 * 60 * 24 * 180; // 6 months
+});
+
+/**
+ * Force-refresh current preferences
+ * @returns {void}
+ */
+export function refreshTrackingPreferences() {
+  if (browser) trackingPreferences.set(computePreferences());
+}
+
+/**
+ * Enable tracking by setting opt-in cookie
+ * @returns {void}
+ */
+export function setOptIn() {
+  setCookie("enable_tracking");
+  removeCookie("disable_tracking");
+  setConsentTimestamp();
+  refreshTrackingPreferences();
+}
+
+/**
+ * Disable tracking by setting opt-out cookie
+ * @returns {void}
+ */
+export function setOptOut() {
+  setCookie("disable_tracking");
+  removeCookie("enable_tracking");
+  setConsentTimestamp();
+  refreshTrackingPreferences();
+}
+
+/**
+ * Clear all tracking preference cookies
+ * @returns {void}
+ */
+export function clearPrefs() {
+  removeCookie("enable_tracking");
+  removeCookie("disable_tracking");
+  removeConsentTimestamp();
+  refreshTrackingPreferences();
+}

package/src/lib/styles/css/default.css

@@ -506,3 +506,15 @@ footer .container {
   font-family: inherit; /* Ensure it uses the same font-family as normal text */
   font-style: normal; /* Remove italic for the description */
 }
+
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  border: 0;
+  clip: rect(0, 0, 0, 0);
+  overflow: hidden;
+  white-space: nowrap;
+}

package/src/lib/styles/global.min.css

@@ -3,4 +3,4 @@ Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 ========================================================================== */
-html{-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{margin:.67em 0;font-size:2em}hr{box-sizing:content-box}pre{font-family:monospace;font-size:1em}a{background-color:#0000}abbr[title]{border-bottom:none;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:100%;line-height:1.15}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted buttontext}fieldset{padding:.35em .75em .625em}legend{color:inherit;box-sizing:border-box;white-space:normal;max-width:100%;padding:0;display:table}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}details{display:block}summary{display:list-item}template{display:none}html{color:#222;scroll-behavior:smooth;font-size:1em;line-height:1.4}::-moz-selection{text-shadow:none;background:#191919}::selection{text-shadow:none;background:#191919}hr{border:0;border-top:1px solid #ccc;height:1px;margin:1em 0;padding:0;display:block;overflow:visible}audio,canvas,iframe,img,svg,video{vertical-align:middle}fieldset{border:0;margin:0;padding:0}textarea{resize:vertical}body{color:#fafafa;background-color:#191919;margin:10px;font-family:Arial,Helvetica,sans-serif}a{text-decoration:none}a:link{color:#ffc627}a:hover,a:active{color:#ffc627;text-decoration:underline}a:focus{color:#191919;background-color:#ffc627}a:visited,a:visited:hover{color:#7f6227}.hidden,[hidden]{display:none!important}.visually-hidden{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.visually-hidden.focusable:active,.visually-hidden.focusable:focus{clip:auto;width:auto;height:auto;white-space:inherit;margin:0;position:static;overflow:visible}.invisible{visibility:hidden}.clearfix:before,.clearfix:after{content:"";display:table}.clearfix:after{clear:both}@media print{*,:before,:after{color:#000!important;box-shadow:none!important;text-shadow:none!important;background:#fff!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href)")"}abbr[title]:after{content:" (" attr(title)")"}a[href^=\#]:after,a[href^=javascript\:]:after{content:""}pre{white-space:pre-wrap!important}pre,blockquote{page-break-inside:avoid;border:1px solid #999}tr,img{page-break-inside:avoid}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}}.full-width-section{background-position:50%;background-size:cover;width:100%;max-width:1920px;margin:0 auto}.container{max-width:1200px;margin:0 auto;padding:0 12px}.readable{max-width:900px;margin:0 auto}header,footer{width:100%}header .container,footer .container{max-width:1200px;margin:0 auto;padding:20px 12px}.gh{border-collapse:collapse;border-spacing:0;margin:0 auto}.gh td,.gh th{border-collapse:collapse;word-break:normal;padding:10px 5px;overflow:hidden}.gh .gh-tcell{text-align:center;vertical-align:middle}@media screen and (width<=767px){.gh,.gh col{width:auto!important}.gh-wrap{-webkit-overflow-scrolling:touch;margin:auto 0;overflow-x:auto}}.soc{border-collapse:collapse;border-spacing:0;margin:0 auto}.soc td,.soc th{border-collapse:collapse;word-break:normal;padding:8px;overflow:hidden}.soc .soc-fa{text-align:center;vertical-align:middle}@media screen and (width<=767px){.soc,.soc col{width:auto!important}.soc-wrap{-webkit-overflow-scrolling:touch;margin:auto 0;overflow-x:auto}}.foss{border-collapse:collapse;border-spacing:0}.foss td,.foss th{border-collapse:collapse;word-break:normal;padding:10px 5px;overflow:hidden}.foss .foss-cell{text-align:center;vertical-align:middle}@media screen and (width<=767px){.foss,.foss col{width:auto!important}.foss-wrap{-webkit-overflow-scrolling:touch;overflow-x:auto}}.bnav{text-align:center;border-collapse:collapse;border-spacing:0;margin:0 auto}.bnav td,.bnav th{text-align:center;vertical-align:middle;word-break:normal;border-style:none;padding:10px;font-size:.875rem;font-weight:700;line-height:1.125rem;overflow:hidden}.bnav .bnav-cell{text-align:center;vertical-align:middle;align-content:center}@media screen and (width<=767px){.bnav,.bnav col{width:auto!important}.bnav-wrap{-webkit-overflow-scrolling:touch;margin:auto 0;overflow-x:auto}}.bnav2{border-collapse:collapse;border-spacing:0;margin:0 auto}.bnav2 td{word-break:normal;border-style:none;padding:10px;font-size:.875rem;font-weight:700;line-height:1.125rem;overflow:hidden}.bnav2 th{word-break:normal;border-style:none;padding:12px;font-size:.875rem;line-height:1.125rem;overflow:hidden}.bnav2 .bnav2-cell{text-align:center;vertical-align:middle;align-content:center}@media screen and (width<=767px){.bnav2,.bnav2 col{width:auto!important}.bnav2-wrap{-webkit-overflow-scrolling:touch;margin:auto 0;overflow-x:auto}}.pgp{border-collapse:collapse;border-spacing:0;margin:0 auto}.pgp td{word-break:normal;border-style:none;padding:10px;font-size:.875rem;line-height:1.125rem;overflow:hidden}.pgp th{word-break:normal;border:1px solid #000;padding:10px;font-size:.875rem;line-height:1.125rem;overflow:hidden}.pgp .pgp-col1{text-align:right;vertical-align:middle;padding-right:1rem}.pgp .pgp-col2{text-align:left;vertical-align:middle;padding-left:1rem}@media screen and (width<=767px){.pgp,.pgp col{width:auto!important}.pgp-wrap{-webkit-overflow-scrolling:touch;margin:2rem 0 auto;overflow-x:auto}}.logo{margin-left:auto;margin-right:auto;display:block}.index-title1{text-align:center;font-style:italic;font-weight:700}.index-title2{letter-spacing:-.015em;text-align:center;font-variant:small-caps;font-size:1.25rem;line-height:1.625rem}.index1{letter-spacing:-.035em;text-align:center;font-style:italic;font-weight:700;line-height:2.125rem}.index2{letter-spacing:-.035em;text-align:center;font-variant:small-caps;font-size:1.5rem;line-height:1.75rem}.index3{letter-spacing:-.035em;text-align:center;font-size:1.5rem;line-height:1.75rem}.index4{letter-spacing:-.035em;text-align:center;font-size:1.5rem;line-height:1.75rem;text-decoration:underline}.subhead{letter-spacing:-.035em;font-variant:small-caps;font-size:1.5rem;line-height:1.75rem}.bold{font-weight:700}.emphasis{font-style:italic}.uline{text-decoration:underline}.bolditalic{font-style:italic;font-weight:700}.bquote{border-left:3px solid #9e9e9e;margin-left:30px;padding-left:10px;font-style:italic}.small-text{font-size:.75rem;line-height:1.125rem}.large-text-center{text-align:center;font-size:1.25rem;line-height:1.75rem}.prewrap{white-space:pre-wrap;display:block}.hr-styled{width:75%;margin:auto}.center-text{text-align:center}.copyright{text-align:center;font-size:.75rem;line-height:1.125rem}.gold{color:#ffc627}.visited{color:#7f6227}.goldseparator{color:#ffc627;margin:0 .5rem}.center-nav{text-align:center;padding:5px;font-size:1rem;line-height:1.5rem}.block{resize:none;background:0 0;border:none;border-radius:0;outline:none;width:100%;font-size:.75rem;line-height:1.125rem}.fingerprint{white-space:pre-line;font-weight:700;display:block}.pgp-image{width:150px;height:150px}.spacer{margin:2rem 0}.separator{margin:0 .5rem}.emoji{margin-right:8px}.headline{margin-bottom:4px;font-style:italic;font-weight:700;display:block}.label{font-family:inherit;font-weight:700}.description{font-family:inherit;font-style:normal;font-weight:400;display:inline}
+html{-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{margin:.67em 0;font-size:2em}hr{box-sizing:content-box}pre{font-family:monospace;font-size:1em}a{background-color:#0000}abbr[title]{border-bottom:none;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace;font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:100%;line-height:1.15}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted buttontext}fieldset{padding:.35em .75em .625em}legend{color:inherit;box-sizing:border-box;white-space:normal;max-width:100%;padding:0;display:table}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}details{display:block}summary{display:list-item}template{display:none}html{color:#222;scroll-behavior:smooth;font-size:1em;line-height:1.4}::-moz-selection{text-shadow:none;background:#191919}::selection{text-shadow:none;background:#191919}hr{border:0;border-top:1px solid #ccc;height:1px;margin:1em 0;padding:0;display:block;overflow:visible}audio,canvas,iframe,img,svg,video{vertical-align:middle}fieldset{border:0;margin:0;padding:0}textarea{resize:vertical}body{color:#fafafa;background-color:#191919;margin:10px;font-family:Arial,Helvetica,sans-serif}a{text-decoration:none}a:link{color:#ffc627}a:hover,a:active{color:#ffc627;text-decoration:underline}a:focus{color:#191919;background-color:#ffc627}a:visited,a:visited:hover{color:#7f6227}.hidden,[hidden]{display:none!important}.visually-hidden{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.visually-hidden.focusable:active,.visually-hidden.focusable:focus{clip:auto;width:auto;height:auto;white-space:inherit;margin:0;position:static;overflow:visible}.invisible{visibility:hidden}.clearfix:before,.clearfix:after{content:"";display:table}.clearfix:after{clear:both}@media print{*,:before,:after{color:#000!important;box-shadow:none!important;text-shadow:none!important;background:#fff!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href)")"}abbr[title]:after{content:" (" attr(title)")"}a[href^=\#]:after,a[href^=javascript\:]:after{content:""}pre{white-space:pre-wrap!important}pre,blockquote{page-break-inside:avoid;border:1px solid #999}tr,img{page-break-inside:avoid}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}}.full-width-section{background-position:50%;background-size:cover;width:100%;max-width:1920px;margin:0 auto}.container{max-width:1200px;margin:0 auto;padding:0 12px}.readable{max-width:900px;margin:0 auto}header,footer{width:100%}header .container,footer .container{max-width:1200px;margin:0 auto;padding:20px 12px}.gh{border-collapse:collapse;border-spacing:0;margin:0 auto}.gh td,.gh th{border-collapse:collapse;word-break:normal;padding:10px 5px;overflow:hidden}.gh .gh-tcell{text-align:center;vertical-align:middle}@media screen and (width<=767px){.gh,.gh col{width:auto!important}.gh-wrap{-webkit-overflow-scrolling:touch;margin:auto 0;overflow-x:auto}}.soc{border-collapse:collapse;border-spacing:0;margin:0 auto}.soc td,.soc th{border-collapse:collapse;word-break:normal;padding:8px;overflow:hidden}.soc .soc-fa{text-align:center;vertical-align:middle}@media screen and (width<=767px){.soc,.soc col{width:auto!important}.soc-wrap{-webkit-overflow-scrolling:touch;margin:auto 0;overflow-x:auto}}.foss{border-collapse:collapse;border-spacing:0}.foss td,.foss th{border-collapse:collapse;word-break:normal;padding:10px 5px;overflow:hidden}.foss .foss-cell{text-align:center;vertical-align:middle}@media screen and (width<=767px){.foss,.foss col{width:auto!important}.foss-wrap{-webkit-overflow-scrolling:touch;overflow-x:auto}}.bnav{text-align:center;border-collapse:collapse;border-spacing:0;margin:0 auto}.bnav td,.bnav th{text-align:center;vertical-align:middle;word-break:normal;border-style:none;padding:10px;font-size:.875rem;font-weight:700;line-height:1.125rem;overflow:hidden}.bnav .bnav-cell{text-align:center;vertical-align:middle;align-content:center}@media screen and (width<=767px){.bnav,.bnav col{width:auto!important}.bnav-wrap{-webkit-overflow-scrolling:touch;margin:auto 0;overflow-x:auto}}.bnav2{border-collapse:collapse;border-spacing:0;margin:0 auto}.bnav2 td{word-break:normal;border-style:none;padding:10px;font-size:.875rem;font-weight:700;line-height:1.125rem;overflow:hidden}.bnav2 th{word-break:normal;border-style:none;padding:12px;font-size:.875rem;line-height:1.125rem;overflow:hidden}.bnav2 .bnav2-cell{text-align:center;vertical-align:middle;align-content:center}@media screen and (width<=767px){.bnav2,.bnav2 col{width:auto!important}.bnav2-wrap{-webkit-overflow-scrolling:touch;margin:auto 0;overflow-x:auto}}.pgp{border-collapse:collapse;border-spacing:0;margin:0 auto}.pgp td{word-break:normal;border-style:none;padding:10px;font-size:.875rem;line-height:1.125rem;overflow:hidden}.pgp th{word-break:normal;border:1px solid #000;padding:10px;font-size:.875rem;line-height:1.125rem;overflow:hidden}.pgp .pgp-col1{text-align:right;vertical-align:middle;padding-right:1rem}.pgp .pgp-col2{text-align:left;vertical-align:middle;padding-left:1rem}@media screen and (width<=767px){.pgp,.pgp col{width:auto!important}.pgp-wrap{-webkit-overflow-scrolling:touch;margin:2rem 0 auto;overflow-x:auto}}.logo{margin-left:auto;margin-right:auto;display:block}.index-title1{text-align:center;font-style:italic;font-weight:700}.index-title2{letter-spacing:-.015em;text-align:center;font-variant:small-caps;font-size:1.25rem;line-height:1.625rem}.index1{letter-spacing:-.035em;text-align:center;font-style:italic;font-weight:700;line-height:2.125rem}.index2{letter-spacing:-.035em;text-align:center;font-variant:small-caps;font-size:1.5rem;line-height:1.75rem}.index3{letter-spacing:-.035em;text-align:center;font-size:1.5rem;line-height:1.75rem}.index4{letter-spacing:-.035em;text-align:center;font-size:1.5rem;line-height:1.75rem;text-decoration:underline}.subhead{letter-spacing:-.035em;font-variant:small-caps;font-size:1.5rem;line-height:1.75rem}.bold{font-weight:700}.emphasis{font-style:italic}.uline{text-decoration:underline}.bolditalic{font-style:italic;font-weight:700}.bquote{border-left:3px solid #9e9e9e;margin-left:30px;padding-left:10px;font-style:italic}.small-text{font-size:.75rem;line-height:1.125rem}.large-text-center{text-align:center;font-size:1.25rem;line-height:1.75rem}.prewrap{white-space:pre-wrap;display:block}.hr-styled{width:75%;margin:auto}.center-text{text-align:center}.copyright{text-align:center;font-size:.75rem;line-height:1.125rem}.gold{color:#ffc627}.visited{color:#7f6227}.goldseparator{color:#ffc627;margin:0 .5rem}.center-nav{text-align:center;padding:5px;font-size:1rem;line-height:1.5rem}.block{resize:none;background:0 0;border:none;border-radius:0;outline:none;width:100%;font-size:.75rem;line-height:1.125rem}.fingerprint{white-space:pre-line;font-weight:700;display:block}.pgp-image{width:150px;height:150px}.spacer{margin:2rem 0}.separator{margin:0 .5rem}.emoji{margin-right:8px}.headline{margin-bottom:4px;font-style:italic;font-weight:700;display:block}.label{font-family:inherit;font-weight:700}.description{font-family:inherit;font-style:normal;font-weight:400;display:inline}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}

package/src/lib/types/appConstants.js

@@ -0,0 +1,60 @@
+/* ==========================================================================
+src/lib/types/appConstants.js
+
+Copyright © 2025 Network Pro Strategies (Network Pro™)
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * @file appConstants.js
+ * @description Type definitions for app constants in src/lib/index.js
+ * @module src/lib/types
+ * @author SunDevil311
+ * @updated 2025-06-03
+ */
+
+/**
+ * @typedef {object} CompanyInfo
+ * @property {string} NAME - Full company name
+ * @property {string} APP_NAME - Application name
+ * @property {string} YEAR - Current copyright year
+ */
+
+/**
+ * @typedef {object} ContactInfo
+ * @property {string} EMAIL - Primary contact email
+ * @property {string} SECURE - Secure contact email
+ * @property {string} PRIVACY - Privacy policy email
+ * @property {string} PHONE - Support phone number
+ */
+
+/**
+ * @typedef {object} PageTargets
+ * @property {string} BLANK - Value for `target="_blank"`
+ * @property {string} SELF - Value for `target="_self"`
+ * @property {string} REL - Value for `rel="noopener noreferrer"`
+ */
+
+/**
+ * @typedef {object} NavigationLabels
+ * @property {string} BACKTOP
+ * @property {string} HREFTOP
+ */
+
+/**
+ * @typedef {object} Links
+ * @property {string} HOME - Main website URL
+ * @property {string} BLOG - External blog URL
+ */
+
+/**
+ * @typedef {object} AppConstants
+ * @property {CompanyInfo} COMPANY_INFO
+ * @property {ContactInfo} CONTACT
+ * @property {PageTargets} PAGE
+ * @property {NavigationLabels} NAV
+ * @property {Links} LINKS
+ */
+
+export {};

package/src/lib/types/fossTypes.js

@@ -1,3 +1,20 @@
+/* ==========================================================================
+src/lib/types/fossTypes.js
+
+Copyright © 2025 Network Pro Strategies (Network Pro™)
+SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
+This file is part of Network Pro.
+========================================================================== */
+
+/**
+ * @file fossTypes.js
+ * @description Type definitions for `fossItem` in
+ * src/lib/components/foss/FossItemContent.svelte
+ * @module src/lib/types
+ * @author SunDevil311
+ * @updated 2025-06-03
+ */
+
 /**
  * @typedef {object} FossLink
  * @property {string} [label]

package/src/routes/+layout.js

@@ -42,5 +42,3 @@ export function load({ url }) {
     meta: currentMeta, // Return the meta data (either from the route or the fallback)
   };
 }
-
-// cspell:ignore posthog

package/src/routes/+layout.svelte

@@ -9,61 +9,59 @@ This file is part of Network Pro.
 <script>
   export let data;
 
+  import { onMount } from "svelte";
+  import { afterNavigate } from "$app/navigation";
+  import { initPostHog, showReminder, capture } from "$lib/stores/posthog";
+  import { registerServiceWorker } from "$lib/registerServiceWorker.js";
+  import { browser } from "$app/environment";
+
   import ContainerSection from "$lib/components/ContainerSection.svelte";
   import Footer from "$lib/components/layout/Footer.svelte";
   import HeaderDefault from "$lib/components/layout/HeaderDefault.svelte";
   import HeaderHome from "$lib/components/layout/HeaderHome.svelte";
   import PWAInstallButton from "$lib/components/PWAInstallButton.svelte";
-  import { shouldTrackUser } from "$lib/utils/privacy.js";
-  import { onMount } from "svelte";
-  import { registerServiceWorker } from "$lib/registerServiceWorker.js";
-  import { browser } from "$app/environment";
+
   import "$lib/styles/global.min.css";
   import "$lib/styles/fa-global.css";
 
-  // Import favicon images
   import logoPng from "$lib/img/logo-web.png";
   import logoWbp from "$lib/img/logo-web.webp";
   import faviconSvg from "$lib/img/favicon.svg";
   import appleTouchIcon from "$lib/img/icon-180x180.png";
 
-  // Declare PostHog as null initially
-  /** @type {typeof import('$lib/components/PostHog.svelte').default | null} */
-  let PostHog = null;
+  $: shouldShowReminder = $showReminder;
 
-  if (browser) {
-    // Preload all core images (logos + apple touch)
-    [logoPng, logoWbp, appleTouchIcon].forEach((src) => {
-      const img = new Image();
-      img.src = src;
-    });
+  onMount(() => {
+    console.log("[APP] onMount triggered in +layout.svelte");
+
+    registerServiceWorker();
+    initPostHog();
 
-    // Run setup when component mounts (only in browser)
-    onMount(() => {
-      console.log("[APP] onMount triggered in +layout.svelte");
-      registerServiceWorker();
+    // Register navigation tracking only on client
+    afterNavigate(() => {
+      capture("$pageview");
+    });
 
+    if (browser) {
       const isDev = import.meta.env.MODE === "development";
 
-      console.log("ENV MODE =", import.meta.env.MODE); // Should be "development"
-      console.log("isDev =", isDev);
-      console.log("shouldTrackUser =", shouldTrackUser());
-
-      if (isDev || shouldTrackUser()) {
-        import("$lib/components/PostHog.svelte").then((module) => {
-          PostHog = module.default;
-
-          if (isDev) {
-            console.log("[Dev] ✅ PostHog component loaded (tracking enabled)");
-          }
-        });
-      } else {
-        console.log(
-          "[Privacy] ⛔ Skipping PostHog component due to DNT or GPC signal.",
-        );
+      // Check for ?debug=true in URL (no persistence)
+      const urlParams = new URLSearchParams(window.location.search);
+      const debug = urlParams.get("debug") === "true";
+
+      if (isDev || debug) {
+        console.log("ENV MODE =", import.meta.env.MODE);
+        console.log("isDev =", isDev);
+        console.log("debug param =", debug);
       }
-    });
-  }
+
+      // Preload logo assets
+      [logoPng, logoWbp, appleTouchIcon].forEach((src) => {
+        const img = new Image();
+        img.src = src;
+      });
+    }
+  });
 
   // fallback values if data.meta not set
   const metaTitle =
@@ -103,10 +101,6 @@ This file is part of Network Pro.
 </header>
 <!-- END HEADER -->
 
-{#if PostHog}
-  <PostHog /> <!-- Add PostHog component when it's loaded -->
-{/if}
-
 <main>
   <slot />
 </main>

package/static/docs/tracking.md

@@ -0,0 +1,63 @@
+# Tracking Preferences & Privacy Signals
+
+<!-- markdownlint-disable MD018 -->
+
+## Overview
+
+This document explains how Network Pro handles analytics tracking in a privacy-aware, user-consented, and standards-compliant manner. It covers:
+
+- Tracking preference storage (cookies)
+- Browser signals (DNT and GPC)
+- Reconsent logic
+- Reactive store architecture
+
+### 🔐 Principles
+
+- **Privacy by default**: Tracking is disabled when browser signals indicate user preference (DNT/GPC).
+- **Explicit consent**: Users may opt-in or opt-out manually, overriding signals.
+- **Persistent choice**: Consent state is remembered via first-party cookies.
+- **Transparency**: The tracking status is shown to users in the UI.
+
+### 🧠 Architecture Summary
+
+- **Store**: `src/lib/stores/trackingPreferences.js`
+  - Consolidates logic for cookie preferences, browser signals, and consent state.
+  - SSR-safe, reactive, and fully declarative.
+- **Deprecated**:
+  - `utils/privacy.js` → replaced by derived store logic.
+  - `utils/trackingCookies.js` → merged into the store with SSR-safe cookie APIs.
+
+### Reactive State
+
+| Store                   | Type                      | Description                                                             |
+| ----------------------- | ------------------------- | ----------------------------------------------------------------------- |
+| `trackingPreferences`   | `Readable<TrackingState>` | Contains current tracking metadata (opt-in/out, DNT, GPC, status, etc). |
+| `trackingEnabled`       | `Writable<boolean>`       | Exposed to toggle or query PostHog tracking state reactively.           |
+| `remindUserToReconsent` | `Readable<boolean>`       | Indicates whether a consent renewal prompt should be shown.             |
+| `showReminder`          | `Writable<boolean>`       | Used by PostHog to conditionally display a reminder or banner.          |
+
+### ⏳ Reconsent Logic
+
+The derived store `remindUserToReconsent` evaluates whether a user should be reminded to re-consent to tracking.
+
+It checks for:
+
+- Manual opt-in or opt-out
+- A valid `tracking_consent_timestamp` cookie
+- Whether 6+ months have elapsed since that timestamp
+
+### ⚙️ Developer Notes
+
+- Changes to tracking preferences update cookies and reactive state
+- Reconsent timestamp is written/cleared via store utility functions
+- Use `$trackingPreferences` and `remindUserToReconsent` wherever reactive values are needed
+
+### 💡 Related Components
+
+| File                            | Purpose                                                                          |
+| ------------------------------- | -------------------------------------------------------------------------------- |
+| `+layout.svelte`                | Initializes PostHog client and service worker; references `trackingPreferences`. |
+| `PrivacyDashboard.svelte`       | UI control panel for opt-in/out toggles and consent status display.              |
+| `PrivacyContent.svelte`         | Informational content rendered in modals, footers, and standalone pages.         |
+| `stores/trackingPreferences.js` | Primary source of truth; tracks and derives tracking state.                      |
+| `stores/posthog.js`             | Encapsulates privacy-safe analytics setup and event capture logic.               |

package/static/offline.min.css

@@ -1,7 +1,6 @@
 /*! ==========================================================================
-src/lib/styles/css/offline.css
-
+Copyright © 2025 Network Pro Strategies (Network Pro™)
 SPDX-License-Identifier: CC-BY-4.0 OR GPL-3.0-or-later
 This file is part of Network Pro.
 =========================================================================== */
-html,body{height:100%;margin:0;padding:0}body{color:#fafafa;text-align:center;background-color:#191919;flex-direction:column;justify-content:center;align-items:center;margin:10px;padding:0 1rem;font-family:Arial,Helvetica,sans-serif;display:flex}.container{max-width:600px;margin:0 auto}h1{color:#fafafa;margin-bottom:1rem;font-size:2rem}p{margin-bottom:1.5rem;font-size:1.1rem;line-height:1.5}.icon{color:#ff5252;margin-bottom:1rem;font-size:4rem}.retry-button{color:#fafafa;cursor:pointer;background-color:#2e7d32;border:none;border-radius:4px;margin-top:1rem;padding:12px 24px;font-family:Arial,Helvetica,sans-serif;font-size:1rem;transition:background-color .2s}.retry-button:hover{background-color:#388e3c}.status{color:#bdbdbd;background-color:#ffffff0d;border-radius:4px;margin:1rem 0;padding:1rem;font-size:.9rem}a{text-decoration:none}a:link{color:#ffc627}a:hover,a:active{color:#ffc627;text-decoration:underline}a:focus{color:#191919;background-color:#ffc627}a:visited,a:visited:hover{color:#7f6227}.help-text{color:#bdbdbd;margin-top:2rem;font-size:.9rem}
+html,body{height:100%;margin:0;padding:0}body{color:#fafafa;text-align:center;background-color:#191919;flex-direction:column;justify-content:center;align-items:center;margin:10px;padding:0 1rem;font-family:Arial,Helvetica,sans-serif;display:flex}.container{max-width:600px;margin:0 auto}h1{color:#fafafa;margin-bottom:1rem;font-size:2rem}p{margin-bottom:1.5rem;font-size:1.1rem;line-height:1.5}.icon{color:#ff5252;margin-bottom:1rem;font-size:4rem}.retry-button{color:#fafafa;cursor:pointer;background-color:#2e7d32;border:none;border-radius:4px;margin-top:1rem;padding:12px 24px;font-family:Arial,Helvetica,sans-serif;font-size:1rem;transition:background-color .2s}.retry-button:hover{background-color:#388e3c}.status{color:#bdbdbd;background-color:#ffffff0d;border-radius:4px;margin:1rem 0;padding:1rem;font-size:.9rem}a{text-decoration:none}a:link{color:#ffc627}a:hover,a:active{color:#ffc627;text-decoration:underline}a:focus{color:#191919;background-color:#ffc627}a:visited,a:visited:hover{color:#7f6227}.help-text{color:#bdbdbd;margin-top:2rem;font-size:.9rem}

package/svelte.config.js

@@ -24,12 +24,14 @@ const config = {
     // Netlify adapter configuration
     adapter: adapter({
       edge: false, // Disable edge functions (optional, enable if needed)
-      split: false, // Disable splitting function files (optional, enable if needed),
+      split: false, // Disable splitting function files (optional, enable if needed)
     }),
+
     // Paths configuration for deployment
     paths: {
       base: "", // Always deploy to the root of the domain
     },
+
     prerender: {
       // Handle HTTP errors during prerendering
       handleHttpError: ({ path, _referrer, message }) => {
@@ -46,6 +48,7 @@ const config = {
       },
     },
   },
+
   // File extensions for Svelte and mdsvex
   extensions: [".svelte", ".svx", ".md"], // Added .md for Markdown support
 };

package/vite.config.js

@@ -9,19 +9,17 @@ This file is part of Network Pro.
 import { sveltekit } from "@sveltejs/kit/vite";
 import { defineConfig } from "vite";
 import lightningcssPlugin from "vite-plugin-lightningcss";
+import tsconfigPaths from "vite-tsconfig-paths"; // NEW: tsconfig/jsconfig alias support
 
 export default defineConfig({
   plugins: [
+    tsconfigPaths(), // Insert before sveltekit()
     sveltekit(),
     lightningcssPlugin({
       minify: process.env.NODE_ENV === "production",
       pruneUnusedFontFaceRules: true,
       pruneUnusedKeyframes: true,
       removeUnusedFontFaces: true,
-      // Enables nesting support in Lightning CSS
-      //drafts: {
-      //  nesting: true
-      //}
     }),
   ],
 });