@edrlab/thorium-web 1.4.0 → 1.5.0

package/dist/{chunk-XRFLDNAY.mjs → chunk-PRQBFBJ7.mjs}

@@ -3,12 +3,13 @@ import { useBreakpoints, useForcedColors, useMonochrome, useReducedMotion, useRe
 import { ThGlobalPreferencesContext } from './chunk-AE6P4KJB.mjs';
 import { useAppSelector } from './chunk-A575ZW4A.mjs';
 import { useColorScheme, useContrast } from './chunk-NQ2ZSGCX.mjs';
-import { isSupportedLocale, supportedLocales } from './chunk-B3WDMWCT.mjs';
+import { isSupportedLocale, supportedLocales } from './chunk-GNROODJB.mjs';
 import { createContext, useMemo, useState, useCallback, useEffect, useContext, useRef } from 'react';
 import { I18nProvider, useLocale } from 'react-aria';
 import { jsx } from 'react/jsx-runtime';
 import fontStacks from '@readium/css/css/vars/fontStacks.json';
 import ReadiumCSSColors from '@readium/css/css/vars/colors.json';
+import ReadiumCSSSettings from '@readium/css/css/vars/settings.json';
 
 // src/preferences/globalPreferences.ts
 var createGlobalPreferences = (params) => {
@@ -79,6 +80,11 @@ function ThGlobalPreferencesProvider({ adapter, initialPreferences, children })
 }
 
 // src/preferences/models/actions.ts
+var TEXT_INPUT_SELECTORS = [
+  "input:not([type='button']):not([type='submit']):not([type='reset']):not([type='file']):not([type='checkbox']):not([type='radio'])",
+  "textarea",
+  "[contenteditable]"
+];
 var ThActionsKeys = /* @__PURE__ */ ((ThActionsKeys3) => {
   ThActionsKeys3["fullscreen"] = "fullscreen";
   ThActionsKeys3["jumpToPosition"] = "jumpToPosition";
@@ -120,8 +126,10 @@ var defaultActionKeysObject = {
 };
 var defaultSettingsAction = {
   visibility: "partially" /* partially */,
-  shortcut: null,
-  // `${ UnstableShortcutMetaKeywords.shift }+${ ShortcutMetaKeywords.alt }+P`,
+  shortcut: {
+    label: "P",
+    keyCombos: [{ keyCode: 80, shift: true, alt: true, suppressOnInteractiveElement: TEXT_INPUT_SELECTORS }]
+  },
   sheet: {
     defaultSheet: "popover" /* popover */,
     breakpoints: {
@@ -145,8 +153,10 @@ var defaultFullscreenAction = {
 };
 var defaultTocAction = {
   visibility: "partially" /* partially */,
-  shortcut: null,
-  // `${ UnstableShortcutMetaKeywords.shift }+${ ShortcutMetaKeywords.alt }+T`,
+  shortcut: {
+    label: "T",
+    keyCombos: [{ keyCode: 84, shift: true, alt: true, suppressOnInteractiveElement: TEXT_INPUT_SELECTORS }]
+  },
   sheet: {
     defaultSheet: "popover" /* popover */,
     breakpoints: {
@@ -164,8 +174,10 @@ var defaultTocAction = {
 };
 var defaultJumpToPositionAction = {
   visibility: "overflow" /* overflow */,
-  shortcut: null,
-  // `${ UnstableShortcutMetaKeywords.shift }+${ ShortcutMetaKeywords.alt }+J`,
+  shortcut: {
+    label: "J",
+    keyCombos: [{ keyCode: 74, shift: true, alt: true, suppressOnInteractiveElement: TEXT_INPUT_SELECTORS }]
+  },
   sheet: {
     defaultSheet: "popover" /* popover */,
     breakpoints: {
@@ -438,7 +450,10 @@ var defaultAudioVolumeAction = {
 };
 var defaultAudioPlaybackRateAction = {
   visibility: "always" /* always */,
-  shortcut: null,
+  shortcut: {
+    label: "R",
+    keyCombos: [{ keyCode: 82, shift: true, alt: true, suppressOnInteractiveElement: TEXT_INPUT_SELECTORS }]
+  },
   sheet: {
     defaultSheet: "compactPopover" /* compactPopover */,
     breakpoints: { ["compact" /* compact */]: "bottomSheet" /* bottomSheet */ }
@@ -450,7 +465,10 @@ var defaultAudioPlaybackRateAction = {
 };
 var defaultAudioSleepTimerAction = {
   visibility: "partially" /* partially */,
-  shortcut: null,
+  shortcut: {
+    label: "S",
+    keyCombos: [{ keyCode: 83, shift: true, alt: true, suppressOnInteractiveElement: TEXT_INPUT_SELECTORS }]
+  },
   sheet: {
     defaultSheet: "modal" /* modal */,
     breakpoints: {
@@ -469,7 +487,10 @@ var defaultAudioRemotePlaybackAction = {
 };
 var defaultAudioTocAction = {
   visibility: "partially" /* partially */,
-  shortcut: null,
+  shortcut: {
+    label: "T",
+    keyCombos: [{ keyCode: 84, shift: true, alt: true, suppressOnInteractiveElement: TEXT_INPUT_SELECTORS }]
+  },
   sheet: {
     defaultSheet: "modal" /* modal */,
     breakpoints: {
@@ -796,7 +817,7 @@ var readiumCSSFontCollection = {
     label: "reader.preferences.fontFamily.oldStyle.descriptive",
     source: { type: "system" },
     spec: {
-      family: fontStacks.RS__oldStyleTf,
+      family: fontStacks.oldStyleTf,
       weights: { type: "static", values: [400, 700] },
       fallbacks: []
     }
@@ -807,7 +828,7 @@ var readiumCSSFontCollection = {
     label: "reader.preferences.fontFamily.modern.descriptive",
     source: { type: "system" },
     spec: {
-      family: fontStacks.RS__modernTf,
+      family: fontStacks.modernTf,
       weights: { type: "static", values: [400, 700] },
       fallbacks: []
     }
@@ -818,7 +839,7 @@ var readiumCSSFontCollection = {
     label: "reader.preferences.fontFamily.sans",
     source: { type: "system" },
     spec: {
-      family: fontStacks.RS__sansTf,
+      family: fontStacks.sansTf,
       weights: { type: "static", values: [400, 700] },
       fallbacks: []
     }
@@ -829,7 +850,7 @@ var readiumCSSFontCollection = {
     label: "reader.preferences.fontFamily.humanist.descriptive",
     source: { type: "system" },
     spec: {
-      family: fontStacks.RS__humanistTf,
+      family: fontStacks.humanistTf,
       weights: { type: "static", values: [400, 700] },
       fallbacks: []
     }
@@ -840,7 +861,7 @@ var readiumCSSFontCollection = {
     label: "reader.preferences.fontFamily.monospace",
     source: { type: "system" },
     spec: {
-      family: fontStacks.RS__monospaceTf,
+      family: fontStacks.monospaceTf,
       weights: { type: "static", values: [400, 700] },
       fallbacks: []
     }
@@ -987,8 +1008,8 @@ var chineseTraditionalCollection = {
   })
 };
 var japaneseCollection = {
-  "japanese-sans": sysFontDef("japanese-sans", "Sans-Serif", '"Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif'),
-  "japanese-serif": sysFontDef("japanese-serif", "Serif", '"Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif'),
+  "japanese-sans": sysFontDef("japanese-sans", "Sans-Serif", fontStacks["sans-serif-ja"]),
+  "japanese-serif": sysFontDef("japanese-serif", "Serif", fontStacks["serif-ja"]),
   ...createDefinitionsFromGoogleFonts({
     cssUrl: "https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900",
     options: {
@@ -1003,8 +1024,8 @@ var japaneseCollection = {
   })
 };
 var japaneseVerticalCollection = {
-  "japanese-v-serif": sysFontDef("japanese-v-serif", "Serif", '"Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif'),
-  "japanese-v-sans": sysFontDef("japanese-v-sans", "Sans-Serif", '"Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif'),
+  "japanese-v-sans": sysFontDef("japanese-v-sans", "Sans-Serif", fontStacks["sans-serif-ja-v"]),
+  "japanese-v-serif": sysFontDef("japanese-v-serif", "Serif", fontStacks["serif-ja-v"]),
   ...createDefinitionsFromGoogleFonts({
     cssUrl: "https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&family=Shippori+Mincho:wght@400..800&family=Noto+Sans+JP:wght@100..900",
     options: {
@@ -1142,9 +1163,9 @@ var ThThemeKeys = /* @__PURE__ */ ((ThThemeKeys3) => {
   return ThThemeKeys3;
 })(ThThemeKeys || {});
 var lightTheme = {
-  background: ReadiumCSSColors.RS__backgroundColor,
+  background: ReadiumCSSColors.backgroundColor,
   // Color of background
-  text: ReadiumCSSColors.RS__textColor,
+  text: ReadiumCSSColors.textColor,
   // Color of text
   link: "#0000ee",
   // Color of links
@@ -1156,7 +1177,7 @@ var lightTheme = {
   // color for :disabled
   hover: "#d9d9d9",
   // color of background for :hover
-  onHover: ReadiumCSSColors.RS__textColor,
+  onHover: ReadiumCSSColors.textColor,
   // color of text for :hover
   select: "#b4d8fe",
   // color of selected background
@@ -1467,7 +1488,8 @@ var defaultAudioPreferences = createAudioPreferences({
   },
   shortcuts: {
     representation: "symbol" /* symbol */,
-    joiner: "+"
+    joiner: "+",
+    displayIn: ["tooltip", "menuItem"]
   },
   docking: {
     displayOrder: [
@@ -1954,7 +1976,8 @@ var defaultPreferences = createPreferences({
   },
   shortcuts: {
     representation: "symbol" /* symbol */,
-    joiner: "+"
+    joiner: "+",
+    displayIn: ["tooltip", "menuItem"]
   },
   actions: {
     reflowOrder: [
@@ -1974,13 +1997,7 @@ var defaultPreferences = createPreferences({
       "toc" /* toc */,
       "fullscreen" /* fullscreen */
     ],
-    collapse: {
-      // Number of partially icons to display
-      // value "all" a keyword for the length of displayOrder above
-      // Icons with visibility always are excluded from collapsing
-      ["compact" /* compact */]: 2,
-      ["medium" /* medium */]: 3
-    },
+    collapse: true,
     keys: {
       ["settings" /* settings */]: defaultSettingsAction,
       ["fullscreen" /* fullscreen */]: defaultFullscreenAction,
@@ -2633,27 +2650,31 @@ var usePreferenceKeys = () => {
     webPubSpacingPresetKeys
   };
 };
-var EXCLUDED_CJK = [
-  "textAlign" /* textAlign */,
-  "hyphens" /* hyphens */,
-  "ligatures" /* ligatures */,
-  "paragraphIndent" /* paragraphIndent */,
-  "wordSpacing" /* wordSpacing */,
-  "textNormalize" /* textNormalize */
-];
+var READIUM_CSS_TO_SETTINGS_KEY = {
+  bodyHyphens: "hyphens" /* hyphens */,
+  a11yNormalize: "textNormalize" /* textNormalize */,
+  letterSpacing: "letterSpacing" /* letterSpacing */,
+  textAlign: "textAlign" /* textAlign */,
+  paraIndent: "paragraphIndent" /* paragraphIndent */,
+  wordSpacing: "wordSpacing" /* wordSpacing */,
+  ligatures: "ligatures" /* ligatures */,
+  noRuby: "noRuby" /* noRuby */
+};
+var globallyAdded = new Set(
+  Object.values(ReadiumCSSSettings).flatMap((entry) => entry.added)
+);
+var deriveExcluded = (entry) => {
+  const fromDisabled = entry.disabled.map((k) => READIUM_CSS_TO_SETTINGS_KEY[k]).filter((k) => k !== void 0);
+  const fromAddedInversion = [...globallyAdded].filter((k) => !entry.added.includes(k)).map((k) => READIUM_CSS_TO_SETTINGS_KEY[k]).filter((k) => k !== void 0);
+  return [...fromDisabled, ...fromAddedInversion];
+};
+var CJK_VERTICAL_EXCLUDED = [...deriveExcluded(ReadiumCSSSettings["cjk-vertical"]), "layout" /* layout */];
 var EXCLUDED_BY_SCRIPT_MODE = {
-  "ltr": [
-    "noRuby" /* noRuby */
-  ],
-  "rtl": [
-    "hyphens" /* hyphens */,
-    "letterSpacing" /* letterSpacing */,
-    "textNormalize" /* textNormalize */,
-    "noRuby" /* noRuby */
-  ],
-  "cjk-horizontal": EXCLUDED_CJK,
-  "cjk-vertical": [...EXCLUDED_CJK, "layout" /* layout */],
-  "mongolian-vertical": [...EXCLUDED_CJK, "layout" /* layout */]
+  "ltr": deriveExcluded(ReadiumCSSSettings["default"]),
+  "rtl": deriveExcluded(ReadiumCSSSettings["rtl"]),
+  "cjk-horizontal": deriveExcluded(ReadiumCSSSettings["cjk-horizontal"]),
+  "cjk-vertical": CJK_VERTICAL_EXCLUDED,
+  "mongolian-vertical": CJK_VERTICAL_EXCLUDED
 };
 var useFilteredPreferenceKeys = () => {
   const keys = usePreferenceKeys();
@@ -3759,6 +3780,49 @@ var proxyUrl = (url) => {
   }
   return url;
 };
+var initRanges = (prefs) => {
+  const ranges = {};
+  let prev = null;
+  Object.entries(prefs).forEach(([key, value]) => {
+    if (value && !isNaN(value)) {
+      const max = value;
+      const min = prev ? prev + 1 : null;
+      ranges[key] = { min, max };
+      prev = value;
+    } else if (!value && key === "xLarge" /* xLarge */ && prev) {
+      ranges[key] = { min: prev + 1, max: null };
+    }
+  });
+  return ranges;
+};
+var resolveBreakpoint = (width, ranges) => {
+  for (const [key, range] of Object.entries(ranges)) {
+    const { min, max } = range;
+    if (min !== null && width < min) continue;
+    if (max !== null && width > max) continue;
+    return key;
+  }
+  return null;
+};
+var useContainerBreakpoints = (map, onChange) => {
+  const [containerEl, setContainerEl] = useState(null);
+  useEffect(() => {
+    if (!containerEl) return;
+    const ranges = initRanges(map);
+    const observer = new ResizeObserver((entries) => {
+      const entry = entries[0];
+      if (!entry) return;
+      const width = entry.contentRect.width;
+      const breakpoint = resolveBreakpoint(width, ranges);
+      onChange?.(breakpoint);
+    });
+    observer.observe(containerEl);
+    return () => observer.disconnect();
+  }, [containerEl, map, onChange]);
+  return useCallback((el) => {
+    setContainerEl(el);
+  }, []);
+};
 
 // src/preferences/hooks/useTheming.ts
 var useTheming = ({
@@ -3776,11 +3840,13 @@ var useTheming = ({
   onMonochromeChange,
   onReducedMotionChange,
   onReducedTransparencyChange,
-  onCoverThemeGenerated
+  onCoverThemeGenerated,
+  onContainerBreakpointChange
 }) => {
   const [coverThemeTokens, setCoverThemeTokens] = useState(null);
   const [coverThemeFailed, setCoverThemeFailed] = useState(false);
   const breakpoints = useBreakpoints(breakpointsMap, onBreakpointChange);
+  const setContainerRef = useContainerBreakpoints(breakpointsMap, onContainerBreakpointChange);
   const colorScheme = useColorScheme(onColorSchemeChange);
   const colorSchemeRef = useRef(colorScheme);
   const contrast = useContrast(onContrastChange);
@@ -3878,7 +3944,8 @@ var useTheming = ({
     reducedMotion,
     reducedTransparency,
     coverThemeTokens,
-    themeResolved
+    themeResolved,
+    setContainerRef
   };
 };
 var useSharedPreferences = () => {
@@ -3908,6 +3975,6 @@ var useSharedPreferences = () => {
   };
 };
 
-export { ThActionsKeys, ThAudioActionKeys, ThAudioAffordance, ThAudioKeys, ThAudioMemoryPreferencesAdapter, ThAudioPreferencesContext, ThAudioPreferencesProvider, ThDockingKeys, ThDockingTypes, ThGlobalMemoryPreferencesAdapter, ThGlobalPreferencesProvider, ThLayoutOptions, ThLineHeightOptions, ThMemoryPreferencesAdapter, ThPreferencesContext, ThPreferencesProvider, ThSettingsContainerKeys, ThSettingsKeys, ThSettingsRangePlaceholder, ThSettingsRangeVariant, ThSettingsTimerVariant, ThSheetHeaderVariant, ThSheetTypes, ThSpacingPresetKeys, ThSpacingSettingsKeys, ThTextAlignOptions, ThTextSettingsKeys, ThThemeKeys, arabicFarsiCollection, buildThemeObject, chineseSimplifiedCollection, chineseTraditionalCollection, contrast1Theme, contrast2Theme, contrast3Theme, createAudioPreferences, createDefinitionFromStaticFonts, createDefinitionsFromBunnyFonts, createDefinitionsFromGoogleFonts, createGlobalPreferences, createPreferences, darkTheme, defaultActionKeysObject, defaultAudioContentProtectionConfig, defaultAudioPlaybackRate, defaultAudioPlaybackRateAction, defaultAudioPreferences, defaultAudioPreferencesContextValue, defaultAudioRemotePlaybackAction, defaultAudioSkipBackwardInterval, defaultAudioSkipForwardInterval, defaultAudioSkipInterval, defaultAudioSleepTimer, defaultAudioSleepTimerAction, defaultAudioSleepTimerPresetList, defaultAudioTocAction, defaultAudioVolume, defaultAudioVolumeAction, defaultContentProtectionConfig, defaultFontCollection, defaultFullscreenAction, defaultJumpToPositionAction, defaultLetterSpacing, defaultLineHeights, defaultParagraphIndent, defaultParagraphSpacing, defaultPreferences, defaultPreferencesContextValue, defaultSettingsAction, defaultSpacingPresets, defaultSpacingPresetsOrder, defaultSpacingSettingsMain, defaultSpacingSettingsSubpanel, defaultTextSettingsMain, defaultTextSettingsSubpanel, defaultTocAction, defaultWordSpacing, defaultZoom, devContentProtectionConfig, hebrewCollection, japaneseCollection, japaneseVerticalCollection, koreanCollection, lightTheme, paperTheme, prefixString, proxyUrl, readiumCSSFontCollection, resolveAudioContentProtectionConfig, resolveContentProtectionConfig, sepiaTheme, tamilCollection, useActionsPreferences, useAudioActionsPreferences, useAudioPreferences, useFilteredPreferenceKeys, usePreferenceKeys, usePreferences, useSharedPreferences, useTheming, validateObjectKeys };
-//# sourceMappingURL=chunk-XRFLDNAY.mjs.map
-//# sourceMappingURL=chunk-XRFLDNAY.mjs.map
+export { TEXT_INPUT_SELECTORS, ThActionsKeys, ThAudioActionKeys, ThAudioAffordance, ThAudioKeys, ThAudioMemoryPreferencesAdapter, ThAudioPreferencesContext, ThAudioPreferencesProvider, ThDockingKeys, ThDockingTypes, ThGlobalMemoryPreferencesAdapter, ThGlobalPreferencesProvider, ThLayoutOptions, ThLineHeightOptions, ThMemoryPreferencesAdapter, ThPreferencesContext, ThPreferencesProvider, ThSettingsContainerKeys, ThSettingsKeys, ThSettingsRangePlaceholder, ThSettingsRangeVariant, ThSettingsTimerVariant, ThSheetHeaderVariant, ThSheetTypes, ThSpacingPresetKeys, ThSpacingSettingsKeys, ThTextAlignOptions, ThTextSettingsKeys, ThThemeKeys, arabicFarsiCollection, buildThemeObject, chineseSimplifiedCollection, chineseTraditionalCollection, contrast1Theme, contrast2Theme, contrast3Theme, createAudioPreferences, createDefinitionFromStaticFonts, createDefinitionsFromBunnyFonts, createDefinitionsFromGoogleFonts, createGlobalPreferences, createPreferences, darkTheme, defaultActionKeysObject, defaultAudioContentProtectionConfig, defaultAudioPlaybackRate, defaultAudioPlaybackRateAction, defaultAudioPreferences, defaultAudioPreferencesContextValue, defaultAudioRemotePlaybackAction, defaultAudioSkipBackwardInterval, defaultAudioSkipForwardInterval, defaultAudioSkipInterval, defaultAudioSleepTimer, defaultAudioSleepTimerAction, defaultAudioSleepTimerPresetList, defaultAudioTocAction, defaultAudioVolume, defaultAudioVolumeAction, defaultContentProtectionConfig, defaultFontCollection, defaultFullscreenAction, defaultJumpToPositionAction, defaultLetterSpacing, defaultLineHeights, defaultParagraphIndent, defaultParagraphSpacing, defaultPreferences, defaultPreferencesContextValue, defaultSettingsAction, defaultSpacingPresets, defaultSpacingPresetsOrder, defaultSpacingSettingsMain, defaultSpacingSettingsSubpanel, defaultTextSettingsMain, defaultTextSettingsSubpanel, defaultTocAction, defaultWordSpacing, defaultZoom, devContentProtectionConfig, hebrewCollection, japaneseCollection, japaneseVerticalCollection, koreanCollection, lightTheme, paperTheme, prefixString, proxyUrl, readiumCSSFontCollection, resolveAudioContentProtectionConfig, resolveContentProtectionConfig, sepiaTheme, tamilCollection, useActionsPreferences, useAudioActionsPreferences, useAudioPreferences, useFilteredPreferenceKeys, usePreferenceKeys, usePreferences, useSharedPreferences, useTheming, validateObjectKeys };
+//# sourceMappingURL=chunk-PRQBFBJ7.mjs.map
+//# sourceMappingURL=chunk-PRQBFBJ7.mjs.map