@mr.dj2u/library-registry 0.2.0 → 0.3.0

package/assets/mds/src/features/exposition/stylist-screen.tsx

@@ -13,6 +13,7 @@ import {
   Text,
   TextInput,
   type TextStyle,
+  useColorScheme,
   View,
 } from 'react-native';
 import ColorPicker, { HueSlider, Panel1, Preview } from 'reanimated-color-picker';
@@ -29,7 +30,7 @@ import defaultThemeTokens, {
   type StylistSemanticFamilies,
   type StylistThemeTokens,
 } from '../../theme/tokens';
-import { useSetAppTheme } from '../../theme/provider';
+import { readSystemScheme, useSetAppTheme } from '../../theme/provider';
 
 type SemanticColorKey = keyof StylistSemanticFamilies;
 type PaletteColorKey = keyof StylistColorPalette;
@@ -864,21 +865,45 @@ function ensureWebFontLoaded(fontFamily: string): void {
   loadedWebFonts.add(normalized);
 }
 
+function withPreviewScheme(
+  theme: ExtendedStylistThemeTokens,
+  scheme: StylistColorScheme
+): ExtendedStylistThemeTokens {
+  if (theme.colorSystem.previewScheme === scheme) {
+    return theme;
+  }
+
+  return {
+    ...theme,
+    colorSystem: {
+      ...theme.colorSystem,
+      previewScheme: scheme,
+    },
+  };
+}
+
+function createInitialStylistTheme(): ExtendedStylistThemeTokens {
+  const theme = withFontFamilyAlias(
+    normalizeThemeTypography(
+      reconcileTheme(stylistThemeTokens, 'picker', defaultBgFamilies, defaultBgFamilyShades)
+    )
+  );
+  const systemScheme = readSystemScheme();
+  return systemScheme ? withPreviewScheme(theme, systemScheme) : theme;
+}
+
 export default function StylistScreen() {
   const insets = useSafeAreaInsets();
   const setAppTheme = useSetAppTheme();
+  const systemScheme = useColorScheme();
+  const userOverrodePreview = useRef(false);
+  const previewSchemeInitializedFromSystem = useRef(readSystemScheme() !== null);
   const [colorInputMode, setColorInputMode] = useState<ColorInputMode>('picker');
   const [bgFamilies, setBgFamilies] =
     useState<Record<StylistColorScheme, PaletteFamilies>>(defaultBgFamilies);
   const [bgFamilyShades, setBgFamilyShades] =
     useState<Record<StylistColorScheme, PaletteShades>>(defaultBgFamilyShades);
-  const [theme, setTheme] = useState<ExtendedStylistThemeTokens>(
-    withFontFamilyAlias(
-      normalizeThemeTypography(
-        reconcileTheme(stylistThemeTokens, 'picker', defaultBgFamilies, defaultBgFamilyShades)
-      )
-    )
-  );
+  const [theme, setTheme] = useState<ExtendedStylistThemeTokens>(createInitialStylistTheme);
   const [selectedColor, setSelectedColor] = useState<PaletteColorKey>('primary');
   const [pickerHexDraft, setPickerHexDraft] = useState('#');
   const [livePickerPreview, setLivePickerPreview] = useState<LivePickerPreview | null>(null);
@@ -1007,13 +1032,27 @@ export default function StylistScreen() {
           return;
         }
         if (payload.theme) {
-          const nextTheme = withFontFamilyAlias(
+          const hydratedTheme = withFontFamilyAlias(
             normalizeThemeTypography(
               reconcileTheme(payload.theme, 'picker', defaultBgFamilies, defaultBgFamilyShades)
             )
           );
-          setTheme((prev) => (areThemesEqual(prev, nextTheme) ? prev : nextTheme));
-          setAppTheme(nextTheme);
+          const systemSchemeAtLoad = readSystemScheme();
+          setTheme((prev) => {
+            const resolvedScheme = userOverrodePreview.current
+              ? prev.colorSystem.previewScheme
+              : (systemSchemeAtLoad ?? prev.colorSystem.previewScheme);
+            if (!userOverrodePreview.current && systemSchemeAtLoad) {
+              previewSchemeInitializedFromSystem.current = true;
+            }
+            const nextTheme = withPreviewScheme(hydratedTheme, resolvedScheme);
+            return areThemesEqual(prev, nextTheme) ? prev : nextTheme;
+          });
+          setAppTheme(
+            systemSchemeAtLoad && !userOverrodePreview.current
+              ? withPreviewScheme(hydratedTheme, systemSchemeAtLoad)
+              : hydratedTheme
+          );
           setExplicitFontRoles({
             fontDisplay: true,
             fontTitle: true,
@@ -1054,6 +1093,17 @@ export default function StylistScreen() {
     };
   }, [setAppTheme]);
 
+  useEffect(() => {
+    if (userOverrodePreview.current || previewSchemeInitializedFromSystem.current) {
+      return;
+    }
+    if (systemScheme !== 'light' && systemScheme !== 'dark') {
+      return;
+    }
+    previewSchemeInitializedFromSystem.current = true;
+    setTheme((prev) => withPreviewScheme(prev, systemScheme));
+  }, [systemScheme]);
+
   const activeScheme = theme.colorSystem.previewScheme;
   const basePreviewColors = theme.colors[activeScheme];
   const baseEditablePalette =
@@ -1353,6 +1403,7 @@ export default function StylistScreen() {
   }
 
   function updatePreviewScheme(scheme: StylistColorScheme) {
+    userOverrodePreview.current = true;
     updateTheme((prev) => ({
       ...prev,
       colorSystem: {

package/assets/mds/src/features/legal/legal-acceptance-adapter.ts

@@ -0,0 +1,190 @@
+import { useCallback, useEffect, useMemo, useState } from 'react';
+
+import {
+  configureLegalAcceptanceAdapter as configureSharedLegalAcceptanceAdapter,
+  getLegalAcceptanceUserId,
+  getLegalAcceptanceAdapter,
+  memoryLegalAcceptanceAdapter as sharedMemoryLegalAcceptanceAdapter,
+  notifyLegalAcceptanceChanged,
+  setLegalAcceptanceUserId,
+  subscribeToLegalAcceptanceChanges,
+} from './legal-acceptance-config';
+import { legalDocuments, type LegalDocument, type LegalDocumentId } from './legal-documents';
+
+export type LegalGateStatus = 'checking' | 'needs-legal' | 'complete' | 'error';
+
+export interface RequiredLegalDocument {
+  documentId: LegalDocumentId;
+  acceptanceVersion: string;
+  title: string;
+  changeSummary: string;
+}
+
+export interface LegalAcceptanceSnapshot {
+  status: LegalGateStatus;
+  requiredDocuments: RequiredLegalDocument[];
+  acceptedDocumentKeys: string[];
+  error?: string;
+}
+
+export interface LegalAcceptanceAdapter {
+  loadRequiredLegalAcceptances(
+    requiredDocuments: RequiredLegalDocument[],
+    userId?: string,
+  ): Promise<LegalAcceptanceSnapshot>;
+  acceptLegalDocument(
+    document: RequiredLegalDocument,
+    input?: { userId?: string; flowId?: string; flowVersion?: number },
+  ): Promise<void>;
+}
+
+function toRequiredLegalDocument(document: LegalDocument): RequiredLegalDocument {
+  return {
+    documentId: document.id,
+    acceptanceVersion: document.acceptanceVersion,
+    title: document.title,
+    changeSummary: document.changeSummary,
+  };
+}
+
+export function getRequiredMaterialLegalDocuments(): RequiredLegalDocument[] {
+  return Object.values(legalDocuments)
+    .filter((document) => document.requiresReacceptance)
+    .map(toRequiredLegalDocument);
+}
+
+export const memoryLegalAcceptanceAdapter =
+  sharedMemoryLegalAcceptanceAdapter as LegalAcceptanceAdapter;
+
+/** @deprecated Use memoryLegalAcceptanceAdapter. Kept as a compatible alias. */
+export const localLegalAcceptanceAdapter = memoryLegalAcceptanceAdapter;
+
+export function configureLegalAcceptanceAdapter(adapter: LegalAcceptanceAdapter): void {
+  configureSharedLegalAcceptanceAdapter(adapter);
+}
+
+export { setLegalAcceptanceUserId, subscribeToLegalAcceptanceChanges };
+
+export function useLegalUpdateGateSnapshot(
+  adapter: LegalAcceptanceAdapter = getLegalAcceptanceAdapter() as LegalAcceptanceAdapter,
+  userId?: string,
+) {
+  const requiredMaterialDocuments = useMemo(() => getRequiredMaterialLegalDocuments(), []);
+  const [snapshot, setSnapshot] = useState<LegalAcceptanceSnapshot>({
+    status: 'checking',
+    requiredDocuments: requiredMaterialDocuments,
+    acceptedDocumentKeys: [],
+  });
+  const [savingDocumentId, setSavingDocumentId] = useState<LegalDocumentId | null>(null);
+
+  const refresh = useCallback(async () => {
+    setSnapshot((current) => ({
+      ...current,
+      status: 'checking',
+      error: undefined,
+    }));
+    try {
+      const effectiveUserId = userId ?? getLegalAcceptanceUserId();
+      const nextSnapshot = await adapter.loadRequiredLegalAcceptances(
+        requiredMaterialDocuments,
+        effectiveUserId,
+      );
+      setSnapshot(nextSnapshot);
+      return nextSnapshot;
+    } catch (error) {
+      const message = error instanceof Error ? error.message : 'Unable to check legal acceptance.';
+      const errorSnapshot: LegalAcceptanceSnapshot = {
+        status: 'error',
+        requiredDocuments: requiredMaterialDocuments,
+        acceptedDocumentKeys: [],
+        error: message,
+      };
+      setSnapshot(errorSnapshot);
+      return errorSnapshot;
+    }
+  }, [adapter, userId, requiredMaterialDocuments]);
+
+  const acceptDocument = useCallback(
+    async (
+      document: RequiredLegalDocument,
+      input?: { userId?: string; flowId?: string; flowVersion?: number },
+    ) => {
+      setSavingDocumentId(document.documentId);
+      try {
+        const effectiveUserId = userId ?? getLegalAcceptanceUserId();
+        await adapter.acceptLegalDocument(document, {
+          userId: input?.userId ?? effectiveUserId,
+          flowId: input?.flowId,
+          flowVersion: input?.flowVersion,
+        });
+        if (adapter !== memoryLegalAcceptanceAdapter) {
+          notifyLegalAcceptanceChanged();
+        }
+        return await refresh();
+      } finally {
+        setSavingDocumentId(null);
+      }
+    },
+    [adapter, userId, refresh],
+  );
+
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      void refresh();
+    }, 0);
+    return () => clearTimeout(timer);
+  }, [refresh]);
+
+  useEffect(
+    () =>
+      subscribeToLegalAcceptanceChanges(() => {
+        void refresh();
+      }),
+    [refresh],
+  );
+
+  return {
+    snapshot,
+    refresh,
+    acceptDocument,
+    savingDocumentId,
+  };
+}
+
+export function useLegalUpdateGateStatus(
+  adapter: LegalAcceptanceAdapter = getLegalAcceptanceAdapter() as LegalAcceptanceAdapter,
+  userId?: string,
+): LegalGateStatus {
+  return useLegalUpdateGateSnapshot(adapter, userId).snapshot.status;
+}
+
+export function useLegalAcceptance(
+  adapter: LegalAcceptanceAdapter = getLegalAcceptanceAdapter() as LegalAcceptanceAdapter,
+  userId?: string,
+) {
+  const requiredDocuments = useMemo(() => getRequiredMaterialLegalDocuments(), []);
+  const { snapshot, acceptDocument, refresh } = useLegalUpdateGateSnapshot(adapter, userId);
+
+  const acceptedDocuments = {
+    terms: !snapshot.requiredDocuments.some((document) => document.documentId === 'terms'),
+    privacy: !snapshot.requiredDocuments.some((document) => document.documentId === 'privacy'),
+  };
+
+  return {
+    acceptedDocuments,
+    hasAcceptedRequiredDocuments: snapshot.status === 'complete',
+    acceptDocument: (documentId: LegalDocumentId) => {
+      const document = requiredDocuments.find((item) => item.documentId === documentId);
+      if (document) {
+        return acceptDocument(document, { userId });
+      }
+      return refresh();
+    },
+    revokeDocument: () => {
+      throw new Error('Legal acceptance records are append-only. Replace the adapter for test resets.');
+    },
+    resetLegalAcceptance: () => {
+      throw new Error('Legal acceptance records are append-only. Replace the adapter for test resets.');
+    },
+  };
+}

package/assets/mds/src/features/legal/legal-acceptance-config.ts

@@ -0,0 +1,79 @@
+export type LegalAcceptanceConfigAdapter = {
+  loadRequiredLegalAcceptances(
+    requiredDocuments: Array<{ documentId: string; acceptanceVersion: string }>,
+    userId?: string,
+  ): Promise<{
+    status: 'checking' | 'needs-legal' | 'complete' | 'error';
+    requiredDocuments: Array<{ documentId: string; acceptanceVersion: string }>;
+    acceptedDocumentKeys: string[];
+    error?: string;
+  }>;
+  acceptLegalDocument(
+    document: { documentId: string; acceptanceVersion: string },
+    input?: { userId?: string; flowId?: string; flowVersion?: number },
+  ): Promise<void>;
+};
+
+const memoryAcceptedKeys = new Set<string>();
+const legalAcceptanceListeners = new Set<() => void>();
+let currentLegalAcceptanceUserId: string | undefined;
+
+function legalDocumentKey(document: { documentId: string; acceptanceVersion: string }): string {
+  return `${document.documentId}@${document.acceptanceVersion}`;
+}
+
+export function notifyLegalAcceptanceChanged(): void {
+  for (const listener of legalAcceptanceListeners) {
+    listener();
+  }
+}
+
+export function subscribeToLegalAcceptanceChanges(listener: () => void): () => void {
+  legalAcceptanceListeners.add(listener);
+  return () => {
+    legalAcceptanceListeners.delete(listener);
+  };
+}
+
+export function setLegalAcceptanceUserId(userId?: string | null): void {
+  const nextUserId = userId ?? undefined;
+  if (currentLegalAcceptanceUserId === nextUserId) {
+    return;
+  }
+  currentLegalAcceptanceUserId = nextUserId;
+  notifyLegalAcceptanceChanged();
+}
+
+export function getLegalAcceptanceUserId(): string | undefined {
+  return currentLegalAcceptanceUserId;
+}
+
+export const memoryLegalAcceptanceAdapter: LegalAcceptanceConfigAdapter = {
+  async loadRequiredLegalAcceptances(requiredDocuments) {
+    const missingDocuments = requiredDocuments.filter(
+      (document) => !memoryAcceptedKeys.has(legalDocumentKey(document)),
+    );
+
+    return {
+      status: missingDocuments.length > 0 ? 'needs-legal' : 'complete',
+      requiredDocuments: missingDocuments,
+      acceptedDocumentKeys: [...memoryAcceptedKeys],
+    };
+  },
+
+  async acceptLegalDocument(document) {
+    memoryAcceptedKeys.add(legalDocumentKey(document));
+    notifyLegalAcceptanceChanged();
+  },
+};
+
+let legalAcceptanceAdapter: LegalAcceptanceConfigAdapter = memoryLegalAcceptanceAdapter;
+
+export function configureLegalAcceptanceAdapter(adapter: LegalAcceptanceConfigAdapter): void {
+  legalAcceptanceAdapter = adapter;
+  notifyLegalAcceptanceChanged();
+}
+
+export function getLegalAcceptanceAdapter(): LegalAcceptanceConfigAdapter {
+  return legalAcceptanceAdapter;
+}

package/assets/mds/src/features/legal/legal-agreement-screen.tsx

@@ -1,6 +1,7 @@
 import { useState } from 'react';
 import { Pressable, StyleSheet, Text, View } from 'react-native';
 
+import { getReadableTextColor } from '../../theme/color-utils';
 import { useAppTheme } from '../../theme/provider';
 import { LegalDocumentModal } from './legal-document-modal';
 import { getLegalDocument, type LegalDocumentId } from './legal-documents';
@@ -23,6 +24,8 @@ function AgreementRow({
   const theme = useAppTheme();
   const colors = theme.activeColors;
   const document = getLegalDocument(documentId);
+  const actionColor = accepted ? colors.success : colors.primary;
+  const actionForeground = getReadableTextColor(actionColor, theme.colors.light.text);
 
   return (
     <View
@@ -46,11 +49,13 @@ function AgreementRow({
         style={[
           styles.reviewButton,
           {
-            backgroundColor: accepted ? colors.success : colors.primary,
+            backgroundColor: actionColor,
             borderRadius: Math.max(8, theme.layout.radius - 4),
           },
         ]}>
-        <Text style={styles.reviewButtonText}>{accepted ? 'Accepted' : 'Review'}</Text>
+        <Text style={[styles.reviewButtonText, { color: actionForeground }]}>
+          {accepted ? 'Accepted' : 'Review'}
+        </Text>
       </Pressable>
     </View>
   );
@@ -62,6 +67,7 @@ export function LegalAgreementScreen({
 }: LegalAgreementScreenProps) {
   const theme = useAppTheme();
   const colors = theme.activeColors;
+  const primaryForeground = getReadableTextColor(colors.primary, theme.colors.light.text);
   const [activeDocument, setActiveDocument] = useState<LegalDocumentId | null>(null);
   const {
     acceptedDocuments,
@@ -114,7 +120,7 @@ export function LegalAgreementScreen({
         <Text
           style={[
             styles.continueButtonText,
-            { color: canContinue ? '#ffffff' : colors.text },
+            { color: canContinue ? primaryForeground : colors.text },
           ]}>
           {continueLabel}
         </Text>
@@ -182,7 +188,6 @@ const styles = StyleSheet.create({
     paddingVertical: 10,
   },
   reviewButtonText: {
-    color: '#ffffff',
     fontSize: 13,
     fontWeight: '900',
   },

package/assets/mds/src/features/legal/legal-document-modal.tsx

@@ -1,5 +1,7 @@
-import { Modal, Pressable, SafeAreaView, StyleSheet, Text, View } from 'react-native';
+import { Modal, Pressable, StyleSheet, Text, View } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
 
+import { getReadableTextColor } from '../../theme/color-utils';
 import { useAppTheme } from '../../theme/provider';
 import { LegalDocumentView } from './legal-document-view';
 import { getLegalDocument, type LegalDocumentId } from './legal-documents';
@@ -22,6 +24,7 @@ export function LegalDocumentModal({
   const theme = useAppTheme();
   const colors = theme.activeColors;
   const document = getLegalDocument(documentId);
+  const primaryForeground = getReadableTextColor(colors.primary, theme.colors.light.text);
 
   return (
     <Modal animationType="slide" presentationStyle="pageSheet" visible={visible}>
@@ -59,7 +62,9 @@ export function LegalDocumentModal({
                 borderRadius: theme.layout.radius,
               },
             ]}>
-            <Text style={styles.primaryButtonText}>{primaryActionLabel}</Text>
+            <Text style={[styles.primaryButtonText, { color: primaryForeground }]}>
+              {primaryActionLabel}
+            </Text>
           </Pressable>
         </View>
       </SafeAreaView>
@@ -110,7 +115,6 @@ const styles = StyleSheet.create({
     paddingVertical: 14,
   },
   primaryButtonText: {
-    color: '#ffffff',
     fontSize: 15,
     fontWeight: '900',
   },

package/assets/mds/src/features/legal/legal-document-view.tsx

@@ -116,6 +116,7 @@ export function LegalDocumentView({
             <View style={styles.metaRow}>
               <LegalDocumentMeta label="Effective" value={document.effectiveDate} />
               <LegalDocumentMeta label="Last updated" value={document.lastUpdated} />
+              <LegalDocumentMeta label="Acceptance version" value={document.acceptanceVersion} />
             </View>
           </View>
         ) : null}

package/assets/mds/src/features/legal/legal-documents.ts

@@ -12,6 +12,9 @@ export interface LegalDocument {
   summary: string;
   effectiveDate: string;
   lastUpdated: string;
+  acceptanceVersion: string;
+  requiresReacceptance: boolean;
+  changeSummary: string;
   sections: LegalDocumentSection[];
 }
 
@@ -26,6 +29,10 @@ export const legalDocuments: Record<LegalDocumentId, LegalDocument> = {
       'Starter terms for __MDS_APP_NAME__ with common sections your legal reviewer can replace.',
     effectiveDate: '2026-08-10',
     lastUpdated: '2026-08-10',
+    acceptanceVersion: '2026-08-10',
+    requiresReacceptance: true,
+    changeSummary:
+      'Initial material Terms of Service version that should be accepted before protected app access.',
     sections: [
       {
         id: 'acceptance',
@@ -72,7 +79,8 @@ export const legalDocuments: Record<LegalDocumentId, LegalDocument> = {
         title: 'Changes and Contact',
         body: [
           'These terms may be updated as product functionality, business requirements, or legal obligations change.',
-          'Add your support email, business address, and jurisdiction-specific notice requirements here.',
+          '__MDS_LEGAL_BUSINESS_NAME__ is the business responsible for these terms. Direct legal questions to __MDS_LEGAL_CONTACT_EMAIL__ and replace this line with your reviewed notice workflow.',
+          'Replace this placeholder with your business address, jurisdiction, and local notice requirements: __MDS_LEGAL_ADDRESS_OR_REGION_NOTE__.',
         ],
       },
     ],
@@ -84,6 +92,10 @@ export const legalDocuments: Record<LegalDocumentId, LegalDocument> = {
       'Starter privacy policy for __MDS_APP_NAME__ with common data and rights sections to replace.',
     effectiveDate: '2026-08-10',
     lastUpdated: '2026-08-10',
+    acceptanceVersion: '2026-08-10',
+    requiresReacceptance: true,
+    changeSummary:
+      'Initial material Privacy Policy version that should be accepted before protected app access.',
     sections: [
       {
         id: 'data-processed',
@@ -121,8 +133,10 @@ export const legalDocuments: Record<LegalDocumentId, LegalDocument> = {
         id: 'rights-contact',
         title: 'Your Choices and Contact',
         body: [
-          'Users may have rights to access, correct, delete, export, or object to processing of their data depending on jurisdiction.',
-          'Add the real contact channel and request workflow for privacy questions before production use.',
+          'Users may have rights to access, correct, delete, export, restrict, or object to processing depending on jurisdiction, including GDPR and comparable privacy laws.',
+          'For GDPR-facing flows, document your lawful bases, cross-border transfer process, retention rules, and response timelines for data-subject requests.',
+          'Route privacy requests to __MDS_LEGAL_CONTACT_EMAIL__ on behalf of __MDS_LEGAL_BUSINESS_NAME__, and replace this placeholder workflow before production use.',
+          'Replace this location or jurisdiction note with the reviewed business address, EU representative, or regional contact process that applies: __MDS_LEGAL_ADDRESS_OR_REGION_NOTE__.',
         ],
       },
     ],