@enigmax/primitives 0.19.0 → 0.19.1

package/dist/{chunk-AU3H5WIY.js → chunk-T4F3BWR5.js}

@@ -100,7 +100,7 @@ function flagAttributes(code, options = {}) {
     "data-enigma-flag": "",
     "data-flag-code": view.code,
     "data-flag-shape": view.shape,
-    ...label ? {} : { "aria-hidden": "true" }
+    ...label ? { title: label } : { "aria-hidden": "true" }
   };
 }
 

package/dist/{chunk-XNNQRA35.js → chunk-XPKWJD5O.js}

@@ -1,4 +1,4 @@
-import { flagView } from './chunk-AU3H5WIY.js';
+import { flagView } from './chunk-T4F3BWR5.js';
 import { jsx } from 'react/jsx-runtime';
 
 function Flag({ code, label, decorative = false, locale, shape, format, source, basePath, size, fallback = null, ...rest }) {
@@ -14,6 +14,7 @@ function Flag({ code, label, decorative = false, locale, shape, format, source,
     {
       src: view.src,
       alt: name,
+      title: name || void 0,
       width: view.width,
       height: view.height,
       loading: "lazy",

package/dist/{flags-BBJc9unY.d.ts → flags-fLwIl2hG.d.ts}

@@ -127,6 +127,12 @@ interface FlagAttributeOptions extends FlagOptions {
  * `Intl.DisplayNames`. `label` replaces it and `decorative` drops it. Nothing is ever
  * invented - a subdivision the platform cannot name, or a runtime without `Intl`, renders
  * as decoration rather than putting a bare "ES" into a screen reader.
+ *
+ * The name goes on `title` as well as `alt`, because those two do different jobs and only
+ * one of them is visible: `alt` is what a screen reader reads and what shows when the image
+ * fails, while a POINTER tooltip comes from `title` and from nothing else. A flag with a
+ * name nobody can see on hover is the common complaint, and it is not an accessibility
+ * nicety - the flag is often the only thing in a cell. A decorative flag gets neither.
  */
 declare function flagAttributes(code: string | null | undefined, options?: FlagAttributeOptions): Record<string, string | number> | null;
 

package/dist/index.d.ts

@@ -6,7 +6,7 @@ export { E as EstimateOptions, G as GeneratePasswordOptions, P as PasswordAlphab
 export { N as Notification, a as NotificationAction, b as NotificationInput, c as NotificationTone, d as Notifications, e as NotificationsOptions, P as PromiseMessages, f as createNotifications } from './notifications-BpVV6sel.js';
 export { N as NetworkMonitor, a as NetworkState, S as SERVER_NETWORK_STATE, c as createNetworkMonitor } from './network-D2LsBG_k.js';
 export { R as RelativeTimeFormat, a as RelativeTimeOptions, b as RelativeTimePrecision, c as RelativeTimeStyle, d as RelativeTimeTense, e as RelativeTimeView, f as ensureZone, n as normalizeDate, p as parseDuration, r as relativeTimeAttributes, g as relativeTimeView } from './relative-time-YpRTG7YH.js';
-export { F as FLAG_CDN, a as FLAG_RATIO, b as FlagConfig, c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, g as FlagView, h as configureFlags, i as flagAttributes, j as flagConfig, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode, r as resetFlagConfig } from './flags-BBJc9unY.js';
+export { F as FLAG_CDN, a as FLAG_RATIO, b as FlagConfig, c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, g as FlagView, h as configureFlags, i as flagAttributes, j as flagConfig, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode, r as resetFlagConfig } from './flags-fLwIl2hG.js';
 export { P as PaletteKey, a as PositionedRow, R as RecentEntry, b as RecentStore, c as RecentStoreOptions, d as RowGroup, e as createRecentStore, g as groupRows, i as isPaletteShortcut, m as moveActive, r as recentKey, s as shortcutLabel } from './palette-D7iuQh_T.js';
 
 /**

package/dist/index.js

@@ -1,6 +1,6 @@
 export { createInput } from './chunk-KJINGUQN.js';
 export { estimatePasswordStrength, generatePassword } from './chunk-HC2ME5PU.js';
-export { FLAG_CDN, FLAG_RATIO, configureFlags, flagAttributes, flagConfig, flagName, flagSrc, flagView, normalizeFlagCode, resetFlagConfig } from './chunk-AU3H5WIY.js';
+export { FLAG_CDN, FLAG_RATIO, configureFlags, flagAttributes, flagConfig, flagName, flagSrc, flagView, normalizeFlagCode, resetFlagConfig } from './chunk-T4F3BWR5.js';
 export { createMarquee } from './chunk-UOSSNUSC.js';
 export { SERVER_NETWORK_STATE, createNetworkMonitor } from './chunk-2QFTRNAZ.js';
 export { createNotifications } from './chunk-SNYUBXWQ.js';

package/dist/next/index.d.ts

@@ -18,7 +18,7 @@ export { RelativeTime, RelativeTimeProps } from '../react/relative-time.js';
 export { R as RelativeTimeFormat, a as RelativeTimeOptions, b as RelativeTimePrecision, c as RelativeTimeStyle, d as RelativeTimeTense } from '../relative-time-YpRTG7YH.js';
 export { N as Notification, a as NotificationAction, b as NotificationInput, c as NotificationTone, e as NotificationsOptions } from '../notifications-BpVV6sel.js';
 export { Flag, FlagProps } from '../react/flag.js';
-export { c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, h as configureFlags, i as flagAttributes, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode } from '../flags-BBJc9unY.js';
+export { c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, h as configureFlags, i as flagAttributes, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode } from '../flags-fLwIl2hG.js';
 export { PaletteContent, PaletteContextValue, PaletteField, PaletteFooter, PaletteItem, PaletteList, PaletteListProps, PaletteRoot, PaletteRootProps, PaletteRow, PaletteSection, PaletteTrigger, SearchPalette, SearchPaletteProps, usePaletteContext } from '../react/palette.js';
 export { R as RecentEntry, b as RecentStore, e as createRecentStore, g as groupRows, i as isPaletteShortcut, m as moveActive, r as recentKey, s as shortcutLabel } from '../palette-D7iuQh_T.js';
 

package/dist/next/index.js

@@ -1,7 +1,7 @@
 "use client";
 export { useInput } from '../chunk-U3V4EHOB.js';
 export { PasswordStrength } from '../chunk-XQHCZAPJ.js';
-export { Flag } from '../chunk-XNNQRA35.js';
+export { Flag } from '../chunk-XPKWJD5O.js';
 export { Toaster } from '../chunk-ZCUFYBPB.js';
 export { useMarquee } from '../chunk-ZWR2EXHQ.js';
 export { useSearch } from '../chunk-QQFNAKMY.js';
@@ -10,7 +10,7 @@ export { createNotificationQueue, defaultQueue, useNotifications } from '../chun
 export { RelativeTime } from '../chunk-OCMI7R6H.js';
 import '../chunk-KJINGUQN.js';
 export { estimatePasswordStrength, generatePassword } from '../chunk-HC2ME5PU.js';
-export { configureFlags, flagAttributes, flagName, flagSrc, flagView, normalizeFlagCode } from '../chunk-AU3H5WIY.js';
+export { configureFlags, flagAttributes, flagName, flagSrc, flagView, normalizeFlagCode } from '../chunk-T4F3BWR5.js';
 import '../chunk-UOSSNUSC.js';
 import '../chunk-2QFTRNAZ.js';
 import '../chunk-SNYUBXWQ.js';

package/dist/react/flag.d.ts

@@ -1,5 +1,5 @@
 import { ImgHTMLAttributes, ReactNode } from 'react';
-import { e as FlagShape, c as FlagFormat, f as FlagSource } from '../flags-BBJc9unY.js';
+import { e as FlagShape, c as FlagFormat, f as FlagSource } from '../flags-fLwIl2hG.js';
 
 interface FlagProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, "src" | "alt" | "width" | "height"> {
     /** `es`, `ES`, `en-GB`, `gb-eng`, or the emoji flag you are replacing. */

package/dist/react/flag.js

@@ -1,3 +1,3 @@
 "use client";
-export { Flag } from '../chunk-XNNQRA35.js';
-import '../chunk-AU3H5WIY.js';
+export { Flag } from '../chunk-XPKWJD5O.js';
+import '../chunk-T4F3BWR5.js';

package/dist/react/index.d.ts

@@ -20,7 +20,7 @@ export { RelativeTime, RelativeTimeProps } from './relative-time.js';
 export { R as RelativeTimeFormat, a as RelativeTimeOptions, b as RelativeTimePrecision, c as RelativeTimeStyle, d as RelativeTimeTense } from '../relative-time-YpRTG7YH.js';
 export { N as Notification, a as NotificationAction, b as NotificationInput, c as NotificationTone, e as NotificationsOptions } from '../notifications-BpVV6sel.js';
 export { Flag, FlagProps } from './flag.js';
-export { c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, h as configureFlags, i as flagAttributes, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode } from '../flags-BBJc9unY.js';
+export { c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, h as configureFlags, i as flagAttributes, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode } from '../flags-fLwIl2hG.js';
 export { PaletteContent, PaletteContextValue, PaletteField, PaletteFooter, PaletteItem, PaletteList, PaletteListProps, PaletteRoot, PaletteRootProps, PaletteRow, PaletteSection, PaletteTrigger, SearchPalette, SearchPaletteProps, usePaletteContext } from './palette.js';
 export { R as RecentEntry, b as RecentStore, e as createRecentStore, g as groupRows, i as isPaletteShortcut, m as moveActive, r as recentKey, s as shortcutLabel } from '../palette-D7iuQh_T.js';
 

package/dist/react/index.js

@@ -1,7 +1,7 @@
 "use client";
 export { useInput } from '../chunk-U3V4EHOB.js';
 export { PasswordStrength } from '../chunk-XQHCZAPJ.js';
-export { Flag } from '../chunk-XNNQRA35.js';
+export { Flag } from '../chunk-XPKWJD5O.js';
 export { Toaster } from '../chunk-ZCUFYBPB.js';
 export { useMarquee } from '../chunk-ZWR2EXHQ.js';
 export { useSearch } from '../chunk-QQFNAKMY.js';
@@ -10,7 +10,7 @@ export { createNotificationQueue, defaultQueue, useNotifications } from '../chun
 export { RelativeTime } from '../chunk-OCMI7R6H.js';
 import '../chunk-KJINGUQN.js';
 export { estimatePasswordStrength, generatePassword } from '../chunk-HC2ME5PU.js';
-export { configureFlags, flagAttributes, flagName, flagSrc, flagView, normalizeFlagCode } from '../chunk-AU3H5WIY.js';
+export { configureFlags, flagAttributes, flagName, flagSrc, flagView, normalizeFlagCode } from '../chunk-T4F3BWR5.js';
 import '../chunk-UOSSNUSC.js';
 import '../chunk-2QFTRNAZ.js';
 import '../chunk-SNYUBXWQ.js';

package/dist/react-router/index.d.ts

@@ -18,7 +18,7 @@ export { RelativeTime, RelativeTimeProps } from '../react/relative-time.js';
 export { R as RelativeTimeFormat, a as RelativeTimeOptions, b as RelativeTimePrecision, c as RelativeTimeStyle, d as RelativeTimeTense } from '../relative-time-YpRTG7YH.js';
 export { N as Notification, a as NotificationAction, b as NotificationInput, c as NotificationTone, e as NotificationsOptions } from '../notifications-BpVV6sel.js';
 export { Flag, FlagProps } from '../react/flag.js';
-export { c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, h as configureFlags, i as flagAttributes, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode } from '../flags-BBJc9unY.js';
+export { c as FlagFormat, d as FlagOptions, e as FlagShape, f as FlagSource, h as configureFlags, i as flagAttributes, k as flagName, l as flagSrc, m as flagView, n as normalizeFlagCode } from '../flags-fLwIl2hG.js';
 export { PaletteContent, PaletteContextValue, PaletteField, PaletteFooter, PaletteItem, PaletteList, PaletteListProps, PaletteRoot, PaletteRootProps, PaletteRow, PaletteSection, PaletteTrigger, SearchPalette, SearchPaletteProps, usePaletteContext } from '../react/palette.js';
 export { R as RecentEntry, b as RecentStore, e as createRecentStore, g as groupRows, i as isPaletteShortcut, m as moveActive, r as recentKey, s as shortcutLabel } from '../palette-D7iuQh_T.js';
 

package/dist/react-router/index.js

@@ -1,7 +1,7 @@
 "use client";
 export { useInput } from '../chunk-U3V4EHOB.js';
 export { PasswordStrength } from '../chunk-XQHCZAPJ.js';
-export { Flag } from '../chunk-XNNQRA35.js';
+export { Flag } from '../chunk-XPKWJD5O.js';
 export { Toaster } from '../chunk-ZCUFYBPB.js';
 export { useMarquee } from '../chunk-ZWR2EXHQ.js';
 export { useSearch } from '../chunk-QQFNAKMY.js';
@@ -10,7 +10,7 @@ export { createNotificationQueue, defaultQueue, useNotifications } from '../chun
 export { RelativeTime } from '../chunk-OCMI7R6H.js';
 import '../chunk-KJINGUQN.js';
 export { estimatePasswordStrength, generatePassword } from '../chunk-HC2ME5PU.js';
-export { configureFlags, flagAttributes, flagName, flagSrc, flagView, normalizeFlagCode } from '../chunk-AU3H5WIY.js';
+export { configureFlags, flagAttributes, flagName, flagSrc, flagView, normalizeFlagCode } from '../chunk-T4F3BWR5.js';
 import '../chunk-UOSSNUSC.js';
 import '../chunk-2QFTRNAZ.js';
 import '../chunk-SNYUBXWQ.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@enigmax/primitives",
-  "version": "0.19.0",
+  "version": "0.19.1",
   "description": "Headless components: the behaviour, the timing and the accessibility, with no styles of their own. Framework-agnostic core plus thin adapters.",
   "type": "module",
   "sideEffects": [

package/src/core/flags.ts

@@ -246,6 +246,12 @@ export interface FlagAttributeOptions extends FlagOptions {
  * `Intl.DisplayNames`. `label` replaces it and `decorative` drops it. Nothing is ever
  * invented - a subdivision the platform cannot name, or a runtime without `Intl`, renders
  * as decoration rather than putting a bare "ES" into a screen reader.
+ *
+ * The name goes on `title` as well as `alt`, because those two do different jobs and only
+ * one of them is visible: `alt` is what a screen reader reads and what shows when the image
+ * fails, while a POINTER tooltip comes from `title` and from nothing else. A flag with a
+ * name nobody can see on hover is the common complaint, and it is not an accessibility
+ * nicety - the flag is often the only thing in a cell. A decorative flag gets neither.
  */
 export function flagAttributes(code: string | null | undefined, options: FlagAttributeOptions = {}): Record<string, string | number> | null {
     const view = flagView(code, options);
@@ -261,6 +267,6 @@ export function flagAttributes(code: string | null | undefined, options: FlagAtt
         "data-enigma-flag": "",
         "data-flag-code": view.code,
         "data-flag-shape": view.shape,
-        ...(label ? {} : { "aria-hidden": "true" })
+        ...(label ? { title: label } : { "aria-hidden": "true" })
     };
 }

package/src/react/flag.tsx

@@ -52,6 +52,9 @@ export function Flag({ code, label, decorative = false, locale, shape, format, s
         <img
             src={view.src}
             alt={name}
+            // `alt` is read; `title` is what a pointer shows. Only one of them is visible,
+            // and a flag whose name never appears on hover is the thing people report.
+            title={name || undefined}
             width={view.width}
             height={view.height}
             loading="lazy"