@react-spectrum/tag 3.0.0-nightly.1933 → 3.0.0-nightly.1954

package/dist/module.js

@@ -1,14 +1,16 @@
 import "./main.css";
 import {Item as $c14698d57a91452e$re_export$Item} from "@react-stately/collections";
+import {ActionButton as $fUaQ2$ActionButton, ClearButton as $fUaQ2$ClearButton} from "@react-spectrum/button";
+import {TagKeyboardDelegate as $fUaQ2$TagKeyboardDelegate, useTagGroup as $fUaQ2$useTagGroup, useTag as $fUaQ2$useTag} from "@react-aria/tag";
 import {useDOMRef as $fUaQ2$useDOMRef, useStyleProps as $fUaQ2$useStyleProps, classNames as $fUaQ2$classNames, SlotProvider as $fUaQ2$SlotProvider, ClearSlots as $fUaQ2$ClearSlots} from "@react-spectrum/utils";
-import {mergeProps as $fUaQ2$mergeProps} from "@react-aria/utils";
-import $fUaQ2$react, {useRef as $fUaQ2$useRef} from "react";
+import {FocusScope as $fUaQ2$FocusScope, useFocusRing as $fUaQ2$useFocusRing} from "@react-aria/focus";
+import {ListCollection as $fUaQ2$ListCollection} from "@react-stately/list";
+import $fUaQ2$react, {useRef as $fUaQ2$useRef, useState as $fUaQ2$useState, useMemo as $fUaQ2$useMemo, useCallback as $fUaQ2$useCallback, useEffect as $fUaQ2$useEffect} from "react";
+import {useValueEffect as $fUaQ2$useValueEffect, useId as $fUaQ2$useId, useResizeObserver as $fUaQ2$useResizeObserver, useLayoutEffect as $fUaQ2$useLayoutEffect, mergeProps as $fUaQ2$mergeProps} from "@react-aria/utils";
+import {useLocale as $fUaQ2$useLocale, useLocalizedStringFormatter as $fUaQ2$useLocalizedStringFormatter} from "@react-aria/i18n";
 import {useProviderProps as $fUaQ2$useProviderProps} from "@react-spectrum/provider";
-import {useTagGroup as $fUaQ2$useTagGroup, useTag as $fUaQ2$useTag} from "@react-aria/tag";
 import {useTagGroupState as $fUaQ2$useTagGroupState} from "@react-stately/tag";
-import {ClearButton as $fUaQ2$ClearButton} from "@react-spectrum/button";
 import {Text as $fUaQ2$Text} from "@react-spectrum/text";
