sdocs-dev 1.3.0 → 1.3.1

package/public/sdocs-state.js

@@ -1,73 +0,0 @@
-// sdocs-state.js — Shared mutable state namespace
-// All modules read/write through window.SDocs
-(function () {
-'use strict';
-
-window.SDocs = {
-  // Document state
-  currentBody: '',
-  currentMeta: {},
-
-  // Runtime-only metadata (path, fullPath) passed via &local= URL param.
-  // Stripped from the URL on load so it isn't in anything the user copies/shares.
-  localMeta: {},
-
-  // Per-doc overrides for the file-info card. Set from `styles.fileinfo` in
-  // YAML front matter; emitted back via collectStyles so they round-trip.
-  fileinfoStyles: {},
-
-  // Per-theme color state
-  activeTheme: 'light',
-  themeColors: { light: {}, dark: {} },
-  themeOverridden: { light: new Set(), dark: new Set() },
-
-  // DOM references
-  renderedEl: document.getElementById('rendered'),
-  rawEl: document.getElementById('raw'),
-  writeEl: null,
-
-  // Mode tracking
-  currentMode: 'read',
-
-  // Sync flags
-  _syncing: false,
-  _isDefaultState: true,
-  _hashTimer: null,
-  _rawSyncTimer: null,
-  _writeSyncTimer: null,
-
-  // Cross-module functions (registered by defining module)
-  // Theme: toggleTheme, getThemeDefaults, getColorDefault, getStandaloneDefault,
-  //         loadGoogleFont, updateDefaultColors, GOOGLE_FONTS,
-  //         switchThemeAndUpdate, saveCurrentThemeColors, loadThemeColors
-  // Controls: setColorValue, readAllControlValues, collectStyles,
-  //           applyStylesFromMeta, resetAllStyles, STANDALONE_COLOR_IDS
-  // App: syncAll, setStatus, setMode, render, loadText
-  // Write: enterWriteMode, exitWriteMode
-};
-
-// Backwards compat: S.overriddenColors delegates to active theme's set
-Object.defineProperty(SDocs, 'overriddenColors', {
-  get: function() { return SDocs.themeOverridden[SDocs.activeTheme]; },
-  set: function(v) { SDocs.themeOverridden[SDocs.activeTheme] = v; },
-  enumerable: true,
-  configurable: true,
-});
-
-SDocs.contentAreaEl = document.getElementById('content-area');
-
-SDocs.setStyleVar = function(cssVar, value) {
-  SDocs.renderedEl.style.setProperty(cssVar, value);
-  if (SDocs.writeEl) SDocs.writeEl.style.setProperty(cssVar, value);
-  // File-info card is a sibling of #rendered, so it doesn't inherit vars set
-  // on #rendered. Mirror the relevant block-cascade vars to it directly.
-  var ficEl = document.getElementById('file-info-card');
-  if (ficEl && /^--md-(fic-|block-)/.test(cssVar)) {
-    ficEl.style.setProperty(cssVar, value);
-  }
-  if (cssVar === '--md-bg') {
-    SDocs.contentAreaEl.style.setProperty('background-color', value);
-  }
-};
-
-})();

package/public/sdocs-theme.js

