@proyecto-viviana/solidaria 0.4.2 → 0.6.0-rc.0

package/src/tabs/createTabs.ts

@@ -1,14 +1,42 @@
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/tabs/TabsKeyboardDelegate.ts
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/tabs/useTab.ts
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/tabs/useTabList.ts
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/tabs/useTabPanel.ts
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/tabs/utils.ts
+
 /**
  * ARIA hooks for tab components.
- * Based on @react-aria/tabs.
+ * Based on these pinned React Aria sources:
+ * - packages/react-aria/src/tabs/useTabList.ts
+ * - packages/react-aria/src/tabs/useTab.ts
+ * - packages/react-aria/src/tabs/useTabPanel.ts
+ * - packages/react-aria/src/tabs/TabsKeyboardDelegate.ts
+ * - packages/react-aria/src/tabs/utils.ts
+ *
+ * This Solid module combines the upstream hooks and keyboard delegate.
  */
 
-import { type Accessor, batch, createEffect, createMemo } from "solid-js";
+import { createMemo, createTrackedEffect } from "solid-js";
+import type { Accessor } from "solid-js";
 import { createFocusRing } from "../interactions";
 import { createPress } from "../interactions";
 import { createHover } from "../interactions";
 import { createId } from "../ssr";
 import { useLocale } from "../i18n";
+import { ariaTrueFalse, attrTrue } from "../utils/domAttrs";
+import { createHasTabbableChild } from "../focus/createHasTabbableChild";
 import type { Key, Collection, CollectionNode } from "@proyecto-viviana/solid-stately";
 
 export type TabOrientation = "horizontal" | "vertical";