-import {useFocusRing as $fUaQ2$useFocusRing} from "@react-aria/focus";
 import {useHover as $fUaQ2$useHover} from "@react-aria/interactions";
 
 function $parcel$interopDefault(a) {
@@ -40,6 +42,254 @@ function $parcel$export(e, n, v, s) {
  */ 
 
 
+
+var $70cc9ce0ced2eb4a$exports = {};
+var $4f97095b36611c9c$exports = {};
+$4f97095b36611c9c$exports = {
+    "actions": `الإجراءات`
+};
+
+
+var $d1606ced019b0a9e$exports = {};
+$d1606ced019b0a9e$exports = {
+    "actions": `Действия`
+};
+
+
+var $01e300f7d0078144$exports = {};
+$01e300f7d0078144$exports = {
+    "actions": `Akce`
+};
+
+
+var $f3862a5e5adf53a4$exports = {};
+$f3862a5e5adf53a4$exports = {
+    "actions": `Handlinger`
+};
+
+
+var $74c0b6e11258b497$exports = {};
+$74c0b6e11258b497$exports = {
+    "actions": `Aktionen`
+};
+
+
+var $54fc4e3090259431$exports = {};
+$54fc4e3090259431$exports = {
+    "actions": `Ενέργειες`
+};
+
+
+var $edf02907a7caaf96$exports = {};
+$edf02907a7caaf96$exports = {
+    "showAllButtonLabel": (args)=>`Show all (${args.tagCount})`,
+    "hideButtonLabel": `Show less`,
+    "actions": `Actions`
+};
+
+
+var $b15ad3cf4b213b8e$exports = {};
+$b15ad3cf4b213b8e$exports = {
+    "actions": `Acciones`
+};
+
+
+var $36cfda096c3db653$exports = {};
+$36cfda096c3db653$exports = {
+    "actions": `Toimingud`
+};
+
+
+var $1a42e74299cab64d$exports = {};
+$1a42e74299cab64d$exports = {
+    "actions": `Toiminnot`
+};
+
+
+var $dd8d3f41a5bfc373$exports = {};
+$dd8d3f41a5bfc373$exports = {
+    "actions": `Actions`
+};
+
+
+var $35d68da324c3ed3e$exports = {};
+$35d68da324c3ed3e$exports = {
+    "actions": `פעולות`
+};
+
+
+var $92746ce1284cd29f$exports = {};
+$92746ce1284cd29f$exports = {
+    "actions": `Radnje`
+};
+
+
+var $570956f4f59f34b9$exports = {};
+$570956f4f59f34b9$exports = {
+    "actions": `Műveletek`
+};
+
+
+var $f680d16d6f0d92d8$exports = {};
+$f680d16d6f0d92d8$exports = {
+    "actions": `Azioni`
+};
+
+
+var $d28c56f33dc08452$exports = {};
+$d28c56f33dc08452$exports = {
+    "actions": `アクション`
+};
+
+
+var $fc6f973338bd2d9c$exports = {};
+$fc6f973338bd2d9c$exports = {
+    "actions": `액션`
+};
+
+
+var $8664f3f6a18cfaa6$exports = {};
+$8664f3f6a18cfaa6$exports = {
+    "actions": `Veiksmai`
+};
+
+
+var $bd6e0fb18b482534$exports = {};
+$bd6e0fb18b482534$exports = {
+    "actions": `Darbības`
+};
+
+
+var $3df66303c61fb25b$exports = {};
+$3df66303c61fb25b$exports = {
+    "actions": `Handlinger`
+};
+
+
+var $0f533b61cdf70176$exports = {};
+$0f533b61cdf70176$exports = {
+    "actions": `Acties`
+};
+
+
+var $03a6cd8f61b18787$exports = {};
+$03a6cd8f61b18787$exports = {
+    "actions": `Działania`
+};
+
+
+var $c726a9d931f60c66$exports = {};
+$c726a9d931f60c66$exports = {
+    "actions": `Ações`
+};
+
+
+var $ae9982f17f7235eb$exports = {};
+$ae9982f17f7235eb$exports = {
+    "actions": `Ações`
+};
+
+
+var $c756723b814c63fa$exports = {};
+$c756723b814c63fa$exports = {
+    "actions": `Acțiuni`
+};
+
+
+var $1601284ef6ec0730$exports = {};
+$1601284ef6ec0730$exports = {
+    "actions": `Действия`
+};
+
+
+var $0388aac8e3bc5b59$exports = {};
+$0388aac8e3bc5b59$exports = {
+    "actions": `Akcie`
+};
+
+
+var $247d9c4a71da6b08$exports = {};
+$247d9c4a71da6b08$exports = {
+    "actions": `Dejanja`
+};
+
+
+var $91424dbafdc02f68$exports = {};
+$91424dbafdc02f68$exports = {
+    "actions": `Radnje`
+};
+
+
+var $23c23096b6c1b0fa$exports = {};
+$23c23096b6c1b0fa$exports = {
+    "actions": `Åtgärder`
+};
+
+
+var $d82875ae28963e58$exports = {};
+$d82875ae28963e58$exports = {
+    "actions": `Eylemler`
+};
+
+
+var $1dd153688f5574fc$exports = {};
+$1dd153688f5574fc$exports = {
+    "actions": `Дії`
+};
+
+
+var $6427307c9596258c$exports = {};
+$6427307c9596258c$exports = {
+    "actions": `操作`
+};
+
+
+var $18b85da2aafaaf3e$exports = {};
+$18b85da2aafaaf3e$exports = {
+    "actions": `動作`
+};
+
+
+$70cc9ce0ced2eb4a$exports = {
+    "ar-AE": $4f97095b36611c9c$exports,
+    "bg-BG": $d1606ced019b0a9e$exports,
+    "cs-CZ": $01e300f7d0078144$exports,
+    "da-DK": $f3862a5e5adf53a4$exports,
+    "de-DE": $74c0b6e11258b497$exports,
+    "el-GR": $54fc4e3090259431$exports,
+    "en-US": $edf02907a7caaf96$exports,
+    "es-ES": $b15ad3cf4b213b8e$exports,
+    "et-EE": $36cfda096c3db653$exports,
+    "fi-FI": $1a42e74299cab64d$exports,
+    "fr-FR": $dd8d3f41a5bfc373$exports,
+    "he-IL": $35d68da324c3ed3e$exports,
+    "hr-HR": $92746ce1284cd29f$exports,
+    "hu-HU": $570956f4f59f34b9$exports,
+    "it-IT": $f680d16d6f0d92d8$exports,
+    "ja-JP": $d28c56f33dc08452$exports,
+    "ko-KR": $fc6f973338bd2d9c$exports,
+    "lt-LT": $8664f3f6a18cfaa6$exports,
+    "lv-LV": $bd6e0fb18b482534$exports,
+    "nb-NO": $3df66303c61fb25b$exports,
+    "nl-NL": $0f533b61cdf70176$exports,
+    "pl-PL": $03a6cd8f61b18787$exports,
+    "pt-BR": $c726a9d931f60c66$exports,
+    "pt-PT": $ae9982f17f7235eb$exports,
+    "ro-RO": $c756723b814c63fa$exports,
+    "ru-RU": $1601284ef6ec0730$exports,
+    "sk-SK": $0388aac8e3bc5b59$exports,
+    "sl-SI": $247d9c4a71da6b08$exports,
+    "sr-SP": $91424dbafdc02f68$exports,
+    "sv-SE": $23c23096b6c1b0fa$exports,
+    "tr-TR": $d82875ae28963e58$exports,
+    "uk-UA": $1dd153688f5574fc$exports,
+    "zh-CN": $6427307c9596258c$exports,
+    "zh-TW": $18b85da2aafaaf3e$exports
+};
+
+
+
+
 var $c033a7c057e84ef1$exports = {};
 
 $parcel$export($c033a7c057e84ef1$exports, "spectrum-Tags-item", () => $c033a7c057e84ef1$export$950d8dc0a3751654, (v) => $c033a7c057e84ef1$export$950d8dc0a3751654 = v);
@@ -51,6 +301,8 @@ $parcel$export($c033a7c057e84ef1$exports, "spectrum-Tag-cell", () => $c033a7c057
 $parcel$export($c033a7c057e84ef1$exports, "spectrum-Tag-icon", () => $c033a7c057e84ef1$export$21f5254139e14871, (v) => $c033a7c057e84ef1$export$21f5254139e14871 = v);
 $parcel$export($c033a7c057e84ef1$exports, "spectrum-Tag-content", () => $c033a7c057e84ef1$export$d281c967f4ee071e, (v) => $c033a7c057e84ef1$export$d281c967f4ee071e = v);
 $parcel$export($c033a7c057e84ef1$exports, "is-removable", () => $c033a7c057e84ef1$export$52d72cb84c5fde5e, (v) => $c033a7c057e84ef1$export$52d72cb84c5fde5e = v);
+$parcel$export($c033a7c057e84ef1$exports, "spectrum-Tags-actions", () => $c033a7c057e84ef1$export$8afaa02110915bbb, (v) => $c033a7c057e84ef1$export$8afaa02110915bbb = v);
+$parcel$export($c033a7c057e84ef1$exports, "spectrum-Tags-actionButton", () => $c033a7c057e84ef1$export$e6882f8db018e3bd, (v) => $c033a7c057e84ef1$export$e6882f8db018e3bd = v);
 $parcel$export($c033a7c057e84ef1$exports, "is-hovered", () => $c033a7c057e84ef1$export$b8813cd5d7824ce7, (v) => $c033a7c057e84ef1$export$b8813cd5d7824ce7 = v);
 $parcel$export($c033a7c057e84ef1$exports, "is-selected", () => $c033a7c057e84ef1$export$1e0fb04f31d3c22a, (v) => $c033a7c057e84ef1$export$1e0fb04f31d3c22a = v);
 $parcel$export($c033a7c057e84ef1$exports, "is-invalid", () => $c033a7c057e84ef1$export$14a30de2866685fa, (v) => $c033a7c057e84ef1$export$14a30de2866685fa = v);
@@ -69,6 +321,8 @@ var $c033a7c057e84ef1$export$9c4fd4d7faada408;
 var $c033a7c057e84ef1$export$21f5254139e14871;
 var $c033a7c057e84ef1$export$d281c967f4ee071e;
 var $c033a7c057e84ef1$export$52d72cb84c5fde5e;
+var $c033a7c057e84ef1$export$8afaa02110915bbb;
+var $c033a7c057e84ef1$export$e6882f8db018e3bd;
 var $c033a7c057e84ef1$export$b8813cd5d7824ce7;
 var $c033a7c057e84ef1$export$1e0fb04f31d3c22a;
 var $c033a7c057e84ef1$export$14a30de2866685fa;
@@ -87,6 +341,8 @@ $c033a7c057e84ef1$export$9c4fd4d7faada408 = "spectrum-Tag-cell_8407eb";
 $c033a7c057e84ef1$export$21f5254139e14871 = "spectrum-Tag-icon_8407eb";
 $c033a7c057e84ef1$export$d281c967f4ee071e = "spectrum-Tag-content_8407eb";
 $c033a7c057e84ef1$export$52d72cb84c5fde5e = "is-removable_8407eb";
+$c033a7c057e84ef1$export$8afaa02110915bbb = "spectrum-Tags-actions_8407eb";
+$c033a7c057e84ef1$export$e6882f8db018e3bd = "spectrum-Tags-actionButton_8407eb";
 $c033a7c057e84ef1$export$b8813cd5d7824ce7 = "is-hovered_8407eb";
 $c033a7c057e84ef1$export$1e0fb04f31d3c22a = "is-selected_8407eb";
 $c033a7c057e84ef1$export$14a30de2866685fa = "is-invalid_8407eb";
@@ -175,28 +431,157 @@ function $b5f5ee35d3b6b95c$var$TagRemoveButton(props) {
 
 
 
+
 function $880d112c7a588209$var$TagGroup(props, ref) {
     props = (0, $fUaQ2$useProviderProps)(props);
-    let { allowsRemoving: allowsRemoving , onRemove: onRemove , ...otherProps } = props;
+    let { allowsRemoving: allowsRemoving , onRemove: onRemove , maxRows: maxRows , children: children , actionLabel: actionLabel , onAction: onAction , ...otherProps } = props;
     let domRef = (0, $fUaQ2$useDOMRef)(ref);
+    let containerRef = (0, $fUaQ2$useRef)(null);
     let { styleProps: styleProps  } = (0, $fUaQ2$useStyleProps)(otherProps);
+    let { direction: direction  } = (0, $fUaQ2$useLocale)();
+    let stringFormatter = (0, $fUaQ2$useLocalizedStringFormatter)((0, (/*@__PURE__*/$parcel$interopDefault($70cc9ce0ced2eb4a$exports))));
+    let [isCollapsed, setIsCollapsed] = (0, $fUaQ2$useState)(maxRows != null);
     let state = (0, $fUaQ2$useTagGroupState)(props);
-    let { tagGroupProps: tagGroupProps  } = (0, $fUaQ2$useTagGroup)(props, state, domRef);
-    return /*#__PURE__*/ (0, $fUaQ2$react).createElement("div", {
-        ...(0, $fUaQ2$mergeProps)(styleProps, tagGroupProps),
-        className: (0, $fUaQ2$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($c033a7c057e84ef1$exports))), "spectrum-Tags", styleProps.className),
-        role: state.collection.size ? "grid" : null,
-        ref: domRef
+    let [tagState, setTagState] = (0, $fUaQ2$useValueEffect)({
+        visibleTagCount: state.collection.size,
+        showCollapseButton: false
+    });
+    let keyboardDelegate = (0, $fUaQ2$useMemo)(()=>isCollapsed ? new (0, $fUaQ2$TagKeyboardDelegate)(new (0, $fUaQ2$ListCollection)([
+            ...state.collection
+        ].slice(0, tagState.visibleTagCount)), direction) : new (0, $fUaQ2$TagKeyboardDelegate)(new (0, $fUaQ2$ListCollection)([
+            ...state.collection
+        ]), direction), [
+        direction,
+        isCollapsed,
+        state.collection,
+        tagState.visibleTagCount
+    ]);
+    // Remove onAction from props so it doesn't make it into useGridList.
+    delete props.onAction;
+    let { tagGroupProps: tagGroupProps  } = (0, $fUaQ2$useTagGroup)({
+        ...props,
+        keyboardDelegate: keyboardDelegate
+    }, state, domRef);
+    let actionsId = (0, $fUaQ2$useId)();
+    let updateVisibleTagCount = (0, $fUaQ2$useCallback)(()=>{
+        if (maxRows > 0) {
+            let computeVisibleTagCount = ()=>{
+                var _tags_;
+                // Refs can be null at runtime.
+                let currDomRef = domRef.current;
+                let currContainerRef = containerRef.current;
+                if (!currDomRef || !currContainerRef) return;
+                let tags = [
+                    ...currDomRef.children
+                ];
+                let buttons = [
+                    ...currContainerRef.parentElement.querySelectorAll("button")
+                ];
+                let currY = -Infinity;
+                let rowCount = 0;
+                let index = 0;
+                let tagWidths = [];
+                // Count rows and show tags until we hit the maxRows.
+                for (let tag of tags){
+                    let { width: width , y: y  } = tag.getBoundingClientRect();
+                    if (y !== currY) {
+                        currY = y;
+                        rowCount++;
+                    }
+                    if (rowCount > maxRows) break;
+                    tagWidths.push(width);
+                    index++;
+                }
+                // Remove tags until there is space for the collapse button and action button (if present) on the last row.
+                let buttonsWidth = buttons.reduce((acc, curr)=>acc += curr.getBoundingClientRect().width, 0);
+                let end = direction === "ltr" ? "right" : "left";
+                let containerEnd = currContainerRef.getBoundingClientRect()[end];
+                let lastTagEnd = (_tags_ = tags[index - 1]) === null || _tags_ === void 0 ? void 0 : _tags_.getBoundingClientRect()[end];
+                let availableWidth = containerEnd - lastTagEnd;
+                for (let tagWidth of tagWidths.reverse()){
+                    if (availableWidth >= buttonsWidth || index <= 1 || index >= state.collection.size) break;
+                    availableWidth += tagWidth;
+                    index--;
+                }
+                return {
+                    visibleTagCount: index,
+                    showCollapseButton: index < state.collection.size
+                };
+            };
+            setTagState(function*() {
+                // Update to show all items.
+                yield {
+                    visibleTagCount: state.collection.size,
+                    showCollapseButton: true
+                };
+                // Measure, and update to show the items until maxRows is reached.
+                yield computeVisibleTagCount();
+            });
+        }
     }, [
+        maxRows,
+        setTagState,
+        domRef,
+        direction,
+        state.collection.size
+    ]);
+    (0, $fUaQ2$useResizeObserver)({
+        ref: containerRef,
+        onResize: updateVisibleTagCount
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    (0, $fUaQ2$useLayoutEffect)(updateVisibleTagCount, [
+        children
+    ]);
+    (0, $fUaQ2$useEffect)(()=>{
+        var // Recalculate visible tags when fonts are loaded.
+        _document_fonts;
+        (_document_fonts = document.fonts) === null || _document_fonts === void 0 ? void 0 : _document_fonts.ready.then(()=>updateVisibleTagCount());
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    let visibleTags = [
         ...state.collection
-    ].map((item)=>/*#__PURE__*/ (0, $fUaQ2$react).createElement((0, $b5f5ee35d3b6b95c$export$3288d34c523a1192), {
+    ];
+    if (maxRows != null && isCollapsed) visibleTags = visibleTags.slice(0, tagState.visibleTagCount);
+    let handlePressCollapse = ()=>{
+        // Prevents button from losing focus if focusedKey got collapsed.
+        state.selectionManager.setFocusedKey(null);
+        setIsCollapsed((prevCollapsed)=>!prevCollapsed);
+    };
+    let showActions = tagState.showCollapseButton || actionLabel && onAction;
+    return /*#__PURE__*/ (0, $fUaQ2$react).createElement((0, $fUaQ2$FocusScope), null, /*#__PURE__*/ (0, $fUaQ2$react).createElement("div", {
+        ref: containerRef,
+        ...styleProps,
+        className: (0, $fUaQ2$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($c033a7c057e84ef1$exports))), "spectrum-Tags-container", styleProps.className)
+    }, /*#__PURE__*/ (0, $fUaQ2$react).createElement("div", {
+        ...tagGroupProps,
+        className: (0, $fUaQ2$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($c033a7c057e84ef1$exports))), "spectrum-Tags"),
+        role: state.collection.size ? "grid" : null,
+        ref: domRef
+    }, visibleTags.map((item)=>/*#__PURE__*/ (0, $fUaQ2$react).createElement((0, $b5f5ee35d3b6b95c$export$3288d34c523a1192), {
             ...item.props,
             key: item.key,
             item: item,
             state: state,
             allowsRemoving: allowsRemoving,
             onRemove: onRemove
-        }, item.rendered)));
+        }, item.rendered))), showActions && /*#__PURE__*/ (0, $fUaQ2$react).createElement("div", {
+        role: "group",
+        id: actionsId,
+        "aria-label": stringFormatter.format("actions"),
+        "aria-labelledby": `${tagGroupProps.id} ${actionsId}`,
+        className: (0, $fUaQ2$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($c033a7c057e84ef1$exports))), "spectrum-Tags-actions")
+    }, tagState.showCollapseButton && /*#__PURE__*/ (0, $fUaQ2$react).createElement((0, $fUaQ2$ActionButton), {
+        isQuiet: true,
+        onPress: handlePressCollapse,
+        UNSAFE_className: (0, $fUaQ2$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($c033a7c057e84ef1$exports))), "spectrum-Tags-actionButton")
+    }, isCollapsed ? stringFormatter.format("showAllButtonLabel", {
+        tagCount: state.collection.size
+    }) : stringFormatter.format("hideButtonLabel")), actionLabel && onAction && /*#__PURE__*/ (0, $fUaQ2$react).createElement((0, $fUaQ2$ActionButton), {
+        isQuiet: true,
+        onPress: onAction,
+        UNSAFE_className: (0, $fUaQ2$classNames)((0, (/*@__PURE__*/$parcel$interopDefault($c033a7c057e84ef1$exports))), "spectrum-Tags-actionButton")
+    }, actionLabel))));
 }
 /** Tags allow users to categorize content. They can represent keywords or people, and are grouped to describe an item or a search request. */ const $880d112c7a588209$export$67ea30858aaf75e3 = /*#__PURE__*/ (0, $fUaQ2$react).forwardRef($880d112c7a588209$var$TagGroup);
 

