@wordpress/block-directory 5.45.1-next.v.202605131032.0 → 5.47.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -0
- package/build/components/downloadable-block-list-item/index.cjs +54 -40
- package/build/components/downloadable-block-list-item/index.cjs.map +2 -2
- package/build-module/components/downloadable-block-list-item/index.mjs +56 -42
- package/build-module/components/downloadable-block-list-item/index.mjs.map +2 -2
- package/package.json +24 -24
- package/src/components/downloadable-block-list-item/index.js +71 -62
package/CHANGELOG.md
CHANGED
|
@@ -98,47 +98,61 @@ function DownloadableBlockListItem({ item, onClick }) {
|
|
|
98
98
|
isInstalled,
|
|
99
99
|
isInstalling
|
|
100
100
|
});
|
|
101
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
event.preventDefault();
|
|
112
|
-
onClick();
|
|
113
|
-
},
|
|
114
|
-
"aria-label": itemLabel,
|
|
115
|
-
type: "button",
|
|
116
|
-
role: "option",
|
|
117
|
-
children: [
|
|
118
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "block-directory-downloadable-block-list-item__icon", children: [
|
|
119
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_downloadable_block_icon.default, { icon, title }),
|
|
120
|
-
isInstalling ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "block-directory-downloadable-block-list-item__spinner", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Spinner, {}) }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_block_ratings.default, { rating })
|
|
121
|
-
] }),
|
|
122
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "block-directory-downloadable-block-list-item__details", children: [
|
|
123
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "block-directory-downloadable-block-list-item__title", children: (0, import_element.createInterpolateElement)(
|
|
124
|
-
(0, import_i18n.sprintf)(
|
|
125
|
-
/* translators: 1: block title. 2: author name. */
|
|
126
|
-
(0, import_i18n.__)("%1$s <span>by %2$s</span>"),
|
|
127
|
-
(0, import_html_entities.decodeEntities)(title),
|
|
128
|
-
author
|
|
101
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ui.Tooltip.Root, { children: [
|
|
102
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
103
|
+
import_ui.Tooltip.Trigger,
|
|
104
|
+
{
|
|
105
|
+
render: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
106
|
+
import_components.Composite.Item,
|
|
107
|
+
{
|
|
108
|
+
className: (0, import_clsx.default)(
|
|
109
|
+
"block-directory-downloadable-block-list-item",
|
|
110
|
+
isInstalling && "is-installing"
|
|
129
111
|
),
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
112
|
+
accessibleWhenDisabled: true,
|
|
113
|
+
disabled: isInstalling || !isInstallable,
|
|
114
|
+
onClick: (event) => {
|
|
115
|
+
event.preventDefault();
|
|
116
|
+
onClick();
|
|
117
|
+
},
|
|
118
|
+
"aria-label": itemLabel,
|
|
119
|
+
type: "button",
|
|
120
|
+
role: "option",
|
|
121
|
+
children: [
|
|
122
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "block-directory-downloadable-block-list-item__icon", children: [
|
|
123
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
124
|
+
import_downloadable_block_icon.default,
|
|
125
|
+
{
|
|
126
|
+
icon,
|
|
127
|
+
title
|
|
128
|
+
}
|
|
129
|
+
),
|
|
130
|
+
isInstalling ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "block-directory-downloadable-block-list-item__spinner", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Spinner, {}) }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_block_ratings.default, { rating })
|
|
131
|
+
] }),
|
|
132
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "block-directory-downloadable-block-list-item__details", children: [
|
|
133
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "block-directory-downloadable-block-list-item__title", children: (0, import_element.createInterpolateElement)(
|
|
134
|
+
(0, import_i18n.sprintf)(
|
|
135
|
+
/* translators: 1: block title. 2: author name. */
|
|
136
|
+
(0, import_i18n.__)("%1$s <span>by %2$s</span>"),
|
|
137
|
+
(0, import_html_entities.decodeEntities)(title),
|
|
138
|
+
author
|
|
139
|
+
),
|
|
140
|
+
{
|
|
141
|
+
span: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "block-directory-downloadable-block-list-item__author" })
|
|
142
|
+
}
|
|
143
|
+
) }),
|
|
144
|
+
hasNotice ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_downloadable_block_notice.default, { block: item }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
145
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "block-directory-downloadable-block-list-item__desc", children: !!statusText ? statusText : (0, import_html_entities.decodeEntities)(description) }),
|
|
146
|
+
isInstallable && !(isInstalled || isInstalling) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.VisuallyHidden, { children: (0, import_i18n.__)("Install block") })
|
|
147
|
+
] })
|
|
148
|
+
] })
|
|
149
|
+
]
|
|
150
|
+
}
|
|
151
|
+
)
|
|
152
|
+
}
|
|
153
|
+
),
|
|
154
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ui.Tooltip.Popup, { children: itemLabel })
|
|
155
|
+
] });
|
|
142
156
|
}
|
|
143
157
|
var downloadable_block_list_item_default = DownloadableBlockListItem;
|
|
144
158
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/downloadable-block-list-item/index.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,kBAAgC;AAChC,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { Spinner, Composite } from '@wordpress/components';\nimport { createInterpolateElement } from '@wordpress/element';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { getBlockType } from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\n// eslint-disable-next-line @wordpress/use-recommended-components -- `Tooltip` is not yet on the recommended `@wordpress/ui` allow-list; landing as a migration step ahead of the wider rollout.\nimport { VisuallyHidden, Tooltip } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport BlockRatings from '../block-ratings';\nimport DownloadableBlockIcon from '../downloadable-block-icon';\nimport DownloadableBlockNotice from '../downloadable-block-notice';\nimport { store as blockDirectoryStore } from '../../store';\n\n// Return the appropriate block item label, given the block data and status.\nfunction getDownloadableBlockLabel(\n\t{ title, rating, ratingCount },\n\t{ hasNotice, isInstalled, isInstalling }\n) {\n\tconst stars = Math.round( rating / 0.5 ) * 0.5;\n\n\tif ( ! isInstalled && hasNotice ) {\n\t\t/* translators: %s: block title */\n\t\treturn sprintf( 'Retry installing %s.', decodeEntities( title ) );\n\t}\n\n\tif ( isInstalled ) {\n\t\t/* translators: %s: block title */\n\t\treturn sprintf( 'Add %s.', decodeEntities( title ) );\n\t}\n\n\tif ( isInstalling ) {\n\t\t/* translators: %s: block title */\n\t\treturn sprintf( 'Installing %s.', decodeEntities( title ) );\n\t}\n\n\t// No ratings yet, just use the title.\n\tif ( ratingCount < 1 ) {\n\t\t/* translators: %s: block title */\n\t\treturn sprintf( 'Install %s.', decodeEntities( title ) );\n\t}\n\n\treturn sprintf(\n\t\t/* translators: 1: block title, 2: average rating, 3: total ratings count. */\n\t\t_n(\n\t\t\t'Install %1$s. %2$s stars with %3$s review.',\n\t\t\t'Install %1$s. %2$s stars with %3$s reviews.',\n\t\t\tratingCount\n\t\t),\n\t\tdecodeEntities( title ),\n\t\tstars,\n\t\tratingCount\n\t);\n}\n\nfunction DownloadableBlockListItem( { item, onClick } ) {\n\tconst { author, description, icon, rating, title } = item;\n\t// getBlockType returns a block object if this block exists, or null if not.\n\tconst isInstalled = !! getBlockType( item.name );\n\n\tconst { hasNotice, isInstalling, isInstallable } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getErrorNoticeForBlock, isInstalling: isBlockInstalling } =\n\t\t\t\tselect( blockDirectoryStore );\n\t\t\tconst notice = getErrorNoticeForBlock( item.id );\n\t\t\tconst hasFatal = notice && notice.isFatal;\n\t\t\treturn {\n\t\t\t\thasNotice: !! notice,\n\t\t\t\tisInstalling: isBlockInstalling( item.id ),\n\t\t\t\tisInstallable: ! hasFatal,\n\t\t\t};\n\t\t},\n\t\t[ item ]\n\t);\n\n\tlet statusText = '';\n\tif ( isInstalled ) {\n\t\tstatusText = __( 'Installed!' );\n\t} else if ( isInstalling ) {\n\t\tstatusText = __( 'Installing\u2026' );\n\t}\n\n\tconst itemLabel = getDownloadableBlockLabel( item, {\n\t\thasNotice,\n\t\tisInstalled,\n\t\tisInstalling,\n\t} );\n\n\treturn (\n\t\t<Tooltip.Root>\n\t\t\t<Tooltip.Trigger\n\t\t\t\trender={\n\t\t\t\t\t<Composite.Item\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t'block-directory-downloadable-block-list-item',\n\t\t\t\t\t\t\tisInstalling && 'is-installing'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\tdisabled={ isInstalling || ! isInstallable }\n\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tonClick();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\taria-label={ itemLabel }\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<div className=\"block-directory-downloadable-block-list-item__icon\">\n\t\t\t\t\t\t\t<DownloadableBlockIcon\n\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\ttitle={ title }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ isInstalling ? (\n\t\t\t\t\t\t\t\t<span className=\"block-directory-downloadable-block-list-item__spinner\">\n\t\t\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<BlockRatings rating={ rating } />\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<span className=\"block-directory-downloadable-block-list-item__details\">\n\t\t\t\t\t\t\t<span className=\"block-directory-downloadable-block-list-item__title\">\n\t\t\t\t\t\t\t\t{ createInterpolateElement(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t\t\t/* translators: 1: block title. 2: author name. */\n\t\t\t\t\t\t\t\t\t\t__( '%1$s <span>by %2$s</span>' ),\n\t\t\t\t\t\t\t\t\t\tdecodeEntities( title ),\n\t\t\t\t\t\t\t\t\t\tauthor\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tspan: (\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"block-directory-downloadable-block-list-item__author\" />\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t{ hasNotice ? (\n\t\t\t\t\t\t\t\t<DownloadableBlockNotice block={ item } />\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<span className=\"block-directory-downloadable-block-list-item__desc\">\n\t\t\t\t\t\t\t\t\t\t{ !! statusText\n\t\t\t\t\t\t\t\t\t\t\t? statusText\n\t\t\t\t\t\t\t\t\t\t\t: decodeEntities( description ) }\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t{ isInstallable &&\n\t\t\t\t\t\t\t\t\t\t! ( isInstalled || isInstalling ) && (\n\t\t\t\t\t\t\t\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Install block' ) }\n\t\t\t\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</Composite.Item>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<Tooltip.Popup>{ itemLabel }</Tooltip.Popup>\n\t\t</Tooltip.Root>\n\t);\n}\n\nexport default DownloadableBlockListItem;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,kBAAiB;AAKjB,kBAAgC;AAChC,wBAAmC;AACnC,qBAAyC;AACzC,2BAA+B;AAC/B,oBAA6B;AAC7B,kBAA0B;AAE1B,gBAAwC;AAKxC,2BAAyB;AACzB,qCAAkC;AAClC,uCAAoC;AACpC,mBAA6C;AA+FvC;AA5FN,SAAS,0BACR,EAAE,OAAO,QAAQ,YAAY,GAC7B,EAAE,WAAW,aAAa,aAAa,GACtC;AACD,QAAM,QAAQ,KAAK,MAAO,SAAS,GAAI,IAAI;AAE3C,MAAK,CAAE,eAAe,WAAY;AAEjC,eAAO,qBAAS,4BAAwB,qCAAgB,KAAM,CAAE;AAAA,EACjE;AAEA,MAAK,aAAc;AAElB,eAAO,qBAAS,eAAW,qCAAgB,KAAM,CAAE;AAAA,EACpD;AAEA,MAAK,cAAe;AAEnB,eAAO,qBAAS,sBAAkB,qCAAgB,KAAM,CAAE;AAAA,EAC3D;AAGA,MAAK,cAAc,GAAI;AAEtB,eAAO,qBAAS,mBAAe,qCAAgB,KAAM,CAAE;AAAA,EACxD;AAEA,aAAO;AAAA;AAAA,QAEN;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,IACD;AAAA,QACA,qCAAgB,KAAM;AAAA,IACtB;AAAA,IACA;AAAA,EACD;AACD;AAEA,SAAS,0BAA2B,EAAE,MAAM,QAAQ,GAAI;AACvD,QAAM,EAAE,QAAQ,aAAa,MAAM,QAAQ,MAAM,IAAI;AAErD,QAAM,cAAc,CAAC,KAAE,4BAAc,KAAK,IAAK;AAE/C,QAAM,EAAE,WAAW,cAAc,cAAc,QAAI;AAAA,IAClD,CAAE,WAAY;AACb,YAAM,EAAE,wBAAwB,cAAc,kBAAkB,IAC/D,OAAQ,aAAAA,KAAoB;AAC7B,YAAM,SAAS,uBAAwB,KAAK,EAAG;AAC/C,YAAM,WAAW,UAAU,OAAO;AAClC,aAAO;AAAA,QACN,WAAW,CAAC,CAAE;AAAA,QACd,cAAc,kBAAmB,KAAK,EAAG;AAAA,QACzC,eAAe,CAAE;AAAA,MAClB;AAAA,IACD;AAAA,IACA,CAAE,IAAK;AAAA,EACR;AAEA,MAAI,aAAa;AACjB,MAAK,aAAc;AAClB,qBAAa,gBAAI,YAAa;AAAA,EAC/B,WAAY,cAAe;AAC1B,qBAAa,gBAAI,kBAAc;AAAA,EAChC;AAEA,QAAM,YAAY,0BAA2B,MAAM;AAAA,IAClD;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAEF,SACC,6CAAC,kBAAQ,MAAR,EACA;AAAA;AAAA,MAAC,kBAAQ;AAAA,MAAR;AAAA,QACA,QACC;AAAA,UAAC,4BAAU;AAAA,UAAV;AAAA,YACA,eAAY,YAAAC;AAAA,cACX;AAAA,cACA,gBAAgB;AAAA,YACjB;AAAA,YACA,wBAAsB;AAAA,YACtB,UAAW,gBAAgB,CAAE;AAAA,YAC7B,SAAU,CAAE,UAAW;AACtB,oBAAM,eAAe;AACrB,sBAAQ;AAAA,YACT;AAAA,YACA,cAAa;AAAA,YACb,MAAK;AAAA,YACL,MAAK;AAAA,YAEL;AAAA,2DAAC,SAAI,WAAU,sDACd;AAAA;AAAA,kBAAC,+BAAAC;AAAA,kBAAA;AAAA,oBACA;AAAA,oBACA;AAAA;AAAA,gBACD;AAAA,gBACE,eACD,4CAAC,UAAK,WAAU,yDACf,sDAAC,6BAAQ,GACV,IAEA,4CAAC,qBAAAC,SAAA,EAAa,QAAkB;AAAA,iBAElC;AAAA,cACA,6CAAC,UAAK,WAAU,yDACf;AAAA,4DAAC,UAAK,WAAU,uDACb;AAAA,sBACD;AAAA;AAAA,wBAEC,gBAAI,2BAA4B;AAAA,wBAChC,qCAAgB,KAAM;AAAA,oBACtB;AAAA,kBACD;AAAA,kBACA;AAAA,oBACC,MACC,4CAAC,UAAK,WAAU,wDAAuD;AAAA,kBAEzE;AAAA,gBACD,GACD;AAAA,gBACE,YACD,4CAAC,iCAAAC,SAAA,EAAwB,OAAQ,MAAO,IAExC,4EACC;AAAA,8DAAC,UAAK,WAAU,sDACb,WAAC,CAAE,aACF,iBACA,qCAAgB,WAAY,GAChC;AAAA,kBACE,iBACD,EAAI,eAAe,iBAClB,4CAAC,4BACE,8BAAI,eAAgB,GACvB;AAAA,mBAEH;AAAA,iBAEF;AAAA;AAAA;AAAA,QACD;AAAA;AAAA,IAEF;AAAA,IACA,4CAAC,kBAAQ,OAAR,EAAgB,qBAAW;AAAA,KAC7B;AAEF;AAEA,IAAO,uCAAQ;",
|
|
6
6
|
"names": ["blockDirectoryStore", "clsx", "DownloadableBlockIcon", "BlockRatings", "DownloadableBlockNotice"]
|
|
7
7
|
}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
// packages/block-directory/src/components/downloadable-block-list-item/index.js
|
|
2
2
|
import clsx from "clsx";
|
|
3
3
|
import { __, _n, sprintf } from "@wordpress/i18n";
|
|
4
|
-
import {
|
|
4
|
+
import { Spinner, Composite } from "@wordpress/components";
|
|
5
5
|
import { createInterpolateElement } from "@wordpress/element";
|
|
6
6
|
import { decodeEntities } from "@wordpress/html-entities";
|
|
7
7
|
import { getBlockType } from "@wordpress/blocks";
|
|
8
8
|
import { useSelect } from "@wordpress/data";
|
|
9
|
-
import { VisuallyHidden } from "@wordpress/ui";
|
|
9
|
+
import { VisuallyHidden, Tooltip } from "@wordpress/ui";
|
|
10
10
|
import BlockRatings from "../block-ratings/index.mjs";
|
|
11
11
|
import DownloadableBlockIcon from "../downloadable-block-icon/index.mjs";
|
|
12
12
|
import DownloadableBlockNotice from "../downloadable-block-notice/index.mjs";
|
|
@@ -65,47 +65,61 @@ function DownloadableBlockListItem({ item, onClick }) {
|
|
|
65
65
|
isInstalled,
|
|
66
66
|
isInstalling
|
|
67
67
|
});
|
|
68
|
-
return /* @__PURE__ */
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
event.preventDefault();
|
|
79
|
-
onClick();
|
|
80
|
-
},
|
|
81
|
-
"aria-label": itemLabel,
|
|
82
|
-
type: "button",
|
|
83
|
-
role: "option",
|
|
84
|
-
children: [
|
|
85
|
-
/* @__PURE__ */ jsxs("div", { className: "block-directory-downloadable-block-list-item__icon", children: [
|
|
86
|
-
/* @__PURE__ */ jsx(DownloadableBlockIcon, { icon, title }),
|
|
87
|
-
isInstalling ? /* @__PURE__ */ jsx("span", { className: "block-directory-downloadable-block-list-item__spinner", children: /* @__PURE__ */ jsx(Spinner, {}) }) : /* @__PURE__ */ jsx(BlockRatings, { rating })
|
|
88
|
-
] }),
|
|
89
|
-
/* @__PURE__ */ jsxs("span", { className: "block-directory-downloadable-block-list-item__details", children: [
|
|
90
|
-
/* @__PURE__ */ jsx("span", { className: "block-directory-downloadable-block-list-item__title", children: createInterpolateElement(
|
|
91
|
-
sprintf(
|
|
92
|
-
/* translators: 1: block title. 2: author name. */
|
|
93
|
-
__("%1$s <span>by %2$s</span>"),
|
|
94
|
-
decodeEntities(title),
|
|
95
|
-
author
|
|
68
|
+
return /* @__PURE__ */ jsxs(Tooltip.Root, { children: [
|
|
69
|
+
/* @__PURE__ */ jsx(
|
|
70
|
+
Tooltip.Trigger,
|
|
71
|
+
{
|
|
72
|
+
render: /* @__PURE__ */ jsxs(
|
|
73
|
+
Composite.Item,
|
|
74
|
+
{
|
|
75
|
+
className: clsx(
|
|
76
|
+
"block-directory-downloadable-block-list-item",
|
|
77
|
+
isInstalling && "is-installing"
|
|
96
78
|
),
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
79
|
+
accessibleWhenDisabled: true,
|
|
80
|
+
disabled: isInstalling || !isInstallable,
|
|
81
|
+
onClick: (event) => {
|
|
82
|
+
event.preventDefault();
|
|
83
|
+
onClick();
|
|
84
|
+
},
|
|
85
|
+
"aria-label": itemLabel,
|
|
86
|
+
type: "button",
|
|
87
|
+
role: "option",
|
|
88
|
+
children: [
|
|
89
|
+
/* @__PURE__ */ jsxs("div", { className: "block-directory-downloadable-block-list-item__icon", children: [
|
|
90
|
+
/* @__PURE__ */ jsx(
|
|
91
|
+
DownloadableBlockIcon,
|
|
92
|
+
{
|
|
93
|
+
icon,
|
|
94
|
+
title
|
|
95
|
+
}
|
|
96
|
+
),
|
|
97
|
+
isInstalling ? /* @__PURE__ */ jsx("span", { className: "block-directory-downloadable-block-list-item__spinner", children: /* @__PURE__ */ jsx(Spinner, {}) }) : /* @__PURE__ */ jsx(BlockRatings, { rating })
|
|
98
|
+
] }),
|
|
99
|
+
/* @__PURE__ */ jsxs("span", { className: "block-directory-downloadable-block-list-item__details", children: [
|
|
100
|
+
/* @__PURE__ */ jsx("span", { className: "block-directory-downloadable-block-list-item__title", children: createInterpolateElement(
|
|
101
|
+
sprintf(
|
|
102
|
+
/* translators: 1: block title. 2: author name. */
|
|
103
|
+
__("%1$s <span>by %2$s</span>"),
|
|
104
|
+
decodeEntities(title),
|
|
105
|
+
author
|
|
106
|
+
),
|
|
107
|
+
{
|
|
108
|
+
span: /* @__PURE__ */ jsx("span", { className: "block-directory-downloadable-block-list-item__author" })
|
|
109
|
+
}
|
|
110
|
+
) }),
|
|
111
|
+
hasNotice ? /* @__PURE__ */ jsx(DownloadableBlockNotice, { block: item }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
112
|
+
/* @__PURE__ */ jsx("span", { className: "block-directory-downloadable-block-list-item__desc", children: !!statusText ? statusText : decodeEntities(description) }),
|
|
113
|
+
isInstallable && !(isInstalled || isInstalling) && /* @__PURE__ */ jsx(VisuallyHidden, { children: __("Install block") })
|
|
114
|
+
] })
|
|
115
|
+
] })
|
|
116
|
+
]
|
|
117
|
+
}
|
|
118
|
+
)
|
|
119
|
+
}
|
|
120
|
+
),
|
|
121
|
+
/* @__PURE__ */ jsx(Tooltip.Popup, { children: itemLabel })
|
|
122
|
+
] });
|
|
109
123
|
}
|
|
110
124
|
var downloadable_block_list_item_default = DownloadableBlockListItem;
|
|
111
125
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/downloadable-block-list-item/index.js"],
|
|
4
|
-
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {
|
|
5
|
-
"mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,IAAI,IAAI,eAAe;AAChC,SAAS,SAAS,
|
|
4
|
+
"sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { Spinner, Composite } from '@wordpress/components';\nimport { createInterpolateElement } from '@wordpress/element';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { getBlockType } from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\n// eslint-disable-next-line @wordpress/use-recommended-components -- `Tooltip` is not yet on the recommended `@wordpress/ui` allow-list; landing as a migration step ahead of the wider rollout.\nimport { VisuallyHidden, Tooltip } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport BlockRatings from '../block-ratings';\nimport DownloadableBlockIcon from '../downloadable-block-icon';\nimport DownloadableBlockNotice from '../downloadable-block-notice';\nimport { store as blockDirectoryStore } from '../../store';\n\n// Return the appropriate block item label, given the block data and status.\nfunction getDownloadableBlockLabel(\n\t{ title, rating, ratingCount },\n\t{ hasNotice, isInstalled, isInstalling }\n) {\n\tconst stars = Math.round( rating / 0.5 ) * 0.5;\n\n\tif ( ! isInstalled && hasNotice ) {\n\t\t/* translators: %s: block title */\n\t\treturn sprintf( 'Retry installing %s.', decodeEntities( title ) );\n\t}\n\n\tif ( isInstalled ) {\n\t\t/* translators: %s: block title */\n\t\treturn sprintf( 'Add %s.', decodeEntities( title ) );\n\t}\n\n\tif ( isInstalling ) {\n\t\t/* translators: %s: block title */\n\t\treturn sprintf( 'Installing %s.', decodeEntities( title ) );\n\t}\n\n\t// No ratings yet, just use the title.\n\tif ( ratingCount < 1 ) {\n\t\t/* translators: %s: block title */\n\t\treturn sprintf( 'Install %s.', decodeEntities( title ) );\n\t}\n\n\treturn sprintf(\n\t\t/* translators: 1: block title, 2: average rating, 3: total ratings count. */\n\t\t_n(\n\t\t\t'Install %1$s. %2$s stars with %3$s review.',\n\t\t\t'Install %1$s. %2$s stars with %3$s reviews.',\n\t\t\tratingCount\n\t\t),\n\t\tdecodeEntities( title ),\n\t\tstars,\n\t\tratingCount\n\t);\n}\n\nfunction DownloadableBlockListItem( { item, onClick } ) {\n\tconst { author, description, icon, rating, title } = item;\n\t// getBlockType returns a block object if this block exists, or null if not.\n\tconst isInstalled = !! getBlockType( item.name );\n\n\tconst { hasNotice, isInstalling, isInstallable } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getErrorNoticeForBlock, isInstalling: isBlockInstalling } =\n\t\t\t\tselect( blockDirectoryStore );\n\t\t\tconst notice = getErrorNoticeForBlock( item.id );\n\t\t\tconst hasFatal = notice && notice.isFatal;\n\t\t\treturn {\n\t\t\t\thasNotice: !! notice,\n\t\t\t\tisInstalling: isBlockInstalling( item.id ),\n\t\t\t\tisInstallable: ! hasFatal,\n\t\t\t};\n\t\t},\n\t\t[ item ]\n\t);\n\n\tlet statusText = '';\n\tif ( isInstalled ) {\n\t\tstatusText = __( 'Installed!' );\n\t} else if ( isInstalling ) {\n\t\tstatusText = __( 'Installing\u2026' );\n\t}\n\n\tconst itemLabel = getDownloadableBlockLabel( item, {\n\t\thasNotice,\n\t\tisInstalled,\n\t\tisInstalling,\n\t} );\n\n\treturn (\n\t\t<Tooltip.Root>\n\t\t\t<Tooltip.Trigger\n\t\t\t\trender={\n\t\t\t\t\t<Composite.Item\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t'block-directory-downloadable-block-list-item',\n\t\t\t\t\t\t\tisInstalling && 'is-installing'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\tdisabled={ isInstalling || ! isInstallable }\n\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tonClick();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\taria-label={ itemLabel }\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<div className=\"block-directory-downloadable-block-list-item__icon\">\n\t\t\t\t\t\t\t<DownloadableBlockIcon\n\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\ttitle={ title }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ isInstalling ? (\n\t\t\t\t\t\t\t\t<span className=\"block-directory-downloadable-block-list-item__spinner\">\n\t\t\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<BlockRatings rating={ rating } />\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<span className=\"block-directory-downloadable-block-list-item__details\">\n\t\t\t\t\t\t\t<span className=\"block-directory-downloadable-block-list-item__title\">\n\t\t\t\t\t\t\t\t{ createInterpolateElement(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t\t\t/* translators: 1: block title. 2: author name. */\n\t\t\t\t\t\t\t\t\t\t__( '%1$s <span>by %2$s</span>' ),\n\t\t\t\t\t\t\t\t\t\tdecodeEntities( title ),\n\t\t\t\t\t\t\t\t\t\tauthor\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tspan: (\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"block-directory-downloadable-block-list-item__author\" />\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t{ hasNotice ? (\n\t\t\t\t\t\t\t\t<DownloadableBlockNotice block={ item } />\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<span className=\"block-directory-downloadable-block-list-item__desc\">\n\t\t\t\t\t\t\t\t\t\t{ !! statusText\n\t\t\t\t\t\t\t\t\t\t\t? statusText\n\t\t\t\t\t\t\t\t\t\t\t: decodeEntities( description ) }\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t{ isInstallable &&\n\t\t\t\t\t\t\t\t\t\t! ( isInstalled || isInstalling ) && (\n\t\t\t\t\t\t\t\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Install block' ) }\n\t\t\t\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</Composite.Item>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<Tooltip.Popup>{ itemLabel }</Tooltip.Popup>\n\t\t</Tooltip.Root>\n\t);\n}\n\nexport default DownloadableBlockListItem;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wordpress/block-directory",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.47.0",
|
|
4
4
|
"description": "Extend editor with block directory features to search, download and install blocks.",
|
|
5
5
|
"author": "The WordPress Contributors",
|
|
6
6
|
"license": "GPL-2.0-or-later",
|
|
@@ -42,26 +42,26 @@
|
|
|
42
42
|
"react-native": "src/index",
|
|
43
43
|
"wpScript": true,
|
|
44
44
|
"dependencies": {
|
|
45
|
-
"@wordpress/a11y": "^4.
|
|
46
|
-
"@wordpress/api-fetch": "^7.
|
|
47
|
-
"@wordpress/base-styles": "^
|
|
48
|
-
"@wordpress/block-editor": "^15.
|
|
49
|
-
"@wordpress/blocks": "^15.
|
|
50
|
-
"@wordpress/components": "^
|
|
51
|
-
"@wordpress/compose": "^
|
|
52
|
-
"@wordpress/core-data": "^7.
|
|
53
|
-
"@wordpress/data": "^10.
|
|
54
|
-
"@wordpress/editor": "^14.
|
|
55
|
-
"@wordpress/element": "^
|
|
56
|
-
"@wordpress/hooks": "^4.
|
|
57
|
-
"@wordpress/html-entities": "^4.
|
|
58
|
-
"@wordpress/i18n": "^6.
|
|
59
|
-
"@wordpress/icons": "^13.
|
|
60
|
-
"@wordpress/notices": "^5.
|
|
61
|
-
"@wordpress/plugins": "^7.
|
|
62
|
-
"@wordpress/private-apis": "^1.
|
|
63
|
-
"@wordpress/ui": "^0.
|
|
64
|
-
"@wordpress/url": "^4.
|
|
45
|
+
"@wordpress/a11y": "^4.47.0",
|
|
46
|
+
"@wordpress/api-fetch": "^7.47.0",
|
|
47
|
+
"@wordpress/base-styles": "^9.0.0",
|
|
48
|
+
"@wordpress/block-editor": "^15.20.0",
|
|
49
|
+
"@wordpress/blocks": "^15.20.0",
|
|
50
|
+
"@wordpress/components": "^34.0.0",
|
|
51
|
+
"@wordpress/compose": "^8.0.0",
|
|
52
|
+
"@wordpress/core-data": "^7.47.0",
|
|
53
|
+
"@wordpress/data": "^10.47.0",
|
|
54
|
+
"@wordpress/editor": "^14.47.0",
|
|
55
|
+
"@wordpress/element": "^7.0.0",
|
|
56
|
+
"@wordpress/hooks": "^4.47.0",
|
|
57
|
+
"@wordpress/html-entities": "^4.47.0",
|
|
58
|
+
"@wordpress/i18n": "^6.20.0",
|
|
59
|
+
"@wordpress/icons": "^13.2.0",
|
|
60
|
+
"@wordpress/notices": "^5.47.0",
|
|
61
|
+
"@wordpress/plugins": "^7.47.0",
|
|
62
|
+
"@wordpress/private-apis": "^1.47.0",
|
|
63
|
+
"@wordpress/ui": "^0.14.0",
|
|
64
|
+
"@wordpress/url": "^4.47.0",
|
|
65
65
|
"change-case": "^4.1.2",
|
|
66
66
|
"clsx": "^2.1.1"
|
|
67
67
|
},
|
|
@@ -69,11 +69,11 @@
|
|
|
69
69
|
"deep-freeze": "0.0.1"
|
|
70
70
|
},
|
|
71
71
|
"peerDependencies": {
|
|
72
|
-
"react": "^
|
|
73
|
-
"react-dom": "^
|
|
72
|
+
"react": "^19.2.4",
|
|
73
|
+
"react-dom": "^19.2.4"
|
|
74
74
|
},
|
|
75
75
|
"publishConfig": {
|
|
76
76
|
"access": "public"
|
|
77
77
|
},
|
|
78
|
-
"gitHead": "
|
|
78
|
+
"gitHead": "d653c5fd6161571a0c2ebde28553d6e25624eacc"
|
|
79
79
|
}
|
|
@@ -7,12 +7,13 @@ import clsx from 'clsx';
|
|
|
7
7
|
* WordPress dependencies
|
|
8
8
|
*/
|
|
9
9
|
import { __, _n, sprintf } from '@wordpress/i18n';
|
|
10
|
-
import {
|
|
10
|
+
import { Spinner, Composite } from '@wordpress/components';
|
|
11
11
|
import { createInterpolateElement } from '@wordpress/element';
|
|
12
12
|
import { decodeEntities } from '@wordpress/html-entities';
|
|
13
13
|
import { getBlockType } from '@wordpress/blocks';
|
|
14
14
|
import { useSelect } from '@wordpress/data';
|
|
15
|
-
|
|
15
|
+
// eslint-disable-next-line @wordpress/use-recommended-components -- `Tooltip` is not yet on the recommended `@wordpress/ui` allow-list; landing as a migration step ahead of the wider rollout.
|
|
16
|
+
import { VisuallyHidden, Tooltip } from '@wordpress/ui';
|
|
16
17
|
|
|
17
18
|
/**
|
|
18
19
|
* Internal dependencies
|
|
@@ -97,68 +98,76 @@ function DownloadableBlockListItem( { item, onClick } ) {
|
|
|
97
98
|
} );
|
|
98
99
|
|
|
99
100
|
return (
|
|
100
|
-
<Tooltip
|
|
101
|
-
<
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
disabled={ isInstalling || ! isInstallable }
|
|
108
|
-
onClick={ ( event ) => {
|
|
109
|
-
event.preventDefault();
|
|
110
|
-
onClick();
|
|
111
|
-
} }
|
|
112
|
-
aria-label={ itemLabel }
|
|
113
|
-
type="button"
|
|
114
|
-
role="option"
|
|
115
|
-
>
|
|
116
|
-
<div className="block-directory-downloadable-block-list-item__icon">
|
|
117
|
-
<DownloadableBlockIcon icon={ icon } title={ title } />
|
|
118
|
-
{ isInstalling ? (
|
|
119
|
-
<span className="block-directory-downloadable-block-list-item__spinner">
|
|
120
|
-
<Spinner />
|
|
121
|
-
</span>
|
|
122
|
-
) : (
|
|
123
|
-
<BlockRatings rating={ rating } />
|
|
124
|
-
) }
|
|
125
|
-
</div>
|
|
126
|
-
<span className="block-directory-downloadable-block-list-item__details">
|
|
127
|
-
<span className="block-directory-downloadable-block-list-item__title">
|
|
128
|
-
{ createInterpolateElement(
|
|
129
|
-
sprintf(
|
|
130
|
-
/* translators: 1: block title. 2: author name. */
|
|
131
|
-
__( '%1$s <span>by %2$s</span>' ),
|
|
132
|
-
decodeEntities( title ),
|
|
133
|
-
author
|
|
134
|
-
),
|
|
135
|
-
{
|
|
136
|
-
span: (
|
|
137
|
-
<span className="block-directory-downloadable-block-list-item__author" />
|
|
138
|
-
),
|
|
139
|
-
}
|
|
101
|
+
<Tooltip.Root>
|
|
102
|
+
<Tooltip.Trigger
|
|
103
|
+
render={
|
|
104
|
+
<Composite.Item
|
|
105
|
+
className={ clsx(
|
|
106
|
+
'block-directory-downloadable-block-list-item',
|
|
107
|
+
isInstalling && 'is-installing'
|
|
140
108
|
) }
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
109
|
+
accessibleWhenDisabled
|
|
110
|
+
disabled={ isInstalling || ! isInstallable }
|
|
111
|
+
onClick={ ( event ) => {
|
|
112
|
+
event.preventDefault();
|
|
113
|
+
onClick();
|
|
114
|
+
} }
|
|
115
|
+
aria-label={ itemLabel }
|
|
116
|
+
type="button"
|
|
117
|
+
role="option"
|
|
118
|
+
>
|
|
119
|
+
<div className="block-directory-downloadable-block-list-item__icon">
|
|
120
|
+
<DownloadableBlockIcon
|
|
121
|
+
icon={ icon }
|
|
122
|
+
title={ title }
|
|
123
|
+
/>
|
|
124
|
+
{ isInstalling ? (
|
|
125
|
+
<span className="block-directory-downloadable-block-list-item__spinner">
|
|
126
|
+
<Spinner />
|
|
127
|
+
</span>
|
|
128
|
+
) : (
|
|
129
|
+
<BlockRatings rating={ rating } />
|
|
130
|
+
) }
|
|
131
|
+
</div>
|
|
132
|
+
<span className="block-directory-downloadable-block-list-item__details">
|
|
133
|
+
<span className="block-directory-downloadable-block-list-item__title">
|
|
134
|
+
{ createInterpolateElement(
|
|
135
|
+
sprintf(
|
|
136
|
+
/* translators: 1: block title. 2: author name. */
|
|
137
|
+
__( '%1$s <span>by %2$s</span>' ),
|
|
138
|
+
decodeEntities( title ),
|
|
139
|
+
author
|
|
140
|
+
),
|
|
141
|
+
{
|
|
142
|
+
span: (
|
|
143
|
+
<span className="block-directory-downloadable-block-list-item__author" />
|
|
144
|
+
),
|
|
145
|
+
}
|
|
156
146
|
) }
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
147
|
+
</span>
|
|
148
|
+
{ hasNotice ? (
|
|
149
|
+
<DownloadableBlockNotice block={ item } />
|
|
150
|
+
) : (
|
|
151
|
+
<>
|
|
152
|
+
<span className="block-directory-downloadable-block-list-item__desc">
|
|
153
|
+
{ !! statusText
|
|
154
|
+
? statusText
|
|
155
|
+
: decodeEntities( description ) }
|
|
156
|
+
</span>
|
|
157
|
+
{ isInstallable &&
|
|
158
|
+
! ( isInstalled || isInstalling ) && (
|
|
159
|
+
<VisuallyHidden>
|
|
160
|
+
{ __( 'Install block' ) }
|
|
161
|
+
</VisuallyHidden>
|
|
162
|
+
) }
|
|
163
|
+
</>
|
|
164
|
+
) }
|
|
165
|
+
</span>
|
|
166
|
+
</Composite.Item>
|
|
167
|
+
}
|
|
168
|
+
/>
|
|
169
|
+
<Tooltip.Popup>{ itemLabel }</Tooltip.Popup>
|
|
170
|
+
</Tooltip.Root>
|
|
162
171
|
);
|
|
163
172
|
}
|
|
164
173
|
|