@crystaltech/hsms-shared-ui 0.6.6 → 0.6.7-alpha-1

package/dist/index2.js

@@ -0,0 +1,48 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function y(t,e){try{let a=t.replace("#","");a.length===3&&(a=a.split("").map(s=>s+s).join(""));const r=s=>Math.min(255,Math.max(0,s)),n=r(parseInt(a.slice(0,2),16)+e),i=r(parseInt(a.slice(2,4),16)+e),p=r(parseInt(a.slice(4,6),16)+e),o=s=>{const d=s.toString(16);return(d.length===1?"0":"")+d};return"#"+o(n)+o(i)+o(p)}catch{return t}}function f(){try{const t=localStorage.getItem("theme"),e=t?JSON.parse(t):null,a=e&&e.mode||"light",r=e&&e.themeColor||"#2c5282",n=y(r,24),i=a==="light"?"#ffffff":"#121212",p=a==="light"?"#0f172a":"#e5e7eb",o=document.documentElement;o.style.setProperty("--app-bg",i),o.style.setProperty("--app-fg",p),o.style.setProperty("--app-primary",r),o.style.setProperty("--app-primary-2",n)}catch{const e=document.documentElement;e.style.setProperty("--app-bg","#ffffff"),e.style.setProperty("--app-fg","#0f172a"),e.style.setProperty("--app-primary","#2c5282"),e.style.setProperty("--app-primary-2","#3b82f6")}}function b(){try{const t=localStorage.getItem("organization_name")||"",e=localStorage.getItem("organization_logo_full_url")||"";return{orgName:t,orgLogo:e}}catch{return{orgName:"",orgLogo:""}}}function v(){if(document.getElementById("hsms-pre-splash-style"))return;const t=document.createElement("style");t.id="hsms-pre-splash-style",t.textContent=`
+    html, body { height: 100%; }
+    body { margin: 0; background: var(--app-bg); color: var(--app-fg); }
+    .app-splash {
+      height: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-direction: column;
+      gap: 12px;
+      background-image:
+        radial-gradient(circle at 10% 10%, rgba(255,255,255,0.06), transparent 40%),
+        linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
+      color: white;
+      opacity: 1;
+      transform: translateY(0);
+      transition: opacity 280ms ease-out, transform 280ms ease-out;
+    }
+    .app-splash.app-splash-hide {
+      opacity: 0;
+      transform: translateY(6px);
+      pointer-events: none;
+    }
+    .app-splash .brand {
+      display: flex;
+      align-items: center;
+      gap: 10px;
+      background: rgba(255,255,255,0.12);
+      border: 1px solid rgba(255,255,255,0.2);
+      padding: 10px 14px;
+      border-radius: 12px;
+    }
+    .splash-title { font-weight: 600; letter-spacing: .2px; }
+    .splash-spinner {
+      width: 28px; height: 28px; border-radius: 50%;
+      border: 3px solid rgba(0,0,0,0.1);
+      border-top-color: var(--app-primary);
+      animation: hsms-spin 1s linear infinite;
+    }
+    @keyframes hsms-spin { to { transform: rotate(360deg); } }
+  `,document.head.appendChild(t)}function E(t){if(t!=null&&t.rootId){const e=document.getElementById(t.rootId);if(e)return e}return document.getElementById("app")||document.getElementById("root")||document.body}function l(t){try{const e=document.getElementById("hsms-pre-splash");if(!e)return;const a=t||e.parentElement||document.body;if(a&&Array.from(a.children).some(n=>n!==e)||document.readyState==="complete")try{e.classList.add("app-splash-hide");const n=()=>{e.removeEventListener("transitionend",n),e&&e.parentElement&&e.remove();try{document.documentElement.classList.remove("app-loading"),document.documentElement.classList.add("app-ready"),window.__APP_READY__=!0,window.dispatchEvent(new Event("app-ready"))}catch{}};e.addEventListener("transitionend",n),setTimeout(n,340)}catch{e.remove()}}catch{}}function c(t){try{if(document.getElementById("hsms-pre-splash"))return;try{document.documentElement.classList.add("app-loading"),document.documentElement.classList.remove("app-ready"),window.__APP_READY__=!1}catch{}f(),v();const{orgName:e,orgLogo:a}=b(),r=E(t),n=document.createElement("div");n.id="hsms-pre-splash",n.className="app-splash",n.setAttribute("role","status"),n.setAttribute("aria-live","polite"),n.innerHTML=`
+      <div class="brand">
+        <img id="hsms-splash-logo" src="/logo.png" alt="Organization Logo"
+             style="height:40px;width:auto;border-radius:6px" />
+        <div id="hsms-splash-name" class="splash-title">Loading HSMS UI…</div>
+      </div>
+      <div class="splash-spinner" aria-hidden="true"></div>
+    `,r.firstChild?r.insertBefore(n,r.firstChild):r.appendChild(n);const i=n.querySelector("#hsms-splash-logo"),p=n.querySelector("#hsms-splash-name");i&&a&&(i.src=a),p&&e&&(p.textContent=e);const o=new MutationObserver(()=>{l(r),document.getElementById("hsms-pre-splash")||o.disconnect()});o.observe(r,{childList:!0,subtree:!1});const s=()=>l(r);window.addEventListener("load",s,{once:!0});const d=()=>l(r);window.addEventListener("hsms-app-mounted",d);const u=()=>l(r);document.addEventListener("DOMContentLoaded",u,{once:!0});const g=()=>l(r);window.addEventListener("app-ready",g)}catch{}}function m(){l()}function h(){try{window.__APP_READY__=!0,window.dispatchEvent(new Event("app-ready"))}catch{}}try{c()}catch{}try{window.HSMSPreMountSplash={initPreMountSplash:c,hidePreMountSplash:m,markAppReady:h}}catch{}exports.hidePreMountSplash=m;exports.initPreMountSplash=c;exports.markAppReady=h;

