@sap-ux/ui-components 1.27.1 → 1.27.2

package/storybook/501.8ce2c34d.iframe.bundle.js

@@ -1 +0,0 @@
-"use strict";(()=>{var l=(d,o)=>()=>(o||d((o={exports:{}}).exports,o),o.exports);var a=(d,o,n)=>new Promise((s,_)=>{var u=e=>{try{t(n.next(e))}catch(r){_(r)}},m=e=>{try{t(n.throw(e))}catch(r){_(r)}},t=e=>e.done?s(e.value):Promise.resolve(e.value).then(u,m);t((n=n.apply(d,o)).next())});var p=l(c=>{(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[501],{"../../node_modules/.pnpm/@storybook+react-dom-shim@8.4.2_react-dom@16.14.0_react@16.14.0_storybook@8.4.2/node_modules/@storybook/react-dom-shim/dist/react-16.mjs":(d,o,n)=>{n.d(o,{renderElement:()=>_,unmountElement:()=>u});var s=n("../../node_modules/.pnpm/react-dom@16.14.0_react@16.14.0/node_modules/react-dom/index.js"),_=(m,t)=>a(c,null,function*(){return new Promise(e=>{s.render(m,t,()=>e(null))})}),u=m=>{s.unmountComponentAtNode(m)}}}])});p();})();

package/storybook/UICombobox-story.9f22d3f6.iframe.bundle.js

