-
Notifications
You must be signed in to change notification settings - Fork 0
/
main.3bf2a19b.iframe.bundle.js
2 lines (2 loc) · 403 KB
/
main.3bf2a19b.iframe.bundle.js
1
2
/*! For license information please see main.3bf2a19b.iframe.bundle.js.LICENSE.txt */
(self.webpackChunk_talxis_react_components=self.webpackChunk_talxis_react_components||[]).push([[179],{"./.storybook/preview.js-generated-config-entry.js":function(__unused_webpack_module,__unused_webpack___webpack_exports__,__webpack_require__){"use strict";var preview_namespaceObject={};__webpack_require__.r(preview_namespaceObject),__webpack_require__.d(preview_namespaceObject,{__namedExportsOrder:function(){return preview_namedExportsOrder},decorators:function(){return decorators},parameters:function(){return parameters}});__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptor.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.for-each.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-own-property-descriptors.js"),__webpack_require__("./node_modules/core-js/modules/es.object.define-properties.js"),__webpack_require__("./node_modules/core-js/modules/es.object.define-property.js");var ClientApi=__webpack_require__("./node_modules/@storybook/client-api/dist/esm/ClientApi.js"),lib=(__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js"),__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js")),ThemeProvider=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/ThemeProvider.js"),DefaultButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/DefaultButton/DefaultButton.js"),PrimaryButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/PrimaryButton/PrimaryButton.js"),Dialog=__webpack_require__("./node_modules/@fluentui/react/lib/components/Dialog/Dialog.js"),DialogFooter=__webpack_require__("./node_modules/@fluentui/react/lib/components/Dialog/DialogFooter.js"),Label=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),react=__webpack_require__("./node_modules/react/index.js"),ThemeRulesStandard=(__webpack_require__("./node_modules/core-js/modules/es.array.reduce.js"),__webpack_require__("./node_modules/core-js/modules/es.object.entries.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.date.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.number.constructor.js"),__webpack_require__("./node_modules/@fluentui/react/lib/components/ThemeGenerator/ThemeRulesStandard.js")),getColorFromString=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/color/getColorFromString.js"),ThemeGenerator=__webpack_require__("./node_modules/@fluentui/react/lib/components/ThemeGenerator/ThemeGenerator.js"),shades=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/color/shades.js"),createTheme=__webpack_require__("./node_modules/@fluentui/theme/lib/createTheme.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,(arg=descriptor.key,key=void 0,"symbol"==typeof(key=function _toPrimitive(input,hint){if("object"!=typeof input||null===input)return input;var prim=input[Symbol.toPrimitive];if(void 0!==prim){var res=prim.call(input,hint||"default");if("object"!=typeof res)return res;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===hint?String:Number)(input)}(arg,"string"))?key:String(key)),descriptor)}var arg,key}var ThemeDesigner=function(){function ThemeDesigner(){!function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}(this,ThemeDesigner)}return function _createClass(Constructor,protoProps,staticProps){return protoProps&&_defineProperties(Constructor.prototype,protoProps),staticProps&&_defineProperties(Constructor,staticProps),Object.defineProperty(Constructor,"prototype",{writable:!1}),Constructor}(ThemeDesigner,null,[{key:"generateTheme",value:function generateTheme(_ref){var primaryColor=_ref.primaryColor,textColor=_ref.textColor,backgroundColor=_ref.backgroundColor,themeRules=(0,ThemeRulesStandard.ep)(),colors={primaryColor:(0,getColorFromString.T)(primaryColor),textColor:(0,getColorFromString.T)(textColor),backgroundColor:(0,getColorFromString.T)(backgroundColor)};ThemeGenerator.b.setSlot(themeRules[ThemeRulesStandard.I[ThemeRulesStandard.I.backgroundColor]],colors.backgroundColor,void 0,false,true);var currentIsDark=(0,shades._T)(themeRules[ThemeRulesStandard.I[ThemeRulesStandard.I.backgroundColor]].color);ThemeGenerator.b.setSlot(themeRules[ThemeRulesStandard.I[ThemeRulesStandard.I.primaryColor]],colors.primaryColor,currentIsDark,false,true),ThemeGenerator.b.setSlot(themeRules[ThemeRulesStandard.I[ThemeRulesStandard.I.foregroundColor]],colors.textColor,currentIsDark,false,true);var abridgedTheme=Object.entries(themeRules).reduce((function(acc,_ref2){var _Object$assign,_ref3=_slicedToArray(_ref2,2),ruleName=_ref3[0],ruleValue=_ref3[1];return-1===ruleName.indexOf("ColorShade")&&"primaryColor"!==ruleName&&"backgroundColor"!==ruleName&&"foregroundColor"!==ruleName&&-1===ruleName.indexOf("body")?Object.assign({},acc,((_Object$assign={})[ruleName]=ruleValue,_Object$assign)):acc}),{});return(0,createTheme.j)({palette:ThemeGenerator.b.getThemeAsJson(abridgedTheme),isInverted:(0,shades._T)(themeRules[ThemeRulesStandard.I[ThemeRulesStandard.I.backgroundColor]].color)})}}]),ThemeDesigner}(),CommandBar=__webpack_require__("./src/components/CommandBar/CommandBar.tsx"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");function ThemeSelector_slicedToArray(arr,i){return function ThemeSelector_arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function ThemeSelector_iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function ThemeSelector_unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return ThemeSelector_arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return ThemeSelector_arrayLikeToArray(o,minLen)}(arr,i)||function ThemeSelector_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 ThemeSelector_arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}var ThemeSelector=function ThemeSelector(props){var _React$useState2=ThemeSelector_slicedToArray(react.useState(!1),2),dialogVisible=_React$useState2[0],setDialogVisible=_React$useState2[1],_React$useState3=react.useState(function loadThemeFromLocalStorage(){var theme=window.localStorage.getItem("talxisTheme");return theme?JSON.parse(theme):(0,lib.gh)()}()),_React$useState4=ThemeSelector_slicedToArray(_React$useState3,2),theme=_React$useState4[0],setTheme=_React$useState4[1],_React$useState6=ThemeSelector_slicedToArray(react.useState({primaryColor:theme.palette.themePrimary,textColor:theme.semanticColors.bodyText,backgroundColor:theme.semanticColors.bodyBackground}),2),inputs=_React$useState6[0],setInputs=_React$useState6[1],setColors=function setColors(key,value){var _Object$assign;setInputs(Object.assign({},inputs,((_Object$assign={})[key]=value,_Object$assign)))};return(0,jsx_runtime.jsxs)(ThemeProvider.f,{style:{padding:5},theme:theme,applyTo:"none",children:[(0,jsx_runtime.jsx)(CommandBar.X,{styles:{root:{height:32}},farItems:[{key:"theme",onClick:function onClick(){return setDialogVisible(!0)},iconProps:{iconName:"Color"}}],items:[]}),props.children,(0,jsx_runtime.jsxs)(Dialog.V,{dialogContentProps:{showCloseButton:!0},title:"Theming",onDismiss:function onDismiss(){return setDialogVisible(!1)},hidden:!dialogVisible,children:[(0,jsx_runtime.jsxs)("div",{className:(0,lib.y0)({display:"grid",gridTemplateColumns:"3fr 1fr",gridAutoRows:"50px",alignItems:"center"}),children:[(0,jsx_runtime.jsx)(Label._,{children:"Primary color"}),(0,jsx_runtime.jsx)("input",{onChange:function onChange(e){return setColors("primaryColor",e.currentTarget.value)},value:inputs.primaryColor,type:"color"}),(0,jsx_runtime.jsx)(Label._,{children:"Text color"}),(0,jsx_runtime.jsx)("input",{onChange:function onChange(e){return setColors("textColor",e.currentTarget.value)},value:inputs.textColor,type:"color"}),(0,jsx_runtime.jsx)(Label._,{children:"Background color"}),(0,jsx_runtime.jsx)("input",{onChange:function onChange(e){return setColors("backgroundColor",e.currentTarget.value)},value:inputs.backgroundColor,type:"color"})]}),(0,jsx_runtime.jsxs)(DialogFooter.c,{children:[(0,jsx_runtime.jsx)(PrimaryButton.K,{onClick:function generateTheme(){var theme=ThemeDesigner.generateTheme({primaryColor:inputs.primaryColor,textColor:inputs.textColor,backgroundColor:inputs.backgroundColor});setTheme(theme),setDialogVisible(!1),function saveThemeToLocalStorage(theme){window.localStorage.setItem("talxisTheme",JSON.stringify(theme))}(theme)},text:"OK"}),(0,jsx_runtime.jsx)(DefaultButton.a,{onClick:function setDefaultTheme(){window.localStorage.removeItem("talxisTheme");var theme=ThemeDesigner.generateTheme({primaryColor:"#0078d4",textColor:"#323130",backgroundColor:"#ffffff"});setInputs({primaryColor:theme.palette.themePrimary,textColor:theme.semanticColors.bodyText,backgroundColor:theme.semanticColors.bodyBackground}),setTheme(theme)},text:"Default"})]})]})]})};ThemeSelector.displayName="ThemeSelector";try{ThemeSelector.displayName="ThemeSelector",ThemeSelector.__docgenInfo={description:"",displayName:"ThemeSelector",props:{}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES[".storybook/ThemeSelector.tsx#ThemeSelector"]={docgenInfo:ThemeSelector.__docgenInfo,name:"ThemeSelector",path:".storybook/ThemeSelector.tsx#ThemeSelector"})}catch(__react_docgen_typescript_loader_error){}var parameters={controls:{matchers:{color:/(background|color)$/i,date:/Date$/}}},decorators=[function(Story){return(0,jsx_runtime.jsx)(ThemeSelector,{children:(0,jsx_runtime.jsx)(Story,{})})}],preview_namedExportsOrder=["parameters","decorators"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter((function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable}))),keys.push.apply(keys,symbols)}return keys}function _defineProperty(obj,key,value){return key in obj?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}Object.keys(preview_namespaceObject).forEach((function(key){var value=preview_namespaceObject[key];switch(key){case"args":return(0,ClientApi.uc)(value);case"argTypes":return(0,ClientApi.v9)(value);case"decorators":return value.forEach((function(decorator){return(0,ClientApi.$9)(decorator,!1)}));case"loaders":return value.forEach((function(loader){return(0,ClientApi.HZ)(loader,!1)}));case"parameters":return(0,ClientApi.h1)(function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach((function(key){_defineProperty(target,key,source[key])})):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach((function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))}))}return target}({},value),!1);case"argTypesEnhancers":return value.forEach((function(enhancer){return(0,ClientApi.My)(enhancer)}));case"argsEnhancers":return value.forEach((function(enhancer){return(0,ClientApi._C)(enhancer)}));case"render":return(0,ClientApi.$P)(value);case"globals":case"globalTypes":var v={};return v[key]=value,(0,ClientApi.h1)(v,!1);case"__namedExportsOrder":case"decorateStory":case"renderToDOM":return null;default:return console.log(key+" was not supported :( !")}}))},"./src/stories/Autocomplete/Autocomplete.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{BasicInformation:function(){return BasicInformation},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),react__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/react/index.js"),_components_Autocomplete_Autocomplete__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./src/components/Autocomplete/Autocomplete.tsx"),_argTypes__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./src/stories/Autocomplete/argTypes.ts"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_14__.l)(),__webpack_exports__.default={title:"TALXIS React Components/Autocomplete/Basic Information",component:_components_Autocomplete_Autocomplete__WEBPACK_IMPORTED_MODULE_15__.F,parameters:{docs:{description:{component:"**Autocomplete** expands our base [**TextField**](/story/talxis-react-components-textfield-basic-information--basic-information) component with the availability to get suggestions for text being currently typed into the input. Since this component is a wrapper\n around our [**TextField**](/story/talxis-react-components-textfield-basic-information--basic-information), you can use all of the [**TextField**](/story/talxis-react-components-textfield-basic-information--basic-information) extensions as well.\n The suggestions implementation is similar to our [**TagPicker**](/story/talxis-react-components-tagpicker-basic-information--basic-information) component. Each suggestion item is represented by [**IAutoCompleteItemProps**]() that extends the ICommandBarItemProps\n interface, which allows each suggestion item to leverage all of [**CommandBar**](https://developer.microsoft.com/en-us/fluentui#/controls/web/commandbar) item customizability and more.\n The component also utilizes virtualized list for suggestions, meaning you can have a large number of suggestions with low impact on performance."}}},argTypes:_argTypes__WEBPACK_IMPORTED_MODULE_16__.P};var BasicInformation=function BasicInformation(props){var getSuggestions=function getSuggestions(){for(var items=[],i=1;i<5e3;i++)items.push({key:"item_"+i,text:i%2?"Item "+i:"Item "+i+" with very long text that wil most likely overflow in small container"});return items},_React$useState2=_slicedToArray(react__WEBPACK_IMPORTED_MODULE_12__.useState(getSuggestions()[0]),2),selectedItem=_React$useState2[0],setSelectedItem=_React$useState2[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_17__._,{children:"Controlled Autocomplete"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_components_Autocomplete_Autocomplete__WEBPACK_IMPORTED_MODULE_15__.F,Object.assign({},props,{suggestionsProps:{suggestionRowHeight:35},onResolveSuggestions:function filterSuggestedItems(filter){return filter?getSuggestions().filter((function(item){var _item$text;return 0===(null===(_item$text=item.text)||void 0===_item$text?void 0:_item$text.toLowerCase().indexOf(filter.toLowerCase()))})):[]},selectedItem:selectedItem,onChange:function onChange(item){return setSelectedItem(item)}}))]})};BasicInformation.parameters={docs:{source:{type:"code"}}},BasicInformation.parameters=Object.assign({storySource:{source:"(props: IAutoCompleteProps) => {\n const getSuggestions = (): IAutoCompleteItemProps[] => {\n const items: IAutoCompleteItemProps[] = [];\n for (let i = 1; i < 5000; i++) {\n items.push({\n key: `item_${i}`,\n text: i % 2 ? `Item ${i}` : `Item ${i} with very long text that wil most likely overflow in small container`,\n })\n }\n return items;\n }\n const [selectedItem, setSelectedItem] = React.useState<IAutoCompleteItemProps | undefined | string>(getSuggestions()[0]);\n const filterSuggestedItems = (filter?: string): IAutoCompleteItemProps[] => {\n return filter\n ? getSuggestions().filter(\n item => item.text?.toLowerCase().indexOf(filter.toLowerCase()) === 0,\n )\n : [];\n };\n return (\n <>\n <Label>Controlled Autocomplete</Label>\n <Autocomplete {...props}\n suggestionsProps={{\n suggestionRowHeight: 35\n }}\n onResolveSuggestions={filterSuggestedItems}\n selectedItem={selectedItem}\n onChange={(item) => setSelectedItem(item)} />\n </>\n );\n}"}},BasicInformation.parameters);var __namedExportsOrder=["BasicInformation"];try{BasicInformation.displayName="BasicInformation",BasicInformation.__docgenInfo={description:"",displayName:"BasicInformation",props:{selectedItem:{defaultValue:null,description:"Currently selected item. If set, the component will become controlled.",name:"selectedItem",required:!1,type:{name:"string | IAutoCompleteItemProps"}},clearInputOnSelection:{defaultValue:null,description:"Clears the input if item has been selected. Works only in uncontrolled mode, in controlled mode, you need to set the selected item text to a null value.",name:"clearInputOnSelection",required:!1,type:{name:"boolean"}},suggestionsProps:{defaultValue:null,description:"Props that will be passed to the suggestions container.",name:"suggestionsProps",required:!1,type:{name:"ISuggestionsProps"}},calloutProps:{defaultValue:null,description:"Props that will be passed to the suggestions callout.",name:"calloutProps",required:!1,type:{name:"ICalloutProps"}},resolveDelay:{defaultValue:{value:"500"},description:"The delay time in ms before resolving suggestions, which is kicked off when input has been changed. \ne.g. If a second input change happens within the resolveDelay time, the timer will start over. \nOnly until after the timer completes will onResolveSuggestions be called.",name:"resolveDelay",required:!1,type:{name:"number"}},searchButtonProps:{defaultValue:null,description:"Props for the search button.",name:"searchButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},onChange:{defaultValue:null,description:"Fires when currently selected item changes. Returns the current input `string` if no suggestion was selected from the callout.",name:"onChange",required:!1,type:{name:"((item?: string | IAutoCompleteItemProps) => void)"}},showSuggestionsOnFocus:{defaultValue:{value:"false"},description:"Displays the callout on focus (on empty input) if enabled.\nThis is by default disabled to save calls of `onResolveSuggestions`.",name:"showSuggestionsOnFocus",required:!1,type:{name:"boolean"}},onResolveSuggestions:{defaultValue:null,description:"A callback for what should happen when a person types text into the input. \nReturns the current input value to be used as a filter. \nIf used in conjunction with resolveDelay this will only kick off after the delay throttle.",name:"onResolveSuggestions",required:!0,type:{name:"(filter?: string | undefined) => IAutoCompleteItemProps[] | PromiseLike<IAutoCompleteItemProps[]>"}},onRenderSuggestionItem:{defaultValue:null,description:"Function that specifies how an individual suggestion item will appear",name:"onRenderSuggestionItem",required:!1,type:{name:"((item: IAutoCompleteItemProps) => Element)"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/Autocomplete/Autocomplete.stories.tsx#BasicInformation"]={docgenInfo:BasicInformation.__docgenInfo,name:"BasicInformation",path:"src/stories/Autocomplete/Autocomplete.stories.tsx#BasicInformation"})}catch(__react_docgen_typescript_loader_error){}},"./src/stories/Autocomplete/Autocomplete_Extensions.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CustomButtons:function(){return CustomButtons},CustomRendering:function(){return CustomRendering},ErrorMessage:function(){return ErrorMessage},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),react__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/react/index.js"),_components_Autocomplete_Autocomplete__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./src/components/Autocomplete/Autocomplete.tsx"),_fluentui_react__WEBPACK_IMPORTED_MODULE_19__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Text/Text.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_18__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Image/Image.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_20__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Persona/Persona.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_21__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Persona/Persona.types.js"),_argTypes__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./src/stories/Autocomplete/argTypes.ts"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_14__.l)(),__webpack_exports__.default={title:"TALXIS React Components/Autocomplete/Extensions",component:_components_Autocomplete_Autocomplete__WEBPACK_IMPORTED_MODULE_15__.F,parameters:{docs:{description:{component:"Each suggestion item can have multiple additional buttons associated with itself along with many other props.\n As this component wraps around our `TextField`, you can leverage all of it's extensions like suffix and prefix items (see example below)."}}},argTypes:_argTypes__WEBPACK_IMPORTED_MODULE_16__.P};var CustomButtons=function CustomButtons(props){var getSuggestions=function getSuggestions(){for(var items=[],_loop=function _loop(i){items.push({key:"item_"+i,text:i%2?"Item "+i:"Item "+i+" with very long text that wil most likely overflow in small container",iconProps:{imageProps:{src:"https://picsum.photos/400/450?random="+i}},buttons:[{key:"item_"+i+"_button",onClick:function onClick(){return alert("Item "+i+" clicked!")},iconProps:{iconName:"BeerMug"}}],secondaryText:"Item "+i+" description"})},i=1;i<5e3;i++)_loop(i);return items},_React$useState2=_slicedToArray(react__WEBPACK_IMPORTED_MODULE_12__.useState(getSuggestions()[0]),2),selectedItem=_React$useState2[0],setSelectedItem=_React$useState2[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_17__._,{children:"Custom Buttons"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_components_Autocomplete_Autocomplete__WEBPACK_IMPORTED_MODULE_15__.F,Object.assign({},props,{searchButtonProps:{key:"search",iconProps:{iconName:"Search"}},prefixItems:function getPrefixItems(){var items=[];if(!selectedItem||selectedItem instanceof String||"string"==typeof selectedItem)return items;var item=selectedItem;return items.push({key:"iconPrefix",iconProps:item.iconProps}),items}(),suffixItems:function getSuffixItems(){var items=[];return!selectedItem||selectedItem instanceof String||"string"==typeof selectedItem||(items.push({key:"key",onClick:function onClick(){alert(selectedItem.text+" clicked!")},iconProps:{iconName:"CheckMark"}}),items.push({key:"expand",text:"Expandable",subMenuProps:{items:[{key:"item",text:"Item"}]}})),items}(),deleteButtonProps:{key:"delete",showOnlyOnHover:!0,iconProps:{iconName:"ChromeClose",styles:{root:{fontSize:12}}}},onResolveSuggestions:function filterSuggestedItems(filter){return filter?getSuggestions().filter((function(item){var _item$text;return 0===(null===(_item$text=item.text)||void 0===_item$text?void 0:_item$text.toLowerCase().indexOf(filter.toLowerCase()))})):getSuggestions()},onChange:function onChange(item){setSelectedItem(item)},selectedItem:selectedItem}))]})},CustomRendering=function CustomRendering(props){var filterSuggestedItems=function filterSuggestedItems(filter){return filter?function getSuggestions(){for(var items=[],_loop2=function _loop2(i){items.push({key:"Item "+i,text:i%2?"Item "+i:"Item "+i+" with very long text that wil most likely overflow in small container",tooltipHostProps:{tooltipProps:{onRenderContent:function onRenderContent(){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsxs)("div",{style:{textAlign:"center"},children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_18__.E,{styles:{root:{display:"inline-block"},image:{width:"300px"}},src:"https://picsum.photos/400/450?random="+i}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_19__.x,{styles:{root:{maxWidth:300}},block:!0,variant:"mediumPlus",children:i%2?"Item "+i:"Item "+i+" with very long text that wil most likely overflow in small container"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_19__.x,{children:"Item "+i+" description"})]})}}},iconProps:{imageProps:{src:"https://picsum.photos/400/450?random="+i}},buttons:[{key:"item_"+i+"_button",onClick:function onClick(){return alert("Item "+i+" clicked!")},iconProps:{iconName:"BeerMug"}}],secondaryText:"Item "+i+" description"})},i=1;i<5e3;i++)_loop2(i);return items}().filter((function(item){var _item$text2;return 0===(null===(_item$text2=item.text)||void 0===_item$text2?void 0:_item$text2.toLowerCase().indexOf(filter.toLowerCase()))})):[]};return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_17__._,{children:"Header, footer and tooltip"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_components_Autocomplete_Autocomplete__WEBPACK_IMPORTED_MODULE_15__.F,Object.assign({},props,{suggestionsProps:{onRenderHeader:function onRenderHeader(){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_19__.x,{block:!0,variant:"large",styles:{root:{margin:10,height:30}},children:"Custom header"})},onRenderFooter:function onRenderFooter(){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_19__.x,{block:!0,variant:"large",styles:{root:{margin:10,height:30}},children:"Custom footer"})}},onResolveSuggestions:filterSuggestedItems})),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_17__._,{children:"Suggestions"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_components_Autocomplete_Autocomplete__WEBPACK_IMPORTED_MODULE_15__.F,Object.assign({},props,{suggestionsProps:{suggestionsContainerWidth:400,suggestionsContainerHeight:250},onRenderSuggestionItem:function onRenderSuggestionItem(item){var _item$iconProps,_item$iconProps$image;return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.Fragment,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_20__.I,{showOverflowTooltip:!1,styles:{root:{marginLeft:5,marginTop:5}},text:item.text,secondaryText:item.secondaryText,imageUrl:null===(_item$iconProps=item.iconProps)||void 0===_item$iconProps||null===(_item$iconProps$image=_item$iconProps.imageProps)||void 0===_item$iconProps$image?void 0:_item$iconProps$image.src,size:_fluentui_react__WEBPACK_IMPORTED_MODULE_21__.Ir.size40,presence:_fluentui_react__WEBPACK_IMPORTED_MODULE_21__.H_.blocked,imageAlt:"Annie Lindqvist, status is blocked"})})},onResolveSuggestions:filterSuggestedItems}))]})},ErrorMessage=function ErrorMessage(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_17__._,{children:"Native error message"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_components_Autocomplete_Autocomplete__WEBPACK_IMPORTED_MODULE_15__.F,Object.assign({},props,{onResolveSuggestions:function filterSuggestedItems(filter){return filter?function getSuggestions(){for(var items=[],i=1;i<5e3;i++)items.push({key:"item_"+i,text:i%2?"Item "+i:"Item "+i+" with very long text that wil most likely overflow in small container"});return items}().filter((function(item){var _item$text3;return 0===(null===(_item$text3=item.text)||void 0===_item$text3?void 0:_item$text3.toLowerCase().indexOf(filter.toLowerCase()))})):[]},errorMessage:props.errorMessage}))]})};CustomRendering.parameters={docs:{description:{story:"The rendering of both callout and suggestions can be widely adjusted. You can render custom headers and footers for the callout by using the `onRenderHeader` and `onRenderFooter`\n functions. Each suggestion item can also leverage custom rendering by using the `onRenderSuggestionItem` function. The tooltip that shows while hovering the item can also be edited by the\n `tooltipHostProps` property"},source:{type:"code"}}},CustomButtons.parameters={docs:{source:{type:"code"}}},ErrorMessage.parameters={docs:{source:{type:"code"},description:{story:"By using the `errorMessage` property, an error message will appear under the `AutoComplete`. The error message bar can be customized by the `messageBarProps` property. A custom error message can also be rendered by passing a JSX element to the `errorMessage` property."}}},ErrorMessage.args={errorMessage:"Autocomplete error message"},CustomButtons.parameters=Object.assign({storySource:{source:"(props: IAutoCompleteProps) => {\n const getSuggestions = (): IAutoCompleteItemProps[] => {\n const items: IAutoCompleteItemProps[] = [];\n for (let i = 1; i < 5000; i++) {\n items.push({\n key: `item_${i}`,\n text: i % 2 ? `Item ${i}` : `Item ${i} with very long text that wil most likely overflow in small container`,\n iconProps: {\n imageProps: {\n src: `https://picsum.photos/400/450?random=${i}`\n }\n },\n buttons: [\n {\n key: `item_${i}_button`,\n onClick: () => alert(`Item ${i} clicked!`),\n iconProps: {\n iconName: 'BeerMug'\n }\n }\n ],\n secondaryText: `Item ${i} description`,\n })\n }\n return items;\n }\n const [selectedItem, setSelectedItem] = React.useState<IAutoCompleteItemProps | undefined | string>(getSuggestions()[0]);\n const filterSuggestedItems = (filter: string | undefined): IAutoCompleteItemProps[] => {\n return filter\n ? getSuggestions().filter(\n item => item.text?.toLowerCase().indexOf(filter.toLowerCase()) === 0,\n )\n : getSuggestions()\n };\n const getSuffixItems = () => {\n const items: ICommandBarItemProps[] = [];\n if(!selectedItem || (selectedItem instanceof String || typeof selectedItem === 'string')) return items;\n items.push({\n key: 'key',\n onClick: () => {\n const item = selectedItem as IAutoCompleteItemProps;\n alert(`${item.text} clicked!`)\n },\n iconProps: {\n iconName: 'CheckMark',\n }\n });\n items.push({\n key: 'expand',\n text: 'Expandable',\n subMenuProps: {\n items: [\n {\n key: 'item',\n text: 'Item',\n }\n ]\n }\n })\n return items;\n };\n const getPrefixItems = () => {\n const items: ICommandBarItemProps[] = [];\n if(!selectedItem || (selectedItem instanceof String || typeof selectedItem === 'string')) return items;\n const item = selectedItem as IAutoCompleteItemProps;\n items.push({\n key: 'iconPrefix',\n iconProps: item.iconProps\n })\n return items;\n };\n return (\n <>\n <Label>Custom Buttons</Label>\n <Autocomplete {...props}\n searchButtonProps={{\n key: 'search',\n iconProps: {\n iconName: 'Search'\n }\n }}\n prefixItems={getPrefixItems()}\n suffixItems={getSuffixItems()}\n deleteButtonProps={{\n key: 'delete',\n showOnlyOnHover: true,\n iconProps: {\n iconName: 'ChromeClose',\n styles: {\n root: {\n fontSize: 12\n }\n }\n }\n }}\n onResolveSuggestions={filterSuggestedItems}\n onChange={(item) => {setSelectedItem(item)}}\n selectedItem={selectedItem} />\n </>\n );\n}"}},CustomButtons.parameters),CustomRendering.parameters=Object.assign({storySource:{source:"(props: IAutoCompleteProps) => {\n const getSuggestions = (): IAutoCompleteItemProps[] => {\n const items: IAutoCompleteItemProps[] = [];\n for (let i = 1; i < 5000; i++) {\n items.push({\n key: `Item ${i}`,\n text: i % 2 ? `Item ${i}` : `Item ${i} with very long text that wil most likely overflow in small container`,\n tooltipHostProps: {\n tooltipProps: {\n onRenderContent: () =>\n <div style={{ textAlign: 'center' }}>\n <Image styles={{ root: { display: 'inline-block' }, image: { width: '300px' } }} src={`https://picsum.photos/400/450?random=${i}`} />\n <Text styles={{ root: { maxWidth: 300 } }} block variant='mediumPlus'>{i % 2 ? `Item ${i}` : `Item ${i} with very long text that wil most likely overflow in small container`}</Text>\n <Text>{`Item ${i} description`}</Text>\n </div>\n }\n },\n iconProps: {\n imageProps: {\n src: `https://picsum.photos/400/450?random=${i}`\n }\n },\n buttons: [\n {\n key: `item_${i}_button`,\n onClick: () => alert(`Item ${i} clicked!`),\n iconProps: {\n iconName: 'BeerMug'\n }\n }\n ],\n secondaryText: `Item ${i} description`,\n })\n }\n return items;\n }\n const filterSuggestedItems = (filter: string | undefined): IAutoCompleteItemProps[] => {\n return filter\n ? getSuggestions().filter(\n item => item.text?.toLowerCase().indexOf(filter.toLowerCase()) === 0,\n )\n : [];\n };\n return (\n <>\n <Label>Header, footer and tooltip</Label>\n <Autocomplete {...props}\n suggestionsProps={{\n onRenderHeader: () =>\n <Text block variant='large' styles={{ root: { margin: 10, height: 30 } }}>Custom header</Text>,\n onRenderFooter: () =>\n <Text block variant='large' styles={{ root: { margin: 10, height: 30 } }}>Custom footer</Text>\n }}\n onResolveSuggestions={filterSuggestedItems} />\n\n <Label>Suggestions</Label>\n <Autocomplete {...props}\n suggestionsProps={{\n suggestionsContainerWidth: 400,\n suggestionsContainerHeight: 250,\n }}\n onRenderSuggestionItem={(item) =>\n <>\n <Persona\n showOverflowTooltip={false}\n styles={{ root: { marginLeft: 5, marginTop: 5 } }}\n text={item.text}\n secondaryText={item.secondaryText}\n imageUrl={item.iconProps?.imageProps?.src}\n size={PersonaSize.size40}\n presence={PersonaPresence.blocked}\n imageAlt=\"Annie Lindqvist, status is blocked\"\n />\n\n </>\n }\n onResolveSuggestions={filterSuggestedItems}\n />\n </>\n );\n}"}},CustomRendering.parameters),ErrorMessage.parameters=Object.assign({storySource:{source:"(props: IAutoCompleteProps) => {\n const getSuggestions = (): IAutoCompleteItemProps[] => {\n const items: IAutoCompleteItemProps[] = [];\n for (let i = 1; i < 5000; i++) {\n items.push({\n key: `item_${i}`,\n text: i % 2 ? `Item ${i}` : `Item ${i} with very long text that wil most likely overflow in small container`,\n })\n }\n return items;\n }\n const filterSuggestedItems = (filter?: string): IAutoCompleteItemProps[] => {\n return filter\n ? getSuggestions().filter(\n item => item.text?.toLowerCase().indexOf(filter.toLowerCase()) === 0,\n )\n : [];\n };\n return (\n <>\n <Label>Native error message</Label>\n <Autocomplete\n {...props}\n onResolveSuggestions={filterSuggestedItems}\n errorMessage={props.errorMessage} />\n </>\n )\n}"}},ErrorMessage.parameters);var __namedExportsOrder=["CustomButtons","CustomRendering","ErrorMessage"];try{CustomButtons.displayName="CustomButtons",CustomButtons.__docgenInfo={description:"",displayName:"CustomButtons",props:{selectedItem:{defaultValue:null,description:"Currently selected item. If set, the component will become controlled.",name:"selectedItem",required:!1,type:{name:"string | IAutoCompleteItemProps"}},clearInputOnSelection:{defaultValue:null,description:"Clears the input if item has been selected. Works only in uncontrolled mode, in controlled mode, you need to set the selected item text to a null value.",name:"clearInputOnSelection",required:!1,type:{name:"boolean"}},suggestionsProps:{defaultValue:null,description:"Props that will be passed to the suggestions container.",name:"suggestionsProps",required:!1,type:{name:"ISuggestionsProps"}},calloutProps:{defaultValue:null,description:"Props that will be passed to the suggestions callout.",name:"calloutProps",required:!1,type:{name:"ICalloutProps"}},resolveDelay:{defaultValue:{value:"500"},description:"The delay time in ms before resolving suggestions, which is kicked off when input has been changed. \ne.g. If a second input change happens within the resolveDelay time, the timer will start over. \nOnly until after the timer completes will onResolveSuggestions be called.",name:"resolveDelay",required:!1,type:{name:"number"}},searchButtonProps:{defaultValue:null,description:"Props for the search button.",name:"searchButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},onChange:{defaultValue:null,description:"Fires when currently selected item changes. Returns the current input `string` if no suggestion was selected from the callout.",name:"onChange",required:!1,type:{name:"((item?: string | IAutoCompleteItemProps) => void)"}},showSuggestionsOnFocus:{defaultValue:{value:"false"},description:"Displays the callout on focus (on empty input) if enabled.\nThis is by default disabled to save calls of `onResolveSuggestions`.",name:"showSuggestionsOnFocus",required:!1,type:{name:"boolean"}},onResolveSuggestions:{defaultValue:null,description:"A callback for what should happen when a person types text into the input. \nReturns the current input value to be used as a filter. \nIf used in conjunction with resolveDelay this will only kick off after the delay throttle.",name:"onResolveSuggestions",required:!0,type:{name:"(filter?: string | undefined) => IAutoCompleteItemProps[] | PromiseLike<IAutoCompleteItemProps[]>"}},onRenderSuggestionItem:{defaultValue:null,description:"Function that specifies how an individual suggestion item will appear",name:"onRenderSuggestionItem",required:!1,type:{name:"((item: IAutoCompleteItemProps) => Element)"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/Autocomplete/Autocomplete_Extensions.stories.tsx#CustomButtons"]={docgenInfo:CustomButtons.__docgenInfo,name:"CustomButtons",path:"src/stories/Autocomplete/Autocomplete_Extensions.stories.tsx#CustomButtons"})}catch(__react_docgen_typescript_loader_error){}try{CustomRendering.displayName="CustomRendering",CustomRendering.__docgenInfo={description:"",displayName:"CustomRendering",props:{selectedItem:{defaultValue:null,description:"Currently selected item. If set, the component will become controlled.",name:"selectedItem",required:!1,type:{name:"string | IAutoCompleteItemProps"}},clearInputOnSelection:{defaultValue:null,description:"Clears the input if item has been selected. Works only in uncontrolled mode, in controlled mode, you need to set the selected item text to a null value.",name:"clearInputOnSelection",required:!1,type:{name:"boolean"}},suggestionsProps:{defaultValue:null,description:"Props that will be passed to the suggestions container.",name:"suggestionsProps",required:!1,type:{name:"ISuggestionsProps"}},calloutProps:{defaultValue:null,description:"Props that will be passed to the suggestions callout.",name:"calloutProps",required:!1,type:{name:"ICalloutProps"}},resolveDelay:{defaultValue:{value:"500"},description:"The delay time in ms before resolving suggestions, which is kicked off when input has been changed. \ne.g. If a second input change happens within the resolveDelay time, the timer will start over. \nOnly until after the timer completes will onResolveSuggestions be called.",name:"resolveDelay",required:!1,type:{name:"number"}},searchButtonProps:{defaultValue:null,description:"Props for the search button.",name:"searchButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},onChange:{defaultValue:null,description:"Fires when currently selected item changes. Returns the current input `string` if no suggestion was selected from the callout.",name:"onChange",required:!1,type:{name:"((item?: string | IAutoCompleteItemProps) => void)"}},showSuggestionsOnFocus:{defaultValue:{value:"false"},description:"Displays the callout on focus (on empty input) if enabled.\nThis is by default disabled to save calls of `onResolveSuggestions`.",name:"showSuggestionsOnFocus",required:!1,type:{name:"boolean"}},onResolveSuggestions:{defaultValue:null,description:"A callback for what should happen when a person types text into the input. \nReturns the current input value to be used as a filter. \nIf used in conjunction with resolveDelay this will only kick off after the delay throttle.",name:"onResolveSuggestions",required:!0,type:{name:"(filter?: string | undefined) => IAutoCompleteItemProps[] | PromiseLike<IAutoCompleteItemProps[]>"}},onRenderSuggestionItem:{defaultValue:null,description:"Function that specifies how an individual suggestion item will appear",name:"onRenderSuggestionItem",required:!1,type:{name:"((item: IAutoCompleteItemProps) => Element)"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/Autocomplete/Autocomplete_Extensions.stories.tsx#CustomRendering"]={docgenInfo:CustomRendering.__docgenInfo,name:"CustomRendering",path:"src/stories/Autocomplete/Autocomplete_Extensions.stories.tsx#CustomRendering"})}catch(__react_docgen_typescript_loader_error){}},"./src/stories/ButtonLoading/withButtonLoading.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{BasicInformation:function(){return BasicInformation},__namedExportsOrder:function(){return __namedExportsOrder},default:function(){return withButtonLoading_stories}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var lib=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),ActionButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/ActionButton/ActionButton.js"),PrimaryButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/PrimaryButton/PrimaryButton.js"),DefaultButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/DefaultButton/DefaultButton.js"),MessageBarButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/MessageBarButton/MessageBarButton.js"),IconButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/IconButton/IconButton.js"),CommandBarButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/CommandBarButton/CommandBarButton.js"),Spinner_types=__webpack_require__("./node_modules/@fluentui/react/lib/components/Spinner/Spinner.types.js"),react=__webpack_require__("./node_modules/react/index.js"),style_utilities_lib=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),getLeftPadding=function getLeftPadding(buttonComponent){switch(buttonComponent){case DefaultButton.a:case PrimaryButton.K:case MessageBarButton.f:return 5}},Spinner=__webpack_require__("./src/components/Spinner/Spinner.tsx"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js"),withButtonLoading=function withButtonLoading(ButtonComponent){return function(props){var isLoading=props.isLoading,styles=(0,react.useMemo)((function(){return function getButtonWithLoadingStyles(buttonComponent){return(0,style_utilities_lib.ZC)({root:{paddingLeft:getLeftPadding(buttonComponent),".ms-Button-flexContainer":{gap:5}},spinner:{".ms-Spinner-circle":{height:20,width:20}}})}(ButtonComponent)}),[]),getSpinnerSize=function getSpinnerSize(){return MessageBarButton.f,Spinner_types.E.xSmall};return(0,jsx_runtime.jsx)(ButtonComponent,Object.assign({},props,{className:function getClassName(){var className="";return props.className&&(className+=props.className+" "),isLoading&&(className+=styles.root),className}(),disabled:isLoading||props.disabled,onRenderIcon:isLoading?function onRenderIcon(){return(0,jsx_runtime.jsx)(Spinner.$,{className:styles.spinner,size:getSpinnerSize()})}:props.onRenderIcon}))}};try{withButtonLoading.displayName="withButtonLoading",withButtonLoading.__docgenInfo={description:"",displayName:"withButtonLoading",props:{prototype:{defaultValue:null,description:"",name:"prototype",required:!0,type:{name:"ActionButton | CommandBarButton | DefaultButton | IconButton | MessageBarButton | PrimaryButton"}},contextType:{defaultValue:null,description:"If set, `this.context` will be set at runtime to the current value of the given Context.\n\nUsage:\n\n```ts\ntype MyContext = number\nconst Ctx = React.createContext<MyContext>(0)\n\nclass Foo extends React.Component {\n static contextType = Ctx\n context!: React.ContextType<typeof Ctx>\n render () {\n return <>My context's value: {this.context}</>;\n }\n}\n```\n@see https://reactjs.org/docs/context.html#classcontexttype",name:"contextType",required:!1,type:{name:"Context<any>"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/wrappers/withButtonLoading/withButtonLoading.tsx#withButtonLoading"]={docgenInfo:withButtonLoading.__docgenInfo,name:"withButtonLoading",path:"src/wrappers/withButtonLoading/withButtonLoading.tsx#withButtonLoading"})}catch(__react_docgen_typescript_loader_error){}function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}(0,lib.l)();var withButtonLoading_stories={title:"TALXIS React Components/Wrappers/withLoadingButton",parameters:{docs:{description:{component:"Wrapper allowing you to use standard Fluent UI buttons with toggable loading indicator."}}}},BasicInformation=function BasicInformation(props){var _useState2=_slicedToArray((0,react.useState)(!0),2),isLoading=_useState2[0],setIsLoading=_useState2[1],ActionButtonWithLoading=withButtonLoading(ActionButton.K),PrimaryButtonWithLoading=withButtonLoading(PrimaryButton.K),DefaultButtonWithLoading=withButtonLoading(DefaultButton.a),MessageBarButtonWithLoading=withButtonLoading(MessageBarButton.f),IconButtonWithLoading=withButtonLoading(IconButton.h),CommandBarButtonWithLoading=withButtonLoading(CommandBarButton.Q);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(PrimaryButton.K,{onClick:function onClick(){return setIsLoading(!isLoading)},text:"Toggle Loading"}),(0,jsx_runtime.jsx)("hr",{}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)(ActionButtonWithLoading,{iconProps:{iconName:"BeerMug"},text:"Action Button",isLoading:isLoading}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)(PrimaryButtonWithLoading,{iconProps:{iconName:"BeerMug"},text:"Primary Button",isLoading:isLoading}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)(DefaultButtonWithLoading,{iconProps:{iconName:"BeerMug"},text:"Default Button",isLoading:isLoading}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)(MessageBarButtonWithLoading,{iconProps:{iconName:"BeerMug"},text:"Message Bar Button",isLoading:isLoading}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)(IconButtonWithLoading,{iconProps:{iconName:"BeerMug"},isLoading:isLoading}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)(CommandBarButtonWithLoading,{iconProps:{iconName:"BeerMug"},text:"Command Bar Button",isLoading:isLoading}),(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)("br",{})]})};BasicInformation.parameters={docs:{source:{type:"code"}}},BasicInformation.parameters=Object.assign({storySource:{source:"(props: IButttonWithLoadingProps) => {\n const [isLoading, setIsLoading] = useState(true);\n const ActionButtonWithLoading = withButtonLoading(ActionButton);\n const PrimaryButtonWithLoading = withButtonLoading(PrimaryButton);\n const DefaultButtonWithLoading = withButtonLoading(DefaultButton);\n const MessageBarButtonWithLoading = withButtonLoading(MessageBarButton);\n const IconButtonWithLoading = withButtonLoading(IconButton);\n const CommandBarButtonWithLoading = withButtonLoading(CommandBarButton);\n\n return (\n <>\n <PrimaryButton onClick={() => setIsLoading(!isLoading)} text='Toggle Loading' />\n <hr />\n <br />\n <ActionButtonWithLoading iconProps={{ iconName: 'BeerMug' }} text=\"Action Button\" isLoading={isLoading} />\n <br />\n <br />\n <PrimaryButtonWithLoading iconProps={{ iconName: 'BeerMug' }} text=\"Primary Button\" isLoading={isLoading} />\n <br />\n <br />\n <DefaultButtonWithLoading iconProps={{ iconName: 'BeerMug' }} text=\"Default Button\" isLoading={isLoading} />\n <br />\n <br />\n <MessageBarButtonWithLoading iconProps={{ iconName: 'BeerMug' }} text=\"Message Bar Button\" isLoading={isLoading} />\n <br />\n <br />\n <IconButtonWithLoading iconProps={{ iconName: 'BeerMug' }} isLoading={isLoading} />\n <br />\n <br />\n <CommandBarButtonWithLoading iconProps={{ iconName: 'BeerMug' }} text=\"Command Bar Button\" isLoading={isLoading} />\n <br />\n <br />\n </>\n );\n}"}},BasicInformation.parameters);var __namedExportsOrder=["BasicInformation"]},"./src/stories/ComboBox/ComboBox.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{BasicInformation:function(){return BasicInformation},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),_components_ComboBox_ComboBox__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/components/ComboBox/ComboBox.tsx"),_argTypes__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/stories/ComboBox/argTypes.ts"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/react/jsx-runtime.js");(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_2__.l)(),__webpack_exports__.default={title:"TALXIS React Components/ComboBox/Basic Information",component:_components_ComboBox_ComboBox__WEBPACK_IMPORTED_MODULE_3__.C,parameters:{docs:{description:{component:"**ComboBox** with support for error messages, borderless, read only mode and custom buttons.\n Extends [**ComboBox**](https://developer.microsoft.com/en-us/fluentui#/controls/web/ComboBox)."}}},argTypes:_argTypes__WEBPACK_IMPORTED_MODULE_4__.P};var BasicInformation=function BasicInformation(props){return(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)(_fluentui_react__WEBPACK_IMPORTED_MODULE_5__._,{children:"Default ComboBox"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components_ComboBox_ComboBox__WEBPACK_IMPORTED_MODULE_3__.C,Object.assign({},props))]})};BasicInformation.parameters={docs:{source:{type:"code"}}},BasicInformation.parameters=Object.assign({storySource:{source:"(props: IComboBoxProps) => {\n return (\n <>\n <Label>Default ComboBox</Label>\n <ComboBox {...props}/>\n </>\n );\n}"}},BasicInformation.parameters);var __namedExportsOrder=["BasicInformation"];try{BasicInformation.displayName="BasicInformation",BasicInformation.__docgenInfo={description:"",displayName:"BasicInformation",props:{readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/ComboBox/ComboBox.stories.tsx#BasicInformation"]={docgenInfo:BasicInformation.__docgenInfo,name:"BasicInformation",path:"src/stories/ComboBox/ComboBox.stories.tsx#BasicInformation"})}catch(__react_docgen_typescript_loader_error){}},"./src/stories/ComboBox/ComboBox_Extensions.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{ClickToCopy:function(){return ClickToCopy},CustomButtons:function(){return CustomButtons},DeleteButton:function(){return DeleteButton},ErrorMessage:function(){return ErrorMessage},ReadOnly:function(){return ReadOnly},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),_components_ComboBox_ComboBox__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./src/components/ComboBox/ComboBox.tsx"),_argTypes__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./src/stories/ComboBox/argTypes.ts"),react__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/react/index.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_13__.l)(),__webpack_exports__.default={title:"TALXIS React Components/ComboBox/Extensions",component:_components_ComboBox_ComboBox__WEBPACK_IMPORTED_MODULE_14__.C,parameters:{docs:{description:{component:"By using the `readOnly` property, the `ComboBox` will not allow to pick any options."}}},argTypes:_argTypes__WEBPACK_IMPORTED_MODULE_15__.P};var ReadOnly=function ReadOnly(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_16__._,{children:"Read Only"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_components_ComboBox_ComboBox__WEBPACK_IMPORTED_MODULE_14__.C,Object.assign({},props,{readOnly:props.readOnly}))]})},DeleteButton=function DeleteButton(props){var _useState2=_slicedToArray((0,react__WEBPACK_IMPORTED_MODULE_11__.useState)("option1"),2),selectedKey=_useState2[0],setSelectedKey=_useState2[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_16__._,{children:"Delete Button"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_components_ComboBox_ComboBox__WEBPACK_IMPORTED_MODULE_14__.C,Object.assign({},props,{selectedKey:selectedKey,onChange:function onChange(e,option){return setSelectedKey(null==option?void 0:option.key)},deleteButtonProps:{key:"delete",showOnlyOnHover:!0,onClick:function onClick(){setSelectedKey(null)},iconProps:{styles:{root:{fontSize:12}},iconName:"ChromeClose"}}}))]})},ClickToCopy=function ClickToCopy(props){var _useState4=_slicedToArray((0,react__WEBPACK_IMPORTED_MODULE_11__.useState)("option1"),2),selectedKey=_useState4[0],setSelectedKey=_useState4[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_16__._,{children:"Click To Copy"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_components_ComboBox_ComboBox__WEBPACK_IMPORTED_MODULE_14__.C,Object.assign({},props,{selectedKey:selectedKey,onChange:function onChange(e,option){return setSelectedKey(option.key.toString())},clickToCopyProps:{key:"clickToCopy",iconProps:{iconName:"Copy"}}}))]})},CustomButtons=function CustomButtons(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_16__._,{children:"Custom Buttons"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_components_ComboBox_ComboBox__WEBPACK_IMPORTED_MODULE_14__.C,Object.assign({},props,{prefixItems:[{key:"prefix",iconProps:{iconName:"CirclePlus"}}],suffixItems:[{key:"suffix1",iconProps:{iconName:"BeerMug"}},{key:"expand",text:"Expandable",subMenuProps:{items:[{key:"item",text:"Item"}]}}]})),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_16__._,{children:"Hover Custom Buttons"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_components_ComboBox_ComboBox__WEBPACK_IMPORTED_MODULE_14__.C,Object.assign({},props,{prefixItems:[{key:"prefix",showOnlyOnHover:!0,iconProps:{iconName:"CirclePlus"}}],suffixItems:[{key:"suffix1",showOnlyOnHover:!0,iconProps:{iconName:"BeerMug"}},{key:"suffix2",showOnlyOnHover:!0,iconProps:{iconName:"CheckMark"}}]}))]})},ErrorMessage=function ErrorMessage(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_16__._,{children:"Native error message"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_12__.jsx)(_components_ComboBox_ComboBox__WEBPACK_IMPORTED_MODULE_14__.C,Object.assign({},props,{errorMessage:props.errorMessage}))]})};ClickToCopy.parameters={docs:{description:{story:"By using the `clickToCopyProps` property, a button will appear in `ComboBox` suffix that will put the current input text into clipboard when clicked. Can also only be shown on hover by using the `showOnlyOnHover` property."},source:{type:"code"}}},DeleteButton.parameters={docs:{description:{story:"In order for the delete button to work, you need to manually change the `selectedKey` prop to `null` by using the `deteleButtonProps` `onClick` event. This means that the delete button currently only works with controlled component and will not show up unless selectedKey prop is used!"},source:{type:"code"}}},CustomButtons.parameters={docs:{description:{story:"By using the `prefixItems` and `suffixItems` property, suffix/preffix items will be added to the `ComboBox`. Each item can be also only shown on hover using the `showOnlyOnHover` property. You can also use the `order` property to specify the order of the items. This property also applies to native buttons like delete or click to copy. See Command Bar for more information."},source:{type:"code"}}},ErrorMessage.parameters={docs:{description:{story:"By using the `errorMessage` property, an error message will appear under the `ComboBox`."},source:{type:"code"}}},ErrorMessage.args={errorMessage:"ComboBox error message"},ReadOnly.args={defaultSelectedKey:"option1",readOnly:!0},ReadOnly.parameters=Object.assign({storySource:{source:"(props: IComboBoxProps) =>\n <>\n <Label>Read Only</Label>\n <ComboBox {...props} readOnly={props.readOnly} />\n </>"}},ReadOnly.parameters),DeleteButton.parameters=Object.assign({storySource:{source:"(props: IComboBoxProps) => {\n const [selectedKey, setSelectedKey] = useState<string | null>('option1');\n return (\n <>\n <Label>Delete Button</Label>\n <ComboBox\n {...props}\n selectedKey={selectedKey}\n onChange={(e, option) => setSelectedKey(option?.key as string)}\n deleteButtonProps={{\n key: 'delete',\n showOnlyOnHover: true,\n onClick: () => { setSelectedKey(null) },\n iconProps: {\n styles: {\n root: {\n fontSize: 12\n }\n },\n iconName: 'ChromeClose'\n }\n }} />\n </>\n );\n}"}},DeleteButton.parameters),ClickToCopy.parameters=Object.assign({storySource:{source:"(props: IComboBoxProps) => {\n const [selectedKey, setSelectedKey] = useState<string>('option1');\n return (\n <>\n <Label>Click To Copy</Label>\n <ComboBox {...props}\n selectedKey={selectedKey}\n onChange={(e, option) => setSelectedKey(option!.key.toString()) }\n clickToCopyProps={{\n key: 'clickToCopy',\n iconProps: {\n iconName: 'Copy'\n }\n }} />\n </>\n )\n}"}},ClickToCopy.parameters),CustomButtons.parameters=Object.assign({storySource:{source:"(props: IComboBoxProps) =>\n <>\n <Label>Custom Buttons</Label>\n <ComboBox\n {...props}\n prefixItems={\n [\n {\n key: 'prefix',\n iconProps: {\n iconName: 'CirclePlus'\n }\n },\n ]\n }\n suffixItems={[\n {\n key: 'suffix1',\n iconProps: {\n iconName: 'BeerMug'\n }\n },\n {\n key: 'expand',\n text: 'Expandable',\n subMenuProps: {\n items: [\n {\n key: 'item',\n text: 'Item',\n }\n ]\n }\n }\n ]} />\n <Label>Hover Custom Buttons</Label>\n <ComboBox\n {...props}\n prefixItems={\n [\n {\n key: 'prefix',\n showOnlyOnHover: true,\n iconProps: {\n iconName: 'CirclePlus'\n }\n },\n ]\n }\n suffixItems={[\n {\n key: 'suffix1',\n showOnlyOnHover: true,\n iconProps: {\n iconName: 'BeerMug'\n }\n },\n {\n key: 'suffix2',\n showOnlyOnHover: true,\n iconProps: {\n iconName: 'CheckMark'\n }\n }\n ]} />\n </>"}},CustomButtons.parameters),ErrorMessage.parameters=Object.assign({storySource:{source:"(props: IComboBoxProps) =>\n <>\n <Label>Native error message</Label>\n <ComboBox\n {...props}\n errorMessage={props.errorMessage} />\n </>"}},ErrorMessage.parameters);var __namedExportsOrder=["ReadOnly","DeleteButton","ClickToCopy","CustomButtons","ErrorMessage"];try{ReadOnly.displayName="ReadOnly",ReadOnly.__docgenInfo={description:"",displayName:"ReadOnly",props:{readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/ComboBox/ComboBox_Extensions.stories.tsx#ReadOnly"]={docgenInfo:ReadOnly.__docgenInfo,name:"ReadOnly",path:"src/stories/ComboBox/ComboBox_Extensions.stories.tsx#ReadOnly"})}catch(__react_docgen_typescript_loader_error){}try{DeleteButton.displayName="DeleteButton",DeleteButton.__docgenInfo={description:"",displayName:"DeleteButton",props:{readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/ComboBox/ComboBox_Extensions.stories.tsx#DeleteButton"]={docgenInfo:DeleteButton.__docgenInfo,name:"DeleteButton",path:"src/stories/ComboBox/ComboBox_Extensions.stories.tsx#DeleteButton"})}catch(__react_docgen_typescript_loader_error){}try{ClickToCopy.displayName="ClickToCopy",ClickToCopy.__docgenInfo={description:"",displayName:"ClickToCopy",props:{readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/ComboBox/ComboBox_Extensions.stories.tsx#ClickToCopy"]={docgenInfo:ClickToCopy.__docgenInfo,name:"ClickToCopy",path:"src/stories/ComboBox/ComboBox_Extensions.stories.tsx#ClickToCopy"})}catch(__react_docgen_typescript_loader_error){}try{CustomButtons.displayName="CustomButtons",CustomButtons.__docgenInfo={description:"",displayName:"CustomButtons",props:{readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/ComboBox/ComboBox_Extensions.stories.tsx#CustomButtons"]={docgenInfo:CustomButtons.__docgenInfo,name:"CustomButtons",path:"src/stories/ComboBox/ComboBox_Extensions.stories.tsx#CustomButtons"})}catch(__react_docgen_typescript_loader_error){}try{ErrorMessage.displayName="ErrorMessage",ErrorMessage.__docgenInfo={description:"",displayName:"ErrorMessage",props:{readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/ComboBox/ComboBox_Extensions.stories.tsx#ErrorMessage"]={docgenInfo:ErrorMessage.__docgenInfo,name:"ErrorMessage",path:"src/stories/ComboBox/ComboBox_Extensions.stories.tsx#ErrorMessage"})}catch(__react_docgen_typescript_loader_error){}},"./src/stories/CommandBar/CommandBar.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{BasicInformation:function(){return BasicInformation},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),_components_CommandBar_CommandBar__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./src/components/CommandBar/CommandBar.tsx"),_argTypes__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./src/stories/CommandBar/argTypes.ts"),react__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./node_modules/react/index.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_12__.l)(),__webpack_exports__.default={title:"TALXIS React Components/Command Bar/Basic Information",component:_components_CommandBar_CommandBar__WEBPACK_IMPORTED_MODULE_13__.X,parameters:{docs:{description:{component:"**Command Bar** with adjusted styling, ordering and button hiding on hover.\n Extends [**Command Bar**](https://developer.microsoft.com/en-us/fluentui#/controls/web/commandbar)."}}},argTypes:_argTypes__WEBPACK_IMPORTED_MODULE_14__.P};var BasicInformation=function BasicInformation(){var _useState=(0,react__WEBPACK_IMPORTED_MODULE_10__.useState)(function getCommandBarItems(){for(var items=[],i=1;i<11;i++)items.push({key:"item"+i,text:"Option "+i,iconProps:{iconName:i%2?"BeerMug":void 0,imageProps:i%3?{src:"https://i.pinimg.com/originals/0c/3b/3a/0c3b3adb1a7530892e55ef36d3be6cb8.png"}:void 0}});return items}()),items=_slicedToArray(_useState,1)[0];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_15__._,{children:"Default Command Bar"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_CommandBar_CommandBar__WEBPACK_IMPORTED_MODULE_13__.X,{items:items})]})};BasicInformation.parameters={docs:{source:{type:"code"}}},BasicInformation.parameters=Object.assign({storySource:{source:"() => {\n const getCommandBarItems = (): ICommandBarItemProps[] => {\n const items: ICommandBarItemProps[] = [];\n for (let i = 1; i < 11; i++) {\n items.push({\n key: `item${i}`,\n text: `Option ${i}`,\n iconProps: {\n iconName: i % 2 ? 'BeerMug' : undefined,\n imageProps: i % 3 ? {\n src: 'https://i.pinimg.com/originals/0c/3b/3a/0c3b3adb1a7530892e55ef36d3be6cb8.png'\n } : undefined\n }\n })\n }\n return items;\n }\n const [items] = useState<ICommandBarItemProps[]>(getCommandBarItems())\n return (\n <>\n <Label>Default Command Bar</Label>\n <CommandBar items={items} />\n </>\n );\n}"}},BasicInformation.parameters);var __namedExportsOrder=["BasicInformation"]},"./src/stories/CommandBar/CommandBar_Extensions.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{ButtonHiding:function(){return ButtonHiding},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_components_CommandBar_CommandBar__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./src/components/CommandBar/CommandBar.tsx"),_argTypes__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./src/stories/CommandBar/argTypes.ts"),react__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./node_modules/react/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Toggle/Toggle.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_12__.l)(),__webpack_exports__.default={title:"TALXIS React Components/Command Bar/Extensions",component:_components_CommandBar_CommandBar__WEBPACK_IMPORTED_MODULE_13__.X,parameters:{docs:{description:{component:"Command bar item property `order` can be used to adjust the order of the items in the CommandBar. Smaller values will be placed first."}}},argTypes:_argTypes__WEBPACK_IMPORTED_MODULE_14__.P};var ButtonHiding=function ButtonHiding(props){var _useState=(0,react__WEBPACK_IMPORTED_MODULE_10__.useState)(function getHiddenCommandBarItems(){for(var items=[],i=1;i<8;i++)items.push({key:"item"+i,text:"Option "+i,showOnlyOnHover:i%2==0,iconProps:{iconName:i%2?"BeerMug":void 0,imageProps:i%3?{src:"https://i.pinimg.com/originals/0c/3b/3a/0c3b3adb1a7530892e55ef36d3be6cb8.png"}:void 0}});return items}()),items=_slicedToArray(_useState,1)[0],_useState4=_slicedToArray((0,react__WEBPACK_IMPORTED_MODULE_10__.useState)(!1),2),showOnContainerHover=_useState4[0],setShowOnContainerHover=_useState4[1],styles=(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_15__.y0)({border:"1px solid #ccc",padding:"10px",":hover .TALXIS__command-bar .hover-only":{display:showOnContainerHover&&"block"}});return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment,{children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)("div",{className:styles,children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_16__.Z,{label:"Show on container hover",onChange:function onChange(e,checked){return setShowOnContainerHover(checked)}}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_CommandBar_CommandBar__WEBPACK_IMPORTED_MODULE_13__.X,{items:items})]})})};ButtonHiding.parameters={docs:{source:{type:"code"},description:{story:'Command bar item property `showOnlyOnHover` can be used to hide the button when not hovered over. This is useful when the button does not always need to be visible.\n By default, the hidden buttons will only be shown when the mouse is hovering over the command bar. However, you can manually show these buttons in other situations.\n For example, you might want the button to be shown when the user hovers over your component as a whole and not just the command bar. To achieve this, you need to target the `.hover-only` class\n and add `display: "block"` to it according to your needs. (See the example below.)'}}},ButtonHiding.parameters=Object.assign({storySource:{source:"(props: ICommandBarProps) => {\n const getHiddenCommandBarItems = (): ICommandBarItemProps[] => {\n const items: ICommandBarItemProps[] = [];\n for (let i = 1; i < 8; i++) {\n items.push({\n key: `item${i}`,\n text: `Option ${i}`,\n showOnlyOnHover: i % 2 === 0,\n iconProps: {\n iconName: i % 2 ? 'BeerMug' : undefined,\n imageProps: i % 3 ? {\n src: 'https://i.pinimg.com/originals/0c/3b/3a/0c3b3adb1a7530892e55ef36d3be6cb8.png'\n } : undefined\n }\n })\n }\n return items;\n }\n const [items] = useState<ICommandBarItemProps[]>(getHiddenCommandBarItems());\n const [showOnContainerHover, setShowOnContainerHover] = useState(false);\n const styles = mergeStyles({\n border: '1px solid #ccc',\n padding: '10px',\n //always use the .TALXIS_command-bar class to override the button hiding behavior\n \":hover .TALXIS__command-bar .hover-only\": {\n display: showOnContainerHover && 'block'\n }\n });\n return (\n <>\n <div className={styles}>\n <Toggle label='Show on container hover' onChange={(e, checked) => setShowOnContainerHover(checked!)} />\n <CommandBar items={items} />\n </div>\n </>\n );\n}"}},ButtonHiding.parameters);var __namedExportsOrder=["ButtonHiding"]},"./src/stories/DatePicker/DatePicker.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{BasicInformation:function(){return BasicInformation},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),react__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./node_modules/react/index.js"),_components_DatePicker_DatePicker__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./src/components/DatePicker/DatePicker.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_12__.l)(),__webpack_exports__.default={title:"TALXIS React Components/DatePicker/Basic Information",component:_components_DatePicker_DatePicker__WEBPACK_IMPORTED_MODULE_13__.M,argTypes:{disabled:{description:"Disables the `DatePicker`",type:"boolean"},borderless:{description:"Removes the `DatePicker` border and enables hover animation",type:"boolean"},errorMessage:{type:"string"},messageBarProps:{control:!1}},parameters:{docs:{description:{component:"**DatePicker** that uses our TextField components as it's base. Therefore, all the extensions of TextField will work with DatePicker as well.\n Extends [**DatePicker**](https://developer.microsoft.com/en-us/fluentui#/controls/web/datepicker)."}}}};var BasicInformation=function BasicInformation(props){var value=_slicedToArray((0,react__WEBPACK_IMPORTED_MODULE_10__.useState)(new Date),1)[0];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_14__._,{children:"Default DatePicker"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_DatePicker_DatePicker__WEBPACK_IMPORTED_MODULE_13__.M,Object.assign({clickToCopyProps:{key:"copy",iconProps:{iconName:"Copy"}}},props,{value:value}))]})};BasicInformation.parameters={docs:{source:{type:"code"}}},BasicInformation.parameters=Object.assign({storySource:{source:"(props: IDatePickerProps) => {\n const [value] = useState<Date>(new Date());\n return (\n <>\n <Label>Default DatePicker</Label>\n <DatePicker clickToCopyProps={{\n key: 'copy',\n iconProps: {\n iconName: 'Copy'\n }\n }} {...props} value={value} />\n </>\n )\n}"}},BasicInformation.parameters);var __namedExportsOrder=["BasicInformation"];try{BasicInformation.displayName="BasicInformation",BasicInformation.__docgenInfo={description:"",displayName:"BasicInformation",props:{keepCalendarOpenAfterDaySelect:{defaultValue:null,description:"",name:"keepCalendarOpenAfterDaySelect",required:!1,type:{name:"boolean"}},onSelectDate:{defaultValue:null,description:"Callback issued when a date is selected",name:"onSelectDate",required:!0,type:{name:"(date: Date | null | undefined) => void"}},value:{defaultValue:null,description:"Default value of the DatePicker, if any",name:"value",required:!0,type:{name:"Date | undefined"}},readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/DatePicker/DatePicker.stories.tsx#BasicInformation"]={docgenInfo:BasicInformation.__docgenInfo,name:"BasicInformation",path:"src/stories/DatePicker/DatePicker.stories.tsx#BasicInformation"})}catch(__react_docgen_typescript_loader_error){}},"./src/stories/DatePicker/DatePicker_Extensions.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{ErrorMessage:function(){return ErrorMessage},ReadOnly:function(){return ReadOnly},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),react__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./node_modules/react/index.js"),_components_DatePicker_DatePicker__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./src/components/DatePicker/DatePicker.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_12__.l)(),__webpack_exports__.default={title:"TALXIS React Components/DatePicker/Extensions",component:_components_DatePicker_DatePicker__WEBPACK_IMPORTED_MODULE_13__.M,argTypes:{disabled:{description:"Disables input element",type:"boolean"},borderless:{description:"Removes the `DatePicker` border and enables hover animation",type:"boolean"},errorMessage:{type:"string"},messageBarProps:{control:!1}},parameters:{docs:{description:{component:"By using the `readOnly` property, the `DatePicker` will not allow to pick any other dates."}}}};var ReadOnly=function ReadOnly(props){var value=_slicedToArray((0,react__WEBPACK_IMPORTED_MODULE_10__.useState)(new Date),1)[0];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_14__._,{children:"Readonly DatePicker"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_DatePicker_DatePicker__WEBPACK_IMPORTED_MODULE_13__.M,Object.assign({},props,{value:value,readOnly:props.readOnly}))]})},ErrorMessage=function ErrorMessage(props){var value=_slicedToArray((0,react__WEBPACK_IMPORTED_MODULE_10__.useState)(new Date),1)[0];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_14__._,{children:"Native error message"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_DatePicker_DatePicker__WEBPACK_IMPORTED_MODULE_13__.M,Object.assign({},props,{value:value,errorMessage:props.errorMessage}))]})};ReadOnly.parameters={docs:{description:{story:"By using the `readOnly` property, the `DatePicker` will not allow to pick any other dates."},source:{type:"code"}}},ErrorMessage.parameters={docs:{description:{story:"By using the `errorMessage` property, an error message will appear under the `DatePicker`."},source:{type:"code"}}},ErrorMessage.args={errorMessage:"DatePicker error message"},ReadOnly.args={readOnly:!0},ReadOnly.parameters=Object.assign({storySource:{source:"(props: IDatePickerProps) => {\n const [value] = useState<Date>(new Date());\n return (\n <>\n <Label>Readonly DatePicker</Label>\n <DatePicker {...props} value={value} readOnly={props.readOnly} />\n </>\n )\n}"}},ReadOnly.parameters),ErrorMessage.parameters=Object.assign({storySource:{source:"(props: IDatePickerProps) => {\n const [value] = useState<Date>(new Date());\n return (\n <>\n <Label>Native error message</Label>\n <DatePicker\n {...props}\n value={value}\n errorMessage={props.errorMessage} />\n </>\n )\n}"}},ErrorMessage.parameters);var __namedExportsOrder=["ReadOnly","ErrorMessage"];try{ReadOnly.displayName="ReadOnly",ReadOnly.__docgenInfo={description:"",displayName:"ReadOnly",props:{keepCalendarOpenAfterDaySelect:{defaultValue:null,description:"",name:"keepCalendarOpenAfterDaySelect",required:!1,type:{name:"boolean"}},onSelectDate:{defaultValue:null,description:"Callback issued when a date is selected",name:"onSelectDate",required:!0,type:{name:"(date: Date | null | undefined) => void"}},value:{defaultValue:null,description:"Default value of the DatePicker, if any",name:"value",required:!0,type:{name:"Date | undefined"}},readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/DatePicker/DatePicker_Extensions.stories.tsx#ReadOnly"]={docgenInfo:ReadOnly.__docgenInfo,name:"ReadOnly",path:"src/stories/DatePicker/DatePicker_Extensions.stories.tsx#ReadOnly"})}catch(__react_docgen_typescript_loader_error){}try{ErrorMessage.displayName="ErrorMessage",ErrorMessage.__docgenInfo={description:"",displayName:"ErrorMessage",props:{keepCalendarOpenAfterDaySelect:{defaultValue:null,description:"",name:"keepCalendarOpenAfterDaySelect",required:!1,type:{name:"boolean"}},onSelectDate:{defaultValue:null,description:"Callback issued when a date is selected",name:"onSelectDate",required:!0,type:{name:"(date: Date | null | undefined) => void"}},value:{defaultValue:null,description:"Default value of the DatePicker, if any",name:"value",required:!0,type:{name:"Date | undefined"}},readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/DatePicker/DatePicker_Extensions.stories.tsx#ErrorMessage"]={docgenInfo:ErrorMessage.__docgenInfo,name:"ErrorMessage",path:"src/stories/DatePicker/DatePicker_Extensions.stories.tsx#ErrorMessage"})}catch(__react_docgen_typescript_loader_error){}},"./src/stories/Login/Login.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{BasicInformation:function(){return BasicInformation},__namedExportsOrder:function(){return __namedExportsOrder},default:function(){return Login_stories}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var lib=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),CommandBarButton=(__webpack_require__("./node_modules/core-js/modules/es.array.map.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js"),__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/CommandBarButton/CommandBarButton.js")),Callout=__webpack_require__("./node_modules/@fluentui/react/lib/components/Callout/Callout.js"),Persona=__webpack_require__("./node_modules/@fluentui/react/lib/components/Persona/Persona.js"),Text=__webpack_require__("./node_modules/@fluentui/react/lib/components/Text/Text.js"),react=__webpack_require__("./node_modules/react/index.js"),style_utilities_lib=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),Link=__webpack_require__("./node_modules/@fluentui/react/lib/components/Link/Link.js"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}var Login=function Login(props){var _props$calloutProps2,_props$calloutProps$c,_props$calloutProps4,_props$calloutProps$h,_props$calloutProps5,_props$calloutProps6,_props$calloutProps7,_props$calloutProps8,_props$calloutProps10,ref=react.useRef(null),_React$useState2=_slicedToArray(react.useState(!1),2),calloutVisible=_React$useState2[0],setCalloutVisibility=_React$useState2[1],calloutStyles=react.useMemo((function(){var _props$calloutProps;return function getLoginCalloutStyles(propClassName){var theme=(0,style_utilities_lib.gh)(),className="TALXIS__Login--callout";return propClassName&&(className=className+" "+propClassName),className+" "+(0,style_utilities_lib.y0)({".ms-Callout-main":{">div:first-child":{display:"flex",".ms-Button--commandBar":{height:44},">span":{flexGrow:1,textAlign:"left",lineHeight:44,paddingLeft:10}},"> .TALXIS__Login--callout__footer":{borderTop:"1px solid "+theme.semanticColors.bodyDivider,"> .ms-Button--commandBar":{width:"100%",backgroundColor:"rgba(0,0,0,.04)",":hover":{backgroundColor:theme.semanticColors.menuItemBackgroundHovered},":active":{backgroundColor:theme.semanticColors.menuItemBackgroundPressed},"> .ms-Button-flexContainer":{justifyContent:"flex-start"},".ms-Persona":{".ms-Persona-details":{">div":{display:"block"}},".ms-Persona-primaryText":{fontSize:12}}}},".ms-Persona":{height:"auto",padding:15,rowGap:5,".ms-Persona-details":{rowGap:3},".ms-Persona-primaryText":{fontSize:18,fontWeight:700},".ms-Persona-secondaryText":{color:theme.palette.black,fontSize:13},".ms-Persona-tertiaryText":{display:"flex",flexDirection:"column",rowGap:5,a:{textDecoration:"underline"}}}}})}(null===(_props$calloutProps=props.calloutProps)||void 0===_props$calloutProps?void 0:_props$calloutProps.className)}),[null===(_props$calloutProps2=props.calloutProps)||void 0===_props$calloutProps2?void 0:_props$calloutProps2.className]),styles=react.useMemo((function(){return function getLoginStyles(propClassName){var className="TALXIS__Login";return propClassName&&(className=className+" "+propClassName),className+" "+(0,style_utilities_lib.y0)({padding:5,"> span .ms-Persona:has(.ms-Persona-primaryText:empty):has(.ms-Persona-secondaryText:empty):has(.ms-Persona-tertiaryText:empty):has(.ms-Persona-optionalText:empty)":{display:"block"}})}(props.className)}),[props.className]);return(0,jsx_runtime.jsxs)(CommandBarButton.Q,Object.assign({className:styles},props,{elementRef:ref,onClick:function onButtonClick(e){null!=props&&props.onClick&&props.onClick(e),setCalloutVisibility(!calloutVisible)},children:[(0,jsx_runtime.jsx)(Persona.I,Object.assign({},props.personaProps)),calloutVisible&&props.calloutProps&&(0,jsx_runtime.jsxs)(Callout.U,{calloutWidth:null!==(_props$calloutProps$c=null===(_props$calloutProps4=props.calloutProps)||void 0===_props$calloutProps4?void 0:_props$calloutProps4.calloutWidth)&&void 0!==_props$calloutProps$c?_props$calloutProps$c:320,target:ref,className:calloutStyles,onDismiss:function onCalloutDismiss(e){var _props$calloutProps3;null!==(_props$calloutProps3=props.calloutProps)&&void 0!==_props$calloutProps3&&_props$calloutProps3.onDismiss&&props.calloutProps.onDismiss(e),setCalloutVisibility(!1)},children:[(0,jsx_runtime.jsxs)("div",{children:[(0,jsx_runtime.jsx)(Text.x,{children:null!==(_props$calloutProps$h=null===(_props$calloutProps5=props.calloutProps)||void 0===_props$calloutProps5?void 0:_props$calloutProps5.headerTextProps)&&void 0!==_props$calloutProps$h?_props$calloutProps$h:""}),(null===(_props$calloutProps6=props.calloutProps)||void 0===_props$calloutProps6?void 0:_props$calloutProps6.headerButtonProps)&&(0,jsx_runtime.jsx)(CommandBarButton.Q,Object.assign({},null===(_props$calloutProps7=props.calloutProps)||void 0===_props$calloutProps7?void 0:_props$calloutProps7.headerButtonProps))]}),(0,jsx_runtime.jsx)(Persona.I,Object.assign({},props.personaProps,null===(_props$calloutProps8=props.calloutProps)||void 0===_props$calloutProps8?void 0:_props$calloutProps8.personaProps,{onRenderTertiaryText:function onRenderTertiaryText(){var _props$calloutProps9,_props$calloutProps9$;return(0,jsx_runtime.jsx)(jsx_runtime.Fragment,{children:null===(_props$calloutProps9=props.calloutProps)||void 0===_props$calloutProps9||null===(_props$calloutProps9$=_props$calloutProps9.links)||void 0===_props$calloutProps9$?void 0:_props$calloutProps9$.map((function(link){return(0,jsx_runtime.jsx)(Link.r,Object.assign({},link))}))})}})),(null===(_props$calloutProps10=props.calloutProps)||void 0===_props$calloutProps10?void 0:_props$calloutProps10.footerButtonsProps)&&(0,jsx_runtime.jsx)("div",{className:"TALXIS__Login--callout__footer",children:props.calloutProps.footerButtonsProps.map((function(footerButtonProps){return(0,jsx_runtime.jsx)(CommandBarButton.Q,Object.assign({},footerButtonProps,{children:(0,jsx_runtime.jsx)(Persona.I,Object.assign({},footerButtonProps.personaProps))}))}))})]})]}))};Login.displayName="Login";try{Login.displayName="Login",Login.__docgenInfo={description:"",displayName:"Login",props:{personaProps:{defaultValue:null,description:"",name:"personaProps",required:!1,type:{name:"IPersonaProps"}},calloutProps:{defaultValue:null,description:"",name:"calloutProps",required:!1,type:{name:"ICalloutProps"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Login/Login.tsx#Login"]={docgenInfo:Login.__docgenInfo,name:"Login",path:"src/components/Login/Login.tsx#Login"})}catch(__react_docgen_typescript_loader_error){}var Persona_types=__webpack_require__("./node_modules/@fluentui/react/lib/components/Persona/Persona.types.js"),Icon=__webpack_require__("./node_modules/@fluentui/react/lib/components/Icon/Icon.js");(0,lib.l)();var Login_stories={title:"TALXIS React Components/Login/Basic Information",component:Login,parameters:{docs:{description:{component:"Description work in progress"}}}},BasicInformation=function BasicInformation(props){return(0,jsx_runtime.jsx)(Login,{personaProps:{text:"Dominik Brych",size:Persona_types.Ir.size40,imageUrl:"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ1Hsjf24QyBBlmFxhiH5NWsF-P-dDqFXag03mOKfYFfg&s"},calloutProps:{headerTextProps:"NETWORG",headerButtonProps:{text:"Sign out",onClick:function onClick(){alert("Signing out!")}},personaProps:{size:Persona_types.Ir.size72,secondaryText:"dominik.brych@thentew.org"},footerButtonsProps:[{personaProps:{text:"NETWORG",size:Persona_types.Ir.size32,secondaryText:"dominik.brych2@thenetw.org"}},{personaProps:{size:Persona_types.Ir.size32,onRenderPersonaCoin:function onRenderPersonaCoin(){return(0,jsx_runtime.jsx)(Icon.J,{styles:{root:{fontSize:26,color:"grey",marginRight:"5px"}},iconName:"AddFriend"})},secondaryText:"Sign in with different account"}}],links:[{key:"viewAccount",href:"https://myaccount.microsoft.com/",target:"_blank",children:"View account"}]}})};BasicInformation.displayName="BasicInformation",BasicInformation.parameters={docs:{source:{type:"code"}}},BasicInformation.parameters=Object.assign({storySource:{source:"(props: ILoginProps) => {\n return (\n <Login personaProps={{\n text: 'Dominik Brych',\n size: PersonaSize.size40,\n imageUrl: 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ1Hsjf24QyBBlmFxhiH5NWsF-P-dDqFXag03mOKfYFfg&s'\n }}\n calloutProps={{\n headerTextProps: 'NETWORG',\n headerButtonProps: {\n text: 'Sign out',\n onClick: () => {\n alert(`Signing out!`)\n }\n },\n personaProps: {\n size: PersonaSize.size72,\n secondaryText: 'dominik.brych@thentew.org'\n },\n footerButtonsProps: [\n {\n personaProps: {\n text: 'NETWORG',\n size: PersonaSize.size32,\n secondaryText: 'dominik.brych2@thenetw.org'\n }\n },\n {\n personaProps: {\n size: PersonaSize.size32,\n onRenderPersonaCoin: () => <Icon \n styles={{\n root: {\n fontSize: 26,\n color: 'grey',\n marginRight: '5px'\n }\n }} \n iconName='AddFriend' />,\n secondaryText: 'Sign in with different account', \n }\n }\n ],\n links: [\n {\n key: 'viewAccount',\n href: 'https://myaccount.microsoft.com/',\n target: \"_blank\",\n children: 'View account'\n }\n ],\n }}\n />\n )\n}"}},BasicInformation.parameters);var __namedExportsOrder=["BasicInformation"]},"./src/stories/Multistage/Multistage.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{BasicInformation:function(){return BasicInformation},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.array.map.js"),__webpack_require__("./node_modules/core-js/modules/es.array.find.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./src/components/Multistage/Multistage.tsx"),_fluentui_react__WEBPACK_IMPORTED_MODULE_18__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Text/Text.js"),react__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/react/index.js"),_argTypes__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./src/stories/Multistage/argTypes.ts"),_fluentui_style_utilities__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_19__=__webpack_require__("./node_modules/@fluentui/react/lib/components/MessageBar/MessageBar.types.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(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 _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<len;i++)arr2[i]=arr[i];return arr2}(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_15__.l)(),__webpack_exports__.default={title:"TALXIS React Components/Multistage/Basic Information",component:_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.t,parameters:{docs:{description:{component:'**Multistage** component can be used in situations where you need the user to input some information in specific order.\n However, the stepping logic has to be defined by the developer. The component provides you with all the necessary events and attributes to implement the logic in any way\n you might need. This means you can create a stepper that has strict validation on every step or a stepper that can act as [**Pivot**](https://developer.microsoft.com/en-us/fluentui#/controls/web/pivot). <br/> <br/>\n <h2 style="border-bottom: none">Usage</h2>\n The component mainly consists of two important properties: `stages` and `stageStates`.\n The `stages` array is where you input all the necessary properties for the stage to be rendered.\n The `onRender` method can be used to tell the component how to render your stage. It accepts any `ReactElement` as an output. <br /> <br />\n The `stageStates` is an array that specifies the current state of each stage. The state needs to be linked to a stage in `stages` array\n via the `stageKey` property. By default, there are five values that each stage can be in: `invalid`, `valid`, `in_progress`, `inactive` and `warning`. Setting \n these values will reflect on header styling for the given stage. You can also define your own value that you can customize by targeting the element with corresponding `[data-state]` attribute in DOM. \n Each stage can also be assigned a message that will appear in the header.\n '}}},argTypes:_argTypes__WEBPACK_IMPORTED_MODULE_17__.P};var BasicInformation=function BasicInformation(props){var getMessageForStageValue=function getMessageForStageValue(stageValue){switch(stageValue){case _components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.z.invalid:return _fluentui_react__WEBPACK_IMPORTED_MODULE_19__.f.error;case _components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.z.valid:return _fluentui_react__WEBPACK_IMPORTED_MODULE_19__.f.success;case _components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.z.warning:return _fluentui_react__WEBPACK_IMPORTED_MODULE_19__.f.warning;default:return _fluentui_react__WEBPACK_IMPORTED_MODULE_19__.f.info}},stages=function getStages(count){for(var stages=[],_loop=function _loop(i){stages.push({key:"stage"+i,label:"Stage "+i,onRender:function onRender(){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)("div",{className:(0,_fluentui_style_utilities__WEBPACK_IMPORTED_MODULE_13__.y0)({display:"flex",justifyContent:"center",height:"100%",alignItems:"center"}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_18__.x,{variant:"mega",children:"Stage "+i})})}})},i=1;i<=count;i++)_loop(i);return stages}(5),_useState=(0,react__WEBPACK_IMPORTED_MODULE_12__.useState)(function getStageStates(stages){return stages.map((function(stage){return{stageKey:stage.key,value:"stage1"===stage.key?_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.z.in_progress:_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.z.inactive}}))}(stages)),_useState2=_slicedToArray(_useState,2),stageStates=_useState2[0],setStageStates=_useState2[1],_useState4=_slicedToArray((0,react__WEBPACK_IMPORTED_MODULE_12__.useState)("stage1"),2),currentStageKey=_useState4[0],setCurrentStageKey=_useState4[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_14__.jsx)(_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.t,{currentStageKey:currentStageKey,bodyHeight:"500px",stages:stages,onStageChange:function changeState(nextStageKey,goesToPreviousStage){var _stageStates=_toConsumableArray(stageStates),currentStage=stages.find((function(stage){return stage.key===currentStageKey})),currentStageState=_stageStates.find((function(state){return state.stageKey===currentStageKey})),nextStageState=_stageStates.find((function(state){return state.stageKey===nextStageKey})),currentStageStateValue=function getRandomStageValue(){var rnd=Math.random();return rnd<.3?_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.z.valid:rnd>.3&&rnd<.6?_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.z.invalid:rnd>.6&&rnd<1?_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.z.warning:_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.z.inactive}();if(!goesToPreviousStage){var isValid=currentStageStateValue!==_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.z.invalid;return currentStageState.value=currentStageStateValue,currentStageState.messageProps={message:"Message from "+(null==currentStage?void 0:currentStage.label),messageBarProps:{messageBarType:getMessageForStageValue(currentStageStateValue)}},isValid&&(nextStageState.value=_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_16__.z.in_progress,setCurrentStageKey(nextStageKey)),void setStageStates(_stageStates)}setStageStates(_stageStates),setCurrentStageKey(nextStageKey)},stageStates:stageStates})};BasicInformation.displayName="BasicInformation",BasicInformation.parameters={docs:{source:{type:"code"}}},BasicInformation.parameters=Object.assign({storySource:{source:"(props: IMultistageProps) => {\n const getStages = (count: number): IStage[] => {\n const stages: IStage[] = [];\n for (let i = 1; i <= count; i++) {\n stages.push({\n key: `stage${i}`,\n label: `Stage ${i}`,\n onRender: () => {\n return (\n <div className={mergeStyles({\n display: 'flex',\n justifyContent: 'center',\n height: '100%',\n alignItems: 'center'\n })}>\n <Text variant='mega'>{`Stage ${i}`}</Text>\n </div>\n );\n }\n });\n }\n return stages;\n }\n const getStageStates = (stages: IStage[]): IStageState[] => {\n return stages.map(stage => {\n return {\n stageKey: stage.key,\n value: stage.key === 'stage1' ? StageValue.in_progress : StageValue.inactive,\n }\n });\n };\n const getRandomStageValue = () => {\n const rnd = Math.random();\n if(rnd < 0.3) {\n return StageValue.valid;\n }\n if(rnd > 0.3 && rnd < 0.6) {\n return StageValue.invalid;\n }\n if(rnd > 0.6 && rnd < 1) {\n return StageValue.warning;\n }\n return StageValue.inactive \n };\n const changeState = (nextStageKey: string, goesToPreviousStage: boolean) => {\n const _stageStates = [...stageStates];\n const currentStage = stages.find(stage => stage.key === currentStageKey);\n const currentStageState = _stageStates.find(state => state.stageKey === currentStageKey);\n const nextStageState = _stageStates.find(state => state.stageKey === nextStageKey);\n const currentStageStateValue = getRandomStageValue();\n\n if (!goesToPreviousStage) {\n const isValid = currentStageStateValue !== StageValue.invalid;\n currentStageState!.value = currentStageStateValue;\n currentStageState!.messageProps = {\n message: `Message from ${currentStage?.label}`,\n messageBarProps: {\n messageBarType: getMessageForStageValue(currentStageStateValue)\n }\n }\n if(isValid) {\n nextStageState!.value = StageValue.in_progress;\n setCurrentStageKey(nextStageKey);\n }\n setStageStates(_stageStates);\n return;\n }\n setStageStates(_stageStates);\n setCurrentStageKey(nextStageKey);\n };\n\n const getMessageForStageValue = (stageValue: StageValue) => {\n switch(stageValue) {\n case StageValue.invalid:\n return MessageBarType.error;\n case StageValue.valid:\n return MessageBarType.success;\n case StageValue.warning:\n return MessageBarType.warning;\n default:\n return MessageBarType.info;\n }\n }\n\n const stages = getStages(5);\n const [stageStates, setStageStates] = useState<IStageState[]>(getStageStates(stages))\n const [currentStageKey, setCurrentStageKey] = useState<string>('stage1');\n return (\n <Multistage\n currentStageKey={currentStageKey}\n bodyHeight='500px'\n stages={stages}\n onStageChange={changeState}\n stageStates={stageStates} />\n )\n}"}},BasicInformation.parameters);var __namedExportsOrder=["BasicInformation"];try{BasicInformation.displayName="BasicInformation",BasicInformation.__docgenInfo={description:"",displayName:"BasicInformation",props:{currentStageKey:{defaultValue:null,description:"Key of the current stage, matching stage will get highlighted in the header.",name:"currentStageKey",required:!0,type:{name:"string"}},stages:{defaultValue:null,description:"An array of stages.",name:"stages",required:!0,type:{name:"IStage[]"}},stageStates:{defaultValue:null,description:"An array of stageStates.",name:"stageStates",required:!0,type:{name:"IStageState[]"}},onStageChange:{defaultValue:null,description:"Fires every time a stage is about to be changed. This method can be used to implement stage validation.\n@param nextStageKey Key of the stage that the user wants to access\n@param goesToPreviousStage Defines if the stage that the user wants to access is positioned before the currently selected step. \nCan be useful during validation.",name:"onStageChange",required:!0,type:{name:"(nextStageKey: string, goesToPreviousStage: boolean) => void"}},footerProps:{defaultValue:null,description:"Can be used to set the props of next/previous/submit buttons.\nfor more information.",name:"footerProps",required:!1,type:{name:"IMultistageFooterProps"}},bodyHeight:{defaultValue:null,description:'Defines a fixed height of body for all stages. Prevents "jumping" when some stages have different \nheight than other.',name:"bodyHeight",required:!1,type:{name:"string"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/Multistage/Multistage.stories.tsx#BasicInformation"]={docgenInfo:BasicInformation.__docgenInfo,name:"BasicInformation",path:"src/stories/Multistage/Multistage.stories.tsx#BasicInformation"})}catch(__react_docgen_typescript_loader_error){}},"./src/stories/Multistage/Multistage_Extensions.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{CustomRendering:function(){return CustomRendering},Pivot:function(){return Pivot},Stepper:function(){return Stepper},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.array.map.js"),__webpack_require__("./node_modules/core-js/modules/es.array.find.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_19__=__webpack_require__("./node_modules/@fluentui/react/lib/components/MessageBar/MessageBar.types.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_20__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Persona/Persona.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_21__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Persona/Persona.types.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_22__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/PrimaryButton/PrimaryButton.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_18__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Text/Text.js"),_argTypes__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./src/stories/Multistage/argTypes.ts"),react__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/react/index.js"),_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./src/components/Multistage/Multistage.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./node_modules/react/jsx-runtime.js");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(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(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<len;i++)arr2[i]=arr[i];return arr2}(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_14__.l)(),__webpack_exports__.default={title:"TALXIS React Components/Multistage/Extensions",component:_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.t,parameters:{docs:{description:{component:"An example of Multistage being used as [Pivot](https://developer.microsoft.com/en-us/fluentui#/controls/web/pivot)."}}},argTypes:_argTypes__WEBPACK_IMPORTED_MODULE_16__.P};var Pivot=function Pivot(props){var stages=function getStages(count){for(var stages=[],_loop=function _loop(i){stages.push({key:"stage"+i,label:"Tab "+i,onRender:function onRender(){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)("div",{className:(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_17__.y0)({display:"flex",justifyContent:"center",height:"100%",alignItems:"center"}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_18__.x,{variant:"mega",children:"Tab "+i})})}})},i=1;i<=count;i++)_loop(i);return stages}(5),stageStates=function getStageStates(stages){return stages.map((function(stage){return{stageKey:stage.key,value:"pivot"}}))}(stages),_useState2=_slicedToArray((0,react__WEBPACK_IMPORTED_MODULE_12__.useState)("stage1"),2),currentStageKey=_useState2[0],setCurrentStageKey=_useState2[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.t,{bodyHeight:"500px",stages:stages,footerProps:{nextButtonProps:{hidden:!0},previousButtonProps:{hidden:!0},submitButtonProps:{hidden:!0}},stageStates:stageStates,currentStageKey:currentStageKey,onStageChange:function onStageChange(nextStageKey,goesToPreviousStage){setCurrentStageKey(nextStageKey)}})};Pivot.displayName="Pivot";var Stepper=function Stepper(props){var getMessageForStageValue=function getMessageForStageValue(stageValue){switch(stageValue){case _components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.z.invalid:return _fluentui_react__WEBPACK_IMPORTED_MODULE_19__.f.error;case _components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.z.valid:return _fluentui_react__WEBPACK_IMPORTED_MODULE_19__.f.success;case _components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.z.warning:return _fluentui_react__WEBPACK_IMPORTED_MODULE_19__.f.warning;default:return _fluentui_react__WEBPACK_IMPORTED_MODULE_19__.f.info}},stages=function getStages(count){for(var stages=[],_loop2=function _loop2(i){stages.push({key:"stage"+i,label:"Stage "+i,onRender:function onRender(){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)("div",{className:(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_17__.y0)({display:"flex",justifyContent:"center",height:"100%",alignItems:"center"}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_18__.x,{variant:"mega",children:"Stage "+i})})}})},i=1;i<=count;i++)_loop2(i);return stages}(5),_useState3=(0,react__WEBPACK_IMPORTED_MODULE_12__.useState)(function getStageStates(stages){return stages.map((function(stage){return{stageKey:stage.key,value:"stage1"===stage.key?_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.z.in_progress:_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.z.inactive}}))}(stages)),_useState4=_slicedToArray(_useState3,2),stageStates=_useState4[0],setStageStates=_useState4[1],_useState6=_slicedToArray((0,react__WEBPACK_IMPORTED_MODULE_12__.useState)("stage1"),2),currentStageKey=_useState6[0],setCurrentStageKey=_useState6[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.t,{currentStageKey:currentStageKey,bodyHeight:"500px",stages:stages,onStageChange:function changeState(nextStageKey,goesToPreviousStage){var _stageStates=_toConsumableArray(stageStates),currentStage=stages.find((function(stage){return stage.key===currentStageKey})),currentStageState=_stageStates.find((function(state){return state.stageKey===currentStageKey})),nextStageState=_stageStates.find((function(state){return state.stageKey===nextStageKey})),currentStageStateValue=function getRandomStageValue(){var rnd=Math.random();return rnd<.3?_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.z.valid:rnd>.3&&rnd<.6?_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.z.invalid:rnd>.6&&rnd<1?_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.z.warning:_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.z.inactive}();if(!goesToPreviousStage){var isValid=currentStageStateValue!==_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.z.invalid;return currentStageState.value=currentStageStateValue,currentStageState.messageProps={message:"Message from "+(null==currentStage?void 0:currentStage.label),messageBarProps:{messageBarType:getMessageForStageValue(currentStageStateValue)}},isValid&&(nextStageState.value=_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.z.in_progress,setCurrentStageKey(nextStageKey)),void setStageStates(_stageStates)}setStageStates(_stageStates),setCurrentStageKey(nextStageKey)},stageStates:stageStates})};Stepper.displayName="Stepper";var CustomRendering=function CustomRendering(props){var names=["Hamish Beck","Donovan Glass","Mia Benjamin","Haleema Proctor","Alana Rogers"],stages=function getStages(count){for(var stages=[],_loop3=function _loop3(i){stages.push({key:"stage"+i,label:names[i],onRenderHeader:function onRenderHeader(stageState,defaultRenderer){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_20__.I,{styles:{root:{marginTop:5,padding:5}},size:_fluentui_react__WEBPACK_IMPORTED_MODULE_21__.Ir.size48,imageUrl:"https://randomuser.me/api/portraits/men/"+i+".jpg",text:names[i]})},onRender:function onRender(){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)("div",{className:(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_17__.y0)({display:"flex",justifyContent:"center",height:"100%",alignItems:"center"}),children:(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_20__.I,{size:_fluentui_react__WEBPACK_IMPORTED_MODULE_21__.Ir.size120,imageUrl:"https://randomuser.me/api/portraits/men/"+i+".jpg",text:names[i]})})}})},i=0;i<=count;i++)_loop3(i);return stages}(4),stageStates=function getStageStates(stages){return stages.map((function(stage){return{stageKey:stage.key,value:"pivot"}}))}(stages),_useState8=_slicedToArray((0,react__WEBPACK_IMPORTED_MODULE_12__.useState)("stage0"),2),currentStageKey=_useState8[0],setCurrentStageKey=_useState8[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_components_Multistage_Multistage__WEBPACK_IMPORTED_MODULE_15__.t,{bodyHeight:"500px",stages:stages,footerProps:{onRender:function onRender(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsxs)("div",{className:(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_17__.y0)({display:"flex",justifyContent:"center",gap:5,paddingBottom:15}),children:[props.showPreviousButton&&(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_22__.K,{onClick:props.goToPreviousStage,children:"Previous person"}),props.showNextButton&&(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_13__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_22__.K,{onClick:props.goToNextStage,children:"Next person"})]})}},stageStates:stageStates,currentStageKey:currentStageKey,onStageChange:function onStageChange(nextStageKey,goesToPreviousStage){setCurrentStageKey(nextStageKey)}})};CustomRendering.displayName="CustomRendering",Pivot.parameters={docs:{source:{type:"code"}}},Stepper.parameters={docs:{description:{story:"By implementing the necessary validation, the component can be used to guide the user on more advanced forms."},source:{type:"code"}}},CustomRendering.parameters={docs:{description:{story:"Both header and footer can be heavily customized by leveraging their `onRender` methods."},source:{type:"code"}}},Pivot.parameters=Object.assign({storySource:{source:"(props: IMultistageProps) => {\n const getStages = (count: number): IStage[] => {\n const stages: IStage[] = [];\n for (let i = 1; i <= count; i++) {\n stages.push({\n key: `stage${i}`,\n label: `Tab ${i}`,\n onRender: () => {\n return (\n <div className={mergeStyles({\n display: 'flex',\n justifyContent: 'center',\n height: '100%',\n alignItems: 'center'\n })}>\n <Text variant='mega'>{`Tab ${i}`}</Text>\n </div>\n );\n }\n });\n }\n return stages;\n };\n const getStageStates = (stages: IStage[]): IStageState[] => {\n return stages.map(stage => {\n return {\n stageKey: stage.key,\n value: \"pivot\"\n }\n });\n };\n const stages = getStages(5);\n const stageStates = getStageStates(stages);\n const [currentStageKey, setCurrentStageKey] = useState<string>('stage1');\n return (\n <Multistage\n bodyHeight='500px'\n stages={stages}\n footerProps={{\n nextButtonProps: {\n hidden: true\n },\n previousButtonProps: {\n hidden: true\n },\n submitButtonProps: {\n hidden: true\n }\n }}\n stageStates={stageStates}\n currentStageKey={currentStageKey}\n onStageChange={(nextStageKey, goesToPreviousStage) => {\n setCurrentStageKey(nextStageKey)\n }} />\n );\n}"}},Pivot.parameters),Stepper.parameters=Object.assign({storySource:{source:"(props: IMultistageProps) => {\n const getStages = (count: number): IStage[] => {\n const stages: IStage[] = [];\n for (let i = 1; i <= count; i++) {\n stages.push({\n key: `stage${i}`,\n label: `Stage ${i}`,\n onRender: () => {\n return (\n <div className={mergeStyles({\n display: 'flex',\n justifyContent: 'center',\n height: '100%',\n alignItems: 'center'\n })}>\n <Text variant='mega'>{`Stage ${i}`}</Text>\n </div>\n );\n }\n });\n }\n return stages;\n }\n const getStageStates = (stages: IStage[]): IStageState[] => {\n return stages.map(stage => {\n return {\n stageKey: stage.key,\n value: stage.key === 'stage1' ? StageValue.in_progress : StageValue.inactive,\n }\n });\n };\n const getRandomStageValue = () => {\n const rnd = Math.random();\n if (rnd < 0.3) {\n return StageValue.valid;\n }\n if (rnd > 0.3 && rnd < 0.6) {\n return StageValue.invalid;\n }\n if (rnd > 0.6 && rnd < 1) {\n return StageValue.warning;\n }\n return StageValue.inactive\n };\n const changeState = (nextStageKey: string, goesToPreviousStage: boolean) => {\n const _stageStates = [...stageStates];\n const currentStage = stages.find(stage => stage.key === currentStageKey);\n const currentStageState = _stageStates.find(state => state.stageKey === currentStageKey);\n const nextStageState = _stageStates.find(state => state.stageKey === nextStageKey);\n const currentStageStateValue = getRandomStageValue();\n\n if (!goesToPreviousStage) {\n const isValid = currentStageStateValue !== StageValue.invalid;\n currentStageState!.value = currentStageStateValue;\n currentStageState!.messageProps = {\n message: `Message from ${currentStage?.label}`,\n messageBarProps: {\n messageBarType: getMessageForStageValue(currentStageStateValue)\n }\n }\n if (isValid) {\n nextStageState!.value = StageValue.in_progress;\n setCurrentStageKey(nextStageKey);\n }\n setStageStates(_stageStates);\n return;\n }\n setStageStates(_stageStates);\n setCurrentStageKey(nextStageKey);\n };\n\n const getMessageForStageValue = (stageValue: StageValue) => {\n switch (stageValue) {\n case StageValue.invalid:\n return MessageBarType.error;\n case StageValue.valid:\n return MessageBarType.success;\n case StageValue.warning:\n return MessageBarType.warning;\n default:\n return MessageBarType.info;\n }\n }\n\n const stages = getStages(5);\n const [stageStates, setStageStates] = useState<IStageState[]>(getStageStates(stages))\n const [currentStageKey, setCurrentStageKey] = useState<string>('stage1');\n return (\n <Multistage\n currentStageKey={currentStageKey}\n bodyHeight='500px'\n stages={stages}\n onStageChange={changeState}\n stageStates={stageStates} />\n )\n}"}},Stepper.parameters),CustomRendering.parameters=Object.assign({storySource:{source:"(props: IMultistageProps) => {\n const names = [\n 'Hamish Beck',\n 'Donovan Glass',\n 'Mia Benjamin',\n 'Haleema Proctor',\n 'Alana Rogers'\n ]\n const getStages = (count: number): IStage[] => {\n const stages: IStage[] = [];\n for (let i = 0; i <= count; i++) {\n stages.push({\n key: `stage${i}`,\n label: names[i],\n onRenderHeader: (stageState, defaultRenderer) => {\n return <Persona\n styles={{\n root: {\n marginTop: 5,\n padding: 5\n }\n }}\n size={PersonaSize.size48}\n imageUrl={`https://randomuser.me/api/portraits/men/${i}.jpg`}\n text={names[i]} />\n },\n onRender: () => {\n return (\n <div className={mergeStyles({\n display: 'flex',\n justifyContent: 'center',\n height: '100%',\n alignItems: 'center'\n })}>\n <Persona\n size={PersonaSize.size120}\n imageUrl={`https://randomuser.me/api/portraits/men/${i}.jpg`}\n text={names[i]} />\n </div>\n );\n }\n });\n }\n return stages;\n };\n const getStageStates = (stages: IStage[]): IStageState[] => {\n return stages.map(stage => {\n return {\n stageKey: stage.key,\n value: \"pivot\"\n }\n });\n };\n const stages = getStages(4);\n const stageStates = getStageStates(stages);\n const [currentStageKey, setCurrentStageKey] = useState<string>('stage0');\n return (\n <Multistage\n bodyHeight='500px'\n stages={stages}\n footerProps={{\n onRender: (props) => {\n return (\n <div className={mergeStyles({\n display: 'flex',\n justifyContent: 'center',\n gap: 5,\n paddingBottom: 15\n })}>\n {props.showPreviousButton &&\n <PrimaryButton onClick={props.goToPreviousStage}>Previous person</PrimaryButton>\n }\n {props.showNextButton &&\n <PrimaryButton onClick={props.goToNextStage}>Next person</PrimaryButton>\n }\n </div>\n );\n }\n }}\n stageStates={stageStates}\n currentStageKey={currentStageKey}\n onStageChange={(nextStageKey, goesToPreviousStage) => {\n setCurrentStageKey(nextStageKey)\n }} />\n );\n}"}},CustomRendering.parameters);var __namedExportsOrder=["Pivot","Stepper","CustomRendering"]},"./src/stories/Spinner/Spinner.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{BasicInformation:function(){return BasicInformation},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var _components_Spinner_Spinner__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/components/Spinner/Spinner.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/react/jsx-runtime.js");__webpack_exports__.default={title:"TALXIS React Components/Spinner/Basic Information",parameters:{docs:{description:{component:"Fluent v8 spinner using v9 customized theme."}}}};var BasicInformation=function BasicInformation(){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components_Spinner_Spinner__WEBPACK_IMPORTED_MODULE_2__.$,{})};BasicInformation.displayName="BasicInformation",BasicInformation.parameters={docs:{source:{type:"code"}}},BasicInformation.parameters=Object.assign({storySource:{source:"() => {\n return <Spinner />\n}"}},BasicInformation.parameters);var __namedExportsOrder=["BasicInformation"]},"./src/stories/TagPicker/TagPicker.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{BasicInformation:function(){return BasicInformation},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.parse-int.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var _components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./src/components/TagPicker/TagPicker.tsx"),_fluentui_react__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_18__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),react__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/react/index.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_16__.l)(),__webpack_exports__.default={title:"TALXIS React Components/TagPicker/Basic Information",component:_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_17__.U,argTypes:{onResolveSuggestions:{table:{disable:!0}},onRenderSuggestionsItem:{table:{disable:!0}},createGenericItem:{table:{disable:!0}},onRenderItem:{table:{disable:!0}},onItemSelected:{table:{disable:!0}},onChange:{table:{disable:!0}},disabled:{type:"boolean",description:"Disables input element."},selectedItems:{table:{disable:!0}},messageBarProps:{control:!1},searchBtnProps:{control:!1},errorMessage:{type:"string"}},parameters:{docs:{description:{component:"**TagPicker** with additional styling and support for richer tags. \n The original [**ITag**](https://docs.microsoft.com/en-us/javascript/api/react/itag?view=office-ui-fabric-react-latest) interface only supported basic `string` tags which allowed limited options of customizability unless custom render functions were used.\n Our TagPicker replaces the [**ITag**](https://docs.microsoft.com/en-us/javascript/api/react/itag?view=office-ui-fabric-react-latest) interface with our own [**IItemProps**](https://dev.azure.com/thenetworg/INT0015/_git/INT0015-SharedComponents?path=/src/components/TagPicker/index.tsx) interface that extends the native [**ICommandBarItemProps**](https://developer.microsoft.com/en-us/fluentui#/controls/web/commandbar#ICommandBarItemProps) interface. \n This means that each Tag is now represented by a [**CommandBar**](https://developer.microsoft.com/en-us/fluentui#/controls/web/commandbar) item, which allows each Tag to leverage all of [**CommandBar**](https://developer.microsoft.com/en-us/fluentui#/controls/web/commandbar) item customizability. \n Extends [**TagPicker**](https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers/)."}}}};var BasicInformation=function BasicInformation(props){var getSuggestions=function getSuggestions(){for(var items=[],i=1;i<11;i++)items.push({key:i.toString(),text:"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i+"Item "+i,secondaryText:"Item "+i+" description",deleteButtonProps:{key:"delete_btn"+i,iconProps:{iconName:"Delete"}}});return items},_React$useState2=_slicedToArray(react__WEBPACK_IMPORTED_MODULE_14__.useState(getSuggestions().filter((function(x){return parseInt(x.key)%2}))),2),selectedItems=_React$useState2[0],setSelectedItems=_React$useState2[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_15__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_15__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_15__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_18__._,{children:"Default TagPicker"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_15__.jsx)(_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_17__.U,Object.assign({},props,{onResolveSuggestions:function filterSuggestedItems(filter,selectedItems){return filter?getSuggestions().filter((function(item){var _item$text;return 0===(null===(_item$text=item.text)||void 0===_item$text?void 0:_item$text.toLowerCase().indexOf(filter.toLowerCase()))&&!function listContainsSelectedItems(item,selectedItems){return!(!selectedItems||!selectedItems.length||0===selectedItems.length)&&selectedItems.some((function(compareItem){return compareItem.key===item.key}))}(item,selectedItems)})):[]},onChange:function onChange(items){return setSelectedItems(items)},selectedItems:selectedItems}))]})};BasicInformation.parameters={description:{story:"Each item can have multiple additional buttons. The buttons can be added using the `buttons` property on item object"},docs:{source:{type:"code"}}},BasicInformation.parameters=Object.assign({storySource:{source:"(props: ITagPickerProps) => {\n const getSuggestions = (): IItemProps[] => {\n const items: IItemProps[] = [];\n for (let i = 1; i < 11; i++) {\n items.push({\n key: i.toString(),\n text: `Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}Item ${i}`,\n secondaryText: `Item ${i} description`,\n deleteButtonProps: {\n key: `delete_btn${i}`,\n iconProps: {\n iconName: 'Delete'\n }\n },\n })\n }\n return items;\n }\n const [selectedItems, setSelectedItems] = React.useState<IItemProps[] | undefined>(getSuggestions().filter(x=> parseInt(x.key) % 2));\n const listContainsSelectedItems = (item: IItemProps, selectedItems?: IItemProps[]) => {\n if (!selectedItems || !selectedItems.length || selectedItems.length === 0) {\n return false;\n }\n return selectedItems.some(compareItem => compareItem.key === item.key);\n };\n const filterSuggestedItems = (filter: string, selectedItems?: IItemProps[] | undefined): IItemProps[] => {\n return filter\n ? getSuggestions().filter(\n item => item.text?.toLowerCase().indexOf(filter.toLowerCase()) === 0 && !listContainsSelectedItems(item, selectedItems),\n )\n : [];\n };\n return (\n <>\n <Label>Default TagPicker</Label>\n <TagPicker {...props} \n onResolveSuggestions={filterSuggestedItems}\n onChange={(items) => setSelectedItems(items)} \n selectedItems={selectedItems} />\n </>\n );\n}"}},BasicInformation.parameters);var __namedExportsOrder=["BasicInformation"];try{BasicInformation.displayName="BasicInformation",BasicInformation.__docgenInfo={description:"",displayName:"BasicInformation",props:{onResolveSuggestions:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"onResolveSuggestions",required:!0,type:{name:"(filter: string, selectedItems?: IItemProps[] | undefined) => IItemProps[] | PromiseLike<IItemProps[]>"}},createGenericItem:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"createGenericItem",required:!1,type:{name:"((input: string, ValidationState: ValidationState) => IItemProps | ISuggestionModel<IItemProps>)"}},onRenderSuggestionsItem:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"onRenderSuggestionsItem",required:!1,type:{name:"((props: IItemProps, itemProps: ISuggestionItemProps<IItemProps>) => Element)"}},onRenderItem:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"onRenderItem",required:!1,type:{name:"((props: IPickerItemProps<IItemProps>) => Element)"}},onItemSelected:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"onItemSelected",required:!1,type:{name:"((selectedItem?: IItemProps) => IItemProps | PromiseLike<IItemProps> | null)"}},onChange:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"onChange",required:!1,type:{name:"((items?: IItemProps[]) => void)"}},transparent:{defaultValue:null,description:"Makes the selected items background transparent.",name:"transparent",required:!1,type:{name:"boolean"}},selectedItems:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"selectedItems",required:!1,type:{name:"IItemProps[]"}},stackItems:{defaultValue:null,description:"If set to `true`, each item will take up the entire width of the container.",name:"stackItems",required:!1,type:{name:"boolean"}},searchBtnProps:{defaultValue:null,description:"Props for the search button.",name:"searchBtnProps",required:!1,type:{name:"ISearchButtonProps"}},keepCalloutOpen:{defaultValue:null,description:"If set to `true`, suggestions will stay open, if not all are selected and items are not limited to 1.",name:"keepCalloutOpen",required:!1,type:{name:"boolean"}},readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/TagPicker/TagPicker.stories.tsx#BasicInformation"]={docgenInfo:BasicInformation.__docgenInfo,name:"BasicInformation",path:"src/stories/TagPicker/TagPicker.stories.tsx#BasicInformation"})}catch(__react_docgen_typescript_loader_error){}},"./src/stories/TagPicker/TagPicker_Extensions.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{ColorfulItems:function(){return ColorfulItems},ErrorMessage:function(){return ErrorMessage},ItemButtons:function(){return ItemButtons},ReadOnly:function(){return ReadOnly},SearchButton:function(){return SearchButton},StackedItems:function(){return StackedItems},TransparentItems:function(){return TransparentItems},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.array.filter.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var _components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./src/components/TagPicker/TagPicker.tsx"),_fluentui_react__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/react/jsx-runtime.js");(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_4__.l)(),__webpack_exports__.default={title:"TALXIS React Components/TagPicker/Extensions",component:_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_5__.U,parameters:{docs:{description:{component:"Each item can have multiple additional buttons. The buttons can be added using the `buttons` property on item object. \n Each item can also be shown only on hover by using the `showOnlyOnHover` property. Optionally, the additional buttons can be hidden in the suggestions using the `hideInSuggestions` property."}}},argTypes:{onResolveSuggestions:{table:{disable:!0},defaultValue:function getDefaultSuggestions(){for(var items=[],i=1;i<11;i++)items.push({disabled:!0,key:"item"+i,text:"Item "+i,secondaryText:"Item "+i+" description",deleteButtonProps:{key:"delete_btn"+i,iconProps:{iconName:"Delete"}}});return items}},onRenderSuggestionsItem:{table:{disable:!0}},createGenericItem:{table:{disable:!0}},onRenderItem:{table:{disable:!0}},onItemSelected:{table:{disable:!0}},onChange:{table:{disable:!0}},disabled:{type:"boolean",description:"Disables input element."},selectedItems:{table:{disable:!0}},underlined:{control:{type:"boolean"}},messageBarProps:{control:!1},searchBtnProps:{control:!1},errorMessage:{type:"string"}}};var ItemButtons=function ItemButtons(props){var filterSuggestedItems=function filterSuggestedItems(filter,selectedItems,showOnlyOnHover,hideInSuggestions){return filter?function getSuggestionsWithCustomButtons(showOnlyOnHover,hideInSuggestions){for(var items=[],_loop=function _loop(i){items.push({key:"item"+i,text:"Item "+i,secondaryText:"Item "+i+" description",deleteButtonProps:{key:"delete_btn"+i,showOnlyOnHover:showOnlyOnHover,iconProps:{iconName:"Delete"}},buttons:[{hideInSuggestions:hideInSuggestions,key:"custom_button_"+i,showOnlyOnHover:showOnlyOnHover,onClick:function onClick(){alert("Custom button of item "+i+" clicked!")},iconProps:{iconName:"BeerMug"}}]})},i=1;i<11;i++)_loop(i);return items}(showOnlyOnHover,hideInSuggestions).filter((function(item){var _item$text;return 0===(null===(_item$text=item.text)||void 0===_item$text?void 0:_item$text.toLowerCase().indexOf(filter.toLowerCase()))&&!function listContainsSelectedItems(item,selectedItems){return!(!selectedItems||!selectedItems.length||0===selectedItems.length)&&selectedItems.some((function(compareItem){return compareItem.key===item.key}))}(item,selectedItems)})):[]};return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_6__._,{children:"Items with additional buttons"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_5__.U,Object.assign({},props,{onResolveSuggestions:function onResolveSuggestions(filter,selectedItems){return filterSuggestedItems(filter,selectedItems)}})),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_6__._,{children:"Items with additional buttons shown only on hover"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_5__.U,Object.assign({},props,{onResolveSuggestions:function onResolveSuggestions(filter,selectedItems){return filterSuggestedItems(filter,selectedItems,!0)}})),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_6__._,{children:"Items with additional buttons hidden in suggestions"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_5__.U,Object.assign({},props,{onResolveSuggestions:function onResolveSuggestions(filter,selectedItems){return filterSuggestedItems(filter,selectedItems,!1,!0)}}))]})},SearchButton=function SearchButton(props){var getSuggestions=function getSuggestions(){for(var items=[],i=1;i<11;i++)items.push({key:"item"+i,text:"Item "+i,secondaryText:"Item "+i+" description",deleteButtonProps:{key:"delete_btn"+i,iconProps:{iconName:"Delete"}}});return items};return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_6__._,{children:"Search Button"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_5__.U,Object.assign({},props,{searchBtnProps:{key:"search",iconProps:{iconName:"Search"}},onResolveSuggestions:function filterSuggestedItems(filter,selectedItems){return filter?getSuggestions().filter((function(item){var _item$text2;return 0===(null===(_item$text2=item.text)||void 0===_item$text2?void 0:_item$text2.toLowerCase().indexOf(filter.toLowerCase()))&&!function listContainsSelectedItems(item,selectedItems){return!(!selectedItems||!selectedItems.length||0===selectedItems.length)&&selectedItems.some((function(compareItem){return compareItem.key===item.key}))}(item,selectedItems)})):getSuggestions()}}))]})},StackedItems=function StackedItems(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_6__._,{children:"Stacked items"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_5__.U,Object.assign({},props,{stackItems:!0,onResolveSuggestions:function filterSuggestedItems(filter,selectedItems){return filter?function getSuggestions(){for(var items=[],i=1;i<11;i++)items.push({key:"item"+i,text:"Item "+i,secondaryText:"Item "+i+" description",deleteButtonProps:{key:"delete_btn"+i,iconProps:{iconName:"Delete"}}});return items}().filter((function(item){var _item$text3;return 0===(null===(_item$text3=item.text)||void 0===_item$text3?void 0:_item$text3.toLowerCase().indexOf(filter.toLowerCase()))&&!function listContainsSelectedItems(item,selectedItems){return!(!selectedItems||!selectedItems.length||0===selectedItems.length)&&selectedItems.some((function(compareItem){return compareItem.key===item.key}))}(item,selectedItems)})):[]}}))]})},TransparentItems=function TransparentItems(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_6__._,{children:"Transparent items"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_5__.U,Object.assign({},props,{transparent:props.transparent,onResolveSuggestions:function filterSuggestedItems(filter,selectedItems){return filter?function getSuggestions(){for(var items=[],i=1;i<11;i++)items.push({key:"item"+i,text:"Item "+i,secondaryText:"Item "+i+" description",deleteButtonProps:{key:"delete_btn"+i,iconProps:{iconName:"Delete"}}});return items}().filter((function(item){var _item$text4;return 0===(null===(_item$text4=item.text)||void 0===_item$text4?void 0:_item$text4.toLowerCase().indexOf(filter.toLowerCase()))&&!function listContainsSelectedItems(item,selectedItems){return!(!selectedItems||!selectedItems.length||0===selectedItems.length)&&selectedItems.some((function(compareItem){return compareItem.key===item.key}))}(item,selectedItems)})):[]}}))]})},ColorfulItems=function ColorfulItems(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_6__._,{children:"Colorful Items"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_5__.U,Object.assign({},props,{onResolveSuggestions:function filterSuggestedItems(filter,selectedItems){return filter?function getSuggestions(){for(var items=[],i=1;i<11;i++)items.push({key:"item"+i,text:"Item "+i,secondaryText:"Item "+i+" description",deleteButtonProps:{key:"delete_btn"+i,iconProps:{iconName:"Delete"}},itemBackgroundColor:i%2==0?"#fccac5":"#d1d3ff"});return items}().filter((function(item){var _item$text5;return 0===(null===(_item$text5=item.text)||void 0===_item$text5?void 0:_item$text5.toLowerCase().indexOf(filter.toLowerCase()))&&!function listContainsSelectedItems(item,selectedItems){return!(!selectedItems||!selectedItems.length||0===selectedItems.length)&&selectedItems.some((function(compareItem){return compareItem.key===item.key}))}(item,selectedItems)})):[]}}))]})},ReadOnly=function ReadOnly(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_6__._,{children:"Read only"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_5__.U,Object.assign({},props,{readOnly:props.readOnly}))]})},ErrorMessage=function ErrorMessage(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_6__._,{children:"Native error message"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_components_TagPicker_TagPicker__WEBPACK_IMPORTED_MODULE_5__.U,Object.assign({},props,{errorMessage:props.errorMessage}))]})};StackedItems.parameters={docs:{description:{story:"By using the `stackItems` property, each item will take up the entire container."},source:{type:"code"}}},TransparentItems.parameters={docs:{description:{story:"By using the `transparency` property, each item can be made transparent."},source:{type:"code"}}},ColorfulItems.parameters={docs:{description:{story:"By using the `itemBackgroundColor` property, each item can have colored background."},source:{type:"code"}}},ReadOnly.parameters={docs:{description:{story:"By using the `readOnly` property, input and remove button of all items will be hidden. Additional item buttons will still be active unless explicitly disabled."},source:{type:"code"}}},SearchButton.parameters={docs:{description:{story:"By using the `searchButtonProps` property, a search button will appear in the input. The button will trigger the `onResolveSuggestions` function with current input value as filter."},source:{type:"code"}}},ItemButtons.parameters={docs:{description:{story:"By using the `searchButtonProps` property, a search button will appear in the input. The button will trigger the `onResolveSuggestions` function with current input value as filter."},source:{type:"code"}}},ErrorMessage.parameters={docs:{description:{story:"By using the `errorMessage` property, an error message will appear under the `TagPicker`."},source:{type:"code"}}},TransparentItems.args={transparent:!0},ErrorMessage.args={errorMessage:"TagPicker error message"},ReadOnly.args={readOnly:!0},ItemButtons.parameters=Object.assign({storySource:{source:"(props: ITagPickerProps) => {\n const getSuggestionsWithCustomButtons = (showOnlyOnHover?: boolean, hideInSuggestions?: boolean): IItemProps[] => {\n const items: IItemProps[] = [];\n for (let i = 1; i < 11; i++) {\n items.push({\n key: `item${i}`,\n text: `Item ${i}`,\n secondaryText: `Item ${i} description`,\n deleteButtonProps: {\n key: `delete_btn${i}`,\n showOnlyOnHover: showOnlyOnHover,\n iconProps: {\n iconName: 'Delete'\n }\n },\n buttons: [\n {\n hideInSuggestions: hideInSuggestions,\n key: `custom_button_${i}`,\n showOnlyOnHover: showOnlyOnHover,\n onClick: () => { alert(`Custom button of item ${i} clicked!`) },\n iconProps: {\n iconName: 'BeerMug'\n }\n }\n ]\n })\n }\n return items;\n }\n const listContainsSelectedItems = (item: IItemProps, selectedItems?: IItemProps[]) => {\n if (!selectedItems || !selectedItems.length || selectedItems.length === 0) {\n return false;\n }\n return selectedItems.some(compareItem => compareItem.key === item.key);\n };\n const filterSuggestedItems = (filter: string, selectedItems?: IItemProps[] | undefined, showOnlyOnHover?: boolean, hideInSuggestions?: boolean): IItemProps[] => {\n return filter\n ? getSuggestionsWithCustomButtons(showOnlyOnHover, hideInSuggestions).filter(\n item => item.text?.toLowerCase().indexOf(filter.toLowerCase()) === 0 && !listContainsSelectedItems(item, selectedItems),\n )\n : [];\n };\n return (\n <>\n <Label>Items with additional buttons</Label>\n <TagPicker {...props} onResolveSuggestions={(filter, selectedItems) => filterSuggestedItems(filter, selectedItems)} />\n <Label>Items with additional buttons shown only on hover</Label>\n <TagPicker {...props} onResolveSuggestions={(filter, selectedItems) => filterSuggestedItems(filter, selectedItems, true)} />\n <Label>Items with additional buttons hidden in suggestions</Label>\n <TagPicker {...props} onResolveSuggestions={(filter, selectedItems) => filterSuggestedItems(filter, selectedItems, false, true)} />\n </>\n );\n}"}},ItemButtons.parameters),SearchButton.parameters=Object.assign({storySource:{source:"(props: ITagPickerProps) => {\n const getSuggestions = (): IItemProps[] => {\n const items: IItemProps[] = [];\n for (let i = 1; i < 11; i++) {\n items.push({\n key: `item${i}`,\n text: `Item ${i}`,\n secondaryText: `Item ${i} description`,\n deleteButtonProps: {\n key: `delete_btn${i}`,\n iconProps: {\n iconName: 'Delete'\n }\n },\n })\n }\n return items;\n }\n const listContainsSelectedItems = (item: IItemProps, selectedItems?: IItemProps[]) => {\n if (!selectedItems || !selectedItems.length || selectedItems.length === 0) {\n return false;\n }\n return selectedItems.some(compareItem => compareItem.key === item.key);\n };\n const filterSuggestedItems = (filter: string, selectedItems?: IItemProps[] | undefined): IItemProps[] => {\n return filter\n ? getSuggestions().filter(\n item => item.text?.toLowerCase().indexOf(filter.toLowerCase()) === 0 && !listContainsSelectedItems(item, selectedItems),\n )\n : getSuggestions();\n };\n return (\n <>\n <Label>Search Button</Label>\n <TagPicker {...props}\n searchBtnProps={{\n key: 'search',\n iconProps: {\n iconName: 'Search'\n }\n }}\n onResolveSuggestions={filterSuggestedItems} />\n </>\n );\n}"}},SearchButton.parameters),StackedItems.parameters=Object.assign({storySource:{source:"(props: ITagPickerProps) => {\n const getSuggestions = (): IItemProps[] => {\n const items: IItemProps[] = [];\n for (let i = 1; i < 11; i++) {\n items.push({\n key: `item${i}`,\n text: `Item ${i}`,\n secondaryText: `Item ${i} description`,\n deleteButtonProps: {\n key: `delete_btn${i}`,\n iconProps: {\n iconName: 'Delete'\n }\n },\n })\n }\n return items;\n }\n const listContainsSelectedItems = (item: IItemProps, selectedItems?: IItemProps[]) => {\n if (!selectedItems || !selectedItems.length || selectedItems.length === 0) {\n return false;\n }\n return selectedItems.some(compareItem => compareItem.key === item.key);\n };\n const filterSuggestedItems = (filter: string, selectedItems?: IItemProps[] | undefined): IItemProps[] => {\n return filter\n ? getSuggestions().filter(\n item => item.text?.toLowerCase().indexOf(filter.toLowerCase()) === 0 && !listContainsSelectedItems(item, selectedItems),\n )\n : [];\n };\n return (\n <>\n <Label>Stacked items</Label>\n <TagPicker {...props} stackItems onResolveSuggestions={filterSuggestedItems} />\n </>\n );\n}"}},StackedItems.parameters),TransparentItems.parameters=Object.assign({storySource:{source:"(props: ITagPickerProps) => {\n const getSuggestions = (): IItemProps[] => {\n const items: IItemProps[] = [];\n for (let i = 1; i < 11; i++) {\n items.push({\n key: `item${i}`,\n text: `Item ${i}`,\n secondaryText: `Item ${i} description`,\n deleteButtonProps: {\n key: `delete_btn${i}`,\n iconProps: {\n iconName: 'Delete'\n }\n },\n })\n }\n return items;\n }\n const listContainsSelectedItems = (item: IItemProps, selectedItems?: IItemProps[]) => {\n if (!selectedItems || !selectedItems.length || selectedItems.length === 0) {\n return false;\n }\n return selectedItems.some(compareItem => compareItem.key === item.key);\n };\n const filterSuggestedItems = (filter: string, selectedItems?: IItemProps[] | undefined): IItemProps[] => {\n return filter\n ? getSuggestions().filter(\n item => item.text?.toLowerCase().indexOf(filter.toLowerCase()) === 0 && !listContainsSelectedItems(item, selectedItems),\n )\n : [];\n };\n return (\n <>\n <Label>Transparent items</Label>\n <TagPicker {...props} transparent={props.transparent} onResolveSuggestions={filterSuggestedItems} />\n </>\n );\n}"}},TransparentItems.parameters),ColorfulItems.parameters=Object.assign({storySource:{source:"(props: ITagPickerProps) => {\n const getSuggestions = (): IItemProps[] => {\n const items: IItemProps[] = [];\n for (let i = 1; i < 11; i++) {\n items.push({\n key: `item${i}`,\n text: `Item ${i}`,\n secondaryText: `Item ${i} description`,\n deleteButtonProps: {\n key: `delete_btn${i}`,\n iconProps: {\n iconName: 'Delete'\n }\n },\n itemBackgroundColor: i % 2 === 0 ? '#fccac5' : '#d1d3ff',\n })\n }\n return items;\n }\n const listContainsSelectedItems = (item: IItemProps, selectedItems?: IItemProps[]) => {\n if (!selectedItems || !selectedItems.length || selectedItems.length === 0) {\n return false;\n }\n return selectedItems.some(compareItem => compareItem.key === item.key);\n };\n const filterSuggestedItems = (filter: string, selectedItems?: IItemProps[] | undefined): IItemProps[] => {\n return filter\n ? getSuggestions().filter(\n item => item.text?.toLowerCase().indexOf(filter.toLowerCase()) === 0 && !listContainsSelectedItems(item, selectedItems),\n )\n : [];\n };\n return (\n <>\n <Label>Colorful Items</Label>\n <TagPicker {...props} onResolveSuggestions={filterSuggestedItems} />\n </>\n );\n}"}},ColorfulItems.parameters),ReadOnly.parameters=Object.assign({storySource:{source:"(props: ITagPickerProps) =>\n <>\n <Label>Read only</Label>\n <TagPicker\n {...props}\n readOnly={props.readOnly}\n />\n </>"}},ReadOnly.parameters),ErrorMessage.parameters=Object.assign({storySource:{source:"(props: ITagPickerProps) =>\n <>\n <Label>Native error message</Label>\n <TagPicker\n {...props}\n errorMessage={props.errorMessage} />\n </>"}},ErrorMessage.parameters);var __namedExportsOrder=["ItemButtons","SearchButton","StackedItems","TransparentItems","ColorfulItems","ReadOnly","ErrorMessage"]},"./src/stories/TextField/TextField.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{BasicInformation:function(){return BasicInformation},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var _components_TextField_TextField__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./src/components/TextField/TextField.tsx"),_fluentui_react__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_15__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),react__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./node_modules/react/index.js"),_argTypes__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./src/stories/TextField/argTypes.ts"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_12__.l)(),__webpack_exports__.default={title:"TALXIS React Components/TextField/Basic Information",component:_components_TextField_TextField__WEBPACK_IMPORTED_MODULE_13__.n,argTypes:_argTypes__WEBPACK_IMPORTED_MODULE_14__.P,parameters:{docs:{description:{component:"**TextField** with support for suffix/prefix items, click to copy, input clearing and error messages.\n The suffix/prefix items leverage our extended [**ICommandBarItemProps**](https://developer.microsoft.com/en-us/fluentui#/controls/web/commandbar#ICommandBarItemProps) interface.\n This means each suffix/prefix button can leverage all of [**CommandBar**](https://developer.microsoft.com/en-us/fluentui#/controls/web/commandbar) item customizability. \n Extends [**TextField**](https://developer.microsoft.com/en-us/fluentui#/controls/web/textfield)."}}}};var BasicInformation=function BasicInformation(props){var _useState2=_slicedToArray((0,react__WEBPACK_IMPORTED_MODULE_10__.useState)("TextField value"),2),value=_useState2[0],setValue=_useState2[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_15__._,{children:"Default TextField"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_TextField_TextField__WEBPACK_IMPORTED_MODULE_13__.n,Object.assign({},props,{value:value,onChange:function onChange(e,newValue){return setValue(newValue)}}))]})};BasicInformation.parameters={docs:{source:{type:"code"}}},BasicInformation.parameters=Object.assign({storySource:{source:"(props: ITextFieldProps) => {\n const [value, setValue] = useState<string | undefined>('TextField value');\n return (\n <>\n <Label>Default TextField</Label>\n <TextField {...props}\n value={value}\n onChange={(e, newValue) => setValue(newValue)} />\n </>\n )\n}"}},BasicInformation.parameters);var __namedExportsOrder=["BasicInformation"]},"./src/stories/TextField/TextField_Extensions.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{ClickToCopy:function(){return ClickToCopy},CustomButtons:function(){return CustomButtons},DeleteButton:function(){return DeleteButton},ErrorMessage:function(){return ErrorMessage},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var _components_TextField_TextField__WEBPACK_IMPORTED_MODULE_12__=__webpack_require__("./src/components/TextField/TextField.tsx"),_fluentui_react__WEBPACK_IMPORTED_MODULE_14__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),_argTypes__WEBPACK_IMPORTED_MODULE_13__=__webpack_require__("./src/stories/TextField/argTypes.ts"),react__WEBPACK_IMPORTED_MODULE_10__=__webpack_require__("./node_modules/react/index.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}__webpack_exports__.default={title:"TALXIS React Components/TextField/Extensions",component:_components_TextField_TextField__WEBPACK_IMPORTED_MODULE_12__.n,parameters:{docs:{description:{component:"By using the `prefixItems` and `suffixItems` property, suffix/preffix items will be added to the `TextField`. Each item can also be shown only on hover by using the `showOnlyOnHover` property."}}},argTypes:_argTypes__WEBPACK_IMPORTED_MODULE_13__.P};var CustomButtons=function CustomButtons(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_14__._,{children:"Custom Buttons"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_TextField_TextField__WEBPACK_IMPORTED_MODULE_12__.n,Object.assign({},props,{prefixItems:[{key:"prefix",iconProps:{iconName:"CirclePlus"}}],suffixItems:[{key:"suffix1",iconProps:{iconName:"BeerMug"}},{key:"expand",text:"Expandable",subMenuProps:{items:[{key:"item",text:"Item"}]}}]})),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_14__._,{children:"Hover Custom Buttons"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_TextField_TextField__WEBPACK_IMPORTED_MODULE_12__.n,Object.assign({},props,{prefixItems:[{key:"prefix",showOnlyOnHover:!0,iconProps:{iconName:"CirclePlus"}}],suffixItems:[{key:"suffix1",showOnlyOnHover:!0,iconProps:{iconName:"BeerMug"}},{key:"suffix2",showOnlyOnHover:!0,iconProps:{iconName:"CheckMark"}}]}))]})},ClickToCopy=function ClickToCopy(props){var _React$useState2=_slicedToArray(react__WEBPACK_IMPORTED_MODULE_10__.useState("Copy me!"),2),value=_React$useState2[0],setValue=_React$useState2[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_14__._,{children:"Click To Copy"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_TextField_TextField__WEBPACK_IMPORTED_MODULE_12__.n,Object.assign({},props,{value:value,onChange:function onChange(e,newValue){return setValue(newValue)},clickToCopyProps:{key:"clickToCopy",iconProps:{iconName:"Copy"}}}))]})},DeleteButton=function DeleteButton(props){var _React$useState4=_slicedToArray(react__WEBPACK_IMPORTED_MODULE_10__.useState("Delete me!"),2),value=_React$useState4[0],setValue=_React$useState4[1];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_14__._,{children:"Delete Button"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_TextField_TextField__WEBPACK_IMPORTED_MODULE_12__.n,Object.assign({},props,{value:value,onChange:function onChange(e,newValue){return setValue(newValue)},deleteButtonProps:{key:"delete_btn",onClick:function onClick(){return setValue(void 0)},iconProps:{iconName:"Delete"}}}))]})},ErrorMessage=function ErrorMessage(props){return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.Fragment,{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_14__._,{children:"Native error message"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_11__.jsx)(_components_TextField_TextField__WEBPACK_IMPORTED_MODULE_12__.n,Object.assign({},props,{errorMessage:props.errorMessage}))]})};ClickToCopy.parameters={docs:{description:{story:"By using the `clickToCopyProps` property, a button will appear in TextField suffix that will put the current input text into clipboard when clicked. Can also only be shown on hover by using the `showOnlyOnHover` property."},source:{type:"code"}}},DeleteButton.parameters={docs:{description:{story:"By using the `deleteButtonProps` property, a button will appear in TextField suffix that will clear the input. Can also only be shown on hover by using the `showOnlyOnHover` property."},source:{type:"code"}}},CustomButtons.parameters={docs:{description:{story:"By using the `prefixItems` and `suffixItems` property, suffix/preffix items will be added to the `TextField`. Each item can be also only shown on hover using the `showOnlyOnHover` property. You can also use the `order` property to specify the order of the items. This property also applies to native buttons like delete or click to copy. See Command Bar for more information."},source:{type:"code"}}},ErrorMessage.parameters={docs:{description:{story:"By using the `errorMessage` property, an error message will appear under the `TextField`."},source:{type:"code"}}},ErrorMessage.args={errorMessage:"TextField error message"},CustomButtons.parameters=Object.assign({storySource:{source:"(props: ITextFieldProps) =>\n <>\n <Label>Custom Buttons</Label>\n <TextField\n {...props}\n prefixItems={\n [\n {\n key: 'prefix',\n iconProps: {\n iconName: 'CirclePlus'\n }\n },\n ]\n }\n suffixItems={[\n {\n key: 'suffix1',\n iconProps: {\n iconName: 'BeerMug'\n }\n },\n {\n key: 'expand',\n text: 'Expandable',\n subMenuProps: {\n items: [\n {\n key: 'item',\n text: 'Item',\n }\n ]\n }\n }\n ]} />\n <Label>Hover Custom Buttons</Label>\n <TextField\n {...props}\n prefixItems={\n [\n {\n key: 'prefix',\n showOnlyOnHover: true,\n iconProps: {\n iconName: 'CirclePlus'\n }\n },\n ]\n }\n suffixItems={[\n {\n key: 'suffix1',\n showOnlyOnHover: true,\n iconProps: {\n iconName: 'BeerMug'\n }\n },\n {\n key: 'suffix2',\n showOnlyOnHover: true,\n iconProps: {\n iconName: 'CheckMark'\n }\n }\n ]} />\n </>"}},CustomButtons.parameters),ClickToCopy.parameters=Object.assign({storySource:{source:"(props: ITextFieldProps) => {\n const [value, setValue] = React.useState<string | undefined>('Copy me!');\n return (\n <>\n <Label>Click To Copy</Label>\n <TextField {...props} value={value}\n onChange={(e, newValue) => setValue(newValue)} clickToCopyProps={{\n key: 'clickToCopy',\n iconProps: {\n iconName: 'Copy'\n }\n }} />\n </>\n )\n}"}},ClickToCopy.parameters),DeleteButton.parameters=Object.assign({storySource:{source:"(props: ITextFieldProps) => {\n const [value, setValue] = React.useState<string | undefined>('Delete me!');\n return (\n <>\n <Label>Delete Button</Label>\n <TextField {...props}\n value={value}\n onChange={(e, newValue) => setValue(newValue)}\n deleteButtonProps={{\n key: 'delete_btn',\n onClick: () => setValue(undefined),\n iconProps: {\n iconName: 'Delete'\n }\n }} />\n </>\n )\n}"}},DeleteButton.parameters),ErrorMessage.parameters=Object.assign({storySource:{source:"(props: ITextFieldProps) =>\n <>\n <Label>Native error message</Label>\n <TextField\n {...props}\n errorMessage={props.errorMessage} />\n </>"}},ErrorMessage.parameters);var __namedExportsOrder=["CustomButtons","ClickToCopy","DeleteButton","ErrorMessage"]},"./src/stories/TimePicker/TimePicker.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{BasicInformation:function(){return BasicInformation},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),_components_TimePicker_TimePicker__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/components/TimePicker/TimePicker.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/react/jsx-runtime.js");(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_2__.l)(),__webpack_exports__.default={title:"TALXIS React Components/TimePicker/Basic Information",component:_components_TimePicker_TimePicker__WEBPACK_IMPORTED_MODULE_3__.j,parameters:{docs:{description:{component:"**TimePicker** with support for error messages, borderless and read only mode.\n Extends [**TimePicker**](https://developer.microsoft.com/en-us/fluentui#/controls/web/TimePicker)."}}},argTypes:{disabled:{description:"Disables the component",type:"boolean"},errorMessage:{type:"string"},messageBarProps:{control:!1}}};var BasicInformation=function BasicInformation(props){return(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)(_fluentui_react__WEBPACK_IMPORTED_MODULE_4__._,{children:"Default TimePicker"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components_TimePicker_TimePicker__WEBPACK_IMPORTED_MODULE_3__.j,Object.assign({},props))]})};BasicInformation.parameters={docs:{source:{type:"code"}}},BasicInformation.parameters=Object.assign({storySource:{source:"(props: ITimePickerProps) =>\n <>\n <Label>Default TimePicker</Label>\n <TimePicker {...props} />\n </>"}},BasicInformation.parameters);var __namedExportsOrder=["BasicInformation"];try{BasicInformation.displayName="BasicInformation",BasicInformation.__docgenInfo={description:"",displayName:"BasicInformation",props:{readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/TimePicker/TimePicker.stories.tsx#BasicInformation"]={docgenInfo:BasicInformation.__docgenInfo,name:"BasicInformation",path:"src/stories/TimePicker/TimePicker.stories.tsx#BasicInformation"})}catch(__react_docgen_typescript_loader_error){}},"./src/stories/TimePicker/TimePicker_Extensions.stories.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{ErrorMessage:function(){return ErrorMessage},ReadOnly:function(){return ReadOnly},__namedExportsOrder:function(){return __namedExportsOrder}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/@fluentui/font-icons-mdl2/lib/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Label/Label.js"),_components_TimePicker_TimePicker__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./src/components/TimePicker/TimePicker.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/react/jsx-runtime.js");(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_2__.l)(),__webpack_exports__.default={title:"TALXIS React Components/TimePicker/Extensions",component:_components_TimePicker_TimePicker__WEBPACK_IMPORTED_MODULE_3__.j,parameters:{docs:{description:{component:"By using the `readOnly` property, the `TimePicker` will not allow to pick any options."}}},argTypes:{disabled:{description:"Disables the component",type:"boolean"},errorMessage:{type:"string"},messageBarProps:{control:!1}}};var ReadOnly=function ReadOnly(props){return(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)(_fluentui_react__WEBPACK_IMPORTED_MODULE_4__._,{children:"Read only"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components_TimePicker_TimePicker__WEBPACK_IMPORTED_MODULE_3__.j,Object.assign({},props,{readOnly:props.readOnly}))]})},ErrorMessage=function ErrorMessage(props){return(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)(_fluentui_react__WEBPACK_IMPORTED_MODULE_4__._,{children:"Native error message"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components_TimePicker_TimePicker__WEBPACK_IMPORTED_MODULE_3__.j,Object.assign({},props,{errorMessage:props.errorMessage})),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("br",{}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_4__._,{children:"Native error message and custom message bar"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)(_components_TimePicker_TimePicker__WEBPACK_IMPORTED_MODULE_3__.j,Object.assign({},props)),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("br",{})]})};ErrorMessage.parameters={docs:{description:{story:"By using the `errorMessage` property, an error message will appear under the `TimePicker`."},source:{type:"code"}}},ErrorMessage.args={errorMessage:"TimePicker error message"},ReadOnly.args={readOnly:!0},ReadOnly.parameters=Object.assign({storySource:{source:"(props: ITimePickerProps) =>\n <>\n <Label>Read only</Label>\n <TimePicker {...props} readOnly={props.readOnly} />\n </>"}},ReadOnly.parameters),ErrorMessage.parameters=Object.assign({storySource:{source:"(props: ITimePickerProps) =>\n <>\n <Label>Native error message</Label>\n <TimePicker\n {...props}\n errorMessage={props.errorMessage} />\n <br />\n <Label>Native error message and custom message bar</Label>\n <TimePicker\n {...props}\n />\n <br />\n </>"}},ErrorMessage.parameters);var __namedExportsOrder=["ReadOnly","ErrorMessage"];try{ReadOnly.displayName="ReadOnly",ReadOnly.__docgenInfo={description:"",displayName:"ReadOnly",props:{readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/TimePicker/TimePicker_Extensions.stories.tsx#ReadOnly"]={docgenInfo:ReadOnly.__docgenInfo,name:"ReadOnly",path:"src/stories/TimePicker/TimePicker_Extensions.stories.tsx#ReadOnly"})}catch(__react_docgen_typescript_loader_error){}try{ErrorMessage.displayName="ErrorMessage",ErrorMessage.__docgenInfo={description:"",displayName:"ErrorMessage",props:{readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/stories/TimePicker/TimePicker_Extensions.stories.tsx#ErrorMessage"]={docgenInfo:ErrorMessage.__docgenInfo,name:"ErrorMessage",path:"src/stories/TimePicker/TimePicker_Extensions.stories.tsx#ErrorMessage"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Autocomplete/Autocomplete.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{F:function(){return Autocomplete}});__webpack_require__("./node_modules/core-js/modules/es.promise.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.for-each.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.array.concat.js"),__webpack_require__("./node_modules/core-js/modules/es.parse-int.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js"),__webpack_require__("./node_modules/core-js/modules/es.object.define-property.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.async-iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.to-string-tag.js"),__webpack_require__("./node_modules/core-js/modules/es.math.to-string-tag.js"),__webpack_require__("./node_modules/core-js/modules/es.json.to-string-tag.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-prototype-of.js"),__webpack_require__("./node_modules/core-js/modules/es.object.set-prototype-of.js");var Callout=__webpack_require__("./node_modules/@fluentui/react/lib/components/Callout/Callout.js"),react=__webpack_require__("./node_modules/react/index.js"),CommandBar=__webpack_require__("./src/components/CommandBar/CommandBar.tsx"),TextField=__webpack_require__("./src/components/TextField/TextField.tsx"),index_esm=__webpack_require__("./node_modules/react-window/dist/index.esm.js"),Spinner=__webpack_require__("./node_modules/@fluentui/react/lib/components/Spinner/Spinner.js"),TooltipHost=__webpack_require__("./node_modules/@fluentui/react/lib/components/Tooltip/TooltipHost.js"),CommandBarButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/CommandBarButton/CommandBarButton.js"),ContextualMenu_types=__webpack_require__("./node_modules/@fluentui/react/lib/components/ContextualMenu/ContextualMenu.types.js"),lib=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),getItemContainerStyles=function getItemContainerStyles(suggestion,theme){return suggestion.itemType===ContextualMenu_types.n.Header?(0,lib.y0)({pointerEvents:"none",borderTop:"1px solid "+theme.semanticColors.menuDivider}):(0,lib.y0)({":hover":{cursor:"pointer",background:theme.semanticColors.buttonBackgroundHovered}})},Text=__webpack_require__("./node_modules/@fluentui/react/lib/components/Text/Text.js"),useTheme=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");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 _regeneratorRuntime(){_regeneratorRuntime=function _regeneratorRuntime(){return exports};var exports={},Op=Object.prototype,hasOwn=Op.hasOwnProperty,defineProperty=Object.defineProperty||function(obj,key,desc){obj[key]=desc.value},$Symbol="function"==typeof Symbol?Symbol:{},iteratorSymbol=$Symbol.iterator||"@@iterator",asyncIteratorSymbol=$Symbol.asyncIterator||"@@asyncIterator",toStringTagSymbol=$Symbol.toStringTag||"@@toStringTag";function define(obj,key,value){return Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}),obj[key]}try{define({},"")}catch(err){define=function define(obj,key,value){return obj[key]=value}}function wrap(innerFn,outerFn,self,tryLocsList){var protoGenerator=outerFn&&outerFn.prototype instanceof Generator?outerFn:Generator,generator=Object.create(protoGenerator.prototype),context=new Context(tryLocsList||[]);return defineProperty(generator,"_invoke",{value:makeInvokeMethod(innerFn,self,context)}),generator}function tryCatch(fn,obj,arg){try{return{type:"normal",arg:fn.call(obj,arg)}}catch(err){return{type:"throw",arg:err}}}exports.wrap=wrap;var ContinueSentinel={};function Generator(){}function GeneratorFunction(){}function GeneratorFunctionPrototype(){}var IteratorPrototype={};define(IteratorPrototype,iteratorSymbol,(function(){return this}));var getProto=Object.getPrototypeOf,NativeIteratorPrototype=getProto&&getProto(getProto(values([])));NativeIteratorPrototype&&NativeIteratorPrototype!==Op&&hasOwn.call(NativeIteratorPrototype,iteratorSymbol)&&(IteratorPrototype=NativeIteratorPrototype);var Gp=GeneratorFunctionPrototype.prototype=Generator.prototype=Object.create(IteratorPrototype);function defineIteratorMethods(prototype){["next","throw","return"].forEach((function(method){define(prototype,method,(function(arg){return this._invoke(method,arg)}))}))}function AsyncIterator(generator,PromiseImpl){function invoke(method,arg,resolve,reject){var record=tryCatch(generator[method],generator,arg);if("throw"!==record.type){var result=record.arg,value=result.value;return value&&"object"==typeof value&&hasOwn.call(value,"__await")?PromiseImpl.resolve(value.__await).then((function(value){invoke("next",value,resolve,reject)}),(function(err){invoke("throw",err,resolve,reject)})):PromiseImpl.resolve(value).then((function(unwrapped){result.value=unwrapped,resolve(result)}),(function(error){return invoke("throw",error,resolve,reject)}))}reject(record.arg)}var previousPromise;defineProperty(this,"_invoke",{value:function value(method,arg){function callInvokeWithMethodAndArg(){return new PromiseImpl((function(resolve,reject){invoke(method,arg,resolve,reject)}))}return previousPromise=previousPromise?previousPromise.then(callInvokeWithMethodAndArg,callInvokeWithMethodAndArg):callInvokeWithMethodAndArg()}})}function makeInvokeMethod(innerFn,self,context){var state="suspendedStart";return function(method,arg){if("executing"===state)throw new Error("Generator is already running");if("completed"===state){if("throw"===method)throw arg;return doneResult()}for(context.method=method,context.arg=arg;;){var delegate=context.delegate;if(delegate){var delegateResult=maybeInvokeDelegate(delegate,context);if(delegateResult){if(delegateResult===ContinueSentinel)continue;return delegateResult}}if("next"===context.method)context.sent=context._sent=context.arg;else if("throw"===context.method){if("suspendedStart"===state)throw state="completed",context.arg;context.dispatchException(context.arg)}else"return"===context.method&&context.abrupt("return",context.arg);state="executing";var record=tryCatch(innerFn,self,context);if("normal"===record.type){if(state=context.done?"completed":"suspendedYield",record.arg===ContinueSentinel)continue;return{value:record.arg,done:context.done}}"throw"===record.type&&(state="completed",context.method="throw",context.arg=record.arg)}}}function maybeInvokeDelegate(delegate,context){var methodName=context.method,method=delegate.iterator[methodName];if(void 0===method)return context.delegate=null,"throw"===methodName&&delegate.iterator.return&&(context.method="return",context.arg=void 0,maybeInvokeDelegate(delegate,context),"throw"===context.method)||"return"!==methodName&&(context.method="throw",context.arg=new TypeError("The iterator does not provide a '"+methodName+"' method")),ContinueSentinel;var record=tryCatch(method,delegate.iterator,context.arg);if("throw"===record.type)return context.method="throw",context.arg=record.arg,context.delegate=null,ContinueSentinel;var info=record.arg;return info?info.done?(context[delegate.resultName]=info.value,context.next=delegate.nextLoc,"return"!==context.method&&(context.method="next",context.arg=void 0),context.delegate=null,ContinueSentinel):info:(context.method="throw",context.arg=new TypeError("iterator result is not an object"),context.delegate=null,ContinueSentinel)}function pushTryEntry(locs){var entry={tryLoc:locs[0]};1 in locs&&(entry.catchLoc=locs[1]),2 in locs&&(entry.finallyLoc=locs[2],entry.afterLoc=locs[3]),this.tryEntries.push(entry)}function resetTryEntry(entry){var record=entry.completion||{};record.type="normal",delete record.arg,entry.completion=record}function Context(tryLocsList){this.tryEntries=[{tryLoc:"root"}],tryLocsList.forEach(pushTryEntry,this),this.reset(!0)}function values(iterable){if(iterable){var iteratorMethod=iterable[iteratorSymbol];if(iteratorMethod)return iteratorMethod.call(iterable);if("function"==typeof iterable.next)return iterable;if(!isNaN(iterable.length)){var i=-1,next=function next(){for(;++i<iterable.length;)if(hasOwn.call(iterable,i))return next.value=iterable[i],next.done=!1,next;return next.value=void 0,next.done=!0,next};return next.next=next}}return{next:doneResult}}function doneResult(){return{value:void 0,done:!0}}return GeneratorFunction.prototype=GeneratorFunctionPrototype,defineProperty(Gp,"constructor",{value:GeneratorFunctionPrototype,configurable:!0}),defineProperty(GeneratorFunctionPrototype,"constructor",{value:GeneratorFunction,configurable:!0}),GeneratorFunction.displayName=define(GeneratorFunctionPrototype,toStringTagSymbol,"GeneratorFunction"),exports.isGeneratorFunction=function(genFun){var ctor="function"==typeof genFun&&genFun.constructor;return!!ctor&&(ctor===GeneratorFunction||"GeneratorFunction"===(ctor.displayName||ctor.name))},exports.mark=function(genFun){return Object.setPrototypeOf?Object.setPrototypeOf(genFun,GeneratorFunctionPrototype):(genFun.__proto__=GeneratorFunctionPrototype,define(genFun,toStringTagSymbol,"GeneratorFunction")),genFun.prototype=Object.create(Gp),genFun},exports.awrap=function(arg){return{__await:arg}},defineIteratorMethods(AsyncIterator.prototype),define(AsyncIterator.prototype,asyncIteratorSymbol,(function(){return this})),exports.AsyncIterator=AsyncIterator,exports.async=function(innerFn,outerFn,self,tryLocsList,PromiseImpl){void 0===PromiseImpl&&(PromiseImpl=Promise);var iter=new AsyncIterator(wrap(innerFn,outerFn,self,tryLocsList),PromiseImpl);return exports.isGeneratorFunction(outerFn)?iter:iter.next().then((function(result){return result.done?result.value:iter.next()}))},defineIteratorMethods(Gp),define(Gp,toStringTagSymbol,"Generator"),define(Gp,iteratorSymbol,(function(){return this})),define(Gp,"toString",(function(){return"[object Generator]"})),exports.keys=function(val){var object=Object(val),keys=[];for(var key in object)keys.push(key);return keys.reverse(),function next(){for(;keys.length;){var key=keys.pop();if(key in object)return next.value=key,next.done=!1,next}return next.done=!0,next}},exports.values=values,Context.prototype={constructor:Context,reset:function reset(skipTempReset){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(resetTryEntry),!skipTempReset)for(var name in this)"t"===name.charAt(0)&&hasOwn.call(this,name)&&!isNaN(+name.slice(1))&&(this[name]=void 0)},stop:function stop(){this.done=!0;var rootRecord=this.tryEntries[0].completion;if("throw"===rootRecord.type)throw rootRecord.arg;return this.rval},dispatchException:function dispatchException(exception){if(this.done)throw exception;var context=this;function handle(loc,caught){return record.type="throw",record.arg=exception,context.next=loc,caught&&(context.method="next",context.arg=void 0),!!caught}for(var i=this.tryEntries.length-1;i>=0;--i){var entry=this.tryEntries[i],record=entry.completion;if("root"===entry.tryLoc)return handle("end");if(entry.tryLoc<=this.prev){var hasCatch=hasOwn.call(entry,"catchLoc"),hasFinally=hasOwn.call(entry,"finallyLoc");if(hasCatch&&hasFinally){if(this.prev<entry.catchLoc)return handle(entry.catchLoc,!0);if(this.prev<entry.finallyLoc)return handle(entry.finallyLoc)}else if(hasCatch){if(this.prev<entry.catchLoc)return handle(entry.catchLoc,!0)}else{if(!hasFinally)throw new Error("try statement without catch or finally");if(this.prev<entry.finallyLoc)return handle(entry.finallyLoc)}}}},abrupt:function abrupt(type,arg){for(var i=this.tryEntries.length-1;i>=0;--i){var entry=this.tryEntries[i];if(entry.tryLoc<=this.prev&&hasOwn.call(entry,"finallyLoc")&&this.prev<entry.finallyLoc){var finallyEntry=entry;break}}finallyEntry&&("break"===type||"continue"===type)&&finallyEntry.tryLoc<=arg&&arg<=finallyEntry.finallyLoc&&(finallyEntry=null);var record=finallyEntry?finallyEntry.completion:{};return record.type=type,record.arg=arg,finallyEntry?(this.method="next",this.next=finallyEntry.finallyLoc,ContinueSentinel):this.complete(record)},complete:function complete(record,afterLoc){if("throw"===record.type)throw record.arg;return"break"===record.type||"continue"===record.type?this.next=record.arg:"return"===record.type?(this.rval=this.arg=record.arg,this.method="return",this.next="end"):"normal"===record.type&&afterLoc&&(this.next=afterLoc),ContinueSentinel},finish:function finish(finallyLoc){for(var i=this.tryEntries.length-1;i>=0;--i){var entry=this.tryEntries[i];if(entry.finallyLoc===finallyLoc)return this.complete(entry.completion,entry.afterLoc),resetTryEntry(entry),ContinueSentinel}},catch:function _catch(tryLoc){for(var i=this.tryEntries.length-1;i>=0;--i){var entry=this.tryEntries[i];if(entry.tryLoc===tryLoc){var record=entry.completion;if("throw"===record.type){var thrown=record.arg;resetTryEntry(entry)}return thrown}}throw new Error("illegal catch attempt")},delegateYield:function delegateYield(iterable,resultName,nextLoc){return this.delegate={iterator:values(iterable),resultName:resultName,nextLoc:nextLoc},"next"===this.method&&(this.arg=void 0),ContinueSentinel}},exports}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 _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(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<len;i++)arr2[i]=arr[i];return arr2}var getItemObject=function getItemObject(selectedItem){if(selectedItem)return"string"==typeof selectedItem||selectedItem instanceof String?{key:selectedItem,text:selectedItem}:selectedItem},getTextFromItem=function getTextFromItem(selectedItem){if(selectedItem)return"string"==typeof selectedItem||selectedItem instanceof String?selectedItem:selectedItem.text},Autocomplete=react.forwardRef((function(props,ref){var _props$resolveDelay,_props$calloutProps3,_props$calloutProps4,_props$calloutProps5,_props$suggestionsPro5,_props$suggestionsPro6,_props$suggestionsPro7,_props$suggestionsPro8,_props$suggestionsPro9,_props$suggestionsPro10,highlightedItemClass="TALXIS__autocomplete__callout__item--selected",theme=(0,useTheme.F)(),containerRef=react.useRef(null),listContainerRef=react.createRef(),textFieldRef=react.useRef(null),_React$useState2=_slicedToArray(react.useState(getItemObject(props.selectedItem)),2),item=_React$useState2[0],setItem=_React$useState2[1],_React$useState4=_slicedToArray(react.useState(getTextFromItem(props.selectedItem)),2),value=_React$useState4[0],setValue=_React$useState4[1],_React$useState6=_slicedToArray(react.useState(!1),2),calloutVisible=_React$useState6[0],setCalloutVisibility=_React$useState6[1],_React$useState8=_slicedToArray(react.useState([]),2),suggestions=_React$useState8[0],setSuggestions=_React$useState8[1],_React$useState10=_slicedToArray(react.useState(!1),2),isSearching=_React$useState10[0],setIsSearching=_React$useState10[1],_React$useState12=_slicedToArray(react.useState(!1),2),showOnResolveSuggestionsErrorText=_React$useState12[0],setShowOnResolveSuggestionsErrorText=_React$useState12[1],debouncedSearchTerm=useDebounce(value,null!==(_props$resolveDelay=props.resolveDelay)&&void 0!==_props$resolveDelay?_props$resolveDelay:500),debouncedSearchTermRef=react.useRef();react.useImperativeHandle(props.componentRef,(function(){return textFieldRef.current}),[]),react.useEffect((function(){setSuggestions([]),debouncedSearchTermRef.current=debouncedSearchTerm,debouncedSearchTermRef.current||props.showSuggestionsOnFocus?calloutVisible&&onResolveSuggestions(debouncedSearchTerm,!0):setCalloutVisibility(!1)}),[debouncedSearchTerm]),react.useEffect((function(){setItem(getItemObject(props.selectedItem)),setValue(getTextFromItem(props.selectedItem))}),[props.selectedItem]),react.useEffect((function(){var onScroll=function onScroll(){toggleCallout(!1)};return window.addEventListener("scroll",onScroll),function(){window.removeEventListener("scroll",onScroll)}}),[]);var onResolveSuggestions=function(){var _ref=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(searchTerm){var checkSearchTerm,results,_args=arguments;return _regeneratorRuntime().wrap((function _callee$(_context){for(;;)switch(_context.prev=_context.next){case 0:return checkSearchTerm=_args.length>1&&void 0!==_args[1]&&_args[1],setShowOnResolveSuggestionsErrorText(!1),_context.prev=2,_context.next=5,props.onResolveSuggestions(searchTerm);case 5:results=_context.sent,checkSearchTerm?debouncedSearchTerm===debouncedSearchTermRef.current&&(setIsSearching(!1),setSuggestions(results)):(setIsSearching(!1),setSuggestions(results)),_context.next=14;break;case 9:_context.prev=9,_context.t0=_context.catch(2),setIsSearching(!1),setSuggestions([]),setShowOnResolveSuggestionsErrorText(!0);case 14:case"end":return _context.stop()}}),_callee,null,[[2,9]])})));return function onResolveSuggestions(_x2){return _ref.apply(this,arguments)}}(),checkIndex=function checkIndex(){return!!containerRef.current&&(void 0===containerRef.current.currentIndex&&(containerRef.current.currentIndex=-1),!0)},clearIndex=function clearIndex(){checkIndex()&&(containerRef.current.currentIndex=0)},toggleCallout=function toggleCallout(shouldOpen,value){if(!props.readOnly)if(clearIndex(),shouldOpen){if(props.showSuggestionsOnFocus||value&&""!==value)return void setCalloutVisibility(!0)}else setCalloutVisibility(!1)},openCalloutAndGetSuggestions=function openCalloutAndGetSuggestions(){var _textFieldRef$current;clearIndex(),setSuggestions([]),setIsSearching(!0),setCalloutVisibility(!0),null===(_textFieldRef$current=textFieldRef.current)||void 0===_textFieldRef$current||_textFieldRef$current.focus(),onResolveSuggestions(value)},selectItem=function selectItem(item){toggleCallout(!1),props.onChange&&props.onChange(item),props.selectedItem||(setItem(item),setValue(props.clearInputOnSelection?"":null==item?void 0:item.text))},getCommandBarItems=function getCommandBarItems(itemProp){var items=[],item=Object.assign({},itemProp);return item.className=void 0,item.buttons||(item.buttons=[]),item.buttons.forEach((function(button){var className="";button.className&&(className=button.className),button.showOnlyOnHover&&(className+=" hover-only"),button.className=className})),(items=items.concat(item.buttons)).unshift(item),items},onItemHover=function onItemHover(e){var _listContainerRef$cur4;if(checkIndex()){var nextElement=null===(_listContainerRef$cur4=listContainerRef.current)||void 0===_listContainerRef$cur4?void 0:_listContainerRef$cur4.querySelector('[data-index="'+containerRef.current.currentIndex+'"]');null==nextElement||nextElement.classList.remove(highlightedItemClass);var currentIndex=e.currentTarget.getAttribute("data-index");containerRef.current.currentIndex=parseInt(currentIndex)}},renderSuggestionItem=function renderSuggestionItem(suggestion){return suggestion.itemType?(0,jsx_runtime.jsx)("div",{className:"TALXIS__autocomplete__suggestion__non-selectable",children:suggestion.itemType===ContextualMenu_types.n.Header&&(0,jsx_runtime.jsx)(Text.x,{className:"TALXIS__autocomplete__suggestion__non-selectable__header",children:suggestion.text})}):(0,jsx_runtime.jsx)(TooltipHost.G,Object.assign({tooltipProps:{onRenderContent:function onRenderContent(){return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(Text.x,{children:suggestion.text}),suggestion.secondaryText&&(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)("br",{}),(0,jsx_runtime.jsx)(Text.x,{variant:"small",children:suggestion.secondaryText})]})]})}}},suggestion.tooltipHostProps,{children:props.onRenderSuggestionItem?props.onRenderSuggestionItem(suggestion):(0,jsx_runtime.jsx)(CommandBar.X,{items:[],buttonAs:function buttonAs(buttonProps){return getCommandBarButton(buttonProps)},farItems:getCommandBarItems(suggestion)})}))};return(0,jsx_runtime.jsxs)("div",{className:function getClassNames(){var className="TALXIS__autocomplete__root";return calloutVisible&&(className+="--callout-visible"),props.className&&(className+=" "+props.className),className+" "+function getAutocompleteStyles(){return(0,lib.y0)({'[class*="TALXIS__autocomplete__search-btn"][class*="--hover-only"]':{display:"none"},'[class^="TALXIS__autocomplete__root"] .ms-TextField:hover [class*="TALXIS__autocomplete__search-btn"][class*="--hover-only"]':{display:"block"}})}()}(),ref:containerRef,children:[(0,jsx_runtime.jsx)(TextField.n,Object.assign({},props,{value:value||"",onBlur:function onBlur(e){props.onBlur&&props.onBlur(e),!item&&props.onChange&&props.onChange(value),toggleCallout(!1)},onFocus:function onFocus(e){props.onFocus&&props.onFocus(e),props.showSuggestionsOnFocus&&!item&&openCalloutAndGetSuggestions()},autoComplete:"off",prefixItems:props.prefixItems,suffixItems:function getSuffixItems(){var items=[];return props.searchButtonProps&&!props.readOnly&&items.push(Object.assign({},props.searchButtonProps,{className:function getSearchBtnClassNames(){var _props$searchButtonPr2,className="TALXIS__autocomplete__search-btn";return null!==(_props$searchButtonPr2=props.searchButtonProps)&&void 0!==_props$searchButtonPr2&&_props$searchButtonPr2.showOnlyOnHover&&(className+="--hover-only"),props.className&&(className+=" "+props.className),className}(),onClick:function onClick(e){return function onSearchBtnClick(e){var _props$searchButtonPr;null!==(_props$searchButtonPr=props.searchButtonProps)&&void 0!==_props$searchButtonPr&&_props$searchButtonPr.onClick&&props.searchButtonProps.onClick(e),openCalloutAndGetSuggestions()}(e)}})),props.suffixItems&&(items=[].concat(_toConsumableArray(items),_toConsumableArray(props.suffixItems))),items}(),componentRef:textFieldRef,deleteButtonProps:props.deleteButtonProps&&Object.assign({},props.deleteButtonProps,{onClick:function onClearButtonClick(e){var _props$deleteButtonPr;null!==(_props$deleteButtonPr=props.deleteButtonProps)&&void 0!==_props$deleteButtonPr&&_props$deleteButtonPr.onClick&&props.deleteButtonProps.onClick(e),props.onChange&&props.onChange(void 0),props.selectedItem||(setValue(""),toggleCallout(!1),setItem(void 0))}}),onKeyDown:function onKeyDown(e){var highlightItem=function highlightItem(currentIndex,indexOffset){var _listContainerRef$cur,_nextElement$parentEl;containerRef.current.currentIndex=currentIndex+indexOffset;var nextElement=null===(_listContainerRef$cur=listContainerRef.current)||void 0===_listContainerRef$cur?void 0:_listContainerRef$cur.querySelector('[data-index="'+(currentIndex+indexOffset)+'"]');null==nextElement||nextElement.classList.add(highlightedItemClass),null==nextElement||null===(_nextElement$parentEl=nextElement.parentElement)||void 0===_nextElement$parentEl||_nextElement$parentEl.querySelectorAll(":scope > div").forEach((function(element){element!==nextElement&&element.classList.remove(highlightedItemClass)})),function isItemVisibleInCallout(ele){if(ele){var eleTop=ele.offsetTop,eleBottom=eleTop+ele.clientHeight,containerTop=listContainerRef.current.parentElement.scrollTop,containerBottom=containerTop+listContainerRef.current.parentElement.clientHeight;return eleTop>=containerTop&&eleBottom<=containerBottom}return!1}(nextElement)||null==nextElement||nextElement.scrollIntoView(1!=indexOffset)};if(checkIndex()){var currentIndex=containerRef.current.currentIndex;switch(e.key){case"Enter":if(!calloutVisible){openCalloutAndGetSuggestions();break}suggestions[currentIndex]?selectItem(suggestions[currentIndex]):isSearching||toggleCallout(!1);break;case"Tab":suggestions[currentIndex]&&selectItem(suggestions[currentIndex]);break;case"ArrowUp":if(e.preventDefault(),currentIndex>0){var _listContainerRef$cur2,nextElement=null===(_listContainerRef$cur2=listContainerRef.current)||void 0===_listContainerRef$cur2?void 0:_listContainerRef$cur2.querySelector('[data-index="'+(currentIndex-1)+'"]');if(null!=nextElement&&nextElement.querySelector(".TALXIS__autocomplete__suggestion__non-selectable")){currentIndex>1&&highlightItem(currentIndex,-2);break}highlightItem(currentIndex,-1)}break;case"ArrowDown":if(e.preventDefault(),suggestions.length-1>currentIndex){var _listContainerRef$cur3,_nextElement=null===(_listContainerRef$cur3=listContainerRef.current)||void 0===_listContainerRef$cur3?void 0:_listContainerRef$cur3.querySelector('[data-index="'+(currentIndex+1)+'"]');if(null!=_nextElement&&_nextElement.querySelector(".TALXIS__autocomplete__suggestion__non-selectable")){suggestions.length-2>currentIndex&&highlightItem(currentIndex,2);break}highlightItem(currentIndex,1)}break;default:item&&function isCharacterKeyPress(e){return 1===e.key.length}(e)&&setItem(void 0)}}},onChange:function(_onChange){function onChange(_x3,_x4){return _onChange.apply(this,arguments)}return onChange.toString=function(){return _onChange.toString()},onChange}((function(e,newValue){return function onChange(newValue){newValue!==debouncedSearchTermRef.current?(toggleCallout(!0,newValue),setIsSearching(!0)):setIsSearching(!1),setValue(newValue),props.onChange&&props.onChange(newValue)}(newValue)})),className:void 0})),(0,jsx_runtime.jsxs)(Callout.U,Object.assign({},props.calloutProps,{onMouseDown:function onMouseDown(e){e.preventDefault()},onDismiss:function onDismiss(e){var _props$calloutProps2;null!==(_props$calloutProps2=props.calloutProps)&&void 0!==_props$calloutProps2&&_props$calloutProps2.onDismiss&&props.calloutProps.onDismiss(e),toggleCallout(!1)},hidden:(null===(_props$calloutProps3=props.calloutProps)||void 0===_props$calloutProps3?void 0:_props$calloutProps3.hidden)||!calloutVisible,className:function getCalloutClassNames(){var _props$calloutProps,_props$suggestionsPro,className="TALXIS__autocomplete__callout";return null!==(_props$calloutProps=props.calloutProps)&&void 0!==_props$calloutProps&&_props$calloutProps.className&&(className+=" "+props.calloutProps.className),className+" "+function getCalloutStyles(theme,suggestionsContainerWidth){return(0,lib.y0)({width:suggestionsContainerWidth||300,".TALXIS__autocomplete__callout__item--selected":{background:theme.semanticColors.buttonBackgroundHovered},".TALXIS__autocomplete__callout__loading":{margin:"5px",paddingTop:"10px",textAlign:"center"},".TALXIS__autocomplete__callout__not-found-text":{textAlign:"center",display:"block",margin:"5px",color:"grey"},".TALXIS__autocomplete__callout__error-text":{textAlign:"center",display:"block",margin:"5px",color:theme.semanticColors.errorText},".TALXIS__autocomplete__callout__loading > span":{color:theme.palette.themePrimary}})}(theme,null===(_props$suggestionsPro=props.suggestionsProps)||void 0===_props$suggestionsPro?void 0:_props$suggestionsPro.suggestionsContainerWidth)}(),isBeakVisible:(null===(_props$calloutProps4=props.calloutProps)||void 0===_props$calloutProps4?void 0:_props$calloutProps4.isBeakVisible)||!1,gapSpace:(null===(_props$calloutProps5=props.calloutProps)||void 0===_props$calloutProps5?void 0:_props$calloutProps5.gapSpace)||5,target:containerRef.current,children:[(null===(_props$suggestionsPro5=props.suggestionsProps)||void 0===_props$suggestionsPro5?void 0:_props$suggestionsPro5.onRenderHeader)&&props.suggestionsProps.onRenderHeader(),isSearching&&(0,jsx_runtime.jsxs)("div",{className:"TALXIS__autocomplete__callout__loading",children:[(0,jsx_runtime.jsx)(Spinner.$,{}),(0,jsx_runtime.jsx)(Text.x,{variant:"small",children:(null===(_props$suggestionsPro6=props.suggestionsProps)||void 0===_props$suggestionsPro6?void 0:_props$suggestionsPro6.loadingText)||"loading"})]}),0==suggestions.length&&!isSearching&&!showOnResolveSuggestionsErrorText&&(0,jsx_runtime.jsx)(Text.x,{className:"TALXIS__autocomplete__callout__not-found-text",variant:"small",children:(null===(_props$suggestionsPro7=props.suggestionsProps)||void 0===_props$suggestionsPro7?void 0:_props$suggestionsPro7.noResultsFoundText)||"not found"}),0==suggestions.length&&!isSearching&&showOnResolveSuggestionsErrorText&&(0,jsx_runtime.jsx)(Text.x,{className:"TALXIS__autocomplete__callout__error-text",variant:"small",children:(null===(_props$suggestionsPro8=props.suggestionsProps)||void 0===_props$suggestionsPro8?void 0:_props$suggestionsPro8.onResolveSuggestionsErrorText)||"something went wrong"}),(0,jsx_runtime.jsx)(index_esm.t7,{innerRef:listContainerRef,height:function getSuggestionsContainerHeight(){var _props$suggestionsPro3,_props$suggestionsPro4,totalHeight=suggestions.length*((null===(_props$suggestionsPro3=props.suggestionsProps)||void 0===_props$suggestionsPro3?void 0:_props$suggestionsPro3.suggestionRowHeight)||50),maximumHeight=(null===(_props$suggestionsPro4=props.suggestionsProps)||void 0===_props$suggestionsPro4?void 0:_props$suggestionsPro4.suggestionsContainerHeight)||300;return 0==suggestions.length||isSearching?50:"number"==typeof maximumHeight&&totalHeight<maximumHeight?totalHeight:maximumHeight}(),className:function getSuggestionsContainerClassNames(){var _props$suggestionsPro2;return"TALXIS__autocomplete__callout__suggestions "+function getSuggestionsContainerStyles(theme,suggestionRowHeight){return(0,lib.y0)({overflowX:"hidden !important",".ms-Button--commandBar .ms-Button-label":{fontWeight:400},".TALXIS__command-bar .ms-CommandBar":{paddingLeft:"5px",paddingRight:"5px",backgroundColor:"transparent"},".ms-Button--commandBar":{backgroundColor:"transparent"},".ms-CommandBar-primaryCommand":{display:"none"},".ms-CommandBar-secondaryCommand":{width:"100%"},".ms-TooltipHost .ms-OverflowSet-item:first-child .ms-Button--commandBar":{textAlign:"left"},".ms-CommandBar-secondaryCommand .ms-OverflowSet-item:first-child":{flexGrow:1,flexShrink:1,minWidth:"0"},"> div > div:first-child":{borderTop:"none"},".ms-CommandBar":{height:suggestionRowHeight},".TALXIS__autocomplete__suggestion__inner-content":{overflow:"hidden"},".TALXIS__autocomplete__suggestion__non-selectable":{pointerEvents:"none"},".TALXIS__autocomplete__suggestion__non-selectable > .TALXIS__autocomplete__suggestion__non-selectable__header":{paddingLeft:9,fontWeight:600,color:theme.palette.themePrimary,position:"relative",top:10},".TALXIS__autocomplete__suggestion__inner-content > span":{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}})}(theme,null===(_props$suggestionsPro2=props.suggestionsProps)||void 0===_props$suggestionsPro2?void 0:_props$suggestionsPro2.suggestionRowHeight)}(),itemCount:isSearching?0:suggestions.length,itemSize:(null===(_props$suggestionsPro9=props.suggestionsProps)||void 0===_props$suggestionsPro9?void 0:_props$suggestionsPro9.suggestionRowHeight)||50,itemData:suggestions,width:"100%",children:react.memo((function(_ref2){var _containerRef$current,index=_ref2.index,style=_ref2.style;return containerRef.current.currentIndex===index&&suggestions[index].itemType&&suggestions.length-1>index&&(containerRef.current.currentIndex=index+1),(0,jsx_runtime.jsx)("div",{style:style,className:getItemContainerStyles(suggestions[index],theme)+(index===(null===(_containerRef$current=containerRef.current)||void 0===_containerRef$current?void 0:_containerRef$current.currentIndex)?" "+highlightedItemClass:""),onMouseEnter:onItemHover,"data-index":index,onClick:function onClick(){return selectItem(suggestions[index])},children:renderSuggestionItem(suggestions[index])})}),index_esm.wy)}),(null===(_props$suggestionsPro10=props.suggestionsProps)||void 0===_props$suggestionsPro10?void 0:_props$suggestionsPro10.onRenderFooter)&&props.suggestionsProps.onRenderFooter()]}))]})})),useDebounce=function useDebounce(value,delay){var _React$useState14=_slicedToArray(react.useState(value),2),debouncedValue=_React$useState14[0],setDebouncedValue=_React$useState14[1];return react.useEffect((function(){var handler=setTimeout((function(){setDebouncedValue(value)}),delay);return function(){clearTimeout(handler)}}),[value,delay]),debouncedValue},getCommandBarButton=function getCommandBarButton(props){return(0,jsx_runtime.jsx)(CommandBarButton.Q,Object.assign({},props,{onClick:void 0,text:void 0,children:(0,jsx_runtime.jsxs)("div",{className:"TALXIS__autocomplete__suggestion__inner-content",children:[(0,jsx_runtime.jsx)(Text.x,{block:!0,children:props.text}),(0,jsx_runtime.jsx)(Text.x,{block:!0,variant:"small",children:props.secondaryText})]})}))};getCommandBarButton.displayName="getCommandBarButton";try{Autocomplete.displayName="Autocomplete",Autocomplete.__docgenInfo={description:"",displayName:"Autocomplete",props:{selectedItem:{defaultValue:null,description:"Currently selected item. If set, the component will become controlled.",name:"selectedItem",required:!1,type:{name:"string | IAutoCompleteItemProps"}},clearInputOnSelection:{defaultValue:null,description:"Clears the input if item has been selected. Works only in uncontrolled mode, in controlled mode, you need to set the selected item text to a null value.",name:"clearInputOnSelection",required:!1,type:{name:"boolean"}},suggestionsProps:{defaultValue:null,description:"Props that will be passed to the suggestions container.",name:"suggestionsProps",required:!1,type:{name:"ISuggestionsProps"}},calloutProps:{defaultValue:null,description:"Props that will be passed to the suggestions callout.",name:"calloutProps",required:!1,type:{name:"ICalloutProps"}},resolveDelay:{defaultValue:{value:"500"},description:"The delay time in ms before resolving suggestions, which is kicked off when input has been changed. \ne.g. If a second input change happens within the resolveDelay time, the timer will start over. \nOnly until after the timer completes will onResolveSuggestions be called.",name:"resolveDelay",required:!1,type:{name:"number"}},searchButtonProps:{defaultValue:null,description:"Props for the search button.",name:"searchButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},onChange:{defaultValue:null,description:"Fires when currently selected item changes. Returns the current input `string` if no suggestion was selected from the callout.",name:"onChange",required:!1,type:{name:"((item?: string | IAutoCompleteItemProps) => void)"}},showSuggestionsOnFocus:{defaultValue:{value:"false"},description:"Displays the callout on focus (on empty input) if enabled.\nThis is by default disabled to save calls of `onResolveSuggestions`.",name:"showSuggestionsOnFocus",required:!1,type:{name:"boolean"}},onResolveSuggestions:{defaultValue:null,description:"A callback for what should happen when a person types text into the input. \nReturns the current input value to be used as a filter. \nIf used in conjunction with resolveDelay this will only kick off after the delay throttle.",name:"onResolveSuggestions",required:!0,type:{name:"(filter?: string | undefined) => IAutoCompleteItemProps[] | PromiseLike<IAutoCompleteItemProps[]>"}},onRenderSuggestionItem:{defaultValue:null,description:"Function that specifies how an individual suggestion item will appear",name:"onRenderSuggestionItem",required:!1,type:{name:"((item: IAutoCompleteItemProps) => Element)"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Autocomplete/Autocomplete.tsx#Autocomplete"]={docgenInfo:Autocomplete.__docgenInfo,name:"Autocomplete",path:"src/components/Autocomplete/Autocomplete.tsx#Autocomplete"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/ComboBox/ComboBox.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{C:function(){return ComboBox}});__webpack_require__("./node_modules/core-js/modules/es.string.replace.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.array.concat.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.array.map.js"),__webpack_require__("./node_modules/core-js/modules/es.array.find.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js");var react__WEBPACK_IMPORTED_MODULE_16__=__webpack_require__("./node_modules/react/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_19__=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_22__=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/ThemeProvider.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_24__=__webpack_require__("./node_modules/@fluentui/react/lib/components/ComboBox/ComboBox.js"),_hooks_useClassNames__WEBPACK_IMPORTED_MODULE_21__=__webpack_require__("./src/hooks/useClassNames.ts"),_utilities_components_InputButtons_InputButtons__WEBPACK_IMPORTED_MODULE_23__=__webpack_require__("./src/utilities/components/InputButtons/InputButtons.tsx"),_styles__WEBPACK_IMPORTED_MODULE_20__=__webpack_require__("./src/components/ComboBox/styles.ts"),react_dom__WEBPACK_IMPORTED_MODULE_17__=__webpack_require__("./node_modules/react-dom/index.js"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_18__=__webpack_require__("./node_modules/react/jsx-runtime.js");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)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}var ComboBox=react__WEBPACK_IMPORTED_MODULE_16__.forwardRef((function(props,ref){var _props$autofill$title,_props$autofill,_props$options,_props$options$find,_props$readOnly,_props$calloutProps,_props$calloutProps2,_props$calloutProps2$,componentRef=react__WEBPACK_IMPORTED_MODULE_16__.useRef(null),theme=(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_19__.F)(),comboBoxStyles=react__WEBPACK_IMPORTED_MODULE_16__.useMemo((function(){return(0,_styles__WEBPACK_IMPORTED_MODULE_20__.J)(theme)}),[theme]),classNames=(0,_hooks_useClassNames__WEBPACK_IMPORTED_MODULE_21__.o)("Combobox",props,void 0,[comboBoxStyles.root]),calloutClassNames=(0,_hooks_useClassNames__WEBPACK_IMPORTED_MODULE_21__.o)("Combobox__callout",{className:props.className},void 0,[comboBoxStyles.callout]).replace("---underlined","");react__WEBPACK_IMPORTED_MODULE_16__.useEffect((function(){props.prefixItems&&props.prefixItems.length>0?renderPrefixItems():removePrefixItems()}),[props.prefixItems,theme]),react__WEBPACK_IMPORTED_MODULE_16__.useImperativeHandle(props.componentRef,(function(){return componentRef.current}),[]);var removePrefixItems=function removePrefixItems(){var parent=componentRef.current._comboBoxWrapper.current,existingContainer=parent.querySelector(":scope>.talxis-combobox__prefix-buttons");existingContainer&&parent.removeChild(existingContainer)},renderPrefixItems=function renderPrefixItems(){var parent=componentRef.current._comboBoxWrapper.current,container=document.createElement("div");container.setAttribute("class","talxis-combobox__prefix-buttons"),react_dom__WEBPACK_IMPORTED_MODULE_17__.render(react__WEBPACK_IMPORTED_MODULE_16__.createElement(_fluentui_react__WEBPACK_IMPORTED_MODULE_22__.f,{theme:theme,applyTo:"none"},react__WEBPACK_IMPORTED_MODULE_16__.createElement(_utilities_components_InputButtons_InputButtons__WEBPACK_IMPORTED_MODULE_23__.t,{buttons:props.prefixItems,themeOverride:props.affixThemeOverride})),container);var existingContainer=parent.querySelector(":scope>.talxis-combobox__prefix-buttons");existingContainer?existingContainer.replaceWith(container):parent.prepend(container)},getClickToCopyAndDeleteProps=function getClickToCopyAndDeleteProps(props){if(props)return Object.assign({},props,{getValueToCopy:function getValueToCopy(){var _componentRef$current2;return props.getValueToCopy?props.getValueToCopy():null===(_componentRef$current2=componentRef.current)||void 0===_componentRef$current2?void 0:_componentRef$current2.selectedOptions.map((function(option){return option.text})).join("; ")},onClick:function onClick(e){var _props$onClick,_componentRef$current3;null==e||e.preventDefault(),null==e||e.stopPropagation(),null===(_props$onClick=props.onClick)||void 0===_props$onClick||_props$onClick.call(props),null===(_componentRef$current3=componentRef.current)||void 0===_componentRef$current3||_componentRef$current3.focus()}})};return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_18__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_24__.C,Object.assign({},props,{ref:ref,componentRef:componentRef,className:classNames,autofill:Object.assign({},props.autofill,{title:null!==(_props$autofill$title=null===(_props$autofill=props.autofill)||void 0===_props$autofill?void 0:_props$autofill.title)&&void 0!==_props$autofill$title?_props$autofill$title:null===(_props$options=props.options)||void 0===_props$options||null===(_props$options$find=_props$options.find((function(opt){return opt.key==props.selectedKey})))||void 0===_props$options$find?void 0:_props$options$find.text,readOnly:null!==(_props$readOnly=props.readOnly)&&void 0!==_props$readOnly?_props$readOnly:props.disabled},props.readOnly?{onKeyDown:function onKeyDown(){}}:{}),calloutProps:Object.assign({},props.calloutProps,{className:calloutClassNames,styles:Object.assign({},null===(_props$calloutProps=props.calloutProps)||void 0===_props$calloutProps?void 0:_props$calloutProps.styles,{root:Object.assign({},null===(_props$calloutProps2=props.calloutProps)||void 0===_props$calloutProps2||null===(_props$calloutProps2$=_props$calloutProps2.styles)||void 0===_props$calloutProps2$?void 0:_props$calloutProps2$.root,{display:props.readOnly?"none":void 0})})}),iconButtonProps:{href:"#",onClick:function onClick(e){e.preventDefault()},onRenderIcon:function onRenderIcon(){return function onRenderSuffix(){var _props$selectedKey,buttons=[].concat(_toConsumableArray(props.suffixItems?props.suffixItems:[]),_toConsumableArray(props.readOnly?[]:[{key:"chevronDown",iconProps:{iconName:"ChevronDown"},onClick:function onClick(){var _componentRef$current;null===(_componentRef$current=componentRef.current)||void 0===_componentRef$current||_componentRef$current._onComboBoxClick()}}]));return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_18__.jsx)(_utilities_components_InputButtons_InputButtons__WEBPACK_IMPORTED_MODULE_23__.t,{themeOverride:props.affixThemeOverride,disabled:props.disabled,readOnly:props.readOnly,buttons:buttons,value:null===(_props$selectedKey=props.selectedKey)||void 0===_props$selectedKey?void 0:_props$selectedKey.toString(),clickToCopyProps:getClickToCopyAndDeleteProps(props.clickToCopyProps),deleteButtonProps:getClickToCopyAndDeleteProps(props.deleteButtonProps)})}()}}}))}));ComboBox.defaultProps={placeholder:"---"};try{ComboBox.displayName="ComboBox",ComboBox.__docgenInfo={description:"",displayName:"ComboBox",props:{errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/ComboBox/ComboBox.tsx#ComboBox"]={docgenInfo:ComboBox.__docgenInfo,name:"ComboBox",path:"src/components/ComboBox/ComboBox.tsx#ComboBox"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/ComboBox/styles.ts":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{J:function(){return getComboBoxStyles}});var _fluentui_react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),_utilities_components_InputErrorMessage_styles__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./src/utilities/components/InputErrorMessage/styles.ts"),_utilities_styles__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/utilities/styles.ts"),getComboBoxStyles=function getComboBoxStyles(theme){return(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_0__.ZC)({root:{".ms-ComboBox":{display:"flex",paddingRight:0,".talxis-combobox__prefix-buttons":{height:"100%"},'>div>div>div[class*="TALXIS__input-buttons__root"]':{paddingRight:9.5,position:"relative",left:1.5},':has(>div>div>div[class*="TALXIS__input-buttons__root"])':{">div>div":{height:"100%"},paddingLeft:0}},".ms-ComboBox-CaretDown-button":{width:"initial",padding:0,position:"initial"},'&[class*="--underlined"] .ms-ComboBox':{paddingLeft:8},'&[class*="--underlined"]:not([class*="has-error"]):focus-within .ms-ComboBox::after, &[class*="--underlined"]:not([class*="has-error"]) .is-open::after':{animation:_utilities_styles__WEBPACK_IMPORTED_MODULE_1__.b+" 0.2s forwards"},'&[class*="--has-error"][class*="--has-error"], :has([role="alert"]:not(:empty))':{".ms-ComboBox::after":{borderColor:theme.semanticColors.errorText}},'&[class*="--underlined"] .ms-ComboBox::after':{borderTop:"none",borderLeft:"none",borderRight:"none",borderRadius:0},'&[class*="--read-only"]:not([class*="--has-error"]):focus-within .ms-ComboBox::after':{borderColor:theme.semanticColors.disabledBorder},'>[role="alert"]':{animationName:_utilities_components_InputErrorMessage_styles__WEBPACK_IMPORTED_MODULE_2__.VK+", "+_utilities_components_InputErrorMessage_styles__WEBPACK_IMPORTED_MODULE_2__.Y7,animationDuration:"0.367s",animationTimingFunction:"ease-in-out",animationFillMode:"both",WebkitFontSmoothing:"antialiased",fontSize:"12px",fontWeight:400,color:theme.semanticColors.errorText,margin:0,paddingTop:"5px",display:"flex",alignItems:"center"}},callout:{".ms-Checkbox-label":{paddingLeft:8,paddingRight:8},".ms-Checkbox.ms-Checkbox":{paddingLeft:0,paddingRight:0,alignItems:"stretch"}}})}},"./src/components/CommandBar/CommandBar.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{X:function(){return CommandBar}});__webpack_require__("./node_modules/core-js/modules/es.array.map.js"),__webpack_require__("./node_modules/core-js/modules/es.string.replace.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var CommandBar_CommandBar=__webpack_require__("./node_modules/@fluentui/react/lib/components/CommandBar/CommandBar.js"),useClassNames=__webpack_require__("./src/hooks/useClassNames.ts"),react=__webpack_require__("./node_modules/react/index.js"),lib=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js"),CommandBar=function CommandBar(props){var commandBarStyles=(0,react.useMemo)((function(){return function getCommandBarStyles(){return(0,lib.ZC)({root:{".ms-CommandBar":{paddingLeft:0,paddingRight:0,borderBottom:0},'.ms-Button-menuIcon[data-icon-name="ChevronDown"]':{transition:"transform 0.2s"},'.ms-Button-menuIcon.is-expanded[data-icon-name="ChevronDown"]':{transform:"rotate(180deg)"},".ms-Button--commandBar .ms-Image":{width:23,img:{maxWidth:"100%"}},".ms-Icon-imageContainer":{height:"auto"}}})}()}),[]),injectProps=function injectProps(items){null==items||items.map((function(item){var _item$title;item.title=null!==(_item$title=item.title)&&void 0!==_item$title?_item$title:item.text,item.showOnlyOnHover&&(item.className=item.className?item.className+" hover-only":"hover-only")}))};injectProps(props.items),injectProps(props.farItems);var classNames=(0,useClassNames.o)("Command-Bar",{className:props.className}).replace("__root","").replace("--underlined","");return(0,jsx_runtime.jsx)(CommandBar_CommandBar.X,Object.assign({},props,{className:classNames+" "+commandBarStyles.root}))};CommandBar.displayName="CommandBar";try{CommandBar.displayName="CommandBar",CommandBar.__docgenInfo={description:"",displayName:"CommandBar",props:{}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/CommandBar/CommandBar.tsx#CommandBar"]={docgenInfo:CommandBar.__docgenInfo,name:"CommandBar",path:"src/components/CommandBar/CommandBar.tsx#CommandBar"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/DatePicker/DatePicker.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{M:function(){return DatePicker_DatePicker}});__webpack_require__("./node_modules/core-js/modules/es.string.replace.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.array.concat.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js");var react=__webpack_require__("./node_modules/react/index.js"),DatePicker=__webpack_require__("./node_modules/@fluentui/react/lib/components/DatePicker/DatePicker.js"),useTheme=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js"),lib=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),styles=__webpack_require__("./src/utilities/styles.ts"),useClassNames=__webpack_require__("./src/hooks/useClassNames.ts"),InputButtons=__webpack_require__("./src/utilities/components/InputButtons/InputButtons.tsx"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");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)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}var DatePicker_DatePicker=react.forwardRef((function(props,ref){var _props$calloutProps2,_props$calloutProps3,_props$calloutProps3$,_props$calendarProps4,theme=(0,useTheme.F)(),componentRef=react.useRef(null),containerRef=react.useRef(null),textFieldComponentRef=react.useRef(null),datePickerStyles=react.useMemo((function(){return function getDatePickerStyles(theme){return(0,lib.ZC)({root:{".ms-TextField-fieldGroup":{'> i[data-icon-name="Calendar"]':{display:"none"}},'&:not([class*="has-error"]):not([class*="--underlined"]).is-open .ms-TextField-fieldGroup':{borderColor:theme.semanticColors.inputFocusBorderAlt,"::after":{content:"''",position:"absolute",inset:"-1px",border:"2px solid "+theme.semanticColors.inputFocusBorderAlt,borderRadius:"2px",pointerEvents:"none"}},'&[class*="has-error"]:not([class*="--underlined"]).is-open .ms-TextField-fieldGroup':{borderColor:theme.semanticColors.errorText,"::after":{content:"''",position:"absolute",inset:"-1px",border:"2px solid "+theme.semanticColors.errorText,borderRadius:"2px",pointerEvents:"none"}},'&[class*="--underlined"]:focus-within .ms-TextField-wrapper, &[class*="--underlined"].is-open .ms-TextField-wrapper, &[class*="--underlined"]:focus-within .ms-TextField-fieldGroup, &.is-open[class*="--underlined"] .ms-TextField-fieldGroup':{borderBottomColor:"transparent"},'&[class*="--underlined"] .ms-TextField-wrapper::after':{display:"none"},'&[class*="--underlined"]:not([class*="has-error"]):focus-within .ms-TextField-fieldGroup::after, &[class*="--underlined"]:not([class*="has-error"]).is-open .ms-TextField-fieldGroup::after':{content:"''",position:"absolute",inset:"-0px 0px",borderBottom:"2px solid "+theme.semanticColors.inputFocusBorderAlt,borderRadius:"0px",width:"100%",pointerEvents:"none",animation:styles.b+" var(--animDuration, 0.2s) forwards",top:-1},'&[class*="--underlined"][class*="has-error"]:focus-within .ms-TextField-fieldGroup::after, &[class*="--underlined"][class*="has-error"].is-open .ms-TextField-fieldGroup::after':{content:"''",position:"absolute",inset:"-0px 0px",borderBottom:"2px solid "+theme.semanticColors.errorText,borderRadius:"0px",width:"100%",pointerEvents:"none",animation:styles.b+" var(--animDuration, 0.2s) forwards",top:-1},'&[class*="--underlined"] .ms-TextField-fieldGroup::after, &[class*="--underlined"] .ms-TextField-fieldGroup':{borderTop:"none",borderLeft:"none",borderRight:"none",borderRadius:0},'&[class*="--read-only"]&[class*="--read-only"]:not([class*="--has-error"]) .ms-TextField-fieldGroup::after':{borderColor:theme.semanticColors.disabledBorder},".ms-TextField-suffix, .ms-TextField-prefix":{padding:0},".is-disabled":{'i[data-icon-name="Calendar"]':{backgroundColor:theme.semanticColors.buttonBackgroundDisabled,color:theme.semanticColors.buttonTextDisabled}},'[class^="statusMessage"]:empty':{display:"none"},':has([class^="statusMessage"]:not(:empty))':{".ms-TextField-wrapper::after":{borderColor:theme.semanticColors.errorText}}}})}(theme)}),[]),classNames=(0,useClassNames.o)("DatePicker",props,[],[datePickerStyles.root]),calloutClassNames=(0,useClassNames.o)("DatePicker__Callout",{className:props.className},[]).replace("---underlined","");react.useImperativeHandle(props.componentRef,(function(){return componentRef.current}),[]),react.useImperativeHandle(ref,(function(){return containerRef.current}));var tempDisableUnderlineAnimation=function tempDisableUnderlineAnimation(){var _containerRef$current;theme.effects.underlined&&(null===(_containerRef$current=containerRef.current)||void 0===_containerRef$current||_containerRef$current.style.setProperty("--animDuration","0s"),setTimeout((function(){var _containerRef$current2;null===(_containerRef$current2=containerRef.current)||void 0===_containerRef$current2||_containerRef$current2.style.setProperty("--animDuration","0.2s")}),300))},animDecorator=function animDecorator(fn){for(var _len=arguments.length,args=new Array(_len>1?_len-1:0),_key=1;_key<_len;_key++)args[_key-1]=arguments[_key];return tempDisableUnderlineAnimation(),null==fn?void 0:fn.apply(void 0,args)};return(0,jsx_runtime.jsx)(DatePicker.M,Object.assign({},props,{ref:containerRef,onClick:function onClick(e){var _props$onClick,_containerRef$current3;null===(_props$onClick=props.onClick)||void 0===_props$onClick||_props$onClick.call(props,e),null!==(_containerRef$current3=containerRef.current)&&void 0!==_containerRef$current3&&_containerRef$current3.classList.contains("is-open")&&tempDisableUnderlineAnimation()},className:classNames,componentRef:componentRef,openOnClick:!props.readOnly&&props.openOnClick,disableAutoFocus:!!props.readOnly||props.disableAutoFocus,calloutProps:Object.assign({},props.calloutProps,{className:calloutClassNames,onRestoreFocus:function onRestoreFocus(e){var _props$calloutProps;return animDecorator(null===(_props$calloutProps=props.calloutProps)||void 0===_props$calloutProps?void 0:_props$calloutProps.onRestoreFocus,e)},styles:Object.assign({},null===(_props$calloutProps2=props.calloutProps)||void 0===_props$calloutProps2?void 0:_props$calloutProps2.styles,{root:Object.assign({},null===(_props$calloutProps3=props.calloutProps)||void 0===_props$calloutProps3||null===(_props$calloutProps3$=_props$calloutProps3.styles)||void 0===_props$calloutProps3$?void 0:_props$calloutProps3$.root,{display:props.readOnly?"none":void 0})})}),calendarProps:Object.assign({},props.calendarProps,{onDismiss:function onDismiss(){var _props$calendarProps;animDecorator(null===(_props$calendarProps=props.calendarProps)||void 0===_props$calendarProps?void 0:_props$calendarProps.onDismiss)},calendarDayProps:props.keepCalendarOpenAfterDaySelect?{onSelectDate:function onSelectDate(date,selectedDateRangeArray){var _props$calendarProps2,_props$calendarProps3,_props$onSelectDate;null===(_props$calendarProps2=props.calendarProps)||void 0===_props$calendarProps2||null===(_props$calendarProps3=_props$calendarProps2.onSelectDate)||void 0===_props$calendarProps3||_props$calendarProps3.call(_props$calendarProps2,date,selectedDateRangeArray),null===(_props$onSelectDate=props.onSelectDate)||void 0===_props$onSelectDate||_props$onSelectDate.call(props,date)}}:null===(_props$calendarProps4=props.calendarProps)||void 0===_props$calendarProps4?void 0:_props$calendarProps4.calendarDayProps,onSelectDate:function onSelectDate(date,selectedDateRangeArray){var _props$calendarProps5,_props$onSelectDate2;animDecorator(null===(_props$calendarProps5=props.calendarProps)||void 0===_props$calendarProps5?void 0:_props$calendarProps5.onSelectDate,date,selectedDateRangeArray),null===(_props$onSelectDate2=props.onSelectDate)||void 0===_props$onSelectDate2||_props$onSelectDate2.call(props,date)}}),textField:Object.assign({},props.textField,{readOnly:props.readOnly,errorMessage:props.errorMessage,componentRef:textFieldComponentRef,onRenderPrefix:function onRenderPrefix(){var _props$textField3,_props$textField4;return null!==(_props$textField3=props.textField)&&void 0!==_props$textField3&&_props$textField3.onRenderPrefix?null===(_props$textField4=props.textField)||void 0===_props$textField4?void 0:_props$textField4.onRenderPrefix():(0,jsx_runtime.jsx)(InputButtons.t,{readOnly:props.readOnly,buttons:props.prefixItems,disabled:props.disabled})},onRenderSuffix:function onRenderSuffix(){var _props$textField,_props$value,_props$textField2,_props$textField2$onR;if(null!==(_props$textField=props.textField)&&void 0!==_props$textField&&_props$textField.onRenderSuffix)return null===(_props$textField2=props.textField)||void 0===_props$textField2||null===(_props$textField2$onR=_props$textField2.onRenderSuffix)||void 0===_props$textField2$onR?void 0:_props$textField2$onR.call(_props$textField2);var buttons=[].concat(_toConsumableArray(props.suffixItems?props.suffixItems:[]),_toConsumableArray(props.readOnly?[]:[{key:"calendar",disabled:props.readOnly,iconProps:{iconName:"Calendar"},onClick:function onClick(){var _componentRef$current;null===(_componentRef$current=componentRef.current)||void 0===_componentRef$current||_componentRef$current.showDatePickerPopup()}}]));return(0,jsx_runtime.jsx)(InputButtons.t,{buttons:buttons,readOnly:props.readOnly,clickToCopyProps:props.clickToCopyProps?Object.assign({},props.clickToCopyProps,{getValueToCopy:function getValueToCopy(){var _props$clickToCopyPro,_textFieldComponentRe;return null!==(_props$clickToCopyPro=props.clickToCopyProps)&&void 0!==_props$clickToCopyPro&&_props$clickToCopyPro.getValueToCopy?props.clickToCopyProps.getValueToCopy():null===(_textFieldComponentRe=textFieldComponentRef.current)||void 0===_textFieldComponentRe?void 0:_textFieldComponentRe.value},onClick:function onClick(){var _props$clickToCopyPro2,_props$clickToCopyPro3,_textFieldComponentRe2,_textFieldComponentRe3,_textFieldComponentRe4,_textFieldComponentRe5,_textFieldComponentRe6;null===(_props$clickToCopyPro2=props.clickToCopyProps)||void 0===_props$clickToCopyPro2||null===(_props$clickToCopyPro3=_props$clickToCopyPro2.onClick)||void 0===_props$clickToCopyPro3||_props$clickToCopyPro3.call(_props$clickToCopyPro2),null===(_textFieldComponentRe2=textFieldComponentRef.current)||void 0===_textFieldComponentRe2||_textFieldComponentRe2.focus(),null===(_textFieldComponentRe3=textFieldComponentRef.current)||void 0===_textFieldComponentRe3||_textFieldComponentRe3.setSelectionRange(0,null!==(_textFieldComponentRe4=null===(_textFieldComponentRe5=textFieldComponentRef.current)||void 0===_textFieldComponentRe5||null===(_textFieldComponentRe6=_textFieldComponentRe5.value)||void 0===_textFieldComponentRe6?void 0:_textFieldComponentRe6.length)&&void 0!==_textFieldComponentRe4?_textFieldComponentRe4:0)}}):void 0,deleteButtonProps:props.deleteButtonProps?Object.assign({},props.deleteButtonProps,{onClick:function onClick(){var _props$deleteButtonPr,_props$deleteButtonPr2,_textFieldComponentRe7;null===(_props$deleteButtonPr=props.deleteButtonProps)||void 0===_props$deleteButtonPr||null===(_props$deleteButtonPr2=_props$deleteButtonPr.onClick)||void 0===_props$deleteButtonPr2||_props$deleteButtonPr2.call(_props$deleteButtonPr),null===(_textFieldComponentRe7=textFieldComponentRef.current)||void 0===_textFieldComponentRe7||_textFieldComponentRe7.focus()}}):void 0,value:null===(_props$value=props.value)||void 0===_props$value?void 0:_props$value.toString(),disabled:props.disabled})}})}))}));DatePicker_DatePicker.defaultProps={placeholder:"---"};try{DatePicker_DatePicker.displayName="DatePicker",DatePicker_DatePicker.__docgenInfo={description:"",displayName:"DatePicker",props:{value:{defaultValue:null,description:"Default value of the DatePicker, if any",name:"value",required:!0,type:{name:"Date | undefined"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}},keepCalendarOpenAfterDaySelect:{defaultValue:null,description:"",name:"keepCalendarOpenAfterDaySelect",required:!1,type:{name:"boolean"}},onSelectDate:{defaultValue:null,description:"Callback issued when a date is selected",name:"onSelectDate",required:!0,type:{name:"(date: Date | null | undefined) => void"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/DatePicker/DatePicker.tsx#DatePicker"]={docgenInfo:DatePicker_DatePicker.__docgenInfo,name:"DatePicker",path:"src/components/DatePicker/DatePicker.tsx#DatePicker"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Multistage/Multistage.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{t:function(){return Multistage},z:function(){return StageValue}});__webpack_require__("./node_modules/core-js/modules/es.array.find.js"),__webpack_require__("./node_modules/core-js/modules/es.array.find-index.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.array.map.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js");var react=__webpack_require__("./node_modules/react/index.js"),lib=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),Text=__webpack_require__("./node_modules/@fluentui/react/lib/components/Text/Text.js"),IconButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/IconButton/IconButton.js"),TooltipHost=__webpack_require__("./node_modules/@fluentui/react/lib/components/Tooltip/TooltipHost.js"),Icon=__webpack_require__("./node_modules/@fluentui/react/lib/components/Icon/Icon.js");__webpack_require__("./node_modules/core-js/modules/es.symbol.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.date.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.number.constructor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.define-property.js");function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,(arg=descriptor.key,key=void 0,"symbol"==typeof(key=function _toPrimitive(input,hint){if("object"!=typeof input||null===input)return input;var prim=input[Symbol.toPrimitive];if(void 0!==prim){var res=prim.call(input,hint||"default");if("object"!=typeof res)return res;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===hint?String:Number)(input)}(arg,"string"))?key:String(key)),descriptor)}var arg,key}var StageValue,IndicatorService=function(){function IndicatorService(headerProgressRef){var _this=this;!function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}(this,IndicatorService),this._headerProgressRef=void 0,this._setIndicatorBorder=function(){var _this$_headerProgress,_this$_headerProgress2,_this$_headerProgress3,activeElement=null===(_this$_headerProgress=_this._headerProgressRef.current)||void 0===_this$_headerProgress?void 0:_this$_headerProgress.querySelector("[data-current]"),lastChild=null===(_this$_headerProgress2=_this._headerProgressRef.current)||void 0===_this$_headerProgress2?void 0:_this$_headerProgress2.lastElementChild,indicator=null===(_this$_headerProgress3=_this._headerProgressRef.current)||void 0===_this$_headerProgress3?void 0:_this$_headerProgress3.firstElementChild;activeElement!==indicator?activeElement!==lastChild?(indicator.style.setProperty("--active_indicator_border_left","0px"),indicator.style.setProperty("--active_indicator_border_right","0px")):indicator.style.setProperty("--active_indicator_border_right","4px"):indicator.style.setProperty("--active_indicator_border_left","4px")},this._headerProgressRef=headerProgressRef}return function _createClass(Constructor,protoProps,staticProps){return protoProps&&_defineProperties(Constructor.prototype,protoProps),staticProps&&_defineProperties(Constructor,staticProps),Object.defineProperty(Constructor,"prototype",{writable:!1}),Constructor}(IndicatorService,[{key:"setActiveIndicatorPosition",value:function setActiveIndicatorPosition(animation){var _this$_headerProgress4,_this$_headerProgress5,activeElement=null===(_this$_headerProgress4=this._headerProgressRef.current)||void 0===_this$_headerProgress4?void 0:_this$_headerProgress4.querySelector("[data-current]"),indicator=null===(_this$_headerProgress5=this._headerProgressRef.current)||void 0===_this$_headerProgress5?void 0:_this$_headerProgress5.firstElementChild;activeElement?(indicator.style.setProperty("--active_indicator_opacity","1"),this._setIndicatorBorder(),animation&&(indicator.style.setProperty("--active_indicator_animation_length","0.25s"),setTimeout((function(){indicator.style.setProperty("--active_indicator_animation_length","0s")}),250)),indicator.style.setProperty("--left",(null==activeElement?void 0:activeElement.offsetLeft)+"px")):indicator.style.setProperty("--active_indicator_opacity","0")}}]),IndicatorService}(),useTheme=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js"),MessageBar=__webpack_require__("./node_modules/@fluentui/react/lib/components/MessageBar/MessageBar.js"),PrimaryButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/PrimaryButton/PrimaryButton.js"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");function _slicedToArray(arr,i){return function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function _iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function _unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}(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 _arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}!function(StageValue){StageValue.invalid="invalid",StageValue.valid="valid",StageValue.in_progress="in_progress",StageValue.inactive="inactive",StageValue.warning="warning"}(StageValue||(StageValue={}));var Multistage=function Multistage(props){var headerProgressRef=(0,react.useRef)(null),indicatorService=new IndicatorService(headerProgressRef),_useState2=_slicedToArray((0,react.useState)(props.stageStates),2),stageStates=_useState2[0],setStageStates=_useState2[1],theme=(0,useTheme.F)(),rootStyles=(0,react.useMemo)((function(){return function getMultistageStyles(numOfStages,theme,bodyHeight){return"TALXIS__Multistage "+(0,lib.y0)({boxShadow:theme.semanticColors.cardShadow,borderRadius:4,".TALXIS__Multistage__header":{borderBottom:"1px solid "+theme.semanticColors.bodyDivider},".TALXIS__Multistage__header__error":{margin:15,maxWidth:"100%"},".TALXIS__Multistage__header__progress":{display:"grid",position:"relative",gap:5,gridTemplateColumns:"repeat("+numOfStages+", minmax(0, 1fr))",textAlign:"center","> div":{paddingBottom:10,":hover":{backgroundColor:theme.semanticColors.buttonBackgroundHovered,cursor:"pointer"},"> div:first-child":{height:10,backgroundColor:theme.semanticColors.buttonBackgroundPressed},".ms-TooltipHost":{display:"flex",justifyContent:"center",alignItems:"flex-end","span:first-child":{display:"block",fontWeight:600,marginRight:5,marginLeft:5,marginTop:10,overflow:"hidden",whiteSpace:"nowrap",textOverflow:"ellipsis"}},i:{position:"relative",top:-1},":first-child > div:first-child":{borderTopLeftRadius:4,"::after":{content:"''",borderTopLeftRadius:"var(--active_indicator_border_left)",borderTopRightRadius:"var(--active_indicator_border_right)",opacity:"var(--active_indicator_opacity)",transition:"transform var(--active_indicator_animation_length) ease-out",position:"relative",display:"block",width:"100%",height:10,transform:"translateX(var(--left))",pointerEvents:"none",backgroundColor:theme.palette.themePrimary}},":last-child > div:first-child":{borderTopRightRadius:4}},'> div[data-state="valid"]':{"> div:first-child":{backgroundColor:theme.semanticColors.successBackground},".TALXIS__Multistage__header__state-icon":{color:theme.semanticColors.successIcon}},'> div[data-state="invalid"]':{"> div:first-child":{backgroundColor:theme.semanticColors.errorBackground},".TALXIS__Multistage__header__state-icon":{color:theme.semanticColors.errorIcon}},'> div[data-state="warning"]':{"> div:first-child":{backgroundColor:theme.semanticColors.warningBackground},".TALXIS__Multistage__header__state-icon":{color:theme.semanticColors.severeWarningIcon}},'> div[data-state="inactive"], > div:not([data-state])':{".ms-TooltipHost span:first-child":{color:theme.semanticColors.disabledText}},' > div[data-state="in_progress"]':{"> div:first-child":{backgroundColor:theme.palette.themeLight}},".TALXIS__Multistage__header__progress__indicator--hidden":{opacity:0}},".TALXIS__Multistage__body":{height:bodyHeight,overflow:"auto"},".TALXIS__Multistage__body, .TALXIS__Multistage__footer":{padding:15},".TALXIS__Multistage__footer":{display:"flex",".ms-Button--icon":{height:48,width:48},'[data-icon-next="true"] [data-icon-name="SkypeCircleArrow"]':{transform:"rotate(180deg)"},justifyContent:"center",i:{fontSize:32},":has([data-button-submit])":{flexDirection:"column",gap:15,alignItems:"center"}}})}(props.stages.length,theme,props.bodyHeight)}),[props.stages,props.bodyHeight,theme]);(0,react.useEffect)((function(){setStageStates(props.stageStates)}),[props.stageStates]),(0,react.useEffect)((function(){indicatorService.setActiveIndicatorPosition(!0)}),[stageStates]),(0,react.useEffect)((function(){var progressResizeObserver=new ResizeObserver((function(entry){indicatorService.setActiveIndicatorPosition()}));return progressResizeObserver.observe(headerProgressRef.current),function(){progressResizeObserver.disconnect()}}),[]);var getStageState=function getStageState(stage){return stageStates.find((function(state){return state.stageKey===(null==stage?void 0:stage.key)}))},getCurrentStage=function getCurrentStage(){var currentStageState=stageStates.find((function(stage){return stage.stageKey===props.currentStageKey}));return[props.stages.find((function(stage){return stage.key===props.currentStageKey})),currentStageState]},getPreviousStage=function getPreviousStage(){var currentStage=_slicedToArray(getCurrentStage(),1)[0];if(currentStage){var previousStageIndex=props.stages.findIndex((function(stage){return stage.key===(null==currentStage?void 0:currentStage.key)}))-1;return props.stages[previousStageIndex]}},getNextStage=function getNextStage(){var currentStage=_slicedToArray(getCurrentStage(),1)[0];if(currentStage){var nextStageIndex=props.stages.findIndex((function(stage){return stage.key===(null==currentStage?void 0:currentStage.key)}))+1;return props.stages[nextStageIndex]}},submit=function submit(e){var _props$footerProps,_props$footerProps$su;null!==(_props$footerProps=props.footerProps)&&void 0!==_props$footerProps&&null!==(_props$footerProps$su=_props$footerProps.submitButtonProps)&&void 0!==_props$footerProps$su&&_props$footerProps$su.onClick&&props.footerProps.submitButtonProps.onClick(e)},goToStage=function goToStage(nextStage,manualSkip){var nextStageState=getStageState(nextStage),currentStage=_slicedToArray(getCurrentStage(),1)[0],currentStageIndex=props.stages.findIndex((function(stage){return stage.key===(null==currentStage?void 0:currentStage.key)})),nextStageIndex=props.stages.findIndex((function(stage){return stage.key===(null==nextStage?void 0:nextStage.key)}));(null==nextStageState?void 0:nextStageState.value)===StageValue.inactive&&manualSkip||nextStage&&props.onStageChange(nextStage.key,nextStageIndex<currentStageIndex)},goToNextStage=function goToNextStage(e){var _props$footerProps2,_props$footerProps2$n,_props$footerProps3,_props$footerProps4;null===(_props$footerProps2=props.footerProps)||void 0===_props$footerProps2||null===(_props$footerProps2$n=_props$footerProps2.nextButtonProps)||void 0===_props$footerProps2$n||!_props$footerProps2$n.onClick||null!==(_props$footerProps3=props.footerProps)&&void 0!==_props$footerProps3&&_props$footerProps3.onRender||(null===(_props$footerProps4=props.footerProps)||void 0===_props$footerProps4||_props$footerProps4.nextButtonProps.onClick(e));var nextStage=getNextStage();goToStage(nextStage)},goToPreviousStage=function goToPreviousStage(e){var _props$footerProps5,_props$footerProps5$p,_props$footerProps6,_props$footerProps7;null===(_props$footerProps5=props.footerProps)||void 0===_props$footerProps5||null===(_props$footerProps5$p=_props$footerProps5.previousButtonProps)||void 0===_props$footerProps5$p||!_props$footerProps5$p.onClick||null!==(_props$footerProps6=props.footerProps)&&void 0!==_props$footerProps6&&_props$footerProps6.onRender||(null===(_props$footerProps7=props.footerProps)||void 0===_props$footerProps7||_props$footerProps7.previousButtonProps.onClick(e));var previousStage=getPreviousStage();goToStage(previousStage)},getIconName=function getIconName(stage){var stageState=getStageState(stage);return(null==stageState?void 0:stageState.value)===StageValue.invalid?"Cancel":(null==stageState?void 0:stageState.value)===StageValue.valid?"CheckMark":(null==stageState?void 0:stageState.value)===StageValue.warning?"Warning":void 0},renderMessage=function renderMessage(){var _currentStageState$me,_getCurrentStage8=_slicedToArray(getCurrentStage(),2),currentStageState=(_getCurrentStage8[0],_getCurrentStage8[1]),messageProps=null==currentStageState?void 0:currentStageState.messageProps;if(messageProps)return messageProps.onRender?messageProps.onRender():(0,jsx_runtime.jsx)("div",{className:"TALXIS__Multistage__header__error",children:(0,jsx_runtime.jsx)(MessageBar.c,Object.assign({},messageProps.messageBarProps,{children:null===(_currentStageState$me=currentStageState.messageProps)||void 0===_currentStageState$me?void 0:_currentStageState$me.message}))})},showNextButton=function showNextButton(){var _props$footerProps8,_props$footerProps8$n;return!!getNextStage()&&(null===(_props$footerProps8=props.footerProps)||void 0===_props$footerProps8||null===(_props$footerProps8$n=_props$footerProps8.nextButtonProps)||void 0===_props$footerProps8$n||!_props$footerProps8$n.hidden)},showPreviousButton=function showPreviousButton(){var _props$footerProps9,_props$footerProps9$p;return!!getPreviousStage()&&(null===(_props$footerProps9=props.footerProps)||void 0===_props$footerProps9||null===(_props$footerProps9$p=_props$footerProps9.previousButtonProps)||void 0===_props$footerProps9$p||!_props$footerProps9$p.hidden)},showSubmitButton=function showSubmitButton(){var _props$footerProps10,_props$footerProps10$,currentStage=_slicedToArray(getCurrentStage(),1)[0];return!!currentStage&&((null===(_props$footerProps10=props.footerProps)||void 0===_props$footerProps10||null===(_props$footerProps10$=_props$footerProps10.submitButtonProps)||void 0===_props$footerProps10$||!_props$footerProps10$.hidden)&&(null==currentStage?void 0:currentStage.key)===props.stages[props.stages.length-1].key)};return(0,jsx_runtime.jsxs)("div",{className:rootStyles,children:[function renderHeader(){var defaultRenderer=function defaultRenderer(stage){return(0,jsx_runtime.jsxs)(TooltipHost.G,{content:stage.label,children:[(0,jsx_runtime.jsx)(Text.x,{children:stage.label}),stage.key!==props.currentStageKey&&(0,jsx_runtime.jsx)(Icon.J,{className:"TALXIS__Multistage__header__state-icon",iconName:getIconName(stage)})]})};return(0,jsx_runtime.jsxs)("div",{className:"TALXIS__Multistage__header",children:[(0,jsx_runtime.jsx)("div",{ref:headerProgressRef,className:"TALXIS__Multistage__header__progress",children:props.stages.map((function(stage,i){var _getStageState;return(0,jsx_runtime.jsxs)("div",{onClick:function onClick(){return goToStage(stage,!0)},"data-current":stage.key===props.currentStageKey||void 0,"data-state":null===(_getStageState=getStageState(stage))||void 0===_getStageState?void 0:_getStageState.value,children:[(0,jsx_runtime.jsx)("div",{}),stage.onRenderHeader?stage.onRenderHeader(getStageState(stage),(function(){return defaultRenderer(stage)})):defaultRenderer(stage)]},i)}))}),renderMessage()]})}(),function renderStage(){var currentStage=_slicedToArray(getCurrentStage(),1)[0];return(0,jsx_runtime.jsx)("div",{className:"TALXIS__Multistage__body",children:null==currentStage?void 0:currentStage.onRender()})}(),function renderFooter(){var _props$footerProps11,_props$footerProps13,_props$footerProps14,_props$footerProps15,_props$footerProps16,_props$footerProps16$,_props$footerProps12;return null!==(_props$footerProps11=props.footerProps)&&void 0!==_props$footerProps11&&_props$footerProps11.onRender?null===(_props$footerProps12=props.footerProps)||void 0===_props$footerProps12?void 0:_props$footerProps12.onRender({showNextButton:showNextButton(),showPreviousButton:showPreviousButton(),showSubmitButton:showSubmitButton(),goToNextStage:goToNextStage,goToPreviousStage:goToPreviousStage,submit:submit}):(0,jsx_runtime.jsxs)("div",{className:"TALXIS__Multistage__footer",children:[showPreviousButton()&&(0,jsx_runtime.jsx)(IconButton.h,Object.assign({iconProps:{iconName:"SkypeCircleArrow"}},null===(_props$footerProps13=props.footerProps)||void 0===_props$footerProps13?void 0:_props$footerProps13.previousButtonProps,{onClick:goToPreviousStage})),showNextButton()&&(0,jsx_runtime.jsx)(IconButton.h,Object.assign({"data-icon-next":!0,iconProps:{iconName:"SkypeCircleArrow"}},null===(_props$footerProps14=props.footerProps)||void 0===_props$footerProps14?void 0:_props$footerProps14.nextButtonProps,{onClick:goToNextStage})),showSubmitButton()&&(0,jsx_runtime.jsx)(PrimaryButton.K,Object.assign({"data-button-submit":!0},null===(_props$footerProps15=props.footerProps)||void 0===_props$footerProps15?void 0:_props$footerProps15.submitButtonProps,{onClick:function onClick(e){return submit(e)},children:(null===(_props$footerProps16=props.footerProps)||void 0===_props$footerProps16||null===(_props$footerProps16$=_props$footerProps16.submitButtonProps)||void 0===_props$footerProps16$?void 0:_props$footerProps16$.label)||"Submit"}))]})}()]})};Multistage.displayName="Multistage";try{Multistage.displayName="Multistage",Multistage.__docgenInfo={description:"",displayName:"Multistage",props:{currentStageKey:{defaultValue:null,description:"Key of the current stage, matching stage will get highlighted in the header.",name:"currentStageKey",required:!0,type:{name:"string"}},stages:{defaultValue:null,description:"An array of stages.",name:"stages",required:!0,type:{name:"IStage[]"}},stageStates:{defaultValue:null,description:"An array of stageStates.",name:"stageStates",required:!0,type:{name:"IStageState[]"}},onStageChange:{defaultValue:null,description:"Fires every time a stage is about to be changed. This method can be used to implement stage validation.\n@param nextStageKey Key of the stage that the user wants to access\n@param goesToPreviousStage Defines if the stage that the user wants to access is positioned before the currently selected step. \nCan be useful during validation.",name:"onStageChange",required:!0,type:{name:"(nextStageKey: string, goesToPreviousStage: boolean) => void"}},footerProps:{defaultValue:null,description:"Can be used to set the props of next/previous/submit buttons.\nfor more information.",name:"footerProps",required:!1,type:{name:"IMultistageFooterProps"}},bodyHeight:{defaultValue:null,description:'Defines a fixed height of body for all stages. Prevents "jumping" when some stages have different \nheight than other.',name:"bodyHeight",required:!1,type:{name:"string"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Multistage/Multistage.tsx#Multistage"]={docgenInfo:Multistage.__docgenInfo,name:"Multistage",path:"src/components/Multistage/Multistage.tsx#Multistage"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/Spinner/Spinner.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{$:function(){return Spinner}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var ThemeProvider=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/ThemeProvider.js"),Spinner_Spinner=__webpack_require__("./node_modules/@fluentui/react/lib/components/Spinner/Spinner.js"),useTheme=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js"),v9ThemeShim=__webpack_require__("./node_modules/@fluentui/react-migration-v8-v9/lib/components/Theme/v9ThemeShim.js"),v9BrandVariantsShim=__webpack_require__("./node_modules/@fluentui/react-migration-v8-v9/lib/components/Theme/v9BrandVariantsShim.js"),v8ThemeShim=__webpack_require__("./node_modules/@fluentui/react-migration-v8-v9/lib/components/Theme/v8ThemeShim.js"),react=__webpack_require__("./node_modules/react/index.js"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js"),Spinner=function Spinner(props){var v9Theme=function useV9CustomizedV8Theme(){var theme=(0,useTheme.F)();return(0,react.useMemo)((function(){var v9=(0,v9ThemeShim.r)(theme),brand=(0,v9BrandVariantsShim.k)(theme.palette);return(0,v8ThemeShim.R)(brand,v9)}),[])}();return(0,jsx_runtime.jsx)(ThemeProvider.f,{applyTo:"none",theme:v9Theme,children:(0,jsx_runtime.jsx)(Spinner_Spinner.$,Object.assign({},props))})};Spinner.displayName="Spinner";try{Spinner.displayName="Spinner",Spinner.__docgenInfo={description:"",displayName:"Spinner",props:{}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/Spinner/Spinner.tsx#Spinner"]={docgenInfo:Spinner.__docgenInfo,name:"Spinner",path:"src/components/Spinner/Spinner.tsx#Spinner"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/TagPicker/TagPicker.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{U:function(){return TagPicker_TagPicker}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.for-each.js"),__webpack_require__("./node_modules/core-js/modules/es.array.concat.js"),__webpack_require__("./node_modules/core-js/modules/es.promise.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.string.match.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js"),__webpack_require__("./node_modules/core-js/modules/es.object.define-property.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.async-iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.to-string-tag.js"),__webpack_require__("./node_modules/core-js/modules/es.math.to-string-tag.js"),__webpack_require__("./node_modules/core-js/modules/es.json.to-string-tag.js"),__webpack_require__("./node_modules/core-js/modules/es.object.get-prototype-of.js"),__webpack_require__("./node_modules/core-js/modules/es.object.set-prototype-of.js");var react=__webpack_require__("./node_modules/react/index.js"),TagPicker=__webpack_require__("./node_modules/@fluentui/react/lib/components/pickers/TagPicker/TagPicker.js"),CommandBarButton=__webpack_require__("./node_modules/@fluentui/react/lib/components/Button/CommandBarButton/CommandBarButton.js"),CommandBar=__webpack_require__("./src/components/CommandBar/CommandBar.tsx"),Text=__webpack_require__("./node_modules/@fluentui/react/lib/components/Text/Text.js"),lib=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),styles=__webpack_require__("./src/utilities/styles.ts"),useTheme=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js"),useClassNames=__webpack_require__("./src/hooks/useClassNames.ts"),InputErrorMessage=__webpack_require__("./src/utilities/components/InputErrorMessage/InputErrorMessage.tsx"),InputButtons=__webpack_require__("./src/utilities/components/InputButtons/InputButtons.tsx"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js");function _regeneratorRuntime(){_regeneratorRuntime=function _regeneratorRuntime(){return exports};var exports={},Op=Object.prototype,hasOwn=Op.hasOwnProperty,defineProperty=Object.defineProperty||function(obj,key,desc){obj[key]=desc.value},$Symbol="function"==typeof Symbol?Symbol:{},iteratorSymbol=$Symbol.iterator||"@@iterator",asyncIteratorSymbol=$Symbol.asyncIterator||"@@asyncIterator",toStringTagSymbol=$Symbol.toStringTag||"@@toStringTag";function define(obj,key,value){return Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}),obj[key]}try{define({},"")}catch(err){define=function define(obj,key,value){return obj[key]=value}}function wrap(innerFn,outerFn,self,tryLocsList){var protoGenerator=outerFn&&outerFn.prototype instanceof Generator?outerFn:Generator,generator=Object.create(protoGenerator.prototype),context=new Context(tryLocsList||[]);return defineProperty(generator,"_invoke",{value:makeInvokeMethod(innerFn,self,context)}),generator}function tryCatch(fn,obj,arg){try{return{type:"normal",arg:fn.call(obj,arg)}}catch(err){return{type:"throw",arg:err}}}exports.wrap=wrap;var ContinueSentinel={};function Generator(){}function GeneratorFunction(){}function GeneratorFunctionPrototype(){}var IteratorPrototype={};define(IteratorPrototype,iteratorSymbol,(function(){return this}));var getProto=Object.getPrototypeOf,NativeIteratorPrototype=getProto&&getProto(getProto(values([])));NativeIteratorPrototype&&NativeIteratorPrototype!==Op&&hasOwn.call(NativeIteratorPrototype,iteratorSymbol)&&(IteratorPrototype=NativeIteratorPrototype);var Gp=GeneratorFunctionPrototype.prototype=Generator.prototype=Object.create(IteratorPrototype);function defineIteratorMethods(prototype){["next","throw","return"].forEach((function(method){define(prototype,method,(function(arg){return this._invoke(method,arg)}))}))}function AsyncIterator(generator,PromiseImpl){function invoke(method,arg,resolve,reject){var record=tryCatch(generator[method],generator,arg);if("throw"!==record.type){var result=record.arg,value=result.value;return value&&"object"==typeof value&&hasOwn.call(value,"__await")?PromiseImpl.resolve(value.__await).then((function(value){invoke("next",value,resolve,reject)}),(function(err){invoke("throw",err,resolve,reject)})):PromiseImpl.resolve(value).then((function(unwrapped){result.value=unwrapped,resolve(result)}),(function(error){return invoke("throw",error,resolve,reject)}))}reject(record.arg)}var previousPromise;defineProperty(this,"_invoke",{value:function value(method,arg){function callInvokeWithMethodAndArg(){return new PromiseImpl((function(resolve,reject){invoke(method,arg,resolve,reject)}))}return previousPromise=previousPromise?previousPromise.then(callInvokeWithMethodAndArg,callInvokeWithMethodAndArg):callInvokeWithMethodAndArg()}})}function makeInvokeMethod(innerFn,self,context){var state="suspendedStart";return function(method,arg){if("executing"===state)throw new Error("Generator is already running");if("completed"===state){if("throw"===method)throw arg;return doneResult()}for(context.method=method,context.arg=arg;;){var delegate=context.delegate;if(delegate){var delegateResult=maybeInvokeDelegate(delegate,context);if(delegateResult){if(delegateResult===ContinueSentinel)continue;return delegateResult}}if("next"===context.method)context.sent=context._sent=context.arg;else if("throw"===context.method){if("suspendedStart"===state)throw state="completed",context.arg;context.dispatchException(context.arg)}else"return"===context.method&&context.abrupt("return",context.arg);state="executing";var record=tryCatch(innerFn,self,context);if("normal"===record.type){if(state=context.done?"completed":"suspendedYield",record.arg===ContinueSentinel)continue;return{value:record.arg,done:context.done}}"throw"===record.type&&(state="completed",context.method="throw",context.arg=record.arg)}}}function maybeInvokeDelegate(delegate,context){var methodName=context.method,method=delegate.iterator[methodName];if(void 0===method)return context.delegate=null,"throw"===methodName&&delegate.iterator.return&&(context.method="return",context.arg=void 0,maybeInvokeDelegate(delegate,context),"throw"===context.method)||"return"!==methodName&&(context.method="throw",context.arg=new TypeError("The iterator does not provide a '"+methodName+"' method")),ContinueSentinel;var record=tryCatch(method,delegate.iterator,context.arg);if("throw"===record.type)return context.method="throw",context.arg=record.arg,context.delegate=null,ContinueSentinel;var info=record.arg;return info?info.done?(context[delegate.resultName]=info.value,context.next=delegate.nextLoc,"return"!==context.method&&(context.method="next",context.arg=void 0),context.delegate=null,ContinueSentinel):info:(context.method="throw",context.arg=new TypeError("iterator result is not an object"),context.delegate=null,ContinueSentinel)}function pushTryEntry(locs){var entry={tryLoc:locs[0]};1 in locs&&(entry.catchLoc=locs[1]),2 in locs&&(entry.finallyLoc=locs[2],entry.afterLoc=locs[3]),this.tryEntries.push(entry)}function resetTryEntry(entry){var record=entry.completion||{};record.type="normal",delete record.arg,entry.completion=record}function Context(tryLocsList){this.tryEntries=[{tryLoc:"root"}],tryLocsList.forEach(pushTryEntry,this),this.reset(!0)}function values(iterable){if(iterable){var iteratorMethod=iterable[iteratorSymbol];if(iteratorMethod)return iteratorMethod.call(iterable);if("function"==typeof iterable.next)return iterable;if(!isNaN(iterable.length)){var i=-1,next=function next(){for(;++i<iterable.length;)if(hasOwn.call(iterable,i))return next.value=iterable[i],next.done=!1,next;return next.value=void 0,next.done=!0,next};return next.next=next}}return{next:doneResult}}function doneResult(){return{value:void 0,done:!0}}return GeneratorFunction.prototype=GeneratorFunctionPrototype,defineProperty(Gp,"constructor",{value:GeneratorFunctionPrototype,configurable:!0}),defineProperty(GeneratorFunctionPrototype,"constructor",{value:GeneratorFunction,configurable:!0}),GeneratorFunction.displayName=define(GeneratorFunctionPrototype,toStringTagSymbol,"GeneratorFunction"),exports.isGeneratorFunction=function(genFun){var ctor="function"==typeof genFun&&genFun.constructor;return!!ctor&&(ctor===GeneratorFunction||"GeneratorFunction"===(ctor.displayName||ctor.name))},exports.mark=function(genFun){return Object.setPrototypeOf?Object.setPrototypeOf(genFun,GeneratorFunctionPrototype):(genFun.__proto__=GeneratorFunctionPrototype,define(genFun,toStringTagSymbol,"GeneratorFunction")),genFun.prototype=Object.create(Gp),genFun},exports.awrap=function(arg){return{__await:arg}},defineIteratorMethods(AsyncIterator.prototype),define(AsyncIterator.prototype,asyncIteratorSymbol,(function(){return this})),exports.AsyncIterator=AsyncIterator,exports.async=function(innerFn,outerFn,self,tryLocsList,PromiseImpl){void 0===PromiseImpl&&(PromiseImpl=Promise);var iter=new AsyncIterator(wrap(innerFn,outerFn,self,tryLocsList),PromiseImpl);return exports.isGeneratorFunction(outerFn)?iter:iter.next().then((function(result){return result.done?result.value:iter.next()}))},defineIteratorMethods(Gp),define(Gp,toStringTagSymbol,"Generator"),define(Gp,iteratorSymbol,(function(){return this})),define(Gp,"toString",(function(){return"[object Generator]"})),exports.keys=function(val){var object=Object(val),keys=[];for(var key in object)keys.push(key);return keys.reverse(),function next(){for(;keys.length;){var key=keys.pop();if(key in object)return next.value=key,next.done=!1,next}return next.done=!0,next}},exports.values=values,Context.prototype={constructor:Context,reset:function reset(skipTempReset){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(resetTryEntry),!skipTempReset)for(var name in this)"t"===name.charAt(0)&&hasOwn.call(this,name)&&!isNaN(+name.slice(1))&&(this[name]=void 0)},stop:function stop(){this.done=!0;var rootRecord=this.tryEntries[0].completion;if("throw"===rootRecord.type)throw rootRecord.arg;return this.rval},dispatchException:function dispatchException(exception){if(this.done)throw exception;var context=this;function handle(loc,caught){return record.type="throw",record.arg=exception,context.next=loc,caught&&(context.method="next",context.arg=void 0),!!caught}for(var i=this.tryEntries.length-1;i>=0;--i){var entry=this.tryEntries[i],record=entry.completion;if("root"===entry.tryLoc)return handle("end");if(entry.tryLoc<=this.prev){var hasCatch=hasOwn.call(entry,"catchLoc"),hasFinally=hasOwn.call(entry,"finallyLoc");if(hasCatch&&hasFinally){if(this.prev<entry.catchLoc)return handle(entry.catchLoc,!0);if(this.prev<entry.finallyLoc)return handle(entry.finallyLoc)}else if(hasCatch){if(this.prev<entry.catchLoc)return handle(entry.catchLoc,!0)}else{if(!hasFinally)throw new Error("try statement without catch or finally");if(this.prev<entry.finallyLoc)return handle(entry.finallyLoc)}}}},abrupt:function abrupt(type,arg){for(var i=this.tryEntries.length-1;i>=0;--i){var entry=this.tryEntries[i];if(entry.tryLoc<=this.prev&&hasOwn.call(entry,"finallyLoc")&&this.prev<entry.finallyLoc){var finallyEntry=entry;break}}finallyEntry&&("break"===type||"continue"===type)&&finallyEntry.tryLoc<=arg&&arg<=finallyEntry.finallyLoc&&(finallyEntry=null);var record=finallyEntry?finallyEntry.completion:{};return record.type=type,record.arg=arg,finallyEntry?(this.method="next",this.next=finallyEntry.finallyLoc,ContinueSentinel):this.complete(record)},complete:function complete(record,afterLoc){if("throw"===record.type)throw record.arg;return"break"===record.type||"continue"===record.type?this.next=record.arg:"return"===record.type?(this.rval=this.arg=record.arg,this.method="return",this.next="end"):"normal"===record.type&&afterLoc&&(this.next=afterLoc),ContinueSentinel},finish:function finish(finallyLoc){for(var i=this.tryEntries.length-1;i>=0;--i){var entry=this.tryEntries[i];if(entry.finallyLoc===finallyLoc)return this.complete(entry.completion,entry.afterLoc),resetTryEntry(entry),ContinueSentinel}},catch:function _catch(tryLoc){for(var i=this.tryEntries.length-1;i>=0;--i){var entry=this.tryEntries[i];if(entry.tryLoc===tryLoc){var record=entry.completion;if("throw"===record.type){var thrown=record.arg;resetTryEntry(entry)}return thrown}}throw new Error("illegal catch attempt")},delegateYield:function delegateYield(iterable,resultName,nextLoc){return this.delegate={iterator:values(iterable),resultName:resultName,nextLoc:nextLoc},"next"===this.method&&(this.arg=void 0),ContinueSentinel}},exports}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 _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(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(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<len;i++)arr2[i]=arr[i];return arr2}var TagPicker_TagPicker=react.forwardRef((function(props,ref){var _props$inputProps3,par,_useState2=_slicedToArray((0,react.useState)(!0),2),searchBtnVisible=_useState2[0],setSearchBtnVisibility=_useState2[1],containerRef=react.useRef(null),componentRef=react.useRef(null),theme=(0,useTheme.F)(),userTyping=react.useRef(!1),typingDebounce=react.useRef(void 0),additionalParameters=(par=[],props.stackItems&&par.push("--stack"),props.transparent&&par.push("--transparent"),par),tagPickerStyles=react.useMemo((function(){return function getTagPickerStyles(theme){return(0,lib.ZC)({root:{'&:not([class*="--underlined"]) .ms-BasePicker-text::after':{inset:"-1px 0px"},".ms-BasePicker-text":{backgroundColor:theme.semanticColors.inputBackground,borderColor:theme.semanticColors.inputBorder,minWidth:"inherit","::after":{zIndex:1},".ms-BasePicker-itemsWrapper":{overflow:"hidden"},".ms-BasePicker-input":{height:31,paddingLeft:8,fontFamily:theme.fonts.small.fontFamily+" !important"}},'&[class*="--stack"]':{".ms-BasePicker-itemsWrapper":{width:"100%",">div":{width:"100%"},".ms-CommandBar-secondaryCommand":{width:"100%",".ms-OverflowSet-item:first-child":{flexGrow:1}}}},".ms-BasePicker-itemsWrapper":{display:"flex",padding:2.5,gap:2.5,".TALXIS__input-buttons__root, .ms-CommandBar-secondaryCommand":{maxWidth:"100%"},".ms-CommandBar":{height:26,".ms-Button-label":{lineHeight:"1.3"},".ms-OverflowSet-item:first-child":{minWidth:0,flexShrink:1,".ms-Button--commandBar":{cursor:"text",userSelect:"text",backgroundColor:"transparent"},".ms-Button-textContainer":{overflow:"hidden"},".ms-Button-label":{overflow:"hidden",textOverflow:"ellipsis",color:theme.semanticColors.inputText}}}},'&[class*="--read-only"]:has(.ms-BasePicker-itemsWrapper) input':{display:"none"},">div":{display:"flex",".ms-BasePicker":{flexGrow:1,overflow:"hidden"},">.TALXIS__input-buttons__root":{alignSelf:"end",width:0,position:"relative",right:41,bottom:1,height:"calc(var(--input-height, 30px) - 1px)"}},"&:not(:focus-within) .ms-BasePicker-text::after":{display:"none"},'&[class*="--underlined"] .ms-BasePicker-text::after, &[class*="--underlined"] .ms-BasePicker-text':{borderTop:"none",borderLeft:"none",borderRight:"none"},'&[class*="--underlined"] .ms-BasePicker-text':{borderBottomLeftRadius:0},'&[class*="--underlined"]:hover .ms-BasePicker-text':{borderBottomColor:theme.semanticColors.inputBorderHovered},'&[class*="--underlined"]:focus-within .ms-BasePicker-text':{borderBottomColor:"transparent"},'&[class*="--underlined"]:not([class*="--has-error"]) .ms-BasePicker-text::after':{animation:styles.b+" 0.2s forwards",inset:"-0px 0px",borderBottom:"2px solid "+theme.semanticColors.inputFocusBorderAlt,borderRadius:"0px",pointerEvents:"none",position:"absolute"},'&[class*="--read-only"]:not([class*="--has-error"]) .ms-BasePicker-text::after':{borderColor:theme.semanticColors.disabledBorder},'&[class*="--underlined"][class*="--has-error"] .ms-BasePicker-text':{borderRadius:0},'&[class*="--has-error"] .ms-BasePicker-text':{borderColor:theme.semanticColors.errorText,"::after":{borderColor:theme.semanticColors.errorText}}},wrapper:{':has(>[class*="TALXIS__input-buttons__root"]) .ms-BasePicker-input':{paddingRight:45}}})}(theme)}),[theme]),classNames=(0,useClassNames.o)("Tag-Picker",props,additionalParameters,[tagPickerStyles.root]);react.useImperativeHandle(props.componentRef,(function(){return componentRef.current}),[]);var getCommandBarItems=function getCommandBarItems(itemProps){var items=[],item=Object.assign({},itemProps.item);if(item.className=void 0,item.buttons||(item.buttons=[]),item.buttons.forEach((function(button){var className="";button.className&&(className=button.className),button.showOnlyOnHover&&(className+=" hover-only"),button.className=className})),(items=items.concat(item.buttons)).unshift(item),item.deleteButtonProps&&!props.readOnly){var className="";item.deleteButtonProps.className&&(className=item.deleteButtonProps.className),item.deleteButtonProps.showOnlyOnHover&&(className+=" hover-only");var deleteBtn=Object.assign({},item.deleteButtonProps,{className:className,onClick:function onClick(e,contextualItem){var _item$deleteButtonPro;null!==(_item$deleteButtonPro=item.deleteButtonProps)&&void 0!==_item$deleteButtonPro&&_item$deleteButtonPro.onClick&&item.deleteButtonProps.onClick(e,contextualItem),itemProps.onRemoveItem()}});items.push(deleteBtn)}return items},getItemBackground=function getItemBackground(itemProps){return itemProps.item.itemBackgroundColor?itemProps.item.itemBackgroundColor:props.transparent?theme.semanticColors.inputBackground:theme.palette.neutralLight},isNotPickedItemLimitExceeded=function isNotPickedItemLimitExceeded(props,pickedItemsLength){return!props.itemLimit||props.itemLimit>1&&void 0!==pickedItemsLength&&pickedItemsLength<props.itemLimit},areNotAllItemsPicked=function areNotAllItemsPicked(items){var _componentRef$current;return items&&(null===(_componentRef$current=componentRef.current)||void 0===_componentRef$current?void 0:_componentRef$current.items)&&items.length>componentRef.current.items.length},onChange=function(){var _ref=_asyncToGenerator(_regeneratorRuntime().mark((function _callee(items){var _componentRef$current3,_componentRef$current4;return _regeneratorRuntime().wrap((function _callee$(_context){for(;;)switch(_context.prev=_context.next){case 0:if(!props.readOnly){_context.next=2;break}return _context.abrupt("return");case 2:if(props.onChange&&props.onChange(items),(null==items?void 0:items.length)==props.itemLimit?setSearchBtnVisibility(!1):props.searchBtnProps&&setSearchBtnVisibility(!0),!(props.keepCalloutOpen&&isNotPickedItemLimitExceeded(props,null===(_componentRef$current3=componentRef.current)||void 0===_componentRef$current3||null===(_componentRef$current4=_componentRef$current3.items)||void 0===_componentRef$current4?void 0:_componentRef$current4.length)&&areNotAllItemsPicked(items))){_context.next=7;break}return _context.next=7,forceOpenSuggestions(items);case 7:(null==items?void 0:items.length)===props.itemLimit&&componentRef.current.setState({isFocused:!1});case 8:case"end":return _context.stop()}}),_callee)})));return function onChange(_x2){return _ref.apply(this,arguments)}}(),forceOpenSuggestions=function(){var _ref2=_asyncToGenerator(_regeneratorRuntime().mark((function _callee2(items){var _componentRef$current5,input,suggestions;return _regeneratorRuntime().wrap((function _callee2$(_context2){for(;;)switch(_context2.prev=_context2.next){case 0:if(containerRef.current){_context2.next=2;break}return _context2.abrupt("return");case 2:return null==(input=containerRef.current.querySelector("input"))||input.focus(),componentRef.current.suggestionStore.updateSuggestions([]),componentRef.current.setState({suggestionsVisible:!0,suggestionsLoading:!0}),_context2.next=8,props.onResolveSuggestions(null==input?void 0:input.value,items||(null===(_componentRef$current5=componentRef.current)||void 0===_componentRef$current5?void 0:_componentRef$current5.items));case 8:suggestions=_context2.sent,componentRef.current.updateSuggestionsList(suggestions),componentRef.current.setState({isMostRecentlyUsedVisible:!0,suggestionsVisible:!0,moreSuggestionsAvailable:!1});case 11:case"end":return _context2.stop()}}),_callee2)})));return function forceOpenSuggestions(_x3){return _ref2.apply(this,arguments)}}(),onInputKeyDown=function(){var _ref3=_asyncToGenerator(_regeneratorRuntime().mark((function _callee3(e){return _regeneratorRuntime().wrap((function _callee3$(_context3){for(;;)switch(_context3.prev=_context3.next){case 0:if(!props.readOnly){_context3.next=4;break}return e.stopPropagation(),e.preventDefault(),_context3.abrupt("return");case 4:_context3.t0=e.key,_context3.next="Enter"===_context3.t0?7:10;break;case 7:if(componentRef.current.state.suggestionsVisible){_context3.next=10;break}return _context3.next=10,forceOpenSuggestions();case 10:case"end":return _context3.stop()}}),_callee3)})));return function onInputKeyDown(_x4){return _ref3.apply(this,arguments)}}(),onSearchBtnClick=function(){var _ref4=_asyncToGenerator(_regeneratorRuntime().mark((function _callee4(e,item){var _props$searchBtnProps,_props$searchBtnProps2;return _regeneratorRuntime().wrap((function _callee4$(_context4){for(;;)switch(_context4.prev=_context4.next){case 0:return null===(_props$searchBtnProps=props.searchBtnProps)||void 0===_props$searchBtnProps||null===(_props$searchBtnProps2=_props$searchBtnProps.onClick)||void 0===_props$searchBtnProps2||_props$searchBtnProps2.call(_props$searchBtnProps,e),_context4.next=3,forceOpenSuggestions();case 3:case"end":return _context4.stop()}}),_callee4)})));return function onSearchBtnClick(_x5,_x6){return _ref4.apply(this,arguments)}}();return(0,react.useEffect)((function(){var _componentRef$current6,_componentRef$current7;!props.searchBtnProps||props.itemLimit==(null===(_componentRef$current6=componentRef.current)||void 0===_componentRef$current6||null===(_componentRef$current7=_componentRef$current6.items)||void 0===_componentRef$current7?void 0:_componentRef$current7.length)||props.disabled||props.readOnly?setSearchBtnVisibility(!1):setSearchBtnVisibility(!0)}),[props]),(0,react.useEffect)((function(){var _containerRef$current,_containerRef$current2,input=null===(_containerRef$current=containerRef.current)||void 0===_containerRef$current?void 0:_containerRef$current.querySelector("input");input&&(input.clientHeight>0&&(null===(_containerRef$current2=containerRef.current)||void 0===_containerRef$current2||_containerRef$current2.style.setProperty("--input-height",input.clientHeight+"px")))}),[props.selectedItems]),(0,jsx_runtime.jsxs)("div",{onClick:function onClick(){var _componentRef$current8;componentRef.current.setState({isFocused:!0}),null===(_componentRef$current8=componentRef.current)||void 0===_componentRef$current8||_componentRef$current8.focusInput()},ref:containerRef,tabIndex:-1,className:classNames,children:[(0,jsx_runtime.jsxs)("div",{className:tagPickerStyles.wrapper,children:[(0,jsx_runtime.jsx)(TagPicker.U,Object.assign({},props,{className:void 0,ref:ref,componentRef:componentRef,pickerSuggestionsProps:Object.assign({},props.pickerSuggestionsProps,{className:function getSuggestionsClassNames(){var _props$pickerSuggesti,className="TALXIS__tag-picker__suggestions";return null!==(_props$pickerSuggesti=props.pickerSuggestionsProps)&&void 0!==_props$pickerSuggesti&&_props$pickerSuggesti.className&&(className+=" "+props.pickerSuggestionsProps.className),className+" "+function getSuggestionsStyles(){return(0,lib.y0)({".ms-OverflowSet-item:first-child .ms-TooltipHost":{overflow:"hidden",whiteSpace:"nowrap",textOverflow:"ellipsis"},".ms-OverflowSet-item:first-child .ms-TooltipHost > span":{overflow:"hidden",textOverflow:"ellipsis"},".ms-OverflowSet-item:first-child":{flexGrow:1,flexShrink:1,minWidth:"0"},".ms-OverflowSet-item:first-child i":{marginRight:"14px",width:"23px"},".ms-Suggestions-item::after":{border:"none"},".ms-CommandBar":{height:"40px"},".ms-CommandBar-secondaryCommand":{maxWidth:"100%",justifyContent:"space-between",width:"100%"},".TALXIS__command-bar":{maxWidth:"100%",width:"100%"},".ms-Suggestions-itemButton.is-suggested:hover":{background:"none"},".ms-Button-flexContainer":{justifyContent:"space-between"},".ms-CommandBar, .ms-Button--commandBar":{backgroundColor:"inherit"},".ms-Button--action":{paddingLeft:"5px"},".ms-OverflowSet-item:first-child .ms-Button--commandBar img":{marginRight:"10px"},".TALXIS__tag-picker__suggestion__btn--hidden":{display:"none"},".TALXIS__tag-picker__suggestions__wrapper":{display:"flex",flexDirection:"column",textAlign:"left",overflow:"hidden",whiteSpace:"nowrap",">span":{textOverflow:"ellipsis",overflow:"hidden"}}})}()}()}),itemLimit:props.itemLimit,onChange:function(){var _ref5=_asyncToGenerator(_regeneratorRuntime().mark((function _callee5(items){return _regeneratorRuntime().wrap((function _callee5$(_context5){for(;;)switch(_context5.prev=_context5.next){case 0:return _context5.next=2,onChange(items);case 2:return _context5.abrupt("return",_context5.sent);case 3:case"end":return _context5.stop()}}),_callee5)})));return function(_x7){return _ref5.apply(this,arguments)}}(),onResolveSuggestions:props.onResolveSuggestions,createGenericItem:props.createGenericItem,onItemSelected:props.onItemSelected,inputProps:Object.assign({},props.inputProps,{readOnly:props.readOnly,placeholder:(null===(_props$inputProps3=props.inputProps)||void 0===_props$inputProps3?void 0:_props$inputProps3.placeholder)||"---",onBlur:function onInputBlur(e){var _props$inputProps,_props$inputProps2;null!=props&&null!==(_props$inputProps=props.inputProps)&&void 0!==_props$inputProps&&_props$inputProps.onBlur&&(null==props||null===(_props$inputProps2=props.inputProps)||void 0===_props$inputProps2||_props$inputProps2.onBlur(e));if(!!!navigator.userAgent.match(/Version\/[\d\.]+.*Safari/)){var inp=e.target;if(inp.createTextRange){var part=inp.createTextRange();part.move("character",0),part.select()}else inp.setSelectionRange&&inp.setSelectionRange(0,0)}},onKeyDown:onInputKeyDown}),onInputChange:function onInputChange(input){return props.onInputChange&&props.onInputChange(input),userTyping.current=!0,clearTimeout(typingDebounce.current),typingDebounce.current=setTimeout((function(){userTyping.current=!1,componentRef.current.setState({isMostRecentlyUsedVisible:!0,suggestionsVisible:!0,moreSuggestionsAvailable:!1})}),props.resolveDelay),input},selectedItems:props.selectedItems,onRenderItem:function onRenderItem(item){return function onRenderItem(itemProps){return(0,jsx_runtime.jsx)(InputButtons.t,{colors:{backgroundColor:getItemBackground(itemProps),primaryColor:theme.palette.themePrimary,textColor:theme.semanticColors.bodyText},buttons:getCommandBarItems(itemProps)},itemProps.key)}(item)},onRenderSuggestionsItem:function onRenderSuggestionsItem(item,itemProps){return function onRenderSuggestionsItem(item,itemProps){var _item$text;return props.onRenderSuggestionsItem?props.onRenderSuggestionsItem(item,itemProps):(item.buttons||(item.buttons=[]),userTyping.current?(0,jsx_runtime.jsx)(jsx_runtime.Fragment,{}):(0,jsx_runtime.jsx)(CommandBar.X,{onClick:function onClick(e){var _componentRef$current2;props.keepCalloutOpen&&isNotPickedItemLimitExceeded(props,null!==(_componentRef$current2=componentRef.current)&&void 0!==_componentRef$current2&&_componentRef$current2.items?componentRef.current.items.length+1:void 0)&&(e.stopPropagation(),componentRef.current.addItem(item))},title:(null!==(_item$text=item.text)&&void 0!==_item$text?_item$text:"")+(item.secondaryText?" - "+item.secondaryText:""),className:item.suggestionClassName||"",buttonAs:function buttonAs(buttonProps){return getCommandBarButton(buttonProps,!0)},items:[],farItems:[Object.assign({},item)].concat(_toConsumableArray(item.buttons))},item.key))}(item,itemProps)}})),searchBtnVisible&&(0,jsx_runtime.jsx)(InputButtons.t,{buttons:props.searchBtnProps?[Object.assign({},props.searchBtnProps,{onClick:function onClick(e){onSearchBtnClick(e)}})]:void 0})]}),(0,jsx_runtime.jsx)(InputErrorMessage.f,{value:props.errorMessage})]})})),getCommandBarButton=function getCommandBarButton(props,isSuggestion){var _props$iconProps,_props$iconProps2,_props$iconProps3,_props$iconProps4,_props=props;return(0,jsx_runtime.jsx)(CommandBarButton.Q,Object.assign({href:isSuggestion?props.href||"#":props.href,draggable:!1,onMouseUp:function onMouseUp(e){e.preventDefault(),_props.href?window.location.href=_props.href:_props.onClick&&_props.onClick(e)}},_props,{className:(props.className||"")+" "+(props.hideInSuggestions?"TALXIS__tag-picker__suggestion__btn--hidden":""),iconProps:Object.assign({},props.iconProps,{imageProps:null!==(_props$iconProps=props.iconProps)&&void 0!==_props$iconProps&&_props$iconProps.imageProps?Object.assign({},null===(_props$iconProps2=props.iconProps)||void 0===_props$iconProps2?void 0:_props$iconProps2.imageProps,{shouldStartVisible:!0}):void 0}),onClick:function onClick(e){e.preventDefault()},text:void 0,styles:{icon:{color:(null===(_props$iconProps3=props.iconProps)||void 0===_props$iconProps3?void 0:_props$iconProps3.color)&&(null===(_props$iconProps4=props.iconProps)||void 0===_props$iconProps4?void 0:_props$iconProps4.color)}},children:(props.text||props.secondaryText)&&(0,jsx_runtime.jsxs)("div",{className:"TALXIS__tag-picker__suggestions__wrapper",children:[(0,jsx_runtime.jsx)(Text.x,{children:props.text}),props.secondaryText&&isSuggestion&&(0,jsx_runtime.jsx)(Text.x,{variant:"small",children:props.secondaryText})]})}))};getCommandBarButton.displayName="getCommandBarButton";try{TagPicker_TagPicker.displayName="TagPicker",TagPicker_TagPicker.__docgenInfo={description:"",displayName:"TagPicker",props:{onResolveSuggestions:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"onResolveSuggestions",required:!0,type:{name:"(filter: string, selectedItems?: IItemProps[] | undefined) => IItemProps[] | PromiseLike<IItemProps[]>"}},createGenericItem:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"createGenericItem",required:!1,type:{name:"((input: string, ValidationState: ValidationState) => IItemProps | ISuggestionModel<IItemProps>)"}},onRenderSuggestionsItem:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"onRenderSuggestionsItem",required:!1,type:{name:"((props: IItemProps, itemProps: ISuggestionItemProps<IItemProps>) => Element)"}},onRenderItem:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"onRenderItem",required:!1,type:{name:"((props: IPickerItemProps<IItemProps>) => Element)"}},onItemSelected:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"onItemSelected",required:!1,type:{name:"((selectedItem?: IItemProps) => IItemProps | PromiseLike<IItemProps> | null)"}},onChange:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"onChange",required:!1,type:{name:"((items?: IItemProps[]) => void)"}},transparent:{defaultValue:null,description:"Makes the selected items background transparent.",name:"transparent",required:!1,type:{name:"boolean"}},selectedItems:{defaultValue:null,description:"Refer to https://developer.microsoft.com/en-us/fluentui#/controls/web/pickers for additional info about this prop.",name:"selectedItems",required:!1,type:{name:"IItemProps[]"}},stackItems:{defaultValue:null,description:"If set to `true`, each item will take up the entire width of the container.",name:"stackItems",required:!1,type:{name:"boolean"}},searchBtnProps:{defaultValue:null,description:"Props for the search button.",name:"searchBtnProps",required:!1,type:{name:"ISearchButtonProps"}},keepCalloutOpen:{defaultValue:null,description:"If set to `true`, suggestions will stay open, if not all are selected and items are not limited to 1.",name:"keepCalloutOpen",required:!1,type:{name:"boolean"}},readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/TagPicker/TagPicker.tsx#TagPicker"]={docgenInfo:TagPicker_TagPicker.__docgenInfo,name:"TagPicker",path:"src/components/TagPicker/TagPicker.tsx#TagPicker"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/TextField/TextField.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{n:function(){return TextField_TextField}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var useTheme=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js"),TextField=__webpack_require__("./node_modules/@fluentui/react/lib/components/TextField/TextField.js"),useClassNames=__webpack_require__("./src/hooks/useClassNames.ts"),react=__webpack_require__("./node_modules/react/index.js"),lib=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),styles=__webpack_require__("./src/utilities/styles.ts"),InputButtons=__webpack_require__("./src/utilities/components/InputButtons/InputButtons.tsx"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js"),TextField_TextField=(0,react.forwardRef)((function(props,ref){var _props$title,componentRef=(0,react.useRef)(null),theme=(0,useTheme.F)(),textFieldStyles=(0,react.useMemo)((function(){return function getTextFieldStyles(theme){return(0,lib.ZC)({root:{".ms-TextField-suffix, .ms-TextField-prefix":{':has([class*="TALXIS__input-buttons__root"])':{padding:0}},"&.ms-TextField--multiline, &.ms-TextField--multiline>.ms-TextField-wrapper, &.ms-TextField--multiline>.ms-TextField-wrapper>.ms-TextField-fieldGroup":{height:"100%"},'&[class*="--underlined"] .ms-TextField-fieldGroup::after, &[class*="--underlined"] .ms-TextField-fieldGroup':{borderTop:"none",borderLeft:"none",borderRight:"none",borderRadius:0},'&[class*="--underlined"]:focus-within .ms-TextField-fieldGroup':{borderBottom:"1px solid transparent"},'&[class*="--underlined"]:not([class*="--has-error"]):focus-within .ms-TextField-fieldGroup::after':{content:"''",position:"absolute",inset:"-0px 0px",borderBottom:"2px solid "+theme.semanticColors.inputFocusBorderAlt,borderRadius:"0px",width:"100%",pointerEvents:"none",animation:styles.b+" 0.2s forwards"},'&[class*="--read-only"]&[class*="--read-only"]:not([class*="--has-error"]) .ms-TextField-fieldGroup::after':{borderColor:theme.semanticColors.disabledBorder}}})}(theme)}),[theme]),classNames=(0,useClassNames.o)("TextField",props,void 0,[textFieldStyles.root]);(0,react.useImperativeHandle)(props.componentRef,(function(){return componentRef.current}),[]);var shouldRenderCustomAffix=function shouldRenderCustomAffix(type){var _props$prefixItems,_items,_items2,_props$suffixItems,items=null!==(_props$prefixItems=props.prefixItems)&&void 0!==_props$prefixItems?_props$prefixItems:[];"suffix"===type&&(items=null!==(_props$suffixItems=props.suffixItems)&&void 0!==_props$suffixItems?_props$suffixItems:[]);return!("prefix"!==type||!((null===(_items=items)||void 0===_items?void 0:_items.length)>0||props.onRenderPrefix))||!("suffix"!==type||!((null===(_items2=items)||void 0===_items2?void 0:_items2.length)>0||props.clickToCopyProps||props.deleteButtonProps||props.onRenderSuffix))};return(0,jsx_runtime.jsx)(TextField.n,Object.assign({},props,{title:null!==(_props$title=props.title)&&void 0!==_props$title?_props$title:props.value,componentRef:componentRef,className:classNames,onRenderPrefix:shouldRenderCustomAffix("prefix")?function(){return function onRenderPrefix(){return props.onRenderPrefix?props.onRenderPrefix():(0,jsx_runtime.jsx)(InputButtons.t,{readOnly:props.readOnly,buttons:props.prefixItems,value:props.value,disabled:props.disabled})}()}:void 0,onRenderSuffix:shouldRenderCustomAffix("suffix")?function(){return function onRenderSuffix(){return props.onRenderSuffix?props.onRenderSuffix():(0,jsx_runtime.jsx)(InputButtons.t,{readOnly:props.readOnly,buttons:props.suffixItems,clickToCopyProps:props.clickToCopyProps?Object.assign({},props.clickToCopyProps,{getValueToCopy:function getValueToCopy(){var _props$clickToCopyPro;return null!==(_props$clickToCopyPro=props.clickToCopyProps)&&void 0!==_props$clickToCopyPro&&_props$clickToCopyPro.getValueToCopy?props.clickToCopyProps.getValueToCopy():props.value},onClick:function onClick(){var _props$clickToCopyPro2,_props$clickToCopyPro3,_componentRef$current,_componentRef$current2,_props$value$length,_props$value;null===(_props$clickToCopyPro2=props.clickToCopyProps)||void 0===_props$clickToCopyPro2||null===(_props$clickToCopyPro3=_props$clickToCopyPro2.onClick)||void 0===_props$clickToCopyPro3||_props$clickToCopyPro3.call(_props$clickToCopyPro2),null===(_componentRef$current=componentRef.current)||void 0===_componentRef$current||_componentRef$current.focus(),null===(_componentRef$current2=componentRef.current)||void 0===_componentRef$current2||_componentRef$current2.setSelectionRange(0,null!==(_props$value$length=null===(_props$value=props.value)||void 0===_props$value?void 0:_props$value.length)&&void 0!==_props$value$length?_props$value$length:0)}}):void 0,deleteButtonProps:props.deleteButtonProps?Object.assign({},props.deleteButtonProps,{onClick:function onClick(){var _props$deleteButtonPr,_props$deleteButtonPr2,_componentRef$current3;null===(_props$deleteButtonPr=props.deleteButtonProps)||void 0===_props$deleteButtonPr||null===(_props$deleteButtonPr2=_props$deleteButtonPr.onClick)||void 0===_props$deleteButtonPr2||_props$deleteButtonPr2.call(_props$deleteButtonPr),null===(_componentRef$current3=componentRef.current)||void 0===_componentRef$current3||_componentRef$current3.focus()}}):void 0,value:props.value,disabled:props.disabled})}()}:void 0}))}));TextField_TextField.defaultProps={placeholder:"---"};try{TextField_TextField.displayName="TextField",TextField_TextField.__docgenInfo={description:"TextField with support for suffix/prefix items and error messages.\nExtends https://developer.microsoft.com/en-us/fluentui#/controls/web/textfield",displayName:"TextField",props:{value:{defaultValue:null,description:"Current value of the text field. Only provide this if the text field is a controlled component where you\nare maintaining its current state; otherwise, use the `defaultValue` property.",name:"value",required:!0,type:{name:"string | undefined"}},clickToCopyProps:{defaultValue:null,description:"Adds button to suffix that copies the component's value to clipboard.",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}},deleteButtonProps:{defaultValue:null,description:"Adds button to suffix that clears the component's value. If the component is controlled, you still need to clear the value manually by using the `onClick` function",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},errorMessage:{defaultValue:null,description:"Will appear below the component if specified.",name:"errorMessage",required:!1,type:{name:"string"}},hideErrorMessage:{defaultValue:null,description:"Will hide the error message while keeping the error outline.",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},prefixItems:{defaultValue:null,description:"Array of buttons displayed in component's prefix.",name:"prefixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},suffixItems:{defaultValue:null,description:"Array of buttons displayed in component's suffix.",name:"suffixItems",required:!1,type:{name:"ICommandBarItemProps[]"}},affixThemeOverride:{defaultValue:null,description:"Can be used to provide custom theme values for suffix/prefix. Currently implemented only for `ComboBox`.",name:"affixThemeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/TextField/TextField.tsx#TextField"]={docgenInfo:TextField_TextField.__docgenInfo,name:"TextField",path:"src/components/TextField/TextField.tsx#TextField"})}catch(__react_docgen_typescript_loader_error){}},"./src/components/TimePicker/TimePicker.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{j:function(){return TimePicker}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var react__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/react/index.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_7__=__webpack_require__("./node_modules/@fluentui/react/lib/components/TimePicker/TimePicker.js"),_hooks_useClassNames__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/hooks/useClassNames.ts"),_utilities_components_InputButtons_InputButtons__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./src/utilities/components/InputButtons/InputButtons.tsx"),_ComboBox_styles__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./src/components/ComboBox/styles.ts"),_utilities_components_InputErrorMessage_InputErrorMessage__WEBPACK_IMPORTED_MODULE_8__=__webpack_require__("./src/utilities/components/InputErrorMessage/InputErrorMessage.tsx"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/react/jsx-runtime.js"),TimePicker=react__WEBPACK_IMPORTED_MODULE_1__.forwardRef((function(props,ref){var _props$calloutProps,_props$calloutProps2,_props$calloutProps2$,theme=(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_3__.F)(),classNames=(0,_hooks_useClassNames__WEBPACK_IMPORTED_MODULE_4__.o)("TimePicker",props),timePickerStyles=react__WEBPACK_IMPORTED_MODULE_1__.useMemo((function(){return(0,_ComboBox_styles__WEBPACK_IMPORTED_MODULE_5__.J)(theme)}),[]),componentRef=react__WEBPACK_IMPORTED_MODULE_1__.useRef(null);react__WEBPACK_IMPORTED_MODULE_1__.useImperativeHandle(props.componentRef,(function(){return componentRef.current}),[]);return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{className:classNames+" "+timePickerStyles.root,children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_7__.j,Object.assign({},props,{ref:ref,componentRef:componentRef,autofill:Object.assign({},props.autofill,{readOnly:props.readOnly},props.readOnly?{onKeyDown:function onKeyDown(){}}:{}),calloutProps:Object.assign({},props.calloutProps,{styles:Object.assign({},null===(_props$calloutProps=props.calloutProps)||void 0===_props$calloutProps?void 0:_props$calloutProps.styles,{root:Object.assign({},null===(_props$calloutProps2=props.calloutProps)||void 0===_props$calloutProps2||null===(_props$calloutProps2$=_props$calloutProps2.styles)||void 0===_props$calloutProps2$?void 0:_props$calloutProps2$.root,{display:props.readOnly?"none":void 0})})}),iconButtonProps:{href:"#",onClick:function onClick(e){e.preventDefault()},onRenderIcon:function onRenderIcon(){return function onRenderSuffix(){var butttons=[{key:"chevronDown",disabled:props.readOnly,iconProps:{iconName:"ChevronDown"},onClick:function onClick(){var _componentRef$current;props.readOnly||null===(_componentRef$current=componentRef.current)||void 0===_componentRef$current||_componentRef$current._onComboBoxClick()}}];return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_utilities_components_InputButtons_InputButtons__WEBPACK_IMPORTED_MODULE_6__.t,{disabled:props.disabled,readOnly:props.readOnly,buttons:butttons})}()}}})),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_utilities_components_InputErrorMessage_InputErrorMessage__WEBPACK_IMPORTED_MODULE_8__.f,{value:props.errorMessage})]})}));TimePicker.defaultProps={placeholder:"---"};try{TimePicker.displayName="TimePicker",TimePicker.__docgenInfo={description:"",displayName:"TimePicker",props:{readOnly:{defaultValue:null,description:"Will disable any inputs that are part of the component.",name:"readOnly",required:!1,type:{name:"boolean"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/components/TimePicker/TimePicker.tsx#TimePicker"]={docgenInfo:TimePicker.__docgenInfo,name:"TimePicker",path:"src/components/TimePicker/TimePicker.tsx#TimePicker"})}catch(__react_docgen_typescript_loader_error){}},"./src/hooks/useClassNames.ts":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{o:function(){return useClassNames}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.array.map.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),react__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/react/index.js"),useClassNames=function useClassNames(componentName,componentProps,additionalParameters,additionalClassNames){var _theme$effects,theme=(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_3__.F)(),_componentProps=Object.assign({},componentProps),errorMessage=_componentProps.errorMessage,className=_componentProps.className,readOnly=_componentProps.readOnly,result="TALXIS__"+componentName.toLowerCase()+"__root";return errorMessage&&(result+="--has-error"),readOnly&&(result+="--read-only"),null!==(_theme$effects=theme.effects)&&void 0!==_theme$effects&&_theme$effects.underlined&&(result+="--underlined"),componentProps.disabled&&(result+="--disabled"),null==additionalParameters||additionalParameters.map((function(par){result+=par})),className&&(result+=" "+componentProps.className),null==additionalClassNames||additionalClassNames.map((function(className){result+=" "+className})),componentProps.hideErrorMessage&&(result+=" "+(0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)((function(){return getHideErrorMessageStyles()}),[])),result+=" "+(0,react__WEBPACK_IMPORTED_MODULE_2__.useMemo)((function(){return getHoverOnlyStyle()}),[])},getHideErrorMessageStyles=function getHideErrorMessageStyles(){return(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_4__.y0)({'.ms-TextField-errorMessage, &.ms-ComboBox-container > [id*="-error"], .TALXIS__errorMessage':{display:"none"}})},getHoverOnlyStyle=function getHoverOnlyStyle(){return(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_4__.y0)({".hover-only":{display:"none"},"@media (pointer: coarse)":{".hover-only":{display:"block"}},":hover":{".hover-only":{display:"block"}}})}},"./src/stories/Autocomplete/argTypes.ts":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{P:function(){return argTypes}});var argTypes={disabled:{description:"Disables input element",control:{type:"boolean"}},borderless:{description:"Removes the `AutoComplete` border and enables hover animation",control:{type:"boolean"}},readOnly:{description:"Will set the input to read only mode.",control:{type:"boolean"}},underlined:{control:{type:"boolean"}},suffixItems:{control:!1},prefixItems:{control:!1},selectedItem:{control:!1},suggestionsProps:{control:!1},calloutProps:{control:!1},searchButtonProps:{control:!1},deleteButtonProps:{table:{disable:!0}},clickToCopyProps:{table:{disable:!0}},errorMessage:{type:"string"}}},"./src/stories/ComboBox/argTypes.ts":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{P:function(){return argTypes}});var argTypes={disabled:{description:"Disables the component",type:"boolean"},options:{table:{disable:!0},defaultValue:function getDefaultOptions(){for(var options=[],i=1;i<5;i++)options.push({key:"option"+i,text:"Option "+i+"Option "+i+" Option "+i+" Option "+i+" Option "+i+" Option "+i+" Option "+i});return options}()},errorMessage:{type:"string"},defaultSelectedKey:{defaultValue:"option1",table:{disable:!0}}}},"./src/stories/CommandBar/argTypes.ts":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{P:function(){return argTypes}});var argTypes={items:{control:!1,table:{disable:!0},defaultValue:function getDefaultCommandBarItems(){for(var items=[],i=1;i<11;i++)items.push({key:"item"+i,text:"Option "+i,iconProps:{iconName:i%2?"BeerMug":void 0,imageProps:i%3?{src:"https://i.pinimg.com/originals/0c/3b/3a/0c3b3adb1a7530892e55ef36d3be6cb8.png"}:void 0}});return items}()}}},"./src/stories/Multistage/argTypes.ts":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{P:function(){return argTypes}});var argTypes={currentStageKey:{control:!1},stages:{control:!1},stageStates:{control:!1},onStageChange:{control:!1},footerProps:{control:!1},bodyHeight:{control:!1}}},"./src/stories/TextField/argTypes.ts":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{P:function(){return argTypes}});var argTypes={disabled:{description:"Disables input element",control:{type:"boolean"}},borderless:{description:"Removes the `TextField` border and enables hover animation",control:{type:"boolean"}},readOnly:{description:"Will set the input to read only mode.",control:{type:"boolean"}},clickToCopyProps:{control:!1},deleteButtonProps:{control:!1},prefixItems:{control:!1},suffixItems:{control:!1},errorMessage:{type:"string"}}},"./src/utilities/components/InputButtons/InputButtons.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{t:function(){return InputButtons}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/core-js/modules/es.string.replace.js"),__webpack_require__("./node_modules/core-js/modules/es.regexp.exec.js");var useTheme=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js"),ThemeProvider=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/ThemeProvider.js"),lib=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),react=(__webpack_require__("./node_modules/core-js/modules/es.array.concat.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.description.js"),__webpack_require__("./node_modules/core-js/modules/es.object.to-string.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.string.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.iterator.js"),__webpack_require__("./node_modules/core-js/modules/web.dom-collections.iterator.js"),__webpack_require__("./node_modules/core-js/modules/es.array.slice.js"),__webpack_require__("./node_modules/core-js/modules/es.array.from.js"),__webpack_require__("./node_modules/react/index.js"));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(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(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<len;i++)arr2[i]=arr[i];return arr2}var useInputButtons=function useInputButtons(props,theme){var clickToCopyActiveRef=(0,react.useRef)(!1),_useState2=_slicedToArray((0,react.useState)((function(){return Math.random()})),2),setRerender=(_useState2[0],_useState2[1]),_props=Object.assign({},props),clickToCopyProps=_props.clickToCopyProps,deleteButtonProps=_props.deleteButtonProps,value=_props.value,disabled=_props.disabled,buttons=_props.buttons,readOnly=_props.readOnly,deleteButtonVisible=deleteButtonProps&&value&&!readOnly,injectClickToCopyProxy=function injectClickToCopyProxy(button){clickToCopyActiveRef.current&&(button.text=button.successText,button.iconProps={iconName:"Checkmark",styles:{root:{color:theme.semanticColors.successIcon+" !important"}}}),button.onClick||(button.onClick=function(){}),button.onClick=new Proxy(button.onClick,{apply:function apply(target,thisArg){var _clickToCopyProps$get;clickToCopyActiveRef.current=!0;var valueToCopy=null==clickToCopyProps||null===(_clickToCopyProps$get=clickToCopyProps.getValueToCopy)||void 0===_clickToCopyProps$get?void 0:_clickToCopyProps$get.call(clickToCopyProps);return valueToCopy&&navigator.clipboard.writeText(valueToCopy),setTimeout((function(){clickToCopyActiveRef.current=!1,setRerender(Math.random())}),3e3),setRerender(Math.random()),target.apply(thisArg)}})},mergedItems=[];clickToCopyProps&&value&&mergedItems.push(Object.assign({},props.clickToCopyProps,{"data-clickcopy":!0})),deleteButtonVisible&&mergedItems.push(Object.assign({},props.deleteButtonProps)),buttons&&(mergedItems=[].concat(_toConsumableArray(mergedItems),_toConsumableArray(buttons)));var _step,_iterator=function _createForOfIteratorHelper(o,allowArrayLike){var it="undefined"!=typeof Symbol&&o[Symbol.iterator]||o["@@iterator"];if(!it){if(Array.isArray(o)||(it=_unsupportedIterableToArray(o))||allowArrayLike&&o&&"number"==typeof o.length){it&&(o=it);var i=0,F=function F(){};return{s:F,n:function n(){return i>=o.length?{done:!0}:{done:!1,value:o[i++]}},e:function e(_e2){throw _e2},f:F}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var err,normalCompletion=!0,didErr=!1;return{s:function s(){it=it.call(o)},n:function n(){var step=it.next();return normalCompletion=step.done,step},e:function e(_e3){didErr=!0,err=_e3},f:function f(){try{normalCompletion||null==it.return||it.return()}finally{if(didErr)throw err}}}}(mergedItems);try{for(_iterator.s();!(_step=_iterator.n()).done;){var item=_step.value;item.disabled=item.disabled||disabled,item["data-clickcopy"]&&injectClickToCopyProxy(item)}}catch(err){_iterator.e(err)}finally{_iterator.f()}return{items:mergedItems}},CommandBar=__webpack_require__("./src/components/CommandBar/CommandBar.tsx"),ThemeRulesStandard=(__webpack_require__("./node_modules/core-js/modules/es.array.reduce.js"),__webpack_require__("./node_modules/core-js/modules/es.object.entries.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.date.to-primitive.js"),__webpack_require__("./node_modules/core-js/modules/es.number.constructor.js"),__webpack_require__("./node_modules/core-js/modules/es.object.define-property.js"),__webpack_require__("./node_modules/@fluentui/react/lib/components/ThemeGenerator/ThemeRulesStandard.js")),getColorFromString=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/color/getColorFromString.js"),ThemeGenerator=__webpack_require__("./node_modules/@fluentui/react/lib/components/ThemeGenerator/ThemeGenerator.js"),shades=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/color/shades.js"),createTheme=__webpack_require__("./node_modules/@fluentui/theme/lib/createTheme.js");function ThemeDesigner_slicedToArray(arr,i){return function ThemeDesigner_arrayWithHoles(arr){if(Array.isArray(arr))return arr}(arr)||function ThemeDesigner_iterableToArrayLimit(arr,i){var _i=null==arr?null:"undefined"!=typeof Symbol&&arr[Symbol.iterator]||arr["@@iterator"];if(null!=_i){var _s,_e,_x,_r,_arr=[],_n=!0,_d=!1;try{if(_x=(_i=_i.call(arr)).next,0===i){if(Object(_i)!==_i)return;_n=!1}else for(;!(_n=(_s=_x.call(_i)).done)&&(_arr.push(_s.value),_arr.length!==i);_n=!0);}catch(err){_d=!0,_e=err}finally{try{if(!_n&&null!=_i.return&&(_r=_i.return(),Object(_r)!==_r))return}finally{if(_d)throw _e}}return _arr}}(arr,i)||function ThemeDesigner_unsupportedIterableToArray(o,minLen){if(!o)return;if("string"==typeof o)return ThemeDesigner_arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);"Object"===n&&o.constructor&&(n=o.constructor.name);if("Map"===n||"Set"===n)return Array.from(o);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return ThemeDesigner_arrayLikeToArray(o,minLen)}(arr,i)||function ThemeDesigner_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 ThemeDesigner_arrayLikeToArray(arr,len){(null==len||len>arr.length)&&(len=arr.length);for(var i=0,arr2=new Array(len);i<len;i++)arr2[i]=arr[i];return arr2}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||!1,descriptor.configurable=!0,"value"in descriptor&&(descriptor.writable=!0),Object.defineProperty(target,(arg=descriptor.key,key=void 0,"symbol"==typeof(key=function _toPrimitive(input,hint){if("object"!=typeof input||null===input)return input;var prim=input[Symbol.toPrimitive];if(void 0!==prim){var res=prim.call(input,hint||"default");if("object"!=typeof res)return res;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===hint?String:Number)(input)}(arg,"string"))?key:String(key)),descriptor)}var arg,key}var ThemeDesigner=function(){function ThemeDesigner(){!function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor))throw new TypeError("Cannot call a class as a function")}(this,ThemeDesigner)}return function _createClass(Constructor,protoProps,staticProps){return protoProps&&_defineProperties(Constructor.prototype,protoProps),staticProps&&_defineProperties(Constructor,staticProps),Object.defineProperty(Constructor,"prototype",{writable:!1}),Constructor}(ThemeDesigner,null,[{key:"generateTheme",value:function generateTheme(_ref){var primaryColor=_ref.primaryColor,textColor=_ref.textColor,backgroundColor=_ref.backgroundColor,themeRules=(0,ThemeRulesStandard.ep)(),colors={primaryColor:(0,getColorFromString.T)(primaryColor),textColor:(0,getColorFromString.T)(textColor),backgroundColor:(0,getColorFromString.T)(backgroundColor)};ThemeGenerator.b.setSlot(themeRules[ThemeRulesStandard.I[ThemeRulesStandard.I.backgroundColor]],colors.backgroundColor,void 0,false,true);var currentIsDark=(0,shades._T)(themeRules[ThemeRulesStandard.I[ThemeRulesStandard.I.backgroundColor]].color);ThemeGenerator.b.setSlot(themeRules[ThemeRulesStandard.I[ThemeRulesStandard.I.primaryColor]],colors.primaryColor,currentIsDark,false,true),ThemeGenerator.b.setSlot(themeRules[ThemeRulesStandard.I[ThemeRulesStandard.I.foregroundColor]],colors.textColor,currentIsDark,false,true);var abridgedTheme=Object.entries(themeRules).reduce((function(acc,_ref2){var _Object$assign,_ref3=ThemeDesigner_slicedToArray(_ref2,2),ruleName=_ref3[0],ruleValue=_ref3[1];return-1===ruleName.indexOf("ColorShade")&&"primaryColor"!==ruleName&&"backgroundColor"!==ruleName&&"foregroundColor"!==ruleName&&-1===ruleName.indexOf("body")?Object.assign({},acc,((_Object$assign={})[ruleName]=ruleValue,_Object$assign)):acc}),{});return(0,createTheme.j)({palette:ThemeGenerator.b.getThemeAsJson(abridgedTheme),isInverted:(0,shades._T)(themeRules[ThemeRulesStandard.I[ThemeRulesStandard.I.backgroundColor]].color)})}}]),ThemeDesigner}(),useClassNames=__webpack_require__("./src/hooks/useClassNames.ts"),dist=__webpack_require__("./node_modules/merge-anything/dist/index.js"),jsx_runtime=__webpack_require__("./node_modules/react/jsx-runtime.js"),InputButtons=function InputButtons(props){var colors=Object.assign({},props).colors,baseTheme=(0,useTheme.F)(),theme=(0,react.useMemo)((function(){var _colors$backgroundCol,_colors$primaryColor,_colors$textColor,_props$themeOverride,theme=ThemeDesigner.generateTheme({backgroundColor:null!==(_colors$backgroundCol=null==colors?void 0:colors.backgroundColor)&&void 0!==_colors$backgroundCol?_colors$backgroundCol:baseTheme.semanticColors.inputBackground,primaryColor:null!==(_colors$primaryColor=null==colors?void 0:colors.primaryColor)&&void 0!==_colors$primaryColor?_colors$primaryColor:baseTheme.palette.themePrimary,textColor:null!==(_colors$textColor=null==colors?void 0:colors.textColor)&&void 0!==_colors$textColor?_colors$textColor:baseTheme.palette.black});return theme.semanticColors.menuBackground=baseTheme.semanticColors.menuBackground,(0,dist.TS)(theme,null!==(_props$themeOverride=props.themeOverride)&&void 0!==_props$themeOverride?_props$themeOverride:{})}),[null==colors?void 0:colors.backgroundColor,null==colors?void 0:colors.primaryColor,null==colors?void 0:colors.textColor,baseTheme]),classNames=(0,useClassNames.o)("Input-Buttons",{}).replace("--underlined",""),suffixStyles=(0,react.useMemo)((function(){return function getSuffixStyles(theme){return(0,lib.ZC)({root:{height:"100%",".ms-CommandBar":{padding:0,".ms-Button-label":{fontWeight:600},".ms-CommandBar-primaryCommand":{display:"none"},".ms-Button--commandBar":{i:{color:theme.semanticColors.infoIcon},":hover i":{color:theme.palette.themeDarkAlt}}},".ms-CommandBar, .ms-Button--commandBar, >div, >div>div, >div>div>div":{height:"100%"},'.hover-only[data-clickcopy]:has([data-icon-name="Checkmark"])':{display:"block"}}})}(theme)}),[theme]),items=useInputButtons(props,theme).items;return props.buttons||props.clickToCopyProps||props.deleteButtonProps?(0,jsx_runtime.jsx)(ThemeProvider.f,{className:classNames+" "+suffixStyles.root,theme:theme,applyTo:"none",children:(0,jsx_runtime.jsx)(CommandBar.X,{items:[],theme:theme,farItems:items})}):(0,jsx_runtime.jsx)(jsx_runtime.Fragment,{})};InputButtons.displayName="InputButtons";try{InputButtons.displayName="InputButtons",InputButtons.__docgenInfo={description:"",displayName:"InputButtons",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string"}},buttons:{defaultValue:null,description:"",name:"buttons",required:!1,type:{name:"ICommandBarItemProps[]"}},clickToCopyProps:{defaultValue:null,description:"",name:"clickToCopyProps",required:!1,type:{name:"(ICommandBarItemProps & { successText?: string; getValueToCopy?: (() => string) | undefined; }) | undefined"}},deleteButtonProps:{defaultValue:null,description:"",name:"deleteButtonProps",required:!1,type:{name:"ICommandBarItemProps"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"boolean"}},colors:{defaultValue:null,description:"",name:"colors",required:!1,type:{name:"{ backgroundColor: string; primaryColor: string; textColor: string; }"}},themeOverride:{defaultValue:null,description:"",name:"themeOverride",required:!1,type:{name:"DeepPartial<ITheme>"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/utilities/components/InputButtons/InputButtons.tsx#InputButtons"]={docgenInfo:InputButtons.__docgenInfo,name:"InputButtons",path:"src/utilities/components/InputButtons/InputButtons.tsx#InputButtons"})}catch(__react_docgen_typescript_loader_error){}},"./src/utilities/components/InputErrorMessage/InputErrorMessage.tsx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{f:function(){return InputErrorMessage}});__webpack_require__("./node_modules/core-js/modules/es.object.assign.js");var _fluentui_react__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@fluentui/react/lib/utilities/ThemeProvider/useTheme.js"),_fluentui_react__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@fluentui/react/lib/components/Text/Text.js"),react__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./node_modules/react/index.js"),_styles__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__("./src/utilities/components/InputErrorMessage/styles.ts"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/react/jsx-runtime.js"),InputErrorMessage=function InputErrorMessage(props){var value=Object.assign({},props).value,theme=(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_3__.F)(),styles=(0,react__WEBPACK_IMPORTED_MODULE_1__.useMemo)((function(){return(0,_styles__WEBPACK_IMPORTED_MODULE_4__.rO)(theme)}),[]);return value?(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_fluentui_react__WEBPACK_IMPORTED_MODULE_5__.x,{className:"TALXIS__errorMessage "+styles.root,children:props.value}):(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.Fragment,{})};InputErrorMessage.displayName="InputErrorMessage";try{InputErrorMessage.displayName="InputErrorMessage",InputErrorMessage.__docgenInfo={description:"",displayName:"InputErrorMessage",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string"}}}},"undefined"!=typeof STORYBOOK_REACT_CLASSES&&(STORYBOOK_REACT_CLASSES["src/utilities/components/InputErrorMessage/InputErrorMessage.tsx#InputErrorMessage"]={docgenInfo:InputErrorMessage.__docgenInfo,name:"InputErrorMessage",path:"src/utilities/components/InputErrorMessage/InputErrorMessage.tsx#InputErrorMessage"})}catch(__react_docgen_typescript_loader_error){}},"./src/utilities/components/InputErrorMessage/styles.ts":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{VK:function(){return errorOpacityAnim},Y7:function(){return errorTransformAnim},rO:function(){return getErrorMessageStyles}});var _fluentui_react__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js"),errorOpacityAnim=(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_0__.F4)({"0%":{opacity:0},"100%":{opacity:1}}),errorTransformAnim=(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_0__.F4)({"0%":{transform:"translate3d(0px, -20px, 0px)",pointerEvents:"none"},"100%":{transform:"translate3d(0px, 0px, 0px)",pointerEvents:"auto"}}),getErrorMessageStyles=function getErrorMessageStyles(theme){return(0,_fluentui_react__WEBPACK_IMPORTED_MODULE_0__.ZC)({root:{animationName:errorOpacityAnim+", "+errorTransformAnim,animationDuration:"0.367s",animationTimingFunction:"ease-in-out",animationFillMode:"both",WebkitFontSmoothing:"antialiased",fontSize:"12px",fontWeight:400,color:theme.semanticColors.errorText,margin:0,paddingTop:"5px",display:"flex",alignItems:"center"}})}},"./src/utilities/styles.ts":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.d(__webpack_exports__,{b:function(){return borderAnim}});var borderAnim=(0,__webpack_require__("./node_modules/@fluentui/style-utilities/lib/index.js").F4)({"0%":{transform:"scaleX(0)"},"100%":{transform:"scaleX(100%)"}})},"./storybook-init-framework-entry.js":function(__unused_webpack_module,__unused_webpack___webpack_exports__,__webpack_require__){"use strict";__webpack_require__("./node_modules/@storybook/react/dist/esm/client/index.js")},"./src/stories/Introduction.stories.mdx":function(__unused_webpack_module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{__namedExportsOrder:function(){return __namedExportsOrder},__page:function(){return __page}});__webpack_require__("./node_modules/core-js/modules/es.object.keys.js"),__webpack_require__("./node_modules/core-js/modules/es.array.index-of.js"),__webpack_require__("./node_modules/core-js/modules/es.symbol.js"),__webpack_require__("./node_modules/core-js/modules/es.object.assign.js"),__webpack_require__("./node_modules/react/index.js");var _mdx_js_react__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__("./node_modules/@mdx-js/react/dist/esm.js"),_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__("./node_modules/@storybook/addon-docs/dist/esm/index.js"),_excluded=["components"];function _extends(){return _extends=Object.assign?Object.assign.bind():function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source)Object.prototype.hasOwnProperty.call(source,key)&&(target[key]=source[key])}return target},_extends.apply(this,arguments)}function _objectWithoutProperties(source,excluded){if(null==source)return{};var key,i,target=function _objectWithoutPropertiesLoose(source,excluded){if(null==source)return{};var key,i,target={},sourceKeys=Object.keys(source);for(i=0;i<sourceKeys.length;i++)key=sourceKeys[i],excluded.indexOf(key)>=0||(target[key]=source[key]);return target}(source,excluded);if(Object.getOwnPropertySymbols){var sourceSymbolKeys=Object.getOwnPropertySymbols(source);for(i=0;i<sourceSymbolKeys.length;i++)key=sourceSymbolKeys[i],excluded.indexOf(key)>=0||Object.prototype.propertyIsEnumerable.call(source,key)&&(target[key]=source[key])}return target}var layoutProps={};function MDXContent(_ref){var components=_ref.components,props=_objectWithoutProperties(_ref,_excluded);return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("wrapper",_extends({},layoutProps,props,{components:components,mdxType:"MDXLayout"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_6__.h_,{title:"TALXIS React Components/Introduction",mdxType:"Meta"}),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("style",null,"\n\n .subheading {\n --mediumdark: '#999999';\n font-weight: 900;\n font-size: 13px;\n color: #999;\n letter-spacing: 6px;\n line-height: 24px;\n text-transform: uppercase;\n margin-bottom: 12px;\n margin-top: 40px;\n }\n\n .link-list {\n display: grid;\n grid-template-columns: 1fr;\n grid-template-rows: 1fr 1fr;\n row-gap: 10px;\n }\n\n @media (min-width: 620px) {\n .link-list {\n row-gap: 20px;\n column-gap: 20px;\n grid-template-columns: 1fr 1fr;\n }\n }\n\n @media all and (-ms-high-contrast:none) {\n .link-list {\n display: -ms-grid;\n -ms-grid-columns: 1fr 1fr;\n -ms-grid-rows: 1fr 1fr;\n }\n }\n\n .link-item {\n display: block;\n padding: 20px 30px 20px 15px;\n border: 1px solid #00000010;\n border-radius: 5px;\n transition: background 150ms ease-out, border 150ms ease-out, transform 150ms ease-out;\n color: #333333;\n display: flex;\n align-items: flex-start;\n }\n\n .link-item:hover {\n border-color: #1EA7FD50;\n transform: translate3d(0, -3px, 0);\n box-shadow: rgba(0, 0, 0, 0.08) 0 3px 10px 0;\n }\n\n .link-item:active {\n border-color: #1EA7FD;\n transform: translate3d(0, 0, 0);\n }\n\n .link-item strong {\n font-weight: 700;\n display: block;\n margin-bottom: 2px;\n }\n \n .link-item img {\n height: 40px;\n width: 40px;\n margin-right: 15px;\n flex: none;\n }\n\n .link-item span {\n font-size: 14px;\n line-height: 20px;\n }\n\n .tip {\n display: inline-block;\n border-radius: 1em;\n font-size: 11px;\n line-height: 12px;\n font-weight: 700;\n background: #E7FDD8;\n color: #66BF3C;\n padding: 4px 12px;\n margin-right: 10px;\n vertical-align: top;\n }\n\n .tip-wrapper {\n font-size: 13px;\n line-height: 20px;\n margin-top: 40px;\n margin-bottom: 40px;\n }\n\n .tip-wrapper code {\n font-size: 12px;\n display: inline-block;\n }\n\n \n"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("h1",{id:"talxis-react-components"},"TALXIS React Components"),(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("p",null,"TALXIS React Components extend the native Fluent UI components with additional styling and functionality.\nSince all components extend their Fluent UI counterparts, you can (and should) refer to ",(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("a",{parentName:"p",href:"https://developer.microsoft.com/en-us/fluentui#/controls/web",target:"_blank",rel:"nofollow noopener noreferrer"},(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)("strong",{parentName:"a"},"Fluent UI documentation"))," as well.\nThis documentation mainly focuses on the differences and extensions over Microsoft's implementation of Fluent UI components to better suit our use cases."))}MDXContent.displayName="MDXContent",MDXContent.isMDXComponent=!0;var __page=function __page(){throw new Error("Docs-only story")};__page.parameters={docsOnly:!0};var componentMeta={title:"TALXIS React Components/Introduction",includeStories:["__page"]},mdxStoryNameToKey={};componentMeta.parameters=componentMeta.parameters||{},componentMeta.parameters.docs=Object.assign({},componentMeta.parameters.docs||{},{page:function page(){return(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)(_storybook_addon_docs__WEBPACK_IMPORTED_MODULE_6__.aT,{mdxStoryNameToKey:mdxStoryNameToKey,mdxComponentAnnotations:componentMeta},(0,_mdx_js_react__WEBPACK_IMPORTED_MODULE_5__.kt)(MDXContent,null))}}),__webpack_exports__.default=componentMeta;var __namedExportsOrder=["__page"]},"./src sync recursive ^\\.(?:(?:^%7C\\/%7C(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/)(?%21\\.)(?=.)[^/]*?\\.stories\\.(js%7Cjsx%7Cts%7Ctsx))$":function(module,__unused_webpack_exports,__webpack_require__){var map={"./stories/Autocomplete/Autocomplete.stories.tsx":"./src/stories/Autocomplete/Autocomplete.stories.tsx","./stories/Autocomplete/Autocomplete_Extensions.stories.tsx":"./src/stories/Autocomplete/Autocomplete_Extensions.stories.tsx","./stories/ButtonLoading/withButtonLoading.stories.tsx":"./src/stories/ButtonLoading/withButtonLoading.stories.tsx","./stories/ComboBox/ComboBox.stories.tsx":"./src/stories/ComboBox/ComboBox.stories.tsx","./stories/ComboBox/ComboBox_Extensions.stories.tsx":"./src/stories/ComboBox/ComboBox_Extensions.stories.tsx","./stories/CommandBar/CommandBar.stories.tsx":"./src/stories/CommandBar/CommandBar.stories.tsx","./stories/CommandBar/CommandBar_Extensions.stories.tsx":"./src/stories/CommandBar/CommandBar_Extensions.stories.tsx","./stories/DatePicker/DatePicker.stories.tsx":"./src/stories/DatePicker/DatePicker.stories.tsx","./stories/DatePicker/DatePicker_Extensions.stories.tsx":"./src/stories/DatePicker/DatePicker_Extensions.stories.tsx","./stories/Login/Login.stories.tsx":"./src/stories/Login/Login.stories.tsx","./stories/Multistage/Multistage.stories.tsx":"./src/stories/Multistage/Multistage.stories.tsx","./stories/Multistage/Multistage_Extensions.stories.tsx":"./src/stories/Multistage/Multistage_Extensions.stories.tsx","./stories/Spinner/Spinner.stories.tsx":"./src/stories/Spinner/Spinner.stories.tsx","./stories/TagPicker/TagPicker.stories.tsx":"./src/stories/TagPicker/TagPicker.stories.tsx","./stories/TagPicker/TagPicker_Extensions.stories.tsx":"./src/stories/TagPicker/TagPicker_Extensions.stories.tsx","./stories/TextField/TextField.stories.tsx":"./src/stories/TextField/TextField.stories.tsx","./stories/TextField/TextField_Extensions.stories.tsx":"./src/stories/TextField/TextField_Extensions.stories.tsx","./stories/TimePicker/TimePicker.stories.tsx":"./src/stories/TimePicker/TimePicker.stories.tsx","./stories/TimePicker/TimePicker_Extensions.stories.tsx":"./src/stories/TimePicker/TimePicker_Extensions.stories.tsx"};function webpackContext(req){var id=webpackContextResolve(req);return __webpack_require__(id)}function webpackContextResolve(req){if(!__webpack_require__.o(map,req)){var e=new Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}return map[req]}webpackContext.keys=function webpackContextKeys(){return Object.keys(map)},webpackContext.resolve=webpackContextResolve,module.exports=webpackContext,webpackContext.id="./src sync recursive ^\\.(?:(?:^%7C\\/%7C(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/)(?%21\\.)(?=.)[^/]*?\\.stories\\.(js%7Cjsx%7Cts%7Ctsx))$"},"./src sync recursive ^\\.(?:(?:^%7C\\/%7C(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/)(?%21\\.)(?=.)[^/]*?\\.stories\\.mdx)$":function(module,__unused_webpack_exports,__webpack_require__){var map={"./stories/Introduction.stories.mdx":"./src/stories/Introduction.stories.mdx"};function webpackContext(req){var id=webpackContextResolve(req);return __webpack_require__(id)}function webpackContextResolve(req){if(!__webpack_require__.o(map,req)){var e=new Error("Cannot find module '"+req+"'");throw e.code="MODULE_NOT_FOUND",e}return map[req]}webpackContext.keys=function webpackContextKeys(){return Object.keys(map)},webpackContext.resolve=webpackContextResolve,module.exports=webpackContext,webpackContext.id="./src sync recursive ^\\.(?:(?:^%7C\\/%7C(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/)(?%21\\.)(?=.)[^/]*?\\.stories\\.mdx)$"},"?4f7e":function(){},"./generated-stories-entry.cjs":function(module,__unused_webpack_exports,__webpack_require__){"use strict";module=__webpack_require__.nmd(module),(0,__webpack_require__("./node_modules/@storybook/react/dist/esm/client/index.js").configure)([__webpack_require__("./src sync recursive ^\\.(?:(?:^%7C\\/%7C(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/)(?%21\\.)(?=.)[^/]*?\\.stories\\.mdx)$"),__webpack_require__("./src sync recursive ^\\.(?:(?:^%7C\\/%7C(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/)(?%21\\.)(?=.)[^/]*?\\.stories\\.(js%7Cjsx%7Cts%7Ctsx))$")],module,!1)}},function(__webpack_require__){var __webpack_exec__=function(moduleId){return __webpack_require__(__webpack_require__.s=moduleId)};__webpack_require__.O(0,[182],(function(){return __webpack_exec__("./node_modules/@storybook/core-client/dist/esm/globals/polyfills.js"),__webpack_exec__("./node_modules/@storybook/core-client/dist/esm/globals/globals.js"),__webpack_exec__("./storybook-init-framework-entry.js"),__webpack_exec__("./node_modules/@storybook/react/dist/esm/client/docs/config-generated-config-entry.js"),__webpack_exec__("./node_modules/@storybook/react/dist/esm/client/preview/config-generated-config-entry.js"),__webpack_exec__("./node_modules/@storybook/addon-links/preview.js-generated-config-entry.js"),__webpack_exec__("./node_modules/@storybook/addon-docs/preview.js-generated-config-entry.js"),__webpack_exec__("./node_modules/@storybook/addon-actions/preview.js-generated-config-entry.js"),__webpack_exec__("./node_modules/@storybook/addon-backgrounds/preview.js-generated-config-entry.js"),__webpack_exec__("./node_modules/@storybook/addon-measure/preview.js-generated-config-entry.js"),__webpack_exec__("./node_modules/@storybook/addon-outline/preview.js-generated-config-entry.js"),__webpack_exec__("./.storybook/preview.js-generated-config-entry.js"),__webpack_exec__("./generated-stories-entry.cjs")}));__webpack_require__.O()}]);