From c06ba99d1cc489262050e518b11a7ace409228ba Mon Sep 17 00:00:00 2001 From: YossiSaadi Date: Thu, 18 Apr 2024 10:48:56 +0000 Subject: [PATCH] =?UTF-8?q?Deploying=20to=20gh-pages=20from=20@=20mondayco?= =?UTF-8?q?m/monday-ui-react-core@64ca73577025dd6b3220cf145eace8103e30e228?= =?UTF-8?q?=20=F0=9F=9A=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ...ut-__stories__-BaseInput-stories.99d4717c.iframe.bundle.js | 1 + ...box-__stories__-combobox-stories.3cb8ae07.iframe.bundle.js | 2 ++ ...s__-combobox-stories.3cb8ae07.iframe.bundle.js.LICENSE.txt | 0 ...box-__stories__-combobox-stories.a01e153f.iframe.bundle.js | 2 -- ...ropdown-__stories__-dropdown-mdx.5aeb6afa.iframe.bundle.js | 1 + ...ropdown-__stories__-dropdown-mdx.e5ad051f.iframe.bundle.js | 1 - ...own-__stories__-dropdown-stories.8adb3100.iframe.bundle.js | 2 ++ ...s__-dropdown-stories.8adb3100.iframe.bundle.js.LICENSE.txt | 0 ...own-__stories__-dropdown-stories.a1e8726f.iframe.bundle.js | 2 -- ...ext-__stories__-EditableText-mdx.1dbcd5f8.iframe.bundle.js | 4 ++-- ...s__-EditableText-mdx.1dbcd5f8.iframe.bundle.js.LICENSE.txt | 0 ...__stories__-EditableText-stories.94624db0.iframe.bundle.js | 4 ++-- ...EditableText-stories.94624db0.iframe.bundle.js.LICENSE.txt | 0 ...-Heading-__stories__-Heading-mdx.6d3c5272.iframe.bundle.js | 2 -- ...-Heading-__stories__-Heading-mdx.8fc74217.iframe.bundle.js | 2 ++ ...tories__-Heading-mdx.8fc74217.iframe.bundle.js.LICENSE.txt | 0 ...ding-__stories__-Heading-stories.d2c661c7.iframe.bundle.js | 2 ++ ...es__-Heading-stories.d2c661c7.iframe.bundle.js.LICENSE.txt | 0 ...ding-__stories__-Heading-stories.f511be28.iframe.bundle.js | 2 -- ...onents-Icon-__stories__-Icon-mdx.1ab25b7f.iframe.bundle.js | 1 - ...onents-Icon-__stories__-Icon-mdx.d0b5e131.iframe.bundle.js | 1 + ...ts-Icon-__stories__-Icon-stories.027db9f1.iframe.bundle.js | 1 + ...ts-Icon-__stories__-Icon-stories.95510756.iframe.bundle.js | 1 - ...utton-__stories__-IconButton-mdx.f96bf4e1.iframe.bundle.js | 2 +- ...n-__stories__-IconButton-stories.2c0cffa4.iframe.bundle.js | 2 +- ...ng-__stories__-LegacyHeading-mdx.54646e87.iframe.bundle.js | 1 - ...ng-__stories__-LegacyHeading-mdx.b6fee607.iframe.bundle.js | 1 + ..._stories__-LegacyHeading-stories.4db89ec2.iframe.bundle.js | 1 - ..._stories__-LegacyHeading-stories.67b3db4b.iframe.bundle.js | 1 + ...rch-__stories__-LegacySearch-mdx.141a9193.iframe.bundle.js | 1 + ...__stories__-LegacySearch-stories.a29d570d.iframe.bundle.js | 1 + ...ts-Loader-__stories__-Loader-mdx.ba6753d8.iframe.bundle.js | 1 - ...ts-Loader-__stories__-Loader-mdx.cf97956f.iframe.bundle.js | 1 + ...oader-__stories__-Loader-stories.40a757e5.iframe.bundle.js | 1 - ...oader-__stories__-Loader-stories.9f2bcc5d.iframe.bundle.js | 1 + ...s-Menu-Menu-__stories__-Menu-mdx.7ca3dbc2.iframe.bundle.js | 1 - ...s-Menu-Menu-__stories__-Menu-mdx.8c48b300.iframe.bundle.js | 1 + ...t-__stories__-ResponsiveList-mdx.607c279a.iframe.bundle.js | 1 + ...t-__stories__-ResponsiveList-mdx.de8e6b69.iframe.bundle.js | 1 - ...stories__-ResponsiveList-stories.7d04933a.iframe.bundle.js | 1 + ...stories__-ResponsiveList-stories.8f6a17dd.iframe.bundle.js | 1 - ...ts-Search-__stories__-Search-mdx.9e26d157.iframe.bundle.js | 1 - ...ts-Search-__stories__-Search-mdx.a976957e.iframe.bundle.js | 1 + ...earch-__stories__-Search-stories.8a89c514.iframe.bundle.js | 1 + ...earch-__stories__-Search-stories.9067731f.iframe.bundle.js | 1 - ...onents-Text-__stories__-Text-mdx.121a19b6.iframe.bundle.js | 2 ++ ...__stories__-Text-mdx.121a19b6.iframe.bundle.js.LICENSE.txt | 0 ...onents-Text-__stories__-Text-mdx.5d569510.iframe.bundle.js | 2 -- ...ts-Text-__stories__-Text-stories.0b2e58f6.iframe.bundle.js | 2 ++ ...ories__-Text-stories.0b2e58f6.iframe.bundle.js.LICENSE.txt | 0 ...ts-Text-__stories__-Text-stories.fd9eeaa9.iframe.bundle.js | 2 -- ...useActiveDescendantListFocus-mdx.98bb86d7.iframe.bundle.js | 2 -- ...useActiveDescendantListFocus-mdx.f5ce7e2f.iframe.bundle.js | 2 ++ ...cendantListFocus-mdx.f5ce7e2f.iframe.bundle.js.LICENSE.txt | 0 ...ctiveDescendantListFocus-stories.8ad8a4ea.iframe.bundle.js | 2 -- ...ctiveDescendantListFocus-stories.e1bf8169.iframe.bundle.js | 2 ++ ...antListFocus-stories.e1bf8169.iframe.bundle.js.LICENSE.txt | 0 iframe.html | 4 ++-- index.json | 2 +- main.39d8a2af.iframe.bundle.js | 2 -- main.4510dedc.iframe.bundle.js | 2 ++ ....LICENSE.txt => main.4510dedc.iframe.bundle.js.LICENSE.txt | 0 project.json | 2 +- runtime~main.06923bbf.iframe.bundle.js | 1 - runtime~main.25663dff.iframe.bundle.js | 1 + stories.json | 2 +- ...documentaion-catalog-catalog-mdx.8fc3b0e6.iframe.bundle.js | 1 + ...documentaion-catalog-catalog-mdx.ba0c3b37.iframe.bundle.js | 1 - ...mentaion-catalog-catalog-stories.59811080.iframe.bundle.js | 1 - ...mentaion-catalog-catalog-stories.a65608eb.iframe.bundle.js | 1 + ...mentaion-changelog-changelog-mdx.7c265166.iframe.bundle.js | 1 - ...mentaion-changelog-changelog-mdx.fed2dfa6.iframe.bundle.js | 1 + ...ntaion-typography-typography-mdx.0ec3d157.iframe.bundle.js | 1 + ...ntaion-typography-typography-mdx.929933ce.iframe.bundle.js | 1 - ...y-typography-migration-guide-mdx.13722fea.iframe.bundle.js | 1 - ...y-typography-migration-guide-mdx.3719c2ef.iframe.bundle.js | 1 + 76 files changed, 50 insertions(+), 47 deletions(-) create mode 100644 components-BaseInput-__stories__-BaseInput-stories.99d4717c.iframe.bundle.js create mode 100644 components-Combobox-__stories__-combobox-stories.3cb8ae07.iframe.bundle.js rename components-Combobox-__stories__-combobox-stories.a01e153f.iframe.bundle.js.LICENSE.txt => components-Combobox-__stories__-combobox-stories.3cb8ae07.iframe.bundle.js.LICENSE.txt (100%) delete mode 100644 components-Combobox-__stories__-combobox-stories.a01e153f.iframe.bundle.js create mode 100644 components-Dropdown-__stories__-dropdown-mdx.5aeb6afa.iframe.bundle.js delete mode 100644 components-Dropdown-__stories__-dropdown-mdx.e5ad051f.iframe.bundle.js create mode 100644 components-Dropdown-__stories__-dropdown-stories.8adb3100.iframe.bundle.js rename components-Dropdown-__stories__-dropdown-stories.a1e8726f.iframe.bundle.js.LICENSE.txt => components-Dropdown-__stories__-dropdown-stories.8adb3100.iframe.bundle.js.LICENSE.txt (100%) delete mode 100644 components-Dropdown-__stories__-dropdown-stories.a1e8726f.iframe.bundle.js rename components-EditableText-__stories__-EditableText-mdx.928d09fd.iframe.bundle.js => components-EditableText-__stories__-EditableText-mdx.1dbcd5f8.iframe.bundle.js (50%) rename components-EditableText-__stories__-EditableText-mdx.928d09fd.iframe.bundle.js.LICENSE.txt => components-EditableText-__stories__-EditableText-mdx.1dbcd5f8.iframe.bundle.js.LICENSE.txt (100%) rename components-EditableText-__stories__-EditableText-stories.23b19d32.iframe.bundle.js => components-EditableText-__stories__-EditableText-stories.94624db0.iframe.bundle.js (55%) rename components-EditableText-__stories__-EditableText-stories.23b19d32.iframe.bundle.js.LICENSE.txt => components-EditableText-__stories__-EditableText-stories.94624db0.iframe.bundle.js.LICENSE.txt (100%) delete mode 100644 components-Heading-__stories__-Heading-mdx.6d3c5272.iframe.bundle.js create mode 100644 components-Heading-__stories__-Heading-mdx.8fc74217.iframe.bundle.js rename components-Heading-__stories__-Heading-mdx.6d3c5272.iframe.bundle.js.LICENSE.txt => components-Heading-__stories__-Heading-mdx.8fc74217.iframe.bundle.js.LICENSE.txt (100%) create mode 100644 components-Heading-__stories__-Heading-stories.d2c661c7.iframe.bundle.js rename components-Heading-__stories__-Heading-stories.f511be28.iframe.bundle.js.LICENSE.txt => components-Heading-__stories__-Heading-stories.d2c661c7.iframe.bundle.js.LICENSE.txt (100%) delete mode 100644 components-Heading-__stories__-Heading-stories.f511be28.iframe.bundle.js delete mode 100644 components-Icon-__stories__-Icon-mdx.1ab25b7f.iframe.bundle.js create mode 100644 components-Icon-__stories__-Icon-mdx.d0b5e131.iframe.bundle.js create mode 100644 components-Icon-__stories__-Icon-stories.027db9f1.iframe.bundle.js delete mode 100644 components-Icon-__stories__-Icon-stories.95510756.iframe.bundle.js rename components-IconButton-__stories__-IconButton-mdx.084ae9b2.iframe.bundle.js => components-IconButton-__stories__-IconButton-mdx.f96bf4e1.iframe.bundle.js (96%) rename components-IconButton-__stories__-IconButton-stories.c1abcefd.iframe.bundle.js => components-IconButton-__stories__-IconButton-stories.2c0cffa4.iframe.bundle.js (94%) delete mode 100644 components-LegacyHeading-__stories__-LegacyHeading-mdx.54646e87.iframe.bundle.js create mode 100644 components-LegacyHeading-__stories__-LegacyHeading-mdx.b6fee607.iframe.bundle.js delete mode 100644 components-LegacyHeading-__stories__-LegacyHeading-stories.4db89ec2.iframe.bundle.js create mode 100644 components-LegacyHeading-__stories__-LegacyHeading-stories.67b3db4b.iframe.bundle.js create mode 100644 components-LegacySearch-__stories__-LegacySearch-mdx.141a9193.iframe.bundle.js create mode 100644 components-LegacySearch-__stories__-LegacySearch-stories.a29d570d.iframe.bundle.js delete mode 100644 components-Loader-__stories__-Loader-mdx.ba6753d8.iframe.bundle.js create mode 100644 components-Loader-__stories__-Loader-mdx.cf97956f.iframe.bundle.js delete mode 100644 components-Loader-__stories__-Loader-stories.40a757e5.iframe.bundle.js create mode 100644 components-Loader-__stories__-Loader-stories.9f2bcc5d.iframe.bundle.js delete mode 100644 components-Menu-Menu-__stories__-Menu-mdx.7ca3dbc2.iframe.bundle.js create mode 100644 components-Menu-Menu-__stories__-Menu-mdx.8c48b300.iframe.bundle.js create mode 100644 components-ResponsiveList-__stories__-ResponsiveList-mdx.607c279a.iframe.bundle.js delete mode 100644 components-ResponsiveList-__stories__-ResponsiveList-mdx.de8e6b69.iframe.bundle.js create mode 100644 components-ResponsiveList-__stories__-ResponsiveList-stories.7d04933a.iframe.bundle.js delete mode 100644 components-ResponsiveList-__stories__-ResponsiveList-stories.8f6a17dd.iframe.bundle.js delete mode 100644 components-Search-__stories__-Search-mdx.9e26d157.iframe.bundle.js create mode 100644 components-Search-__stories__-Search-mdx.a976957e.iframe.bundle.js create mode 100644 components-Search-__stories__-Search-stories.8a89c514.iframe.bundle.js delete mode 100644 components-Search-__stories__-Search-stories.9067731f.iframe.bundle.js create mode 100644 components-Text-__stories__-Text-mdx.121a19b6.iframe.bundle.js rename components-Text-__stories__-Text-mdx.5d569510.iframe.bundle.js.LICENSE.txt => components-Text-__stories__-Text-mdx.121a19b6.iframe.bundle.js.LICENSE.txt (100%) delete mode 100644 components-Text-__stories__-Text-mdx.5d569510.iframe.bundle.js create mode 100644 components-Text-__stories__-Text-stories.0b2e58f6.iframe.bundle.js rename components-Text-__stories__-Text-stories.fd9eeaa9.iframe.bundle.js.LICENSE.txt => components-Text-__stories__-Text-stories.0b2e58f6.iframe.bundle.js.LICENSE.txt (100%) delete mode 100644 components-Text-__stories__-Text-stories.fd9eeaa9.iframe.bundle.js delete mode 100644 hooks-useActiveDescendantListFocus-__stories__-useActiveDescendantListFocus-mdx.98bb86d7.iframe.bundle.js create mode 100644 hooks-useActiveDescendantListFocus-__stories__-useActiveDescendantListFocus-mdx.f5ce7e2f.iframe.bundle.js rename hooks-useActiveDescendantListFocus-__stories__-useActiveDescendantListFocus-mdx.98bb86d7.iframe.bundle.js.LICENSE.txt => hooks-useActiveDescendantListFocus-__stories__-useActiveDescendantListFocus-mdx.f5ce7e2f.iframe.bundle.js.LICENSE.txt (100%) delete mode 100644 hooks-useActiveDescendantListFocus-__stories__-useActiveDescendantListFocus-stories.8ad8a4ea.iframe.bundle.js create mode 100644 hooks-useActiveDescendantListFocus-__stories__-useActiveDescendantListFocus-stories.e1bf8169.iframe.bundle.js rename hooks-useActiveDescendantListFocus-__stories__-useActiveDescendantListFocus-stories.8ad8a4ea.iframe.bundle.js.LICENSE.txt => hooks-useActiveDescendantListFocus-__stories__-useActiveDescendantListFocus-stories.e1bf8169.iframe.bundle.js.LICENSE.txt (100%) delete mode 100644 main.39d8a2af.iframe.bundle.js create mode 100644 main.4510dedc.iframe.bundle.js rename main.39d8a2af.iframe.bundle.js.LICENSE.txt => main.4510dedc.iframe.bundle.js.LICENSE.txt (100%) delete mode 100644 runtime~main.06923bbf.iframe.bundle.js create mode 100644 runtime~main.25663dff.iframe.bundle.js create mode 100644 storybook-stand-alone-documentaion-catalog-catalog-mdx.8fc3b0e6.iframe.bundle.js delete mode 100644 storybook-stand-alone-documentaion-catalog-catalog-mdx.ba0c3b37.iframe.bundle.js delete mode 100644 storybook-stand-alone-documentaion-catalog-catalog-stories.59811080.iframe.bundle.js create mode 100644 storybook-stand-alone-documentaion-catalog-catalog-stories.a65608eb.iframe.bundle.js delete mode 100644 storybook-stand-alone-documentaion-changelog-changelog-mdx.7c265166.iframe.bundle.js create mode 100644 storybook-stand-alone-documentaion-changelog-changelog-mdx.fed2dfa6.iframe.bundle.js create mode 100644 storybook-stand-alone-documentaion-typography-typography-mdx.0ec3d157.iframe.bundle.js delete mode 100644 storybook-stand-alone-documentaion-typography-typography-mdx.929933ce.iframe.bundle.js delete mode 100644 storybook-stand-alone-documentaion-typography-typography-migration-guide-mdx.13722fea.iframe.bundle.js create mode 100644 storybook-stand-alone-documentaion-typography-typography-migration-guide-mdx.3719c2ef.iframe.bundle.js diff --git a/components-BaseInput-__stories__-BaseInput-stories.99d4717c.iframe.bundle.js b/components-BaseInput-__stories__-BaseInput-stories.99d4717c.iframe.bundle.js new file mode 100644 index 0000000000..b128b0afd0 --- /dev/null +++ b/components-BaseInput-__stories__-BaseInput-stories.99d4717c.iframe.bundle.js @@ -0,0 +1 @@ +"use strict";(globalThis.webpackChunkmonday_ui_react_core=globalThis.webpackChunkmonday_ui_react_core||[]).push([[7651],{"./src/components/BaseInput/__stories__/BaseInput.stories.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{Overview:()=>Overview,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});var _storybook__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./src/storybook/functions/createStoryMetaSettingsDecorator.ts"),vibe_storybook_components__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("../storybook-blocks/dist/src/functions/createComponentTemplate.js"),_BaseInput__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/components/BaseInput/BaseInput.tsx"),metaSettings=(0,_storybook__WEBPACK_IMPORTED_MODULE_0__.B)({component:_BaseInput__WEBPACK_IMPORTED_MODULE_1__.A});const __WEBPACK_DEFAULT_EXPORT__={title:"Internal/BaseInput",component:_BaseInput__WEBPACK_IMPORTED_MODULE_1__.A,argTypes:metaSettings.argTypes,decorators:metaSettings.decorators,tags:["internal"]};var Overview={render:(0,vibe_storybook_components__WEBPACK_IMPORTED_MODULE_2__.M)(_BaseInput__WEBPACK_IMPORTED_MODULE_1__.A).bind({})};Overview.parameters={...Overview.parameters,docs:{...Overview.parameters?.docs,source:{originalSource:"{\n render: baseInputTemplate.bind({})\n}",...Overview.parameters?.docs?.source}}};const __namedExportsOrder=["Overview"]},"../storybook-blocks/dist/src/functions/createComponentTemplate.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{M:()=>r});var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/react/jsx-runtime.js");function r(r){return function(e){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(r,Object.assign({},e))}}}}]); \ No newline at end of file diff --git a/components-Combobox-__stories__-combobox-stories.3cb8ae07.iframe.bundle.js b/components-Combobox-__stories__-combobox-stories.3cb8ae07.iframe.bundle.js new file mode 100644 index 0000000000..8bc14e1a2b --- /dev/null +++ b/components-Combobox-__stories__-combobox-stories.3cb8ae07.iframe.bundle.js @@ -0,0 +1,2 @@ +/*! For license information please see components-Combobox-__stories__-combobox-stories.3cb8ae07.iframe.bundle.js.LICENSE.txt */ +"use strict";(globalThis.webpackChunkmonday_ui_react_core=globalThis.webpackChunkmonday_ui_react_core||[]).push([[8507],{"./src/components/Combobox/__stories__/combobox.stories.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{ComboboxAsPersonPicker:()=>ComboboxAsPersonPicker,ComboboxInsideADialog:()=>ComboboxInsideADialog,Default:()=>Default,LoadingState:()=>LoadingState,Overview:()=>Overview,Sizes:()=>Sizes,WithButton:()=>WithButton,WithCategories:()=>WithCategories,WithCreation:()=>WithCreation,WithIcons:()=>WithIcons,WithOptionRenderer:()=>WithOptionRenderer,WithVirtualizationOptimization:()=>WithVirtualizationOptimization,__namedExportsOrder:()=>__namedExportsOrder,default:()=>Combobox_stories_combobox_stories});var react=__webpack_require__("../../node_modules/react/index.js"),story_description=__webpack_require__("../storybook-blocks/dist/src/components/story-description/story-description.js"),Combobox=__webpack_require__("./src/components/Combobox/Combobox.tsx");const person1_namespaceObject=__webpack_require__.p+"static/media/person1.de30c8ee.png",person2_namespaceObject=__webpack_require__.p+"static/media/person2.2c51a581.png",person3_namespaceObject=__webpack_require__.p+"static/media/person3.7ed20eb8.png";var dist=__webpack_require__("../../node_modules/@storybook/jest/dist/index.mjs"),testing_library_dist=__webpack_require__("../../node_modules/@storybook/testing-library/dist/index.mjs"),interactions_helper=__webpack_require__("./src/__tests__/interactions-helper.ts"),interactions_utils=__webpack_require__("./src/tests/interactions-utils.ts"),test_ids_utils=__webpack_require__("./src/tests/test-ids-utils.ts"),constants=__webpack_require__("./src/tests/constants.ts");function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function _regeneratorRuntime(){_regeneratorRuntime=function _regeneratorRuntime(){return e};var t,e={},r=Object.prototype,n=r.hasOwnProperty,o=Object.defineProperty||function(t,e,r){t[e]=r.value},i="function"==typeof Symbol?Symbol:{},a=i.iterator||"@@iterator",c=i.asyncIterator||"@@asyncIterator",u=i.toStringTag||"@@toStringTag";function define(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{define({},"")}catch(t){define=function define(t,e,r){return t[e]=r}}function wrap(t,e,r,n){var i=e&&e.prototype instanceof Generator?e:Generator,a=Object.create(i.prototype),c=new Context(n||[]);return o(a,"_invoke",{value:makeInvokeMethod(t,r,c)}),a}function tryCatch(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}e.wrap=wrap;var h="suspendedStart",l="suspendedYield",f="executing",s="completed",y={};function Generator(){}function GeneratorFunction(){}function GeneratorFunctionPrototype(){}var p={};define(p,a,(function(){return this}));var d=Object.getPrototypeOf,v=d&&d(d(values([])));v&&v!==r&&n.call(v,a)&&(p=v);var g=GeneratorFunctionPrototype.prototype=Generator.prototype=Object.create(p);function defineIteratorMethods(t){["next","throw","return"].forEach((function(e){define(t,e,(function(t){return this._invoke(e,t)}))}))}function AsyncIterator(t,e){function invoke(r,o,i,a){var c=tryCatch(t[r],t,o);if("throw"!==c.type){var u=c.arg,h=u.value;return h&&"object"==_typeof(h)&&n.call(h,"__await")?e.resolve(h.__await).then((function(t){invoke("next",t,i,a)}),(function(t){invoke("throw",t,i,a)})):e.resolve(h).then((function(t){u.value=t,i(u)}),(function(t){return invoke("throw",t,i,a)}))}a(c.arg)}var r;o(this,"_invoke",{value:function value(t,n){function callInvokeWithMethodAndArg(){return new e((function(e,r){invoke(t,n,e,r)}))}return r=r?r.then(callInvokeWithMethodAndArg,callInvokeWithMethodAndArg):callInvokeWithMethodAndArg()}})}function makeInvokeMethod(e,r,n){var o=h;return function(i,a){if(o===f)throw Error("Generator is already running");if(o===s){if("throw"===i)throw a;return{value:t,done:!0}}for(n.method=i,n.arg=a;;){var c=n.delegate;if(c){var u=maybeInvokeDelegate(c,n);if(u){if(u===y)continue;return u}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if(o===h)throw o=s,n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);o=f;var p=tryCatch(e,r,n);if("normal"===p.type){if(o=n.done?s:l,p.arg===y)continue;return{value:p.arg,done:n.done}}"throw"===p.type&&(o=s,n.method="throw",n.arg=p.arg)}}}function maybeInvokeDelegate(e,r){var n=r.method,o=e.iterator[n];if(o===t)return r.delegate=null,"throw"===n&&e.iterator.return&&(r.method="return",r.arg=t,maybeInvokeDelegate(e,r),"throw"===r.method)||"return"!==n&&(r.method="throw",r.arg=new TypeError("The iterator does not provide a '"+n+"' method")),y;var i=tryCatch(o,e.iterator,r.arg);if("throw"===i.type)return r.method="throw",r.arg=i.arg,r.delegate=null,y;var a=i.arg;return a?a.done?(r[e.resultName]=a.value,r.next=e.nextLoc,"return"!==r.method&&(r.method="next",r.arg=t),r.delegate=null,y):a:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function pushTryEntry(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function resetTryEntry(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function Context(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(pushTryEntry,this),this.reset(!0)}function values(e){if(e||""===e){var r=e[a];if(r)return r.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var o=-1,i=function next(){for(;++o=0;--o){var i=this.tryEntries[o],a=i.completion;if("root"===i.tryLoc)return handle("end");if(i.tryLoc<=this.prev){var c=n.call(i,"catchLoc"),u=n.call(i,"finallyLoc");if(c&&u){if(this.prev=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),resetTryEntry(r),y}},catch:function _catch(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;resetTryEntry(r)}return o}}throw Error("illegal catch attempt")},delegateYield:function delegateYield(e,r,n){return this.delegate={iterator:values(e),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=t),y}},e}function asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg),value=info.value}catch(error){return void reject(error)}info.done?resolve(value):Promise.resolve(value).then(_next,_throw)}function _asyncToGenerator(fn){return function(){var self=this,args=arguments;return new Promise((function(resolve,reject){var gen=fn.apply(self,args);function _next(value){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"next",value)}function _throw(err){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"throw",err)}_next(void 0)}))}}function getComponentElements(_x){return _getComponentElements.apply(this,arguments)}function _getComponentElements(){return(_getComponentElements=_asyncToGenerator(_regeneratorRuntime().mark((function _callee2(canvas){var comboboxElement,searchElement;return _regeneratorRuntime().wrap((function _callee2$(_context2){for(;;)switch(_context2.prev=_context2.next){case 0:return comboboxElement=(0,interactions_utils.h5)(canvas,constants.w.COMBOBOX),searchElement=(0,interactions_utils.NX)(comboboxElement,"Search for content"),_context2.abrupt("return",{comboboxElement,searchElement});case 3:case"end":return _context2.stop()}}),_callee2)})))).apply(this,arguments)}function _onTypeFilterComboboxOptionsTest(){return(_onTypeFilterComboboxOptionsTest=_asyncToGenerator(_regeneratorRuntime().mark((function _callee3(canvas){var _yield$getComponentEl,comboboxElement,searchElement;return _regeneratorRuntime().wrap((function _callee3$(_context3){for(;;)switch(_context3.prev=_context3.next){case 0:return _context3.next=2,getComponentElements(canvas);case 2:return _yield$getComponentEl=_context3.sent,comboboxElement=_yield$getComponentEl.comboboxElement,searchElement=_yield$getComponentEl.searchElement,_context3.next=7,(0,interactions_utils.wQ)(searchElement,"jjj",400);case 7:(0,dist.E)((0,testing_library_dist.D3)(comboboxElement,"Option 1")).toBeNull();case 8:case"end":return _context3.stop()}}),_callee3)})))).apply(this,arguments)}function _onSelectExistFilterClearsFilterTest(){return(_onSelectExistFilterClearsFilterTest=_asyncToGenerator(_regeneratorRuntime().mark((function _callee4(canvas){var _yield$getComponentEl2,comboboxElement,searchElement,cleanSearchButton,option1;return _regeneratorRuntime().wrap((function _callee4$(_context4){for(;;)switch(_context4.prev=_context4.next){case 0:return _context4.next=2,getComponentElements(canvas);case 2:return _yield$getComponentEl2=_context4.sent,comboboxElement=_yield$getComponentEl2.comboboxElement,searchElement=_yield$getComponentEl2.searchElement,_context4.next=7,(0,interactions_utils.wQ)(searchElement,"jjj",400);case 7:return cleanSearchButton=(0,interactions_utils.h5)(comboboxElement,(0,test_ids_utils.G)(constants.w.CLEAN_SEARCH_BUTTON,"combobox-search")),_context4.next=10,(0,interactions_utils.jp)(cleanSearchButton);case 10:(0,dist.E)(searchElement).toHaveValue(""),option1=(0,interactions_utils.Tf)(comboboxElement,"Option 1"),(0,dist.E)(option1).toBeInTheDocument();case 13:case"end":return _context4.stop()}}),_callee4)})))).apply(this,arguments)}function _onNavigateBetweenOptionsByArrowsAriaUpdates(){return(_onNavigateBetweenOptionsByArrowsAriaUpdates=_asyncToGenerator(_regeneratorRuntime().mark((function _callee6(canvas){var _yield$getComponentEl4,comboboxElement,searchElement,option1,ariaActiveDescendant,option2;return _regeneratorRuntime().wrap((function _callee6$(_context6){for(;;)switch(_context6.prev=_context6.next){case 0:return _context6.next=2,getComponentElements(canvas);case 2:return _yield$getComponentEl4=_context6.sent,comboboxElement=_yield$getComponentEl4.comboboxElement,searchElement=_yield$getComponentEl4.searchElement,_context6.next=7,(0,interactions_utils.jp)(searchElement);case 7:return _context6.next=9,(0,interactions_utils.vZ)(constants.G.DOWN_ARROW);case 9:return option1=(0,interactions_utils.Tf)(comboboxElement,"Option 1").parentElement,ariaActiveDescendant=searchElement.getAttribute("aria-activedescendant"),(0,dist.E)(ariaActiveDescendant).toEqual(option1.id),_context6.next=14,(0,interactions_utils.vZ)(constants.G.DOWN_ARROW);case 14:return option2=(0,interactions_utils.Tf)(comboboxElement,"Option 2").parentElement,ariaActiveDescendant=searchElement.getAttribute("aria-activedescendant"),(0,dist.E)(ariaActiveDescendant).toEqual(option2.id),_context6.next=19,(0,interactions_utils.vZ)(constants.G.UP_ARROW);case 19:ariaActiveDescendant=searchElement.getAttribute("aria-activedescendant"),(0,dist.E)(ariaActiveDescendant).toEqual(option1.id);case 21:case"end":return _context6.stop()}}),_callee6)})))).apply(this,arguments)}var _afterEach,defaultPlaySuite=(0,interactions_utils.Ld)({tests:[function onNavigateBetweenOptionsByArrowsAriaUpdates(_x5){return _onNavigateBetweenOptionsByArrowsAriaUpdates.apply(this,arguments)},function onTypeFilterComboboxOptionsTest(_x2){return _onTypeFilterComboboxOptionsTest.apply(this,arguments)},function onSelectExistFilterClearsFilterTest(_x3){return _onSelectExistFilterClearsFilterTest.apply(this,arguments)}],afterEach:(_afterEach=_asyncToGenerator(_regeneratorRuntime().mark((function _callee(){return _regeneratorRuntime().wrap((function _callee$(_context){for(;;)switch(_context.prev=_context.next){case 0:return _context.next=2,(0,interactions_helper.S)();case 2:case"end":return _context.stop()}}),_callee)}))),function afterEach(){return _afterEach.apply(this,arguments)})}),DialogContentContainer=__webpack_require__("./src/components/DialogContentContainer/DialogContentContainer.tsx"),Button=__webpack_require__("./src/components/Button/Button.tsx"),Dialog=__webpack_require__("./src/components/Dialog/Dialog.tsx"),Wand=__webpack_require__("./src/components/Icon/Icons/components/Wand.tsx"),ThumbsUp=__webpack_require__("./src/components/Icon/Icons/components/ThumbsUp.tsx"),Time=__webpack_require__("./src/components/Icon/Icons/components/Time.tsx"),Update=__webpack_require__("./src/components/Icon/Icons/components/Update.tsx"),Upgrade=__webpack_require__("./src/components/Icon/Icons/components/Upgrade.tsx"),Person=__webpack_require__("./src/components/Icon/Icons/components/Person.tsx"),Edit=__webpack_require__("./src/components/Icon/Icons/components/Edit.tsx"),Avatar=__webpack_require__("./src/components/Avatar/Avatar.tsx"),Flex=__webpack_require__("./src/components/Flex/Flex.tsx"),jsx_runtime=__webpack_require__("../../node_modules/react/jsx-runtime.js"),optionRenderer=function optionRenderer(_ref){var src=_ref.src,id=_ref.id,label=_ref.label,position=_ref.position;return(0,jsx_runtime.jsxs)("div",{className:"person-picker-mock-option",children:[(0,jsx_runtime.jsx)(Avatar.A,{customSize:22,src,type:Avatar.A.types.IMG},id),(0,jsx_runtime.jsxs)("span",{className:"person-picker-mock-name",children:[label,(0,jsx_runtime.jsx)("span",{children:position})]})]})};optionRenderer.displayName="optionRenderer",optionRenderer.__docgenInfo={description:"",methods:[],displayName:"optionRenderer"};var createStoryMetaSettingsDecorator=__webpack_require__("./src/storybook/functions/createStoryMetaSettingsDecorator.ts"),Icon=__webpack_require__("./src/components/Icon/Icon.tsx"),injectStylesIntoStyleTag=__webpack_require__("../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),styleDomAPI=__webpack_require__("../../node_modules/style-loader/dist/runtime/styleDomAPI.js"),styleDomAPI_default=__webpack_require__.n(styleDomAPI),insertBySelector=__webpack_require__("../../node_modules/style-loader/dist/runtime/insertBySelector.js"),insertBySelector_default=__webpack_require__.n(insertBySelector),setAttributesWithoutAttributes=__webpack_require__("../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),setAttributesWithoutAttributes_default=__webpack_require__.n(setAttributesWithoutAttributes),insertStyleElement=__webpack_require__("../../node_modules/style-loader/dist/runtime/insertStyleElement.js"),insertStyleElement_default=__webpack_require__.n(insertStyleElement),styleTagTransform=__webpack_require__("../../node_modules/style-loader/dist/runtime/styleTagTransform.js"),styleTagTransform_default=__webpack_require__.n(styleTagTransform),combobox_stories=__webpack_require__("../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[15].use[1]!../../node_modules/resolve-url-loader/index.js!../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[15].use[3]!./src/components/Combobox/__stories__/combobox.stories.scss"),options={};options.styleTagTransform=styleTagTransform_default(),options.setAttributes=setAttributesWithoutAttributes_default(),options.insert=insertBySelector_default().bind(null,"head"),options.domAPI=styleDomAPI_default(),options.insertStyleElement=insertStyleElement_default();injectStylesIntoStyleTag_default()(combobox_stories.A,options);combobox_stories.A&&combobox_stories.A.locals&&combobox_stories.A.locals;function combobox_stories_typeof(o){return combobox_stories_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},combobox_stories_typeof(o)}function _toConsumableArray(arr){return function _arrayWithoutHoles(arr){if(Array.isArray(arr))return _arrayLikeToArray(arr)}(arr)||function _iterableToArray(iter){if("undefined"!=typeof Symbol&&null!=iter[Symbol.iterator]||null!=iter["@@iterator"])return Array.from(iter)}(arr)||_unsupportedIterableToArray(arr)||function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(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)||_unsupportedIterableToArray(arr,i)||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.")}()}function _unsupportedIterableToArray(o,minLen){if(o){if("string"==typeof o)return _arrayLikeToArray(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)?_arrayLikeToArray(o,minLen):void 0}}function _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i alert("clicked"),\n placeholder: "Placeholder text here",\n clearFilterOnSelection: true\n }\n}',...Overview.parameters?.docs?.source}}},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1"\n }, {\n id: "2",\n label: "Option 2"\n }, {\n id: "3",\n label: "Option 3"\n }], []);\n return ;\n },\n name: "Default",\n play: defaultPlaySuite\n}',...Default.parameters?.docs?.source}}},ComboboxInsideADialog.parameters={...ComboboxInsideADialog.parameters,docs:{...ComboboxInsideADialog.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1"\n }, {\n id: "2",\n label: "Option 2"\n }, {\n id: "3",\n label: "Option 3"\n }, {\n id: "4",\n label: "Option 4"\n }, {\n id: "5",\n label: "Option 5"\n }], []);\n return \n \n ;\n },\n name: "Combobox inside a dialog"\n}',...ComboboxInsideADialog.parameters?.docs?.source}}},Sizes.parameters={...Sizes.parameters,docs:{...Sizes.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1"\n }, {\n id: "2",\n label: "Option 2"\n }, {\n id: "3",\n label: "Option 3"\n }, {\n id: "4",\n label: "Option 4"\n }, {\n id: "5",\n label: "Option 5"\n }], []);\n return
\n \n \n \n \n \n \n \n \n \n
;\n },\n name: "Sizes"\n}',...Sizes.parameters?.docs?.source}}},WithCategories.parameters={...WithCategories.parameters,docs:{...WithCategories.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Favorites",\n categoryId: "favorites"\n }, {\n id: "2",\n label: "Main workspace",\n categoryId: "workspace"\n }, {\n id: "3",\n label: "Client Foundations",\n categoryId: "workspace"\n }, {\n id: "4",\n label: "Design",\n categoryId: "workspace"\n }, {\n id: "5",\n label: "Marketing Cluster",\n categoryId: "workspace"\n }, {\n id: "6",\n label: "Mobile",\n categoryId: "workspace"\n }], []);\n const categories = useMemo(() => ({\n favorites: {\n id: "favorites",\n label: "Favorites"\n },\n workspace: {\n id: "Workspaces",\n label: "Workspaces"\n }\n }), []);\n return \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n ;\n },\n name: "With categories"\n}',...WithCategories.parameters?.docs?.source}}},WithIcons.parameters={...WithIcons.parameters,docs:{...WithIcons.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1",\n leftIcon: Wand\n }, {\n id: "2",\n label: "Option 2",\n leftIcon: ThumbsUp\n }, {\n id: "3",\n label: "Option 3",\n leftIcon: Time\n }, {\n id: "4",\n label: "Option 4",\n leftIcon: Update\n }, {\n id: "5",\n label: "Option 5",\n leftIcon: Upgrade\n }], []);\n return \n \n ;\n },\n name: "With icons"\n}',...WithIcons.parameters?.docs?.source}}},WithOptionRenderer.parameters={...WithOptionRenderer.parameters,docs:{...WithOptionRenderer.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1"\n }, {\n id: "2",\n label: "Option 2"\n }, {\n id: "3",\n label: "Option 3"\n }, {\n id: "4",\n label: "Option 4"\n }, {\n id: "5",\n label: "Option 5"\n }, {\n id: "6",\n label: "Option 6"\n }, {\n id: "7",\n label: "Option 7"\n }, {\n id: "8",\n label: "Option 8"\n }, {\n id: "9",\n label: "Option 9"\n }], []);\n const optionRenderer = option =>
\n I can render anything with {option.label}\n
;\n return \n \n ;\n },\n name: "With optionRenderer"\n}',...WithOptionRenderer.parameters?.docs?.source}}},WithButton.parameters={...WithButton.parameters,docs:{...WithButton.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1",\n leftIcon: Wand\n }, {\n id: "2",\n label: "Option 2",\n leftIcon: ThumbsUp\n }, {\n id: "3",\n label: "Option 3",\n leftIcon: Time\n }, {\n id: "4",\n label: "Option 4",\n leftIcon: Update\n }, {\n id: "5",\n label: "Option 5",\n leftIcon: Upgrade\n }], []);\n return \n \n \n ;\n },\n name: "With Button"\n}',...WithButton.parameters?.docs?.source}}},WithCreation.parameters={...WithCreation.parameters,docs:{...WithCreation.parameters?.docs,source:{originalSource:'{\n render: () => {\n const [options, setOptions] = useState([]);\n return \n setOptions([...options, {\n id: options.length + 1,\n label: `Option: ${options.length + 1}`\n }])} />\n ;\n },\n name: "With Creation"\n}',...WithCreation.parameters?.docs?.source}}},WithVirtualizationOptimization.parameters={...WithVirtualizationOptimization.parameters,docs:{...WithVirtualizationOptimization.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1",\n categoryId: "Group1"\n }, {\n id: "2",\n label: "Option 2",\n categoryId: "Group1"\n }, {\n id: "3",\n label: "Option 3",\n categoryId: "Group1"\n }, {\n id: "4",\n label: "Option 4",\n categoryId: "Group1"\n }, {\n id: "5",\n label: "Option 5",\n categoryId: "Group1"\n }, {\n id: "6",\n label: "Option 6",\n categoryId: "Group1"\n }, {\n id: "7",\n label: "Option 7",\n categoryId: "Group1"\n }, {\n id: "8",\n label: "Option 8",\n categoryId: "Group1"\n }, {\n id: "9",\n label: "Option 9",\n categoryId: "Group1"\n }, {\n id: "10",\n label: "Option 10",\n categoryId: "Group2"\n }, {\n id: "11",\n label: "Option 11",\n categoryId: "Group2"\n }, {\n id: "12",\n label: "Option 12",\n categoryId: "Group2"\n }, {\n id: "13",\n label: "Option 13",\n categoryId: "Group2"\n }, {\n id: "14",\n label: "Option 14",\n categoryId: "Group2"\n }, {\n id: "15",\n label: "Option 15",\n categoryId: "Group2"\n }, {\n id: "16",\n label: "Option 16",\n categoryId: "Group2"\n }, {\n id: "17",\n label: "Option 17",\n categoryId: "Group2"\n }, {\n id: "18",\n label: "Option 18",\n categoryId: "Group2"\n }, {\n id: "19",\n label: "Option 19",\n categoryId: "Group2"\n }, {\n id: "20",\n label: "Option 20",\n categoryId: "Group2"\n }], []);\n const categories = useMemo(() => ({\n Group1: {\n id: "Group1",\n label: "Group 1"\n },\n Group2: {\n id: "Group2",\n label: "Group 2"\n }\n }), []);\n return \n \n
\n \n \n \n
\n \n \n
\n \n \n \n
\n \n \n
\n \n \n \n
\n \n ;\n },\n name: "With virtualization optimization"\n}',...WithVirtualizationOptimization.parameters?.docs?.source}}},LoadingState.parameters={...LoadingState.parameters,docs:{...LoadingState.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [], []);\n return \n \n ;\n },\n name: "Loading state"\n}',...LoadingState.parameters?.docs?.source}}},ComboboxAsPersonPicker.parameters={...ComboboxAsPersonPicker.parameters,docs:{...ComboboxAsPersonPicker.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "Hadas Farhi",\n label: "Hadas Farhi",\n src: person1,\n type: Avatar.types.IMG,\n position: "(Frontend Developer)",\n categoryId: "suggestedPeople"\n }, {\n id: "Rotem Dekel",\n label: "Rotem Dekel",\n src: person2,\n type: Avatar.types.IMG,\n position: "(Product Designer)",\n categoryId: "suggestedPeople"\n }, {\n id: "Netta Muller",\n label: "Netta Muller",\n src: person3,\n type: Avatar.types.IMG,\n position: "(Brand Designer)",\n categoryId: "suggestedPeople"\n }], []);\n const categories = useMemo(() => ({\n suggestedPeople: {\n id: "suggestedPeople",\n label: "Suggested people"\n }\n }), []);\n return \n \n \n } tooltip position={Dialog.positions.BOTTOM} open={true}>\n
\n \n
\n \n ;\n },\n name: "Combobox as person picker"\n}',...ComboboxAsPersonPicker.parameters?.docs?.source}}};const __namedExportsOrder=["Overview","Default","ComboboxInsideADialog","Sizes","WithCategories","WithIcons","WithOptionRenderer","WithButton","WithCreation","WithVirtualizationOptimization","LoadingState","ComboboxAsPersonPicker"]},"../storybook-blocks/dist/src/components/story-description/story-description.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>p});var jsx_runtime=__webpack_require__("../../node_modules/react/jsx-runtime.js"),react=__webpack_require__("../../node_modules/react/index.js"),classnames=__webpack_require__("../../node_modules/classnames/index.js"),classnames_default=__webpack_require__.n(classnames),withStaticProps=__webpack_require__("../storybook-blocks/dist/src/types/withStaticProps.js"),FlexConstants=__webpack_require__("../storybook-blocks/dist/src/helpers/components/Flex/FlexConstants.js"),Flex=__webpack_require__("../storybook-blocks/dist/src/helpers/components/Flex/Flex.js"),e_description="story-description-module_description__yFjQO",e_vertical="story-description-module_vertical__C1SJj";function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function _defineProperty(obj,key,value){return key=function _toPropertyKey(t){var i=function _toPrimitive(t,r){if("object"!=_typeof(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(t)}(t,"string");return"symbol"==_typeof(i)?i:i+""}(key),key in obj?Object.defineProperty(obj,key,{value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}var p=(0,withStaticProps.N)((function m(t){var o,l,n,_t$description=t.description,a=void 0===_t$description?"":_t$description,p=t.headerStyle,u=t.children,_t$vertical=t.vertical,v=void 0!==_t$vertical&&_t$vertical,f=t.className,j=t.align,_t$justify=t.justify,g=void 0===_t$justify?null===(o=m.justify)||void 0===o?void 0:o.START:_t$justify,h=t.headerAlign,y=t.headerJustify,x=(0,react.useMemo)((function(){var i,s;return v?null===(i=m.directions)||void 0===i?void 0:i.COLUMN:null===(s=m.directions)||void 0===s?void 0:s.ROW}),[v]);return(0,jsx_runtime.jsxs)(Flex.A,{direction:x,gap:null===(l=m.gaps)||void 0===l?void 0:l.MEDIUM,justify:g,align:j||void 0,className:f,children:[(0,jsx_runtime.jsx)(Flex.A,{className:classnames_default()(e_description,_defineProperty({},e_vertical,v)),style:Object.assign({width:"120px"},p),justify:y,align:h||(null===(n=m.align)||void 0===n?void 0:n.CENTER),children:a}),u]})}),{justify:FlexConstants.aP,align:FlexConstants.xB,gaps:FlexConstants.Us,directions:FlexConstants.bo})},"./src/__tests__/interactions-helper.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{S:()=>resetFocus});var _storybook_testing_library__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/@storybook/testing-library/dist/index.mjs");function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function _regeneratorRuntime(){_regeneratorRuntime=function _regeneratorRuntime(){return e};var t,e={},r=Object.prototype,n=r.hasOwnProperty,o=Object.defineProperty||function(t,e,r){t[e]=r.value},i="function"==typeof Symbol?Symbol:{},a=i.iterator||"@@iterator",c=i.asyncIterator||"@@asyncIterator",u=i.toStringTag||"@@toStringTag";function define(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{define({},"")}catch(t){define=function define(t,e,r){return t[e]=r}}function wrap(t,e,r,n){var i=e&&e.prototype instanceof Generator?e:Generator,a=Object.create(i.prototype),c=new Context(n||[]);return o(a,"_invoke",{value:makeInvokeMethod(t,r,c)}),a}function tryCatch(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}e.wrap=wrap;var h="suspendedStart",l="suspendedYield",f="executing",s="completed",y={};function Generator(){}function GeneratorFunction(){}function GeneratorFunctionPrototype(){}var p={};define(p,a,(function(){return this}));var d=Object.getPrototypeOf,v=d&&d(d(values([])));v&&v!==r&&n.call(v,a)&&(p=v);var g=GeneratorFunctionPrototype.prototype=Generator.prototype=Object.create(p);function defineIteratorMethods(t){["next","throw","return"].forEach((function(e){define(t,e,(function(t){return this._invoke(e,t)}))}))}function AsyncIterator(t,e){function invoke(r,o,i,a){var c=tryCatch(t[r],t,o);if("throw"!==c.type){var u=c.arg,h=u.value;return h&&"object"==_typeof(h)&&n.call(h,"__await")?e.resolve(h.__await).then((function(t){invoke("next",t,i,a)}),(function(t){invoke("throw",t,i,a)})):e.resolve(h).then((function(t){u.value=t,i(u)}),(function(t){return invoke("throw",t,i,a)}))}a(c.arg)}var r;o(this,"_invoke",{value:function value(t,n){function callInvokeWithMethodAndArg(){return new e((function(e,r){invoke(t,n,e,r)}))}return r=r?r.then(callInvokeWithMethodAndArg,callInvokeWithMethodAndArg):callInvokeWithMethodAndArg()}})}function makeInvokeMethod(e,r,n){var o=h;return function(i,a){if(o===f)throw Error("Generator is already running");if(o===s){if("throw"===i)throw a;return{value:t,done:!0}}for(n.method=i,n.arg=a;;){var c=n.delegate;if(c){var u=maybeInvokeDelegate(c,n);if(u){if(u===y)continue;return u}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if(o===h)throw o=s,n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);o=f;var p=tryCatch(e,r,n);if("normal"===p.type){if(o=n.done?s:l,p.arg===y)continue;return{value:p.arg,done:n.done}}"throw"===p.type&&(o=s,n.method="throw",n.arg=p.arg)}}}function maybeInvokeDelegate(e,r){var n=r.method,o=e.iterator[n];if(o===t)return r.delegate=null,"throw"===n&&e.iterator.return&&(r.method="return",r.arg=t,maybeInvokeDelegate(e,r),"throw"===r.method)||"return"!==n&&(r.method="throw",r.arg=new TypeError("The iterator does not provide a '"+n+"' method")),y;var i=tryCatch(o,e.iterator,r.arg);if("throw"===i.type)return r.method="throw",r.arg=i.arg,r.delegate=null,y;var a=i.arg;return a?a.done?(r[e.resultName]=a.value,r.next=e.nextLoc,"return"!==r.method&&(r.method="next",r.arg=t),r.delegate=null,y):a:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function pushTryEntry(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function resetTryEntry(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function Context(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(pushTryEntry,this),this.reset(!0)}function values(e){if(e||""===e){var r=e[a];if(r)return r.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var o=-1,i=function next(){for(;++o=0;--o){var i=this.tryEntries[o],a=i.completion;if("root"===i.tryLoc)return handle("end");if(i.tryLoc<=this.prev){var c=n.call(i,"catchLoc"),u=n.call(i,"finallyLoc");if(c&&u){if(this.prev=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),resetTryEntry(r),y}},catch:function _catch(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;resetTryEntry(r)}return o}}throw Error("illegal catch attempt")},delegateYield:function delegateYield(e,r,n){return this.delegate={iterator:values(e),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=t),y}},e}function asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg),value=info.value}catch(error){return void reject(error)}info.done?resolve(value):Promise.resolve(value).then(_next,_throw)}function resetFocus(){return _resetFocus.apply(this,arguments)}function _resetFocus(){return _resetFocus=function _asyncToGenerator(fn){return function(){var self=this,args=arguments;return new Promise((function(resolve,reject){var gen=fn.apply(self,args);function _next(value){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"next",value)}function _throw(err){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"throw",err)}_next(void 0)}))}}(_regeneratorRuntime().mark((function _callee(){var focusTrap;return _regeneratorRuntime().wrap((function _callee$(_context){for(;;)switch(_context.prev=_context.next){case 0:return focusTrap=document.querySelector("[data-testid=focusTrap]"),_context.next=3,_storybook_testing_library__WEBPACK_IMPORTED_MODULE_0__.Q4.click(focusTrap);case 3:case"end":return _context.stop()}}),_callee)}))),_resetFocus.apply(this,arguments)}},"../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[15].use[1]!../../node_modules/resolve-url-loader/index.js!../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[15].use[3]!./src/components/Combobox/__stories__/combobox.stories.scss":(module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/css-loader/dist/runtime/sourceMaps.js"),_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__),_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../../node_modules/css-loader/dist/runtime/api.js"),___CSS_LOADER_EXPORT___=__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__)()(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default());___CSS_LOADER_EXPORT___.push([module.id,".combobox-stories-styles_virtualized-description{width:300px}.combobox-stories-styles_category-wrapper{width:300px}.combobox-stories-styles_row{display:flex;flex-direction:row;gap:50px}.combobox-stories-styles_btn-group{display:flex;justify-content:space-between}.combobox-stories-styles_wrapper{width:300px;padding:16px}.combobox-stories-styles_btn{width:100%}.combobox-stories-styles_big-figure figure{height:270px}.person-picker-mock{display:flex;justify-content:center;align-items:center;border:1px solid;border-radius:var(--sb-border-radius-small);padding:var(--sb-spacing-xs);background-color:var(--sb-primary-selected-color);border-color:var(--sb-primary-color);width:97px;height:34px}.person-picker-mock-option{display:flex;align-items:center;justify-content:center}.person-picker-mock-name{padding:0 8px;font-size:13px}.person-picker-mock-name span{color:var(--sb-secondary-text-color);margin-left:4px}","",{version:3,sources:["webpack://./src/components/Combobox/__stories__/combobox.stories.scss"],names:[],mappings:"AAGE,iDACE,WAAA,CAEF,0CACE,WAAA,CAGF,6BACE,YAAA,CACA,kBAAA,CACA,QAAA,CAGF,mCACE,YAAA,CACA,6BAAA,CAGF,iCACE,WAAA,CACA,YAAA,CAGF,6BACE,UAAA,CAIA,2CACE,YAAA,CAKN,oBACE,YAAA,CACA,sBAAA,CACA,kBAAA,CACA,gBAAA,CACA,2CAAA,CACA,4BAAA,CACA,iDAAA,CACA,oCAAA,CACA,UAAA,CACA,WAAA,CAEA,2BACE,YAAA,CACA,kBAAA,CACA,sBAAA,CAEF,yBACE,aAAA,CACA,cAAA,CAEA,8BACE,oCAAA,CACA,eAAA",sourcesContent:['@import "../../../styles/states";\n\n.combobox-stories-styles {\n &_virtualized-description {\n width: 300px\n }\n &_category-wrapper {\n width: 300px;\n }\n\n &_row {\n display: flex;\n flex-direction: row;\n gap: 50px;\n }\n\n &_btn-group {\n display: flex;\n justify-content: space-between;\n }\n\n &_wrapper {\n width: 300px;\n padding: 16px;\n }\n\n &_btn {\n width: 100%;\n }\n\n &_big-figure {\n figure {\n height: 270px;\n }\n }\n}\n\n.person-picker-mock {\n display: flex;\n justify-content: center;\n align-items: center;\n border: 1px solid;\n border-radius: var(--sb-border-radius-small);\n padding: var(--sb-spacing-xs);\n background-color: var(--sb-primary-selected-color);\n border-color: var(--sb-primary-color);\n width: 97px;\n height: 34px;\n\n &-option {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n &-name {\n padding: 0 8px;\n font-size: 13px;\n\n span {\n color: var(--sb-secondary-text-color);\n margin-left: 4px;\n }\n }\n}\n'],sourceRoot:""}]);const __WEBPACK_DEFAULT_EXPORT__=___CSS_LOADER_EXPORT___}}]); \ No newline at end of file diff --git a/components-Combobox-__stories__-combobox-stories.a01e153f.iframe.bundle.js.LICENSE.txt b/components-Combobox-__stories__-combobox-stories.3cb8ae07.iframe.bundle.js.LICENSE.txt similarity index 100% rename from components-Combobox-__stories__-combobox-stories.a01e153f.iframe.bundle.js.LICENSE.txt rename to components-Combobox-__stories__-combobox-stories.3cb8ae07.iframe.bundle.js.LICENSE.txt diff --git a/components-Combobox-__stories__-combobox-stories.a01e153f.iframe.bundle.js b/components-Combobox-__stories__-combobox-stories.a01e153f.iframe.bundle.js deleted file mode 100644 index ffd83615a2..0000000000 --- a/components-Combobox-__stories__-combobox-stories.a01e153f.iframe.bundle.js +++ /dev/null @@ -1,2 +0,0 @@ -/*! For license information please see components-Combobox-__stories__-combobox-stories.a01e153f.iframe.bundle.js.LICENSE.txt */ -"use strict";(globalThis.webpackChunkmonday_ui_react_core=globalThis.webpackChunkmonday_ui_react_core||[]).push([[8507],{"./src/components/Combobox/__stories__/combobox.stories.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{ComboboxAsPersonPicker:()=>ComboboxAsPersonPicker,ComboboxInsideADialog:()=>ComboboxInsideADialog,Default:()=>Default,LoadingState:()=>LoadingState,Overview:()=>Overview,Sizes:()=>Sizes,WithButton:()=>WithButton,WithCategories:()=>WithCategories,WithCreation:()=>WithCreation,WithIcons:()=>WithIcons,WithOptionRenderer:()=>WithOptionRenderer,WithVirtualizationOptimization:()=>WithVirtualizationOptimization,__namedExportsOrder:()=>__namedExportsOrder,default:()=>Combobox_stories_combobox_stories});var react=__webpack_require__("../../node_modules/react/index.js"),story_description=__webpack_require__("../storybook-blocks/dist/src/components/story-description/story-description.js"),Combobox=__webpack_require__("./src/components/Combobox/Combobox.tsx");const person1_namespaceObject=__webpack_require__.p+"static/media/person1.de30c8ee.png",person2_namespaceObject=__webpack_require__.p+"static/media/person2.2c51a581.png",person3_namespaceObject=__webpack_require__.p+"static/media/person3.7ed20eb8.png";var dist=__webpack_require__("../../node_modules/@storybook/jest/dist/index.mjs"),testing_library_dist=__webpack_require__("../../node_modules/@storybook/testing-library/dist/index.mjs"),interactions_helper=__webpack_require__("./src/__tests__/interactions-helper.ts"),interactions_utils=__webpack_require__("./src/tests/interactions-utils.ts"),test_ids_utils=__webpack_require__("./src/tests/test-ids-utils.ts"),constants=__webpack_require__("./src/tests/constants.ts");function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function _regeneratorRuntime(){_regeneratorRuntime=function _regeneratorRuntime(){return e};var t,e={},r=Object.prototype,n=r.hasOwnProperty,o=Object.defineProperty||function(t,e,r){t[e]=r.value},i="function"==typeof Symbol?Symbol:{},a=i.iterator||"@@iterator",c=i.asyncIterator||"@@asyncIterator",u=i.toStringTag||"@@toStringTag";function define(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{define({},"")}catch(t){define=function define(t,e,r){return t[e]=r}}function wrap(t,e,r,n){var i=e&&e.prototype instanceof Generator?e:Generator,a=Object.create(i.prototype),c=new Context(n||[]);return o(a,"_invoke",{value:makeInvokeMethod(t,r,c)}),a}function tryCatch(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}e.wrap=wrap;var h="suspendedStart",l="suspendedYield",f="executing",s="completed",y={};function Generator(){}function GeneratorFunction(){}function GeneratorFunctionPrototype(){}var p={};define(p,a,(function(){return this}));var d=Object.getPrototypeOf,v=d&&d(d(values([])));v&&v!==r&&n.call(v,a)&&(p=v);var g=GeneratorFunctionPrototype.prototype=Generator.prototype=Object.create(p);function defineIteratorMethods(t){["next","throw","return"].forEach((function(e){define(t,e,(function(t){return this._invoke(e,t)}))}))}function AsyncIterator(t,e){function invoke(r,o,i,a){var c=tryCatch(t[r],t,o);if("throw"!==c.type){var u=c.arg,h=u.value;return h&&"object"==_typeof(h)&&n.call(h,"__await")?e.resolve(h.__await).then((function(t){invoke("next",t,i,a)}),(function(t){invoke("throw",t,i,a)})):e.resolve(h).then((function(t){u.value=t,i(u)}),(function(t){return invoke("throw",t,i,a)}))}a(c.arg)}var r;o(this,"_invoke",{value:function value(t,n){function callInvokeWithMethodAndArg(){return new e((function(e,r){invoke(t,n,e,r)}))}return r=r?r.then(callInvokeWithMethodAndArg,callInvokeWithMethodAndArg):callInvokeWithMethodAndArg()}})}function makeInvokeMethod(e,r,n){var o=h;return function(i,a){if(o===f)throw Error("Generator is already running");if(o===s){if("throw"===i)throw a;return{value:t,done:!0}}for(n.method=i,n.arg=a;;){var c=n.delegate;if(c){var u=maybeInvokeDelegate(c,n);if(u){if(u===y)continue;return u}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if(o===h)throw o=s,n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);o=f;var p=tryCatch(e,r,n);if("normal"===p.type){if(o=n.done?s:l,p.arg===y)continue;return{value:p.arg,done:n.done}}"throw"===p.type&&(o=s,n.method="throw",n.arg=p.arg)}}}function maybeInvokeDelegate(e,r){var n=r.method,o=e.iterator[n];if(o===t)return r.delegate=null,"throw"===n&&e.iterator.return&&(r.method="return",r.arg=t,maybeInvokeDelegate(e,r),"throw"===r.method)||"return"!==n&&(r.method="throw",r.arg=new TypeError("The iterator does not provide a '"+n+"' method")),y;var i=tryCatch(o,e.iterator,r.arg);if("throw"===i.type)return r.method="throw",r.arg=i.arg,r.delegate=null,y;var a=i.arg;return a?a.done?(r[e.resultName]=a.value,r.next=e.nextLoc,"return"!==r.method&&(r.method="next",r.arg=t),r.delegate=null,y):a:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function pushTryEntry(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function resetTryEntry(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function Context(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(pushTryEntry,this),this.reset(!0)}function values(e){if(e||""===e){var r=e[a];if(r)return r.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var o=-1,i=function next(){for(;++o=0;--o){var i=this.tryEntries[o],a=i.completion;if("root"===i.tryLoc)return handle("end");if(i.tryLoc<=this.prev){var c=n.call(i,"catchLoc"),u=n.call(i,"finallyLoc");if(c&&u){if(this.prev=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),resetTryEntry(r),y}},catch:function _catch(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;resetTryEntry(r)}return o}}throw Error("illegal catch attempt")},delegateYield:function delegateYield(e,r,n){return this.delegate={iterator:values(e),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=t),y}},e}function asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg),value=info.value}catch(error){return void reject(error)}info.done?resolve(value):Promise.resolve(value).then(_next,_throw)}function _asyncToGenerator(fn){return function(){var self=this,args=arguments;return new Promise((function(resolve,reject){var gen=fn.apply(self,args);function _next(value){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"next",value)}function _throw(err){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"throw",err)}_next(void 0)}))}}function getComponentElements(_x){return _getComponentElements.apply(this,arguments)}function _getComponentElements(){return(_getComponentElements=_asyncToGenerator(_regeneratorRuntime().mark((function _callee2(canvas){var comboboxElement,searchElement;return _regeneratorRuntime().wrap((function _callee2$(_context2){for(;;)switch(_context2.prev=_context2.next){case 0:return comboboxElement=(0,interactions_utils.h5)(canvas,constants.w.COMBOBOX),searchElement=(0,interactions_utils.NX)(comboboxElement,"Search for content"),_context2.abrupt("return",{comboboxElement,searchElement});case 3:case"end":return _context2.stop()}}),_callee2)})))).apply(this,arguments)}function _onTypeFilterComboboxOptionsTest(){return(_onTypeFilterComboboxOptionsTest=_asyncToGenerator(_regeneratorRuntime().mark((function _callee3(canvas){var _yield$getComponentEl,comboboxElement,searchElement;return _regeneratorRuntime().wrap((function _callee3$(_context3){for(;;)switch(_context3.prev=_context3.next){case 0:return _context3.next=2,getComponentElements(canvas);case 2:return _yield$getComponentEl=_context3.sent,comboboxElement=_yield$getComponentEl.comboboxElement,searchElement=_yield$getComponentEl.searchElement,_context3.next=7,(0,interactions_utils.wQ)(searchElement,"jjj");case 7:(0,dist.E)((0,testing_library_dist.D3)(comboboxElement,"Option 1")).toBeNull();case 8:case"end":return _context3.stop()}}),_callee3)})))).apply(this,arguments)}function _onSelectExistFilterClearsFilterTest(){return(_onSelectExistFilterClearsFilterTest=_asyncToGenerator(_regeneratorRuntime().mark((function _callee4(canvas){var _yield$getComponentEl2,comboboxElement,searchElement,cleanSearchButton,option1;return _regeneratorRuntime().wrap((function _callee4$(_context4){for(;;)switch(_context4.prev=_context4.next){case 0:return _context4.next=2,getComponentElements(canvas);case 2:return _yield$getComponentEl2=_context4.sent,comboboxElement=_yield$getComponentEl2.comboboxElement,searchElement=_yield$getComponentEl2.searchElement,_context4.next=7,(0,interactions_utils.wQ)(searchElement,"jjj");case 7:return cleanSearchButton=(0,interactions_utils.h5)(comboboxElement,(0,test_ids_utils.G)(constants.w.CLEAN_SEARCH_BUTTON,"combobox-search")),_context4.next=10,(0,interactions_utils.jp)(cleanSearchButton);case 10:(0,dist.E)(searchElement).toHaveValue(""),option1=(0,interactions_utils.Tf)(comboboxElement,"Option 1"),(0,dist.E)(option1).toBeInTheDocument();case 13:case"end":return _context4.stop()}}),_callee4)})))).apply(this,arguments)}function _onNavigateBetweenOptionsByArrowsAriaUpdates(){return(_onNavigateBetweenOptionsByArrowsAriaUpdates=_asyncToGenerator(_regeneratorRuntime().mark((function _callee6(canvas){var _yield$getComponentEl4,comboboxElement,searchElement,option1,ariaActiveDescendant,option2;return _regeneratorRuntime().wrap((function _callee6$(_context6){for(;;)switch(_context6.prev=_context6.next){case 0:return _context6.next=2,getComponentElements(canvas);case 2:return _yield$getComponentEl4=_context6.sent,comboboxElement=_yield$getComponentEl4.comboboxElement,searchElement=_yield$getComponentEl4.searchElement,_context6.next=7,(0,interactions_utils.jp)(searchElement);case 7:return _context6.next=9,(0,interactions_utils.vZ)(constants.G.DOWN_ARROW);case 9:return option1=(0,interactions_utils.Tf)(comboboxElement,"Option 1").parentElement,ariaActiveDescendant=searchElement.getAttribute("aria-activedescendant"),(0,dist.E)(ariaActiveDescendant).toEqual(option1.id),_context6.next=14,(0,interactions_utils.vZ)(constants.G.DOWN_ARROW);case 14:return option2=(0,interactions_utils.Tf)(comboboxElement,"Option 2").parentElement,ariaActiveDescendant=searchElement.getAttribute("aria-activedescendant"),(0,dist.E)(ariaActiveDescendant).toEqual(option2.id),_context6.next=19,(0,interactions_utils.vZ)(constants.G.UP_ARROW);case 19:ariaActiveDescendant=searchElement.getAttribute("aria-activedescendant"),(0,dist.E)(ariaActiveDescendant).toEqual(option1.id);case 21:case"end":return _context6.stop()}}),_callee6)})))).apply(this,arguments)}var _afterEach,defaultPlaySuite=(0,interactions_utils.Ld)({tests:[function onNavigateBetweenOptionsByArrowsAriaUpdates(_x5){return _onNavigateBetweenOptionsByArrowsAriaUpdates.apply(this,arguments)},function onTypeFilterComboboxOptionsTest(_x2){return _onTypeFilterComboboxOptionsTest.apply(this,arguments)},function onSelectExistFilterClearsFilterTest(_x3){return _onSelectExistFilterClearsFilterTest.apply(this,arguments)}],afterEach:(_afterEach=_asyncToGenerator(_regeneratorRuntime().mark((function _callee(){return _regeneratorRuntime().wrap((function _callee$(_context){for(;;)switch(_context.prev=_context.next){case 0:return _context.next=2,(0,interactions_helper.S)();case 2:case"end":return _context.stop()}}),_callee)}))),function afterEach(){return _afterEach.apply(this,arguments)})}),DialogContentContainer=__webpack_require__("./src/components/DialogContentContainer/DialogContentContainer.tsx"),Button=__webpack_require__("./src/components/Button/Button.tsx"),Dialog=__webpack_require__("./src/components/Dialog/Dialog.tsx"),Wand=__webpack_require__("./src/components/Icon/Icons/components/Wand.tsx"),ThumbsUp=__webpack_require__("./src/components/Icon/Icons/components/ThumbsUp.tsx"),Time=__webpack_require__("./src/components/Icon/Icons/components/Time.tsx"),Update=__webpack_require__("./src/components/Icon/Icons/components/Update.tsx"),Upgrade=__webpack_require__("./src/components/Icon/Icons/components/Upgrade.tsx"),Person=__webpack_require__("./src/components/Icon/Icons/components/Person.tsx"),Edit=__webpack_require__("./src/components/Icon/Icons/components/Edit.tsx"),Avatar=__webpack_require__("./src/components/Avatar/Avatar.tsx"),Flex=__webpack_require__("./src/components/Flex/Flex.tsx"),jsx_runtime=__webpack_require__("../../node_modules/react/jsx-runtime.js"),optionRenderer=function optionRenderer(_ref){var src=_ref.src,id=_ref.id,label=_ref.label,position=_ref.position;return(0,jsx_runtime.jsxs)("div",{className:"person-picker-mock-option",children:[(0,jsx_runtime.jsx)(Avatar.A,{customSize:22,src,type:Avatar.A.types.IMG},id),(0,jsx_runtime.jsxs)("span",{className:"person-picker-mock-name",children:[label,(0,jsx_runtime.jsx)("span",{children:position})]})]})};optionRenderer.displayName="optionRenderer",optionRenderer.__docgenInfo={description:"",methods:[],displayName:"optionRenderer"};var createStoryMetaSettingsDecorator=__webpack_require__("./src/storybook/functions/createStoryMetaSettingsDecorator.ts"),Icon=__webpack_require__("./src/components/Icon/Icon.tsx"),injectStylesIntoStyleTag=__webpack_require__("../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),styleDomAPI=__webpack_require__("../../node_modules/style-loader/dist/runtime/styleDomAPI.js"),styleDomAPI_default=__webpack_require__.n(styleDomAPI),insertBySelector=__webpack_require__("../../node_modules/style-loader/dist/runtime/insertBySelector.js"),insertBySelector_default=__webpack_require__.n(insertBySelector),setAttributesWithoutAttributes=__webpack_require__("../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),setAttributesWithoutAttributes_default=__webpack_require__.n(setAttributesWithoutAttributes),insertStyleElement=__webpack_require__("../../node_modules/style-loader/dist/runtime/insertStyleElement.js"),insertStyleElement_default=__webpack_require__.n(insertStyleElement),styleTagTransform=__webpack_require__("../../node_modules/style-loader/dist/runtime/styleTagTransform.js"),styleTagTransform_default=__webpack_require__.n(styleTagTransform),combobox_stories=__webpack_require__("../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[15].use[1]!../../node_modules/resolve-url-loader/index.js!../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[15].use[3]!./src/components/Combobox/__stories__/combobox.stories.scss"),options={};options.styleTagTransform=styleTagTransform_default(),options.setAttributes=setAttributesWithoutAttributes_default(),options.insert=insertBySelector_default().bind(null,"head"),options.domAPI=styleDomAPI_default(),options.insertStyleElement=insertStyleElement_default();injectStylesIntoStyleTag_default()(combobox_stories.A,options);combobox_stories.A&&combobox_stories.A.locals&&combobox_stories.A.locals;function combobox_stories_typeof(o){return combobox_stories_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},combobox_stories_typeof(o)}function _toConsumableArray(arr){return function _arrayWithoutHoles(arr){if(Array.isArray(arr))return _arrayLikeToArray(arr)}(arr)||function _iterableToArray(iter){if("undefined"!=typeof Symbol&&null!=iter[Symbol.iterator]||null!=iter["@@iterator"])return Array.from(iter)}(arr)||_unsupportedIterableToArray(arr)||function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(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)||_unsupportedIterableToArray(arr,i)||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.")}()}function _unsupportedIterableToArray(o,minLen){if(o){if("string"==typeof o)return _arrayLikeToArray(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)?_arrayLikeToArray(o,minLen):void 0}}function _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i alert("clicked"),\n placeholder: "Placeholder text here",\n clearFilterOnSelection: true\n }\n}',...Overview.parameters?.docs?.source}}},Default.parameters={...Default.parameters,docs:{...Default.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1"\n }, {\n id: "2",\n label: "Option 2"\n }, {\n id: "3",\n label: "Option 3"\n }], []);\n return ;\n },\n name: "Default",\n play: defaultPlaySuite\n}',...Default.parameters?.docs?.source}}},ComboboxInsideADialog.parameters={...ComboboxInsideADialog.parameters,docs:{...ComboboxInsideADialog.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1"\n }, {\n id: "2",\n label: "Option 2"\n }, {\n id: "3",\n label: "Option 3"\n }, {\n id: "4",\n label: "Option 4"\n }, {\n id: "5",\n label: "Option 5"\n }], []);\n return \n \n ;\n },\n name: "Combobox inside a dialog"\n}',...ComboboxInsideADialog.parameters?.docs?.source}}},Sizes.parameters={...Sizes.parameters,docs:{...Sizes.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1"\n }, {\n id: "2",\n label: "Option 2"\n }, {\n id: "3",\n label: "Option 3"\n }, {\n id: "4",\n label: "Option 4"\n }, {\n id: "5",\n label: "Option 5"\n }], []);\n return
\n \n \n \n \n \n \n \n \n \n
;\n },\n name: "Sizes"\n}',...Sizes.parameters?.docs?.source}}},WithCategories.parameters={...WithCategories.parameters,docs:{...WithCategories.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Favorites",\n categoryId: "favorites"\n }, {\n id: "2",\n label: "Main workspace",\n categoryId: "workspace"\n }, {\n id: "3",\n label: "Client Foundations",\n categoryId: "workspace"\n }, {\n id: "4",\n label: "Design",\n categoryId: "workspace"\n }, {\n id: "5",\n label: "Marketing Cluster",\n categoryId: "workspace"\n }, {\n id: "6",\n label: "Mobile",\n categoryId: "workspace"\n }], []);\n const categories = useMemo(() => ({\n favorites: {\n id: "favorites",\n label: "Favorites"\n },\n workspace: {\n id: "Workspaces",\n label: "Workspaces"\n }\n }), []);\n return \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n ;\n },\n name: "With categories"\n}',...WithCategories.parameters?.docs?.source}}},WithIcons.parameters={...WithIcons.parameters,docs:{...WithIcons.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1",\n leftIcon: Wand\n }, {\n id: "2",\n label: "Option 2",\n leftIcon: ThumbsUp\n }, {\n id: "3",\n label: "Option 3",\n leftIcon: Time\n }, {\n id: "4",\n label: "Option 4",\n leftIcon: Update\n }, {\n id: "5",\n label: "Option 5",\n leftIcon: Upgrade\n }], []);\n return \n \n ;\n },\n name: "With icons"\n}',...WithIcons.parameters?.docs?.source}}},WithOptionRenderer.parameters={...WithOptionRenderer.parameters,docs:{...WithOptionRenderer.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1"\n }, {\n id: "2",\n label: "Option 2"\n }, {\n id: "3",\n label: "Option 3"\n }, {\n id: "4",\n label: "Option 4"\n }, {\n id: "5",\n label: "Option 5"\n }, {\n id: "6",\n label: "Option 6"\n }, {\n id: "7",\n label: "Option 7"\n }, {\n id: "8",\n label: "Option 8"\n }, {\n id: "9",\n label: "Option 9"\n }], []);\n const optionRenderer = option =>
\n I can render anything with {option.label}\n
;\n return \n \n ;\n },\n name: "With optionRenderer"\n}',...WithOptionRenderer.parameters?.docs?.source}}},WithButton.parameters={...WithButton.parameters,docs:{...WithButton.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1",\n leftIcon: Wand\n }, {\n id: "2",\n label: "Option 2",\n leftIcon: ThumbsUp\n }, {\n id: "3",\n label: "Option 3",\n leftIcon: Time\n }, {\n id: "4",\n label: "Option 4",\n leftIcon: Update\n }, {\n id: "5",\n label: "Option 5",\n leftIcon: Upgrade\n }], []);\n return \n \n \n ;\n },\n name: "With Button"\n}',...WithButton.parameters?.docs?.source}}},WithCreation.parameters={...WithCreation.parameters,docs:{...WithCreation.parameters?.docs,source:{originalSource:'{\n render: () => {\n const [options, setOptions] = useState([]);\n return \n setOptions([...options, {\n id: options.length + 1,\n label: `Option: ${options.length + 1}`\n }])} />\n ;\n },\n name: "With Creation"\n}',...WithCreation.parameters?.docs?.source}}},WithVirtualizationOptimization.parameters={...WithVirtualizationOptimization.parameters,docs:{...WithVirtualizationOptimization.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "1",\n label: "Option 1",\n categoryId: "Group1"\n }, {\n id: "2",\n label: "Option 2",\n categoryId: "Group1"\n }, {\n id: "3",\n label: "Option 3",\n categoryId: "Group1"\n }, {\n id: "4",\n label: "Option 4",\n categoryId: "Group1"\n }, {\n id: "5",\n label: "Option 5",\n categoryId: "Group1"\n }, {\n id: "6",\n label: "Option 6",\n categoryId: "Group1"\n }, {\n id: "7",\n label: "Option 7",\n categoryId: "Group1"\n }, {\n id: "8",\n label: "Option 8",\n categoryId: "Group1"\n }, {\n id: "9",\n label: "Option 9",\n categoryId: "Group1"\n }, {\n id: "10",\n label: "Option 10",\n categoryId: "Group2"\n }, {\n id: "11",\n label: "Option 11",\n categoryId: "Group2"\n }, {\n id: "12",\n label: "Option 12",\n categoryId: "Group2"\n }, {\n id: "13",\n label: "Option 13",\n categoryId: "Group2"\n }, {\n id: "14",\n label: "Option 14",\n categoryId: "Group2"\n }, {\n id: "15",\n label: "Option 15",\n categoryId: "Group2"\n }, {\n id: "16",\n label: "Option 16",\n categoryId: "Group2"\n }, {\n id: "17",\n label: "Option 17",\n categoryId: "Group2"\n }, {\n id: "18",\n label: "Option 18",\n categoryId: "Group2"\n }, {\n id: "19",\n label: "Option 19",\n categoryId: "Group2"\n }, {\n id: "20",\n label: "Option 20",\n categoryId: "Group2"\n }], []);\n const categories = useMemo(() => ({\n Group1: {\n id: "Group1",\n label: "Group 1"\n },\n Group2: {\n id: "Group2",\n label: "Group 2"\n }\n }), []);\n return \n \n
\n \n \n \n
\n \n \n
\n \n \n \n
\n \n \n
\n \n \n \n
\n \n ;\n },\n name: "With virtualization optimization"\n}',...WithVirtualizationOptimization.parameters?.docs?.source}}},LoadingState.parameters={...LoadingState.parameters,docs:{...LoadingState.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [], []);\n return \n \n ;\n },\n name: "Loading state"\n}',...LoadingState.parameters?.docs?.source}}},ComboboxAsPersonPicker.parameters={...ComboboxAsPersonPicker.parameters,docs:{...ComboboxAsPersonPicker.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n id: "Hadas Farhi",\n label: "Hadas Farhi",\n src: person1,\n type: Avatar.types.IMG,\n position: "(Frontend Developer)",\n categoryId: "suggestedPeople"\n }, {\n id: "Rotem Dekel",\n label: "Rotem Dekel",\n src: person2,\n type: Avatar.types.IMG,\n position: "(Product Designer)",\n categoryId: "suggestedPeople"\n }, {\n id: "Netta Muller",\n label: "Netta Muller",\n src: person3,\n type: Avatar.types.IMG,\n position: "(Brand Designer)",\n categoryId: "suggestedPeople"\n }], []);\n const categories = useMemo(() => ({\n suggestedPeople: {\n id: "suggestedPeople",\n label: "Suggested people"\n }\n }), []);\n return \n \n \n } tooltip position={Dialog.positions.BOTTOM} open={true}>\n
\n \n
\n \n ;\n },\n name: "Combobox as person picker"\n}',...ComboboxAsPersonPicker.parameters?.docs?.source}}};const __namedExportsOrder=["Overview","Default","ComboboxInsideADialog","Sizes","WithCategories","WithIcons","WithOptionRenderer","WithButton","WithCreation","WithVirtualizationOptimization","LoadingState","ComboboxAsPersonPicker"]},"../storybook-blocks/dist/src/components/story-description/story-description.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>p});var jsx_runtime=__webpack_require__("../../node_modules/react/jsx-runtime.js"),react=__webpack_require__("../../node_modules/react/index.js"),classnames=__webpack_require__("../../node_modules/classnames/index.js"),classnames_default=__webpack_require__.n(classnames),withStaticProps=__webpack_require__("../storybook-blocks/dist/src/types/withStaticProps.js"),FlexConstants=__webpack_require__("../storybook-blocks/dist/src/helpers/components/Flex/FlexConstants.js"),Flex=__webpack_require__("../storybook-blocks/dist/src/helpers/components/Flex/Flex.js"),e_description="story-description-module_description__yFjQO",e_vertical="story-description-module_vertical__C1SJj";function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function _defineProperty(obj,key,value){return key=function _toPropertyKey(t){var i=function _toPrimitive(t,r){if("object"!=_typeof(t)||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=_typeof(i))return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(t)}(t,"string");return"symbol"==_typeof(i)?i:i+""}(key),key in obj?Object.defineProperty(obj,key,{value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}var p=(0,withStaticProps.N)((function m(t){var o,l,n,_t$description=t.description,a=void 0===_t$description?"":_t$description,p=t.headerStyle,u=t.children,_t$vertical=t.vertical,v=void 0!==_t$vertical&&_t$vertical,f=t.className,j=t.align,_t$justify=t.justify,g=void 0===_t$justify?null===(o=m.justify)||void 0===o?void 0:o.START:_t$justify,h=t.headerAlign,y=t.headerJustify,x=(0,react.useMemo)((function(){var i,s;return v?null===(i=m.directions)||void 0===i?void 0:i.COLUMN:null===(s=m.directions)||void 0===s?void 0:s.ROW}),[v]);return(0,jsx_runtime.jsxs)(Flex.A,{direction:x,gap:null===(l=m.gaps)||void 0===l?void 0:l.MEDIUM,justify:g,align:j||void 0,className:f,children:[(0,jsx_runtime.jsx)(Flex.A,{className:classnames_default()(e_description,_defineProperty({},e_vertical,v)),style:Object.assign({width:"120px"},p),justify:y,align:h||(null===(n=m.align)||void 0===n?void 0:n.CENTER),children:a}),u]})}),{justify:FlexConstants.aP,align:FlexConstants.xB,gaps:FlexConstants.Us,directions:FlexConstants.bo})},"./src/__tests__/interactions-helper.ts":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{S:()=>resetFocus});var _storybook_testing_library__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/@storybook/testing-library/dist/index.mjs");function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function _regeneratorRuntime(){_regeneratorRuntime=function _regeneratorRuntime(){return e};var t,e={},r=Object.prototype,n=r.hasOwnProperty,o=Object.defineProperty||function(t,e,r){t[e]=r.value},i="function"==typeof Symbol?Symbol:{},a=i.iterator||"@@iterator",c=i.asyncIterator||"@@asyncIterator",u=i.toStringTag||"@@toStringTag";function define(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{define({},"")}catch(t){define=function define(t,e,r){return t[e]=r}}function wrap(t,e,r,n){var i=e&&e.prototype instanceof Generator?e:Generator,a=Object.create(i.prototype),c=new Context(n||[]);return o(a,"_invoke",{value:makeInvokeMethod(t,r,c)}),a}function tryCatch(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}e.wrap=wrap;var h="suspendedStart",l="suspendedYield",f="executing",s="completed",y={};function Generator(){}function GeneratorFunction(){}function GeneratorFunctionPrototype(){}var p={};define(p,a,(function(){return this}));var d=Object.getPrototypeOf,v=d&&d(d(values([])));v&&v!==r&&n.call(v,a)&&(p=v);var g=GeneratorFunctionPrototype.prototype=Generator.prototype=Object.create(p);function defineIteratorMethods(t){["next","throw","return"].forEach((function(e){define(t,e,(function(t){return this._invoke(e,t)}))}))}function AsyncIterator(t,e){function invoke(r,o,i,a){var c=tryCatch(t[r],t,o);if("throw"!==c.type){var u=c.arg,h=u.value;return h&&"object"==_typeof(h)&&n.call(h,"__await")?e.resolve(h.__await).then((function(t){invoke("next",t,i,a)}),(function(t){invoke("throw",t,i,a)})):e.resolve(h).then((function(t){u.value=t,i(u)}),(function(t){return invoke("throw",t,i,a)}))}a(c.arg)}var r;o(this,"_invoke",{value:function value(t,n){function callInvokeWithMethodAndArg(){return new e((function(e,r){invoke(t,n,e,r)}))}return r=r?r.then(callInvokeWithMethodAndArg,callInvokeWithMethodAndArg):callInvokeWithMethodAndArg()}})}function makeInvokeMethod(e,r,n){var o=h;return function(i,a){if(o===f)throw Error("Generator is already running");if(o===s){if("throw"===i)throw a;return{value:t,done:!0}}for(n.method=i,n.arg=a;;){var c=n.delegate;if(c){var u=maybeInvokeDelegate(c,n);if(u){if(u===y)continue;return u}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if(o===h)throw o=s,n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);o=f;var p=tryCatch(e,r,n);if("normal"===p.type){if(o=n.done?s:l,p.arg===y)continue;return{value:p.arg,done:n.done}}"throw"===p.type&&(o=s,n.method="throw",n.arg=p.arg)}}}function maybeInvokeDelegate(e,r){var n=r.method,o=e.iterator[n];if(o===t)return r.delegate=null,"throw"===n&&e.iterator.return&&(r.method="return",r.arg=t,maybeInvokeDelegate(e,r),"throw"===r.method)||"return"!==n&&(r.method="throw",r.arg=new TypeError("The iterator does not provide a '"+n+"' method")),y;var i=tryCatch(o,e.iterator,r.arg);if("throw"===i.type)return r.method="throw",r.arg=i.arg,r.delegate=null,y;var a=i.arg;return a?a.done?(r[e.resultName]=a.value,r.next=e.nextLoc,"return"!==r.method&&(r.method="next",r.arg=t),r.delegate=null,y):a:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function pushTryEntry(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function resetTryEntry(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function Context(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(pushTryEntry,this),this.reset(!0)}function values(e){if(e||""===e){var r=e[a];if(r)return r.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var o=-1,i=function next(){for(;++o=0;--o){var i=this.tryEntries[o],a=i.completion;if("root"===i.tryLoc)return handle("end");if(i.tryLoc<=this.prev){var c=n.call(i,"catchLoc"),u=n.call(i,"finallyLoc");if(c&&u){if(this.prev=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),resetTryEntry(r),y}},catch:function _catch(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;resetTryEntry(r)}return o}}throw Error("illegal catch attempt")},delegateYield:function delegateYield(e,r,n){return this.delegate={iterator:values(e),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=t),y}},e}function asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg),value=info.value}catch(error){return void reject(error)}info.done?resolve(value):Promise.resolve(value).then(_next,_throw)}function resetFocus(){return _resetFocus.apply(this,arguments)}function _resetFocus(){return _resetFocus=function _asyncToGenerator(fn){return function(){var self=this,args=arguments;return new Promise((function(resolve,reject){var gen=fn.apply(self,args);function _next(value){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"next",value)}function _throw(err){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"throw",err)}_next(void 0)}))}}(_regeneratorRuntime().mark((function _callee(){var focusTrap;return _regeneratorRuntime().wrap((function _callee$(_context){for(;;)switch(_context.prev=_context.next){case 0:return focusTrap=document.querySelector("[data-testid=focusTrap]"),_context.next=3,_storybook_testing_library__WEBPACK_IMPORTED_MODULE_0__.Q4.click(focusTrap);case 3:case"end":return _context.stop()}}),_callee)}))),_resetFocus.apply(this,arguments)}},"../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[15].use[1]!../../node_modules/resolve-url-loader/index.js!../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[15].use[3]!./src/components/Combobox/__stories__/combobox.stories.scss":(module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{A:()=>__WEBPACK_DEFAULT_EXPORT__});var _node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/css-loader/dist/runtime/sourceMaps.js"),_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default=__webpack_require__.n(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0__),_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../../node_modules/css-loader/dist/runtime/api.js"),___CSS_LOADER_EXPORT___=__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__)()(_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default());___CSS_LOADER_EXPORT___.push([module.id,".combobox-stories-styles_virtualized-description{width:300px}.combobox-stories-styles_category-wrapper{width:300px}.combobox-stories-styles_row{display:flex;flex-direction:row;gap:50px}.combobox-stories-styles_btn-group{display:flex;justify-content:space-between}.combobox-stories-styles_wrapper{width:300px;padding:16px}.combobox-stories-styles_btn{width:100%}.combobox-stories-styles_big-figure figure{height:270px}.person-picker-mock{display:flex;justify-content:center;align-items:center;border:1px solid;border-radius:var(--sb-border-radius-small);padding:var(--sb-spacing-xs);background-color:var(--sb-primary-selected-color);border-color:var(--sb-primary-color);width:97px;height:34px}.person-picker-mock-option{display:flex;align-items:center;justify-content:center}.person-picker-mock-name{padding:0 8px;font-size:13px}.person-picker-mock-name span{color:var(--sb-secondary-text-color);margin-left:4px}","",{version:3,sources:["webpack://./src/components/Combobox/__stories__/combobox.stories.scss"],names:[],mappings:"AAGE,iDACE,WAAA,CAEF,0CACE,WAAA,CAGF,6BACE,YAAA,CACA,kBAAA,CACA,QAAA,CAGF,mCACE,YAAA,CACA,6BAAA,CAGF,iCACE,WAAA,CACA,YAAA,CAGF,6BACE,UAAA,CAIA,2CACE,YAAA,CAKN,oBACE,YAAA,CACA,sBAAA,CACA,kBAAA,CACA,gBAAA,CACA,2CAAA,CACA,4BAAA,CACA,iDAAA,CACA,oCAAA,CACA,UAAA,CACA,WAAA,CAEA,2BACE,YAAA,CACA,kBAAA,CACA,sBAAA,CAEF,yBACE,aAAA,CACA,cAAA,CAEA,8BACE,oCAAA,CACA,eAAA",sourcesContent:['@import "../../../styles/states";\n\n.combobox-stories-styles {\n &_virtualized-description {\n width: 300px\n }\n &_category-wrapper {\n width: 300px;\n }\n\n &_row {\n display: flex;\n flex-direction: row;\n gap: 50px;\n }\n\n &_btn-group {\n display: flex;\n justify-content: space-between;\n }\n\n &_wrapper {\n width: 300px;\n padding: 16px;\n }\n\n &_btn {\n width: 100%;\n }\n\n &_big-figure {\n figure {\n height: 270px;\n }\n }\n}\n\n.person-picker-mock {\n display: flex;\n justify-content: center;\n align-items: center;\n border: 1px solid;\n border-radius: var(--sb-border-radius-small);\n padding: var(--sb-spacing-xs);\n background-color: var(--sb-primary-selected-color);\n border-color: var(--sb-primary-color);\n width: 97px;\n height: 34px;\n\n &-option {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n &-name {\n padding: 0 8px;\n font-size: 13px;\n\n span {\n color: var(--sb-secondary-text-color);\n margin-left: 4px;\n }\n }\n}\n'],sourceRoot:""}]);const __WEBPACK_DEFAULT_EXPORT__=___CSS_LOADER_EXPORT___}}]); \ No newline at end of file diff --git a/components-Dropdown-__stories__-dropdown-mdx.5aeb6afa.iframe.bundle.js b/components-Dropdown-__stories__-dropdown-mdx.5aeb6afa.iframe.bundle.js new file mode 100644 index 0000000000..ab60e123d7 --- /dev/null +++ b/components-Dropdown-__stories__-dropdown-mdx.5aeb6afa.iframe.bundle.js @@ -0,0 +1 @@ +"use strict";(globalThis.webpackChunkmonday_ui_react_core=globalThis.webpackChunkmonday_ui_react_core||[]).push([[1321],{"../../node_modules/@mdx-js/react/lib/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{BN:()=>MDXContext,RP:()=>useMDXComponents,gz:()=>withMDXComponents,xA:()=>MDXProvider});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/react/index.js");const MDXContext=react__WEBPACK_IMPORTED_MODULE_0__.createContext({});function withMDXComponents(Component){return function boundMDXComponent(props){const allComponents=useMDXComponents(props.components);return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component,{...props,allComponents})}}function useMDXComponents(components){const contextComponents=react__WEBPACK_IMPORTED_MODULE_0__.useContext(MDXContext);return react__WEBPACK_IMPORTED_MODULE_0__.useMemo((()=>"function"==typeof components?components(contextComponents):{...contextComponents,...components}),[contextComponents,components])}const emptyObject={};function MDXProvider({components,children,disableParentContext}){let allComponents;return allComponents=disableParentContext?"function"==typeof components?components({}):components||emptyObject:useMDXComponents(components),react__WEBPACK_IMPORTED_MODULE_0__.createElement(MDXContext.Provider,{value:allComponents},children)}},"./src/components/Dropdown/__stories__/dropdown.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("../../node_modules/react/index.js");var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("../../node_modules/react/jsx-runtime.js"),_home_runner_work_monday_ui_react_core_monday_ui_react_core_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("../../node_modules/@mdx-js/react/lib/index.js"),_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("../../node_modules/@storybook/blocks/dist/index.mjs"),vibe_storybook_components__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("../storybook-blocks/dist/src/components/link/link.js"),_storybook_components_related_components_component_description_map__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./src/storybook/components/related-components/component-description-map.tsx"),_index__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./src/components/Dropdown/Dropdown.jsx"),_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/components/Dropdown/__stories__/dropdown.stories.js"),_dropdown_stories_helpers__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./src/components/Dropdown/__stories__/dropdown.stories.helpers.tsx");function _createMdxContent(props){const _components=Object.assign({h1:"h1",ul:"ul",li:"li",a:"a",h2:"h2",p:"p",h3:"h3",code:"code"},(0,_home_runner_work_monday_ui_react_core_monday_ui_react_core_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim__WEBPACK_IMPORTED_MODULE_2__.RP)(),props.components),{PropsTable,UsageGuidelines,ComponentRules,StorybookLink,RelatedComponents}=_components;return ComponentRules||_missingMdxReference("ComponentRules",!0),PropsTable||_missingMdxReference("PropsTable",!0),RelatedComponents||_missingMdxReference("RelatedComponents",!0),StorybookLink||_missingMdxReference("StorybookLink",!0),UsageGuidelines||_missingMdxReference("UsageGuidelines",!0),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.W8,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h1,{id:"dropdown",children:"Dropdown"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.ul,{children:["\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"#overview",children:"Overview"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"#props",children:"Props"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"#usage",children:"Usage"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"#variants",children:"Variants"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"#dos-and-donts",children:"Do’s and don’ts"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"#use-cases-and-examples",children:"Use cases and examples"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"#related-components",children:"Related components"})}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.li,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.a,{href:"#feedback",children:"Feedback"})}),"\n"]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h2,{id:"overview",children:"Overview"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"Dropdown present a list of options from which a user can select one or several."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.Overview}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h2,{id:"props",children:"Props"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(PropsTable,{}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h2,{id:"usage",children:"Usage"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(UsageGuidelines,{guidelines:["Dropdown menus are typically used when you have 5-8 items to choose from. They're used for navigation or command menus, where an action is initiated based on the selection.","Use a consistent size of form components on the same page. For example, if you are using a medium size dropdown also use the same size text inputs, buttons, and so on.","Avoid having multiple lines of text in a dropdown. If the text is too long for one line, add an ellipsis (…).","When the menu is open, each option in the menu should be the same height as the field.","When organizing dropdown menu items, sort the list in a logical order by putting the most selected option at the top."]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h2,{id:"variants",children:"Variants"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"sizes",children:"Sizes"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"There are three sizes available: Small, Medium, and Large"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.Sizes}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"disabled",children:"Disabled"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.Disabled}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"readonly",children:"Readonly"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.Readonly}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"rtl",children:"RTL"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.Rtl}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"multi-line-states",children:"Multi line states"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"The Dropdown component supports multiple options selection in two different state - single line and multiple lines."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.MultiChoiceWithDifferentStates}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"async-options",children:"Async Options"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"The Dropdown component supports async loading of options."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.AsyncOptions}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"dropdown-with-avatar",children:"Dropdown with avatar"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownWithAvatar}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"dropdown-with-icon",children:"Dropdown with icon"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownWithIcon}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"dropdown-with-chip-colors",children:"Dropdown with chip colors"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownWithChipColors}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"dropdown-with-tooltips-on-items",children:"Dropdown with tooltips on items"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownWithTooltipsOnItems}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h2,{id:"dos-and-donts",children:"Do’s and Don’ts"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(ComponentRules,{rules:[{positive:{component:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_index__WEBPACK_IMPORTED_MODULE_5__.A,{placeholder:"Placeholder text here",options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"},{value:3,label:"Option 3"}],className:"dropdown-stories-styles_rules-spacing"}),description:"Use the dropdown as a closed component. Users should normally be allowed only to click on the items; search is not recommended, though possible."},negative:{component:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_index__WEBPACK_IMPORTED_MODULE_5__.A,{menuIsOpen:!0,placeholder:"Placeholder text here",options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"},{value:3,label:"Option 3"}],className:"dropdown-stories-styles_rules-spacing"}),description:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.Fragment,{children:["Don't keep the dropdown component in open mode as permanent state. If this is a design requirement consider use ",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(StorybookLink,{page:"Inputs/Combobox",children:"Combo box"})," instead."]})}}]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h2,{id:"use-cases-and-examples",children:"Use cases and examples"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"multiple-dropdown-with-renderers-as-options",children:"Multiple dropdown with renderers as options"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"Inside the advanced filters, a user can select multiple people from the dropdown menu, and they will be shown as Chips."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownWithChips}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"searchable-dropdown",children:"Searchable Dropdown"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.p,{children:["In case of multiple options, you can use the ",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{children:"onInputChange"})," prop to allow filtering options."]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.SearchableDropdown}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"dropdown-with-labels",children:"Dropdown with labels"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"A dropdown menu can include labels."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownWithLabels}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"dropdown-inside-a-form",children:"Dropdown inside a form"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"A classic dropdown presents options a user needs to choose from."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownInsideAForm}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"dropdown-with-groups",children:"Dropdown with groups"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownWithGroups}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"dropdown-inside-popover",children:"Dropdown inside popover"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.p,{children:["Use ",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("code",{children:["menuPosition=",_index__WEBPACK_IMPORTED_MODULE_5__.A.menuPositions.FIXED]})," prop attribute for displaying dropdown inside popover (like our Modal\ncomponent) or container with overflow hidden content."]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_dropdown_stories_helpers__WEBPACK_IMPORTED_MODULE_6__.B,{}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownInsidePopover}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"dropdown-with-loading",children:"Dropdown with loading"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.p,{children:"If importing the dropdown options may take time, you can reflect this to the user using Dropdown isLoading flag with optional custom message."}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownWithLoading}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"dropdown-with-ref",children:"Dropdown with ref"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.p,{children:["If you need to programmatically control Dropdown state, use ",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{children:"ref"})," prop. Pay attention that type of returned ref will be ",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{children:"StateManager"})," from ",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(vibe_storybook_components__WEBPACK_IMPORTED_MODULE_7__.A,{withoutSpacing:!0,href:"https://react-select.com/home",children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.code,{children:"react-select"})})," library."]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownWithRef}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h3,{id:"dropdown-value-selection",children:"Dropdown value selection"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)(_components.p,{children:["Control the value selection mechanism with the ",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("code",{children:"tabSelectsValue"})," (default: true) prop."]}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_storybook_blocks__WEBPACK_IMPORTED_MODULE_3__.Hl,{of:_dropdown_stories__WEBPACK_IMPORTED_MODULE_4__.DropdownValueSelection}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components.h2,{id:"related-components",children:"Related components"}),"\n",(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(RelatedComponents,{componentsNames:[_storybook_components_related_components_component_description_map__WEBPACK_IMPORTED_MODULE_8__.k4,_storybook_components_related_components_component_description_map__WEBPACK_IMPORTED_MODULE_8__.uY,_storybook_components_related_components_component_description_map__WEBPACK_IMPORTED_MODULE_8__.sc]})]})}const __WEBPACK_DEFAULT_EXPORT__=function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,_home_runner_work_monday_ui_react_core_monday_ui_react_core_node_modules_storybook_addon_docs_dist_shims_mdx_react_shim__WEBPACK_IMPORTED_MODULE_2__.RP)(),props.components);return MDXLayout?(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(MDXLayout,Object.assign({},props,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_createMdxContent,props)})):_createMdxContent(props)};function _missingMdxReference(id,component){throw new Error("Expected "+(component?"component":"object")+" `"+id+"` to be defined: you likely forgot to import, pass, or provide it.")}}}]); \ No newline at end of file diff --git a/components-Dropdown-__stories__-dropdown-mdx.e5ad051f.iframe.bundle.js b/components-Dropdown-__stories__-dropdown-mdx.e5ad051f.iframe.bundle.js deleted file mode 100644 index cc50000a64..0000000000 --- a/components-Dropdown-__stories__-dropdown-mdx.e5ad051f.iframe.bundle.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(globalThis.webpackChunkmonday_ui_react_core=globalThis.webpackChunkmonday_ui_react_core||[]).push([[1321],{"../../node_modules/@mdx-js/react/lib/index.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.d(__webpack_exports__,{BN:()=>MDXContext,RP:()=>useMDXComponents,gz:()=>withMDXComponents,xA:()=>MDXProvider});var react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("../../node_modules/react/index.js");const MDXContext=react__WEBPACK_IMPORTED_MODULE_0__.createContext({});function withMDXComponents(Component){return function boundMDXComponent(props){const allComponents=useMDXComponents(props.components);return react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component,{...props,allComponents})}}function useMDXComponents(components){const contextComponents=react__WEBPACK_IMPORTED_MODULE_0__.useContext(MDXContext);return react__WEBPACK_IMPORTED_MODULE_0__.useMemo((()=>"function"==typeof components?components(contextComponents):{...contextComponents,...components}),[contextComponents,components])}const emptyObject={};function MDXProvider({components,children,disableParentContext}){let allComponents;return allComponents=disableParentContext?"function"==typeof components?components({}):components||emptyObject:useMDXComponents(components),react__WEBPACK_IMPORTED_MODULE_0__.createElement(MDXContext.Provider,{value:allComponents},children)}},"./src/components/Dropdown/__stories__/dropdown.mdx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:()=>dropdown});__webpack_require__("../../node_modules/react/index.js");var jsx_runtime=__webpack_require__("../../node_modules/react/jsx-runtime.js"),lib=__webpack_require__("../../node_modules/@mdx-js/react/lib/index.js"),dist=__webpack_require__("../../node_modules/@storybook/blocks/dist/index.mjs"),link_link=__webpack_require__("../storybook-blocks/dist/src/components/link/link.js"),component_description_map=__webpack_require__("./src/storybook/components/related-components/component-description-map.tsx"),Dropdown=__webpack_require__("./src/components/Dropdown/Dropdown.jsx"),dropdown_stories=__webpack_require__("./src/components/Dropdown/__stories__/dropdown.stories.js"),tip=__webpack_require__("../storybook-blocks/dist/src/components/tip/tip.js"),storybook_link=__webpack_require__("../storybook-blocks/dist/src/components/storybook-link/storybook-link.js"),TipDevTipPopover=function TipDevTipPopover(){return(0,jsx_runtime.jsxs)(tip.A,{title:"Dev tip",children:["For more details about dropdowns APIs for displaying correctly inside"," ",(0,jsx_runtime.jsx)(storybook_link.A,{page:"Components/Dialog/Dialog",size:storybook_link.A.sizes.SMALL,children:"Dialogs,"})," ",(0,jsx_runtime.jsx)(storybook_link.A,{page:"Feedback/Modal",size:storybook_link.A.sizes.SMALL,children:"Modals"})," ","and other popovers click"," ",(0,jsx_runtime.jsx)(storybook_link.A,{page:"Technical patterns/Dropdowns inside pop overs",story:"Modal with damaged dropdown",size:storybook_link.A.sizes.SMALL,children:"here"}),"."]})};function _createMdxContent(props){const _components=Object.assign({h1:"h1",ul:"ul",li:"li",a:"a",h2:"h2",p:"p",h3:"h3",code:"code"},(0,lib.RP)(),props.components),{PropsTable,UsageGuidelines,ComponentRules,StorybookLink,RelatedComponents}=_components;return ComponentRules||_missingMdxReference("ComponentRules",!0),PropsTable||_missingMdxReference("PropsTable",!0),RelatedComponents||_missingMdxReference("RelatedComponents",!0),StorybookLink||_missingMdxReference("StorybookLink",!0),UsageGuidelines||_missingMdxReference("UsageGuidelines",!0),(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(dist.W8,{of:dropdown_stories}),"\n",(0,jsx_runtime.jsx)(_components.h1,{id:"dropdown",children:"Dropdown"}),"\n",(0,jsx_runtime.jsxs)(_components.ul,{children:["\n",(0,jsx_runtime.jsx)(_components.li,{children:(0,jsx_runtime.jsx)(_components.a,{href:"#overview",children:"Overview"})}),"\n",(0,jsx_runtime.jsx)(_components.li,{children:(0,jsx_runtime.jsx)(_components.a,{href:"#props",children:"Props"})}),"\n",(0,jsx_runtime.jsx)(_components.li,{children:(0,jsx_runtime.jsx)(_components.a,{href:"#usage",children:"Usage"})}),"\n",(0,jsx_runtime.jsx)(_components.li,{children:(0,jsx_runtime.jsx)(_components.a,{href:"#variants",children:"Variants"})}),"\n",(0,jsx_runtime.jsx)(_components.li,{children:(0,jsx_runtime.jsx)(_components.a,{href:"#dos-and-donts",children:"Do’s and don’ts"})}),"\n",(0,jsx_runtime.jsx)(_components.li,{children:(0,jsx_runtime.jsx)(_components.a,{href:"#use-cases-and-examples",children:"Use cases and examples"})}),"\n",(0,jsx_runtime.jsx)(_components.li,{children:(0,jsx_runtime.jsx)(_components.a,{href:"#related-components",children:"Related components"})}),"\n",(0,jsx_runtime.jsx)(_components.li,{children:(0,jsx_runtime.jsx)(_components.a,{href:"#feedback",children:"Feedback"})}),"\n"]}),"\n",(0,jsx_runtime.jsx)(_components.h2,{id:"overview",children:"Overview"}),"\n",(0,jsx_runtime.jsx)(_components.p,{children:"Dropdown present a list of options from which a user can select one or several."}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.Overview}),"\n",(0,jsx_runtime.jsx)(_components.h2,{id:"props",children:"Props"}),"\n",(0,jsx_runtime.jsx)(PropsTable,{}),"\n",(0,jsx_runtime.jsx)(_components.h2,{id:"usage",children:"Usage"}),"\n",(0,jsx_runtime.jsx)(UsageGuidelines,{guidelines:["Dropdown menus are typically used when you have 5-8 items to choose from. They're used for navigation or command menus, where an action is initiated based on the selection.","Use a consistent size of form components on the same page. For example, if you are using a medium size dropdown also use the same size text inputs, buttons, and so on.","Avoid having multiple lines of text in a dropdown. If the text is too long for one line, add an ellipsis (…).","When the menu is open, each option in the menu should be the same height as the field.","When organizing dropdown menu items, sort the list in a logical order by putting the most selected option at the top."]}),"\n",(0,jsx_runtime.jsx)(_components.h2,{id:"variants",children:"Variants"}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"sizes",children:"Sizes"}),"\n",(0,jsx_runtime.jsx)(_components.p,{children:"There are three sizes available: Small, Medium, and Large"}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.Sizes}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"disabled",children:"Disabled"}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.Disabled}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"readonly",children:"Readonly"}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.Readonly}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"rtl",children:"RTL"}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.Rtl}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"multi-line-states",children:"Multi line states"}),"\n",(0,jsx_runtime.jsx)(_components.p,{children:"The Dropdown component supports multiple options selection in two different state - single line and multiple lines."}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.MultiChoiceWithDifferentStates}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"dropdown-with-avatar",children:"Dropdown with avatar"}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownWithAvatar}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"dropdown-with-icon",children:"Dropdown with icon"}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownWithIcon}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"dropdown-with-chip-colors",children:"Dropdown with chip colors"}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownWithChipColors}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"dropdown-with-tooltips-on-items",children:"Dropdown with tooltips on items"}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownWithTooltipsOnItems}),"\n",(0,jsx_runtime.jsx)(_components.h2,{id:"dos-and-donts",children:"Do’s and Don’ts"}),"\n",(0,jsx_runtime.jsx)(ComponentRules,{rules:[{positive:{component:(0,jsx_runtime.jsx)(Dropdown.A,{placeholder:"Placeholder text here",options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"},{value:3,label:"Option 3"}],className:"dropdown-stories-styles_rules-spacing"}),description:"Use the dropdown as a closed component. Users should normally be allowed only to click on the items; search is not recommended, though possible."},negative:{component:(0,jsx_runtime.jsx)(Dropdown.A,{menuIsOpen:!0,placeholder:"Placeholder text here",options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"},{value:3,label:"Option 3"}],className:"dropdown-stories-styles_rules-spacing"}),description:(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:["Don't keep the dropdown component in open mode as permanent state. If this is a design requirement consider use ",(0,jsx_runtime.jsx)(StorybookLink,{page:"Inputs/Combobox",children:"Combo box"})," instead."]})}}]}),"\n",(0,jsx_runtime.jsx)(_components.h2,{id:"use-cases-and-examples",children:"Use cases and examples"}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"multiple-dropdown-with-renderers-as-options",children:"Multiple dropdown with renderers as options"}),"\n",(0,jsx_runtime.jsx)(_components.p,{children:"Inside the advanced filters, a user can select multiple people from the dropdown menu, and they will be shown as Chips."}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownWithChips}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"searchable-dropdown",children:"Searchable Dropdown"}),"\n",(0,jsx_runtime.jsxs)(_components.p,{children:["In case of multiple options, you can use the ",(0,jsx_runtime.jsx)(_components.code,{children:"onInputChange"})," prop to allow filtering options."]}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.SearchableDropdown}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"dropdown-with-labels",children:"Dropdown with labels"}),"\n",(0,jsx_runtime.jsx)(_components.p,{children:"A dropdown menu can include labels."}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownWithLabels}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"dropdown-inside-a-form",children:"Dropdown inside a form"}),"\n",(0,jsx_runtime.jsx)(_components.p,{children:"A classic dropdown presents options a user needs to choose from."}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownInsideAForm}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"dropdown-with-groups",children:"Dropdown with groups"}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownWithGroups}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"dropdown-inside-popover",children:"Dropdown inside popover"}),"\n",(0,jsx_runtime.jsxs)(_components.p,{children:["Use ",(0,jsx_runtime.jsxs)("code",{children:["menuPosition=",Dropdown.A.menuPositions.FIXED]})," prop attribute for displaying dropdown inside popover (like our Modal\ncomponent) or container with overflow hidden content."]}),"\n",(0,jsx_runtime.jsx)(TipDevTipPopover,{}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownInsidePopover}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"dropdown-with-loading",children:"Dropdown with loading"}),"\n",(0,jsx_runtime.jsx)(_components.p,{children:"If importing the dropdown options may take time, you can reflect this to the user using Dropdown isLoading flag with optional custom message."}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownWithLoading}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"dropdown-with-ref",children:"Dropdown with ref"}),"\n",(0,jsx_runtime.jsxs)(_components.p,{children:["If you need to programmatically control Dropdown state, use ",(0,jsx_runtime.jsx)(_components.code,{children:"ref"})," prop. Pay attention that type of returned ref will be ",(0,jsx_runtime.jsx)(_components.code,{children:"StateManager"})," from ",(0,jsx_runtime.jsx)(link_link.A,{withoutSpacing:!0,href:"https://react-select.com/home",children:(0,jsx_runtime.jsx)(_components.code,{children:"react-select"})})," library."]}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownWithRef}),"\n",(0,jsx_runtime.jsx)(_components.h3,{id:"dropdown-value-selection",children:"Dropdown value selection"}),"\n",(0,jsx_runtime.jsxs)(_components.p,{children:["Control the value selection mechanism with the ",(0,jsx_runtime.jsx)("code",{children:"tabSelectsValue"})," (default: true) prop."]}),"\n",(0,jsx_runtime.jsx)(dist.Hl,{of:dropdown_stories.DropdownValueSelection}),"\n",(0,jsx_runtime.jsx)(_components.h2,{id:"related-components",children:"Related components"}),"\n",(0,jsx_runtime.jsx)(RelatedComponents,{componentsNames:[component_description_map.k4,component_description_map.uY,component_description_map.sc]})]})}TipDevTipPopover.displayName="TipDevTipPopover";const dropdown=function MDXContent(props={}){const{wrapper:MDXLayout}=Object.assign({},(0,lib.RP)(),props.components);return MDXLayout?(0,jsx_runtime.jsx)(MDXLayout,Object.assign({},props,{children:(0,jsx_runtime.jsx)(_createMdxContent,props)})):_createMdxContent(props)};function _missingMdxReference(id,component){throw new Error("Expected "+(component?"component":"object")+" `"+id+"` to be defined: you likely forgot to import, pass, or provide it.")}}}]); \ No newline at end of file diff --git a/components-Dropdown-__stories__-dropdown-stories.8adb3100.iframe.bundle.js b/components-Dropdown-__stories__-dropdown-stories.8adb3100.iframe.bundle.js new file mode 100644 index 0000000000..e352baf685 --- /dev/null +++ b/components-Dropdown-__stories__-dropdown-stories.8adb3100.iframe.bundle.js @@ -0,0 +1,2 @@ +/*! For license information please see components-Dropdown-__stories__-dropdown-stories.8adb3100.iframe.bundle.js.LICENSE.txt */ +"use strict";(globalThis.webpackChunkmonday_ui_react_core=globalThis.webpackChunkmonday_ui_react_core||[]).push([[8587],{"./src/components/Dropdown/__stories__/dropdown.stories.js":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{AsyncOptions:()=>AsyncOptions,Disabled:()=>Disabled,DropdownInsideAForm:()=>DropdownInsideAForm,DropdownInsidePopover:()=>DropdownInsidePopover,DropdownValueSelection:()=>DropdownValueSelection,DropdownWithAvatar:()=>DropdownWithAvatar,DropdownWithChipColors:()=>DropdownWithChipColors,DropdownWithChips:()=>DropdownWithChips,DropdownWithGroups:()=>DropdownWithGroups,DropdownWithIcon:()=>DropdownWithIcon,DropdownWithLabels:()=>DropdownWithLabels,DropdownWithLoading:()=>DropdownWithLoading,DropdownWithRef:()=>DropdownWithRef,DropdownWithTooltipsOnItems:()=>DropdownWithTooltipsOnItems,MultiChoiceWithDifferentStates:()=>MultiChoiceWithDifferentStates,Overview:()=>Overview,Readonly:()=>Readonly,Rtl:()=>Rtl,SearchableDropdown:()=>SearchableDropdown,Sizes:()=>Sizes,__namedExportsOrder:()=>__namedExportsOrder,default:()=>Dropdown_stories_dropdown_stories});var react=__webpack_require__("../../node_modules/react/index.js"),story_description=__webpack_require__("../storybook-blocks/dist/src/components/story-description/story-description.js"),createStoryMetaSettingsDecorator=__webpack_require__("./src/storybook/functions/createStoryMetaSettingsDecorator.ts"),dist=__webpack_require__("../../node_modules/@storybook/testing-library/dist/index.mjs"),interactions_utils=__webpack_require__("./src/tests/interactions-utils.ts"),jest_dist=__webpack_require__("../../node_modules/@storybook/jest/dist/index.mjs");function _typeof(o){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},_typeof(o)}function _regeneratorRuntime(){_regeneratorRuntime=function _regeneratorRuntime(){return e};var t,e={},r=Object.prototype,n=r.hasOwnProperty,o=Object.defineProperty||function(t,e,r){t[e]=r.value},i="function"==typeof Symbol?Symbol:{},a=i.iterator||"@@iterator",c=i.asyncIterator||"@@asyncIterator",u=i.toStringTag||"@@toStringTag";function define(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{define({},"")}catch(t){define=function define(t,e,r){return t[e]=r}}function wrap(t,e,r,n){var i=e&&e.prototype instanceof Generator?e:Generator,a=Object.create(i.prototype),c=new Context(n||[]);return o(a,"_invoke",{value:makeInvokeMethod(t,r,c)}),a}function tryCatch(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}e.wrap=wrap;var h="suspendedStart",l="suspendedYield",f="executing",s="completed",y={};function Generator(){}function GeneratorFunction(){}function GeneratorFunctionPrototype(){}var p={};define(p,a,(function(){return this}));var d=Object.getPrototypeOf,v=d&&d(d(values([])));v&&v!==r&&n.call(v,a)&&(p=v);var g=GeneratorFunctionPrototype.prototype=Generator.prototype=Object.create(p);function defineIteratorMethods(t){["next","throw","return"].forEach((function(e){define(t,e,(function(t){return this._invoke(e,t)}))}))}function AsyncIterator(t,e){function invoke(r,o,i,a){var c=tryCatch(t[r],t,o);if("throw"!==c.type){var u=c.arg,h=u.value;return h&&"object"==_typeof(h)&&n.call(h,"__await")?e.resolve(h.__await).then((function(t){invoke("next",t,i,a)}),(function(t){invoke("throw",t,i,a)})):e.resolve(h).then((function(t){u.value=t,i(u)}),(function(t){return invoke("throw",t,i,a)}))}a(c.arg)}var r;o(this,"_invoke",{value:function value(t,n){function callInvokeWithMethodAndArg(){return new e((function(e,r){invoke(t,n,e,r)}))}return r=r?r.then(callInvokeWithMethodAndArg,callInvokeWithMethodAndArg):callInvokeWithMethodAndArg()}})}function makeInvokeMethod(e,r,n){var o=h;return function(i,a){if(o===f)throw Error("Generator is already running");if(o===s){if("throw"===i)throw a;return{value:t,done:!0}}for(n.method=i,n.arg=a;;){var c=n.delegate;if(c){var u=maybeInvokeDelegate(c,n);if(u){if(u===y)continue;return u}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if(o===h)throw o=s,n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);o=f;var p=tryCatch(e,r,n);if("normal"===p.type){if(o=n.done?s:l,p.arg===y)continue;return{value:p.arg,done:n.done}}"throw"===p.type&&(o=s,n.method="throw",n.arg=p.arg)}}}function maybeInvokeDelegate(e,r){var n=r.method,o=e.iterator[n];if(o===t)return r.delegate=null,"throw"===n&&e.iterator.return&&(r.method="return",r.arg=t,maybeInvokeDelegate(e,r),"throw"===r.method)||"return"!==n&&(r.method="throw",r.arg=new TypeError("The iterator does not provide a '"+n+"' method")),y;var i=tryCatch(o,e.iterator,r.arg);if("throw"===i.type)return r.method="throw",r.arg=i.arg,r.delegate=null,y;var a=i.arg;return a?a.done?(r[e.resultName]=a.value,r.next=e.nextLoc,"return"!==r.method&&(r.method="next",r.arg=t),r.delegate=null,y):a:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function pushTryEntry(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function resetTryEntry(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function Context(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(pushTryEntry,this),this.reset(!0)}function values(e){if(e||""===e){var r=e[a];if(r)return r.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var o=-1,i=function next(){for(;++o=0;--o){var i=this.tryEntries[o],a=i.completion;if("root"===i.tryLoc)return handle("end");if(i.tryLoc<=this.prev){var c=n.call(i,"catchLoc"),u=n.call(i,"finallyLoc");if(c&&u){if(this.prev=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),resetTryEntry(r),y}},catch:function _catch(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;resetTryEntry(r)}return o}}throw Error("illegal catch attempt")},delegateYield:function delegateYield(e,r,n){return this.delegate={iterator:values(e),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=t),y}},e}function asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg),value=info.value}catch(error){return void reject(error)}info.done?resolve(value):Promise.resolve(value).then(_next,_throw)}function _asyncToGenerator(fn){return function(){var self=this,args=arguments;return new Promise((function(resolve,reject){var gen=fn.apply(self,args);function _next(value){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"next",value)}function _throw(err){asyncGeneratorStep(gen,resolve,reject,_next,_throw,"throw",err)}_next(void 0)}))}}var _beforeEach,selectAndClearTest=function(){var _ref=_asyncToGenerator(_regeneratorRuntime().mark((function _callee(canvas){var dropdownElement,optionToSelect,clearButton;return _regeneratorRuntime().wrap((function _callee$(_context){for(;;)switch(_context.prev=_context.next){case 0:return _context.next=2,(0,interactions_utils.gy)(canvas,"textbox");case 2:return dropdownElement=_context.sent,_context.next=5,(0,interactions_utils.jp)(dropdownElement);case 5:return _context.next=7,(0,interactions_utils.wQ)(dropdownElement,"Option");case 7:return optionToSelect=(0,interactions_utils.Tf)(canvas,"Option 1"),_context.next=10,(0,interactions_utils.jp)(optionToSelect);case 10:return clearButton=(0,interactions_utils.Xr)("clear-indicator"),_context.next=13,(0,interactions_utils.jp)(clearButton);case 13:(0,interactions_utils.Tf)(canvas,"Placeholder text here");case 14:case"end":return _context.stop()}}),_callee)})));return function selectAndClearTest(_x){return _ref.apply(this,arguments)}}(),hideDropdownWhenPressingEscape=function(){var _ref2=_asyncToGenerator(_regeneratorRuntime().mark((function _callee2(canvas){var dropdownElement,optionElement;return _regeneratorRuntime().wrap((function _callee2$(_context2){for(;;)switch(_context2.prev=_context2.next){case 0:return _context2.next=2,(0,interactions_utils.gy)(canvas,"textbox");case 2:return dropdownElement=_context2.sent,_context2.next=5,(0,interactions_utils.jp)(dropdownElement);case 5:return _context2.next=7,(0,interactions_utils.Tf)(canvas,"Option 1");case 7:return _context2.next=9,(0,interactions_utils.wQ)(dropdownElement,"{escape}");case 9:return _context2.next=11,canvas.queryByText("Option 1");case 11:optionElement=_context2.sent,(0,jest_dist.E)(optionElement).toBeNull();case 13:case"end":return _context2.stop()}}),_callee2)})));return function hideDropdownWhenPressingEscape(_x2){return _ref2.apply(this,arguments)}}(),overviewPlaySuite=(0,interactions_utils.Ld)({beforeEach:(_beforeEach=_asyncToGenerator(_regeneratorRuntime().mark((function _callee3(canvas){var dropdownElement,optionElement;return _regeneratorRuntime().wrap((function _callee3$(_context3){for(;;)switch(_context3.prev=_context3.next){case 0:return _context3.next=2,(0,interactions_utils.gy)(canvas,"textbox");case 2:return dropdownElement=_context3.sent,_context3.next=5,dist.Q4.clear(dropdownElement);case 5:return(0,jest_dist.E)(dropdownElement.value).toEqual(""),_context3.next=8,(0,interactions_utils.wQ)(dropdownElement,"{escape}");case 8:return _context3.next=10,canvas.queryByText("Option 1");case 10:optionElement=_context3.sent,(0,jest_dist.E)(optionElement).toBeNull();case 12:case"end":return _context3.stop()}}),_callee3)}))),function beforeEach(_x3){return _beforeEach.apply(this,arguments)}),tests:[selectAndClearTest,hideDropdownWhenPressingEscape]}),openMultiValueDialog=function(){var _ref3=_asyncToGenerator(_regeneratorRuntime().mark((function _callee5(canvas){var optionElement;return _regeneratorRuntime().wrap((function _callee5$(_context5){for(;;)switch(_context5.prev=_context5.next){case 0:return _context5.next=2,canvas.queryByText("+2");case 2:return optionElement=_context5.sent,_context5.next=5,(0,interactions_utils.jp)(optionElement);case 5:return _context5.next=7,(0,dist.fm)(_asyncToGenerator(_regeneratorRuntime().mark((function _callee4(){var popover;return _regeneratorRuntime().wrap((function _callee4$(_context4){for(;;)switch(_context4.prev=_context4.next){case 0:return _context4.next=2,(0,interactions_utils.gy)(document.body,"dialog");case 2:popover=_context4.sent,(0,jest_dist.E)(popover).toBeInTheDocument();case 4:case"end":return _context4.stop()}}),_callee4)}))));case 7:case"end":return _context5.stop()}}),_callee5)})));return function openMultiValueDialog(_x4){return _ref3.apply(this,arguments)}}(),multiInteractionTests=(0,interactions_utils.Ld)({tests:[openMultiValueDialog]});const person1_namespaceObject=__webpack_require__.p+"static/media/person1.de30c8ee.png",person3_namespaceObject=__webpack_require__.p+"static/media/person3.7ed20eb8.png",person2_namespaceObject=__webpack_require__.p+"static/media/person2.2c51a581.png";var Avatar=__webpack_require__("./src/components/Avatar/Avatar.tsx"),injectStylesIntoStyleTag=__webpack_require__("../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),injectStylesIntoStyleTag_default=__webpack_require__.n(injectStylesIntoStyleTag),styleDomAPI=__webpack_require__("../../node_modules/style-loader/dist/runtime/styleDomAPI.js"),styleDomAPI_default=__webpack_require__.n(styleDomAPI),insertBySelector=__webpack_require__("../../node_modules/style-loader/dist/runtime/insertBySelector.js"),insertBySelector_default=__webpack_require__.n(insertBySelector),setAttributesWithoutAttributes=__webpack_require__("../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),setAttributesWithoutAttributes_default=__webpack_require__.n(setAttributesWithoutAttributes),insertStyleElement=__webpack_require__("../../node_modules/style-loader/dist/runtime/insertStyleElement.js"),insertStyleElement_default=__webpack_require__.n(insertStyleElement),styleTagTransform=__webpack_require__("../../node_modules/style-loader/dist/runtime/styleTagTransform.js"),styleTagTransform_default=__webpack_require__.n(styleTagTransform),dropdown_stories=__webpack_require__("../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[15].use[1]!../../node_modules/resolve-url-loader/index.js!../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[15].use[3]!./src/components/Dropdown/__stories__/dropdown.stories.scss"),options={};options.styleTagTransform=styleTagTransform_default(),options.setAttributes=setAttributesWithoutAttributes_default(),options.insert=insertBySelector_default().bind(null,"head"),options.domAPI=styleDomAPI_default(),options.insertStyleElement=insertStyleElement_default();injectStylesIntoStyleTag_default()(dropdown_stories.A,options);dropdown_stories.A&&dropdown_stories.A.locals&&dropdown_stories.A.locals;var jsx_runtime=__webpack_require__("../../node_modules/react/jsx-runtime.js"),OptionRenderer=function OptionRenderer(_ref){var src=_ref.src,type=_ref.type,size=_ref.size,name=_ref.name,position=_ref.position;return(0,jsx_runtime.jsxs)("div",{className:"dropdown-stories-styles_inline-container",children:[(0,jsx_runtime.jsx)(Avatar.A,{size,src,type},name),(0,jsx_runtime.jsxs)("span",{className:"dropdown-stories-styles_name",children:[name,(0,jsx_runtime.jsx)("span",{children:position})]})]})};OptionRenderer.displayName="OptionRenderer",OptionRenderer.__docgenInfo={description:"",methods:[],displayName:"OptionRenderer"};var Email=__webpack_require__("./src/components/Icon/Icons/components/Email.tsx"),Attach=__webpack_require__("./src/components/Icon/Icons/components/Attach.tsx"),Dropdown=__webpack_require__("./src/components/Dropdown/Dropdown.jsx"),Flex=__webpack_require__("./src/components/Flex/Flex.tsx"),Label=__webpack_require__("./src/components/Label/Label.tsx"),DialogContentContainer=__webpack_require__("./src/components/DialogContentContainer/DialogContentContainer.tsx"),Box=__webpack_require__("./src/components/Box/Box.tsx"),Button=__webpack_require__("./src/components/Button/Button.tsx"),Modal=__webpack_require__("./src/components/Modal/Modal.tsx"),ModalContent=__webpack_require__("./src/components/Modal/ModalContent/ModalContent.tsx"),ModalExampleContent=__webpack_require__("./src/storybook/patterns/dropdown-in-modals/ModalExampleContent.tsx"),dropdown_stories_helpers=__webpack_require__("./src/components/Dropdown/__stories__/dropdown.stories.helpers.tsx");function dropdown_stories_typeof(o){return dropdown_stories_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(o){return typeof o}:function(o){return o&&"function"==typeof Symbol&&o.constructor===Symbol&&o!==Symbol.prototype?"symbol":typeof o},dropdown_stories_typeof(o)}function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(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)||_unsupportedIterableToArray(arr,i)||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.")}()}function dropdown_stories_regeneratorRuntime(){dropdown_stories_regeneratorRuntime=function _regeneratorRuntime(){return e};var t,e={},r=Object.prototype,n=r.hasOwnProperty,o=Object.defineProperty||function(t,e,r){t[e]=r.value},i="function"==typeof Symbol?Symbol:{},a=i.iterator||"@@iterator",c=i.asyncIterator||"@@asyncIterator",u=i.toStringTag||"@@toStringTag";function define(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{define({},"")}catch(t){define=function define(t,e,r){return t[e]=r}}function wrap(t,e,r,n){var i=e&&e.prototype instanceof Generator?e:Generator,a=Object.create(i.prototype),c=new Context(n||[]);return o(a,"_invoke",{value:makeInvokeMethod(t,r,c)}),a}function tryCatch(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}e.wrap=wrap;var h="suspendedStart",l="suspendedYield",f="executing",s="completed",y={};function Generator(){}function GeneratorFunction(){}function GeneratorFunctionPrototype(){}var p={};define(p,a,(function(){return this}));var d=Object.getPrototypeOf,v=d&&d(d(values([])));v&&v!==r&&n.call(v,a)&&(p=v);var g=GeneratorFunctionPrototype.prototype=Generator.prototype=Object.create(p);function defineIteratorMethods(t){["next","throw","return"].forEach((function(e){define(t,e,(function(t){return this._invoke(e,t)}))}))}function AsyncIterator(t,e){function invoke(r,o,i,a){var c=tryCatch(t[r],t,o);if("throw"!==c.type){var u=c.arg,h=u.value;return h&&"object"==dropdown_stories_typeof(h)&&n.call(h,"__await")?e.resolve(h.__await).then((function(t){invoke("next",t,i,a)}),(function(t){invoke("throw",t,i,a)})):e.resolve(h).then((function(t){u.value=t,i(u)}),(function(t){return invoke("throw",t,i,a)}))}a(c.arg)}var r;o(this,"_invoke",{value:function value(t,n){function callInvokeWithMethodAndArg(){return new e((function(e,r){invoke(t,n,e,r)}))}return r=r?r.then(callInvokeWithMethodAndArg,callInvokeWithMethodAndArg):callInvokeWithMethodAndArg()}})}function makeInvokeMethod(e,r,n){var o=h;return function(i,a){if(o===f)throw Error("Generator is already running");if(o===s){if("throw"===i)throw a;return{value:t,done:!0}}for(n.method=i,n.arg=a;;){var c=n.delegate;if(c){var u=maybeInvokeDelegate(c,n);if(u){if(u===y)continue;return u}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if(o===h)throw o=s,n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);o=f;var p=tryCatch(e,r,n);if("normal"===p.type){if(o=n.done?s:l,p.arg===y)continue;return{value:p.arg,done:n.done}}"throw"===p.type&&(o=s,n.method="throw",n.arg=p.arg)}}}function maybeInvokeDelegate(e,r){var n=r.method,o=e.iterator[n];if(o===t)return r.delegate=null,"throw"===n&&e.iterator.return&&(r.method="return",r.arg=t,maybeInvokeDelegate(e,r),"throw"===r.method)||"return"!==n&&(r.method="throw",r.arg=new TypeError("The iterator does not provide a '"+n+"' method")),y;var i=tryCatch(o,e.iterator,r.arg);if("throw"===i.type)return r.method="throw",r.arg=i.arg,r.delegate=null,y;var a=i.arg;return a?a.done?(r[e.resultName]=a.value,r.next=e.nextLoc,"return"!==r.method&&(r.method="next",r.arg=t),r.delegate=null,y):a:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function pushTryEntry(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function resetTryEntry(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function Context(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(pushTryEntry,this),this.reset(!0)}function values(e){if(e||""===e){var r=e[a];if(r)return r.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var o=-1,i=function next(){for(;++o=0;--o){var i=this.tryEntries[o],a=i.completion;if("root"===i.tryLoc)return handle("end");if(i.tryLoc<=this.prev){var c=n.call(i,"catchLoc"),u=n.call(i,"finallyLoc");if(c&&u){if(this.prev=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),resetTryEntry(r),y}},catch:function _catch(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;resetTryEntry(r)}return o}}throw Error("illegal catch attempt")},delegateYield:function delegateYield(e,r,n){return this.delegate={iterator:values(e),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=t),y}},e}function dropdown_stories_asyncGeneratorStep(gen,resolve,reject,_next,_throw,key,arg){try{var info=gen[key](arg),value=info.value}catch(error){return void reject(error)}info.done?resolve(value):Promise.resolve(value).then(_next,_throw)}function _toConsumableArray(arr){return function _arrayWithoutHoles(arr){if(Array.isArray(arr))return _arrayLikeToArray(arr)}(arr)||function _iterableToArray(iter){if("undefined"!=typeof Symbol&&null!=iter[Symbol.iterator]||null!=iter["@@iterator"])return Array.from(iter)}(arr)||_unsupportedIterableToArray(arr)||function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function _unsupportedIterableToArray(o,minLen){if(o){if("string"==typeof o)return _arrayLikeToArray(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)?_arrayLikeToArray(o,minLen):void 0}}function _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i <>\n \n \n \n ,\n name: "Sizes"\n}',...Sizes.parameters?.docs?.source}}},Disabled.parameters={...Disabled.parameters,docs:{...Disabled.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n value: "1",\n label: "Option 1"\n }, {\n value: "2",\n label: "Option 2"\n }, {\n value: "3",\n label: "Option 3"\n }], []);\n return \n \n \n ;\n },\n name: "Disabled"\n}',...Disabled.parameters?.docs?.source}}},Readonly.parameters={...Readonly.parameters,docs:{...Readonly.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n value: "1",\n label: "Option 1"\n }, {\n value: "2",\n label: "Option 2"\n }, {\n value: "3",\n label: "Option 3"\n }], []);\n return \n \n \n ;\n },\n name: "Readonly"\n}',...Readonly.parameters?.docs?.source}}},Rtl.parameters={...Rtl.parameters,docs:{...Rtl.parameters?.docs,source:{originalSource:'{\n render: () => <>\n \n \n ,\n name: "RTL"\n}',...Rtl.parameters?.docs?.source}}},MultiChoiceWithDifferentStates.parameters={...MultiChoiceWithDifferentStates.parameters,docs:{...MultiChoiceWithDifferentStates.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n value: "Rotem",\n label: "Rotem Dekel"\n }, {\n value: "Hadas",\n label: "Hadas Farhi"\n }, {\n value: "Netta",\n label: "Netta Muller"\n }, {\n value: "Dor",\n label: "Dor Yehuda"\n }], []);\n return \n \n
\n \n
\n \n \n
\n \n
\n \n \n
\n \n
\n \n \n
\n \n
\n \n ;\n },\n name: "Multi-choice with different states",\n play: multiInteractionTests\n}',...MultiChoiceWithDifferentStates.parameters?.docs?.source}}},AsyncOptions.parameters={...AsyncOptions.parameters,docs:{...AsyncOptions.parameters?.docs,source:{originalSource:'{\n render: () => {\n const fetchUserOptions = async () => {\n try {\n const response = await fakeFetchUsers();\n const users = await response.json();\n return users.slice(0, 5).map(user => ({\n label: user.name,\n value: user.id\n }));\n } catch (error) {\n console.error("Error fetching user data:", error);\n }\n return [];\n };\n return
\n \n
;\n },\n name: "Async Dropdown"\n}',...AsyncOptions.parameters?.docs?.source}}},DropdownWithAvatar.parameters={...DropdownWithAvatar.parameters,docs:{...DropdownWithAvatar.parameters?.docs,source:{originalSource:'{\n render: () => {\n const optionsAvatar = useMemo(() => [{\n value: "Rotem",\n label: "Rotem Dekel",\n leftAvatar: person1\n }, {\n value: "Hadas",\n label: "Hadas Farhi",\n leftAvatar: person2\n }, {\n value: "Netta",\n label: "Netta Muller",\n leftAvatar: person3\n }], []);\n return \n \n
\n \n
\n \n \n
\n \n
\n \n ;\n },\n name: "Dropdown with avatar"\n}',...DropdownWithAvatar.parameters?.docs?.source}}},DropdownWithIcon.parameters={...DropdownWithIcon.parameters,docs:{...DropdownWithIcon.parameters?.docs,source:{originalSource:'{\n render: () => {\n const optionsIcons = useMemo(() => [{\n value: "email",\n label: "Email",\n leftIcon: Email\n }, {\n value: "attach",\n label: "Attach",\n leftIcon: Attach\n }], []);\n return \n \n
\n \n
\n \n \n
\n \n
\n \n ;\n },\n name: "Dropdown with icon"\n}',...DropdownWithIcon.parameters?.docs?.source}}},DropdownWithChipColors.parameters={...DropdownWithChipColors.parameters,docs:{...DropdownWithChipColors.parameters?.docs,source:{originalSource:'{\n render: () => {\n const optionsWithChipColors = useMemo(() => [{\n value: "Rotem",\n label: "Rotem Dekel",\n chipColor: Dropdown.chipColors.NEGATIVE\n }, {\n value: "Hadas",\n label: "Hadas Farhi",\n chipColor: Dropdown.chipColors.POSITIVE\n }, {\n value: "Netta",\n label: "Netta Muller",\n chipColor: Dropdown.chipColors.PRIMARY\n }], []);\n return \n
\n \n
\n ;\n },\n name: "Dropdown with chip colors"\n}',...DropdownWithChipColors.parameters?.docs?.source}}},DropdownWithTooltipsOnItems.parameters={...DropdownWithTooltipsOnItems.parameters,docs:{...DropdownWithTooltipsOnItems.parameters?.docs,source:{originalSource:'{\n render: () => {\n const optionsWithTooltips = useMemo(() => [{\n value: "Option 1",\n label: "Option 1",\n tooltipProps: {\n content: "Description for option 1"\n }\n }, {\n value: "Option 2",\n label: "Option 2",\n tooltipProps: {\n content: "Description for option 2"\n }\n }], []);\n return \n
\n \n
\n ;\n },\n name: "Dropdown with tooltips on items"\n}',...DropdownWithTooltipsOnItems.parameters?.docs?.source}}},DropdownWithChips.parameters={...DropdownWithChips.parameters,docs:{...DropdownWithChips.parameters?.docs,source:{originalSource:'{\n render: () => {\n const options = useMemo(() => [{\n value: "Dor Yehuda",\n label: "Hadas Farhi",\n src: person1,\n type: Avatar.types.IMG,\n size: Avatar.sizes.SMALL,\n name: "Dor Yehuda",\n position: "(Full Stack Developer)"\n }, {\n value: "No",\n label: "Rotem Dekel",\n src: person3,\n type: Avatar.types.IMG,\n size: Avatar.sizes.SMALL,\n name: "Rotem Dekel",\n position: "(Product Designer)"\n }, {\n value: "Yes",\n label: "Netta Muller",\n src: person2,\n type: Avatar.types.IMG,\n size: Avatar.sizes.SMALL,\n name: "Netta Muller",\n position: "(Brand Designer)"\n }], []);\n return ;\n },\n name: "Dropdown with chips"\n}',...DropdownWithChips.parameters?.docs?.source}}},SearchableDropdown.parameters={...SearchableDropdown.parameters,docs:{...SearchableDropdown.parameters?.docs,source:{originalSource:'{\n render: () => {\n const [searchValue, setSearchValue] = useState("");\n const allOptions = useMemo(() => [{\n value: "Red",\n label: "Red"\n }, {\n value: "Orange",\n label: "Orange"\n }, {\n value: "Yellow",\n label: "Yellow"\n }, {\n value: "Green",\n label: "Green"\n }, {\n value: "Blue",\n label: "Blue"\n }, {\n value: "Indigo",\n label: "Indigo"\n }, {\n value: "Violet",\n label: "Violet"\n }], []);\n const options = useMemo(() => {\n if (!searchValue) return allOptions;\n return allOptions.filter(option => option.label.toLowerCase().includes(searchValue.toLowerCase()));\n }, [allOptions, searchValue]);\n const onInputChange = value => setSearchValue(value);\n return ;\n },\n name: "Searchable dropdown"\n}',...SearchableDropdown.parameters?.docs?.source}}},DropdownWithLabels.parameters={...DropdownWithLabels.parameters,docs:{...DropdownWithLabels.parameters?.docs,source:{originalSource:'{\n render: () => {\n const labelRenderer = useCallback(({\n label,\n color\n }) => {\n return