@@ -1 +0,0 @@
-"use strict";(()=>{var z=Object.defineProperty,J=Object.defineProperties;var Y=Object.getOwnPropertyDescriptors;var M=Object.getOwnPropertySymbols;var Q=Object.prototype.hasOwnProperty,V=Object.prototype.propertyIsEnumerable;var I=(m,t,s)=>t in m?z(m,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):m[t]=s,h=(m,t)=>{for(var s in t||(t={}))Q.call(t,s)&&I(m,s,t[s]);if(M)for(var s of M(t))V.call(t,s)&&I(m,s,t[s]);return m},y=(m,t)=>J(m,Y(t));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[632],{"./stories/UICombobox.story.tsx":function(m,t,s){var b=this&&this.__createBinding||(Object.create?function(a,n,l,r){r===void 0&&(r=l);var u=Object.getOwnPropertyDescriptor(n,l);(!u||("get"in u?!n.__esModule:u.writable||u.configurable))&&(u={enumerable:!0,get:function(){return n[l]}}),Object.defineProperty(a,r,u)}:function(a,n,l,r){r===void 0&&(r=l),a[r]=n[l]}),x=this&&this.__setModuleDefault||(Object.create?function(a,n){Object.defineProperty(a,"default",{enumerable:!0,value:n})}:function(a,n){a.default=n}),f=this&&this.__importStar||function(){var a=function(n){return a=Object.getOwnPropertyNames||function(l){var r=[];for(var u in l)Object.prototype.hasOwnProperty.call(l,u)&&(r[r.length]=u);return r},a(n)};return function(n){if(n&&n.__esModule)return n;var l={};if(n!=null)for(var r=a(n),u=0;u<r.length;u++)r[u]!=="default"&&b(l,n,r[u]);return x(l,n),l}}();Object.defineProperty(t,"__esModule",{value:!0}),t.WithExternalSearch=t.AdditionalCustomSearch=t.SearchIncludeKeys=t.customRender=t.groupsAndSeparators=t.accessibilityStates=t.openMenuOnClick=t.Messages=t.DynamicError=t.MultiSelectSearchHighlight=t.DifferentStates=t.WithLoading=t.WithRefresh=t.WithoutSearch=t.SearchWithoutHighlight=t.SearchHighlight=void 0;const e=f(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),g=s("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.24_@types+react@16.14.55_react-dom@16.14.0_react@16.14.0/node_modules/@fluentui/react/lib-commonjs/index.js"),o=s("./src/components/UIComboBox/index.tsx"),k=s("./src/components/UICheckbox/index.tsx"),i=s("./test/__mock__/select-data.ts"),S=s("./src/components/index.tsx");t.default={title:"Dropdowns/Combobox"};const B=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:i.data,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on"}),e.default.createElement(o.UIComboBox,{options:i.data,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",disabled:!0}));t.SearchHighlight=B;const U=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:i.data,dropdownWidth:300,placeholder:"Search",allowFreeform:!0,autoComplete:"on",openOnKeyboardFocus:!0}));t.SearchWithoutHighlight=U;const D=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:i.data,dropdownWidth:300}));t.WithoutSearch=D;const A=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:i.data,onRefresh:()=>console.log("refresh trigged!")}),e.default.createElement("small",null,"*watch console"));t.WithRefresh=A;const w=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:i.data,isLoading:!0,styles:{optionsContainerWrapper:{width:"262px"}},label:"Default"}),e.default.createElement(o.UIComboBox,{options:i.data,isLoading:[o.UIComboBoxLoaderType.List],styles:{optionsContainerWrapper:{width:"262px"}},label:"List"}),e.default.createElement(o.UIComboBox,{options:i.data,isLoading:[o.UIComboBoxLoaderType.Input],styles:{optionsContainerWrapper:{width:"262px"}},label:"Input"}),e.default.createElement(o.UIComboBox,{options:i.data,isLoading:[o.UIComboBoxLoaderType.List,o.UIComboBoxLoaderType.Input],styles:{optionsContainerWrapper:{width:"262px"}},label:"List and Input"}));t.WithLoading=w;const O=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:i.data,label:"Error",highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",errorMessage:"Dummy Error"}),e.default.createElement(o.UIComboBox,{options:i.data,label:"Disabled",highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",disabled:!0}),e.default.createElement(o.UIComboBox,{options:i.data,label:"Required",highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",required:!0}));t.DifferentStates=O;const v=()=>{const[a,n]=(0,e.useState)([]);function l(r,u,c,p){if(u){const d=[...a,u.key].filter(C=>u.selected?!0:C!==u.key);n(d)}}return e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:i.data,selectedKey:a,onChange:l,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,multiSelect:!0,autoComplete:"on"}))};t.MultiSelectSearchHighlight=v;const W=()=>{const[a,n]=e.default.useState("OK"),l=[{key:"OK",text:"No Error Message"},{key:"ERROR",text:"With Error Message"}];function r(u,c,p,d){c&&n(c.key)}return e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:l,label:"Dynamic Validation Error",highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",selectedKey:a,onChange:r,errorMessage:a==="OK"?void 0:"Error Message"}))};t.DynamicError=W;const K=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:i.data,label:"Error",highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",errorMessage:"Dummy Error"}),e.default.createElement(o.UIComboBox,{options:i.data,label:"Error",highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",warningMessage:"Dummy Warning"}),e.default.createElement(o.UIComboBox,{options:i.data,label:"Error",highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",infoMessage:"Dummy Info"}));t.Messages=K;const T=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:i.data,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",openMenuOnClick:!0,label:"Open menu on click"}),e.default.createElement(o.UIComboBox,{options:i.data,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",openMenuOnClick:!1,label:"Do not open menu on click"}));t.openMenuOnClick=T;const _=()=>{const[a,n]=e.default.useState(!1),[l,r]=e.default.useState("EE"),u={childrenGap:40},c={options:i.data,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,multiSelect:a,onChange:(p,d)=>{if(Array.isArray(l)){const C=[...l,d==null?void 0:d.key].filter(Z=>d!=null&&d.selected?!0:Z!==(d==null?void 0:d.key));r(C)}else d&&r(d.key)}};return e.default.createElement("div",null,e.default.createElement(g.Stack,{horizontal:!0,tokens:u},e.default.createElement(k.UICheckbox,{label:"Multi Select",checked:a,onChange:(p,d)=>{d&&!Array.isArray(l)?r([l]):!d&&Array.isArray(l)&&r(l[0]),n(d)}})),e.default.createElement(g.Stack,{horizontal:!0,tokens:u},e.default.createElement("table",{style:{borderSpacing:20,width:"100%",maxWidth:750}},e.default.createElement("tr",null,e.default.createElement("td",{style:{minWidth:100,width:150}}),e.default.createElement("td",{style:{width:"50%"}},"Placeholder Text"),e.default.createElement("td",{style:{width:"50%"}},"Input Text")),e.default.createElement("tr",null,e.default.createElement("td",null,"Regular"),e.default.createElement("td",null,e.default.createElement(o.UIComboBox,y(h({},c),{placeholder:"Placeholder"}))),e.default.createElement("td",null,e.default.createElement(o.UIComboBox,y(h({},c),{selectedKey:l})))),e.default.createElement("tr",null,e.default.createElement("td",null,"Error"),e.default.createElement("td",null,e.default.createElement(o.UIComboBox,y(h({},c),{placeholder:"Placeholder",errorMessage:"Dummy error"}))),e.default.createElement("td",null,e.default.createElement(o.UIComboBox,y(h({},c),{errorMessage:"Dummy error",selectedKey:l})))),e.default.createElement("tr",null,e.default.createElement("td",null,"Disabled"),e.default.createElement("td",null,e.default.createElement(o.UIComboBox,y(h({},c),{placeholder:"Placeholder",disabled:!0}))),e.default.createElement("td",null,e.default.createElement(o.UIComboBox,y(h({},c),{selectedKey:l,disabled:!0})))),e.default.createElement("tr",null,e.default.createElement("td",null,"Read Only"),e.default.createElement("td",null,e.default.createElement(o.UIComboBox,y(h({},c),{placeholder:"Placeholder",readOnly:!0}))),e.default.createElement("td",null,e.default.createElement(o.UIComboBox,y(h({},c),{selectedKey:l,readOnly:!0})))))))};t.accessibilityStates=_;const L=()=>{const a=[...i.groupsData];return a.splice(5,0,{key:"div1",text:"",itemType:o.UISelectableOptionMenuItemType.Divider}),a.splice(15,0,{key:"div1",text:"",itemType:o.UISelectableOptionMenuItemType.Divider}),e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:i.groupsData,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",openMenuOnClick:!0,label:"Menu items with headers"}),e.default.createElement(o.UIComboBox,{options:a,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",openMenuOnClick:!0,label:"Menu items with dividers and headers"}),e.default.createElement(o.UIComboBox,{options:i.groupsData,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",openMenuOnClick:!0,multiSelect:!0,label:"Menu items with headers - multi select"}),e.default.createElement(o.UIComboBox,{options:a,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",openMenuOnClick:!0,multiSelect:!0,label:"Menu items with dividers and headers - multi select"}))};t.groupsAndSeparators=L;const R=["AR","BR","DK"],F=i.data.map(a=>R.includes(a.key)?y(h({},a),{editable:!0}):a),P=()=>e.default.createElement(o.UIComboBox,{options:F,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",onRenderOption:(a,n)=>{var l;return"editable"in(a!=null?a:{})?e.default.createElement(S.UITextInput,{onMouseDown:r=>{r.target.focus()},onClick:r=>{r.nativeEvent.preventDefault(),r.nativeEvent.stopPropagation(),r.preventDefault(),r.stopPropagation()}}):(l=n==null?void 0:n(a))!=null?l:null},onRenderItem:(a,n)=>{var l;return(l=n==null?void 0:n(a))!=null?l:null}});t.customRender=P;const E=[{key:"test1",text:"test1"},{key:"dummy",text:"dummy"},{key:"customer",text:"customer"},{key:"name",text:"name"},{key:"employee",text:"employee"},{key:"ID",text:"ID"},{key:"tripEndDate",text:"tripEndDate"},{key:"bookings",text:"bookings",itemType:o.UISelectableOptionMenuItemType.Divider},{key:"bookings",text:"bookings",itemType:o.UISelectableOptionMenuItemType.Header},{key:"bookings/airlines",text:"airlines"},{key:"bookings/bookingDate",text:"bookingDate"},{key:"bookings/DateOnBookings",text:"DateOnBookings"},{key:"bookings/employee",text:"employee"},{key:"bookings/flightDate",text:"flightDate"},{key:"bookings/ID",text:"ID"},{key:"bookings/priceUSD",text:"priceUSD"},{key:"bookings/travel_ID",text:"travel_ID"},{key:"bookings/usedString5",text:"usedString5"},{key:"notes",text:"notes",itemType:o.UISelectableOptionMenuItemType.Divider},{key:"notes",text:"notes",itemType:o.UISelectableOptionMenuItemType.Header},{key:"notes/comment",text:"comment"},{key:"notes/description",text:"description"}],H=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:E,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",searchByKeyEnabled:!0}),e.default.createElement(o.UIComboBox,{options:E,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",disabled:!0,searchByKeyEnabled:!0}));t.SearchIncludeKeys=H;const G=[...i.data,{key:"A1",text:"Do not hide",customMark:!0},{key:"A2",text:"Always visible",customMark:!0}],N=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:G,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",customSearchFilter:(a,n)=>{if("customMark"in n&&n.customMark)return!0}}));t.AdditionalCustomSearch=N;const j=()=>{const[a,n]=(0,e.useState)(!1),[l,r]=(0,e.useState)([]);return e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:l,isForceEnabled:!0,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",placeholder:"Start typing to search",isLoading:a,label:"External search",externalSearchProps:{noDataLabel:"No data available",onInputChange:()=>{r([]),n([o.UIComboBoxLoaderType.List,o.UIComboBoxLoaderType.Input])},onExternalSearch:()=>{setTimeout(()=>{r(i.data),n(!1)},2500)}}}))};t.WithExternalSearch=j},"./test/__mock__/select-data.ts":(m,t,s)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.groupsData=t.shortData=t.data=void 0;const b=s("./src/components/index.tsx");t.data=[{key:"",text:""},{key:"DZ",text:"Algeria"},{key:"AR",text:"Argentina"},{key:"AU",text:"Australia"},{key:"AT",text:"Austria"},{key:"BH",text:"Bahrain"},{key:"BE",text:"Belgium"},{key:"BC",text:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod"},{key:"BA",text:"Bosnia and Herzegovina"},{key:"BR",text:"Brazil"},{key:"BG",text:"Bulgaria"},{key:"CA",text:"Canada"},{key:"CL",text:"Chile"},{key:"CO",text:"Colombia"},{key:"HR",text:"Croatia"},{key:"CU",text:"Cuba"},{key:"CZ",text:"Czech Republic"},{key:"DK",text:"Denmark"},{key:"EG",text:"Egypt"},{key:"EE",text:"Estonia"},{key:"FI",text:"Finland"},{key:"FR",text:"France"},{key:"GER",text:"Germany"},{key:"GH",text:"Ghana"},{key:"GR",text:"Greece"},{key:"HU",text:"Hungary"},{key:"IN",text:"India"},{key:"ID",text:"Indonesia"},{key:"IE",text:"Ireland"},{key:"IL",text:"Israel"},{key:"IT",text:"Italy"},{key:"JP",text:"Japan"},{key:"JO",text:"Jordan"},{key:"KE",text:"Kenya"},{key:"KW",text:"Kuwait"},{key:"LV",text:"Latvia"},{key:"LT",text:"Lithuania"},{key:"MK",text:"Macedonia"},{key:"MY",text:"Malaysia"},{key:"MX",text:"Mexico"},{key:"ME",text:"Montenegro"},{key:"MA",text:"Morocco"},{key:"NL",text:"Netherlands"},{key:"NZ",text:"New Zealand"},{key:"NG",text:"Nigeria"},{key:"NO",text:"Norway"},{key:"OM",text:"Oman"},{key:"PE",text:"Peru"},{key:"PH",text:"Philippines"},{key:"PL",text:"Poland"},{key:"PT",text:"Portugal"},{key:"QA",text:"Qatar"},{key:"RO",text:"Romania"},{key:"RU",text:"Russia"},{key:"SA",text:"Saudi Arabia"},{key:"SN",text:"Senegal"},{key:"RS",text:"Serbia"},{key:"SG",text:"Singapore"},{key:"SK",text:"Slovakia"},{key:"SI",text:"Slovenia"},{key:"ZA",text:"South Africa"},{key:"KR",text:"South Korea"},{key:"ES",text:"Spain"},{key:"SE",text:"Sweden"},{key:"CH",text:"Switzerland"},{key:"TN",text:"Tunisia"},{key:"TR",text:"Turkey"},{key:"UG",text:"Uganda"},{key:"UA",text:"Ukraine"},{key:"AE",text:"United Arab Emirates"},{key:"GB",text:"United Kingdom"},{key:"DU",text:"Dummmmmmmmyyyyyy"},{key:"DD",text:"Dudududumy"},{key:"YE",text:"Yemen"}],t.shortData=[t.data[0],t.data[1],t.data[2],t.data[3],t.data[4]];const x={africa:["DZ","EG","GH","KE","MA","NG","SN","ZA","TN","UG"],asia:["BH","IN","ID","JP","JO","KW","MY","OM","PH","QA","SA","SG","KR","AE","YE"],"Australia and Oceania":["AU","BC","NZ"],europe:["AT","BE","BA","BG","HR","CZ","DK","EE","FI","FR","GER","GR","HU","IE","IL","IT","LV","LT","MK","ME","NL","NO","PL","PT","RO","RU","RS","SK","SI","ES","SE","CH","TR","UA","GB"],northAmerica:["CA"],southAmerica:["AR","BR","CL","CO","CU","MX","PE"],unknown:["DU","DD"]};t.groupsData=[];for(const f in x){t.groupsData.push({key:f,text:f.charAt(0).toUpperCase()+f.slice(1),itemType:b.UISelectableOptionMenuItemType.Header});const e=x[f];for(const g of e){const o=t.data.find(k=>k.key===g);o&&t.groupsData.push(o)}}}}]);})();