@@ -77,8 +105,8 @@ export interface TabAria {
   tabProps: {
     id: string;
     role: "tab";
-    "aria-selected": boolean;
-    "aria-disabled": boolean | undefined;
+    "aria-selected": boolean | "true" | "false";
+    "aria-disabled": boolean | "true" | undefined;
     "aria-controls": string | undefined;
     "aria-label"?: string;
     "aria-labelledby"?: string;
@@ -124,7 +152,7 @@ export interface TabPanelAria {
     "aria-labelledby"?: string;
     "aria-label"?: string;
     "aria-describedby"?: string;
-    tabIndex: number;
+    tabIndex: number | undefined;
   };
   /** Whether this panel is the selected one. */
   isSelected: Accessor<boolean>;
@@ -232,15 +260,15 @@ export function createTabList<T>(props: AriaTabListProps, state: TabListState<T>
     const isRTL = locale().direction === "rtl";
 
     switch (e.key) {
+      // getKeyLeftOf/getKeyRightOf follow locale text direction regardless of
+      // orientation (TabsKeyboardDelegate.flipDirection = direction === 'rtl'),
+      // so ArrowLeft always moves to the next tab in RTL. ArrowUp/ArrowDown stay
+      // unflipped and only apply when vertical.
       case "ArrowLeft":
-        if (isHorizontal) {
-          nextKey = isRTL ? getNextKey(state, currentKey) : getPreviousKey(state, currentKey);
-        }
+        nextKey = isRTL ? getNextKey(state, currentKey) : getPreviousKey(state, currentKey);
         break;
       case "ArrowRight":
-        if (isHorizontal) {
-          nextKey = isRTL ? getPreviousKey(state, currentKey) : getNextKey(state, currentKey);
-        }
+        nextKey = isRTL ? getPreviousKey(state, currentKey) : getNextKey(state, currentKey);
         break;
       case "ArrowUp":
         if (!isHorizontal) {
@@ -279,18 +307,36 @@ export function createTabList<T>(props: AriaTabListProps, state: TabListState<T>
       // effect the instant `setFocusedKey` runs — so focus moves *before* the
       // selection callback, inverting React's order. React batches both state
       // updates in the handler (callback fires synchronously) and defers the
-      // focus move to a layout effect. `batch()` is the Solid equivalent: it
+      // focus move to a layout effect. `` is the Solid equivalent: it
       // holds the focus effect until the batch closes, so the synchronous
       // `onSelectionChange` fires first, then focus moves — matching upstream's
       // `callback → focusout → focusin` sequence (D4 event-sequence oracle).
-      batch(() => {
+      //
+      // `setFocused(true)` stays inside the batch. Playwright `.focus()` can
+      // land DOM focus on a tab without the tablist bubbling `focusin`; the
+      // item focus-move effect is gated on `isFocused` (RAC
+      // `manager.isFocused`). Setting it here, together with `focusedKey`,
+      // avoids the previous-tab effect stealing focus back mid-gesture.
+      {
+        state.setFocused(true);
         state.setFocusedKey(nextKey);
         // Selection follows focus only for keyboard navigation in automatic mode
         // (mirrors useSelectableCollection's selectOnFocus in navigateToKey).
         if (keyboardActivation() === "automatic") {
           state.setSelectedKey(nextKey);
         }
-      });
+      }
+      // Move DOM focus in the keydown handler so it lands before keyup.
+      // Solid `createEffect` is scheduled after paint; Playwright records
+      // keyup in the same turn, and a non-reactive `let` tab ref can leave
+      // the item effect with no element. Scope the query to the tablist so
+      // React/Solid comparison-panel ids cannot collide.
+      const tabList = e.currentTarget as Element | null;
+      const nextId = generateTabId(state, nextKey);
+      const nextEl = tabList?.querySelector(`#${CSS.escape(nextId)}`);
+      if (nextEl instanceof HTMLElement && nextEl.ownerDocument.activeElement !== nextEl) {
+        nextEl.focus();
+      }
     }
   };
 
@@ -314,10 +360,18 @@ export function createTabList<T>(props: AriaTabListProps, state: TabListState<T>
   return {
     tabListProps: {
       role: "tablist",
-      "aria-orientation": orientation(),
-      "aria-label": props["aria-label"],
-      "aria-labelledby": props["aria-labelledby"],
-      "aria-describedby": props["aria-describedby"],
+      get "aria-orientation"() {
+        return orientation();
+      },
+      get "aria-label"() {
+        return props["aria-label"];
+      },
+      get "aria-labelledby"() {
+        return props["aria-labelledby"];
+      },
+      get "aria-describedby"() {
+        return props["aria-describedby"];
+      },
       onKeyDown: handleKeyDown,
       onFocusIn: handleFocus,
       onFocusOut: handleBlur,
@@ -356,14 +410,10 @@ export function createTab<T>(
   const selectTab = () => {
     // Press handlers select only — they do NOT set the focused key. Upstream's
     // useSelectableItem does the same: its press/onSelect path calls
-    // replaceSelection, while `focusedKey` is driven exclusively by the DOM
-    // `onFocus` handler (see handleFocus below). Setting the focused key here too
-    // flipped the roving tabIndex synchronously at pointer-up — *before* the
-    // browser's native focus reached the tab — so a touch tap logged the tapped
-    // tab with tabIndex 0 at its own `focusin`, where React (which updates
-    // tabIndex only on the post-event commit) still shows -1. Letting native
-    // focus alone advance `focusedKey` defers the tabIndex flip past the focus
-    // event, matching React's D4 event sequence.
+    // replaceSelection. `focusedKey` is written by handleFocusIn (DOM `focusin`)
+    // and by createTabListState's selected→focused copy after paint (RAC
+    // useTabListState useEffect). Setting it here would flip the roving tabIndex
+    // during press, before React's post-paint copy and before native focus.
     state.setSelectedKey(key());
   };
   const { isPressed, pressProps } = createPress({
@@ -419,13 +469,19 @@ export function createTab<T>(
   // records event targets from a document-level capture-phase listener, which
   // runs before this at-target handler, so a touch tap — whose selection lands
   // on press-up, after focus — is still observed with tabIndex=-1 at `focusin`,
-  // exactly as React. A mouse press selects on press-start and syncs focusedKey
-  // before focus (createTabListState's selection→focus effect), so its tab
-  // already reads tabIndex=0 at `focusin`, again matching React. Setting it on
-  // the earlier `focus` event flipped the tab a whole event too soon, so touch
-  // taps diverged at `focusin`. See recertification.md D4 event-ordering.
+  // exactly as React. Mouse press-start selection does not write focusedKey here;
+  // createTabListState copies selected→focused after paint, so capture of
+  // pointerup/click still reads tabindex="-1". Setting it on the earlier `focus`
+  // event flipped the tab a whole event too soon, so touch taps diverged at
+  // `focusin`. The D4 event driver holds this ordering.
   const handleFocusIn = () => {
-    state.setFocusedKey(key());
+    // Batch collection-focused + roving key. Native `focus` is too early:
+    // setting isFocused there flushes the previous tab's focus-move effect
+    // and steals a touch tap back to Overview (D4 touch-tap).
+    {
+      state.setFocused(true);
+      state.setFocusedKey(key());
+    }
   };
 
   const handleBlur = (e: FocusEvent) => {
@@ -453,7 +509,7 @@ export function createTab<T>(
   // Only while the tab list itself is focused (mirrors useSelectableItem's
   // manager.isFocused guard), so programmatic selection changes don't steal
   // focus from elsewhere in the document.
-  createEffect(() => {
+  createTrackedEffect(() => {
     const element = ref?.();
     if (!state.isFocused() || !isKeyFocused() || !element) return;
 
@@ -468,10 +524,10 @@ export function createTab<T>(
       id: tabId,
       role: "tab",
       get "aria-selected"() {
-        return isSelected();
+        return ariaTrueFalse(isSelected());
       },
       get "aria-disabled"() {
-        return isDisabled() || undefined;
+        return attrTrue(isDisabled());
       },
       get "aria-controls"() {
         return isSelected() ? tabPanelId : undefined;
@@ -507,6 +563,7 @@ export function createTab<T>(
 export function createTabPanel<T>(
   props: AriaTabPanelProps,
   state: TabListState<T> | null,
+  ref: Accessor<Element | null | undefined> = () => null,
 ): TabPanelAria {
   const fallbackId = createId();
 
@@ -525,6 +582,12 @@ export function createTabPanel<T>(
     }
     return state.selectedKey() === props.id;
   });
+  const hasTabbableChild = createHasTabbableChild(ref, {
+    // Inactive force-mounted panels are inert, so their descendants are not
+    // tabbable. Recompute and observe only when a panel becomes active; this
+    // also disconnects an observer if a force-mounted panel is detached.
+    isDisabled: () => !isSelected(),
+  });
 
   return {
     tabPanelProps: {
@@ -546,8 +609,12 @@ export function createTabPanel<T>(
       },
       "aria-label": props["aria-label"],
       "aria-describedby": props["aria-describedby"],
-      // Make panel focusable if no tabbable children
-      tabIndex: 0,
+      // Tabbing from the selected tab should enter the first tabbable child.
+      // Keep the panel itself in sequential focus order only when it is empty
+      // of tabbable descendants.
+      get tabIndex() {
+        return hasTabbableChild() ? undefined : 0;
+      },
     },
     isSelected,
   };

package/src/tag/createTag.ts

@@ -1,3 +1,17 @@
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/tag/useTag.ts
+
 /**
  * Tag hook for Solidaria
  *
@@ -8,13 +22,15 @@
  */
 
 import { createMemo } from "solid-js";
-import { createFocusable } from "../interactions/createFocusable";
-import { createPress } from "../interactions/createPress";
+import { createFocusRing } from "../interactions/createFocusRing";
 import { filterDOMProps } from "../utils/filterDOMProps";
 import { mergeProps } from "../utils/mergeProps";
 import { createId } from "../ssr";
 import { access, type MaybeAccessor } from "../utils/reactivity";
+import { createStringFormatter } from "../i18n";
 import { getTagGroupData } from "./createTagGroup";
+import { tagIntlStrings } from "./intl";
+import { createSelectableItem, type SelectableItemState } from "../selection/createSelectableItem";
 import type { ListState, Key } from "@proyecto-viviana/solid-stately";
 
 export interface AriaTagProps {
@@ -26,6 +42,8 @@ export interface AriaTagProps {
   isDisabled?: boolean;
   /** A text value for the tag used for accessibility. */
   textValue?: string;
+  /** Handler called when the tag is activated (Enter, or press when selectionMode is none). */
+  onAction?: () => void;
 }
 
 export interface TagAria {
@@ -43,6 +61,8 @@ export interface TagAria {
   isDisabled: boolean;
   /** Whether the tag is focused. */
   isFocused: boolean;
+  /** Whether the tag is keyboard focused. */
+  isFocusVisible: boolean;
   /** Whether the tag is pressed. */
   isPressed: boolean;
 }
@@ -57,6 +77,7 @@ export function createTag<T>(
   ref: () => HTMLElement | null,
 ): TagAria {
   const getProps = () => access(props);
+  const stringFormatter = createStringFormatter(tagIntlStrings, "@react-aria/tag");
   const rowId = createId();
   const cellId = createId();
   const removeButtonId = createId();
@@ -156,30 +177,68 @@ export function createTag<T>(
     ).find((el) => el.getAttribute("data-key") === String(nextKey));
 
     nextTag?.focus();
+    // RAC useGridList selectOnFocus when selectionBehavior is replace.
+    if (
+      nextKey != null &&
+      state.selectionManager.selectionMode !== "none" &&
+      state.selectionManager.selectionBehavior === "replace"
+    ) {
+      state.selectionManager.replaceSelection(nextKey);
+    }
   };
 
-  // Handle press for selection
-  const { pressProps, isPressed } = createPress({
-    isDisabled,
-    onPress: () => {
-      if (!isDisabled()) {
-        state.setFocusedKey(key());
-        state.toggleSelection(key());
-      }
-    },
-  });
+  const removeAndRestoreFocus = (keysToRemove: Set<Key>) => {
+    const data = getData();
+    if (!data?.onRemove) return;
+    const current = key();
+    let nextKey = getNextFocusableKey(current);
+    if (nextKey === current) {
+      nextKey = getPreviousFocusableKey(current);
+    }
+    if (nextKey === current) {
+      nextKey = null;
+    }
+    data.onRemove(keysToRemove);
+    if (nextKey == null) {
+      state.setFocusedKey(null);
+      return;
+    }
+    // The removed node blurs the grid (`setFocused(false)`) and Solid may
+    // reconcile the remaining rows in this turn. Restore after that commit so
+    // the next tag is in the DOM and collection-is-focused is true again.
+    queueMicrotask(() => {
+      state.setFocused(true);
+      state.setFocusedKey(nextKey);
+      const nextTag = document.querySelector<HTMLElement>(
+        `[data-key="${CSS.escape(String(nextKey))}"]`,
+      );
+      nextTag?.focus();
+    });
+  };
 
-  // Handle focusable
-  const { focusableProps } = createFocusable(
-    {
-      isDisabled,
-      onFocus: () => {
-        state.setFocusedKey(key());
-      },
-    },
+  const selectableItem = createSelectableItem(
+    () => ({
+      key: key(),
+      id: rowId,
+      isDisabled: isDisabled(),
+      onAction: getProps().onAction,
+    }),
+    state as SelectableItemState<T>,
     ref,
   );
 
+  const { focusProps, isFocusVisible } = createFocusRing();
+
+  // Compute tabIndex. Mirror useTag (vendored @react-aria/tag/src/useTag.ts):
+  //   tabIndex = (!isDisabled && (isFocused || focusedKey == null)) ? 0 : -1
+  // Every non-disabled row is a tab stop when nothing is focused yet (so native
+  // Shift+Tab from a following element lands on the LAST row); once a key is
+  // focused, only that row keeps tabIndex 0 (roving single tab stop).
+  const tabIndex = createMemo(() => {
+    if (isDisabled()) return -1;
+    return isFocused() || state.focusedKey() == null ? 0 : -1;
+  });
+
   // Handle keyboard for navigation and removal
   const handleKeyDown = (e: KeyboardEvent) => {
     if (isDisabled()) return;
@@ -217,6 +276,32 @@ export function createTag<T>(
         e.preventDefault();
         focusKey(getLastFocusableKey());
         return;
+      case "Tab": {
+        // RAC keyboardNavigationBehavior "tab": Tab from the row focuses the
+        // Remove button (which stays tabIndex=-1 so Shift+Tab from After lands
+        // on the focused row, not every Remove). Tab from Remove leaves the grid.
+        const row = ref();
+        if (!row || e.shiftKey) return;
+        const removeBtn = row.querySelector<HTMLElement>("button");
+        if (removeBtn && document.activeElement !== removeBtn) {
+          e.preventDefault();
+          removeBtn.focus();
+        }
+        return;
+      }
+      case "Escape":
+        if (state.selectionMode() !== "none") {
+          e.preventDefault();
+          state.clearSelection();
+        }
+        return;
+      case "a":
+      case "A":
+        if ((e.ctrlKey || e.metaKey) && state.selectionMode() === "multiple") {
+          e.preventDefault();
+          state.selectAll();
+        }
+        return;
       default:
         break;
     }
@@ -232,24 +317,14 @@ export function createTag<T>(
             selection === "all"
               ? new Set(Array.from(state.collection()).map((item) => (item as { key: Key }).key))
               : new Set(selection);
-          data.onRemove(keysToRemove);
+          removeAndRestoreFocus(keysToRemove);
         } else {
-          data.onRemove(new Set([key()]));
+          removeAndRestoreFocus(new Set([key()]));
         }
       }
     }
   };
 
-  // Compute tabIndex. Mirror useTag (vendored @react-aria/tag/src/useTag.ts):
-  //   tabIndex = (!isDisabled && (isFocused || focusedKey == null)) ? 0 : -1
-  // Every non-disabled row is a tab stop when nothing is focused yet (so native
-  // Shift+Tab from a following element lands on the LAST row); once a key is
-  // focused, only that row keeps tabIndex 0 (roving single tab stop).
-  const tabIndex = createMemo(() => {
-    if (isDisabled()) return -1;
-    return isFocused() || state.focusedKey() == null ? 0 : -1;
-  });
-
   // Filter DOM props
   const domProps = () => filterDOMProps(getProps() as unknown as Record<string, unknown>);
 
@@ -265,8 +340,8 @@ export function createTag<T>(
     get rowProps() {
       return mergeProps(
         domProps(),
-        focusableProps as Record<string, unknown>,
-        pressProps as Record<string, unknown>,
+        selectableItem.itemProps as Record<string, unknown>,
+        focusProps as Record<string, unknown>,
         {
           id: rowId,
           role: rootRole(),
@@ -290,12 +365,15 @@ export function createTag<T>(
       const data = getData();
       return {
         id: removeButtonId,
-        "aria-label": "Remove",
+        "aria-label": stringFormatter().format("removeButtonLabel"),
         "aria-labelledby": `${removeButtonId} ${rowId}`,
         isDisabled: isDisabled(),
+        // Keep Removes out of the tab order. Tab from the focused row focuses
+        // the button; Shift+Tab from After then lands on the row (#318).
+        tabIndex: -1,
         onPress: () => {
           if (data?.onRemove && !isDisabled()) {
-            data.onRemove(new Set([key()]));
+            removeAndRestoreFocus(new Set([key()]));
           }
         },
       };
@@ -312,8 +390,11 @@ export function createTag<T>(
     get isFocused() {
       return isFocused();
     },
+    get isFocusVisible() {
+      return isFocusVisible();
+    },
     get isPressed() {
-      return isPressed();
+      return selectableItem.isPressed();
     },
   };
 }

package/src/tag/createTagGroup.ts

@@ -1,3 +1,17 @@
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+// Ported to SolidJS for Proyecto Viviana; based on packages/react-aria/src/tag/useTagGroup.ts
+
 /**
  * TagGroup hook for Solidaria
  *
@@ -8,7 +22,7 @@
  * Based on @react-aria/tag useTagGroup
  */
 
-import { createEffect, onCleanup } from "solid-js";
+import { onCleanup, createTrackedEffect } from "solid-js";
 import { createLabel } from "../label/createLabel";
 import { filterDOMProps } from "../utils/filterDOMProps";
 import { mergeProps } from "../utils/mergeProps";
@@ -115,16 +129,10 @@ export function createTagGroup<T>(
 
   // Share data with child tags before they create their aria state.
   tagGroupData.set(state, sharedData);
-
-  // Clean up the shared state when the tag group owner is disposed.
-  createEffect(() => {
-    tagGroupData.set(state, sharedData);
-
-    onCleanup(() => {
-      if (tagGroupData.get(state) === sharedData) {
-        tagGroupData.delete(state);
-      }
-    });
+  onCleanup(() => {
+    if (tagGroupData.get(state) === sharedData) {
+      tagGroupData.delete(state);
+    }
   });
 
   // Build aria-describedby
@@ -205,7 +213,7 @@ export function createTagGroup<T>(
   // useSelectableCollection. Only manage focus while it already lives inside the
   // container — i.e. the user is navigating via the trampoline — so a background
   // focusedKey change never yanks focus from elsewhere on the page.
-  createEffect(() => {
+  createTrackedEffect(() => {
     const key = state.focusedKey();
     const el = getRef();
     if (!el || key == null) return;

package/src/tag/intl/ar-AE.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "إزالة",
+  "removeDescription": "اضغط على مفتاح DELETE لإزالة علامة."
+}

package/src/tag/intl/bg-BG.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "Премахване",
+  "removeDescription": "Натиснете Delete, за да премахнете маркера."
+}

package/src/tag/intl/cs-CZ.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "Odebrat",
+  "removeDescription": "Stisknutím klávesy Delete odeberete značku."
+}

package/src/tag/intl/da-DK.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "Fjern",
+  "removeDescription": "Tryk på Slet for at fjerne tag."
+}

package/src/tag/intl/de-DE.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "Entfernen",
+  "removeDescription": "Auf „Löschen“ drücken, um das Tag zu entfernen."
+}

package/src/tag/intl/el-GR.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "Κατάργηση",
+  "removeDescription": "Πατήστε Διαγραφή για να καταργήσετε την ετικέτα."
+}

package/src/tag/intl/en-US.json

@@ -0,0 +1,4 @@
+{
+  "removeDescription": "Press Delete to remove tag.",
+  "removeButtonLabel": "Remove"
+}

package/src/tag/intl/es-ES.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "Quitar",
+  "removeDescription": "Pulse Eliminar para quitar la etiqueta."
+}

package/src/tag/intl/et-EE.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "Eemalda",
+  "removeDescription": "Sildi eemaldamiseks vajutage kustutusklahvi Delete."
+}

package/src/tag/intl/fi-FI.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "Poista",
+  "removeDescription": "Poista tunniste painamalla Poista-painiketta."
+}

package/src/tag/intl/fr-FR.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "Supprimer",
+  "removeDescription": "Appuyez sur Supprimer pour supprimer l’étiquette."
+}

package/src/tag/intl/he-IL.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "הסר",
+  "removeDescription": "לחץ על מחק כדי להסיר תג."
+}

package/src/tag/intl/hr-HR.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "Ukloni",
+  "removeDescription": "Pritisnite Delete za uklanjanje oznake."
+}

package/src/tag/intl/hu-HU.json

@@ -0,0 +1,4 @@
+{
+  "removeButtonLabel": "Eltávolítás",
+  "removeDescription": "Nyomja meg a Delete billentyűt a címke eltávolításához."
+}