package/dist/module.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/tag/src/index.ts","packages/@react-spectrum/tag/src/TagGroup.tsx","packages/@adobe/spectrum-css-temp/components/tags/vars.css","packages/@react-spectrum/tag/src/Tag.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport {TagGroup} from './TagGroup';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumTagGroupProps} from '@react-types/tag';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef} from '@react-types/shared';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {ReactElement} from 'react';\nimport {SpectrumTagGroupProps} from '@react-types/tag';\nimport styles from '@adobe/spectrum-css-temp/components/tags/vars.css';\nimport {Tag} from './Tag';\nimport {useProviderProps} from '@react-spectrum/provider';\nimport {useTagGroup} from '@react-aria/tag';\nimport {useTagGroupState} from '@react-stately/tag';\n\nfunction TagGroup<T extends object>(props: SpectrumTagGroupProps<T>, ref: DOMRef<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let {\n    allowsRemoving,\n    onRemove,\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n  let {styleProps} = useStyleProps(otherProps);\n  let state = useTagGroupState(props);\n  let {tagGroupProps} = useTagGroup(props, state, domRef);\n  return (\n    <div\n      {...mergeProps(styleProps, tagGroupProps)}\n      className={\n        classNames(\n          styles,\n          'spectrum-Tags',\n          styleProps.className\n        )\n      }\n      role={state.collection.size ? 'grid' : null}\n      ref={domRef}>\n      {[...state.collection].map(item => (\n        <Tag\n          {...item.props}\n          key={item.key}\n          item={item}\n          state={state}\n          allowsRemoving={allowsRemoving}\n          onRemove={onRemove}>\n          {item.rendered}\n        </Tag>\n      ))}\n    </div>\n  );\n}\n\n/** Tags allow users to categorize content. They can represent keywords or people, and are grouped to describe an item or a search request. */\nconst _TagGroup = React.forwardRef(TagGroup) as <T>(props: SpectrumTagGroupProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_TagGroup as TagGroup};\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {classNames, ClearSlots, SlotProvider, useStyleProps} from '@react-spectrum/utils';\nimport {ClearButton} from '@react-spectrum/button';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {useRef} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/tags/vars.css';\nimport type {TagGroupState} from '@react-stately/tag';\nimport {TagProps} from '@react-types/tag';\nimport {Text} from '@react-spectrum/text';\nimport {useFocusRing} from '@react-aria/focus';\nimport {useHover} from '@react-aria/interactions';\nimport {useTag} from '@react-aria/tag';\n\nexport interface SpectrumTagProps<T> extends TagProps<T> {\n  state: TagGroupState<T>\n}\n\nexport function Tag<T>(props: SpectrumTagProps<T>) {\n  const {\n    children,\n    allowsRemoving,\n    item,\n    state,\n    onRemove,\n    ...otherProps\n  } = props;\n\n  // @ts-ignore\n  let {styleProps} = useStyleProps(otherProps);\n  let {hoverProps, isHovered} = useHover({});\n  let {isFocused, isFocusVisible, focusProps} = useFocusRing({within: true});\n  let tagRowRef = useRef();\n  let {clearButtonProps, labelProps, tagProps, tagRowProps} = useTag({\n    ...props,\n    isFocused,\n    allowsRemoving,\n    item,\n    onRemove,\n    tagRowRef\n  }, state);\n\n  return (\n    <div\n      {...mergeProps(tagRowProps, hoverProps, focusProps)}\n      className={classNames(\n          styles,\n          'spectrum-Tags-item',\n        {\n          'focus-ring': isFocusVisible,\n          'is-focused': isFocused,\n          'is-hovered': isHovered,\n          'is-removable': allowsRemoving\n        },\n          styleProps.className\n        )}\n      ref={tagRowRef}>\n      <div\n        className={classNames(styles, 'spectrum-Tag-cell')}\n        {...tagProps}>\n        <SlotProvider\n          slots={{\n            icon: {UNSAFE_className: classNames(styles, 'spectrum-Tag-icon'), size: 'XS'},\n            text: {UNSAFE_className: classNames(styles, 'spectrum-Tag-content'), ...labelProps}\n          }}>\n          {typeof children === 'string' ? <Text>{children}</Text> : children}\n          <ClearSlots>\n            {allowsRemoving && <TagRemoveButton item={item} {...clearButtonProps} UNSAFE_className={classNames(styles, 'spectrum-Tag-action')} />}\n          </ClearSlots>\n        </SlotProvider>\n      </div>\n    </div>\n  );\n}\n\nfunction TagRemoveButton(props) {\n  let {styleProps} = useStyleProps(props);\n\n  return (\n    <span\n      {...styleProps}>\n      <ClearButton\n        preventFocus\n        {...props} />\n    </span>\n  );\n}\n"],"names":[],"version":3,"file":"module.js.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/tag/src/index.ts","packages/@react-spectrum/tag/src/TagGroup.tsx","packages/@react-spectrum/tag/intl/*.js","packages/@react-spectrum/tag/intl/ar-AE.json","packages/@react-spectrum/tag/intl/bg-BG.json","packages/@react-spectrum/tag/intl/cs-CZ.json","packages/@react-spectrum/tag/intl/da-DK.json","packages/@react-spectrum/tag/intl/de-DE.json","packages/@react-spectrum/tag/intl/el-GR.json","packages/@react-spectrum/tag/intl/en-US.json","packages/@react-spectrum/tag/intl/es-ES.json","packages/@react-spectrum/tag/intl/et-EE.json","packages/@react-spectrum/tag/intl/fi-FI.json","packages/@react-spectrum/tag/intl/fr-FR.json","packages/@react-spectrum/tag/intl/he-IL.json","packages/@react-spectrum/tag/intl/hr-HR.json","packages/@react-spectrum/tag/intl/hu-HU.json","packages/@react-spectrum/tag/intl/it-IT.json","packages/@react-spectrum/tag/intl/ja-JP.json","packages/@react-spectrum/tag/intl/ko-KR.json","packages/@react-spectrum/tag/intl/lt-LT.json","packages/@react-spectrum/tag/intl/lv-LV.json","packages/@react-spectrum/tag/intl/nb-NO.json","packages/@react-spectrum/tag/intl/nl-NL.json","packages/@react-spectrum/tag/intl/pl-PL.json","packages/@react-spectrum/tag/intl/pt-BR.json","packages/@react-spectrum/tag/intl/pt-PT.json","packages/@react-spectrum/tag/intl/ro-RO.json","packages/@react-spectrum/tag/intl/ru-RU.json","packages/@react-spectrum/tag/intl/sk-SK.json","packages/@react-spectrum/tag/intl/sl-SI.json","packages/@react-spectrum/tag/intl/sr-SP.json","packages/@react-spectrum/tag/intl/sv-SE.json","packages/@react-spectrum/tag/intl/tr-TR.json","packages/@react-spectrum/tag/intl/uk-UA.json","packages/@react-spectrum/tag/intl/zh-CN.json","packages/@react-spectrum/tag/intl/zh-TW.json","packages/@adobe/spectrum-css-temp/components/tags/vars.css","packages/@react-spectrum/tag/src/Tag.tsx"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport {TagGroup} from './TagGroup';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumTagGroupProps} from './TagGroup';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButton} from '@react-spectrum/button';\nimport {AriaTagGroupProps, TagKeyboardDelegate, useTagGroup} from '@react-aria/tag';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport {DOMRef, StyleProps} from '@react-types/shared';\nimport {FocusScope} from '@react-aria/focus';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListCollection} from '@react-stately/list';\nimport React, {ReactElement, useCallback, useEffect, useMemo, useRef, useState} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/tags/vars.css';\nimport {Tag} from './Tag';\nimport {useId, useLayoutEffect, useResizeObserver, useValueEffect} from '@react-aria/utils';\nimport {useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProviderProps} from '@react-spectrum/provider';\nimport {useTagGroupState} from '@react-stately/tag';\n\nexport interface SpectrumTagGroupProps<T> extends AriaTagGroupProps<T>, StyleProps {\n  /** The label to display on the action button.  */\n  actionLabel?: string,\n  /** Handler that is called when the action button is pressed. */\n  onAction?: () => void\n}\n\nfunction TagGroup<T extends object>(props: SpectrumTagGroupProps<T>, ref: DOMRef<HTMLDivElement>) {\n  props = useProviderProps(props);\n  let {\n    allowsRemoving,\n    onRemove,\n    maxRows,\n    children,\n    actionLabel,\n    onAction,\n    ...otherProps\n  } = props;\n  let domRef = useDOMRef(ref);\n  let containerRef = useRef(null);\n  let {styleProps} = useStyleProps(otherProps);\n  let {direction} = useLocale();\n  let stringFormatter = useLocalizedStringFormatter(intlMessages);\n  let [isCollapsed, setIsCollapsed] = useState(maxRows != null);\n  let state = useTagGroupState(props);\n  let [tagState, setTagState] = useValueEffect({visibleTagCount: state.collection.size, showCollapseButton: false});\n  let keyboardDelegate = useMemo(() => (\n    isCollapsed\n      ? new TagKeyboardDelegate(new ListCollection([...state.collection].slice(0, tagState.visibleTagCount)), direction)\n      : new TagKeyboardDelegate(new ListCollection([...state.collection]), direction)\n  ), [direction, isCollapsed, state.collection, tagState.visibleTagCount]) as TagKeyboardDelegate<T>;\n  // Remove onAction from props so it doesn't make it into useGridList.\n  delete props.onAction;\n  let {tagGroupProps} = useTagGroup({...props, keyboardDelegate}, state, domRef);\n  let actionsId = useId();\n\n  let updateVisibleTagCount = useCallback(() => {\n    if (maxRows > 0) {\n      let computeVisibleTagCount = () => {\n        // Refs can be null at runtime.\n        let currDomRef: HTMLDivElement | null = domRef.current;\n        let currContainerRef: HTMLDivElement | null = containerRef.current; \n        if (!currDomRef || !currContainerRef) {\n          return;\n        }\n\n        let tags = [...currDomRef.children];\n        let buttons = [...currContainerRef.parentElement.querySelectorAll('button')];\n        let currY = -Infinity;\n        let rowCount = 0;\n        let index = 0;\n        let tagWidths = [];\n        // Count rows and show tags until we hit the maxRows.\n        for (let tag of tags) {\n          let {width, y} = tag.getBoundingClientRect();\n\n          if (y !== currY) {\n            currY = y;\n            rowCount++;\n          }\n\n          if (rowCount > maxRows) {\n            break;\n          }\n          tagWidths.push(width);\n          index++;\n        }\n\n        // Remove tags until there is space for the collapse button and action button (if present) on the last row.\n        let buttonsWidth = buttons.reduce((acc, curr) => acc += curr.getBoundingClientRect().width, 0);\n        let end = direction === 'ltr' ? 'right' : 'left';\n        let containerEnd = currContainerRef.getBoundingClientRect()[end];\n        let lastTagEnd = tags[index - 1]?.getBoundingClientRect()[end];\n        let availableWidth = containerEnd - lastTagEnd;\n        for (let tagWidth of tagWidths.reverse()) {\n          if (availableWidth >= buttonsWidth || index <= 1 || index >= state.collection.size) {\n            break;\n          }\n          availableWidth += tagWidth;\n          index--;\n        }\n        return {visibleTagCount: index, showCollapseButton: index < state.collection.size};\n      };\n    \n      setTagState(function *() {\n        // Update to show all items.\n        yield {visibleTagCount: state.collection.size, showCollapseButton: true};\n\n        // Measure, and update to show the items until maxRows is reached.\n        yield computeVisibleTagCount();\n      });\n    }\n  }, [maxRows, setTagState, domRef, direction, state.collection.size]);\n\n  useResizeObserver({ref: containerRef, onResize: updateVisibleTagCount});\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useLayoutEffect(updateVisibleTagCount, [children]);\n\n  useEffect(() => {\n    // Recalculate visible tags when fonts are loaded.\n    document.fonts?.ready.then(() => updateVisibleTagCount());\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  let visibleTags = [...state.collection];\n  if (maxRows != null && isCollapsed) {\n    visibleTags = visibleTags.slice(0, tagState.visibleTagCount);\n  }\n\n  let handlePressCollapse = () => {\n    // Prevents button from losing focus if focusedKey got collapsed.\n    state.selectionManager.setFocusedKey(null);\n    setIsCollapsed(prevCollapsed => !prevCollapsed);\n  };\n\n  let showActions = tagState.showCollapseButton || (actionLabel && onAction);\n\n  return (\n    <FocusScope>\n      <div\n        ref={containerRef}\n        {...styleProps}\n        className={classNames(styles, 'spectrum-Tags-container', styleProps.className)}>\n        <div\n          {...tagGroupProps}\n          className={classNames(styles, 'spectrum-Tags')}\n          role={state.collection.size ? 'grid' : null}\n          ref={domRef}>\n          {visibleTags.map(item => (\n            <Tag\n              {...item.props}\n              key={item.key}\n              item={item}\n              state={state}\n              allowsRemoving={allowsRemoving}\n              onRemove={onRemove}>\n              {item.rendered}\n            </Tag>\n          ))}\n        </div>\n        {showActions &&\n          <div\n            role=\"group\"\n            id={actionsId}\n            aria-label={stringFormatter.format('actions')}\n            aria-labelledby={`${tagGroupProps.id} ${actionsId}`}\n            className={classNames(styles, 'spectrum-Tags-actions')}>\n            {tagState.showCollapseButton &&\n              <ActionButton\n                isQuiet\n                onPress={handlePressCollapse}\n                UNSAFE_className={classNames(styles, 'spectrum-Tags-actionButton')}>\n                {isCollapsed ?\n                  stringFormatter.format('showAllButtonLabel', {tagCount: state.collection.size}) :\n                  stringFormatter.format('hideButtonLabel')\n                }\n              </ActionButton>\n            }\n            {actionLabel && onAction &&\n              <ActionButton\n                isQuiet\n                onPress={onAction}\n                UNSAFE_className={classNames(styles, 'spectrum-Tags-actionButton')}>\n                {actionLabel}\n              </ActionButton>\n            }\n          </div>\n        }\n      </div>\n    </FocusScope>\n  );\n}\n\n/** Tags allow users to categorize content. They can represent keywords or people, and are grouped to describe an item or a search request. */\nconst _TagGroup = React.forwardRef(TagGroup) as <T>(props: SpectrumTagGroupProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_TagGroup as TagGroup};\n","const _temp0 = require(\"./ar-AE.json\");\nconst _temp1 = require(\"./bg-BG.json\");\nconst _temp2 = require(\"./cs-CZ.json\");\nconst _temp3 = require(\"./da-DK.json\");\nconst _temp4 = require(\"./de-DE.json\");\nconst _temp5 = require(\"./el-GR.json\");\nconst _temp6 = require(\"./en-US.json\");\nconst _temp7 = require(\"./es-ES.json\");\nconst _temp8 = require(\"./et-EE.json\");\nconst _temp9 = require(\"./fi-FI.json\");\nconst _temp10 = require(\"./fr-FR.json\");\nconst _temp11 = require(\"./he-IL.json\");\nconst _temp12 = require(\"./hr-HR.json\");\nconst _temp13 = require(\"./hu-HU.json\");\nconst _temp14 = require(\"./it-IT.json\");\nconst _temp15 = require(\"./ja-JP.json\");\nconst _temp16 = require(\"./ko-KR.json\");\nconst _temp17 = require(\"./lt-LT.json\");\nconst _temp18 = require(\"./lv-LV.json\");\nconst _temp19 = require(\"./nb-NO.json\");\nconst _temp20 = require(\"./nl-NL.json\");\nconst _temp21 = require(\"./pl-PL.json\");\nconst _temp22 = require(\"./pt-BR.json\");\nconst _temp23 = require(\"./pt-PT.json\");\nconst _temp24 = require(\"./ro-RO.json\");\nconst _temp25 = require(\"./ru-RU.json\");\nconst _temp26 = require(\"./sk-SK.json\");\nconst _temp27 = require(\"./sl-SI.json\");\nconst _temp28 = require(\"./sr-SP.json\");\nconst _temp29 = require(\"./sv-SE.json\");\nconst _temp30 = require(\"./tr-TR.json\");\nconst _temp31 = require(\"./uk-UA.json\");\nconst _temp32 = require(\"./zh-CN.json\");\nconst _temp33 = require(\"./zh-TW.json\");\nmodule.exports = {\n  \"ar-AE\": _temp0,\n  \"bg-BG\": _temp1,\n  \"cs-CZ\": _temp2,\n  \"da-DK\": _temp3,\n  \"de-DE\": _temp4,\n  \"el-GR\": _temp5,\n  \"en-US\": _temp6,\n  \"es-ES\": _temp7,\n  \"et-EE\": _temp8,\n  \"fi-FI\": _temp9,\n  \"fr-FR\": _temp10,\n  \"he-IL\": _temp11,\n  \"hr-HR\": _temp12,\n  \"hu-HU\": _temp13,\n  \"it-IT\": _temp14,\n  \"ja-JP\": _temp15,\n  \"ko-KR\": _temp16,\n  \"lt-LT\": _temp17,\n  \"lv-LV\": _temp18,\n  \"nb-NO\": _temp19,\n  \"nl-NL\": _temp20,\n  \"pl-PL\": _temp21,\n  \"pt-BR\": _temp22,\n  \"pt-PT\": _temp23,\n  \"ro-RO\": _temp24,\n  \"ru-RU\": _temp25,\n  \"sk-SK\": _temp26,\n  \"sl-SI\": _temp27,\n  \"sr-SP\": _temp28,\n  \"sv-SE\": _temp29,\n  \"tr-TR\": _temp30,\n  \"uk-UA\": _temp31,\n  \"zh-CN\": _temp32,\n  \"zh-TW\": _temp33\n}","{\n  \"actions\": \"الإجراءات\"\n}\n","{\n  \"actions\": \"Действия\"\n}\n","{\n  \"actions\": \"Akce\"\n}\n","{\n  \"actions\": \"Handlinger\"\n}\n","{\n  \"actions\": \"Aktionen\"\n}\n","{\n  \"actions\": \"Ενέργειες\"\n}\n","{\n  \"showAllButtonLabel\": \"Show all ({tagCount})\",\n  \"hideButtonLabel\": \"Show less\",\n  \"actions\": \"Actions\"\n}","{\n  \"actions\": \"Acciones\"\n}\n","{\n  \"actions\": \"Toimingud\"\n}\n","{\n  \"actions\": \"Toiminnot\"\n}\n","{\n  \"actions\": \"Actions\"\n}\n","{\n  \"actions\": \"פעולות\"\n}\n","{\n  \"actions\": \"Radnje\"\n}\n","{\n  \"actions\": \"Műveletek\"\n}\n","{\n  \"actions\": \"Azioni\"\n}\n","{\n  \"actions\": \"アクション\"\n}\n","{\n  \"actions\": \"액션\"\n}\n","{\n  \"actions\": \"Veiksmai\"\n}\n","{\n  \"actions\": \"Darbības\"\n}\n","{\n  \"actions\": \"Handlinger\"\n}\n","{\n  \"actions\": \"Acties\"\n}\n","{\n  \"actions\": \"Działania\"\n}\n","{\n  \"actions\": \"Ações\"\n}\n","{\n  \"actions\": \"Ações\"\n}\n","{\n  \"actions\": \"Acțiuni\"\n}\n","{\n  \"actions\": \"Действия\"\n}\n","{\n  \"actions\": \"Akcie\"\n}\n","{\n  \"actions\": \"Dejanja\"\n}\n","{\n  \"actions\": \"Radnje\"\n}\n","{\n  \"actions\": \"Åtgärder\"\n}\n","{\n  \"actions\": \"Eylemler\"\n}\n","{\n  \"actions\": \"Дії\"\n}\n","{\n  \"actions\": \"操作\"\n}\n","{\n  \"actions\": \"動作\"\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {classNames, ClearSlots, SlotProvider, useStyleProps} from '@react-spectrum/utils';\nimport {ClearButton} from '@react-spectrum/button';\nimport {mergeProps} from '@react-aria/utils';\nimport React, {useRef} from 'react';\nimport styles from '@adobe/spectrum-css-temp/components/tags/vars.css';\nimport type {TagGroupState} from '@react-stately/tag';\nimport {TagProps} from '@react-types/tag';\nimport {Text} from '@react-spectrum/text';\nimport {useFocusRing} from '@react-aria/focus';\nimport {useHover} from '@react-aria/interactions';\nimport {useTag} from '@react-aria/tag';\n\nexport interface SpectrumTagProps<T> extends TagProps<T> {\n  state: TagGroupState<T>\n}\n\nexport function Tag<T>(props: SpectrumTagProps<T>) {\n  const {\n    children,\n    allowsRemoving,\n    item,\n    state,\n    onRemove,\n    ...otherProps\n  } = props;\n\n  // @ts-ignore\n  let {styleProps} = useStyleProps(otherProps);\n  let {hoverProps, isHovered} = useHover({});\n  let {isFocused, isFocusVisible, focusProps} = useFocusRing({within: true});\n  let tagRowRef = useRef();\n  let {clearButtonProps, labelProps, tagProps, tagRowProps} = useTag({\n    ...props,\n    isFocused,\n    allowsRemoving,\n    item,\n    onRemove,\n    tagRowRef\n  }, state);\n\n  return (\n    <div\n      {...mergeProps(tagRowProps, hoverProps, focusProps)}\n      className={classNames(\n          styles,\n          'spectrum-Tags-item',\n        {\n          'focus-ring': isFocusVisible,\n          'is-focused': isFocused,\n          'is-hovered': isHovered,\n          'is-removable': allowsRemoving\n        },\n          styleProps.className\n        )}\n      ref={tagRowRef}>\n      <div\n        className={classNames(styles, 'spectrum-Tag-cell')}\n        {...tagProps}>\n        <SlotProvider\n          slots={{\n            icon: {UNSAFE_className: classNames(styles, 'spectrum-Tag-icon'), size: 'XS'},\n            text: {UNSAFE_className: classNames(styles, 'spectrum-Tag-content'), ...labelProps}\n          }}>\n          {typeof children === 'string' ? <Text>{children}</Text> : children}\n          <ClearSlots>\n            {allowsRemoving && <TagRemoveButton item={item} {...clearButtonProps} UNSAFE_className={classNames(styles, 'spectrum-Tag-action')} />}\n          </ClearSlots>\n        </SlotProvider>\n      </div>\n    </div>\n  );\n}\n\nfunction TagRemoveButton(props) {\n  let {styleProps} = useStyleProps(props);\n\n  return (\n    <span\n      {...styleProps}>\n      <ClearButton\n        preventFocus\n        {...props} />\n    </span>\n  );\n}\n"],"names":[],"version":3,"file":"module.js.map"}

package/dist/types.d.ts

@@ -1,11 +1,16 @@
-import { DOMRef } from "@react-types/shared";
+import { AriaTagGroupProps } from "@react-aria/tag";
+import { DOMRef, StyleProps } from "@react-types/shared";
 import { ReactElement } from "react";
-import { SpectrumTagGroupProps } from "@react-types/tag";
+export interface SpectrumTagGroupProps<T> extends AriaTagGroupProps<T>, StyleProps {
+    /** The label to display on the action button.  */
+    actionLabel?: string;
+    /** Handler that is called when the action button is pressed. */
+    onAction?: () => void;
+}
 /** Tags allow users to categorize content. They can represent keywords or people, and are grouped to describe an item or a search request. */
 export const TagGroup: <T>(props: SpectrumTagGroupProps<T> & {
     ref?: DOMRef<HTMLDivElement>;
 }) => ReactElement;
 export { Item } from '@react-stately/collections';
-export type { SpectrumTagGroupProps } from '@react-types/tag';
 
 //# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"mappings":";;;AC6DA,8IAA8I;AAC9I,OAAA,MAAM;UAAuF,OAAO,cAAc,CAAC;MAAM,YAAY,CAAC;ACjDtI,OAAO,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAChD,YAAY,EAAC,qBAAqB,EAAC,MAAM,kBAAkB,CAAC","sources":["packages/@react-spectrum/tag/src/packages/@react-spectrum/tag/src/Tag.tsx","packages/@react-spectrum/tag/src/packages/@react-spectrum/tag/src/TagGroup.tsx","packages/@react-spectrum/tag/src/packages/@react-spectrum/tag/src/index.ts","packages/@react-spectrum/tag/src/index.ts"],"sourcesContent":[null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport {TagGroup} from './TagGroup';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumTagGroupProps} from '@react-types/tag';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
+{"mappings":";;;AC4BA,uCAAuC,CAAC,CAAE,SAAQ,kBAAkB,CAAC,CAAC,EAAE,UAAU;IAChF,kDAAkD;IAClD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gEAAgE;IAChE,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CACtB;AAyKD,8IAA8I;AAC9I,OAAA,MAAM;UAAuF,OAAO,cAAc,CAAC;MAAM,YAAY,CAAC;AC9LtI,OAAO,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC","sources":["packages/@react-spectrum/tag/src/packages/@react-spectrum/tag/src/Tag.tsx","packages/@react-spectrum/tag/src/packages/@react-spectrum/tag/src/TagGroup.tsx","packages/@react-spectrum/tag/src/packages/@react-spectrum/tag/src/index.ts","packages/@react-spectrum/tag/src/index.ts"],"sourcesContent":[null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport {TagGroup} from './TagGroup';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumTagGroupProps} from './TagGroup';\n"],"names":[],"version":3,"file":"types.d.ts.map"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-spectrum/tag",
-  "version": "3.0.0-nightly.1933+080488a85",
+  "version": "3.0.0-nightly.1954+ff3e690ff",
   "description": "Spectrum UI components in React",
   "license": "Apache-2.0",
   "main": "dist/main.js",
@@ -31,21 +31,23 @@
     "url": "https://github.com/adobe/react-spectrum"
   },
   "dependencies": {
-    "@react-aria/focus": "3.0.0-nightly.1933+080488a85",
-    "@react-aria/interactions": "3.0.0-nightly.1933+080488a85",
-    "@react-aria/tag": "3.0.0-nightly.1933+080488a85",
-    "@react-aria/utils": "3.0.0-nightly.1933+080488a85",
-    "@react-spectrum/button": "3.0.0-nightly.1933+080488a85",
-    "@react-spectrum/text": "3.3.5-nightly.3633+080488a85",
-    "@react-spectrum/utils": "3.0.0-nightly.1933+080488a85",
-    "@react-stately/collections": "3.0.0-nightly.1933+080488a85",
-    "@react-stately/tag": "3.0.0-nightly.3633+080488a85",
-    "@react-types/shared": "3.0.0-nightly.1933+080488a85",
-    "@react-types/tag": "3.0.0-nightly.1933+080488a85",
+    "@react-aria/focus": "3.0.0-nightly.1954+ff3e690ff",
+    "@react-aria/i18n": "3.0.0-nightly.1954+ff3e690ff",
+    "@react-aria/interactions": "3.0.0-nightly.1954+ff3e690ff",
+    "@react-aria/tag": "3.0.0-nightly.1954+ff3e690ff",
+    "@react-aria/utils": "3.0.0-nightly.1954+ff3e690ff",
+    "@react-spectrum/button": "3.0.0-nightly.1954+ff3e690ff",
+    "@react-spectrum/text": "3.3.5-nightly.3654+ff3e690ff",
+    "@react-spectrum/utils": "3.0.0-nightly.1954+ff3e690ff",
+    "@react-stately/collections": "3.0.0-nightly.1954+ff3e690ff",
+    "@react-stately/list": "3.6.2-nightly.3654+ff3e690ff",
+    "@react-stately/tag": "3.0.0-nightly.3654+ff3e690ff",
+    "@react-types/shared": "3.0.0-nightly.1954+ff3e690ff",
+    "@react-types/tag": "3.0.0-nightly.1954+ff3e690ff",
     "@swc/helpers": "^0.4.14"
   },
   "devDependencies": {
-    "@adobe/spectrum-css-temp": "3.0.0-nightly.1933+080488a85"
+    "@adobe/spectrum-css-temp": "3.0.0-nightly.1954+ff3e690ff"
   },
   "peerDependencies": {
     "@react-spectrum/provider": "^3.0.0",
@@ -54,5 +56,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "080488a859be32a1ee30f4f9fdcc4d5e8331a144"
+  "gitHead": "ff3e690fffc6c54367b8057e28a0e5b9211f37b5"
 }