tosijs-ui 1.16.39 → 1.16.40

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # Changelog
 
+## 1.16.40
+
+- **An example with no script runs under a strict CSP (#245, #246).** A pure-HTML example still
+  built an `AsyncFunction` from its empty script, and a dialect that runs its own source (`run`)
+  had one built before its `run` was called. Under a Content Security Policy without
+  `'unsafe-eval'` (`script-src 'self'`) the constructor throws, so each such example showed an
+  error and filed a violation report every time it ran. Neither now constructs a function at
+  all, so HTML examples, and `run` dialects that only sanitize and bind markup, work on a
+  CSP-protected host. Script examples still need `'unsafe-eval'`; a CSP-compatible path for
+  them, and an HTML-only example mode, are planned for 1.17.0.
+- **The doc header's search says "Search", and a site can set it.** `searchPlaceholder` in the
+  site config (or `createDocBrowser`) sets the hint in the header's search field, and the
+  trigger's accessible name; the default was "Search documentation" (set
+  `searchPlaceholder: 'Search documentation'` to keep it, and update any test that looks the
+  field up by that name). It is localized through the site's strings, and its placeholder
+  follows the locale the reader picks. `<tosi-palette>` gained a `localizer` property for this: a function its placeholder
+  goes through, such as `localize`. It is a function rather than a `localized` attribute so the
+  palette does not import the localization module, and `<tosi-select>` with it, wherever it is
+  used.
+- **The ⌘K hint in the search field has no outline.** An outline inside the field's own outline
+  read as a second control. The hints inside the open palette keep theirs.
+
 ## 1.16.39
 
 - **The doc-site frame passes WCAG 2.2 AA where an axe scan said it did not (#3520).** An

package/dist/doc-browser.d.ts

@@ -118,6 +118,11 @@ export interface DocBrowserOptions {
      * for a host page that owns that key or embeds more than one browser.
      */
     searchShortcut?: string;
+    /**
+     * The hint in the header's search field (default `'Search'`). Localized through the site's
+     * strings, like every other piece of the doc system's own text.
+     */
+    searchPlaceholder?: string;
     /**
      * Header-bar links. When provided, these replace the legacy `projectLinks` icon
      * set in the header (each renders as an icon if `icon` names a known icon, else

package/dist/doc-browser.js

@@ -115,7 +115,7 @@ import { tosiSidenav, TosiSidenav } from './side-nav.js';
 import { icons } from './icons.js';
 import { tosiPalette } from './palette.js';
 import { buildDocIndex, searchDocs } from './doc-system/doc-search.js';
-import { tosiLocalized } from './localize.js';
+import { tosiLocalized, localize, i18n } from './localize.js';
 import { popMenu } from './menu.js';
 import { codeEditor } from './code-editor.js';
 import { tosiDiff } from './diff.js';
@@ -395,7 +395,7 @@ let docBrowserSeq = 0;
 // Likewise for the nav's aria-controls ids.
 let navIdCounter = 0;
 export function createDocBrowser(options) {
-    const { docs, context = {}, projectName = '', projectLinks = {}, logo, navSize = 200, minSize = 600, routing = 'query', initialRoute, aliases = {}, onRouteChange, searchShortcut = 'mod+k', navbarLinks, contentElement, } = options;
+    const { docs, context = {}, projectName = '', projectLinks = {}, logo, navSize = 200, minSize = 600, routing = 'query', initialRoute, aliases = {}, onRouteChange, searchShortcut = 'mod+k', searchPlaceholder = 'Search', navbarLinks, contentElement, } = options;
     // Memory routing is fully self-contained: it never reads or writes
     // window.history/location, so an embedded or nested browser can't hijack the
     // host page's URL (or recurse into it).
@@ -750,11 +750,14 @@ export function createDocBrowser(options) {
     // In the header bar (see headerContent); the nav no longer holds a search field.
     const searchBox = tosiPalette({
         class: 'doc-search',
-        placeholder: 'Search documentation',
+        placeholder: searchPlaceholder,
+        localizer: localize,
         shortcut: searchShortcut,
         sources: [docSearchSource],
         quickLinks,
     });
+    // The hint follows the reader's language, like the rest of the doc system's own text.
+    i18n.locale.observe(() => searchBox.queueRender());
     // Memory routing is decoupled from the page URL, so it ignores browser
     // back/forward (the host owns history, if any).
     if (!memoryRouting) {

package/dist/doc-system/doc-system-styles.js

@@ -66,7 +66,7 @@ export function docSystemColors(theme = {}) {
         /*
         Readable, not faint (#3520). This was the brand at 40% opacity, which an axe scan measured
         at 1.88:1 on the input (#eda7c5 on #fdfdfd) where AA asks 4.5:1, and it colours the doc
-        header's "Search documentation" trigger, a real label, not just a hint.
+        header's search trigger, a real label, not just a hint.
         */
         _placeholderColor: readableOn(brandColor, Color.fromCss(theme.inputBg ?? '#fdfdfd')),
         /*

package/dist/doc-system/doc-system.js

@@ -608,6 +608,7 @@ export class TosiDocSystem extends withAttributes({
             projectLinks: config.projectLinks,
             logo: config.logo,
             navbarLinks: navbarLinks.length ? navbarLinks : undefined,
+            searchPlaceholder: config.searchPlaceholder,
             contentElement,
         });
         // Add the settings (theme + language) menu — except in a nested demo, where

package/dist/doc-system/site/generate-site.d.ts

@@ -8,6 +8,8 @@ export interface GenerateSiteConfig {
     docs: Doc[];
     /** `SiteConfig.aliases`: { alias path -> slug } (board #3513) */
     aliases?: Record<string, string>;
+    /** `SiteConfig.searchPlaceholder` */
+    searchPlaceholder?: string;
     /**
      * Mirrors `SiteConfig.liveExamples`. The static highlighter needs it so it skips the
      * fences that will become live examples — a highlighted block hands the example markup

package/dist/doc-system/site/generate-site.js

@@ -368,6 +368,7 @@ export async function generateSite(config) {
         logo: config.logo,
         bookVolumes: config.bookVolumes,
         ebooks: config.ebooks,
+        searchPlaceholder: config.searchPlaceholder,
     }));
     // The theme stylesheet (config.stylesUrl) is written separately by
     // ./generate-css.ts; pages here just <link> to it.

package/dist/doc-system/site/orchestrator.js

@@ -1497,6 +1497,7 @@ export async function buildSite(config, opts = {}) {
                 liveExamples: config.liveExamples,
                 docs,
                 aliases: config.aliases,
+                searchPlaceholder: config.searchPlaceholder,
                 outputDir: PUBLIC,
                 projectName: config.name,
                 bookVolumes: printCoverManifestUrl(config),

package/dist/doc-system/site/site-config.d.ts

@@ -71,6 +71,11 @@ export interface SiteConfig {
      * on one that is not, that takes a page's own path or a static folder's, or that names no page.
      */
     aliases?: Record<string, string>;
+    /**
+     * The hint in the header's search field. Default `'Search'`. It is localized like the rest
+     * of the doc system's own text, so a site with translations can translate it.
+     */
+    searchPlaceholder?: string;
     /**
      * Directories to skip while scanning `docPaths` — by basename (skipped wherever it
      * appears) or by path (skipped only at that location). Added to the built-in