@sveltia/ui 0.78.4 → 0.79.1

package/dist/components/util/modal.svelte

@@ -25,7 +25,7 @@
   import Placeholder from './placeholder.svelte';
 
   /**
-   * @import { ModalProps } from '../../typedefs';
+   * @import { ModalProps } from '../../typedefs.js';
    */
 
   /**
@@ -154,6 +154,14 @@
    */
   let lastActiveElement;
 
+  /**
+   * The element the last `pointerdown` event in the modal was fired on. A click that lands on the
+   * backdrop only dismisses the modal if the pointer was also pressed there, so selecting text in
+   * the content by dragging and releasing the pointer over the backdrop doesn’t close it.
+   * @type {EventTarget | null | undefined}
+   */
+  let pointerDownTarget;
+
   /**
    * Timer used to defer the focus restoration in {@link moveFocusBack}.
    * @type {number | undefined}
@@ -404,7 +412,19 @@
       class:backdrop={showBackdrop}
       class:open={setOpenClass}
       class:active={setActiveClass}
+      onpointerdown={({ target }) => {
+        pointerDownTarget = target;
+      }}
       onclick={({ target }) => {
+        const downTarget = pointerDownTarget;
+
+        pointerDownTarget = undefined;
+
+        // A click with no `pointerdown` before it, like one dispatched by a script, is taken as is
+        if (downTarget && downTarget !== dialog) {
+          return;
+        }
+
         if (
           dialog &&
           lightDismiss &&
@@ -423,6 +443,22 @@
           open = false;
         }
       }}
+      onclose={() => {
+        // Closed by `closeDialog()` or on unmount, or already shown again by `openDialog()`
+        if (!requestedOpen || !dialog?.isConnected || dialog.open) {
+          return;
+        }
+
+        // The browser has closed the dialog on its own. The `cancel` event can’t always be
+        // prevented: Chrome makes it non-cancelable when Escape is pressed again without any user
+        // activation in between. Show the dialog again if it shouldn’t be dismissed with Escape,
+        // otherwise bring the state in line, so the usual closing steps run.
+        if (!escapeDismiss) {
+          dialog.showModal();
+        } else {
+          open = false;
+        }
+      }}
     >
       {@render extraContent?.()}
       {@render children?.()}

package/dist/components/util/modal.svelte.d.ts

@@ -11,4 +11,4 @@ declare const Modal: import("svelte").Component<ModalProps & Record<string, any>
     focus: () => void;
     close: (returnValue: string) => void;
 }, "dialog" | "open">;
-import type { ModalProps } from '../../typedefs';
+import type { ModalProps } from '../../typedefs.js';

package/dist/components/util/popup.svelte

@@ -10,7 +10,7 @@
 
   /**
    * @import { Snippet } from 'svelte';
-   * @import { ModalProps, PopupPosition } from '../../typedefs';
+   * @import { ModalProps, PopupPosition } from '../../typedefs.js';
    */
 
   /**
@@ -73,10 +73,7 @@
    */
   let contentType = $state();
   /**
-   * @type {{ style: { inset: string | undefined, zIndex: number | undefined, minWidth: string |
-   * undefined, maxWidth: string | undefined, height: string | undefined }, open: boolean,
-   * attachPopupElement: (popupElement: HTMLDialogElement, contentElement?: HTMLElement) => void,
-   * detachPopupElement: () => void, checkPosition: () => void, destroy: () => void } | undefined}
+   * @type {ReturnType<typeof activatePopup> | undefined}
    */
   let popupInstance = $state();
   let hoveredTimeout = 0;

package/dist/components/util/popup.svelte.d.ts

@@ -112,6 +112,6 @@ type Props = {
      */
     onOpen?: ((event: CustomEvent) => void) | undefined;
 };
-import type { ModalProps } from '../../typedefs';
-import type { PopupPosition } from '../../typedefs';
+import type { ModalProps } from '../../typedefs.js';
+import type { PopupPosition } from '../../typedefs.js';
 import type { Snippet } from 'svelte';

package/dist/components/util/visibility-observer.svelte

@@ -49,4 +49,5 @@
   .placeholder {
     height: 64px;
   }
+
 </style>

package/dist/locales/ar.yaml

@@ -104,7 +104,7 @@ text_editor:
   show_text_style_options: إظهار خيارات نمط النص
   # Block style menu items
   paragraph: فقرة
-  heading_ 1: عنوان 1
+  heading_1: عنوان 1
   heading_2: عنوان 2
   heading_3: عنوان 3
   heading_4: عنوان 4

package/dist/locales/sk.yaml

