uhc-portal-components-react 0.2.13 → 0.2.15

package/CHANGELOG.md

@@ -2,6 +2,19 @@
 
 ## Unreleased
 
+- Add the shared two-sided SOSCHAIN Smart Identity Card artifact. Face A keeps
+  a DID-only QR and localized subject label; face B formats the seven-digit
+  animal species context and 21-digit telephone identifier and renders an
+  SHC-like identity QR only when the owning provider supplies it already
+  signed.
+
+## 0.2.14 - 2026-10-15
+
+- Compose the existing coded-concept V2 field from the neutral
+  `TerminologyCodePickerV2` while preserving its public props, CSS classes,
+  explicit-search behavior and selected flat claims.
+- Keep the original editor path unchanged.
+
 ## 0.2.13 - 2026-10-11
 
 - Present the animal identifier as `Microchip (ISO 11784/11785)` in both

package/README.md

@@ -197,3 +197,11 @@ route destinations; it must not fork shared flow or authorization behavior.
 See [`docs/PERSONAL_FLOW_EXTRACTION.md`](docs/PERSONAL_FLOW_EXTRACTION.md) and
 the canonical cross-portal
 [`docs/HISTORICAL_PORTAL_COMPONENT_RECOVERY_MATRIX.md`](docs/HISTORICAL_PORTAL_COMPONENT_RECOVERY_MATRIX.md).
+### Two-sided SOSCHAIN identity card
+
+`SoschainSmartIdentityCardArtifact` renders the common printable card used by
+SOSChain, PetChain and VetChain. The host supplies both QR nodes: face A must
+encode only the canonical card `did:web`; face B may encode only an already
+signed provider-issued identity credential. Presentation code never issues or
+signs the credential. When no signed value is available, the reverse side
+fails closed with an explicit unavailable state.

package/dist/AnimalCardArtifact.d.ts

