"use strict";(self.webpackChunk_woocommerce_storybook=self.webpackChunk_woocommerce_storybook||[]).push([[5722],{"../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{function _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}__webpack_require__.d(__webpack_exports__,{A:()=>_arrayLikeToArray})},"../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}__webpack_require__.d(__webpack_exports__,{A:()=>_arrayWithHoles})},"../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/nonIterableRest.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}__webpack_require__.d(__webpack_exports__,{A:()=>_nonIterableRest})},"../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/slicedToArray.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>_slicedToArray});var arrayWithHoles=__webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js");var unsupportedIterableToArray=__webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js"),nonIterableRest=__webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/nonIterableRest.js");function _slicedToArray(arr,i){return(0,arrayWithHoles.A)(arr)||function _iterableToArrayLimit(r,l){var t=null==r?null:"undefined"!=typeof Symbol&&r[Symbol.iterator]||r["@@iterator"];if(null!=t){var e,n,i,u,a=[],f=!0,o=!1;try{if(i=(t=t.call(r)).next,0===l){if(Object(t)!==t)return;f=!1}else for(;!(f=(e=i.call(t)).done)&&(a.push(e.value),a.length!==l);f=!0);}catch(r){o=!0,n=r}finally{try{if(!f&&null!=t.return&&(u=t.return(),Object(u)!==u))return}finally{if(o)throw n}}return a}}(arr,i)||(0,unsupportedIterableToArray.A)(arr,i)||(0,nonIterableRest.A)()}},"../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/unsupportedIterableToArray.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>_unsupportedIterableToArray});var _arrayLikeToArray_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/arrayLikeToArray.js");function _unsupportedIterableToArray(o,minLen){if(o){if("string"==typeof o)return(0,_arrayLikeToArray_js__WEBPACK_IMPORTED_MODULE_0__.A)(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);return"Object"===n&&o.constructor&&(n=o.constructor.name),"Map"===n||"Set"===n?Array.from(o):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?(0,_arrayLikeToArray_js__WEBPACK_IMPORTED_MODULE_0__.A)(o,minLen):void 0}}},"../../node_modules/.pnpm/@wordpress+html-entities@3.6.1/node_modules/@wordpress/html-entities/build-module/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{let _decodeTextArea;function decodeEntities(html){if("string"!=typeof html||-1===html.indexOf("&"))return html;void 0===_decodeTextArea&&(_decodeTextArea=document.implementation&&document.implementation.createHTMLDocument?document.implementation.createHTMLDocument("").createElement("textarea"):document.createElement("textarea")),_decodeTextArea.innerHTML=html;const decoded=_decodeTextArea.textContent;return _decodeTextArea.innerHTML="",decoded}__webpack_require__.d(__webpack_exports__,{S:()=>decodeEntities})},"../../node_modules/.pnpm/@wordpress+icons@8.2.3/node_modules/@wordpress/icons/build-module/icon/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/.pnpm/react@18.3.1/node_modules/react/index.js");const __WEBPACK_DEFAULT_EXPORT__=function Icon(_ref){let{icon,size=24,...props}=_ref;return(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.cloneElement)(icon,{width:size,height:size,...props})}},"../../node_modules/.pnpm/@wordpress+icons@8.2.3/node_modules/@wordpress/icons/build-module/library/close-small.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/.pnpm/react@18.3.1/node_modules/react/index.js"),_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../../node_modules/.pnpm/@wordpress+primitives@3.4.1/node_modules/@wordpress/primitives/build-module/svg/index.js");const __WEBPACK_DEFAULT_EXPORT__=(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.t4,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_primitives__WEBPACK_IMPORTED_MODULE_1__.wA,{d:"M12 13.06l3.712 3.713 1.061-1.06L13.061 12l3.712-3.712-1.06-1.06L12 10.938 8.288 7.227l-1.061 1.06L10.939 12l-3.712 3.712 1.06 1.061L12 13.061z"}))},"../../packages/js/components/src/tag/index.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var _babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("../../node_modules/.pnpm/@babel+runtime@7.23.5/node_modules/@babel/runtime/helpers/esm/slicedToArray.js"),_wordpress_element__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("../../node_modules/.pnpm/react@18.3.1/node_modules/react/index.js"),_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/.pnpm/@wordpress+i18n@4.6.1/node_modules/@wordpress/i18n/build-module/index.js"),classnames__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../../node_modules/.pnpm/classnames@2.3.2/node_modules/classnames/index.js"),classnames__WEBPACK_IMPORTED_MODULE_1___default=__webpack_require__.n(classnames__WEBPACK_IMPORTED_MODULE_1__),_wordpress_components__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("../../node_modules/.pnpm/@wordpress+components@19.8.5_@types+react@17.0.71_react-dom@17.0.2_react@17.0.2__react-with-d_oli5xz3n7pc4ztqokra47llglu/node_modules/@wordpress/components/build-module/button/index.js"),_wordpress_components__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("../../node_modules/.pnpm/@wordpress+components@19.8.5_@types+react@17.0.71_react-dom@17.0.2_react@17.0.2__react-with-d_oli5xz3n7pc4ztqokra47llglu/node_modules/@wordpress/components/build-module/popover/index.js"),_wordpress_icons__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("../../node_modules/.pnpm/@wordpress+icons@8.2.3/node_modules/@wordpress/icons/build-module/icon/index.js"),_wordpress_icons__WEBPACK_IMPORTED_MODULE_9__=__webpack_require__("../../node_modules/.pnpm/@wordpress+icons@8.2.3/node_modules/@wordpress/icons/build-module/library/close-small.js"),_wordpress_html_entities__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("../../node_modules/.pnpm/@wordpress+html-entities@3.6.1/node_modules/@wordpress/html-entities/build-module/index.js"),_wordpress_compose__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("../../node_modules/.pnpm/@wordpress+compose@5.4.1_react@17.0.2/node_modules/@wordpress/compose/build-module/hooks/use-instance-id/index.js"),Tag=(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.forwardRef)((function(_ref,removeButtonRef){var id=_ref.id,label=_ref.label,popoverContents=_ref.popoverContents,remove=_ref.remove,screenReaderLabel=_ref.screenReaderLabel,className=_ref.className,_useState=(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.useState)(!1),_useState2=(0,_babel_runtime_helpers_slicedToArray__WEBPACK_IMPORTED_MODULE_3__.A)(_useState,2),isVisible=_useState2[0],setIsVisible=_useState2[1],instanceId=(0,_wordpress_compose__WEBPACK_IMPORTED_MODULE_4__.A)(Tag);if(screenReaderLabel=screenReaderLabel||label,!label)return null;label=(0,_wordpress_html_entities__WEBPACK_IMPORTED_MODULE_5__.S)(label);var classes=classnames__WEBPACK_IMPORTED_MODULE_1___default()("woocommerce-tag",className,{"has-remove":!!remove}),labelId="woocommerce-tag__label-".concat(instanceId),labelTextNode=(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.Fragment,null,(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.createElement)("span",{className:"screen-reader-text"},screenReaderLabel),(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.createElement)("span",{"aria-hidden":"true"},label));return(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.createElement)("span",{className:classes},popoverContents?(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.A,{className:"woocommerce-tag__text",id:labelId,onClick:function onClick(){return setIsVisible(!0)}},labelTextNode):(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.createElement)("span",{className:"woocommerce-tag__text",id:labelId},labelTextNode),popoverContents&&isVisible&&(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_7__.A,{onClose:function onClose(){return setIsVisible(!1)}},popoverContents),remove&&(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.createElement)(_wordpress_components__WEBPACK_IMPORTED_MODULE_6__.A,{className:"woocommerce-tag__remove",ref:removeButtonRef,onClick:remove(id),label:(0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.nv)((0,_wordpress_i18n__WEBPACK_IMPORTED_MODULE_0__.__)("Remove %s","woocommerce"),label),"aria-describedby":labelId},(0,_wordpress_element__WEBPACK_IMPORTED_MODULE_2__.createElement)(_wordpress_icons__WEBPACK_IMPORTED_MODULE_8__.A,{icon:_wordpress_icons__WEBPACK_IMPORTED_MODULE_9__.A,size:20,className:"clear-icon"})))}));const __WEBPACK_DEFAULT_EXPORT__=Tag;try{tag.displayName="tag",tag.__docgenInfo={description:"",displayName:"tag",props:{label:{defaultValue:null,description:"The name for this item, displayed as the tag's text.",name:"label",required:!0,type:{name:"string"}},id:{defaultValue:null,description:"A unique ID for this item. This is used to identify the item when the remove button is clicked.",name:"id",required:!1,type:{name:"string | number"}},popoverContents:{defaultValue:null,description:"Contents to display on click in a popover",name:"popoverContents",required:!1,type:{name:"ReactNode"}},remove:{defaultValue:null,description:"A function called when the remove X is clicked. If not used, no X icon will display.",name:"remove",required:!1,type:{name:"((id: string | number) => MouseEventHandler<HTMLButtonElement>)"}},screenReaderLabel:{defaultValue:null,description:"A more descriptive label for screen reader users. Defaults to the `name` prop.",name:"screenReaderLabel",required:!1,type:{name:"string"}},className:{defaultValue:null,description:"Additional CSS classes.",name:"className",required:!1,type:{name:"string"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["../../packages/js/components/src/tag/index.tsx#tag"]={docgenInfo:tag.__docgenInfo,name:"tag",path:"../../packages/js/components/src/tag/index.tsx#tag"})}catch(__react_docgen_typescript_loader_error){}},"../../packages/js/components/src/tag/stories/tag.story.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Basic:()=>Basic,default:()=>__WEBPACK_DEFAULT_EXPORT__});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/.pnpm/react@18.3.1/node_modules/react/index.js"),___WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../../packages/js/components/src/tag/index.tsx"),Basic=function Basic(){return(0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(react__WEBPACK_IMPORTED_MODULE_0__.Fragment,null,(0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(___WEBPACK_IMPORTED_MODULE_1__.A,{label:"My tag",id:1}),(0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(___WEBPACK_IMPORTED_MODULE_1__.A,{label:"Removable tag",id:2,remove:function remove(id){return function(){return window.alert("Remove ID ".concat(id))}}}),(0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)(___WEBPACK_IMPORTED_MODULE_1__.A,{label:"Tag with popover",popoverContents:(0,react__WEBPACK_IMPORTED_MODULE_0__.createElement)("p",null,"This is a popover")}))};const __WEBPACK_DEFAULT_EXPORT__={title:"WooCommerce Admin/components/Tag",component:___WEBPACK_IMPORTED_MODULE_1__.A};Basic.parameters={...Basic.parameters,docs:{...Basic.parameters?.docs,source:{originalSource:'() => <>\n        <Tag label="My tag" id={1} />\n        <Tag label="Removable tag" id={2}\n  // eslint-disable-next-line no-alert\n  remove={id => () => window.alert(`Remove ID ${id}`)} />\n        <Tag label="Tag with popover" popoverContents={<p>This is a popover</p>} />\n    </>',...Basic.parameters?.docs?.source}}}}}]);