uhc-portal-components-react 0.1.14 → 0.1.15

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 0.1.15
+
+- Add an accessible, animated `PortalLoadingSkeleton` that authenticated
+  portals render while provider data is pending, before any empty or stale
+  business state is eligible to appear.
+
 ## 0.1.14
 
 - Add a brand-neutral, three-step identity-evidence workspace that keeps the

package/dist/PortalLoadingSkeleton.d.ts

@@ -0,0 +1,14 @@
+export type PortalLoadingSkeletonProps = Readonly<{
+    label: string;
+    rows?: number;
+    compact?: boolean;
+}>;
+/**
+ * Shared neutral loading surface for authenticated portal data.
+ *
+ * Hosts render this instead of business empty states while a BFF/provider
+ * read is pending. It contains no inferred card, identity or authorization
+ * data and therefore cannot flash stale or misleading content.
+ */
+export declare function PortalLoadingSkeleton({ label, rows, compact, }: PortalLoadingSkeletonProps): import("react").JSX.Element;
+//# sourceMappingURL=PortalLoadingSkeleton.d.ts.map

package/dist/PortalLoadingSkeleton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PortalLoadingSkeleton.d.ts","sourceRoot":"","sources":["../src/PortalLoadingSkeleton.tsx"],"names":[],"mappings":"AAAA,MAAM,MAAM,0BAA0B,GAAG,QAAQ,CAAC;IAChD,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CAAC,CAAA;AAEF;;;;;;GAMG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,IAAQ,EACR,OAAe,GAChB,EAAE,0BAA0B,+BAsB5B"}

package/dist/PortalLoadingSkeleton.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Shared neutral loading surface for authenticated portal data.
+ *
+ * Hosts render this instead of business empty states while a BFF/provider
+ * read is pending. It contains no inferred card, identity or authorization
+ * data and therefore cannot flash stale or misleading content.
+ */
+export function PortalLoadingSkeleton({ label, rows = 3, compact = false, }) {
+    return (_jsxs("section", { className: `uhcp-loading-skeleton${compact ? ' uhcp-loading-skeleton-compact' : ''}`, role: "status", "aria-busy": "true", "aria-live": "polite", children: [_jsx("span", { className: "uhcp-loading-label", children: label }), _jsx("div", { className: "uhcp-loading-heading", "aria-hidden": "true" }), _jsx("div", { className: "uhcp-loading-copy", "aria-hidden": "true" }), _jsx("div", { className: "uhcp-loading-grid", "aria-hidden": "true", children: Array.from({ length: Math.max(1, rows) }, (_, index) => (_jsxs("div", { className: "uhcp-loading-row", children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }, index))) })] }));
+}

package/dist/index.d.ts

@@ -5,6 +5,7 @@ export * from './PortalHeader.js';
 export * from './PortalShell.js';
 export * from './PortalEntry.js';
 export * from './ProfileProtectionGate.js';
+export * from './PortalLoadingSkeleton.js';
 export * from './ClinicalSectionSummary.js';
 export * from './IpsBundleSummary.js';
 export * from './InvitationAcceptancePanel.js';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA;AAC9B,cAAc,kBAAkB,CAAA;AAChC,cAAc,yBAAyB,CAAA;AACvC,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,kBAAkB,CAAA;AAChC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,uBAAuB,CAAA;AACrC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,wBAAwB,CAAA;AACtC,cAAc,0CAA0C,CAAA;AACxD,cAAc,kCAAkC,CAAA;AAChD,cAAc,0BAA0B,CAAA;AACxC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,gCAAgC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA;AAC9B,cAAc,kBAAkB,CAAA;AAChC,cAAc,yBAAyB,CAAA;AACvC,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,kBAAkB,CAAA;AAChC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,uBAAuB,CAAA;AACrC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,wBAAwB,CAAA;AACtC,cAAc,0CAA0C,CAAA;AACxD,cAAc,kCAAkC,CAAA;AAChD,cAAc,0BAA0B,CAAA;AACxC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,gCAAgC,CAAA"}

package/dist/index.js

@@ -5,6 +5,7 @@ export * from './PortalHeader.js';
 export * from './PortalShell.js';
 export * from './PortalEntry.js';
 export * from './ProfileProtectionGate.js';
+export * from './PortalLoadingSkeleton.js';
 export * from './ClinicalSectionSummary.js';
 export * from './IpsBundleSummary.js';
 export * from './InvitationAcceptancePanel.js';

package/dist/styles.css