@@ -1,3 +1,4 @@
+import type { ReactNode } from 'react';
 export type AnimalCardArtifactProps = Readonly<{
     brand: string;
     title: string;
@@ -14,4 +15,26 @@ export type AnimalCardArtifactProps = Readonly<{
  * identifiers and QR payload; this component neither issues nor verifies them.
  */
 export declare function AnimalCardArtifact({ brand, title, provider, subject, species, cardNumber, cardDid, qrImageUrl, logoUrl, }: AnimalCardArtifactProps): import("react").JSX.Element;
+export type SoschainSmartIdentityCardArtifactProps = Readonly<{
+    /** Human cards use the fixed public label `Personal`; animal cards use the supplied localized species label. */
+    subjectKind?: 'animal' | 'personal';
+    subjectLabel?: string;
+    cardDid: string;
+    speciesId7?: string;
+    cardNumber21?: string;
+    /** Host-rendered QR whose exact payload is `cardDid`. */
+    didQr: ReactNode;
+    /** Host-rendered QR from a provider-issued, signed SHC-like identity credential. */
+    identityQr?: ReactNode;
+    logoUrl: string;
+    signedIdentityUnavailableLabel?: string;
+}>;
+/** Formats the canonical 21 digits for visual and telephone readback only. */
+export declare function formatSoschainCardNumber21(value: string): string;
+/**
+ * Two-sided physical identity artifact shared by SOSChain, PetChain and
+ * VetChain. The host owns both QR payloads. Face A is deliberately DID-only;
+ * face B never invents or signs a credential in presentation code.
+ */
+export declare function SoschainSmartIdentityCardArtifact({ subjectKind, subjectLabel, cardDid, speciesId7, cardNumber21, didQr, identityQr, logoUrl, signedIdentityUnavailableLabel, }: SoschainSmartIdentityCardArtifactProps): import("react").JSX.Element;
 //# sourceMappingURL=AnimalCardArtifact.d.ts.map

package/dist/AnimalCardArtifact.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AnimalCardArtifact.d.ts","sourceRoot":"","sources":["../src/AnimalCardArtifact.tsx"],"names":[],"mappings":"AAAA,MAAM,MAAM,uBAAuB,GAAG,QAAQ,CAAC;IAC7C,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,MAAM,CAAA;IACf,UAAU,EAAE,MAAM,CAAA;IAClB,OAAO,EAAE,MAAM,CAAA;IACf,UAAU,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAC,CAAA;AAEF;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,KAAK,EACL,QAAQ,EACR,OAAO,EACP,OAAO,EACP,UAAU,EACV,OAAO,EACP,UAAU,EACV,OAAO,GACR,EAAE,uBAAuB,+BAsBzB"}
+{"version":3,"file":"AnimalCardArtifact.d.ts","sourceRoot":"","sources":["../src/AnimalCardArtifact.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,MAAM,MAAM,uBAAuB,GAAG,QAAQ,CAAC;IAC7C,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,EAAE,MAAM,CAAA;IACf,UAAU,EAAE,MAAM,CAAA;IAClB,OAAO,EAAE,MAAM,CAAA;IACf,UAAU,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAC,CAAA;AAEF;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,KAAK,EACL,QAAQ,EACR,OAAO,EACP,OAAO,EACP,UAAU,EACV,OAAO,EACP,UAAU,EACV,OAAO,GACR,EAAE,uBAAuB,+BAsBzB;AAED,MAAM,MAAM,sCAAsC,GAAG,QAAQ,CAAC;IAC5D,gHAAgH;IAChH,WAAW,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAA;IACnC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,OAAO,EAAE,MAAM,CAAA;IACf,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,yDAAyD;IACzD,KAAK,EAAE,SAAS,CAAA;IAChB,oFAAoF;IACpF,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,OAAO,EAAE,MAAM,CAAA;IACf,8BAA8B,CAAC,EAAE,MAAM,CAAA;CACxC,CAAC,CAAA;AAEF,8EAA8E;AAC9E,wBAAgB,0BAA0B,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAIhE;AAED;;;;GAIG;AACH,wBAAgB,iCAAiC,CAAC,EAChD,WAAsB,EACtB,YAAY,EACZ,OAAO,EACP,UAAU,EACV,YAAY,EACZ,KAAK,EACL,UAAU,EACV,OAAO,EACP,8BAA8D,GAC/D,EAAE,sCAAsC,+BA+BxC"}

package/dist/AnimalCardArtifact.js

@@ -6,3 +6,22 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function AnimalCardArtifact({ brand, title, provider, subject, species, cardNumber, cardDid, qrImageUrl, logoUrl, }) {
     return _jsxs("article", { className: "uhcp-animal-card", "aria-label": `${title}: ${subject}`, children: [_jsxs("header", { className: "uhcp-animal-card-header", children: [_jsxs("div", { className: "uhcp-animal-card-brand", children: [logoUrl ? _jsx("img", { src: logoUrl, alt: "" }) : _jsx("span", { "aria-hidden": "true", children: "V" }), _jsxs("div", { children: [_jsx("strong", { children: brand }), _jsx("small", { children: title })] })] }), _jsx("span", { className: "uhcp-animal-card-chip", "aria-hidden": "true" })] }), _jsxs("div", { className: "uhcp-animal-card-body", children: [_jsxs("section", { children: [_jsx("span", { children: species }), _jsx("h3", { children: subject }), _jsxs("dl", { children: [_jsxs("div", { children: [_jsx("dt", { children: "Card" }), _jsx("dd", { children: cardNumber })] }), _jsxs("div", { children: [_jsx("dt", { children: "Provider" }), _jsx("dd", { children: provider })] })] })] }), _jsx("img", { className: "uhcp-animal-card-qr", src: qrImageUrl, alt: `${title} QR` })] }), _jsx("footer", { children: _jsx("code", { children: cardDid }) })] });
 }
+/** Formats the canonical 21 digits for visual and telephone readback only. */
+export function formatSoschainCardNumber21(value) {
+    const digits = String(value || '').replace(/[ -]/g, '');
+    if (!/^\d{21}$/.test(digits))
+        throw new TypeError('cardNumber21 must contain exactly 21 digits.');
+    return `${digits.slice(0, 5)} ${digits.slice(5, 10)} ${digits.slice(10, 15)} ${digits.slice(15, 20)} ${digits.slice(20)}`;
+}
+/**
+ * Two-sided physical identity artifact shared by SOSChain, PetChain and
+ * VetChain. The host owns both QR payloads. Face A is deliberately DID-only;
+ * face B never invents or signs a credential in presentation code.
+ */
+export function SoschainSmartIdentityCardArtifact({ subjectKind = 'animal', subjectLabel, cardDid, speciesId7, cardNumber21, didQr, identityQr, logoUrl, signedIdentityUnavailableLabel = 'Signed identity unavailable', }) {
+    const publicLabel = subjectKind === 'personal' ? 'Personal' : String(subjectLabel || 'Animal').trim();
+    const formattedCardNumber = cardNumber21 ? formatSoschainCardNumber21(cardNumber21) : undefined;
+    return _jsxs("div", { className: "uhcp-smart-id-card-set", "aria-label": `SOSCHAIN Smart Identity Card: ${publicLabel}`, children: [_jsxs("article", { className: "uhcp-smart-id-card uhcp-smart-id-card-front", "data-card-face": "front", children: [_jsxs("header", { className: "uhcp-smart-id-brand", children: [_jsx("img", { src: logoUrl, alt: "" }), _jsx("strong", { children: "SOSCHAIN" }), _jsx("span", { children: publicLabel })] }), _jsx("div", { className: "uhcp-smart-id-front-qr", "aria-label": "DID QR code", children: didQr }), _jsx("code", { children: cardDid })] }), _jsxs("article", { className: "uhcp-smart-id-card uhcp-smart-id-card-back", "data-card-face": "back", children: [_jsxs("header", { children: [_jsx("strong", { children: "SOSCHAIN SMART IDENTITY CARD" }), _jsx("span", { children: publicLabel })] }), _jsxs("div", { className: "uhcp-smart-id-back-body", children: [_jsxs("dl", { children: [speciesId7 ? _jsxs("div", { children: [_jsx("dt", { children: "Species" }), _jsx("dd", { children: speciesId7 })] }) : null, formattedCardNumber ? _jsxs("div", { children: [_jsx("dt", { children: "Card" }), _jsx("dd", { children: formattedCardNumber })] }) : null] }), identityQr
+                                ? _jsx("div", { className: "uhcp-smart-id-identity-qr", "aria-label": "Signed identity QR code", children: identityQr })
+                                : _jsx("p", { className: "uhcp-smart-id-unavailable", role: "status", children: signedIdentityUnavailableLabel })] })] })] });
+}

package/dist/ClinicalArtifactPropertiesV2.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ClinicalArtifactPropertiesV2.d.ts","sourceRoot":"","sources":["../src/ClinicalArtifactPropertiesV2.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ClinicalArtifactPropertiesV2.d.ts","sourceRoot":"","sources":["../src/ClinicalArtifactPropertiesV2.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EACV,0BAA0B,EAC1B,4BAA4B,EAC5B,yBAAyB,EACzB,+BAA+B,EAChC,MAAM,6BAA6B,CAAA;AAEpC,MAAM,MAAM,wBAAwB,GAAG,QAAQ,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CAAA;AAEjF,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,QAAQ,CAAC;IACxG,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,EAAE,MAAM,CAAA;IACd,QAAQ,EAAE,MAAM,CAAA;IAChB,IAAI,EAAE,QAAQ,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,cAAc,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACxF,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CAClC,CAAC,+BAcD;AAED,wBAAgB,sBAAsB,CAAC,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,QAAQ,EAAE,EAAE,QAAQ,CAAC;IACzN,YAAY,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,EAAE,QAAQ,CAAC;QAAE,iBAAiB,EAAE,MAAM,CAAC;QAAC,kBAAkB,EAAE,MAAM,CAAC;QAAC,sBAAsB,EAAE,MAAM,CAAC;QAAC,gBAAgB,CAAC,EAAE,MAAM,CAAC;QAAC,kBAAkB,EAAE,MAAM,CAAC;QAAC,eAAe,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAC;QAAC,aAAa,EAAE,MAAM,CAAC;QAAC,gBAAgB,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IAC/P,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,yBAAyB,KAAK,OAAO,CAAC,SAAS,4BAA4B,EAAE,CAAC,CAAA;IAC1G,sBAAsB,CAAC,EAAE,+BAA+B,CAAA;IACxD,QAAQ,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAA;CACrF,CAAC,+BAkBD;AAED,wBAAgB,qBAAqB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,QAAQ,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,EAAE,SAAS,wBAAwB,EAAE,CAAC;IAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CAAE,CAAC,+BAEnO;AAED,wBAAgB,yBAAyB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,QAAQ,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CAAE,CAAC,+BAEhL;AAED,wBAAgB,gBAAgB,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,EAAE,QAAQ,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,SAAS,wBAAwB,EAAE,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAAC,KAAK,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC,sCAG9Q;AAED,wBAAgB,4BAA4B,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,QAAQ,CAAC;IAC9F,IAAI,EAAE,QAAQ,CAAC;QAAE,SAAS,EAAE,MAAM,CAAC;QAAC,YAAY,EAAE,MAAM,CAAC;QAAC,cAAc,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACnF,WAAW,EAAE,SAAS,0BAA0B,EAAE,CAAA;IAClD,OAAO,EAAE,CAAC,KAAK,EAAE,SAAS,IAAI,EAAE,KAAK,IAAI,CAAA;IACzC,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAA;CAC/B,CAAC,+BAKD"}

package/dist/ClinicalArtifactPropertiesV2.js

@@ -1,6 +1,7 @@
 'use client';
 import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useMemo, useState } from 'react';
+import { TerminologyCodePickerV2 } from 'terminology-components-react/code-picker-v2';
 import { composeFhirDateTimeFromLocalParts, splitFhirDateTimeForInput, } from 'fhir-data-utils-ts/fhir-temporal-presentation';
 import { ClinicalSpeechInputButton } from './ClinicalSpeechInput.js';
 export function DateTimePropertyV2({ label, value, required, locale, timeZone, copy, onChange }) {
@@ -13,62 +14,7 @@ export function DateTimePropertyV2({ label, value, required, locale, timeZone, c
     return _jsxs("fieldset", { className: "uhcp-clinical-property-v2 uhcp-date-time-property-v2", children: [_jsxs("legend", { children: [label, required ? ' *' : ''] }), _jsxs("label", { children: [_jsx("span", { children: copy.date }), _jsx("input", { "aria-label": `${label}: ${copy.date}`, type: "date", required: required, value: parts.date, onChange: event => update({ ...parts, date: event.currentTarget.value }) })] }), _jsx("button", { type: "button", onClick: () => update({ ...parts, date: current.date }), children: copy.useToday }), _jsxs("label", { children: [_jsx("span", { children: copy.time }), _jsx("input", { "aria-label": `${label}: ${copy.time}`, type: "time", step: "60", value: parts.time.slice(0, 5), onChange: event => update({ ...parts, time: event.currentTarget.value }) })] }), _jsx("button", { type: "button", onClick: () => update({ ...parts, time: current.time.slice(0, 5) }), children: copy.useCurrentTime })] });
 }
 export function CodedConceptPropertyV2({ resourceType, textClaim, codeClaim, displayClaim, label, locale, taxonomyId, text, code, display, required, copy, searchTerminology, loadTerminologySources, onChange }) {
-    const [query, setQuery] = useState(text || display);
-    const [sources, setSources] = useState([]);
-    const [selectedSources, setSelectedSources] = useState([]);
-    const [candidates, setCandidates] = useState([]);
-    const [busy, setBusy] = useState(false);
-    const [failed, setFailed] = useState(false);
-    const [searched, setSearched] = useState(false);
-    useEffect(() => {
-        if (!loadTerminologySources)
-            return;
-        let current = true;
-        void loadTerminologySources({ resourceType, claim: codeClaim, language: locale, taxonomyId }).then(next => {
-            if (!current)
-                return;
-            setSources(next);
-            const defaults = next.filter(source => source.default).map(source => source.id);
-            setSelectedSources(defaults.length ? defaults : next[0] ? [next[0].id] : []);
-        }).catch(() => current && setSources([]));
-        return () => { current = false; };
-    }, [codeClaim, loadTerminologySources, locale, resourceType, taxonomyId]);
-    const selectedToken = useMemo(() => code, [code]);
-    const search = async () => {
-        if (!searchTerminology || query.trim().length < 2 || busy)
-            return;
-        setBusy(true);
-        setFailed(false);
-        setSearched(false);
-        try {
-            let governedSources = selectedSources;
-            if (!governedSources.length && loadTerminologySources) {
-                const loaded = await loadTerminologySources({ resourceType, claim: codeClaim, language: locale, taxonomyId });
-                const defaults = loaded.filter(source => source.default).map(source => source.id);
-                governedSources = defaults.length ? defaults : loaded[0] ? [loaded[0].id] : [];
-                setSources(loaded);
-                setSelectedSources(governedSources);
-            }
-            setCandidates(await searchTerminology({ resourceType, claim: codeClaim, language: locale, text: query.trim(), taxonomyId, limit: 20, ...(governedSources.length ? { sources: governedSources } : {}) }));
-            setSearched(true);
-        }
-        catch {
-            setCandidates([]);
-            setFailed(true);
-        }
-        finally {
-            setBusy(false);
-        }
-    };
-    return _jsxs("div", { className: "uhcp-clinical-property-v2 uhcp-coded-concept-property-v2", children: [_jsxs("span", { className: "uhcp-clinical-editor-field-heading", children: [_jsxs("label", { htmlFor: `${codeClaim}-query`, children: [label, required ? ' *' : ''] }), textClaim ? _jsx(ClinicalSpeechInputButton, { resourceType: resourceType, claim: textClaim, locale: locale, fieldLabel: label, onTranscript: transcript => { setQuery(transcript); onChange({ text: transcript, code: '', display: '' }); } }) : null] }), _jsxs("div", { className: "uhcp-coded-concept-query-v2", children: [_jsx("input", { id: `${codeClaim}-query`, "aria-label": label, required: required, readOnly: Boolean(code), value: code ? (text || query || display) : query, onChange: event => { setQuery(event.currentTarget.value); setCandidates([]); setSearched(false); setFailed(false); onChange({ text: event.currentTarget.value, code: '', display: '' }); } }), _jsx("button", { type: "button", className: "uhcp-icon-button-v2", "aria-label": copy.searchTerminology, title: copy.searchTerminology, disabled: Boolean(code) || busy || query.trim().length < 2, onClick: () => void search(), children: _jsx("svg", { "aria-hidden": "true", viewBox: "0 0 24 24", children: _jsx("path", { d: "m21 21-4.35-4.35m1.35-5.65a7 7 0 1 1-14 0 7 7 0 0 1 14 0Z" }) }) }), code ? _jsx("button", { type: "button", className: "uhcp-clear-code-v2", "aria-label": copy.clearCoding, title: copy.clearCoding, onClick: () => { setQuery(''); setCandidates([]); onChange({ text: '', code: '', display: '' }); }, children: "\u00D7" }) : null] }), sources.length ? _jsxs("fieldset", { className: "uhcp-coding-sources-v2", children: [_jsx("legend", { children: copy.terminologySources }), sources.map(source => _jsxs("label", { children: [_jsx("input", { type: "checkbox", checked: selectedSources.includes(source.id), onChange: event => { const checked = event.currentTarget.checked; setSelectedSources(current => checked ? [...new Set([...current, source.id])] : current.filter(value => value !== source.id)); setCandidates([]); setSearched(false); setFailed(false); } }), source.label || source.id] }, source.id))] }) : null, busy ? _jsx("small", { role: "status", children: copy.terminologyLoading }) : null, failed ? _jsx("small", { role: "alert", children: copy.terminologyUnavailable }) : null, searched && !busy && !failed && candidates.length === 0 ? _jsx("small", { role: "status", children: copy.terminologyEmpty || copy.terminologyUnavailable }) : null, candidates.length ? _jsxs("label", { children: [copy.selectCandidate, _jsxs("select", { "aria-label": copy.selectCandidate, value: selectedToken, onChange: event => {
-                            const candidate = candidates.find(value => `${value.system}|${value.code}` === event.currentTarget.value);
-                            if (!candidate)
-                                return;
-                            const localText = candidate.text || query || candidate.display;
-                            setQuery(localText);
-                            onChange({ text: localText, code: `${candidate.system}|${candidate.code}`, display: candidate.display });
-                            setCandidates([]);
-                        }, children: [_jsx("option", { value: "" }), candidates.map(candidate => _jsxs("option", { value: `${candidate.system}|${candidate.code}`, children: [candidate.text && candidate.text !== candidate.display ? `${candidate.text} — ${candidate.display}` : candidate.display, " (", candidate.code, ")"] }, `${candidate.system}|${candidate.code}`))] })] }) : null, code ? _jsxs("div", { className: "uhcp-selected-code-v2", children: [_jsxs("label", { children: [copy.canonicalCode, _jsx("input", { "aria-label": copy.canonicalCode, readOnly: true, value: code })] }), _jsxs("label", { children: [copy.canonicalDisplay, _jsx("input", { "aria-label": copy.canonicalDisplay, readOnly: true, value: display })] })] }) : null] });
+    return _jsx(TerminologyCodePickerV2, { resourceType: resourceType, param: codeClaim, language: locale, ...(taxonomyId ? { taxonomyId } : {}), label: label, text: text, code: code, display: display, required: required, copy: { search: copy.searchTerminology, loading: copy.terminologyLoading, unavailable: copy.terminologyUnavailable, empty: copy.terminologyEmpty, sources: copy.terminologySources, select: copy.selectCandidate, clear: copy.clearCoding, canonicalCode: copy.canonicalCode, canonicalDisplay: copy.canonicalDisplay }, ...(searchTerminology ? { search: async (input) => (await searchTerminology({ resourceType: input.resourceType, claim: input.param, language: input.language, text: input.text, limit: input.limit, ...(input.taxonomyId ? { taxonomyId: input.taxonomyId } : {}), ...(input.sources ? { sources: input.sources } : {}) })).map(candidate => ({ ...candidate, text: candidate.text || candidate.display, language: input.language })) } : {}), ...(loadTerminologySources ? { loadSources: input => loadTerminologySources({ resourceType: input.resourceType, claim: input.param, language: input.language, ...(input.taxonomyId ? { taxonomyId: input.taxonomyId } : {}) }) } : {}), onChange: onChange, headingAction: textClaim ? _jsx(ClinicalSpeechInputButton, { resourceType: resourceType, claim: textClaim, locale: locale, fieldLabel: label, onTranscript: transcript => onChange({ text: transcript, code: '', display: '' }) }) : null, classNames: { root: 'uhcp-clinical-property-v2 uhcp-coded-concept-property-v2', heading: 'uhcp-clinical-editor-field-heading', query: 'uhcp-coded-concept-query-v2', searchButton: 'uhcp-icon-button-v2', clearButton: 'uhcp-clear-code-v2', sources: 'uhcp-coding-sources-v2', selected: 'uhcp-selected-code-v2' } });
 }
 export function CodedSelectPropertyV2({ label, value, required, options, onChange }) {
     return _jsxs("label", { className: "uhcp-clinical-property-v2", children: [label, required ? ' *' : '', _jsxs("select", { "aria-label": label, required: required, value: value, onChange: event => onChange(event.currentTarget.value), children: [_jsx("option", { value: "" }), options.map(option => _jsx("option", { value: option.value, children: option.label }, option.value))] })] });

package/dist/styles.css

@@ -833,6 +833,30 @@ html[data-theme='dark'] .uhcp-brand-artwork-dark { display: block !important; }
 .uhcp-animal-card footer { min-width: 0; }
 .uhcp-animal-card footer code { color: inherit; display: block; font-size: .68rem; opacity: .8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 @media(max-width: 480px) { .uhcp-animal-card { aspect-ratio: auto; min-height: 17rem; } .uhcp-animal-card-qr { height: 6.25rem; width: 6.25rem; } }
+.uhcp-smart-id-card-set { display: grid; gap: 1rem; width: min(100%, 33.7rem); }
+.uhcp-smart-id-card { aspect-ratio: 1.586; border: 1px solid #cbd5e1; border-radius: 1.15rem; box-shadow: 0 1rem 2.5rem rgb(2 30 51 / 18%); box-sizing: border-box; overflow: hidden; padding: .75rem; position: relative; width: 100%; }
+.uhcp-smart-id-card-front { background: linear-gradient(145deg, #061c35 0%, #0a4169 58%, #087f8d 100%); color: #fff; display: grid; gap: .35rem; grid-template-rows: auto 1fr auto; }
+.uhcp-smart-id-card-front::after { background: radial-gradient(circle, rgb(255 255 255 / 16%), transparent 70%); content: ''; height: 18rem; inset: -8rem -7rem auto auto; pointer-events: none; position: absolute; width: 18rem; }
+.uhcp-smart-id-brand { align-items: center; display: grid; gap: .45rem; grid-template-columns: 2rem auto 1fr; position: relative; z-index: 1; }
+.uhcp-smart-id-brand img { background: #fff; border-radius: .48rem; box-sizing: border-box; height: 2rem; object-fit: contain; padding: .16rem; width: 2rem; }
+.uhcp-smart-id-brand strong { font-size: .85rem; letter-spacing: .08em; }
+.uhcp-smart-id-brand span { font-size: .72rem; font-weight: 800; justify-self: end; text-align: end; }
+.uhcp-smart-id-front-qr { align-self: center; background: #fff; border: .35rem solid #fff; border-radius: .55rem; box-sizing: border-box; height: 7rem; justify-self: center; width: 7rem; }
+.uhcp-smart-id-front-qr > * { display: block; height: 100%; width: 100%; }
+.uhcp-smart-id-card-front code { color: inherit; display: block; font-size: .5rem; opacity: .82; overflow: hidden; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
+.uhcp-smart-id-card-back { background: #fff; color: #0f2942; display: grid; gap: .5rem; grid-template-rows: auto 1fr; }
+.uhcp-smart-id-card-back > header { align-items: baseline; border-bottom: 2px solid #0f9ca8; display: flex; gap: .5rem; justify-content: space-between; padding-bottom: .35rem; }
+.uhcp-smart-id-card-back > header strong { font-size: .68rem; letter-spacing: .08em; }
+.uhcp-smart-id-card-back > header span { color: #087f8d; font-size: .68rem; font-weight: 850; text-align: end; }
+.uhcp-smart-id-back-body { align-items: center; display: grid; gap: .65rem; grid-template-columns: minmax(0, 1fr) 7rem; min-height: 0; }
+.uhcp-smart-id-back-body dl { display: grid; gap: .5rem; margin: 0; }
+.uhcp-smart-id-back-body dt { color: #526174; font-size: .55rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
+.uhcp-smart-id-back-body dd { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: .72rem; font-weight: 850; margin: .12rem 0 0; overflow-wrap: anywhere; }
+.uhcp-smart-id-identity-qr { background: #fff; box-sizing: border-box; height: 7rem; width: 7rem; }
+.uhcp-smart-id-identity-qr > * { display: block; height: 100%; width: 100%; }
+.uhcp-smart-id-unavailable { align-items: center; background: #f1f5f9; border: 1px dashed #94a3b8; border-radius: .6rem; box-sizing: border-box; color: #526174; display: flex; font-size: .62rem; height: 7rem; justify-content: center; margin: 0; padding: .4rem; text-align: center; width: 7rem; }
+@media(max-width: 480px) { .uhcp-smart-id-back-body { grid-template-columns: 1fr 6.5rem; } .uhcp-smart-id-identity-qr, .uhcp-smart-id-unavailable { height: 6.5rem; width: 6.5rem; } }
+@media print { .uhcp-smart-id-card-set { gap: 0; } .uhcp-smart-id-card { break-after: page; box-shadow: none; height: 53.98mm; width: 85.6mm; } .uhcp-smart-id-card:last-child { break-after: auto; } }
 .uhcp-animal-controller-attestation { border: 1px solid var(--uhcp-border, #d9dee7); border-radius: 1.25rem; display: grid; gap: 1rem; padding: 1rem; }
 .uhcp-animal-controller-attestation header h2, .uhcp-animal-controller-attestation header p { margin: 0; }
 .uhcp-animal-controller-attestation header p { color: var(--uhcp-muted, #5f6875); margin-top: .35rem; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uhc-portal-components-react",
-  "version": "0.2.13",
+  "version": "0.2.15",
   "description": "Brand-neutral React portal shell, account preferences and protected-profile UI for UHC and VetChain portals.",
   "license": "Apache-2.0",
   "type": "module",
@@ -33,7 +33,8 @@
   "dependencies": {
     "fhir-data-utils-ts": "0.6.18",
     "gdc-common-utils-ts": "2.9.30",
-    "sos-data-utils-ts": "0.6.3"
+    "sos-data-utils-ts": "0.6.3",
+    "terminology-components-react": "0.2.0"
   },
   "devDependencies": {
     "@testing-library/react": "^16.3.2",