@sap-ux/ui-components
Version:
SAP UI Components Library
2 lines (1 loc) • 15.9 kB
JavaScript
(()=>{var M=Object.defineProperty,D=Object.defineProperties;var A=Object.getOwnPropertyDescriptors;var v=Object.getOwnPropertySymbols;var B=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable;var P=(a,o,e)=>o in a?M(a,o,{enumerable:!0,configurable:!0,writable:!0,value:e}):a[o]=e,b=(a,o)=>{for(var e in o||(o={}))B.call(o,e)&&P(a,e,o[e]);if(v)for(var e of v(o))C.call(o,e)&&P(a,e,o[e]);return a},h=(a,o)=>D(a,A(o));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[20],{"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UIToggleGroup/UIToggleGroup.scss":(a,o,e)=>{var f=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/noSourceMaps.js"),c=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/api.js"),_=c(f);_.push([a.id,".ui-toggle-group{margin-top:0}.ui-toggle-group-label{margin-top:0}.ui-toggle-group-container{display:flex;flex-direction:row;flex-wrap:wrap}",""]),a.exports=_},"../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.scss":(a,o,e)=>{var f=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/noSourceMaps.js"),c=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/runtime/api.js"),_=c(f);_.push([a.id,'.ui-toggle-group-option{height:22px;min-width:22px;border-radius:2px;font-style:normal;font-weight:700;font-size:13px;line-height:18px;display:flex;align-items:center;text-align:center;justify-content:center;color:var(--vscode-foreground);border:none;background-color:rgba(0,0,0,0);position:relative}.ui-toggle-group-option:not(:last-child){margin:0 3px 0 0}.ui-toggle-group-option:hover{cursor:pointer;background-color:var(--vscode-menubar-selectionBackground);outline:1px dashed var(--vscode-contrastActiveBorder)}.ui-toggle-group-option:focus{border-radius:0;outline:rgba(0,0,0,0)}.ui-toggle-group-option--focused:focus-visible::after{content:"";position:absolute;border:none;z-index:1;outline:1px solid var(--vscode-contrastActiveBorder, var(--vscode-button-background));inset:-1px}.ui-toggle-group-option--selected{background-color:var(--vscode-button-background);color:var(--vscode-button-foreground);outline:1px solid var(--vscode-contrastActiveBorder)}.ui-toggle-group-option--selected:hover{background-color:var(--vscode-button-hoverBackground);outline:1px dashed var(--vscode-contrastActiveBorder)}.ui-toggle-group-option--selected .ui-toggle-group-option-content-icon svg>path,.ui-toggle-group-option--selected .ui-toggle-group-option-content-icon svg>rect{fill:var(--vscode-button-foreground)}.ui-toggle-group-option--disabled{opacity:.5;background-color:rgba(0,0,0,0)}.ui-toggle-group-option--disabled:hover{background-color:rgba(0,0,0,0);cursor:initial}.ui-toggle-group-option-content-icon{display:flex}',""]),a.exports=_},"./src/components/UIToggleGroup/UIToggleGroup.scss":(a,o,e)=>{"use strict";e.r(o),e.d(o,{default:()=>E});var f=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),c=e.n(f),_=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleDomAPI.js"),t=e.n(_),s=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertBySelector.js"),d=e.n(s),u=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),g=e.n(u),p=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertStyleElement.js"),l=e.n(p),n=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleTagTransform.js"),r=e.n(n),i=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UIToggleGroup/UIToggleGroup.scss"),m=e.n(i),I={};for(const O in i)O!=="default"&&(I[O]=()=>i[O]);e.d(o,I);var y={};y.styleTagTransform=r(),y.setAttributes=g(),y.insert=d().bind(null,"head"),y.domAPI=t(),y.insertStyleElement=l();var T=c()(m(),y);const E=m()&&m().locals?m().locals:void 0},"./src/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.scss":(a,o,e)=>{"use strict";e.r(o),e.d(o,{default:()=>E});var f=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),c=e.n(f),_=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleDomAPI.js"),t=e.n(_),s=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertBySelector.js"),d=e.n(s),u=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),g=e.n(u),p=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/insertStyleElement.js"),l=e.n(p),n=e("../../node_modules/.pnpm/style-loader@3.3.3_webpack@5.96.1/node_modules/style-loader/dist/runtime/styleTagTransform.js"),r=e.n(n),i=e("../../node_modules/.pnpm/css-loader@6.8.1_webpack@5.96.1/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[11].use[1]!../../node_modules/.pnpm/sass-loader@13.3.2_sass@1.66.1_webpack@5.96.1/node_modules/sass-loader/dist/cjs.js!./src/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.scss"),m=e.n(i),I={};for(const O in i)O!=="default"&&(I[O]=()=>i[O]);e.d(o,I);var y={};y.styleTagTransform=r(),y.setAttributes=g(),y.insert=d().bind(null,"head"),y.domAPI=t(),y.insertStyleElement=l();var T=c()(m(),y);const E=m()&&m().locals?m().locals:void 0},"./src/components/UIFocusZone/UIFocusTrapZone.tsx":function(a,o,e){"use strict";var f=this&&this.__importDefault||function(s){return s&&s.__esModule?s:{default:s}};Object.defineProperty(o,"__esModule",{value:!0}),o.UIFocusTrapZone=void 0;const c=f(e("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),_=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");class t extends c.default.Component{constructor(d){super(d)}render(){return c.default.createElement(_.FocusTrapZone,b({},this.props),this.props.children)}}o.UIFocusTrapZone=t},"./src/components/UIFocusZone/UIFocusZone.tsx":function(a,o,e){"use strict";var f=this&&this.__importDefault||function(s){return s&&s.__esModule?s:{default:s}};Object.defineProperty(o,"__esModule",{value:!0}),o.UIFocusZone=o.UIFocusZoneTabbableElements=o.IFocusZone=o.UIFocusZoneProps=o.UIFocusZoneDirection=void 0;const c=f(e("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),_=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");Object.defineProperty(o,"UIFocusZoneProps",{enumerable:!0,get:function(){return _.IFocusZoneProps}}),Object.defineProperty(o,"UIFocusZoneDirection",{enumerable:!0,get:function(){return _.FocusZoneDirection}}),Object.defineProperty(o,"IFocusZone",{enumerable:!0,get:function(){return _.IFocusZone}}),Object.defineProperty(o,"UIFocusZoneTabbableElements",{enumerable:!0,get:function(){return _.FocusZoneTabbableElements}});class t extends c.default.Component{constructor(d){super(d)}render(){return c.default.createElement(_.FocusZone,b({},this.props),this.props.children)}}o.UIFocusZone=t},"./src/components/UIFocusZone/index.tsx":function(a,o,e){"use strict";var f=this&&this.__createBinding||(Object.create?function(_,t,s,d){d===void 0&&(d=s);var u=Object.getOwnPropertyDescriptor(t,s);(!u||("get"in u?!t.__esModule:u.writable||u.configurable))&&(u={enumerable:!0,get:function(){return t[s]}}),Object.defineProperty(_,d,u)}:function(_,t,s,d){d===void 0&&(d=s),_[d]=t[s]}),c=this&&this.__exportStar||function(_,t){for(var s in _)s!=="default"&&!Object.prototype.hasOwnProperty.call(t,s)&&f(t,_,s)};Object.defineProperty(o,"__esModule",{value:!0}),c(e("./src/components/UIFocusZone/UIFocusTrapZone.tsx"),o),c(e("./src/components/UIFocusZone/UIFocusZone.tsx"),o)},"./src/components/UIToggleGroup/UIToggleGroup.tsx":function(a,o,e){"use strict";var f=this&&this.__createBinding||(Object.create?function(l,n,r,i){i===void 0&&(i=r);var m=Object.getOwnPropertyDescriptor(n,r);(!m||("get"in m?!n.__esModule:m.writable||m.configurable))&&(m={enumerable:!0,get:function(){return n[r]}}),Object.defineProperty(l,i,m)}:function(l,n,r,i){i===void 0&&(i=r),l[i]=n[r]}),c=this&&this.__setModuleDefault||(Object.create?function(l,n){Object.defineProperty(l,"default",{enumerable:!0,value:n})}:function(l,n){l.default=n}),_=this&&this.__importStar||function(l){if(l&&l.__esModule)return l;var n={};if(l!=null)for(var r in l)r!=="default"&&Object.prototype.hasOwnProperty.call(l,r)&&f(n,l,r);return c(n,l),n};Object.defineProperty(o,"__esModule",{value:!0}),o.UIToggleGroup=void 0;const t=_(e("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=e("./src/components/UIToggleGroup/UIToggleGroupOption/index.ts"),d=e("./src/components/UILabel/index.tsx"),u=e("./src/components/UIFocusZone/index.tsx"),g=e("./src/utilities/index.ts");e("./src/components/UIToggleGroup/UIToggleGroup.scss");class p extends t.Component{constructor(n){super(n),this.labelId=this.props.labelId?this.props.labelId:(0,g.getUIId)("ui-toggle-group-option-"),this.onClick=(r,i)=>{let m=!1;i!=null&&i.itemKey&&this.setState(I=>{var T,E;const y={options:I.options.map((O,j,U)=>O.key===i.itemKey?(m=!U[j].selected,h(b({},O),{selected:m,focused:U[j].focused})):h(b({},O),{selected:!1,focused:!1}))};return this.props.onChange&&((E=(T=this.props).onChange)==null||E.call(T,i.itemKey,m)),y})},this.onFocus=(r,i)=>{i!=null&&i.itemKey&&this.setState(m=>({options:m.options.map(I=>I.key===i.itemKey?h(b({},I),{focused:!0}):h(b({},I),{focused:!1}))}))},this.onBlur=(r,i)=>{this.setState(m=>({options:m.options.map(I=>h(b({},I),{focused:!1}))}))},this.state={options:this.props.options.map(r=>r.key===this.props.selectedKey?h(b({},r),{selected:!0}):b({},r))},this.onClick=this.onClick.bind(this),this.onFocus=this.onFocus.bind(this),this.onBlur=this.onBlur.bind(this)}render(){return t.createElement("div",b({className:"ui-toggle-group",role:"group"},this.props.ariaLabel&&{"aria-labelledby":this.labelId}),this.props.label&&t.createElement(d.UILabel,h(b({id:this.labelId},this.props.ariaLabel&&{"aria-label":this.props.ariaLabel}),{className:"ui-toggle-group-label",required:this.props.required,disabled:this.props.disabled}),this.props.label),t.createElement(u.UIFocusZone,{as:"div",direction:u.UIFocusZoneDirection.horizontal,isCircularNavigation:!0,shouldRaiseClicks:!0,className:"ui-toggle-group-container",role:"list"},this.state.options.map(n=>t.createElement(s.UIToggleGroupOption,h(b({itemKey:n.key},n),{key:n.key,onClick:this.onClick,onFocus:this.onFocus,onBlur:this.onBlur,selected:n.selected,disabled:n.disabled||this.props.disabled})))))}}o.UIToggleGroup=p},"./src/components/UIToggleGroup/UIToggleGroup.types.ts":(a,o)=>{"use strict";Object.defineProperty(o,"__esModule",{value:!0})},"./src/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.tsx":function(a,o,e){"use strict";var f=this&&this.__createBinding||(Object.create?function(g,p,l,n){n===void 0&&(n=l);var r=Object.getOwnPropertyDescriptor(p,l);(!r||("get"in r?!p.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return p[l]}}),Object.defineProperty(g,n,r)}:function(g,p,l,n){n===void 0&&(n=l),g[n]=p[l]}),c=this&&this.__setModuleDefault||(Object.create?function(g,p){Object.defineProperty(g,"default",{enumerable:!0,value:p})}:function(g,p){g.default=p}),_=this&&this.__importStar||function(g){if(g&&g.__esModule)return g;var p={};if(g!=null)for(var l in g)l!=="default"&&Object.prototype.hasOwnProperty.call(g,l)&&f(p,g,l);return c(p,g),p};Object.defineProperty(o,"__esModule",{value:!0}),o.UIToggleGroupOption=void 0;const t=_(e("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),s=e("./src/components/UIIcon/index.tsx"),d=e("./src/utilities/index.ts");e("./src/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.scss");class u extends t.Component{constructor(p){super(p),this.onClick=l=>{var n,r;(r=(n=this.props).onClick)==null||r.call(n,l,this.props)},this.onBlur=l=>{var n,r;(r=(n=this.props).onBlur)==null||r.call(n,l,this.props)},this.onFocus=l=>{var n,r;(r=(n=this.props).onFocus)==null||r.call(n,l,this.props)},this.onClick=this.onClick.bind(this),this.onFocus=this.onFocus.bind(this),this.onBlur=this.onBlur.bind(this)}render(){const p=this.props.labelId?this.props.labelId:(0,d.getUIId)("ui-toggle-group-option-");return t.createElement("button",h(b(h(b({role:"button"},this.props.title&&{title:this.props.title}),{"data-is-focusable":"true",className:["ui-toggle-group-option",this.props.focused?"ui-toggle-group-option--focused":"",this.props.selected?"ui-toggle-group-option--selected":"",this.props.disabled?"ui-toggle-group-option--disabled":""].filter(l=>!!l).join(" ")}),this.props.ariaLabel&&{"aria-labelledby":p}),{disabled:this.props.disabled||!1,onClick:this.onClick,onFocus:this.onFocus,onBlur:this.onBlur}),t.createElement("span",{className:"ui-toggle-group-option-content",tabIndex:-1},this.props.text&&t.createElement("span",b({id:p,className:"ui-toggle-group-option-content-text"},this.props.ariaLabel&&{"aria-label":this.props.ariaLabel}),this.props.text),this.props.icon&&t.createElement(s.UIIcon,{className:"ui-toggle-group-option-content-icon",iconName:this.props.icon})))}}o.UIToggleGroupOption=u},"./src/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.types.ts":(a,o)=>{"use strict";Object.defineProperty(o,"__esModule",{value:!0})},"./src/components/UIToggleGroup/UIToggleGroupOption/index.ts":function(a,o,e){"use strict";var f=this&&this.__createBinding||(Object.create?function(_,t,s,d){d===void 0&&(d=s);var u=Object.getOwnPropertyDescriptor(t,s);(!u||("get"in u?!t.__esModule:u.writable||u.configurable))&&(u={enumerable:!0,get:function(){return t[s]}}),Object.defineProperty(_,d,u)}:function(_,t,s,d){d===void 0&&(d=s),_[d]=t[s]}),c=this&&this.__exportStar||function(_,t){for(var s in _)s!=="default"&&!Object.prototype.hasOwnProperty.call(t,s)&&f(t,_,s)};Object.defineProperty(o,"__esModule",{value:!0}),c(e("./src/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.tsx"),o),c(e("./src/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.types.ts"),o)},"./src/components/UIToggleGroup/index.ts":function(a,o,e){"use strict";var f=this&&this.__createBinding||(Object.create?function(_,t,s,d){d===void 0&&(d=s);var u=Object.getOwnPropertyDescriptor(t,s);(!u||("get"in u?!t.__esModule:u.writable||u.configurable))&&(u={enumerable:!0,get:function(){return t[s]}}),Object.defineProperty(_,d,u)}:function(_,t,s,d){d===void 0&&(d=s),_[d]=t[s]}),c=this&&this.__exportStar||function(_,t){for(var s in _)s!=="default"&&!Object.prototype.hasOwnProperty.call(t,s)&&f(t,_,s)};Object.defineProperty(o,"__esModule",{value:!0}),c(e("./src/components/UIToggleGroup/UIToggleGroup.tsx"),o),c(e("./src/components/UIToggleGroup/UIToggleGroup.types.ts"),o)}}]);})();