@sap-ux/ui-components 1.27.1 → 1.27.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/UIComboBox/UIComboBox.d.ts +7 -0
- package/dist/components/UIComboBox/UIComboBox.d.ts.map +1 -1
- package/dist/components/UIComboBox/UIComboBox.js +27 -5
- package/dist/components/UIComboBox/UIComboBox.js.map +1 -1
- package/dist/components/UIFlexibleTable/UIFlexibleTable.scss +1 -0
- package/package.json +2 -2
- package/storybook/15.61d09d58.iframe.bundle.js +1 -0
- package/storybook/173.6fa4f445.iframe.bundle.js +1 -0
- package/storybook/253.bdcb2255.iframe.bundle.js +1 -0
- package/storybook/369.0575aa41.iframe.bundle.js +1 -0
- package/storybook/390.6fa86783.iframe.bundle.js +10 -0
- package/storybook/569.982cfaea.iframe.bundle.js +1 -0
- package/storybook/594.68038794.iframe.bundle.js +1 -0
- package/storybook/60.bc889991.iframe.bundle.js +7 -0
- package/storybook/602.46b69015.iframe.bundle.js +41 -0
- package/storybook/716.0db4ba0b.iframe.bundle.js +62 -0
- package/storybook/802.1ba71a69.iframe.bundle.js +1 -0
- package/storybook/825.8912eb64.iframe.bundle.js +17 -0
- package/storybook/837.1ed4f2bd.iframe.bundle.js +1 -0
- package/storybook/990.02fc7a41.iframe.bundle.js +1 -0
- package/storybook/UIActionCallout-story.88e1aec9.iframe.bundle.js +2 -0
- package/storybook/UIButton-story.715ddb2e.iframe.bundle.js +2 -0
- package/storybook/UICallout-story.5ac8b92e.iframe.bundle.js +2 -0
- package/storybook/UICalloutCollisionTransform-story.2c9e5a9b.iframe.bundle.js +1 -0
- package/storybook/UICheckbox-story.bb5c66b5.iframe.bundle.js +2 -0
- package/storybook/UIChoiceGroup-story.f5f7e770.iframe.bundle.js +1 -0
- package/storybook/UICombobox-story.a3ec23bf.iframe.bundle.js +1 -0
- package/storybook/UIContextualMenu-story.3f2c4d23.iframe.bundle.js +2 -0
- package/storybook/UICreateSelect-story.755a7e1d.iframe.bundle.js +2 -0
- package/storybook/UIDatePicker-story.c1e523bc.iframe.bundle.js +2 -0
- package/storybook/UIDialog-story.1a0619ad.iframe.bundle.js +2 -0
- package/storybook/UIDropdown-story.dc4e9ffd.iframe.bundle.js +1 -0
- package/storybook/{UIFlexibleTable-story.a7972773.iframe.bundle.js → UIFlexibleTable-story.ff022e8e.iframe.bundle.js} +2 -2
- package/storybook/UIIcon-story.9cf8afc2.iframe.bundle.js +1 -0
- package/storybook/UILabel-story.68a998ac.iframe.bundle.js +1 -0
- package/storybook/UILink-story.9f120d92.iframe.bundle.js +2 -0
- package/storybook/UILoader-story.f3ea60f2.iframe.bundle.js +6 -0
- package/storybook/UIMessageBar-story.2f09a4db.iframe.bundle.js +1 -0
- package/storybook/UIPersona-story.3e53fb63.iframe.bundle.js +1 -0
- package/storybook/UIQuickNavigation-story.9ad81852.iframe.bundle.js +1 -0
- package/storybook/UISearchBox-story.cd76f6cd.iframe.bundle.js +1 -0
- package/storybook/{UISections-story.41e96508.iframe.bundle.js → UISections-story.9be4cd7d.iframe.bundle.js} +2 -2
- package/storybook/UISeparator-story.2dc5fbb5.iframe.bundle.js +1 -0
- package/storybook/UITable-story.f6b5f4bd.iframe.bundle.js +4 -0
- package/storybook/UITextInput-story.db4b3f34.iframe.bundle.js +2 -0
- package/storybook/UIToggle-story.cd48879b.iframe.bundle.js +2 -0
- package/storybook/UIToggleGroup-story.b001504f.iframe.bundle.js +2 -0
- package/storybook/UITooltip-story.033ce1cc.iframe.bundle.js +1 -0
- package/storybook/UITranslationInput-story.7a69ac92.iframe.bundle.js +1 -0
- package/storybook/UITreedropdown-story.fcfaaf97.iframe.bundle.js +2 -0
- package/storybook/Utilities-story.35abd890.iframe.bundle.js +1 -0
- package/storybook/iframe.html +3 -3
- package/storybook/index.html +1 -5
- package/storybook/index.json +1 -1
- package/storybook/main.49e9e746.iframe.bundle.js +1 -0
- package/storybook/project.json +1 -1
- package/storybook/runtime~main.fe9bda77.iframe.bundle.js +2 -0
- package/storybook/sb-addons/common-manager-bundle.js +1 -1
- package/storybook/sb-manager/globals-module-info.js +27 -3
- package/storybook/sb-manager/globals-runtime.js +14698 -13432
- package/storybook/sb-manager/runtime.js +4961 -6250
- package/storybook/sb-preview/runtime.js +3568 -2997
- package/storybook/166.6e45109c.iframe.bundle.js +0 -42
- package/storybook/201.472ec30f.iframe.bundle.js +0 -1
- package/storybook/220.ab5ca261.iframe.bundle.js +0 -1
- package/storybook/348.4634f438.iframe.bundle.js +0 -1
- package/storybook/390.b5db4f2e.iframe.bundle.js +0 -10
- package/storybook/442.8ebf07f3.iframe.bundle.js +0 -1
- package/storybook/452.ad0596e2.iframe.bundle.js +0 -1
- package/storybook/473.122e0f3a.iframe.bundle.js +0 -1
- package/storybook/501.8ce2c34d.iframe.bundle.js +0 -1
- package/storybook/578.8e20ee82.iframe.bundle.js +0 -62
- package/storybook/638.323deb2f.iframe.bundle.js +0 -7
- package/storybook/80.fb09d676.iframe.bundle.js +0 -1
- package/storybook/825.25a1b5c1.iframe.bundle.js +0 -17
- package/storybook/931.3bf97047.iframe.bundle.js +0 -1
- package/storybook/UIActionCallout-story.df2cb4e8.iframe.bundle.js +0 -2
- package/storybook/UIButton-story.572c9af7.iframe.bundle.js +0 -2
- package/storybook/UICallout-story.596f2323.iframe.bundle.js +0 -2
- package/storybook/UICalloutCollisionTransform-story.02eeeff0.iframe.bundle.js +0 -1
- package/storybook/UICheckbox-story.2ad27280.iframe.bundle.js +0 -2
- package/storybook/UIChoiceGroup-story.23007087.iframe.bundle.js +0 -1
- package/storybook/UICombobox-story.9f22d3f6.iframe.bundle.js +0 -1
- package/storybook/UIContextualMenu-story.e3e1391e.iframe.bundle.js +0 -2
- package/storybook/UICreateSelect-story.71d25ae2.iframe.bundle.js +0 -2
- package/storybook/UIDatePicker-story.2d279da6.iframe.bundle.js +0 -2
- package/storybook/UIDialog-story.d8305fc3.iframe.bundle.js +0 -2
- package/storybook/UIDropdown-story.20290ff6.iframe.bundle.js +0 -1
- package/storybook/UIIcon-story.7968349b.iframe.bundle.js +0 -1
- package/storybook/UILabel-story.03611118.iframe.bundle.js +0 -1
- package/storybook/UILink-story.744125e2.iframe.bundle.js +0 -2
- package/storybook/UILoader-story.3a6e7d6c.iframe.bundle.js +0 -6
- package/storybook/UIMessageBar-story.ed267b56.iframe.bundle.js +0 -1
- package/storybook/UIPersona-story.6cdb6313.iframe.bundle.js +0 -1
- package/storybook/UIQuickNavigation-story.3111e6e0.iframe.bundle.js +0 -1
- package/storybook/UISearchBox-story.a1355d42.iframe.bundle.js +0 -1
- package/storybook/UISeparator-story.a27b46f7.iframe.bundle.js +0 -1
- package/storybook/UITable-story.a2fedc85.iframe.bundle.js +0 -4
- package/storybook/UITextInput-story.9e10cb39.iframe.bundle.js +0 -2
- package/storybook/UIToggle-story.ca3117d5.iframe.bundle.js +0 -2
- package/storybook/UIToggleGroup-story.b0721a69.iframe.bundle.js +0 -2
- package/storybook/UITooltip-story.ec4c2398.iframe.bundle.js +0 -1
- package/storybook/UITranslationInput-story.6dae12fc.iframe.bundle.js +0 -1
- package/storybook/UITreedropdown-story.45cf9ce1.iframe.bundle.js +0 -2
- package/storybook/Utilities-story.2aeb882a.iframe.bundle.js +0 -1
- package/storybook/main.2bc3be87.iframe.bundle.js +0 -1
- package/storybook/runtime~main.085a20f8.iframe.bundle.js +0 -2
- package/storybook/sb-addons/common-manager-bundle.js.LEGAL.txt +0 -0
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
(()=>{var H=Object.defineProperty,z=Object.defineProperties;var R=Object.getOwnPropertyDescriptors;var N=Object.getOwnPropertySymbols;var W=Object.prototype.hasOwnProperty,j=Object.prototype.propertyIsEnumerable;var D=(i,c,r)=>c in i?H(i,c,{enumerable:!0,configurable:!0,writable:!0,value:r}):i[c]=r,C=(i,c)=>{for(var r in c||(c={}))W.call(c,r)&&D(i,r,c[r]);if(N)for(var r of N(c))j.call(c,r)&&D(i,r,c[r]);return i},w=(i,c)=>z(i,R(c));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[685],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js":(i=>{"use strict";i.exports=function(c){var r=[];return r.toString=function(){return this.map(function(o){var a="",e=typeof o[5]!="undefined";return o[4]&&(a+="@supports (".concat(o[4],") {")),o[2]&&(a+="@media ".concat(o[2]," {")),e&&(a+="@layer".concat(o[5].length>0?" ".concat(o[5]):""," {")),a+=c(o),e&&(a+="}"),o[2]&&(a+="}"),o[4]&&(a+="}"),a}).join("")},r.i=function(o,a,e,t,u){typeof o=="string"&&(o=[[null,o,void 0]]);var y={};if(e)for(var n=0;n<this.length;n++){var h=this[n][0];h!=null&&(y[h]=!0)}for(var m=0;m<o.length;m++){var l=[].concat(o[m]);e&&y[l[0]]||(typeof u!="undefined"&&(typeof l[5]=="undefined"||(l[1]="@layer".concat(l[5].length>0?" ".concat(l[5]):""," {").concat(l[1],"}")),l[5]=u),a&&(l[2]&&(l[1]="@media ".concat(l[2]," {").concat(l[1],"}")),l[2]=a),t&&(l[4]?(l[1]="@supports (".concat(l[4],") {").concat(l[1],"}"),l[4]=t):l[4]="".concat(t)),r.push(l))}},r}}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js":(i=>{"use strict";i.exports=function(c){return c[1]}}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":(i=>{"use strict";var c=[];function r(a){for(var e=-1,t=0;t<c.length;t++)if(c[t].identifier===a){e=t;break}return e}function s(a,e){for(var t={},u=[],y=0;y<a.length;y++){var n=a[y],h=e.base?n[0]+e.base:n[0],m=t[h]||0,l="".concat(h," ").concat(m);t[h]=m+1;var d=r(l),p={css:n[1],media:n[2],sourceMap:n[3],supports:n[4],layer:n[5]};if(d!==-1)c[d].references++,c[d].updater(p);else{var f=o(p,e);e.byIndex=y,c.splice(y,0,{identifier:l,updater:f,references:1})}u.push(l)}return u}function o(a,e){var t=e.domAPI(e);t.update(a);var u=function(n){if(n){if(n.css===a.css&&n.media===a.media&&n.sourceMap===a.sourceMap&&n.supports===a.supports&&n.layer===a.layer)return;t.update(a=n)}else t.remove()};return u}i.exports=function(a,e){e=e||{},a=a||[];var t=s(a,e);return function(y){y=y||[];for(var n=0;n<t.length;n++){var h=t[n],m=r(h);c[m].references--}for(var l=s(y,e),d=0;d<t.length;d++){var p=t[d],f=r(p);c[f].references===0&&(c[f].updater(),c.splice(f,1))}t=l}}}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js":(i=>{"use strict";var c={};function r(o){if(typeof c[o]=="undefined"){var a=document.querySelector(o);if(window.HTMLIFrameElement&&a instanceof window.HTMLIFrameElement)try{a=a.contentDocument.head}catch(e){a=null}c[o]=a}return c[o]}function s(o,a){var e=r(o);if(!e)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");e.appendChild(a)}i.exports=s}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js":(i=>{"use strict";function c(r){var s=document.createElement("style");return r.setAttributes(s,r.attributes),r.insert(s,r.options),s}i.exports=c}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":((i,c,r)=>{"use strict";function s(o){var a=r.nc;a&&o.setAttribute("nonce",a)}i.exports=s}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js":(i=>{"use strict";function c(o,a,e){var t="";e.supports&&(t+="@supports (".concat(e.supports,") {")),e.media&&(t+="@media ".concat(e.media," {"));var u=typeof e.layer!="undefined";u&&(t+="@layer".concat(e.layer.length>0?" ".concat(e.layer):""," {")),t+=e.css,u&&(t+="}"),e.media&&(t+="}"),e.supports&&(t+="}");var y=e.sourceMap;y&&typeof btoa!="undefined"&&(t+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(y))))," */")),a.styleTagTransform(t,o,a.options)}function r(o){if(o.parentNode===null)return!1;o.parentNode.removeChild(o)}function s(o){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var a=o.insertStyleElement(o);return{update:function(t){c(a,o,t)},remove:function(){r(a)}}}i.exports=s}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js":(i=>{"use strict";function c(r,s){if(s.styleSheet)s.styleSheet.cssText=r;else{for(;s.firstChild;)s.removeChild(s.firstChild);s.appendChild(document.createTextNode(r))}}i.exports=c}),"./stories/UIButton.story.tsx":(function(i,c,r){"use strict";var s=this&&this.__createBinding||(Object.create?(function(d,p,f,I){I===void 0&&(I=f);var v=Object.getOwnPropertyDescriptor(p,f);(!v||("get"in v?!p.__esModule:v.writable||v.configurable))&&(v={enumerable:!0,get:function(){return p[f]}}),Object.defineProperty(d,I,v)}):(function(d,p,f,I){I===void 0&&(I=f),d[I]=p[f]})),o=this&&this.__setModuleDefault||(Object.create?(function(d,p){Object.defineProperty(d,"default",{enumerable:!0,value:p})}):function(d,p){d.default=p}),a=this&&this.__importStar||(function(){var d=function(p){return d=Object.getOwnPropertyNames||function(f){var I=[];for(var v in f)Object.prototype.hasOwnProperty.call(f,v)&&(I[I.length]=v);return I},d(p)};return function(p){if(p&&p.__esModule)return p;var f={};if(p!=null)for(var I=d(p),v=0;v<I.length;v++)I[v]!=="default"&&s(f,p,I[v]);return o(f,p),f}})();Object.defineProperty(c,"__esModule",{value:!0}),c.defaultUsage=void 0;const e=a(r("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=r("../../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"),u=r("./src/components/UIButton/index.tsx"),y=r("./src/components/UIContextualMenu/index.tsx"),n=r("./src/components/Icons.tsx"),h=r("./src/components/UITreeDropdown/index.tsx");(0,n.initIcons)(),c.default={title:"Basic Inputs/Buttons"};const m={childrenGap:40},l=()=>{const[d,p]=(0,e.useState)(""),[f,I]=(0,e.useState)({btn1:!0,btn2:!0,btn3:!0}),v=b=>{p(b)},k=b=>{const S=w(C({},f),{[b]:!f[b]});I(S)},U=(b,S,_)=>{const B={key:b,text:S};return _&&(B.iconProps={iconName:n.UiIcons.GuidedDevelopment}),B},E=U("option1","option 1"),g=[U("option2","option 2"),U("option3","option 3")],x=g.map(b=>w(C({},b),{iconProps:{iconName:n.UiIcons.GuidedDevelopment}})),M=[x[0],w(C({},x[1]),{iconProps:void 0})],T=()=>[U("option1","option 1"),U("rename","Simulate rename"),{key:"",itemType:y.UIContextualMenuItemType.Divider},U("option3","option 3"),U("option4","option 4"),U("option5","option 5"),{key:"",itemType:y.UIContextualMenuItemType.Header,text:"Dummy header"},U("option6","option 6"),U("option7","option 7"),U("option8","option 8"),U("option10","option 10"),U("option11","option 11"),U("option12","option 12")],[P,A]=(0,e.useState)(T());return e.default.createElement(t.Stack,{tokens:m},e.default.createElement(t.Stack,{tokens:m},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Primary Button"),e.default.createElement(t.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UIDefaultButton,{primary:!0},"Primary button"),e.default.createElement(u.UIDefaultButton,{primary:!0,disabled:!0},"Primary disabled button"),e.default.createElement(u.UIDefaultButton,{primary:!0,iconProps:{iconName:n.UiIcons.Calendar}},"Primary button with icon"),e.default.createElement(u.UIDefaultButton,{primary:!0,checked:!0},"Primary checked button"))),e.default.createElement(t.Stack,{tokens:m},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Secondary Button"),e.default.createElement(t.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UIDefaultButton,null,"Secondary button"),e.default.createElement(u.UIDefaultButton,{disabled:!0},"Secondary disabled button"),e.default.createElement(u.UIDefaultButton,{iconProps:{iconName:n.UiIcons.Calendar}},"Secondary button with icon"),e.default.createElement(u.UIDefaultButton,{checked:!0},"Secondary checked button"))),e.default.createElement(t.Stack,{tokens:m},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"alert Button"),e.default.createElement(t.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UIDefaultButton,{alert:!0},"Alert button"),e.default.createElement(u.UIDefaultButton,{alert:!0,disabled:!0},"Alert disabled button"),e.default.createElement(u.UIDefaultButton,{alert:!0,iconProps:{iconName:n.UiIcons.Calendar}},"alert button with icon"),e.default.createElement(u.UIDefaultButton,{alert:!0,checked:!0},"Alert checked button"))),e.default.createElement(t.Stack,{tokens:m},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Transparent Button"),e.default.createElement(t.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UIDefaultButton,{transparent:!0},"Transparent button"),e.default.createElement(u.UIDefaultButton,{transparent:!0,disabled:!0},"Transparent disabled button"),e.default.createElement(u.UIDefaultButton,{transparent:!0,iconProps:{iconName:n.UiIcons.Calendar}},"Transparent button with icon"),e.default.createElement(u.UIDefaultButton,{transparent:!0,checked:!0},"Transparent checked button"))),e.default.createElement(t.Stack,{tokens:m},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Split Button"),e.default.createElement(t.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UISplitButton,{id:"test",callback:v.bind(this),menuItems:g,button:E}),e.default.createElement(u.UISplitButton,{id:"test2",callback:v.bind(this),menuItems:x,button:E}),e.default.createElement(u.UISplitButton,{id:"test3",callback:b=>{if(b==="rename"){const S=T(),_=S.find(B=>B.key==="rename");_&&(_.text="Renamed"),A(S)}v(b)},menuItems:P,button:E}),e.default.createElement("span",null,"selection: ",d))),e.default.createElement(t.Stack,{tokens:m},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Icon Button"),e.default.createElement(t.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UIIconButton,{id:"undo-button-action",iconProps:{iconName:n.UiIcons.Undo},title:"Undo"}),e.default.createElement(u.UIIconButton,{id:"add-button-action",iconProps:{iconName:n.UiIcons.Add},title:"Undo"}),e.default.createElement(u.UIIconButton,{id:"wide-button-action",sizeType:u.UIIconButtonSizes.Wide,iconProps:{iconName:n.UiIcons.QuestionMarkWithChevron},title:"QuestionMarkWithChevron"}),e.default.createElement(u.UIIconButton,{id:"undo-disabled-button-action",iconProps:{iconName:n.UiIcons.Source},disabled:!0,title:"Undo"}))),e.default.createElement(t.Stack,{tokens:m},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Icon Button - Checked"),e.default.createElement(t.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UIIconButton,{id:"btn1",iconProps:{iconName:n.UiIcons.Undo},checked:f.btn1,onClick:k.bind(window,"btn1"),title:"Undo"}),e.default.createElement(u.UIIconButton,{id:"btn2",checked:f.btn2,iconProps:{iconName:n.UiIcons.LayoutLeft},onClick:k.bind(window,"btn2"),title:"LayoutLeft"}),e.default.createElement(u.UIIconButton,{id:"btn3",sizeType:u.UIIconButtonSizes.Wide,checked:f.btn3,iconProps:{iconName:n.UiIcons.QuestionMarkWithChevron},onClick:k.bind(window,"btn3"),title:"Wide"}))),e.default.createElement(t.Stack,{tokens:m},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Action Button"),e.default.createElement(t.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UIActionButton,{iconProps:{iconName:n.UiIcons.Calendar}},"Standard Action"),e.default.createElement(u.UIActionButton,{disabled:!0,iconProps:{iconName:n.UiIcons.Calendar}},"Standard Action - disabled"),e.default.createElement(u.UIActionButton,{iconProps:{iconName:n.UiIcons.Bulb}},"Icon with color"),e.default.createElement(u.UIActionButton,{disabled:!0,iconProps:{iconName:n.UiIcons.Bulb}},"Icon with color - disabled")),e.default.createElement(t.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UIActionButton,{iconProps:{iconName:n.UiIcons.Bulb},menuProps:{directionalHint:h.UIDirectionalHint.bottomRightEdge,directionalHintFixed:!1,items:x}},"Button with menu"),e.default.createElement(u.UIActionButton,{iconProps:{iconName:n.UiIcons.Bulb},menuProps:{directionalHint:h.UIDirectionalHint.bottomRightEdge,directionalHintFixed:!1,items:M}},"Button with mixture menu"))),e.default.createElement(t.Stack,{tokens:m},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Small Button"),e.default.createElement(t.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UISmallButton,{primary:!0},"Clear All"))),e.default.createElement(t.Stack,{tokens:m},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Dropdown Button"),e.default.createElement(t.Stack,{horizontal:!0,tokens:m},e.default.createElement(u.UIIconButton,{iconProps:{iconName:n.UiIcons.Add},menuProps:{directionalHint:h.UIDirectionalHint.bottomRightEdge,directionalHintFixed:!1,items:g}}),e.default.createElement(u.UIIconButton,{iconProps:{iconName:n.UiIcons.Add},menuProps:{directionalHint:h.UIDirectionalHint.bottomRightEdge,directionalHintFixed:!1,items:x}}),e.default.createElement(u.UIIconButton,{iconProps:{iconName:n.UiIcons.Add},menuProps:{directionalHint:h.UIDirectionalHint.bottomRightEdge,directionalHintFixed:!1,items:P}}))))};c.defaultUsage=l}),"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/index.js":((i,c,r)=>{var s=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v1.js"),o=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v4.js"),a=o;a.v1=s,a.v4=o,i.exports=a}),"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/bytesToUuid.js":(i=>{for(var c=[],r=0;r<256;++r)c[r]=(r+256).toString(16).substr(1);function s(o,a){var e=a||0,t=c;return[t[o[e++]],t[o[e++]],t[o[e++]],t[o[e++]],"-",t[o[e++]],t[o[e++]],"-",t[o[e++]],t[o[e++]],"-",t[o[e++]],t[o[e++]],"-",t[o[e++]],t[o[e++]],t[o[e++]],t[o[e++]],t[o[e++]],t[o[e++]]].join("")}i.exports=s}),"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/rng-browser.js":(i=>{var c=typeof crypto!="undefined"&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto)||typeof msCrypto!="undefined"&&typeof window.msCrypto.getRandomValues=="function"&&msCrypto.getRandomValues.bind(msCrypto);if(c){var r=new Uint8Array(16);i.exports=function(){return c(r),r}}else{var s=new Array(16);i.exports=function(){for(var a=0,e;a<16;a++)(a&3)===0&&(e=Math.random()*4294967296),s[a]=e>>>((a&3)<<3)&255;return s}}}),"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v1.js":((i,c,r)=>{var s=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/rng-browser.js"),o=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/bytesToUuid.js"),a,e,t=0,u=0;function y(n,h,m){var l=h&&m||0,d=h||[];n=n||{};var p=n.node||a,f=n.clockseq!==void 0?n.clockseq:e;if(p==null||f==null){var I=s();p==null&&(p=a=[I[0]|1,I[1],I[2],I[3],I[4],I[5]]),f==null&&(f=e=(I[6]<<8|I[7])&16383)}var v=n.msecs!==void 0?n.msecs:new Date().getTime(),k=n.nsecs!==void 0?n.nsecs:u+1,U=v-t+(k-u)/1e4;if(U<0&&n.clockseq===void 0&&(f=f+1&16383),(U<0||v>t)&&n.nsecs===void 0&&(k=0),k>=1e4)throw new Error("uuid.v1(): Can't create more than 10M uuids/sec");t=v,u=k,e=f,v+=122192928e5;var E=((v&268435455)*1e4+k)%4294967296;d[l++]=E>>>24&255,d[l++]=E>>>16&255,d[l++]=E>>>8&255,d[l++]=E&255;var g=v/4294967296*1e4&268435455;d[l++]=g>>>8&255,d[l++]=g&255,d[l++]=g>>>24&15|16,d[l++]=g>>>16&255,d[l++]=f>>>8|128,d[l++]=f&255;for(var x=0;x<6;++x)d[l+x]=p[x];return h||o(d)}i.exports=y}),"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v4.js":((i,c,r)=>{var s=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/rng-browser.js"),o=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/bytesToUuid.js");function a(e,t,u){var y=t&&u||0;typeof e=="string"&&(t=e==="binary"?new Array(16):null,e=null),e=e||{};var n=e.random||(e.rng||s)();if(n[6]=n[6]&15|64,n[8]=n[8]&63|128,t)for(var h=0;h<16;++h)t[y+h]=n[h];return t||o(n)}i.exports=a})}]);})();
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
(()=>{var T=Object.defineProperty,O=Object.defineProperties;var P=Object.getOwnPropertyDescriptors;var C=Object.getOwnPropertySymbols;var U=Object.prototype.hasOwnProperty,D=Object.prototype.propertyIsEnumerable;var E=(c,o,n)=>o in c?T(c,o,{enumerable:!0,configurable:!0,writable:!0,value:n}):c[o]=n,g=(c,o)=>{for(var n in o||(o={}))U.call(o,n)&&E(c,n,o[n]);if(C)for(var n of C(o))D.call(o,n)&&E(c,n,o[n]);return c},S=(c,o)=>O(c,P(o));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[239],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/styles/_shadows.scss":((c,o,n)=>{var _=n("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js"),r=n("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js"),s=r(_);s.push([c.id,":root{--ui-box-shadow-small: 0 4px 8px 0 var(--vscode-widget-shadow);--ui-box-shadow-medium: 0 6px 12px 0 var(--vscode-widget-shadow);--ui-box-shadow-large: 0 10px 20px 0 var(--vscode-widget-shadow)}.ui-box-shadow-small{box-shadow:var(--ui-box-shadow-small)}.ui-box-shadow-medium{box-shadow:var(--ui-box-shadow-medium)}.ui-box-shadow-large{box-shadow:var(--ui-box-shadow-large)}",""]),c.exports=s}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js":(c=>{"use strict";c.exports=function(o){var n=[];return n.toString=function(){return this.map(function(r){var s="",e=typeof r[5]!="undefined";return r[4]&&(s+="@supports (".concat(r[4],") {")),r[2]&&(s+="@media ".concat(r[2]," {")),e&&(s+="@layer".concat(r[5].length>0?" ".concat(r[5]):""," {")),s+=o(r),e&&(s+="}"),r[2]&&(s+="}"),r[4]&&(s+="}"),s}).join("")},n.i=function(r,s,e,t,a){typeof r=="string"&&(r=[[null,r,void 0]]);var l={};if(e)for(var m=0;m<this.length;m++){var b=this[m][0];b!=null&&(l[b]=!0)}for(var f=0;f<r.length;f++){var d=[].concat(r[f]);e&&l[d[0]]||(typeof a!="undefined"&&(typeof d[5]=="undefined"||(d[1]="@layer".concat(d[5].length>0?" ".concat(d[5]):""," {").concat(d[1],"}")),d[5]=a),s&&(d[2]&&(d[1]="@media ".concat(d[2]," {").concat(d[1],"}")),d[2]=s),t&&(d[4]?(d[1]="@supports (".concat(d[4],") {").concat(d[1],"}"),d[4]=t):d[4]="".concat(t)),n.push(d))}},n}}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js":(c=>{"use strict";c.exports=function(o){return o[1]}}),"./src/styles/_shadows.scss":((c,o,n)=>{"use strict";n.r(o),n.d(o,{default:()=>I});var _=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),r=n.n(_),s=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js"),e=n.n(s),t=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js"),a=n.n(t),l=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),m=n.n(l),b=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js"),f=n.n(b),d=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js"),p=n.n(d),i=n("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/styles/_shadows.scss"),u=n.n(i),y={};for(const v in i)v!=="default"&&(y[v]=()=>i[v]);n.d(o,y);var h={};h.styleTagTransform=p(),h.setAttributes=m(),h.insert=a().bind(null,"head"),h.domAPI=e(),h.insertStyleElement=f();var w=r()(u(),h);const I=u()&&u().locals?u().locals:void 0}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":(c=>{"use strict";var o=[];function n(s){for(var e=-1,t=0;t<o.length;t++)if(o[t].identifier===s){e=t;break}return e}function _(s,e){for(var t={},a=[],l=0;l<s.length;l++){var m=s[l],b=e.base?m[0]+e.base:m[0],f=t[b]||0,d="".concat(b," ").concat(f);t[b]=f+1;var p=n(d),i={css:m[1],media:m[2],sourceMap:m[3],supports:m[4],layer:m[5]};if(p!==-1)o[p].references++,o[p].updater(i);else{var u=r(i,e);e.byIndex=l,o.splice(l,0,{identifier:d,updater:u,references:1})}a.push(d)}return a}function r(s,e){var t=e.domAPI(e);t.update(s);var a=function(m){if(m){if(m.css===s.css&&m.media===s.media&&m.sourceMap===s.sourceMap&&m.supports===s.supports&&m.layer===s.layer)return;t.update(s=m)}else t.remove()};return a}c.exports=function(s,e){e=e||{},s=s||[];var t=_(s,e);return function(l){l=l||[];for(var m=0;m<t.length;m++){var b=t[m],f=n(b);o[f].references--}for(var d=_(l,e),p=0;p<t.length;p++){var i=t[p],u=n(i);o[u].references===0&&(o[u].updater(),o.splice(u,1))}t=d}}}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js":(c=>{"use strict";var o={};function n(r){if(typeof o[r]=="undefined"){var s=document.querySelector(r);if(window.HTMLIFrameElement&&s instanceof window.HTMLIFrameElement)try{s=s.contentDocument.head}catch(e){s=null}o[r]=s}return o[r]}function _(r,s){var e=n(r);if(!e)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");e.appendChild(s)}c.exports=_}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js":(c=>{"use strict";function o(n){var _=document.createElement("style");return n.setAttributes(_,n.attributes),n.insert(_,n.options),_}c.exports=o}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":((c,o,n)=>{"use strict";function _(r){var s=n.nc;s&&r.setAttribute("nonce",s)}c.exports=_}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js":(c=>{"use strict";function o(r,s,e){var t="";e.supports&&(t+="@supports (".concat(e.supports,") {")),e.media&&(t+="@media ".concat(e.media," {"));var a=typeof e.layer!="undefined";a&&(t+="@layer".concat(e.layer.length>0?" ".concat(e.layer):""," {")),t+=e.css,a&&(t+="}"),e.media&&(t+="}"),e.supports&&(t+="}");var l=e.sourceMap;l&&typeof btoa!="undefined"&&(t+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(l))))," */")),s.styleTagTransform(t,r,s.options)}function n(r){if(r.parentNode===null)return!1;r.parentNode.removeChild(r)}function _(r){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var s=r.insertStyleElement(r);return{update:function(t){o(s,r,t)},remove:function(){n(s)}}}c.exports=_}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js":(c=>{"use strict";function o(n,_){if(_.styleSheet)_.styleSheet.cssText=n;else{for(;_.firstChild;)_.removeChild(_.firstChild);_.appendChild(document.createTextNode(n))}}c.exports=o}),"./src/components/UICallout/CalloutCollisionTransform.ts":((c,o)=>{"use strict";Object.defineProperty(o,"__esModule",{value:!0}),o.CalloutCollisionTransform=void 0;const n={target:".ms-Dialog-actions",container:".ms-Dialog-main",absolute:!0,minPagePadding:10},_=20;class r{constructor(e,t,a=n){this.originalStyle={},this.source=e,this.callout=t,this.props=a,this.applyTransformation=this.applyTransformation.bind(this),this.resetTransformation=this.resetTransformation.bind(this),this.preventDismissOnEvent=this.preventDismissOnEvent.bind(this)}createPlaceholder(e){const t=document.createElement("div");return t.classList.add("ts-Callout-transformation"),t.style.height=`${e}px`,t}getElements(){const e=this.source.current,t=e==null?void 0:e.closest(this.props.container);if(t&&e){const a=t==null?void 0:t.querySelector(this.props.target);if(a){const l={container:{dom:t,rect:t.getBoundingClientRect()},target:{dom:a,rect:a.getBoundingClientRect()},source:{dom:e,rect:e.getBoundingClientRect()}},m=this.callout.current;return m&&(l.callout={dom:m,rect:m.getBoundingClientRect()}),l}}}applyTransformation(){const e=this.getElements();if(!e)return;const{container:t,target:a,callout:l,source:m}=e;if(l){const b=window.innerHeight-n.minPagePadding,f=l.rect.height,d=m.rect.bottom;let p=d+f-a.rect.top,i=d+l.rect.height;if(p<=0||i>=b)return;if(i+=a.rect.height,i<=b&&(p+=_),this.props.absolute){const u=t.dom.style;this.originalStyle={transform:u.transform,position:u.position,top:u.top,left:u.left},u.transform="",u.position="absolute",u.top=`${t.rect.top}px`,u.left=`${t.rect.left}px`}this.placeholder=this.createPlaceholder(p),a.dom.prepend(this.placeholder)}}resetTransformation(){const e=this.getElements();if(!e)return;const{container:t}=e;for(const a in this.originalStyle){const l=this.originalStyle[a];typeof l=="string"&&(t.dom.style[a]=l)}this.originalStyle={},this.placeholder&&(this.placeholder.remove(),this.placeholder=void 0)}preventDismissOnEvent(e){const t=this.getElements();return!!(e.type==="focus"&&(t!=null&&t.target.dom.contains(e.target)))}}o.CalloutCollisionTransform=r}),"./src/components/UICallout/UICallout.tsx":(function(c,o,n){"use strict";var _=this&&this.__importDefault||function(f){return f&&f.__esModule?f:{default:f}};Object.defineProperty(o,"__esModule",{value:!0}),o.UICallout=o.getCalloutStyle=o.UICalloutContentPadding=o.CALLOUT_STYLES=void 0;const r=_(n("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=n("../../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"),e=n("./src/utilities/index.ts");n("./src/styles/_shadows.scss"),o.CALLOUT_STYLES={background:"var(--vscode-editorWidget-background)",boxShadow:"var(--ui-box-shadow-small)",borderColor:"var(--vscode-editorWidget-border)",text:"var(--vscode-editorWidget-foreground)",borderRadius:2};var t;(function(f){f.None="None",f.Standard="Standard"})(t||(o.UICalloutContentPadding=t={}));const a=new Map([[t.Standard,8]]),l=(f,d)=>typeof f=="object"&&typeof f[d]=="object"?f[d]:{},m=f=>{var d,p;return{root:g({boxShadow:o.CALLOUT_STYLES.boxShadow,backgroundColor:o.CALLOUT_STYLES.background,borderRadius:o.CALLOUT_STYLES.borderRadius,border:`1px solid ${o.CALLOUT_STYLES.borderColor}`},l(f.styles,"root")),beak:g({backgroundColor:o.CALLOUT_STYLES.background,boxShadow:o.CALLOUT_STYLES.boxShadow},l(f.styles,"beak")),beakCurtain:g({backgroundColor:o.CALLOUT_STYLES.background,borderRadius:o.CALLOUT_STYLES.borderRadius},l(f.styles,"beakCurtain")),calloutMain:g({backgroundColor:"transparent",color:o.CALLOUT_STYLES.text,borderRadius:o.CALLOUT_STYLES.borderRadius,minWidth:(d=f.calloutMinWidth)!=null?d:300,boxSizing:"border-box",padding:a.get((p=f.contentPadding)!=null?p:t.None)},l(f.styles,"calloutMain")),container:l(f.styles,"container")}};o.getCalloutStyle=m;class b extends r.default.Component{constructor(d){super(d),this.onKeyDown=this.onKeyDown.bind(this)}onKeyDown(d){const{onKeyDown:p,focusTargetSiblingOnTabPress:i,target:u}=this.props;if(i&&d.key==="Tab"&&u){let y=null;if(typeof u=="string"){const h=(0,s.getDocument)();y=h==null?void 0:h.querySelector(u)}else"getBoundingClientRect"in u&&(0,e.isHTMLElement)(u)&&(y=u);y&&(0,e.focusToSibling)(y,!d.shiftKey)&&(d.stopPropagation(),d.preventDefault())}p==null||p(d)}render(){return r.default.createElement(s.Callout,S(g({},this.props),{onKeyDown:this.onKeyDown,styles:(0,o.getCalloutStyle)(this.props)}),this.props.children)}}o.UICallout=b}),"./src/components/UICallout/index.tsx":(function(c,o,n){"use strict";var _=this&&this.__createBinding||(Object.create?(function(s,e,t,a){a===void 0&&(a=t);var l=Object.getOwnPropertyDescriptor(e,t);(!l||("get"in l?!e.__esModule:l.writable||l.configurable))&&(l={enumerable:!0,get:function(){return e[t]}}),Object.defineProperty(s,a,l)}):(function(s,e,t,a){a===void 0&&(a=t),s[a]=e[t]})),r=this&&this.__exportStar||function(s,e){for(var t in s)t!=="default"&&!Object.prototype.hasOwnProperty.call(e,t)&&_(e,s,t)};Object.defineProperty(o,"__esModule",{value:!0}),r(n("./src/components/UICallout/CalloutCollisionTransform.ts"),o),r(n("./src/components/UICallout/UICallout.tsx"),o)}),"./src/components/UIFocusZone/UIFocusTrapZone.tsx":(function(c,o,n){"use strict";var _=this&&this.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(o,"__esModule",{value:!0}),o.UIFocusTrapZone=void 0;const r=_(n("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=n("../../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");class e extends r.default.Component{constructor(a){super(a)}render(){return r.default.createElement(s.FocusTrapZone,g({},this.props),this.props.children)}}o.UIFocusTrapZone=e}),"./src/components/UIFocusZone/UIFocusZone.tsx":(function(c,o,n){"use strict";var _=this&&this.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(o,"__esModule",{value:!0}),o.UIFocusZone=o.UIFocusZoneTabbableElements=o.IFocusZone=o.UIFocusZoneProps=o.UIFocusZoneDirection=void 0;const r=_(n("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=n("../../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");Object.defineProperty(o,"UIFocusZoneProps",{enumerable:!0,get:function(){return s.IFocusZoneProps}}),Object.defineProperty(o,"UIFocusZoneDirection",{enumerable:!0,get:function(){return s.FocusZoneDirection}}),Object.defineProperty(o,"IFocusZone",{enumerable:!0,get:function(){return s.IFocusZone}}),Object.defineProperty(o,"UIFocusZoneTabbableElements",{enumerable:!0,get:function(){return s.FocusZoneTabbableElements}});class e extends r.default.Component{constructor(a){super(a)}render(){return r.default.createElement(s.FocusZone,g({},this.props),this.props.children)}}o.UIFocusZone=e}),"./src/components/UIFocusZone/index.tsx":(function(c,o,n){"use strict";var _=this&&this.__createBinding||(Object.create?(function(s,e,t,a){a===void 0&&(a=t);var l=Object.getOwnPropertyDescriptor(e,t);(!l||("get"in l?!e.__esModule:l.writable||l.configurable))&&(l={enumerable:!0,get:function(){return e[t]}}),Object.defineProperty(s,a,l)}):(function(s,e,t,a){a===void 0&&(a=t),s[a]=e[t]})),r=this&&this.__exportStar||function(s,e){for(var t in s)t!=="default"&&!Object.prototype.hasOwnProperty.call(e,t)&&_(e,s,t)};Object.defineProperty(o,"__esModule",{value:!0}),r(n("./src/components/UIFocusZone/UIFocusTrapZone.tsx"),o),r(n("./src/components/UIFocusZone/UIFocusZone.tsx"),o)}),"./stories/UICallout.story.tsx":(function(c,o,n){"use strict";var _=this&&this.__createBinding||(Object.create?(function(p,i,u,y){y===void 0&&(y=u);var h=Object.getOwnPropertyDescriptor(i,u);(!h||("get"in h?!i.__esModule:h.writable||h.configurable))&&(h={enumerable:!0,get:function(){return i[u]}}),Object.defineProperty(p,y,h)}):(function(p,i,u,y){y===void 0&&(y=u),p[y]=i[u]})),r=this&&this.__setModuleDefault||(Object.create?(function(p,i){Object.defineProperty(p,"default",{enumerable:!0,value:i})}):function(p,i){p.default=i}),s=this&&this.__importStar||(function(){var p=function(i){return p=Object.getOwnPropertyNames||function(u){var y=[];for(var h in u)Object.prototype.hasOwnProperty.call(u,h)&&(y[y.length]=h);return y},p(i)};return function(i){if(i&&i.__esModule)return i;var u={};if(i!=null)for(var y=p(i),h=0;h<y.length;h++)y[h]!=="default"&&_(u,i,y[h]);return r(u,i),u}})();Object.defineProperty(o,"__esModule",{value:!0}),o.Callout=void 0;const e=s(n("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=n("./src/components/UIButton/index.tsx"),a=n("./src/components/UICallout/index.tsx"),l=n("./src/components/UIFocusZone/index.tsx"),m=n("./src/components/Icons.tsx");o.default={title:"Dropdowns/Callout"};const b=p=>{const{id:i}=p,[u,y]=(0,e.useState)(!1),h=()=>{y(!u)};return e.default.createElement("div",null,e.default.createElement(t.UIIconButton,{id:i,iconProps:{iconName:m.UiIcons.Bulb},checked:u,onClick:h}),u&&e.default.createElement(a.UICallout,{target:`#${i}`,isBeakVisible:!0,beakWidth:5,directionalHint:4,onDismiss:()=>h(),calloutWidth:300,calloutMinWidth:300,contentPadding:a.UICalloutContentPadding.Standard},e.default.createElement("div",null,"lorem ipsum dolor sit amet consectetur adipiscing elit sed do eiusmod tempor incididunt ut labore et dolore magna aliqua ut enim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur excepteur sint occaecat cupidatat non proident sunt in culpa qui officia deserunt")))},f=p=>{const{id:i}=p,[u,y]=(0,e.useState)(!1),h=()=>{y(!u)};return e.default.createElement("div",null,e.default.createElement(t.UIDefaultButton,{id:i,iconProps:{iconName:m.UiIcons.Bulb},checked:u,onClick:h},"Open"),u&&e.default.createElement(a.UICallout,{target:`#${i}`,isBeakVisible:!0,setInitialFocus:!0,beakWidth:5,directionalHint:4,onDismiss:()=>h(),calloutWidth:300,calloutMinWidth:300,contentPadding:a.UICalloutContentPadding.Standard,focusTargetSiblingOnTabPress:!0},e.default.createElement("div",null,e.default.createElement(l.UIFocusZone,null,e.default.createElement(t.UIDefaultButton,{onClick:h},"Option 1"),e.default.createElement(t.UIDefaultButton,{onClick:h},"Option 2"),e.default.createElement(t.UIDefaultButton,{onClick:h},"Option 3")))))},d=()=>e.default.createElement("div",null,e.default.createElement(b,{id:"callout-with-text-id"}),e.default.createElement(f,{id:"callout-with-items-1-id"}),e.default.createElement(f,{id:"callout-with-items-2-id"}));o.Callout=d})}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var T=Object.defineProperty,M=Object.defineProperties;var R=Object.getOwnPropertyDescriptors;var h=Object.getOwnPropertySymbols;var P=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable;var I=(u,e,s)=>e in u?T(u,e,{enumerable:!0,configurable:!0,writable:!0,value:s}):u[e]=s,D=(u,e)=>{for(var s in e||(e={}))P.call(e,s)&&I(u,s,e[s]);if(h)for(var s of h(e))w.call(e,s)&&I(u,s,e[s]);return u},E=(u,e)=>M(u,R(e));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[43],{"./stories/UICalloutCollisionTransform.story.tsx":(function(u,e,s){var x=this&&this.__createBinding||(Object.create?(function(t,a,r,l){l===void 0&&(l=r);var o=Object.getOwnPropertyDescriptor(a,r);(!o||("get"in o?!a.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return a[r]}}),Object.defineProperty(t,l,o)}):(function(t,a,r,l){l===void 0&&(l=r),t[l]=a[r]})),f=this&&this.__setModuleDefault||(Object.create?(function(t,a){Object.defineProperty(t,"default",{enumerable:!0,value:a})}):function(t,a){t.default=a}),m=this&&this.__importStar||(function(){var t=function(a){return t=Object.getOwnPropertyNames||function(r){var l=[];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(l[l.length]=o);return l},t(a)};return function(a){if(a&&a.__esModule)return a;var r={};if(a!=null)for(var l=t(a),o=0;o<l.length;o++)l[o]!=="default"&&x(r,a,l[o]);return f(r,a),r}})();Object.defineProperty(e,"__esModule",{value:!0}),e.collisionTransformInDialog=void 0;const n=m(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),k=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"),i=s("./src/components/index.tsx"),p=s("./test/__mock__/select-data.ts");e.default={title:"Dialogs/Dialogs"};var d;(function(t){t.ComboBox="ComboBox",t.Dropdown="Dropdown",t.Callout="Callout"})(d||(d={}));const O=Object.values(d).map(t=>({key:t,text:t})),_=t=>{const a=n.default.useRef(null),r=n.default.useRef(null),l=n.default.useRef(new i.CalloutCollisionTransform(a,r)),{id:o}=t,[y,c]=(0,n.useState)(!1);return n.default.createElement(n.default.Fragment,null,n.default.createElement("div",{ref:a},n.default.createElement(i.UITextInput,{id:o,onClick:()=>{c(!y)}})),n.default.createElement(i.UICallout,{target:`#${o}`,hidden:!y,isBeakVisible:!1,onDismiss:()=>{c(!y),l.current.resetTransformation()},preventDismissOnEvent:l.current.preventDismissOnEvent,onPositioned:l.current.applyTransformation,popupProps:{ref:r}},n.default.createElement("div",{style:{height:150,width:300,backgroundColor:"green"}})))},v=t=>n.default.createElement(i.UIComboBox,E(D({},t),{ref:void 0,calloutProps:{preventDismissOnEvent:()=>(console.log("custom preventDismissOnEvent"),!1),layerProps:{onLayerDidMount:()=>(console.log("custom onLayerDidMount"),!1),onLayerWillUnmount:()=>(console.log("custom onLayerWillUnmount"),!1)}}})),S=t=>n.default.createElement(i.UIDropdown,E(D({},t),{ref:void 0,calloutProps:{preventDismissOnEvent:()=>(console.log("custom preventDismissOnEvent"),!1),layerProps:{onLayerDidMount:()=>(console.log("custom onLayerDidMount"),!1),onLayerWillUnmount:()=>(console.log("custom onLayerWillUnmount"),!1)}}})),B=(t,a,r=!1)=>{const l=[];for(let o=0;o<6;o++){let y;if(t===d.Callout)y=n.default.createElement(_,{key:o,id:`Dummy-${o}`});else{let c;r?c=t===d.ComboBox?v:S:c=t===d.ComboBox?i.UIComboBox:i.UIDropdown,y=n.default.createElement(c,{key:o,label:"Dummy",highlight:!0,options:p.data,multiSelect:!0,calloutCollisionTransformation:a})}l.push(y)}return l},U=()=>{const[t,a]=(0,n.useState)(!1),[r,l]=(0,n.useState)(!0),[o,y]=(0,n.useState)(d.ComboBox),[c,A]=(0,n.useState)(!1),g=()=>{a(!t)};return n.default.createElement(n.default.Fragment,null,n.default.createElement("h3",null,"Settings"),n.default.createElement("div",{style:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:"20px",maxWidth:"1200px",marginBottom:"20px"}},n.default.createElement(i.UICheckbox,{label:"Transformation is enabled",checked:r,onChange:()=>{l(!r)},styles:{label:{alignItems:"center"}}}),n.default.createElement(i.UIDropdown,{label:"Inner components",options:O,selectedKey:o,onChange:(L,C)=>{const b=C==null?void 0:C.key;typeof b=="string"&&y(b||d.ComboBox)}}),n.default.createElement(i.UICheckbox,{label:"Use overwritten components",checked:c,onChange:()=>{A(!c)},styles:{label:{alignItems:"center"}}})),n.default.createElement(i.UIDefaultButton,{onClick:g,primary:!0},"Open Dialog"),n.default.createElement(i.UIDialog,{isOpen:t,isOpenAnimated:!0,isBlocking:!0,title:"Header Title",acceptButtonText:"Accept",cancelButtonText:"Cancel",modalProps:{dragOptions:{moveMenuItemText:"Move",closeMenuItemText:"Close",menu:k.ContextualMenu,keepInBounds:!0}},onCancel:g,onDismiss:g},B(d[o],r,c)))};e.collisionTransformInDialog=U}),"./test/__mock__/select-data.ts":((u,e,s)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.groupsData=e.shortData=e.data=void 0;const x=s("./src/components/index.tsx");e.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"}],e.shortData=[e.data[0],e.data[1],e.data[2],e.data[3],e.data[4]];const f={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"]};e.groupsData=[];for(const m in f){e.groupsData.push({key:m,text:m.charAt(0).toUpperCase()+m.slice(1),itemType:x.UISelectableOptionMenuItemType.Header});const n=f[m];for(const k of n){const i=e.data.find(p=>p.key===k);i&&e.groupsData.push(i)}}})}]);})();
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
(()=>{var S=Object.defineProperty,k=Object.defineProperties;var O=Object.getOwnPropertyDescriptors;var M=Object.getOwnPropertySymbols;var x=Object.prototype.hasOwnProperty,A=Object.prototype.propertyIsEnumerable;var C=(c,_,e)=>_ in c?S(c,_,{enumerable:!0,configurable:!0,writable:!0,value:e}):c[_]=e,h=(c,_)=>{for(var e in _||(_={}))x.call(_,e)&&C(c,e,_[e]);if(M)for(var e of M(_))A.call(_,e)&&C(c,e,_[e]);return c},E=(c,_)=>k(c,O(_));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[558],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/components/UIIcon/UIIcon.scss":((c,_,e)=>{var l=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js"),t=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js"),s=t(l);s.push([c.id,".ts-icon{fill:var(--vscode-foreground)}",""]),c.exports=s}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/helper/ValidationMessage/MessageWrapper.scss":((c,_,e)=>{var l=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js"),t=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js"),s=t(l);s.push([c.id,".ts-message-wrapper .ts-message-body{display:flex;font-size:11px}.ts-message-wrapper .ts-message-body>span{padding-top:1px}.ts-message-wrapper .ts-message-body>i{margin:1px 2px 0 0}.ts-message-wrapper--error .ts-message-body{color:var(--vscode-errorForeground)}.ts-message-wrapper--warning .ts-message-body{color:var(--vscode-editorMarkerNavigationWarning-background)}.ts-message-wrapper--info .ts-message-body{color:var(--vscode-inputValidation-infoBorder)}.ts-message-wrapper--info .ts-icon svg path{fill:var(--vscode-inputValidation-infoBorder)}.ts-message-wrapper--horizontal{display:flex}.ts-message-wrapper--horizontal .ts-message-body{align-self:flex-end;margin:0 0 7px 5px}",""]),c.exports=s}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js":(c=>{"use strict";c.exports=function(_){var e=[];return e.toString=function(){return this.map(function(t){var s="",o=typeof t[5]!="undefined";return t[4]&&(s+="@supports (".concat(t[4],") {")),t[2]&&(s+="@media ".concat(t[2]," {")),o&&(s+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),s+=_(t),o&&(s+="}"),t[2]&&(s+="}"),t[4]&&(s+="}"),s}).join("")},e.i=function(t,s,o,n,a){typeof t=="string"&&(t=[[null,t,void 0]]);var r={};if(o)for(var d=0;d<this.length;d++){var u=this[d][0];u!=null&&(r[u]=!0)}for(var p=0;p<t.length;p++){var i=[].concat(t[p]);o&&r[i[0]]||(typeof a!="undefined"&&(typeof i[5]=="undefined"||(i[1]="@layer".concat(i[5].length>0?" ".concat(i[5]):""," {").concat(i[1],"}")),i[5]=a),s&&(i[2]&&(i[1]="@media ".concat(i[2]," {").concat(i[1],"}")),i[2]=s),n&&(i[4]?(i[1]="@supports (".concat(i[4],") {").concat(i[1],"}"),i[4]=n):i[4]="".concat(n)),e.push(i))}},e}}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js":(c=>{"use strict";c.exports=function(_){return _[1]}}),"./src/components/UIIcon/UIIcon.scss":((c,_,e)=>{"use strict";e.r(_),e.d(_,{default:()=>I});var l=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),t=e.n(l),s=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js"),o=e.n(s),n=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js"),a=e.n(n),r=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),d=e.n(r),u=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js"),p=e.n(u),i=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js"),y=e.n(i),g=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/components/UIIcon/UIIcon.scss"),m=e.n(g),v={};for(const b in g)b!=="default"&&(v[b]=()=>g[b]);e.d(_,v);var f={};f.styleTagTransform=y(),f.setAttributes=d(),f.insert=a().bind(null,"head"),f.domAPI=o(),f.insertStyleElement=p();var P=t()(m(),f);const I=m()&&m().locals?m().locals:void 0}),"./src/helper/ValidationMessage/MessageWrapper.scss":((c,_,e)=>{"use strict";e.r(_),e.d(_,{default:()=>I});var l=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),t=e.n(l),s=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js"),o=e.n(s),n=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js"),a=e.n(n),r=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),d=e.n(r),u=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js"),p=e.n(u),i=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js"),y=e.n(i),g=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/helper/ValidationMessage/MessageWrapper.scss"),m=e.n(g),v={};for(const b in g)b!=="default"&&(v[b]=()=>g[b]);e.d(_,v);var f={};f.styleTagTransform=y(),f.setAttributes=d(),f.insert=a().bind(null,"head"),f.domAPI=o(),f.insertStyleElement=p();var P=t()(m(),f);const I=m()&&m().locals?m().locals:void 0}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":(c=>{"use strict";var _=[];function e(s){for(var o=-1,n=0;n<_.length;n++)if(_[n].identifier===s){o=n;break}return o}function l(s,o){for(var n={},a=[],r=0;r<s.length;r++){var d=s[r],u=o.base?d[0]+o.base:d[0],p=n[u]||0,i="".concat(u," ").concat(p);n[u]=p+1;var y=e(i),g={css:d[1],media:d[2],sourceMap:d[3],supports:d[4],layer:d[5]};if(y!==-1)_[y].references++,_[y].updater(g);else{var m=t(g,o);o.byIndex=r,_.splice(r,0,{identifier:i,updater:m,references:1})}a.push(i)}return a}function t(s,o){var n=o.domAPI(o);n.update(s);var a=function(d){if(d){if(d.css===s.css&&d.media===s.media&&d.sourceMap===s.sourceMap&&d.supports===s.supports&&d.layer===s.layer)return;n.update(s=d)}else n.remove()};return a}c.exports=function(s,o){o=o||{},s=s||[];var n=l(s,o);return function(r){r=r||[];for(var d=0;d<n.length;d++){var u=n[d],p=e(u);_[p].references--}for(var i=l(r,o),y=0;y<n.length;y++){var g=n[y],m=e(g);_[m].references===0&&(_[m].updater(),_.splice(m,1))}n=i}}}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js":(c=>{"use strict";var _={};function e(t){if(typeof _[t]=="undefined"){var s=document.querySelector(t);if(window.HTMLIFrameElement&&s instanceof window.HTMLIFrameElement)try{s=s.contentDocument.head}catch(o){s=null}_[t]=s}return _[t]}function l(t,s){var o=e(t);if(!o)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");o.appendChild(s)}c.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js":(c=>{"use strict";function _(e){var l=document.createElement("style");return e.setAttributes(l,e.attributes),e.insert(l,e.options),l}c.exports=_}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":((c,_,e)=>{"use strict";function l(t){var s=e.nc;s&&t.setAttribute("nonce",s)}c.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js":(c=>{"use strict";function _(t,s,o){var n="";o.supports&&(n+="@supports (".concat(o.supports,") {")),o.media&&(n+="@media ".concat(o.media," {"));var a=typeof o.layer!="undefined";a&&(n+="@layer".concat(o.layer.length>0?" ".concat(o.layer):""," {")),n+=o.css,a&&(n+="}"),o.media&&(n+="}"),o.supports&&(n+="}");var r=o.sourceMap;r&&typeof btoa!="undefined"&&(n+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(r))))," */")),s.styleTagTransform(n,t,s.options)}function e(t){if(t.parentNode===null)return!1;t.parentNode.removeChild(t)}function l(t){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var s=t.insertStyleElement(t);return{update:function(n){_(s,t,n)},remove:function(){e(s)}}}c.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js":(c=>{"use strict";function _(e,l){if(l.styleSheet)l.styleSheet.cssText=e;else{for(;l.firstChild;)l.removeChild(l.firstChild);l.appendChild(document.createTextNode(e))}}c.exports=_}),"./src/components/UICheckbox/UICheckbox.tsx":(function(c,_,e){"use strict";var l=this&&this.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(_,"__esModule",{value:!0}),_.UICheckbox=void 0;const t=l(e("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=e("../../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=e("./src/helper/ValidationMessage/index.tsx");class n extends t.default.Component{constructor(r){super(r),this.GlobalClassNames={root:"ms-Checkbox",label:"ms-Checkbox-label",checkbox:"ms-Checkbox-checkbox",checkmark:"ms-Checkbox-checkmark",text:"ms-Checkbox-text"},this.setStyle=(d,u)=>({root:[!u.disabled&&[!u.checked&&{[`:hover .${this.GlobalClassNames.checkbox}`]:{background:"var(--vscode-checkbox-background)",borderColor:"var(--vscode-focusBorder)",[s.HighContrastSelector]:{borderColor:"Highlight"}},[`:focus .${this.GlobalClassNames.checkbox}`]:{background:"var(--vscode-checkbox-background)",borderColor:"var(--vscode-focusBorder)"},[`:hover .${this.GlobalClassNames.checkmark}`]:{color:"var(--vscode-foreground)",opacity:0,[s.HighContrastSelector]:{color:"Highlight"}}},{[`:hover .${this.GlobalClassNames.text}, :focus .${this.GlobalClassNames.text}`]:{color:"var(--vscode-foreground)",[s.HighContrastSelector]:{color:u.disabled?"GrayText":"WindowText"}}}],u.checked&&!u.indeterminate&&{[`:hover .${this.GlobalClassNames.checkbox}`]:{background:u.disabled?"":"var(--vscode-checkbox-background)",borderColor:u.disabled?"":"var(--vscode-focusBorder)"},[`:focus .${this.GlobalClassNames.checkbox}`]:{background:"var(--vscode-checkbox-background)",borderColor:"var(--vscode-focusBorder)"},[s.HighContrastSelector]:{[`:hover .${this.GlobalClassNames.checkbox}`]:{background:"Highlight",borderColor:"Highlight"},[`:focus .${this.GlobalClassNames.checkbox}`]:{background:"Highlight"},[`:focus:hover .${this.GlobalClassNames.checkbox}`]:{background:"Highlight"},[`:focus:hover .${this.GlobalClassNames.checkmark}`]:{color:"Window"},[`:hover .${this.GlobalClassNames.checkmark}`]:{color:"Window"}}},d.message&&{marginBottom:2}],input:{[`.${s.IsFocusVisibleClassName} &:focus + label::before`]:{content:"",position:"absolute",inset:-1,border:"1px solid transparent !important",outline:"1px solid var(--vscode-focusBorder) !important",[s.HighContrastSelector]:{outline:"1px solid WindowText"}}},checkbox:{backgroundColor:"var(--vscode-debugToolBar-background, var(--vscode-editorWidget-background))",borderColor:"var(--vscode-editorWidget-border)",opacity:u.disabled?.4:void 0},checkmark:{color:"var(--vscode-checkbox-foreground, var(--vscode-editorWidget-foreground))"},text:{color:"var(--vscode-foreground)",opacity:u.disabled?.4:void 0}})}render(){const r=(0,o.getMessageInfo)(this.props),d=t.default.createElement(s.Checkbox,E(h({},this.props),{styles:u=>h(h({},this.setStyle(r,u)),this.props.styles)}));return r.message?t.default.createElement(o.MessageWrapper,{message:r},d):d}}_.UICheckbox=n}),"./src/components/UICheckbox/index.tsx":(function(c,_,e){"use strict";var l=this&&this.__createBinding||(Object.create?(function(s,o,n,a){a===void 0&&(a=n);var r=Object.getOwnPropertyDescriptor(o,n);(!r||("get"in r?!o.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return o[n]}}),Object.defineProperty(s,a,r)}):(function(s,o,n,a){a===void 0&&(a=n),s[a]=o[n]})),t=this&&this.__exportStar||function(s,o){for(var n in s)n!=="default"&&!Object.prototype.hasOwnProperty.call(o,n)&&l(o,s,n)};Object.defineProperty(_,"__esModule",{value:!0}),t(e("./src/components/UICheckbox/UICheckbox.tsx"),_)}),"./src/components/UIIcon/UIIcon.tsx":(function(c,_,e){"use strict";var l=this&&this.__importDefault||function(n){return n&&n.__esModule?n:{default:n}};Object.defineProperty(_,"__esModule",{value:!0}),_.UIIcon=void 0;const t=l(e("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=e("../../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");e("./src/components/UIIcon/UIIcon.scss");class o extends t.default.Component{constructor(a){super(a),this.setStyle=()=>({})}render(){const a=this.props.className?` ${this.props.className}`:"";return t.default.createElement(s.Icon,E(h({},this.props),{className:`ts-icon${a}`,styles:this.setStyle()}))}}_.UIIcon=o}),"./src/components/UIIcon/index.tsx":(function(c,_,e){"use strict";var l=this&&this.__createBinding||(Object.create?(function(s,o,n,a){a===void 0&&(a=n);var r=Object.getOwnPropertyDescriptor(o,n);(!r||("get"in r?!o.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return o[n]}}),Object.defineProperty(s,a,r)}):(function(s,o,n,a){a===void 0&&(a=n),s[a]=o[n]})),t=this&&this.__exportStar||function(s,o){for(var n in s)n!=="default"&&!Object.prototype.hasOwnProperty.call(o,n)&&l(o,s,n)};Object.defineProperty(_,"__esModule",{value:!0}),t(e("./src/components/UIIcon/UIIcon.tsx"),_)}),"./src/helper/ValidationMessage/MessageWrapper.tsx":(function(c,_,e){"use strict";var l=this&&this.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(_,"__esModule",{value:!0}),_.MESSAGE_ICONS_MAP=void 0,_.MessageWrapper=a;const t=l(e("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=e("./src/helper/ValidationMessage/utils.ts"),o=e("./src/components/Icons.tsx"),n=e("./src/components/UIIcon/index.tsx");e("./src/helper/ValidationMessage/MessageWrapper.scss"),_.MESSAGE_ICONS_MAP=new Map([[void 0,o.UiIcons.Error],[s.ErrorMessageType.Error,o.UiIcons.Error],[s.ErrorMessageType.Warning,o.UiIcons.Warning],[s.ErrorMessageType.Info,o.UiIcons.Info]]);function a(r){const{children:d,message:u}=r,p=u.message?s.MESSAGE_TYPES_CLASSNAME_MAP.get(u.type):void 0,i=_.MESSAGE_ICONS_MAP.get(u.type);return t.default.createElement("div",{className:`ts-message-wrapper ts-message-wrapper--${p}`},t.default.createElement("div",{className:"ts-message-target"},d),t.default.createElement("div",{className:"ts-message-body"},t.default.createElement(n.UIIcon,{iconName:i}),t.default.createElement("span",null,u.message)))}}),"./src/helper/ValidationMessage/index.tsx":(function(c,_,e){"use strict";var l=this&&this.__createBinding||(Object.create?(function(s,o,n,a){a===void 0&&(a=n);var r=Object.getOwnPropertyDescriptor(o,n);(!r||("get"in r?!o.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return o[n]}}),Object.defineProperty(s,a,r)}):(function(s,o,n,a){a===void 0&&(a=n),s[a]=o[n]})),t=this&&this.__exportStar||function(s,o){for(var n in s)n!=="default"&&!Object.prototype.hasOwnProperty.call(o,n)&&l(o,s,n)};Object.defineProperty(_,"__esModule",{value:!0}),t(e("./src/helper/ValidationMessage/MessageWrapper.tsx"),_),t(e("./src/helper/ValidationMessage/utils.ts"),_)}),"./src/helper/ValidationMessage/utils.ts":((c,_)=>{"use strict";Object.defineProperty(_,"__esModule",{value:!0}),_.getMessageInfo=_.MESSAGE_TYPES_CLASSNAME_MAP=_.ErrorMessageType=void 0;var e;(function(r){r.Error="Error",r.Warning="Warning",r.Info="Info"})(e||(_.ErrorMessageType=e={}));const l=(r,d)=>{const u=`1px solid ${d}`;return{backgroundColor:r,borderLeft:u,borderRight:u,borderBottom:u,borderColor:d}},t={error:E(h({color:"var(--vscode-input-foreground)"},l("var(--vscode-inputValidation-errorBackground)","var(--vscode-inputValidation-errorBorder)")),{paddingTop:4,paddingBottom:5,paddingLeft:8,margin:0}),warning:{},info:{}};t.warning=h(h({},t.error),l("var(--vscode-inputValidation-warningBackground)","var(--vscode-inputValidation-warningBorder)")),t.info=h(h({},t.error),l("var(--vscode-inputValidation-infoBackground)","var(--vscode-inputValidation-infoBorder)")),_.MESSAGE_TYPES_CLASSNAME_MAP=new Map([[void 0,"error"],[e.Error,"error"],[e.Warning,"warning"],[e.Info,"info"]]);const s=r=>{let d;switch(r){case e.Warning:{d=t.warning;break}case e.Info:{d=t.info;break}default:{d=t.error;break}}return d},o=r=>{if(r){if(r.errorMessage)return e.Error;if(r.warningMessage)return e.Warning;if(r.infoMessage)return e.Info}return e.Error},n=r=>{const d=["errorMessage","warningMessage","infoMessage"];for(const u of d)if(r!=null&&r[u])return r[u]},a=r=>{const d=o(r);return{type:d,style:s(d),message:n(r)}};_.getMessageInfo=a}),"./stories/UICheckbox.story.tsx":(function(c,_,e){"use strict";var l=this&&this.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(_,"__esModule",{value:!0}),_.defaultUsage=void 0;const t=l(e("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=e("../../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=e("./src/components/UICheckbox/index.tsx");_.default={title:"Basic Inputs/Checkbox"};const n={childrenGap:40},a=()=>{const r="Dummy message",d={width:"300px",marginBottom:"25px"};return t.default.createElement(s.Stack,{tokens:n,style:{width:300}},t.default.createElement(s.Stack,{tokens:{childrenGap:16}},t.default.createElement(s.Text,{variant:"large",className:"textColor"},"UICheckbox"),t.default.createElement(o.UICheckbox,{label:"check"})),t.default.createElement(s.Stack,{tokens:{childrenGap:16}},t.default.createElement(s.Text,{variant:"large",className:"textColor"},"UICheckbox with error message"),t.default.createElement(o.UICheckbox,{label:"Error",errorMessage:r})),t.default.createElement(s.Stack,{tokens:{childrenGap:16}},t.default.createElement(s.Text,{variant:"large",className:"textColor"},"UICheckbox with warning message"),t.default.createElement(o.UICheckbox,{label:"Warning",warningMessage:r})),t.default.createElement(s.Stack,{tokens:{childrenGap:16}},t.default.createElement(s.Text,{variant:"large",className:"textColor"},"UICheckbox with info message"),t.default.createElement(o.UICheckbox,{label:"Info",infoMessage:r})),t.default.createElement(s.Stack,{tokens:{childrenGap:16}},t.default.createElement(s.Text,{variant:"large",className:"textColor"},"UICheckbox disabled"),t.default.createElement(o.UICheckbox,{label:"Info",disabled:!0})),t.default.createElement(s.Stack,{tokens:{childrenGap:16}},t.default.createElement(s.Text,{variant:"large",className:"textColor"},"UICheckbox checked and disabled"),t.default.createElement(o.UICheckbox,{label:"Info",checked:!0,disabled:!0})))};_.defaultUsage=a})}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var m=Object.defineProperty,C=Object.defineProperties;var y=Object.getOwnPropertyDescriptors;var b=Object.getOwnPropertySymbols;var g=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var _=(c,o,r)=>o in c?m(c,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):c[o]=r,d=(c,o)=>{for(var r in o||(o={}))g.call(o,r)&&_(c,r,o[r]);if(b)for(var r of b(o))v.call(o,r)&&_(c,r,o[r]);return c},u=(c,o)=>C(c,y(o));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[525],{"./src/components/UIChoiceGroup/UIChoiceGroup.tsx":(function(c,o,r){var s=this&&this.__importDefault||function(f){return f&&f.__esModule?f:{default:f}};Object.defineProperty(o,"__esModule",{value:!0}),o.UIChoiceGroup=void 0;const a=s(r("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),i=r("../../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"),l=r("./src/components/UILabel/index.tsx"),t=r("./src/components/types.ts"),n={fontSize:13,disableOpacity:.4},e={label:u(d({},n),{color:"var(--vscode-input-foreground)"}),radio:{borderColor:"var(--vscode-editorWidget-border)",background:"var(--vscode-input-background)",bullet:{background:"var(--vscode-input-foreground)"},hover:{background:"var(--vscode-focusBorder)"},focus:{borderColor:"var(--vscode-focusBorder)"},label:u(d({},n),{color:"var(--vscode-foreground)"})}};class p extends a.default.Component{constructor(h){super(h),this.setStyles=()=>d({root:{".ms-ChoiceFieldGroup label.ms-Label":{fontWeight:"bold",fontSize:e.label.fontSize,fontStyle:"normal",lineHeight:15,color:e.label.color,marginTop:10,padding:0},".ms-ChoiceField":{minHeight:20},".ms-ChoiceField-field":{fontWeight:"normal",fontSize:e.radio.label.fontSize,fontStyle:"normal",lineHeight:18,color:e.radio.label.color,margin:0},".ms-ChoiceField-field::before":{backgroundColor:e.radio.background,borderColor:e.radio.borderColor,top:0,left:0,width:18,height:18},".ms-ChoiceField-field::after":{left:5,top:5,height:8,width:8,borderWidth:4,backgroundColor:e.radio.background,transition:"none"},".ms-ChoiceFieldLabel":{paddingLeft:26},".ms-ChoiceField-field.is-checked::after":{borderColor:e.radio.bullet.background},".ms-ChoiceField-field:hover":{"span.ms-ChoiceFieldLabel":{color:e.radio.label.color},"::before":{borderColor:e.radio.hover.background},"::after":{borderColor:"transparent",background:"transparent"}},"label.ms-ChoiceField-field.is-checked:hover::after":{borderColor:e.radio.bullet.background},".ms-ChoiceField-wrapper.is-inFocus::after":{borderColor:e.radio.focus.borderColor},".ms-ChoiceField-input:focus":{opacity:0},".is-disabled + .ms-ChoiceField-field":{" .ms-ChoiceFieldLabel":{opacity:e.radio.label.disableOpacity,color:e.radio.label.color},":hover::before":{borderColor:e.radio.borderColor},":after":{opacity:e.radio.label.disableOpacity}}},label:d(d(d({},l.labelGlobalStyle),this.props.disabled&&{opacity:e.label.disableOpacity,color:e.label.color}),this.props.required&&{selectors:{"::after":{content:t.REQUIRED_LABEL_INDICATOR,color:"var(--vscode-inputValidation-errorBorder)",paddingRight:12}}})},this.props.inline&&{flexContainer:{display:"flex",flexDirection:"row",flexWrap:"wrap",selectors:{"> .ms-ChoiceField":{paddingRight:16}}}})}render(){return a.default.createElement(i.ChoiceGroup,d({styles:this.setStyles},this.props))}}o.UIChoiceGroup=p}),"./src/components/UIChoiceGroup/index.tsx":(function(c,o,r){var s=this&&this.__createBinding||(Object.create?(function(i,l,t,n){n===void 0&&(n=t);var e=Object.getOwnPropertyDescriptor(l,t);(!e||("get"in e?!l.__esModule:e.writable||e.configurable))&&(e={enumerable:!0,get:function(){return l[t]}}),Object.defineProperty(i,n,e)}):(function(i,l,t,n){n===void 0&&(n=t),i[n]=l[t]})),a=this&&this.__exportStar||function(i,l){for(var t in i)t!=="default"&&!Object.prototype.hasOwnProperty.call(l,t)&&s(l,i,t)};Object.defineProperty(o,"__esModule",{value:!0}),a(r("./src/components/UIChoiceGroup/UIChoiceGroup.tsx"),o)}),"./src/components/UILabel/UILabel.tsx":(function(c,o,r){var s=this&&this.__importDefault||function(n){return n&&n.__esModule?n:{default:n}};Object.defineProperty(o,"__esModule",{value:!0}),o.UILabel=o.labelGlobalStyle=void 0;const a=s(r("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),i=r("../../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"),l=r("./src/components/types.ts");o.labelGlobalStyle={fontWeight:"bold",fontSize:"13px",color:"var(--vscode-input-foreground)",padding:"4px 0"};class t extends a.default.Component{constructor(e){super(e)}render(){const e=p=>({root:[d({marginTop:25},o.labelGlobalStyle),p.disabled&&{opacity:"0.4"},p.required&&{selectors:{"::after":{content:l.REQUIRED_LABEL_INDICATOR,color:"var(--vscode-inputValidation-errorBorder)",paddingRight:12}}}]});return a.default.createElement(i.Label,u(d({},this.props),{styles:e}))}}o.UILabel=t}),"./src/components/UILabel/index.tsx":(function(c,o,r){var s=this&&this.__createBinding||(Object.create?(function(i,l,t,n){n===void 0&&(n=t);var e=Object.getOwnPropertyDescriptor(l,t);(!e||("get"in e?!l.__esModule:e.writable||e.configurable))&&(e={enumerable:!0,get:function(){return l[t]}}),Object.defineProperty(i,n,e)}):(function(i,l,t,n){n===void 0&&(n=t),i[n]=l[t]})),a=this&&this.__exportStar||function(i,l){for(var t in i)t!=="default"&&!Object.prototype.hasOwnProperty.call(l,t)&&s(l,i,t)};Object.defineProperty(o,"__esModule",{value:!0}),a(r("./src/components/UILabel/UILabel.tsx"),o)}),"./src/components/types.ts":((c,o)=>{Object.defineProperty(o,"__esModule",{value:!0}),o.REQUIRED_LABEL_INDICATOR=void 0,o.REQUIRED_LABEL_INDICATOR="' *' / ''"}),"./stories/UIChoiceGroup.story.tsx":(function(c,o,r){var s=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(o,"__esModule",{value:!0}),o.ChoiceGroup=void 0;const a=s(r("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),i=r("../../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"),l=r("./src/components/UIChoiceGroup/index.tsx");o.default={title:"Basic Inputs/ChoiceGroup"};const t={options:[{key:"key1",text:"Option 1"},{key:"key2",text:"Option 2"},{key:"key3",text:"Option 3",disabled:!0}],defaultSelectedKey:"key2",label:"Title",onChange:(e,p)=>{console.log(p.text)}},n=()=>a.default.createElement(i.Stack,null,a.default.createElement(i.Stack,null,a.default.createElement(i.Text,{variant:"large",block:!0},"ChoiceGroup"),a.default.createElement(i.Stack,null,a.default.createElement(l.UIChoiceGroup,d({},t))),a.default.createElement(i.Stack,null,a.default.createElement(l.UIChoiceGroup,u(d({},t),{title:"Disabled",disabled:!0}))),a.default.createElement(i.Stack,null,a.default.createElement(l.UIChoiceGroup,u(d({},t),{title:"Required",required:!0}))),a.default.createElement(i.Stack,null,a.default.createElement(l.UIChoiceGroup,u(d({},t),{title:"Inline",inline:!0})))));o.ChoiceGroup=n})}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var Y=Object.defineProperty,Q=Object.defineProperties;var V=Object.getOwnPropertyDescriptors;var I=Object.getOwnPropertySymbols;var X=Object.prototype.hasOwnProperty,$=Object.prototype.propertyIsEnumerable;var S=(m,t,s)=>t in m?Y(m,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):m[t]=s,h=(m,t)=>{for(var s in t||(t={}))X.call(t,s)&&S(m,s,t[s]);if(I)for(var s of I(t))$.call(t,s)&&S(m,s,t[s]);return m},y=(m,t)=>Q(m,V(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.HiddenOptions=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"),B=s("./src/components/index.tsx");t.default={title:"Dropdowns/Combobox"};const A=()=>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=A;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 w=()=>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=w;const O=()=>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=O;const v=()=>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=v;const W=()=>{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=W;const T=()=>{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=T;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 _=()=>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=_;const L=()=>{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(J=>d!=null&&d.selected?!0:J!==(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=L;const F=()=>{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=F;const R=["AR","BR","DK"],P=i.data.map(a=>R.includes(a.key)?y(h({},a),{editable:!0}):a),H=()=>e.default.createElement(o.UIComboBox,{options:P,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",onRenderOption:(a,n)=>{var l;return"editable"in(a!=null?a:{})?e.default.createElement(B.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=H;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"}],G=()=>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=G;const N=[...i.data,{key:"A1",text:"Do not hide",customMark:!0},{key:"A2",text:"Always visible",customMark:!0}],j=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:N,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",customSearchFilter:(a,n)=>{if("customMark"in n&&n.customMark)return!0}}));t.AdditionalCustomSearch=j;const Z=()=>{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=Z;const M=i.data.map(a=>{const n=h({},a);return["AR","AT"].includes(a.key.toString())&&(n.hidden=!0),n}),z=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(o.UIComboBox,{options:M,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,autoComplete:"on",label:"Argentina and Austria is hidden"}),e.default.createElement(o.UIComboBox,{options:M,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,multiSelect:!0,autoComplete:"on",label:"Argentina and Austria is hidden"}));t.HiddenOptions=z}),"./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)}}})}]);})();
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
(()=>{var B=Object.defineProperty,D=Object.defineProperties;var A=Object.getOwnPropertyDescriptors;var M=Object.getOwnPropertySymbols;var L=Object.prototype.hasOwnProperty,R=Object.prototype.propertyIsEnumerable;var w=(s,a,r)=>a in s?B(s,a,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[a]=r,_=(s,a)=>{for(var r in a||(a={}))L.call(a,r)&&w(s,r,a[r]);if(M)for(var r of M(a))R.call(a,r)&&w(s,r,a[r]);return s},I=(s,a)=>D(s,A(a));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[289],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js":(s=>{"use strict";s.exports=function(a){var r=[];return r.toString=function(){return this.map(function(e){var t="",n=typeof e[5]!="undefined";return e[4]&&(t+="@supports (".concat(e[4],") {")),e[2]&&(t+="@media ".concat(e[2]," {")),n&&(t+="@layer".concat(e[5].length>0?" ".concat(e[5]):""," {")),t+=a(e),n&&(t+="}"),e[2]&&(t+="}"),e[4]&&(t+="}"),t}).join("")},r.i=function(e,t,n,o,p){typeof e=="string"&&(e=[[null,e,void 0]]);var f={};if(n)for(var d=0;d<this.length;d++){var v=this[d][0];v!=null&&(f[v]=!0)}for(var k=0;k<e.length;k++){var u=[].concat(e[k]);n&&f[u[0]]||(typeof p!="undefined"&&(typeof u[5]=="undefined"||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=p),t&&(u[2]&&(u[1]="@media ".concat(u[2]," {").concat(u[1],"}")),u[2]=t),o&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=o):u[4]="".concat(o)),r.push(u))}},r}}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js":(s=>{"use strict";s.exports=function(a){return a[1]}}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":(s=>{"use strict";var a=[];function r(t){for(var n=-1,o=0;o<a.length;o++)if(a[o].identifier===t){n=o;break}return n}function l(t,n){for(var o={},p=[],f=0;f<t.length;f++){var d=t[f],v=n.base?d[0]+n.base:d[0],k=o[v]||0,u="".concat(v," ").concat(k);o[v]=k+1;var c=r(u),x={css:d[1],media:d[2],sourceMap:d[3],supports:d[4],layer:d[5]};if(c!==-1)a[c].references++,a[c].updater(x);else{var i=e(x,n);n.byIndex=f,a.splice(f,0,{identifier:u,updater:i,references:1})}p.push(u)}return p}function e(t,n){var o=n.domAPI(n);o.update(t);var p=function(d){if(d){if(d.css===t.css&&d.media===t.media&&d.sourceMap===t.sourceMap&&d.supports===t.supports&&d.layer===t.layer)return;o.update(t=d)}else o.remove()};return p}s.exports=function(t,n){n=n||{},t=t||[];var o=l(t,n);return function(f){f=f||[];for(var d=0;d<o.length;d++){var v=o[d],k=r(v);a[k].references--}for(var u=l(f,n),c=0;c<o.length;c++){var x=o[c],i=r(x);a[i].references===0&&(a[i].updater(),a.splice(i,1))}o=u}}}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js":(s=>{"use strict";var a={};function r(e){if(typeof a[e]=="undefined"){var t=document.querySelector(e);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(n){t=null}a[e]=t}return a[e]}function l(e,t){var n=r(e);if(!n)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");n.appendChild(t)}s.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js":(s=>{"use strict";function a(r){var l=document.createElement("style");return r.setAttributes(l,r.attributes),r.insert(l,r.options),l}s.exports=a}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":((s,a,r)=>{"use strict";function l(e){var t=r.nc;t&&e.setAttribute("nonce",t)}s.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js":(s=>{"use strict";function a(e,t,n){var o="";n.supports&&(o+="@supports (".concat(n.supports,") {")),n.media&&(o+="@media ".concat(n.media," {"));var p=typeof n.layer!="undefined";p&&(o+="@layer".concat(n.layer.length>0?" ".concat(n.layer):""," {")),o+=n.css,p&&(o+="}"),n.media&&(o+="}"),n.supports&&(o+="}");var f=n.sourceMap;f&&typeof btoa!="undefined"&&(o+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(f))))," */")),t.styleTagTransform(o,e,t.options)}function r(e){if(e.parentNode===null)return!1;e.parentNode.removeChild(e)}function l(e){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var t=e.insertStyleElement(e);return{update:function(o){a(t,e,o)},remove:function(){r(t)}}}s.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js":(s=>{"use strict";function a(r,l){if(l.styleSheet)l.styleSheet.cssText=r;else{for(;l.firstChild;)l.removeChild(l.firstChild);l.appendChild(document.createTextNode(r))}}s.exports=a}),"./src/components/UIToggle/UIToggle.tsx":(function(s,a,r){"use strict";var l=this&&this.__importDefault||function(i){return i&&i.__esModule?i:{default:i}};Object.defineProperty(a,"__esModule",{value:!0}),a.UIToggle=a.UIToggleSize=void 0;const e=l(r("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=l(r("../../node_modules/.pnpm/react-dom@16.14.0_react@16.14.0/node_modules/react-dom/index.js")),n=r("../../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=r("./src/helper/ValidationMessage/index.tsx"),p=r("./src/components/UIIcon/index.tsx"),f=r("./src/components/Icons.tsx");var d;(function(i){i.Standard="Standard",i.Small="Small"})(d||(a.UIToggleSize=d={}));const v={width:30,height:18,padding:"0 1px",margin:"0",label:{fontSize:13,padding:"0px 0px 1px 0px"},circle:{width:14,height:14,borderWidth:1}},k={display:"flex"},u=.4,c={pill:{unchecked:{background:"var(--vscode-editorWidget-background)",borderColor:"var(--vscode-editorWidget-border)",hover:{background:"var(--vscode-editorWidget-background)",borderColor:"var(--vscode-editorWidget-border)"}},checked:{background:"var(--vscode-editorWidget-background)",borderColor:"var(--vscode-contrastActiveBorder, var(--vscode-editorWidget-border))",hover:{background:"var(--vscode-editorWidget-background)",borderColor:"var(--vscode-contrastActiveBorder, var(--vscode-editorWidget-border))"}},focus:{outline:"1px solid var(--vscode-focusBorder) !important"}},thumb:{unchecked:{background:"var(--vscode-button-secondaryBackground)",borderColor:"var(--vscode-button-border, transparent)",hover:{borderColor:"var(--vscode-button-border, transparent)",background:"var(--vscode-contrastBorder, var(--vscode-button-secondaryHoverBackground))"}},checked:{background:"var(--vscode-button-background)",borderColor:"var(--vscode-contrastActiveBorder, var(--vscode-button-border, transparent))",hover:{borderColor:"var(--vscode-contrastActiveBorder, var(--vscode-button-border, transparent))",background:"var(--vscode-contrastActiveBorder, var(--vscode-button-hoverBackground))"}}}};class x extends e.default.Component{constructor(h){super(h),this.toggleRootRef=e.default.createRef(),this.handleChange=this.handleChange.bind(this),this.replaceThumbWithIcon=this.replaceThumbWithIcon.bind(this)}componentDidMount(){var h;this.replaceThumbWithIcon((h=this.props.checked)!=null?h:this.props.defaultChecked)}shouldComponentUpdate(h){return h.checked!==this.props.checked&&this.replaceThumbWithIcon(h.checked),!0}handleChange(h,b){var g,m;this.replaceThumbWithIcon(b),(m=(g=this.props).onChange)==null||m.call(g,h,b)}replaceThumbWithIcon(h=!1){var b;if(this.toggleRootRef.current){const g=(b=this.toggleRootRef.current)==null?void 0:b.querySelector(".ms-Toggle-thumb");g&&t.default.render(e.default.createElement(p.UIIcon,{iconName:h?f.UiIcons.SwitchOn:f.UiIcons.SwitchOff,style:k}),g)}}getMarginBottom(h){const{inlineLabel:b}=this.props;if(h)return b?0:4}render(){const{inlineLabelLeft:h,labelFlexGrow:b,inlineLabel:g}=this.props,m=v,y=(0,o.getMessageInfo)(this.props),C=T=>({root:I(_({},b&&{flexGrow:1,justifyContent:"space-between"}),{margin:m==null?void 0:m.margin,marginBottom:this.getMarginBottom(y.message)}),label:I(_(_({color:"var(--vscode-foreground)",fontWeight:"normal",fontSize:m==null?void 0:m.label.fontSize,padding:m==null?void 0:m.label.padding},g&&{marginLeft:10}),h&&{order:0,marginLeft:0,marginRight:10}),{opacity:this.props.disabled?u:"inherit"}),pill:I(_({height:m==null?void 0:m.height,width:m==null?void 0:m.width,padding:m==null?void 0:m.padding,background:c.pill.checked.background,borderColor:c.pill.checked.borderColor,borderStyle:"solid",":hover .ms-Toggle-thumb":{background:c.thumb.checked.hover.background,borderColor:c.thumb.checked.hover.borderColor},":hover":{background:c.pill.checked.hover.background,borderColor:c.pill.checked.hover.borderColor},":disabled":{background:c.pill.checked.background,borderColor:c.pill.checked.borderColor,opacity:u}},!T.checked&&{background:c.pill.unchecked.background,borderColor:c.pill.unchecked.borderColor,borderStyle:"solid",":hover .ms-Toggle-thumb":{background:c.thumb.unchecked.hover.background,borderColor:c.thumb.unchecked.hover.borderColor},":hover":{background:c.pill.unchecked.hover.background,borderColor:c.pill.unchecked.hover.borderColor},":disabled":{background:c.pill.unchecked.background,borderColor:c.pill.unchecked.borderColor,opacity:u}}),{selectors:{":focus::after":{border:"none !important",outline:c.pill.focus.outline}}}),thumb:I(_({height:m==null?void 0:m.circle.height,width:m==null?void 0:m.circle.width,borderWidth:m==null?void 0:m.circle.borderWidth,backgroundPosition:"center",borderColor:c.thumb.checked.borderColor,backgroundColor:c.thumb.checked.background,":hover":{background:c.thumb.checked.hover.background,borderColor:c.thumb.checked.hover.borderColor}},!T.checked&&{borderColor:c.thumb.unchecked.borderColor,backgroundColor:c.thumb.unchecked.background}),{svg:{width:"100%",height:"100%",path:{fill:T.checked?"var(--vscode-button-foreground)":"var(--vscode-button-secondaryForeground)"}}})}),S=e.default.createElement(n.Toggle,I(_({},this.props),{styles:C,ref:this.toggleRootRef,onChange:this.handleChange}));return y.message?e.default.createElement(o.MessageWrapper,{message:y},S):S}}a.UIToggle=x}),"./src/components/UIToggle/index.tsx":(function(s,a,r){"use strict";var l=this&&this.__createBinding||(Object.create?(function(t,n,o,p){p===void 0&&(p=o);var f=Object.getOwnPropertyDescriptor(n,o);(!f||("get"in f?!n.__esModule:f.writable||f.configurable))&&(f={enumerable:!0,get:function(){return n[o]}}),Object.defineProperty(t,p,f)}):(function(t,n,o,p){p===void 0&&(p=o),t[p]=n[o]})),e=this&&this.__exportStar||function(t,n){for(var o in t)o!=="default"&&!Object.prototype.hasOwnProperty.call(n,o)&&l(n,t,o)};Object.defineProperty(a,"__esModule",{value:!0}),e(r("./src/components/UIToggle/UIToggle.tsx"),a)}),"./stories/UIContextualMenu.story.tsx":(function(s,a,r){"use strict";var l=this&&this.__importDefault||function(i){return i&&i.__esModule?i:{default:i}};Object.defineProperty(a,"__esModule",{value:!0}),a.ContextualMenu=void 0;const e=l(r("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=r("../../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"),n=r("./src/components/UIContextualMenu/index.tsx"),o=r("./src/components/UIButton/index.tsx"),p=r("./src/components/UITreeDropdown/index.tsx"),f=r("./src/components/Icons.tsx"),d=r("./src/components/UIDropdown/index.tsx"),v=r("./src/components/UIToggle/index.tsx");a.default={title:"Dropdowns/ContextualMenu"};const k={childrenGap:40};function u(i=!1){return[{key:"item1",text:"Menu item 1",title:"Menu item 1",onClick:()=>console.log("New clicked")},{key:"item2",text:"Menu item 2",title:"Menu item 2",subMenuProps:I(_({},i&&{directionalHint:p.UIDirectionalHint.leftTopEdge}),{items:[{key:"submenuitem1",text:"Submenu item 1"},{key:"submenuitem2",text:"Submenu item 2",title:"Submenu item 2",subMenuProps:I(_({},i&&{directionalHint:p.UIDirectionalHint.leftTopEdge}),{items:[{key:"submenuitem21",text:"Submenu item 21",title:"Submenu item 21",canCheck:!0,checked:!0},{key:"submenuitem22",text:"Submenu item 22",title:"Submenu item 22",canCheck:!0}]})},{key:"submenuitem3",text:"Submenu item 3",title:"Submenu item 3"},{key:"submenuitem4",text:"Submenu item 1",title:"Submenu item 1"},{key:"submenuitem5",text:"Submenu item 2",title:"Submenu item 2"},{key:"submenuitem6",text:"Submenu item 3",title:"Submenu item 3"}]})}]}const c=[n.UIContextualMenuLayoutType.ContextualMenu,n.UIContextualMenuLayoutType.DropdownMenu].map(i=>({key:i.toString(),text:i.toString()})),x=()=>{const i=e.default.useRef(null),[h,b]=e.default.useState(n.UIContextualMenuLayoutType.ContextualMenu),[g,m]=e.default.useState(!0),[y,C]=e.default.useState(!1),S=e.default.useCallback(()=>{C(!0)},[]),T=e.default.useCallback(()=>C(!1),[]);return e.default.createElement(t.Stack,{tokens:k},e.default.createElement(d.UIDropdown,{label:"Layout",options:c,selectedKey:h.toString(),onChange:(E,U)=>{U&&b(n.UIContextualMenuLayoutType[U.key])}}),e.default.createElement(v.UIToggle,{checked:g,label:"showSubmenuBeneath",onChange:(E,U)=>{m(!!U)}}),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"large",block:!0},"Default UIContextualMenu rendering"),e.default.createElement("span",{ref:i,onClick:S},"Click for ContextualMenu"),e.default.createElement(n.UIContextualMenu,{hidden:!y,target:i,items:u(),onDismiss:T,layoutType:h,showSubmenuBeneath:g})),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"large",block:!0},"As menuProps of a UIButton elements"),e.default.createElement(t.Stack,{horizontal:!0,tokens:k},e.default.createElement(t.Stack,{tokens:{childrenGap:8}},e.default.createElement(t.Text,{variant:"small",block:!0},"UIDefaultButton"),e.default.createElement(o.UIDefaultButton,{primary:!0,text:"Toggle Contextual menu",menuProps:{items:u(),layoutType:h,showSubmenuBeneath:g}})))),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"large",block:!0},"As menuProps of a UIIconButton"),e.default.createElement(t.Stack,{horizontal:!0,tokens:k},e.default.createElement(t.Stack,{tokens:{childrenGap:8}},e.default.createElement(t.Text,{variant:"small",block:!0},"UIIconButton"),e.default.createElement(o.UIIconButton,{iconProps:{iconName:f.UiIcons.Undo},menuProps:{items:u(),layoutType:h,showSubmenuBeneath:g}})))),e.default.createElement(t.Stack,{tokens:{childrenGap:16}},e.default.createElement(t.Text,{variant:"large",block:!0},"As menuProps with beak and showSubmenuBeneath - iconToLeft and open the menu towards left"),e.default.createElement(t.Stack,{horizontal:!0,tokens:k,horizontalAlign:"center"},e.default.createElement(t.Stack,{tokens:{childrenGap:8}},e.default.createElement(t.Text,{variant:"small",block:!0},"UIIconButton"),e.default.createElement(o.UIIconButton,{iconProps:{iconName:f.UiIcons.ArrowLeft},menuProps:{items:u(!0),isBeakVisible:!0,iconToLeft:!0,layoutType:h,showSubmenuBeneath:g}})))))};a.ContextualMenu=x}),"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/index.js":((s,a,r)=>{var l=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v1.js"),e=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v4.js"),t=e;t.v1=l,t.v4=e,s.exports=t}),"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/bytesToUuid.js":(s=>{for(var a=[],r=0;r<256;++r)a[r]=(r+256).toString(16).substr(1);function l(e,t){var n=t||0,o=a;return[o[e[n++]],o[e[n++]],o[e[n++]],o[e[n++]],"-",o[e[n++]],o[e[n++]],"-",o[e[n++]],o[e[n++]],"-",o[e[n++]],o[e[n++]],"-",o[e[n++]],o[e[n++]],o[e[n++]],o[e[n++]],o[e[n++]],o[e[n++]]].join("")}s.exports=l}),"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/rng-browser.js":(s=>{var a=typeof crypto!="undefined"&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto)||typeof msCrypto!="undefined"&&typeof window.msCrypto.getRandomValues=="function"&&msCrypto.getRandomValues.bind(msCrypto);if(a){var r=new Uint8Array(16);s.exports=function(){return a(r),r}}else{var l=new Array(16);s.exports=function(){for(var t=0,n;t<16;t++)(t&3)===0&&(n=Math.random()*4294967296),l[t]=n>>>((t&3)<<3)&255;return l}}}),"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v1.js":((s,a,r)=>{var l=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/rng-browser.js"),e=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/bytesToUuid.js"),t,n,o=0,p=0;function f(d,v,k){var u=v&&k||0,c=v||[];d=d||{};var x=d.node||t,i=d.clockseq!==void 0?d.clockseq:n;if(x==null||i==null){var h=l();x==null&&(x=t=[h[0]|1,h[1],h[2],h[3],h[4],h[5]]),i==null&&(i=n=(h[6]<<8|h[7])&16383)}var b=d.msecs!==void 0?d.msecs:new Date().getTime(),g=d.nsecs!==void 0?d.nsecs:p+1,m=b-o+(g-p)/1e4;if(m<0&&d.clockseq===void 0&&(i=i+1&16383),(m<0||b>o)&&d.nsecs===void 0&&(g=0),g>=1e4)throw new Error("uuid.v1(): Can't create more than 10M uuids/sec");o=b,p=g,n=i,b+=122192928e5;var y=((b&268435455)*1e4+g)%4294967296;c[u++]=y>>>24&255,c[u++]=y>>>16&255,c[u++]=y>>>8&255,c[u++]=y&255;var C=b/4294967296*1e4&268435455;c[u++]=C>>>8&255,c[u++]=C&255,c[u++]=C>>>24&15|16,c[u++]=C>>>16&255,c[u++]=i>>>8|128,c[u++]=i&255;for(var S=0;S<6;++S)c[u+S]=x[S];return v||e(c)}s.exports=f}),"../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/v4.js":((s,a,r)=>{var l=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/rng-browser.js"),e=r("../../node_modules/.pnpm/uuid@3.4.0/node_modules/uuid/lib/bytesToUuid.js");function t(n,o,p){var f=o&&p||0;typeof n=="string"&&(o=n==="binary"?new Array(16):null,n=null),n=n||{};var d=n.random||(n.rng||l)();if(d[6]=d[6]&15|64,d[8]=d[8]&63|128,o)for(var v=0;v<16;++v)o[f+v]=d[v];return o||e(d)}s.exports=t})}]);})();
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
(()=>{var H=Object.defineProperty,X=Object.defineProperties;var V=Object.getOwnPropertyDescriptors;var D=Object.getOwnPropertySymbols;var J=Object.prototype.hasOwnProperty,Y=Object.prototype.propertyIsEnumerable;var T=(c,n,t)=>n in c?H(c,n,{enumerable:!0,configurable:!0,writable:!0,value:t}):c[n]=t,b=(c,n)=>{for(var t in n||(n={}))J.call(n,t)&&T(c,t,n[t]);if(D)for(var t of D(n))Y.call(n,t)&&T(c,t,n[t]);return c},I=(c,n)=>X(c,V(n));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[949],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/components/UICreateSelect/UICreateSelect.scss":((c,n,t)=>{var l=t("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js"),a=t("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js"),o=a(l);o.push([c.id,'.ui-create-select-indicator-clear,.ui-create-select-indicator-dropdown{display:flex;height:16px;align-items:center;justify-content:center;align-content:center}.ui-create-select-indicator-loading{padding-right:8px}.ui-create-select__option{position:relative}.ui-create-select__option--is-selected .ts-Menu-option--highlighted{color:var(--vscode-editorSuggestWidget-focusHighlightForeground, var(--vscode-list-focusHighlightForeground))}.ui-create-select__option--is-selected::after{content:"";position:absolute;inset:1px;z-index:1;outline:1px dashed var(--vscode-contrastActiveBorder);outline-offset:-1px;pointer-events:none;border:none}.ui-create-select__option:hover::after{content:"";position:absolute;inset:1px;z-index:1;outline:1px dashed var(--vscode-contrastActiveBorder);outline-offset:-1px;pointer-events:none;border:none}',""]),c.exports=o}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/components/UILoader/UILoader.scss":((c,n,t)=>{var l=t("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js"),a=t("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js"),o=a(l);o.push([c.id,".ui-large-header{font-family:var(--vscode-font-family);font-weight:bold;font-size:24px;font-style:normal;line-height:29px;color:var(--vscode-settings-headerForeground)}.ui-medium-header{font-family:var(--vscode-font-family);font-weight:bold;font-size:14px;font-style:normal;line-height:16px;color:var(--vscode-settings-headerForeground)}.ui-small-header{font-family:var(--vscode-font-family);font-weight:bold;font-size:13px;font-style:normal;line-height:15px;color:var(--vscode-settings-textInputForeground)}.ui-medium-text{font-family:var(--vscode-font-family);font-weight:normal;font-size:13px;font-style:normal;line-height:18px;color:var(--vscode-settings-textInputForeground)}.ui-medium-italic-text{font-family:var(--vscode-font-family);font-weight:normal;font-size:13px;font-style:italic;line-height:18px;color:var(--vscode-settings-textInputForeground)}.ui-small-text{font-family:var(--vscode-font-family);font-weight:normal;font-size:11px;font-style:normal;line-height:15px;color:var(--vscode-settings-textInputForeground)}.ui-small-italic-text{font-family:var(--vscode-font-family);font-weight:normal;font-size:11px;font-style:italic;line-height:15px;color:var(--vscode-settings-textInputForeground)}:root{--ui-box-shadow-small: 0 4px 8px 0 var(--vscode-widget-shadow);--ui-box-shadow-medium: 0 6px 12px 0 var(--vscode-widget-shadow);--ui-box-shadow-large: 0 10px 20px 0 var(--vscode-widget-shadow)}.ui-box-shadow-small{box-shadow:var(--ui-box-shadow-small)}.ui-box-shadow-medium{box-shadow:var(--ui-box-shadow-medium)}.ui-box-shadow-large{box-shadow:var(--ui-box-shadow-large)}.uiLoaderXLarge .ms-Spinner-circle{width:50px;height:50px}.uiLoaderXSmall .ms-Spinner-circle{border-width:1px;width:12px;height:12px}.ui-loader--delayed{opacity:0;animation:1s ease-in .3s normal forwards 1 ui-loader-fade-in;z-index:1}@keyframes ui-loader-fade-in{0%{opacity:0}100%{opacity:1}}",""]),c.exports=o}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js":(c=>{"use strict";c.exports=function(n){var t=[];return t.toString=function(){return this.map(function(a){var o="",e=typeof a[5]!="undefined";return a[4]&&(o+="@supports (".concat(a[4],") {")),a[2]&&(o+="@media ".concat(a[2]," {")),e&&(o+="@layer".concat(a[5].length>0?" ".concat(a[5]):""," {")),o+=n(a),e&&(o+="}"),a[2]&&(o+="}"),a[4]&&(o+="}"),o}).join("")},t.i=function(a,o,e,s,d){typeof a=="string"&&(a=[[null,a,void 0]]);var _={};if(e)for(var u=0;u<this.length;u++){var E=this[u][0];E!=null&&(_[E]=!0)}for(var m=0;m<a.length;m++){var r=[].concat(a[m]);e&&_[r[0]]||(typeof d!="undefined"&&(typeof r[5]=="undefined"||(r[1]="@layer".concat(r[5].length>0?" ".concat(r[5]):""," {").concat(r[1],"}")),r[5]=d),o&&(r[2]&&(r[1]="@media ".concat(r[2]," {").concat(r[1],"}")),r[2]=o),s&&(r[4]?(r[1]="@supports (".concat(r[4],") {").concat(r[1],"}"),r[4]=s):r[4]="".concat(s)),t.push(r))}},t}}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js":(c=>{"use strict";c.exports=function(n){return n[1]}}),"./src/components/UICreateSelect/UICreateSelect.scss":((c,n,t)=>{"use strict";t.r(n),t.d(n,{default:()=>g});var l=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),a=t.n(l),o=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js"),e=t.n(o),s=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js"),d=t.n(s),_=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),u=t.n(_),E=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js"),m=t.n(E),r=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js"),y=t.n(r),p=t("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/components/UICreateSelect/UICreateSelect.scss"),f=t.n(p),i={};for(const x in p)x!=="default"&&(i[x]=()=>p[x]);t.d(n,i);var h={};h.styleTagTransform=y(),h.setAttributes=u(),h.insert=d().bind(null,"head"),h.domAPI=e(),h.insertStyleElement=m();var v=a()(f(),h);const g=f()&&f().locals?f().locals:void 0}),"./src/components/UILoader/UILoader.scss":((c,n,t)=>{"use strict";t.r(n),t.d(n,{default:()=>g});var l=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),a=t.n(l),o=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js"),e=t.n(o),s=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js"),d=t.n(s),_=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),u=t.n(_),E=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js"),m=t.n(E),r=t("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js"),y=t.n(r),p=t("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/components/UILoader/UILoader.scss"),f=t.n(p),i={};for(const x in p)x!=="default"&&(i[x]=()=>p[x]);t.d(n,i);var h={};h.styleTagTransform=y(),h.setAttributes=u(),h.insert=d().bind(null,"head"),h.domAPI=e(),h.insertStyleElement=m();var v=a()(f(),h);const g=f()&&f().locals?f().locals:void 0}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":(c=>{"use strict";var n=[];function t(o){for(var e=-1,s=0;s<n.length;s++)if(n[s].identifier===o){e=s;break}return e}function l(o,e){for(var s={},d=[],_=0;_<o.length;_++){var u=o[_],E=e.base?u[0]+e.base:u[0],m=s[E]||0,r="".concat(E," ").concat(m);s[E]=m+1;var y=t(r),p={css:u[1],media:u[2],sourceMap:u[3],supports:u[4],layer:u[5]};if(y!==-1)n[y].references++,n[y].updater(p);else{var f=a(p,e);e.byIndex=_,n.splice(_,0,{identifier:r,updater:f,references:1})}d.push(r)}return d}function a(o,e){var s=e.domAPI(e);s.update(o);var d=function(u){if(u){if(u.css===o.css&&u.media===o.media&&u.sourceMap===o.sourceMap&&u.supports===o.supports&&u.layer===o.layer)return;s.update(o=u)}else s.remove()};return d}c.exports=function(o,e){e=e||{},o=o||[];var s=l(o,e);return function(_){_=_||[];for(var u=0;u<s.length;u++){var E=s[u],m=t(E);n[m].references--}for(var r=l(_,e),y=0;y<s.length;y++){var p=s[y],f=t(p);n[f].references===0&&(n[f].updater(),n.splice(f,1))}s=r}}}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js":(c=>{"use strict";var n={};function t(a){if(typeof n[a]=="undefined"){var o=document.querySelector(a);if(window.HTMLIFrameElement&&o instanceof window.HTMLIFrameElement)try{o=o.contentDocument.head}catch(e){o=null}n[a]=o}return n[a]}function l(a,o){var e=t(a);if(!e)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");e.appendChild(o)}c.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js":(c=>{"use strict";function n(t){var l=document.createElement("style");return t.setAttributes(l,t.attributes),t.insert(l,t.options),l}c.exports=n}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":((c,n,t)=>{"use strict";function l(a){var o=t.nc;o&&a.setAttribute("nonce",o)}c.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js":(c=>{"use strict";function n(a,o,e){var s="";e.supports&&(s+="@supports (".concat(e.supports,") {")),e.media&&(s+="@media ".concat(e.media," {"));var d=typeof e.layer!="undefined";d&&(s+="@layer".concat(e.layer.length>0?" ".concat(e.layer):""," {")),s+=e.css,d&&(s+="}"),e.media&&(s+="}"),e.supports&&(s+="}");var _=e.sourceMap;_&&typeof btoa!="undefined"&&(s+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(_))))," */")),o.styleTagTransform(s,a,o.options)}function t(a){if(a.parentNode===null)return!1;a.parentNode.removeChild(a)}function l(a){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var o=a.insertStyleElement(a);return{update:function(s){n(o,a,s)},remove:function(){t(o)}}}c.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js":(c=>{"use strict";function n(t,l){if(l.styleSheet)l.styleSheet.cssText=t;else{for(;l.firstChild;)l.removeChild(l.firstChild);l.appendChild(document.createTextNode(t))}}c.exports=n}),"./src/components/UICreateSelect/UICreateSelect.tsx":(function(c,n,t){"use strict";var l=this&&this.__importDefault||function(i){return i&&i.__esModule?i:{default:i}};Object.defineProperty(n,"__esModule",{value:!0}),n.UICreateSelect=n.UICreateSelectInstance=void 0;const a=l(t("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),o=t("../../node_modules/.pnpm/react-select@5.8.0_@types+react@16.14.55_react-dom@16.14.0_react@16.14.0/node_modules/react-select/dist/react-select.esm.js");Object.defineProperty(n,"UICreateSelectInstance",{enumerable:!0,get:function(){return o.SelectInstance}});const e=l(t("../../node_modules/.pnpm/react-select@5.8.0_@types+react@16.14.55_react-dom@16.14.0_react@16.14.0/node_modules/react-select/creatable/dist/react-select-creatable.esm.js")),s=t("./src/components/UIIcon/index.tsx"),d=t("./src/components/UILoader/index.tsx"),_=t("./src/components/UIContextualMenu/index.tsx");t("./src/components/UICreateSelect/UICreateSelect.scss");const u=t("./src/components/UIInput/index.tsx"),E=i=>a.default.createElement(o.components.DropdownIndicator,b({},i),a.default.createElement(s.UIIcon,{className:"ui-create-select-indicator-dropdown",iconName:"ArrowDown"})),m=i=>a.default.createElement(o.components.ClearIndicator,b({},i),a.default.createElement(s.UIIcon,{className:"ui-create-select-indicator-clear",iconName:"Clear"})),r=i=>a.default.createElement("div",{className:"ui-create-select-indicator-loading"},a.default.createElement(d.UILoader,{className:"uiLoaderXSmall",labelPosition:"right"})),y=i=>{var h,v,g,x;return a.default.createElement(a.default.Fragment,null,!((h=i==null?void 0:i.data)!=null&&h.__isNew__)&&a.default.createElement(o.components.Option,b({},i),a.default.createElement(_.UIHighlightMenuOption,{text:(v=i==null?void 0:i.data)==null?void 0:v.label,query:(g=i==null?void 0:i.selectProps)==null?void 0:g.inputValue})),((x=i==null?void 0:i.data)==null?void 0:x.__isNew__)&&a.default.createElement(o.components.Option,b({},i)))},p=i=>{let h="transparent";return i.isSelected&&(h="var(--vscode-editorSuggestWidget-selectedBackground, var(--vscode-quickInputList-focusBackground))"),i.isFocused&&!i.isSelected&&(h="var(--vscode-list-hoverBackground)"),h},f=i=>{const h=v=>`${i.createText}: ${v}`;return a.default.createElement(e.default,I(b({},i),{ref:i.creatableRef,className:"ui-create-select",classNamePrefix:"ui-create-select",openMenuOnFocus:!1,createOptionPosition:"first",allowCreateWhileLoading:!0,formatOptionLabel:v=>v.label,formatCreateLabel:h,components:{ClearIndicator:m,DropdownIndicator:E,LoadingIndicator:r,Option:y},unstyled:!0,styles:{control:(v,g)=>I(b({},v),{background:"var(--vscode-input-background)",height:"26px",maxHeight:"26px",minHeight:"26px",padding:"0px 0px 0px 8px;",boxShadow:"none",boxSizing:"border-box",borderWidth:"1px",borderStyle:"solid",borderColor:g.isFocused?"var(--vscode-focusBorder)":"var(--vscode-editorWidget-border)",color:"var(--vscode-input-foreground)",borderRadius:u.COMMON_INPUT_STYLES.borderRadius,"&:hover":{borderColor:"var(--vscode-focusBorder)"}}),input:(v,g)=>I(b({},v),{color:"var(--vscode-input-foreground)",background:"transparent",fontFamily:"var(--vscode-font-family)",fontSize:"13px",fontWeight:"normal",minHeight:"unset",padding:"1px 0px 1px 1px",outline:0}),menu:(v,g)=>I(b({},v),{background:"var(--vscode-menu-background, var(--vscode-input-background))",border:"1px solid var(--vscode-focusBorder)",boxSizing:"border-box",margin:"0px",borderRadius:0}),option:(v,g)=>I(b({},v),{fontFamily:"var(--vscode-font-family)",fontWeight:"var(--vscode-font-weight)",minHeight:"22px",height:"22px",lineHeight:"22px",color:g.isSelected?"var(--vscode-editorSuggestWidget-selectedForeground, var(--vscode-quickInputList-focusForeground, var(--vscode-editorSuggestWidget-foreground)))":"var(--vscode-editorSuggestWidget-foreground)",backgroundColor:p(g),letterSpacing:"normal",border:"0",padding:"0px 8px",fontSize:"13px","&:hover":{backgroundColor:g.isSelected?p(g):"var(--vscode-list-hoverBackground)",color:g.isSelected?"var(--vscode-editorSuggestWidget-selectedForeground, var(--vscode-quickInputList-focusForeground, var(--vscode-editorSuggestWidget-foreground)))":"var(--vscode-editorSuggestWidget-foreground)",cursor:"pointer"}}),placeholder:(v,g)=>I(b({},v),{fontSize:"13px",fontWeight:"normal",fontFamily:"var(--vscode-font-family)",color:"var(--vscode-input-placeholderForeground)"}),singleValue:(v,g)=>I(b({},v),{color:"var(--vscode-input-foreground)",background:"transparent",fontFamily:"var(--vscode-font-family)",fontSize:"13px",fontWeight:"normal",minHeight:"unset",padding:"1px 0px 1px 1px",outline:0}),valueContainer:(v,g)=>I(b({},v),{padding:"0px"}),indicatorsContainer:(v,g)=>I(b({},v),{padding:"0px 5px 0px 0px",cursor:"pointer"}),indicatorSeparator:(v,g)=>I(b({},v),{display:"none"}),dropdownIndicator:(v,g)=>I(b({},v),{padding:"0px"}),clearIndicator:(v,g)=>I(b({},v),{padding:"0px",cursor:"pointer"})}}))};n.UICreateSelect=f}),"./src/components/UICreateSelect/index.tsx":(function(c,n,t){"use strict";var l=this&&this.__createBinding||(Object.create?(function(o,e,s,d){d===void 0&&(d=s);var _=Object.getOwnPropertyDescriptor(e,s);(!_||("get"in _?!e.__esModule:_.writable||_.configurable))&&(_={enumerable:!0,get:function(){return e[s]}}),Object.defineProperty(o,d,_)}):(function(o,e,s,d){d===void 0&&(d=s),o[d]=e[s]})),a=this&&this.__exportStar||function(o,e){for(var s in o)s!=="default"&&!Object.prototype.hasOwnProperty.call(e,s)&&l(e,o,s)};Object.defineProperty(n,"__esModule",{value:!0}),a(t("./src/components/UICreateSelect/UICreateSelect.tsx"),n)}),"./src/components/UILoader/UILoader.tsx":(function(c,n,t){"use strict";var l=this&&this.__importDefault||function(s){return s&&s.__esModule?s:{default:s}};Object.defineProperty(n,"__esModule",{value:!0}),n.UILoader=n.UISpinnerSize=void 0;const a=l(t("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),o=t("../../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");Object.defineProperty(n,"UISpinnerSize",{enumerable:!0,get:function(){return o.SpinnerSize}}),t("./src/components/UILoader/UILoader.scss");class e extends a.default.Component{constructor(d){super(d)}render(){const{blockDOM:d,delayed:_}=this.props,u=()=>({root:b({},d&&{height:"100%"}),circle:[{borderColor:"var(--vscode-progressBar-background) var(--vscode-terminal-ansiBrightWhite) var(--vscode-terminal-ansiBrightWhite)",borderWidth:2,zIndex:1}],label:{color:"var(--vscode-foreground)",fontSize:14,fontWeight:"bold",zIndex:1}}),E=a.default.createElement(o.Spinner,I(b({},this.props),{styles:u}));if(d){const m=()=>({root:{backgroundColor:"transparent",selectors:{"&:before":{content:'""',position:"absolute",inset:0,backgroundColor:"var(--vscode-editor-background)",opacity:.6,zIndex:1}}}});return a.default.createElement(o.Overlay,{className:`ui-loader-blocker${_?" ui-loader--delayed":""}`,styles:m},E)}else return E}}n.UILoader=e}),"./src/components/UILoader/index.tsx":(function(c,n,t){"use strict";var l=this&&this.__createBinding||(Object.create?(function(o,e,s,d){d===void 0&&(d=s);var _=Object.getOwnPropertyDescriptor(e,s);(!_||("get"in _?!e.__esModule:_.writable||_.configurable))&&(_={enumerable:!0,get:function(){return e[s]}}),Object.defineProperty(o,d,_)}):(function(o,e,s,d){d===void 0&&(d=s),o[d]=e[s]})),a=this&&this.__exportStar||function(o,e){for(var s in o)s!=="default"&&!Object.prototype.hasOwnProperty.call(e,s)&&l(e,o,s)};Object.defineProperty(n,"__esModule",{value:!0}),a(t("./src/components/UILoader/UILoader.tsx"),n)}),"./stories/UICreateSelect.story.tsx":(function(c,n,t){"use strict";var l=this&&this.__createBinding||(Object.create?(function(m,r,y,p){p===void 0&&(p=y);var f=Object.getOwnPropertyDescriptor(r,y);(!f||("get"in f?!r.__esModule:f.writable||f.configurable))&&(f={enumerable:!0,get:function(){return r[y]}}),Object.defineProperty(m,p,f)}):(function(m,r,y,p){p===void 0&&(p=y),m[p]=r[y]})),a=this&&this.__setModuleDefault||(Object.create?(function(m,r){Object.defineProperty(m,"default",{enumerable:!0,value:r})}):function(m,r){m.default=r}),o=this&&this.__importStar||(function(){var m=function(r){return m=Object.getOwnPropertyNames||function(y){var p=[];for(var f in y)Object.prototype.hasOwnProperty.call(y,f)&&(p[p.length]=f);return p},m(r)};return function(r){if(r&&r.__esModule)return r;var y={};if(r!=null)for(var p=m(r),f=0;f<p.length;f++)p[f]!=="default"&&l(y,r,p[f]);return a(y,r),y}})();Object.defineProperty(n,"__esModule",{value:!0}),n.CreateSelect=void 0;const e=o(t("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=t("../../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"),d=t("./src/components/UICreateSelect/index.tsx"),_=t("./src/components/UILabel/index.tsx");n.default={title:"Dropdowns/CreateSelect"};const u={childrenGap:40},E=()=>{const m=S=>({label:S,value:S.toLowerCase().replace(/\W/g,"")}),r=[m("One"),m("Two"),m("Three")],[y,p]=(0,e.useState)(!1),[f,i]=(0,e.useState)(r),[h,v]=(0,e.useState)(),[g,x]=(0,e.useState)(),[L,M]=(0,e.useState)(!1),[A,B]=(0,e.useState)([]),[W,j]=(0,e.useState)(),[P,U]=(0,e.useState)(),$=e.default.createRef(),R=S=>{const O=m(S);p(!0),v(O),setTimeout(()=>{p(!1),i(C=>[...C,O]),x(O)},1e3)},k=S=>{const O=S;v(O),x(O)},w=(0,e.useRef)(null),K=S=>{const O=m(S);M(!0),j(O),setTimeout(()=>{var C;M(!1),B(N=>[...N,O]),U(O),(C=w.current)==null||C.focus()},1e3)},z=S=>{const O=S;j(O),U(O)},F=S=>e.default.createElement("div",{style:{fontSize:"12px",display:"flex",margin:"5px",padding:"0px 5px 0px 5px"}},"Nothing there, just create new ones...");return e.default.createElement(s.Stack,{tokens:u},e.default.createElement(s.Stack,{tokens:u},e.default.createElement(s.Text,{variant:"large",block:!0},"Create Select - default"),e.default.createElement(s.Stack,{horizontal:!0,tokens:u,style:{margin:0,padding:0}},e.default.createElement("div",{style:{width:"300px"}},e.default.createElement("div",null,e.default.createElement("div",null,e.default.createElement(_.UILabel,null,"UI Create Select Label")),e.default.createElement(d.UICreateSelect,{createText:"Add new value",isClearable:!0,isLoading:y,isDisabled:!1,isValidNewOption:S=>S.length>0,placeholder:"Search or enter a new value",options:f,value:h,onCreateOption:R,onChange:k}),e.default.createElement("div",{style:{padding:"20px 0",fontFamily:"var(--vscode-font-family)",fontSize:"13px"}},"Value selected: ",e.default.createElement("b",null,g==null?void 0:g.value))))),e.default.createElement(s.Text,{variant:"large",block:!0},"Create Select - no option by default"),e.default.createElement(s.Stack,{horizontal:!0,tokens:u,style:{margin:0,padding:0}},e.default.createElement("div",{style:{width:"300px"}},e.default.createElement("div",null,e.default.createElement("div",null,e.default.createElement(_.UILabel,null,"UI Create Select Label")),e.default.createElement(d.UICreateSelect,{creatableRef:w,createText:"Add new qualifier",isClearable:!0,isLoading:L,isDisabled:!1,isValidNewOption:S=>S.length>0,placeholder:"Search or enter a new qualifier value",options:A,value:W,noOptionsMessage:F,onCreateOption:K,onChange:z}),e.default.createElement("div",{style:{padding:"20px 0",fontFamily:"var(--vscode-font-family)",fontSize:"13px"}},"Value selected: ",e.default.createElement("b",null,P==null?void 0:P.value)))))))};n.CreateSelect=E})}]);})();
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
(()=>{(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[191],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/components/UIDatePicker/UIDatePicker.scss":((i,a,n)=>{var l=n("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js"),t=n("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js"),e=t(l);e.push([i.id,".ui-DatePicker{display:flex;align-items:center;height:24px;max-height:24px;min-height:24px;margin:0}.ui-DatePicker-toggle{position:relative;margin-left:10px}.ui-DatePicker-toggle input{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;cursor:pointer}.ui-DatePicker-toggle input::-webkit-calendar-picker-indicator{position:absolute;left:0;top:0;width:100%;height:100%;margin:0;padding:0;cursor:pointer}body[data-vscode-theme-kind=vscode-dark] .ui-DatePicker-toggle input{color-scheme:dark}",""]),i.exports=e}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js":(i=>{"use strict";i.exports=function(a){var n=[];return n.toString=function(){return this.map(function(t){var e="",s=typeof t[5]!="undefined";return t[4]&&(e+="@supports (".concat(t[4],") {")),t[2]&&(e+="@media ".concat(t[2]," {")),s&&(e+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),e+=a(t),s&&(e+="}"),t[2]&&(e+="}"),t[4]&&(e+="}"),e}).join("")},n.i=function(t,e,s,_,u){typeof t=="string"&&(t=[[null,t,void 0]]);var o={};if(s)for(var r=0;r<this.length;r++){var c=this[r][0];c!=null&&(o[c]=!0)}for(var p=0;p<t.length;p++){var d=[].concat(t[p]);s&&o[d[0]]||(typeof u!="undefined"&&(typeof d[5]=="undefined"||(d[1]="@layer".concat(d[5].length>0?" ".concat(d[5]):""," {").concat(d[1],"}")),d[5]=u),e&&(d[2]&&(d[1]="@media ".concat(d[2]," {").concat(d[1],"}")),d[2]=e),_&&(d[4]?(d[1]="@supports (".concat(d[4],") {").concat(d[1],"}"),d[4]=_):d[4]="".concat(_)),n.push(d))}},n}}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js":(i=>{"use strict";i.exports=function(a){return a[1]}}),"./src/components/UIDatePicker/UIDatePicker.scss":((i,a,n)=>{"use strict";n.r(a),n.d(a,{default:()=>I});var l=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),t=n.n(l),e=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js"),s=n.n(e),_=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js"),u=n.n(_),o=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),r=n.n(o),c=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js"),p=n.n(c),d=n("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js"),f=n.n(d),y=n("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass-embedded@1.97.3_sass@1.66.1_webpack@5.105.0/node_modules/sass-loader/dist/cjs.js!./src/components/UIDatePicker/UIDatePicker.scss"),m=n.n(y),P={};for(const v in y)v!=="default"&&(P[v]=()=>y[v]);n.d(a,P);var h={};h.styleTagTransform=f(),h.setAttributes=r(),h.insert=u().bind(null,"head"),h.domAPI=s(),h.insertStyleElement=p();var D=t()(m(),h);const I=m()&&m().locals?m().locals:void 0}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":(i=>{"use strict";var a=[];function n(e){for(var s=-1,_=0;_<a.length;_++)if(a[_].identifier===e){s=_;break}return s}function l(e,s){for(var _={},u=[],o=0;o<e.length;o++){var r=e[o],c=s.base?r[0]+s.base:r[0],p=_[c]||0,d="".concat(c," ").concat(p);_[c]=p+1;var f=n(d),y={css:r[1],media:r[2],sourceMap:r[3],supports:r[4],layer:r[5]};if(f!==-1)a[f].references++,a[f].updater(y);else{var m=t(y,s);s.byIndex=o,a.splice(o,0,{identifier:d,updater:m,references:1})}u.push(d)}return u}function t(e,s){var _=s.domAPI(s);_.update(e);var u=function(r){if(r){if(r.css===e.css&&r.media===e.media&&r.sourceMap===e.sourceMap&&r.supports===e.supports&&r.layer===e.layer)return;_.update(e=r)}else _.remove()};return u}i.exports=function(e,s){s=s||{},e=e||[];var _=l(e,s);return function(o){o=o||[];for(var r=0;r<_.length;r++){var c=_[r],p=n(c);a[p].references--}for(var d=l(o,s),f=0;f<_.length;f++){var y=_[f],m=n(y);a[m].references===0&&(a[m].updater(),a.splice(m,1))}_=d}}}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js":(i=>{"use strict";var a={};function n(t){if(typeof a[t]=="undefined"){var e=document.querySelector(t);if(window.HTMLIFrameElement&&e instanceof window.HTMLIFrameElement)try{e=e.contentDocument.head}catch(s){e=null}a[t]=e}return a[t]}function l(t,e){var s=n(t);if(!s)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");s.appendChild(e)}i.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js":(i=>{"use strict";function a(n){var l=document.createElement("style");return n.setAttributes(l,n.attributes),n.insert(l,n.options),l}i.exports=a}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":((i,a,n)=>{"use strict";function l(t){var e=n.nc;e&&t.setAttribute("nonce",e)}i.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js":(i=>{"use strict";function a(t,e,s){var _="";s.supports&&(_+="@supports (".concat(s.supports,") {")),s.media&&(_+="@media ".concat(s.media," {"));var u=typeof s.layer!="undefined";u&&(_+="@layer".concat(s.layer.length>0?" ".concat(s.layer):""," {")),_+=s.css,u&&(_+="}"),s.media&&(_+="}"),s.supports&&(_+="}");var o=s.sourceMap;o&&typeof btoa!="undefined"&&(_+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(o))))," */")),e.styleTagTransform(_,t,e.options)}function n(t){if(t.parentNode===null)return!1;t.parentNode.removeChild(t)}function l(t){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var e=t.insertStyleElement(t);return{update:function(_){a(e,t,_)},remove:function(){n(e)}}}i.exports=l}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js":(i=>{"use strict";function a(n,l){if(l.styleSheet)l.styleSheet.cssText=n;else{for(;l.firstChild;)l.removeChild(l.firstChild);l.appendChild(document.createTextNode(n))}}i.exports=a}),"./src/components/UIDatePicker/UIDatePicker.tsx":(function(i,a,n){"use strict";var l=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(a,"__esModule",{value:!0}),a.UIDatePicker=void 0;const t=l(n("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),e=n("./src/components/UIInput/index.tsx"),s=n("./src/components/UIIcon/index.tsx"),_=n("./src/components/Icons.tsx");n("./src/components/UIDatePicker/UIDatePicker.scss");class u extends t.default.Component{constructor(r){var c;super(r),this.state={value:""},this.dateRegex=/^\d{4}-\d{2}-\d{2}$/,this.dateTimeRegex=/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}$/,this.state.value=(c=r.defaultValue)!=null?c:"",this.onInputChange=this.onInputChange.bind(this),this.onPickerChange=this.onPickerChange.bind(this)}onInputChange(r,c=""){var p,d;c=c.trim(),(d=(p=this.props).onChange)==null||d.call(p,r,c),this.setState({value:c})}onPickerChange(r){var p,d;let c=r.target.value;!this.props.dateOnly&&!this.dateTimeRegex.test(c)&&(c=`${r.target.value}:00`),(d=(p=this.props).onChange)==null||d.call(p,r,c),this.setState({value:c})}render(){const r=this.dateRegex.test(this.state.value)||this.dateTimeRegex.test(this.state.value);return t.default.createElement("div",{className:"ui-DatePicker",onKeyDown:this.props.onKeyDown,onClick:this.props.onClick},t.default.createElement(e.UITextInput,{componentRef:this.props.componentRef,errorMessage:this.props.errorMessage,value:this.state.value,onChange:this.onInputChange}),t.default.createElement("div",{className:"ui-DatePicker-toggle"},t.default.createElement(s.UIIcon,{iconName:_.UiIcons.Calendar}),t.default.createElement("input",{type:this.props.dateOnly?"date":"datetime-local",step:"1",value:r?this.state.value:"",onChange:this.onPickerChange})))}}a.UIDatePicker=u}),"./src/components/UIDatePicker/index.tsx":(function(i,a,n){"use strict";var l=this&&this.__createBinding||(Object.create?(function(e,s,_,u){u===void 0&&(u=_);var o=Object.getOwnPropertyDescriptor(s,_);(!o||("get"in o?!s.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return s[_]}}),Object.defineProperty(e,u,o)}):(function(e,s,_,u){u===void 0&&(u=_),e[u]=s[_]})),t=this&&this.__exportStar||function(e,s){for(var _ in e)_!=="default"&&!Object.prototype.hasOwnProperty.call(s,_)&&l(s,e,_)};Object.defineProperty(a,"__esModule",{value:!0}),t(n("./src/components/UIDatePicker/UIDatePicker.tsx"),a)}),"./stories/UIDatePicker.story.tsx":(function(i,a,n){"use strict";var l=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(a,"__esModule",{value:!0}),a.defaultUsage=void 0;const t=l(n("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),e=n("../../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"),s=n("./src/components/UIDatePicker/index.tsx");a.default={title:"Basic Inputs/DatePicker"};const _={childrenGap:40},u=()=>t.default.createElement(e.Stack,{tokens:_,style:{width:300}},t.default.createElement(e.Stack,{tokens:{childrenGap:16}},t.default.createElement(e.Text,{variant:"large",className:"textColor"},"UIDatePicker"),t.default.createElement(s.UIDatePicker,{defaultValue:"2018-06-12T19:30"})),t.default.createElement(e.Stack,{tokens:{childrenGap:16}},t.default.createElement(e.Text,{variant:"large",className:"textColor"},"UIDatePicker with only date"),t.default.createElement(s.UIDatePicker,{defaultValue:"2020-07-21",dateOnly:!0})));a.defaultUsage=u})}]);})();
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";(()=>{var B=Object.defineProperty,M=Object.defineProperties;var w=Object.getOwnPropertyDescriptors;var C=Object.getOwnPropertySymbols;var P=Object.prototype.hasOwnProperty,z=Object.prototype.propertyIsEnumerable;var k=(d,a,o)=>a in d?B(d,a,{enumerable:!0,configurable:!0,writable:!0,value:o}):d[a]=o,T=(d,a)=>{for(var o in a||(a={}))P.call(a,o)&&k(d,o,a[o]);if(C)for(var o of C(a))z.call(a,o)&&k(d,o,a[o]);return d},A=(d,a)=>M(d,w(a));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[937],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/api.js":(d=>{d.exports=function(a){var o=[];return o.toString=function(){return this.map(function(r){var t="",e=typeof r[5]!="undefined";return r[4]&&(t+="@supports (".concat(r[4],") {")),r[2]&&(t+="@media ".concat(r[2]," {")),e&&(t+="@layer".concat(r[5].length>0?" ".concat(r[5]):""," {")),t+=a(r),e&&(t+="}"),r[2]&&(t+="}"),r[4]&&(t+="}"),t}).join("")},o.i=function(r,t,e,n,h){typeof r=="string"&&(r=[[null,r,void 0]]);var f={};if(e)for(var l=0;l<this.length;l++){var I=this[l][0];I!=null&&(f[I]=!0)}for(var x=0;x<r.length;x++){var i=[].concat(r[x]);e&&f[i[0]]||(typeof h!="undefined"&&(typeof i[5]=="undefined"||(i[1]="@layer".concat(i[5].length>0?" ".concat(i[5]):""," {").concat(i[1],"}")),i[5]=h),t&&(i[2]&&(i[1]="@media ".concat(i[2]," {").concat(i[1],"}")),i[2]=t),n&&(i[4]?(i[1]="@supports (".concat(i[4],") {").concat(i[1],"}"),i[4]=n):i[4]="".concat(n)),o.push(i))}},o}}),"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.105.0/node_modules/css-loader/dist/runtime/noSourceMaps.js":(d=>{d.exports=function(a){return a[1]}}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js":(d=>{var a=[];function o(t){for(var e=-1,n=0;n<a.length;n++)if(a[n].identifier===t){e=n;break}return e}function p(t,e){for(var n={},h=[],f=0;f<t.length;f++){var l=t[f],I=e.base?l[0]+e.base:l[0],x=n[I]||0,i="".concat(I," ").concat(x);n[I]=x+1;var g=o(i),E={css:l[1],media:l[2],sourceMap:l[3],supports:l[4],layer:l[5]};if(g!==-1)a[g].references++,a[g].updater(E);else{var v=r(E,e);e.byIndex=f,a.splice(f,0,{identifier:i,updater:v,references:1})}h.push(i)}return h}function r(t,e){var n=e.domAPI(e);n.update(t);var h=function(l){if(l){if(l.css===t.css&&l.media===t.media&&l.sourceMap===t.sourceMap&&l.supports===t.supports&&l.layer===t.layer)return;n.update(t=l)}else n.remove()};return h}d.exports=function(t,e){e=e||{},t=t||[];var n=p(t,e);return function(f){f=f||[];for(var l=0;l<n.length;l++){var I=n[l],x=o(I);a[x].references--}for(var i=p(f,e),g=0;g<n.length;g++){var E=n[g],v=o(E);a[v].references===0&&(a[v].updater(),a.splice(v,1))}n=i}}}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertBySelector.js":(d=>{var a={};function o(r){if(typeof a[r]=="undefined"){var t=document.querySelector(r);if(window.HTMLIFrameElement&&t instanceof window.HTMLIFrameElement)try{t=t.contentDocument.head}catch(e){t=null}a[r]=t}return a[r]}function p(r,t){var e=o(r);if(!e)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");e.appendChild(t)}d.exports=p}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/insertStyleElement.js":(d=>{function a(o){var p=document.createElement("style");return o.setAttributes(p,o.attributes),o.insert(p,o.options),p}d.exports=a}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js":((d,a,o)=>{function p(r){var t=o.nc;t&&r.setAttribute("nonce",t)}d.exports=p}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleDomAPI.js":(d=>{function a(r,t,e){var n="";e.supports&&(n+="@supports (".concat(e.supports,") {")),e.media&&(n+="@media ".concat(e.media," {"));var h=typeof e.layer!="undefined";h&&(n+="@layer".concat(e.layer.length>0?" ".concat(e.layer):""," {")),n+=e.css,h&&(n+="}"),e.media&&(n+="}"),e.supports&&(n+="}");var f=e.sourceMap;f&&typeof btoa!="undefined"&&(n+=`
|
|
2
|
+
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(f))))," */")),t.styleTagTransform(n,r,t.options)}function o(r){if(r.parentNode===null)return!1;r.parentNode.removeChild(r)}function p(r){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var t=r.insertStyleElement(r);return{update:function(n){a(t,r,n)},remove:function(){o(t)}}}d.exports=p}),"../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.105.0/node_modules/style-loader/dist/runtime/styleTagTransform.js":(d=>{function a(o,p){if(p.styleSheet)p.styleSheet.cssText=o;else{for(;p.firstChild;)p.removeChild(p.firstChild);p.appendChild(document.createTextNode(o))}}d.exports=a}),"./stories/UIDialog.story.tsx":(function(d,a,o){var p=this&&this.__createBinding||(Object.create?(function(c,u,m,s){s===void 0&&(s=m);var y=Object.getOwnPropertyDescriptor(u,m);(!y||("get"in y?!u.__esModule:y.writable||y.configurable))&&(y={enumerable:!0,get:function(){return u[m]}}),Object.defineProperty(c,s,y)}):(function(c,u,m,s){s===void 0&&(s=m),c[s]=u[m]})),r=this&&this.__setModuleDefault||(Object.create?(function(c,u){Object.defineProperty(c,"default",{enumerable:!0,value:u})}):function(c,u){c.default=u}),t=this&&this.__importStar||(function(){var c=function(u){return c=Object.getOwnPropertyNames||function(m){var s=[];for(var y in m)Object.prototype.hasOwnProperty.call(m,y)&&(s[s.length]=y);return s},c(u)};return function(u){if(u&&u.__esModule)return u;var m={};if(u!=null)for(var s=c(u),y=0;y<s.length;y++)s[y]!=="default"&&p(m,u,s[y]);return r(m,u),m}})();Object.defineProperty(a,"__esModule",{value:!0}),a.Dialog=void 0;const e=t(o("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),n=o("../../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"),h=o("./src/components/UIDialog/index.ts"),f=o("./src/components/UIButton/index.tsx"),l=o("./src/components/UIInput/index.tsx"),I=o("./src/components/UIDropdown/index.tsx"),x=o("./src/components/UIComboBox/index.tsx"),i=o("./src/components/UICheckbox/index.tsx");a.default={title:"Dialogs/Dialogs"};const g={childrenGap:40},E={main:{".ms-TextField-wrapper > .ms-Label":{margin:0}}};class v extends e.default.Component{constructor(){super(...arguments),this.state={isOpen:!1,text:"Some Text"},this.onChange=u=>{this.setState({text:u.target.value})},this.onToggle=()=>{this.setState({isOpen:!this.state.isOpen})},this.onAccept=()=>{alert(`You wrote: ${this.state.text}`),this.setState({isOpen:!1})}}render(){const{draggable:u}=this.props,m=[{key:"111",text:"Dummy option 111"},{key:"222",text:"Dummy option 222"}],s=this.props.draggable?{modalProps:{dragOptions:{moveMenuItemText:"Move",closeMenuItemText:"Close",menu:n.ContextualMenu,keepInBounds:!0}}}:void 0;return e.default.createElement(e.default.Fragment,null,e.default.createElement(f.UIDefaultButton,{onClick:this.onToggle,primary:!0},u?"Open Draggable Dialog":"Open Dialog"),e.default.createElement(h.UIDialog,A(T({isOpen:this.state.isOpen,isOpenAnimated:this.props.openAnimation,isBlocking:!0,title:"Header Title",acceptButtonText:"Accept",cancelButtonText:"Cancel"},s),{onAccept:this.onAccept,styles:E,onCancel:this.onToggle,onDismiss:this.onToggle}),e.default.createElement(l.UITextInput,{label:"Dialog Content",value:this.state.text,onChange:this.onChange}),e.default.createElement(I.UIDropdown,{label:"Dummy",options:m}),e.default.createElement(x.UIComboBox,{label:"Dummy",highlight:!0,options:m})))}}const D=c=>{const[u,m]=(0,e.useState)(!1),s=()=>{m(!u)},y=T({},E.main),{size:b}=c;b&&(y.height=b);let U="Open Large Dialog";return b&&(U+=` height=${b}`),e.default.createElement(e.default.Fragment,null,e.default.createElement(f.UIDefaultButton,{onClick:s,primary:!0},U),e.default.createElement(h.UIDialog,{isOpen:u,isOpenAnimated:c.openAnimation,isBlocking:!0,title:"Header Title",acceptButtonText:"Accept",cancelButtonText:"Cancel",styles:{main:y},onAccept:s,onCancel:s,onDismiss:s},e.default.createElement(I.UIDropdown,{label:"Dummy",options:[]}),e.default.createElement(l.UITextInput,{label:"Username"}),e.default.createElement(l.UITextInput,{label:"Email"}),e.default.createElement(l.UITextInput,{label:"Password",type:"password"}),e.default.createElement(l.UITextInput,{label:"Email"}),e.default.createElement(l.UITextInput,{label:"First name"}),e.default.createElement(l.UITextInput,{label:"Last name"}),e.default.createElement(l.UITextInput,{label:"Address"}),e.default.createElement(l.UITextInput,{label:"State"}),e.default.createElement(l.UITextInput,{label:"Country"}),e.default.createElement(l.UITextInput,{label:"Phone"}),e.default.createElement(l.UITextInput,{label:"Dummy 1"}),e.default.createElement(l.UITextInput,{label:"Dummy 2"}),e.default.createElement(l.UITextInput,{label:"Dummy 3"}),e.default.createElement(l.UITextInput,{label:"Dummy 4"}),e.default.createElement(l.UITextInput,{label:"Dummy 5"})))},S=c=>{const[u,m]=(0,e.useState)(!1),s=()=>{m(!u)};return e.default.createElement(e.default.Fragment,null,e.default.createElement(f.UIDefaultButton,{onClick:s,primary:!0},"Open Confirm Dialog"),e.default.createElement(h.UIDialog,{isOpen:u,isOpenAnimated:c.openAnimation,isBlocking:!0,onAccept:s,onCancel:s,onDismiss:s,acceptButtonText:"Yes",cancelButtonText:"No",title:"Delete Confirmation",dialogContentProps:{subText:"Are you sure you want to delete entry? This action cannot be undone."}}))},_=c=>{const[u,m]=(0,e.useState)(!1),s=()=>{m(!u)};return e.default.createElement(e.default.Fragment,null,e.default.createElement(f.UIDefaultButton,{onClick:s,primary:!0},"Open Dialog with multiple buttons"),e.default.createElement(h.UIDialog,{isOpen:u,isOpenAnimated:c.openAnimation,isBlocking:!0,onDismiss:s,title:"Delete Confirmation",dialogContentProps:{subText:"This entry includes subelements. Are you sure you want to delete the entry or only its subelements? This action cannot be undone."},footer:[e.default.createElement(f.UIDefaultButton,{key:"1",onClick:s,primary:!0,text:"Delete entry and subelements"}),e.default.createElement(f.UIDefaultButton,{key:"2",onClick:s,text:"Delete entry only"}),e.default.createElement(f.UIDefaultButton,{key:"3",onClick:s,text:"Cancel"})]}))},O=()=>{const[c,u]=(0,e.useState)(!0);return e.default.createElement(n.Stack,{tokens:g},e.default.createElement(n.Stack,{tokens:g},e.default.createElement(n.Text,{variant:"large",block:!0},"Dialogs"),e.default.createElement(n.Stack,{horizontal:!0,tokens:g},e.default.createElement(i.UICheckbox,{label:"Open animation enabled",checked:c,onChange:(m,s)=>{u(s)}})),e.default.createElement(n.Stack,{horizontal:!0,tokens:g},e.default.createElement(v,{draggable:!1,openAnimation:c})),e.default.createElement(n.Stack,{horizontal:!0,tokens:g},e.default.createElement(v,{draggable:!1,openAnimation:c})),e.default.createElement(n.Stack,{horizontal:!0,tokens:g},e.default.createElement(v,{draggable:!0,openAnimation:c})),e.default.createElement(n.Stack,{horizontal:!0,tokens:g},e.default.createElement(D,{openAnimation:c})),e.default.createElement(n.Stack,{horizontal:!0,tokens:g},e.default.createElement(D,{size:400,openAnimation:c})),e.default.createElement(n.Stack,{horizontal:!0,tokens:g},e.default.createElement(D,{openAnimation:c})),e.default.createElement(n.Stack,{horizontal:!0,tokens:g},e.default.createElement(S,{openAnimation:c})),e.default.createElement(n.Stack,{horizontal:!0,tokens:g},e.default.createElement(_,{openAnimation:c}))))};a.Dialog=O})}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var T=Object.defineProperty,B=Object.defineProperties;var O=Object.getOwnPropertyDescriptors;var x=Object.getOwnPropertySymbols;var P=Object.prototype.hasOwnProperty,G=Object.prototype.propertyIsEnumerable;var w=(u,t,d)=>t in u?T(u,t,{enumerable:!0,configurable:!0,writable:!0,value:d}):u[t]=d,i=(u,t)=>{for(var d in t||(t={}))P.call(t,d)&&w(u,d,t[d]);if(x)for(var d of x(t))G.call(t,d)&&w(u,d,t[d]);return u},c=(u,t)=>B(u,O(t));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[6],{"./stories/UIDropdown.story.tsx":(function(u,t,d){var p=this&&this.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(t,"__esModule",{value:!0}),t.customRender=t.groupsAndSeparators=t.accessibilityStates=t.UseDropdownAsMenuMinWidth=t.Messages=t.MultiSelectDropdown=t.States=t.Short=t.Basic=void 0;const e=p(d("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),E=d("../../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"),a=d("./src/components/index.tsx"),n=d("./test/__mock__/select-data.ts");t.default={title:"Dropdowns/Dropdown"};const k=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(a.UIDropdown,{options:n.data,useDropdownAsMenuMinWidth:!0}));t.Basic=k;const D=()=>e.default.createElement("div",{style:{width:"150px"}},e.default.createElement(a.UIDropdown,{options:n.shortData}),e.default.createElement(a.UIDropdown,{options:n.shortData,disabled:!0}));t.Short=D;const I=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(a.UIDropdown,{options:n.data,label:"Error",errorMessage:"Dummy Error"}),e.default.createElement(a.UIDropdown,{options:n.data,label:"Disabled",disabled:!0}),e.default.createElement(a.UIDropdown,{options:n.data,label:"Required",required:!0}));t.States=I;const M=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(a.UIDropdown,{options:n.data,multiSelect:!0,responsiveMode:5}));t.MultiSelectDropdown=M;const S=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(a.UIDropdown,{options:n.data,label:"Error",errorMessage:"Dummy Error"}),e.default.createElement(a.UIDropdown,{options:n.data,label:"Warning",warningMessage:"Dummy Warning"}),e.default.createElement(a.UIDropdown,{options:n.data,label:"Info",infoMessage:"Dummy Info"}));t.Messages=S;const U=()=>e.default.createElement("div",{style:{width:"300px"}},e.default.createElement("div",null,e.default.createElement("div",null,"useDropdownAsMenuMinWidth ON"),e.default.createElement(a.UIDropdown,{label:"Long",options:n.data,useDropdownAsMenuMinWidth:!0}),e.default.createElement(a.UIDropdown,{label:"Short",options:n.shortData,useDropdownAsMenuMinWidth:!0})),e.default.createElement("div",null,e.default.createElement("div",null,"useDropdownAsMenuMinWidth OFF"),e.default.createElement(a.UIDropdown,{label:"Long",options:n.data}),e.default.createElement(a.UIDropdown,{label:"Short",options:n.shortData})));t.UseDropdownAsMenuMinWidth=U;const A=()=>{const[l,y]=e.default.useState(!1),[r,s]=e.default.useState("EE"),h={childrenGap:40},f=Array.isArray(r)?r:void 0,m={options:n.data,highlight:!0,allowFreeform:!0,useComboBoxAsMenuMinWidth:!0,multiSelect:l,onChange:(C,o)=>{if(Array.isArray(r)){const K=[...r,o==null?void 0:o.key].filter(R=>o!=null&&o.selected?!0:R!==(o==null?void 0:o.key));s(K)}else o&&s(o.key)}};return e.default.createElement("div",null,e.default.createElement(a.UICheckbox,{label:"Multi Select",checked:l,onChange:(C,o)=>{o&&!Array.isArray(r)?s([r]):!o&&Array.isArray(r)&&s(r[0]),y(o)}}),e.default.createElement(E.Stack,{horizontal:!0,tokens:h},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(a.UIDropdown,c(i({},m),{placeholder:"Placeholder"}))),e.default.createElement("td",null,e.default.createElement(a.UIDropdown,c(i({},m),{selectedKey:r,selectedKeys:f})))),e.default.createElement("tr",null,e.default.createElement("td",null,"Error"),e.default.createElement("td",null,e.default.createElement(a.UIDropdown,c(i({},m),{placeholder:"Placeholder",errorMessage:"Dummy error"}))),e.default.createElement("td",null,e.default.createElement(a.UIDropdown,c(i({},m),{errorMessage:"Dummy error",selectedKey:r,selectedKeys:f})))),e.default.createElement("tr",null,e.default.createElement("td",null,"Disabled"),e.default.createElement("td",null,e.default.createElement(a.UIDropdown,c(i({},m),{placeholder:"Placeholder",disabled:!0}))),e.default.createElement("td",null,e.default.createElement(a.UIDropdown,c(i({},m),{selectedKey:r,selectedKeys:f,disabled:!0})))),e.default.createElement("tr",null,e.default.createElement("td",null,"Read Only"),e.default.createElement("td",null,e.default.createElement(a.UIDropdown,c(i({},m),{placeholder:"Placeholder",readOnly:!0}))),e.default.createElement("td",null,e.default.createElement(a.UIDropdown,c(i({},m),{selectedKey:r,selectedKeys:f,readOnly:!0})))))))};t.accessibilityStates=A;const g=()=>{const l=[...n.groupsData];return l.splice(4,0,{key:"div1",text:"",itemType:a.UISelectableOptionMenuItemType.Divider}),l.splice(14,0,{key:"div1",text:"",itemType:a.UISelectableOptionMenuItemType.Divider}),l.splice(18,0,{key:"div1",text:"",itemType:a.UISelectableOptionMenuItemType.Divider}),e.default.createElement("div",{style:{width:"300px"}},e.default.createElement(a.UIDropdown,{options:n.groupsData,label:"Menu items with headers"}),e.default.createElement(a.UIDropdown,{options:l,label:"Menu items with dividers and headers"}),e.default.createElement(a.UIDropdown,{options:n.groupsData,multiSelect:!0,label:"Menu items with headers - multi select"}),e.default.createElement(a.UIDropdown,{options:l,multiSelect:!0,label:"Menu items with dividers and headers - multi select"}))};t.groupsAndSeparators=g;const b=["AR","BR","DK"],v=n.data.map(l=>b.includes(l.key)?c(i({},l),{editable:!0}):l),_=()=>e.default.createElement(a.UIDropdown,{options:v,onRenderOption:(l,y)=>{var r;return"editable"in(l!=null?l:{})?e.default.createElement(a.UITextInput,{onMouseDown:s=>{s.target.focus()},onClick:s=>{s.nativeEvent.preventDefault(),s.nativeEvent.stopPropagation(),s.preventDefault(),s.stopPropagation()}}):(r=y==null?void 0:y(l))!=null?r:null},onRenderItem:(l,y)=>{var r;return(r=y==null?void 0:y(l))!=null?r:null}});t.customRender=_}),"./test/__mock__/select-data.ts":((u,t,d)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.groupsData=t.shortData=t.data=void 0;const p=d("./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 e={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 E in e){t.groupsData.push({key:E,text:E.charAt(0).toUpperCase()+E.slice(1),itemType:p.UISelectableOptionMenuItemType.Header});const a=e[E];for(const n of a){const k=t.data.find(D=>D.key===n);k&&t.groupsData.push(k)}}})}]);})();
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";(()=>{var _e=Object.defineProperty,Ne=Object.defineProperties;var Le=Object.getOwnPropertyDescriptors;var Ie=Object.getOwnPropertySymbols;var Ue=Object.prototype.hasOwnProperty,Pe=Object.prototype.propertyIsEnumerable;var Se=(R,w,m)=>w in R?_e(R,w,{enumerable:!0,configurable:!0,writable:!0,value:m}):R[w]=m,B=(R,w)=>{for(var m in w||(w={}))Ue.call(w,m)&&Se(R,m,w[m]);if(Ie)for(var m of Ie(w))Pe.call(w,m)&&Se(R,m,w[m]);return R},F=(R,w)=>Ne(R,Le(w));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[812],{"./stories/UIFlexibleTable.story.tsx":function(R,w,m){var ye=this&&this.__createBinding||(Object.create?function(s,l,t,a){a===void 0&&(a=t);var r=Object.getOwnPropertyDescriptor(l,t);(!r||("get"in r?!l.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return l[t]}}),Object.defineProperty(s,a,r)}:function(s,l,t,a){a===void 0&&(a=t),s[a]=l[t]}),De=this&&this.__setModuleDefault||(Object.create?function(s,l){Object.defineProperty(s,"default",{enumerable:!0,value:l})}:function(s,l){s.default=l}),Ce=this&&this.__importStar||function(){var s=function(l){return s=Object.getOwnPropertyNames||function(t){var a=[];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(a[a.length]=r);return a},s(l)};return function(l){if(l&&l.__esModule)return l;var t={};if(l!=null)for(var a=s(l),r=0;r<a.length;r++)a[r]!=="default"&&ye(t,l,a[r]);return De(t,l),t}}();Object.defineProperty(w,"__esModule",{value:!0}),w.WrappingTable=w.InlineFlexTable=void 0;const e=Ce(m("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),c=m("./src/components/index.tsx"),me=m("../../node_modules/.pnpm/react-movable@2.5.4_react-dom@16.14.0_react@16.14.0/node_modules/react-movable/lib/index.js");w.default={title:"Tables/UIFlexibleTable"};const _=["table1","table2"],N=Array.from({length:10}).map((s,l)=>({key:`column${l+1}`,title:l===0?"Beginning Column":`Column ${l+1}`,tooltip:`Tooltip for column #${l+1}`}));N.push({key:"preferred",title:"Preferred",hidden:!0});const Z=s=>{const l={};return N.forEach((t,a)=>{l[t.key]=a<5?`sample_${s}${a}`:"a"}),l},pe=[],ge=(s,l,t)=>s.map((r,f)=>{const x={};N.forEach((h,I)=>{x[h.key]={type:I<5?"input":l&&I===9?"link":"dropdown",value:s[f][h.key]}});const S=x.preferred.value==="1";return{key:f.toFixed(0),title:`Row ${f+1}`,className:t===f||t===100?"active-row":S?"preferred-row":"",cells:x,tooltip:`Tooltip for row #${f+1}`}});function xe(s,l,t,a){const r=s.value.value,f=s.colIndex===1&&s.rowIndex===2&&a,x=N[s.colIndex];switch(s.value.type){case"dropdown":{const S=["a","b","c"].map(h=>({key:h,text:`Option ${h.toUpperCase()}`}));return{title:f?"Custom Title for spanned cell":void 0,isSpan:f,cellClassNames:f?"spanned-cell":a&&s.rowIndex===2&&!f?"not-spanned-cell":void 0,content:e.default.createElement(c.UIDropdown,{options:S,selectedKey:r,disabled:l,onChange:(h,I,A)=>{var L;return t((L=I==null?void 0:I.key.toString())!=null?L:"")},title:x.tooltip})}}case"input":return{title:f?"Custom Title for spanned cell":void 0,isSpan:f,cellClassNames:[f?"spanned-cell":a&&s.rowIndex===2&&!f?"not-spanned-cell":""],content:e.default.createElement(ve,{value:r,readonly:l,onChange:S=>t(S),title:x.tooltip})};default:return{content:e.default.createElement(c.UILink,{href:"",title:"Tooltip for navigation"},"Link")}}}function ve(s){const[l,t]=(0,e.useState)("");(0,e.useEffect)(()=>{t(s.value)},[s.value]);const a=r=>{t(r)};return e.default.createElement(c.UITextInput,{value:l,readOnly:s.readonly,onChange:(r,f)=>a(f||""),onBlur:()=>{s.value!==l&&setTimeout(()=>{s.onChange(l)},0)},title:s.title})}function he(s){const l=Z(s.length);s.push(l)}const ke=`
|
|
1
|
+
"use strict";(()=>{var _e=Object.defineProperty,Ne=Object.defineProperties;var Le=Object.getOwnPropertyDescriptors;var Ie=Object.getOwnPropertySymbols;var Ue=Object.prototype.hasOwnProperty,Pe=Object.prototype.propertyIsEnumerable;var Se=(R,w,m)=>w in R?_e(R,w,{enumerable:!0,configurable:!0,writable:!0,value:m}):R[w]=m,B=(R,w)=>{for(var m in w||(w={}))Ue.call(w,m)&&Se(R,m,w[m]);if(Ie)for(var m of Ie(w))Pe.call(w,m)&&Se(R,m,w[m]);return R},F=(R,w)=>Ne(R,Le(w));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[812],{"./stories/UIFlexibleTable.story.tsx":(function(R,w,m){var ye=this&&this.__createBinding||(Object.create?(function(s,l,t,a){a===void 0&&(a=t);var r=Object.getOwnPropertyDescriptor(l,t);(!r||("get"in r?!l.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return l[t]}}),Object.defineProperty(s,a,r)}):(function(s,l,t,a){a===void 0&&(a=t),s[a]=l[t]})),De=this&&this.__setModuleDefault||(Object.create?(function(s,l){Object.defineProperty(s,"default",{enumerable:!0,value:l})}):function(s,l){s.default=l}),Ce=this&&this.__importStar||(function(){var s=function(l){return s=Object.getOwnPropertyNames||function(t){var a=[];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(a[a.length]=r);return a},s(l)};return function(l){if(l&&l.__esModule)return l;var t={};if(l!=null)for(var a=s(l),r=0;r<a.length;r++)a[r]!=="default"&&ye(t,l,a[r]);return De(t,l),t}})();Object.defineProperty(w,"__esModule",{value:!0}),w.WrappingTable=w.InlineFlexTable=void 0;const e=Ce(m("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),c=m("./src/components/index.tsx"),me=m("../../node_modules/.pnpm/react-movable@2.5.4_react-dom@16.14.0_react@16.14.0/node_modules/react-movable/lib/index.js");w.default={title:"Tables/UIFlexibleTable"};const _=["table1","table2"],N=Array.from({length:10}).map((s,l)=>({key:`column${l+1}`,title:l===0?"Beginning Column":`Column ${l+1}`,tooltip:`Tooltip for column #${l+1}`}));N.push({key:"preferred",title:"Preferred",hidden:!0});const Z=s=>{const l={};return N.forEach((t,a)=>{l[t.key]=a<5?`sample_${s}${a}`:"a"}),l},pe=[],ge=(s,l,t)=>s.map((r,f)=>{const x={};N.forEach((h,I)=>{x[h.key]={type:I<5?"input":l&&I===9?"link":"dropdown",value:s[f][h.key]}});const S=x.preferred.value==="1";return{key:f.toFixed(0),title:`Row ${f+1}`,className:t===f||t===100?"active-row":S?"preferred-row":"",cells:x,tooltip:`Tooltip for row #${f+1}`}});function xe(s,l,t,a){const r=s.value.value,f=s.colIndex===1&&s.rowIndex===2&&a,x=N[s.colIndex];switch(s.value.type){case"dropdown":{const S=["a","b","c"].map(h=>({key:h,text:`Option ${h.toUpperCase()}`}));return{title:f?"Custom Title for spanned cell":void 0,isSpan:f,cellClassNames:f?"spanned-cell":a&&s.rowIndex===2&&!f?"not-spanned-cell":void 0,content:e.default.createElement(c.UIDropdown,{options:S,selectedKey:r,disabled:l,onChange:(h,I,A)=>{var L;return t((L=I==null?void 0:I.key.toString())!=null?L:"")},title:x.tooltip})}}case"input":return{title:f?"Custom Title for spanned cell":void 0,isSpan:f,cellClassNames:[f?"spanned-cell":a&&s.rowIndex===2&&!f?"not-spanned-cell":""],content:e.default.createElement(ve,{value:r,readonly:l,onChange:S=>t(S),title:x.tooltip})};default:return{content:e.default.createElement(c.UILink,{href:"",title:"Tooltip for navigation"},"Link")}}}function ve(s){const[l,t]=(0,e.useState)("");(0,e.useEffect)(()=>{t(s.value)},[s.value]);const a=r=>{t(r)};return e.default.createElement(c.UITextInput,{value:l,readOnly:s.readonly,onChange:(r,f)=>a(f||""),onBlur:()=>{s.value!==l&&setTimeout(()=>{s.onChange(l)},0)},title:s.title})}function he(s){const l=Z(s.length);s.push(l)}const ke=`
|
|
2
2
|
.flexible-table {
|
|
3
3
|
font-size: 13px;
|
|
4
4
|
}
|
|
@@ -71,4 +71,4 @@ body .flexible-table-content-table-row.dragged {
|
|
|
71
71
|
.flexible-table-content-table-row-wrapper.wrapping-layout .flexible-table-content-table-row-item-data-cells-wrapper.spanned-cell {
|
|
72
72
|
width: 240px !important;
|
|
73
73
|
}
|
|
74
|
-
`,Ae=()=>{const[s,l]=(0,e.useState)(pe),[t,a]=(0,e.useState)([]),[r,f]=(0,e.useState)(!1),[x,S]=(0,e.useState)(!0),[h,I]=(0,e.useState)(!0),[A,L]=(0,e.useState)(!1),[$,q]=(0,e.useState)(!1),[U,ee]=(0,e.useState)(!1),[M,te]=(0,e.useState)(!1),[C,ne]=(0,e.useState)(!1),[P,oe]=(0,e.useState)(!1),[y,le]=(0,e.useState)(!1),[W,ae]=(0,e.useState)(!1),[v,se]=(0,e.useState)(!1),[O,z]=(0,e.useState)(-1),[j,re]=(0,e.useState)(!1),[H,G]=(0,e.useState)(!1),[k,ie]=(0,e.useState)(!1),[V,de]=(0,e.useState)(!0),T=(0,e.useRef)({}),K=n=>{n.stopPropagation()},g=n=>{l(ge(n,y,O))};(0,e.useEffect)(()=>{for(const n in T.current){const i=T.current[n];i.current&&(i.current.removeEventListener("mousedown",K),i.current.addEventListener("mousedown",K))}}),(0,e.useEffect)(()=>{g(t)},[y,O]),(0,e.useEffect)(()=>{const n=Array.from({length:3}).map((i,p)=>Z(p));a(n),g(n)},[]);const ce=()=>(he(t),a(t),g(t),{scrollToRow:t.length-1}),J=n=>{t.splice(n.rowIndex,1),a(t),g(t)},ue=n=>{const i=k&&n.oldIndex===0&&n.newIndex>1;if(!i){const p=(0,me.arrayMove)(t,n.oldIndex,n.newIndex);a(p),g(p)}return{isDropDisabled:i}},d=(n,i,p)=>e.default.createElement(c.UICheckbox,{label:n,checked:i,onChange:()=>{p(!i)}}),Q=n=>{const i=`cell-${n.rowIndex}-${n.colIndex}`;T.current[i]||(T.current[i]=e.default.createRef());const Y=xe(n,C,we=>{t[n.rowIndex][n.colKey]=we,a(t),g(t)},v);return F(B({},Y),{content:e.default.createElement("div",{ref:T.current[i]},Y.content)})},E=n=>{if(n.rowIndex===t.length-1)return e.default.createElement("div",{style:{padding:"0 5px",verticalAlign:"center"}},"Special row content")},X=n=>{z(n),new Promise(i=>{setTimeout(()=>i(!0),2e3)}).then(()=>{z(-1)})},fe=n=>[e.default.createElement(c.UIToggle,{key:"1",label:"Preferred",checked:n.cells.preferred.value==="1",onChange:(i,p)=>{t[n.rowIndex].preferred=p?"1":"0",a(t),g(t)},inlineLabel:!0,inlineLabelLeft:!0,labelFlexGrow:!0,size:c.UIToggleSize.Small,disabled:C}),e.default.createElement(c.UIFlexibleTableRowActionButton,{key:`goto-code-row-${n.rowIndex}`,actionName:"GotoCode",tableId:_[1],iconName:c.UiIcons.CodeSnippet,rowNumber:n.rowIndex,onClick:()=>X(n.rowIndex),title:"Navigation demo"})],be=n=>[e.default.createElement(c.UIFlexibleTableActionButton,{key:"goto-code-row-0",actionName:"GotoCode",tableId:_[0],iconName:c.UiIcons.CodeSnippet,onClick:()=>X(100),title:"Navigation demo"})],u=n=>[e.default.createElement(c.UIDefaultButton,{key:"1",iconProps:{iconName:"Delete"},className:"flexible-table-btn-clear",disabled:r||n.readonly,onClick:()=>{a([]),l([])}},"Clear table")];return e.default.createElement("div",null,e.default.createElement("hr",null),e.default.createElement("h3",null,"Wrapping layout"),e.default.createElement("div",{style:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:"20px",maxWidth:"1200px"}},d("Compact size",A,L),d("Show titles",h,I),d("Show Index",P,oe),d("Show custom content",y,le),d("Span cells",v,se),d("Reorder enabled",x,S),d("Reorder restrictions",k,ie),d("Disable Adding",U,ee),d("Disable Deletion",M,te),d("Readonly",C,ne),d("No row background",$,q),d("Loading data",r,f),d("Column highlight",W,ae),d("Lock vertically",j,re),d("Reverse background",H,G),d("Disable drag using touch",V,de)),e.default.createElement("hr",null),e.default.createElement("div",null,e.default.createElement("style",null,Ee),e.default.createElement("div",{style:{maxWidth:A?"500px":"fit-content"}},e.default.createElement(c.UIFlexibleTable,{addRowButton:{label:"Add row",title:C?"Disabled due to read only mode":"",onClick:ce},columns:N.map((n,i)=>F(B({},n),{className:`table-column column-${W?i:""}`})),id:_[1],layout:c.UIFlexibleTableLayout.Wrapping,onRenderCell:Q,rows:s,onDeleteRow:J,showColumnTitles:h,isContentLoading:r,onTableReorder:x?ue:void 0,noRowBackground:$,isAddItemDisabled:U,showIndexColumn:P,readonly:C,onRenderDeleteAction:n=>({isDeleteDisabled:M&&n.rowIndex===0}),onRenderReorderActions:n=>k?{up:{disabled:n.rowIndex===1,tooltip:n.rowIndex===1?"Move up disabled for demo purposes":void 0},down:{disabled:n.rowIndex===1,tooltip:n.rowIndex===1?"Move down disabled for demo purposes":void 0}}:{},onBeforeTableRender:k?n=>({rows:n.rows.map((i,p)=>F(B({},i),{disabled:p===1}))}):void 0,onRenderRowContainer:k?n=>({isDropWarning:!n.isDragged&&!!n.rowIndex&&n.rowIndex>1}):void 0,onRenderRowDataContent:y?E:void 0,onRenderActions:fe,maxScrollableContentHeight:A?700:400,lockVertically:j,reverseBackground:H,onRenderPrimaryTableActions:u,onRenderSecondaryTableActions:be,isTouchDragDisabled:V}))))};w.WrappingTable=Ae}}]);})();
|
|
74
|
+
`,Ae=()=>{const[s,l]=(0,e.useState)(pe),[t,a]=(0,e.useState)([]),[r,f]=(0,e.useState)(!1),[x,S]=(0,e.useState)(!0),[h,I]=(0,e.useState)(!0),[A,L]=(0,e.useState)(!1),[$,q]=(0,e.useState)(!1),[U,ee]=(0,e.useState)(!1),[M,te]=(0,e.useState)(!1),[C,ne]=(0,e.useState)(!1),[P,oe]=(0,e.useState)(!1),[y,le]=(0,e.useState)(!1),[W,ae]=(0,e.useState)(!1),[v,se]=(0,e.useState)(!1),[O,z]=(0,e.useState)(-1),[j,re]=(0,e.useState)(!1),[H,G]=(0,e.useState)(!1),[k,ie]=(0,e.useState)(!1),[V,de]=(0,e.useState)(!0),T=(0,e.useRef)({}),K=n=>{n.stopPropagation()},g=n=>{l(ge(n,y,O))};(0,e.useEffect)(()=>{for(const n in T.current){const i=T.current[n];i.current&&(i.current.removeEventListener("mousedown",K),i.current.addEventListener("mousedown",K))}}),(0,e.useEffect)(()=>{g(t)},[y,O]),(0,e.useEffect)(()=>{const n=Array.from({length:3}).map((i,p)=>Z(p));a(n),g(n)},[]);const ce=()=>(he(t),a(t),g(t),{scrollToRow:t.length-1}),J=n=>{t.splice(n.rowIndex,1),a(t),g(t)},ue=n=>{const i=k&&n.oldIndex===0&&n.newIndex>1;if(!i){const p=(0,me.arrayMove)(t,n.oldIndex,n.newIndex);a(p),g(p)}return{isDropDisabled:i}},d=(n,i,p)=>e.default.createElement(c.UICheckbox,{label:n,checked:i,onChange:()=>{p(!i)}}),Q=n=>{const i=`cell-${n.rowIndex}-${n.colIndex}`;T.current[i]||(T.current[i]=e.default.createRef());const Y=xe(n,C,we=>{t[n.rowIndex][n.colKey]=we,a(t),g(t)},v);return F(B({},Y),{content:e.default.createElement("div",{ref:T.current[i]},Y.content)})},E=n=>{if(n.rowIndex===t.length-1)return e.default.createElement("div",{style:{padding:"0 5px",verticalAlign:"center"}},"Special row content")},X=n=>{z(n),new Promise(i=>{setTimeout(()=>i(!0),2e3)}).then(()=>{z(-1)})},fe=n=>[e.default.createElement(c.UIToggle,{key:"1",label:"Preferred",checked:n.cells.preferred.value==="1",onChange:(i,p)=>{t[n.rowIndex].preferred=p?"1":"0",a(t),g(t)},inlineLabel:!0,inlineLabelLeft:!0,labelFlexGrow:!0,size:c.UIToggleSize.Small,disabled:C}),e.default.createElement(c.UIFlexibleTableRowActionButton,{key:`goto-code-row-${n.rowIndex}`,actionName:"GotoCode",tableId:_[1],iconName:c.UiIcons.CodeSnippet,rowNumber:n.rowIndex,onClick:()=>X(n.rowIndex),title:"Navigation demo"})],be=n=>[e.default.createElement(c.UIFlexibleTableActionButton,{key:"goto-code-row-0",actionName:"GotoCode",tableId:_[0],iconName:c.UiIcons.CodeSnippet,onClick:()=>X(100),title:"Navigation demo"})],u=n=>[e.default.createElement(c.UIDefaultButton,{key:"1",iconProps:{iconName:"Delete"},className:"flexible-table-btn-clear",disabled:r||n.readonly,onClick:()=>{a([]),l([])}},"Clear table")];return e.default.createElement("div",null,e.default.createElement("hr",null),e.default.createElement("h3",null,"Wrapping layout"),e.default.createElement("div",{style:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:"20px",maxWidth:"1200px"}},d("Compact size",A,L),d("Show titles",h,I),d("Show Index",P,oe),d("Show custom content",y,le),d("Span cells",v,se),d("Reorder enabled",x,S),d("Reorder restrictions",k,ie),d("Disable Adding",U,ee),d("Disable Deletion",M,te),d("Readonly",C,ne),d("No row background",$,q),d("Loading data",r,f),d("Column highlight",W,ae),d("Lock vertically",j,re),d("Reverse background",H,G),d("Disable drag using touch",V,de)),e.default.createElement("hr",null),e.default.createElement("div",null,e.default.createElement("style",null,Ee),e.default.createElement("div",{style:{maxWidth:A?"500px":"fit-content"}},e.default.createElement(c.UIFlexibleTable,{addRowButton:{label:"Add row",title:C?"Disabled due to read only mode":"",onClick:ce},columns:N.map((n,i)=>F(B({},n),{className:`table-column column-${W?i:""}`})),id:_[1],layout:c.UIFlexibleTableLayout.Wrapping,onRenderCell:Q,rows:s,onDeleteRow:J,showColumnTitles:h,isContentLoading:r,onTableReorder:x?ue:void 0,noRowBackground:$,isAddItemDisabled:U,showIndexColumn:P,readonly:C,onRenderDeleteAction:n=>({isDeleteDisabled:M&&n.rowIndex===0}),onRenderReorderActions:n=>k?{up:{disabled:n.rowIndex===1,tooltip:n.rowIndex===1?"Move up disabled for demo purposes":void 0},down:{disabled:n.rowIndex===1,tooltip:n.rowIndex===1?"Move down disabled for demo purposes":void 0}}:{},onBeforeTableRender:k?n=>({rows:n.rows.map((i,p)=>F(B({},i),{disabled:p===1}))}):void 0,onRenderRowContainer:k?n=>({isDropWarning:!n.isDragged&&!!n.rowIndex&&n.rowIndex>1}):void 0,onRenderRowDataContent:y?E:void 0,onRenderActions:fe,maxScrollableContentHeight:A?700:400,lockVertically:j,reverseBackground:H,onRenderPrimaryTableActions:u,onRenderSecondaryTableActions:be,isTouchDragDisabled:V}))))};w.WrappingTable=Ae})}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[222],{"./src/index.tsx":(function(a,t,c){var l=this&&this.__createBinding||(Object.create?(function(r,n,e,i){i===void 0&&(i=e);var u=Object.getOwnPropertyDescriptor(n,e);(!u||("get"in u?!n.__esModule:u.writable||u.configurable))&&(u={enumerable:!0,get:function(){return n[e]}}),Object.defineProperty(r,i,u)}):(function(r,n,e,i){i===void 0&&(i=e),r[i]=n[e]})),s=this&&this.__exportStar||function(r,n){for(var e in r)e!=="default"&&!Object.prototype.hasOwnProperty.call(n,e)&&l(n,r,e)};Object.defineProperty(t,"__esModule",{value:!0}),t.setIconOptions=void 0,s(c("./src/components/index.tsx"),t),s(c("./src/utilities/index.ts"),t),s(c("./src/theme/index.ts"),t);var d=c("../../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");Object.defineProperty(t,"setIconOptions",{enumerable:!0,get:function(){return d.setIconOptions}})}),"./stories/UIIcon.story.tsx":(function(a,t,c){var l=this&&this.__importDefault||function(o){return o&&o.__esModule?o:{default:o}};Object.defineProperty(t,"__esModule",{value:!0}),t.SvgIcon=void 0;const s=l(c("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),d=c("../../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"),r=c("./src/components/UIIcon/index.tsx"),n=c("./src/index.tsx");t.default={title:"Utilities/Icons"};const e=[];for(const o in n.UiIcons)e.push(o);e.sort();const i=[{key:"column1",name:"Icon",minWidth:50,maxWidth:60,onRender:o=>s.default.createElement(r.UIIcon,{style:{width:"16px",height:"16px"},iconName:o})},{key:"column2",name:"Name",minWidth:50,onRender:o=>s.default.createElement("span",null,o)}],u=()=>s.default.createElement("div",null,s.default.createElement(d.DetailsList,{selectionMode:d.SelectionMode.none,items:e,columns:i,isHeaderVisible:!0,selectionPreservedOnEmptyClick:!0}));t.SvgIcon=u})}]);})();
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";(()=>{var b=Object.defineProperty,m=Object.defineProperties;var I=Object.getOwnPropertyDescriptors;var _=Object.getOwnPropertySymbols;var y=Object.prototype.hasOwnProperty,L=Object.prototype.propertyIsEnumerable;var f=(r,e,t)=>e in r?b(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,d=(r,e)=>{for(var t in e||(e={}))y.call(e,t)&&f(r,t,e[t]);if(_)for(var t of _(e))L.call(e,t)&&f(r,t,e[t]);return r},p=(r,e)=>m(r,I(e));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[69],{"./src/components/UILabel/UILabel.tsx":(function(r,e,t){var u=this&&this.__importDefault||function(n){return n&&n.__esModule?n:{default:n}};Object.defineProperty(e,"__esModule",{value:!0}),e.UILabel=e.labelGlobalStyle=void 0;const c=u(t("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),l=t("../../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"),s=t("./src/components/types.ts");e.labelGlobalStyle={fontWeight:"bold",fontSize:"13px",color:"var(--vscode-input-foreground)",padding:"4px 0"};class o extends c.default.Component{constructor(a){super(a)}render(){const a=i=>({root:[d({marginTop:25},e.labelGlobalStyle),i.disabled&&{opacity:"0.4"},i.required&&{selectors:{"::after":{content:s.REQUIRED_LABEL_INDICATOR,color:"var(--vscode-inputValidation-errorBorder)",paddingRight:12}}}]});return c.default.createElement(l.Label,p(d({},this.props),{styles:a}))}}e.UILabel=o}),"./src/components/UILabel/index.tsx":(function(r,e,t){var u=this&&this.__createBinding||(Object.create?(function(l,s,o,n){n===void 0&&(n=o);var a=Object.getOwnPropertyDescriptor(s,o);(!a||("get"in a?!s.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return s[o]}}),Object.defineProperty(l,n,a)}):(function(l,s,o,n){n===void 0&&(n=o),l[n]=s[o]})),c=this&&this.__exportStar||function(l,s){for(var o in l)o!=="default"&&!Object.prototype.hasOwnProperty.call(s,o)&&u(s,l,o)};Object.defineProperty(e,"__esModule",{value:!0}),c(t("./src/components/UILabel/UILabel.tsx"),e)}),"./src/components/types.ts":((r,e)=>{Object.defineProperty(e,"__esModule",{value:!0}),e.REQUIRED_LABEL_INDICATOR=void 0,e.REQUIRED_LABEL_INDICATOR="' *' / ''"}),"./stories/UILabel.story.tsx":(function(r,e,t){var u=this&&this.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(e,"__esModule",{value:!0}),e.defaultUsage=void 0;const c=u(t("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),l=t("../../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"),s=t("./src/components/UILabel/index.tsx");e.default={title:"Basic Inputs/Label"};const o={childrenGap:40},n=()=>c.default.createElement(l.Stack,{tokens:o,style:{width:300}},c.default.createElement(l.Stack,{tokens:{childrenGap:16}},c.default.createElement(l.Text,{variant:"large",className:"textColor"},"UILabel"),c.default.createElement(s.UILabel,null,"Just a label")),c.default.createElement(l.Stack,{tokens:{childrenGap:16}},c.default.createElement(l.Text,{variant:"large",className:"textColor"},"UILabel with required on"),c.default.createElement(s.UILabel,{required:!0},"Just a label")));e.defaultUsage=n})}]);})();
|