@@ -1,262 +0,0 @@
-// sdocs-theme.js — Theme, fonts, and dark mode
-(function () {
-'use strict';
-
-var S = SDocs;
-
-// ── Google Fonts ──────────────────────────────────
-
-const GOOGLE_FONTS = [
-  'Inter', 'Roboto', 'Open Sans', 'Lato', 'Montserrat', 'Source Sans 3',
-  'Oswald', 'Raleway', 'Poppins', 'Merriweather', 'Ubuntu',
-  'Nunito', 'Playfair Display', 'Roboto Slab', 'PT Sans', 'Lora',
-  'Mulish', 'Noto Sans', 'Rubik', 'Dosis',
-  'Josefin Sans', 'PT Serif', 'Libre Franklin', 'Crimson Text'
-];
-
-const loadedFonts = new Set(['Inter']);
-
-function loadGoogleFont(family) {
-  if (loadedFonts.has(family)) return;
-  loadedFonts.add(family);
-  const link = document.createElement('link');
-  link.rel = 'stylesheet';
-  link.href = `https://fonts.googleapis.com/css2?family=${encodeURIComponent(family)}:wght@400;600;700&display=swap`;
-  document.head.appendChild(link);
-}
-
-function populateFontSelect(sel, includeInherit) {
-  if (includeInherit) {
-    const opt = document.createElement('option');
-    opt.value = 'inherit';
-    opt.textContent = '— Same as body —';
-    sel.appendChild(opt);
-  }
-  GOOGLE_FONTS.forEach(f => {
-    const opt = document.createElement('option');
-    opt.value = `'${f}', sans-serif`;
-    opt.textContent = f;
-    sel.appendChild(opt);
-  });
-  [['Georgia, serif','Georgia'],['Times New Roman, serif','Times New Roman'],
-   ['system-ui, sans-serif','System UI']].forEach(([v,l]) => {
-    const opt = document.createElement('option');
-    opt.value = v; opt.textContent = l;
-    sel.appendChild(opt);
-  });
-}
-
-// ── Dark mode ──────────────────────────────────
-
-const LIGHT_DEFAULTS = {
-  bgColor:       '#ffffff',
-  colorDefault:  '#1c1917',
-  codeBg:        '#f4f1ed',
-  codeColor:     '#6b21a8',
-  linkColor:     '#2563eb',
-  bqBorderColor: '#2563eb',
-  bqBg:          '#f7f5f2',
-  bqColor:       '#6b6560',
-};
-
-const DARK_DEFAULTS = {
-  bgColor:       '#2c2a26',
-  colorDefault:  '#e7e5e2',
-  codeBg:        '#1a1816',
-  codeColor:     '#b8a99a',
-  linkColor:     '#60a5fa',
-  bqBorderColor: '#60a5fa',
-  bqBg:          '#252320',
-  bqColor:       '#a8a29e',
-};
-
-function getThemeDefaults() {
-  return document.documentElement.dataset.theme === 'dark' ? DARK_DEFAULTS : LIGHT_DEFAULTS;
-}
-
-function getThemeDefaultsFor(theme) {
-  return theme === 'dark' ? DARK_DEFAULTS : LIGHT_DEFAULTS;
-}
-
-function getColorDefault() {
-  return getThemeDefaults().colorDefault;
-}
-
-function getPreferredTheme() {
-  const stored = localStorage.getItem('sdocs-theme');
-  if (stored === 'dark' || stored === 'light') return stored;
-  return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
-}
-
-const SUN_ICON = '<circle cx="12" cy="12" r="5"/><line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/><line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/>';
-const MOON_ICON = '<path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z" stroke-width="1.5"/>';
-
-function updateThemeIcon(theme) {
-  const icon = document.getElementById('icon-theme');
-  if (icon) icon.innerHTML = theme === 'dark' ? SUN_ICON : MOON_ICON;
-}
-
-function applyTheme(theme) {
-  document.documentElement.dataset.theme = theme;
-  S.activeTheme = theme;
-  localStorage.setItem('sdocs-theme', theme);
-  updateThemeIcon(theme);
-}
-
-// ── Per-theme color save/load ──────────────────────
-
-function saveCurrentThemeColors() {
-  var theme = S.activeTheme;
-  var colors = S.themeColors[theme];
-  // Save all 13 color control values
-  SDocStyles.ALL_COLOR_IDS.forEach(function(ctrlId) {
-    var el = document.getElementById(ctrlId);
-    if (el) colors[ctrlId] = el.value;
-  });
-}
-
-function loadThemeColors(theme) {
-  var colors = S.themeColors[theme];
-  var overridden = S.themeOverridden[theme];
-  var defaults = getThemeDefaultsFor(theme);
-
-  // Cascade roots: text color and block bg/text
-  var cascadeRoots = [
-    ['ctrl-color', defaults.colorDefault],
-    ['ctrl-block-bg', defaults.codeBg],
-    ['ctrl-block-text', defaults.bqColor],
-  ];
-  cascadeRoots.forEach(function(pair) {
-    var id = pair[0], def = pair[1];
-    if (overridden.has(id)) {
-      S.setColorValue(id, colors[id], true);
-    } else {
-      S.setColorValue(id, def, false);
-    }
-  });
-
-  // Then cascade children that are overridden (overrides the parent cascade)
-  var cascadeIds = Object.keys(SDocStyles.COLOR_VAR_MAP);
-  cascadeIds.forEach(function(ctrlId) {
-    if (ctrlId === 'ctrl-color' || ctrlId === 'ctrl-block-bg' || ctrlId === 'ctrl-block-text') return;
-    if (overridden.has(ctrlId)) {
-      S.setColorValue(ctrlId, colors[ctrlId], true);
-    }
-  });
-
-  // Standalone colors (not in cascade)
-  var standaloneMap = {
-    'ctrl-bg-color':        defaults.bgColor,
-    'ctrl-link-color':      defaults.linkColor,
-    'ctrl-bq-border-color': defaults.bqBorderColor,
-  };
-  for (var ctrlId in standaloneMap) {
-    var el = document.getElementById(ctrlId);
-    if (!el) continue;
-    if (overridden.has(ctrlId)) {
-      el.value = colors[ctrlId];
-    } else {
-      el.value = standaloneMap[ctrlId];
-    }
-    var allVals = S.readAllControlValues();
-    SDocStyles.controlToCssVars(ctrlId, el.value, allVals)
-      .forEach(function(a) { S.setStyleVar(a.cssVar, a.value); });
-  }
-}
-
-function updateThemeTabs(theme) {
-  var lightTab = document.getElementById('theme-tab-light');
-  var darkTab = document.getElementById('theme-tab-dark');
-  if (lightTab) lightTab.classList.toggle('active', theme === 'light');
-  if (darkTab) darkTab.classList.toggle('active', theme === 'dark');
-}
-
-function switchThemeAndUpdate(theme) {
-  if (theme === S.activeTheme) return;
-  saveCurrentThemeColors();
-  applyTheme(theme);
-  loadThemeColors(theme);
-  updateThemeTabs(theme);
-  S.syncAll('controls');
-}
-
-function toggleTheme() {
-  var current = S.activeTheme;
-  switchThemeAndUpdate(current === 'dark' ? 'light' : 'dark');
-}
-
-function updateDefaultColors() {
-  const defaults = getThemeDefaults();
-  if (!S.overriddenColors) return;
-  if (!S.overriddenColors.has('ctrl-color')) {
-    S.setColorValue('ctrl-color', defaults.colorDefault, false);
-  }
-  // Update standalone color defaults for reset buttons
-  const standaloneMap = {
-    'ctrl-bg-color':        defaults.bgColor,
-    'ctrl-link-color':      defaults.linkColor,
-    'ctrl-code-bg':         defaults.codeBg,
-    'ctrl-code-color':      defaults.codeColor,
-    'ctrl-bq-border-color': defaults.bqBorderColor,
-    'ctrl-bq-bg':           defaults.bqBg,
-    'ctrl-bq-color':        defaults.bqColor,
-  };
-  for (const [ctrlId, val] of Object.entries(standaloneMap)) {
-    if (!S.overriddenColors.has(ctrlId)) {
-      const el = document.getElementById(ctrlId);
-      if (el) {
-        el.value = val;
-        const allVals = S.readAllControlValues();
-        SDocStyles.controlToCssVars(ctrlId, val, allVals)
-          .forEach(a => S.setStyleVar(a.cssVar, a.value));
-      }
-    }
-  }
-  S.syncAll('controls');
-}
-
-function getStandaloneDefault(ctrlId) {
-  const d = getThemeDefaults();
-  const map = {
-    'ctrl-bg-color':        d.bgColor,
-    'ctrl-link-color':      d.linkColor,
-    'ctrl-bq-border-color': d.bqBorderColor,
-    'ctrl-block-bg':        d.codeBg,
-    'ctrl-block-text':      d.bqColor,
-    'ctrl-chart-accent':    '#3b82f6',
-  };
-  return map[ctrlId];
-}
-
-// ── Init at load time ──────────────────────────────────
-
-var initTheme = getPreferredTheme();
-applyTheme(initTheme);
-
-window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', e => {
-  if (!localStorage.getItem('sdocs-theme')) {
-    switchThemeAndUpdate(e.matches ? 'dark' : 'light');
-  }
-});
-
-populateFontSelect(document.getElementById('ctrl-font-family'), false);
-document.getElementById('ctrl-font-family').value = "'Inter', sans-serif";
-populateFontSelect(document.getElementById('ctrl-h-font-family'), true);
-
-// ── Register on SDocs for cross-module access ──────────
-
-S.GOOGLE_FONTS = GOOGLE_FONTS;
-S.loadGoogleFont = loadGoogleFont;
-S.getThemeDefaults = getThemeDefaults;
-S.getThemeDefaultsFor = getThemeDefaultsFor;
-S.getColorDefault = getColorDefault;
-S.getStandaloneDefault = getStandaloneDefault;
-S.updateDefaultColors = updateDefaultColors;
-S.toggleTheme = toggleTheme;
-S.switchThemeAndUpdate = switchThemeAndUpdate;
-S.getPreferredTheme = getPreferredTheme;
-S.saveCurrentThemeColors = saveCurrentThemeColors;
-S.loadThemeColors = loadThemeColors;
-S.updateThemeTabs = updateThemeTabs;
-
-})();