package/dist/preMountSplash.iife.js

@@ -0,0 +1,48 @@
+var HSMSPreMountSplash=function(d){"use strict";function g(t,e){try{let a=t.replace("#","");a.length===3&&(a=a.split("").map(s=>s+s).join(""));const r=s=>Math.min(255,Math.max(0,s)),n=r(parseInt(a.slice(0,2),16)+e),p=r(parseInt(a.slice(2,4),16)+e),l=r(parseInt(a.slice(4,6),16)+e),o=s=>{const c=s.toString(16);return(c.length===1?"0":"")+c};return"#"+o(n)+o(p)+o(l)}catch{return t}}function y(){try{const t=localStorage.getItem("theme"),e=t?JSON.parse(t):null,a=e&&e.mode||"light",r=e&&e.themeColor||"#2c5282",n=g(r,24),p=a==="light"?"#ffffff":"#121212",l=a==="light"?"#0f172a":"#e5e7eb",o=document.documentElement;o.style.setProperty("--app-bg",p),o.style.setProperty("--app-fg",l),o.style.setProperty("--app-primary",r),o.style.setProperty("--app-primary-2",n)}catch{const e=document.documentElement;e.style.setProperty("--app-bg","#ffffff"),e.style.setProperty("--app-fg","#0f172a"),e.style.setProperty("--app-primary","#2c5282"),e.style.setProperty("--app-primary-2","#3b82f6")}}function f(){try{const t=localStorage.getItem("organization_name")||"",e=localStorage.getItem("organization_logo_full_url")||"";return{orgName:t,orgLogo:e}}catch{return{orgName:"",orgLogo:""}}}function v(){if(document.getElementById("hsms-pre-splash-style"))return;const t=document.createElement("style");t.id="hsms-pre-splash-style",t.textContent=`
+    html, body { height: 100%; }
+    body { margin: 0; background: var(--app-bg); color: var(--app-fg); }
+    .app-splash {
+      height: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-direction: column;
+      gap: 12px;
+      background-image:
+        radial-gradient(circle at 10% 10%, rgba(255,255,255,0.06), transparent 40%),
+        linear-gradient(135deg, var(--app-primary), var(--app-primary-2));
+      color: white;
+      opacity: 1;
+      transform: translateY(0);
+      transition: opacity 280ms ease-out, transform 280ms ease-out;
+    }
+    .app-splash.app-splash-hide {
+      opacity: 0;
+      transform: translateY(6px);
+      pointer-events: none;
+    }
+    .app-splash .brand {
+      display: flex;
+      align-items: center;
+      gap: 10px;
+      background: rgba(255,255,255,0.12);
+      border: 1px solid rgba(255,255,255,0.2);
+      padding: 10px 14px;
+      border-radius: 12px;
+    }
+    .splash-title { font-weight: 600; letter-spacing: .2px; }
+    .splash-spinner {
+      width: 28px; height: 28px; border-radius: 50%;
+      border: 3px solid rgba(0,0,0,0.1);
+      border-top-color: var(--app-primary);
+      animation: hsms-spin 1s linear infinite;
+    }
+    @keyframes hsms-spin { to { transform: rotate(360deg); } }
+  `,document.head.appendChild(t)}function b(t){if(t!=null&&t.rootId){const e=document.getElementById(t.rootId);if(e)return e}return document.getElementById("app")||document.getElementById("root")||document.body}function i(t){try{const e=document.getElementById("hsms-pre-splash");if(!e)return;const a=t||e.parentElement||document.body;if(a&&Array.from(a.children).some(n=>n!==e)||document.readyState==="complete")try{e.classList.add("app-splash-hide");const n=()=>{e.removeEventListener("transitionend",n),e&&e.parentElement&&e.remove();try{document.documentElement.classList.remove("app-loading"),document.documentElement.classList.add("app-ready"),window.__APP_READY__=!0,window.dispatchEvent(new Event("app-ready"))}catch{}};e.addEventListener("transitionend",n),setTimeout(n,340)}catch{e.remove()}}catch{}}function m(t){try{if(document.getElementById("hsms-pre-splash"))return;try{document.documentElement.classList.add("app-loading"),document.documentElement.classList.remove("app-ready"),window.__APP_READY__=!1}catch{}y(),v();const{orgName:e,orgLogo:a}=f(),r=b(t),n=document.createElement("div");n.id="hsms-pre-splash",n.className="app-splash",n.setAttribute("role","status"),n.setAttribute("aria-live","polite"),n.innerHTML=`
+      <div class="brand">
+        <img id="hsms-splash-logo" src="/logo.png" alt="Organization Logo"
+             style="height:40px;width:auto;border-radius:6px" />
+        <div id="hsms-splash-name" class="splash-title">Loading HSMS UI…</div>
+      </div>
+      <div class="splash-spinner" aria-hidden="true"></div>
+    `,r.firstChild?r.insertBefore(n,r.firstChild):r.appendChild(n);const p=n.querySelector("#hsms-splash-logo"),l=n.querySelector("#hsms-splash-name");p&&a&&(p.src=a),l&&e&&(l.textContent=e);const o=new MutationObserver(()=>{i(r),document.getElementById("hsms-pre-splash")||o.disconnect()});o.observe(r,{childList:!0,subtree:!1});const s=()=>i(r);window.addEventListener("load",s,{once:!0});const c=()=>i(r);window.addEventListener("hsms-app-mounted",c);const E=()=>i(r);document.addEventListener("DOMContentLoaded",E,{once:!0});const w=()=>i(r);window.addEventListener("app-ready",w)}catch{}}function h(){i()}function u(){try{window.__APP_READY__=!0,window.dispatchEvent(new Event("app-ready"))}catch{}}try{m()}catch{}try{window.HSMSPreMountSplash={initPreMountSplash:m,hidePreMountSplash:h,markAppReady:u}}catch{}return d.hidePreMountSplash=h,d.initPreMountSplash=m,d.markAppReady=u,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"}),d}({});

package/dist/splash/preMountSplash.d.ts

@@ -0,0 +1,28 @@
+/**
+ * HSMS Pre-Mount Splash Injector
+ *
+ * Side-effect module that:
+ * - Applies theme CSS variables early from localStorage
+ * - Reads organization branding (name/logo) from localStorage
+ * - Injects a minimal splash UI inside the app root so React replaces it on mount
+ *
+ * Usage:
+ *   import '@crystaltech/hsms-shared-ui/preMountSplash';
+ *   // or via script tag (ESM):
+ *   // <script type="module" src="/node_modules/@crystaltech/hsms-shared-ui/dist/preMountSplash.es.js"></script>
+ */
+export type PreMountSplashOptions = {
+    rootId?: string;
+};
+export declare function initPreMountSplash(options?: PreMountSplashOptions): void;
+export declare function hidePreMountSplash(): void;
+export declare function markAppReady(): void;
+declare global {
+    interface Window {
+        HSMSPreMountSplash?: {
+            initPreMountSplash: (options?: PreMountSplashOptions) => void;
+            hidePreMountSplash: () => void;
+            markAppReady: () => void;
+        };
+    }
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@crystaltech/hsms-shared-ui",
   "private": false,
-  "version": "0.6.6",
+  "version": "0.6.7-alpha-1",
   "type": "module",
   "main": "dist/index.cjs",
   "module": "dist/index.mjs",
@@ -21,6 +21,11 @@
       "types": "./dist/index.d.ts",
       "import": "./dist/index.es.js",
       "require": "./dist/index.js"
+    },
+    "./preMountSplash": {
+      "types": "./dist/splash/preMountSplash.d.ts",
+      "import": "./dist/preMountSplash.es.js",
+      "require": "./dist/preMountSplash.js"
     }
   },
   "peerDependencies": {
@@ -78,7 +83,7 @@
   },
   "scripts": {
     "dev": "vite",
-    "build": "tsc && vite build",
+    "build": "tsc && vite build && vite build -c vite.iife.config.ts",
     "lint": "eslint ."
   }
 }