@@ -455,3 +455,4 @@ html[data-theme='dark'] .uhcp-brand-artwork-dark { display: block !important; }
 @media (max-width: 620px) { .uhcp-emergency-copy > header { display: grid; } .uhcp-emergency-copy-legend { width: 100%; } }
 .uhcp-settings{max-width:72rem;margin:0 auto;padding:2rem 1rem 4rem;display:grid;gap:1rem}.uhcp-settings>header,.uhcp-settings>section{background:var(--uhcp-surface,#fff);border:1px solid var(--uhcp-border,#dbe4ea);border-radius:1rem;padding:1.25rem}.uhcp-settings h1,.uhcp-settings h2{margin-top:0}.uhcp-settings fieldset{border:0;padding:0;margin:1rem 0;display:flex;gap:.5rem;flex-wrap:wrap}.uhcp-settings legend{width:100%;font-weight:700;margin-bottom:.5rem}.uhcp-settings button,.uhcp-settings-links a{border:1px solid var(--uhcp-border,#c9d7df);border-radius:.7rem;background:transparent;color:inherit;padding:.65rem .85rem;text-decoration:none}.uhcp-settings button[aria-pressed=true]{background:var(--uhcp-accent,#dceff7);border-color:var(--uhcp-accent-strong,#2489a7)}.uhcp-settings-links{display:flex;gap:.6rem;flex-wrap:wrap}
 .uhcp-legal-document{color:var(--uhcp-text);line-height:1.7}.uhcp-legal-document h2{font-size:clamp(1.6rem,4vw,2.35rem);line-height:1.15;margin:0 0 1.25rem}.uhcp-legal-document h3{font-size:1.2rem;line-height:1.3;margin:2rem 0 .65rem}.uhcp-legal-document p{margin:0 0 1rem}.uhcp-legal-document ul{margin:0 0 1rem;padding-left:1.4rem}.uhcp-legal-document code{background:var(--uhcp-panel-muted);border-radius:.3rem;padding:.08rem .3rem}
+.uhcp-loading-skeleton{background:var(--uhcp-panel);border:1px solid var(--uhcp-border);border-radius:2rem;display:grid;gap:1rem;margin:0 auto;max-width:1160px;overflow:hidden;padding:clamp(1.25rem,4vw,2.5rem);position:relative}.uhcp-loading-skeleton::after{animation:uhcp-loading-sweep 1.45s ease-in-out infinite;background:linear-gradient(90deg,transparent,color-mix(in srgb,#fff 42%,transparent),transparent);content:"";inset:0;position:absolute;transform:translateX(-100%)}.uhcp-loading-label{height:1px;overflow:hidden;position:absolute;width:1px;clip-path:inset(50%)}.uhcp-loading-heading,.uhcp-loading-copy,.uhcp-loading-row span{animation:uhcp-loading-pulse 1.45s ease-in-out infinite;background:color-mix(in srgb,var(--uhcp-muted) 17%,var(--uhcp-panel-muted));border-radius:999px}.uhcp-loading-heading{height:2.25rem;max-width:23rem;width:62%}.uhcp-loading-copy{height:1rem;max-width:38rem;width:86%}.uhcp-loading-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));margin-top:.5rem}.uhcp-loading-row{background:var(--uhcp-panel-muted);border:1px solid var(--uhcp-border);border-radius:1.35rem;display:grid;gap:.8rem;padding:1.25rem}.uhcp-loading-row span{display:block;height:.8rem}.uhcp-loading-row span:nth-child(1){width:35%}.uhcp-loading-row span:nth-child(2){height:1.2rem;width:72%}.uhcp-loading-row span:nth-child(3){width:90%}.uhcp-loading-skeleton-compact{border-radius:1.25rem;padding:1.25rem}.uhcp-loading-skeleton-compact .uhcp-loading-heading{height:1.5rem}@keyframes uhcp-loading-pulse{0%,100%{opacity:.55}50%{opacity:1}}@keyframes uhcp-loading-sweep{to{transform:translateX(100%)}}@media(prefers-reduced-motion:reduce){.uhcp-loading-skeleton::after,.uhcp-loading-heading,.uhcp-loading-copy,.uhcp-loading-row span{animation:none}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uhc-portal-components-react",
-  "version": "0.1.14",
+  "version": "0.1.15",
   "description": "Brand-neutral React portal shell, account preferences and protected-profile UI for UHC and VetChain portals.",
   "license": "Apache-2.0",
   "type": "module",