@@ -0,0 +1,136 @@
+# Dialog action button labels
+ok: OK
+cancel: Zrušiť
+close: Zavrieť
+
+# Button to clear content, e.g. search input or calendar date
+clear: Vymazať
+
+# Text editor dialog buttons for link/image insertion
+insert: Vložiť
+update: Aktualizovať
+remove: Odobrať
+
+# Combobox dropdown toggle button aria-labels
+collapse: Zbaliť
+expand: Rozbaliť
+
+# Infobar/toast dismiss button label
+dismiss: Zavrieť
+
+# Alert & infobar status, read out by screen readers before the message (visually hidden)
+alert:
+  error: Chyba
+  warning: Upozornenie
+  info: Informácia
+  success: Úspech
+
+# Role descriptions, read out by screen readers in place of the generic “group” role
+role_descriptions:
+  disclosure: rozbaľovacia sekcia
+  option_group: skupina možností
+  menu_item_group: skupina položiek menu
+  checkbox_group: skupina začiarkavacích políčok
+  table_head: hlavička tabuľky
+  table_body: telo tabuľky
+  table_foot: päta tabuľky
+  grid_head: hlavička mriežky
+  grid_body: telo mriežky
+  grid_foot: päta mriežky
+
+# Emoji suggestion listbox aria-label, shared by the text fields and the text editor
+emoji_suggestions: Návrhy emoji
+
+# Calendar component
+calendar:
+  # View switcher group aria-labels and navigation button aria-labels
+  year: Rok
+  previous_decade: Predchádzajúce desaťročie
+  next_decade: Nasledujúce desaťročie
+  month: Mesiac
+  previous_month: Predchádzajúci mesiac
+  next_month: Nasledujúci mesiac
+  # “Today” button label in footer
+  today: Dnes
+
+# Split button component
+split_button:
+  # Wrapper aria-label, e.g. “Save Options” when primary button is “Save”
+  x_options: Možnosti pre {$name}
+  # Dropdown toggle aria-label
+  more_options: Ďalšie možnosti
+
+# Combobox component
+combobox:
+  # Placeholder when no option is selected
+  select_an_option: Vyberte možnosť…
+  # Filter input aria-label
+  filter_options: Filtrovať možnosti
+  # Empty state message when filter has no matches
+  no_matching_options: Nenašli sa žiadne zodpovedajúce možnosti
+
+# Number input component
+number_input:
+  # Spin button aria-labels for incrementing/decrementing the number value
+  increase: Zvýšiť
+  decrease: Znížiť
+
+# Password input component
+password_input:
+  # Visibility toggle button aria-labels
+  show_password: Zobraziť heslo
+  hide_password: Skryť heslo
+
+# Secret input component (API keys, tokens, etc.)
+secret_input:
+  # Visibility toggle button aria-labels
+  show_secret: Zobraziť tajný kľúč
+  hide_secret: Skryť tajný kľúč
+
+# Select tags component (multi-select)
+select_tags:
+  # Listbox aria-label
+  selected_options: Vybrané možnosti
+  # Remove button aria-label, e.g. “Remove Option 1”
+  remove_x: Odobrať {$name}
+
+# Text editor component
+text_editor:
+  # Toolbar aria-labels
+  text_editor: Textový editor
+  code_editor: Editor kódu
+  # Block style menu button and menu aria-labels
+  text_style_options: Možnosti formátovania textu
+  show_text_style_options: Zobraziť možnosti formátovania textu
+  # Block style menu items
+  paragraph: Odsek
+  heading_1: Nadpis 1
+  heading_2: Nadpis 2
+  heading_3: Nadpis 3
+  heading_4: Nadpis 4
+  heading_5: Nadpis 5
+  heading_6: Nadpis 6
+  bulleted_list: Zoznam s odrážkami
+  numbered_list: Číslovaný zoznam
+  blockquote: Citácia
+  code_block: Blok kódu
+  # Inline style button aria-labels
+  bold: Tučné
+  italic: Kurzíva
+  strikethrough: Prečiarknuté
+  code: Kód
+  link: Odkaz
+  # Link dialog title
+  insert_link: Vložiť odkaz
+  update_link: Aktualizovať odkaz
+  # Link dialog input field labels
+  text: Text
+  url: URL
+  # Markdown mode toggle button aria-label
+  edit_in_markdown: Upraviť v Markdowne
+  # Error message when rich text conversion fails
+  converter_error: Režim formátovaného textu nie je možné zapnúť. Použite namiesto neho editor obyčajného textu.
+  # Language selector aria-label
+  language: Jazyk
+  # Plain text mode option in language selector
+  plain_text: Obyčajný text

package/dist/services/group.svelte.d.ts

@@ -1,4 +1,3 @@
-export function normalize(value: string): string;
 /**
  * Implement keyboard and mouse interactions for a grouping composite widget.
  */
@@ -17,6 +16,11 @@ export class Group {
      * @type {boolean}
      */
     activated: boolean;
+    /**
+     * Observer of the members’ selected state, for the widgets whose panels or tab stop follow it.
+     * @type {MutationObserver | undefined}
+     */
+    selectionObserver: MutationObserver | undefined;
     parent: HTMLElement;
     role: string;
     multi: boolean;
@@ -61,6 +65,11 @@ export class Group {
      * items would take three tab presses to step over.
      */
     updateTabStop(): void;
+    /**
+     * Bring the panels and the roving tab stop in line with the members’ selected state, after it has
+     * been changed from outside the group.
+     */
+    syncSelection(): void;
     /**
      * Count the columns of a grid layout from where the members sit, rather than from their widths:
      * a row of a data grid spans the full width, a tile in a grid listbox doesn’t, and a header row