@sap-ux/ui-components
Version:
SAP UI Components Library
13 lines (10 loc) • 14.9 kB
JavaScript
;(()=>{var g=Object.defineProperty,x=Object.defineProperties;var C=Object.getOwnPropertyDescriptors;var k=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,S=Object.prototype.propertyIsEnumerable;var y=(f,r,s)=>r in f?g(f,r,{enumerable:!0,configurable:!0,writable:!0,value:s}):f[r]=s,b=(f,r)=>{for(var s in r||(r={}))I.call(r,s)&&y(f,s,r[s]);if(k)for(var s of k(r))S.call(r,s)&&y(f,s,r[s]);return f},v=(f,r)=>x(f,C(r));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[57],{"../../node_modules/.pnpm/css-loader@7.1.4_webpack@5.105.0_@swc+core@1.15.18_@swc+helpers@0.5.19__esbuild@0.27.4_postcss@8.5.15_/node_modules/css-loader/dist/runtime/api.js"(f){f.exports=function(r){var s=[];return s.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+=r(a),e&&(o+="}"),a[2]&&(o+="}"),a[4]&&(o+="}"),o}).join("")},s.i=function(a,o,e,t,d){typeof a=="string"&&(a=[[null,a,void 0]]);var l={};if(e)for(var c=0;c<this.length;c++){var m=this[c][0];m!=null&&(l[m]=!0)}for(var i=0;i<a.length;i++){var n=[].concat(a[i]);e&&l[n[0]]||(typeof d!="undefined"&&(typeof n[5]=="undefined"||(n[1]="@layer".concat(n[5].length>0?" ".concat(n[5]):""," {").concat(n[1],"}")),n[5]=d),o&&(n[2]&&(n[1]="@media ".concat(n[2]," {").concat(n[1],"}")),n[2]=o),t&&(n[4]?(n[1]="@supports (".concat(n[4],") {").concat(n[1],"}"),n[4]=t):n[4]="".concat(t)),s.push(n))}},s}},"../../node_modules/.pnpm/css-loader@7.1.4_webpack@5.105.0_@swc+core@1.15.18_@swc+helpers@0.5.19__esbuild@0.27.4_postcss@8.5.15_/node_modules/css-loader/dist/runtime/noSourceMaps.js"(f){f.exports=function(r){return r[1]}},"../../node_modules/.pnpm/style-loader@4.0.0_webpack@5.105.0_@swc+core@1.15.18_@swc+helpers@0.5.19__esbuild@0.27.4_postcss@8.5.15_/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"(f){var r=[];function s(o){for(var e=-1,t=0;t<r.length;t++)if(r[t].identifier===o){e=t;break}return e}function u(o,e){for(var t={},d=[],l=0;l<o.length;l++){var c=o[l],m=e.base?c[0]+e.base:c[0],i=t[m]||0,n="".concat(m," ").concat(i);t[m]=i+1;var p=s(n),h={css:c[1],media:c[2],sourceMap:c[3],supports:c[4],layer:c[5]};if(p!==-1)r[p].references++,r[p].updater(h);else{var _=a(h,e);e.byIndex=l,r.splice(l,0,{identifier:n,updater:_,references:1})}d.push(n)}return d}function a(o,e){var t=e.domAPI(e);t.update(o);var d=function(c){if(c){if(c.css===o.css&&c.media===o.media&&c.sourceMap===o.sourceMap&&c.supports===o.supports&&c.layer===o.layer)return;t.update(o=c)}else t.remove()};return d}f.exports=function(o,e){e=e||{},o=o||[];var t=u(o,e);return function(l){l=l||[];for(var c=0;c<t.length;c++){var m=t[c],i=s(m);r[i].references--}for(var n=u(l,e),p=0;p<t.length;p++){var h=t[p],_=s(h);r[_].references===0&&(r[_].updater(),r.splice(_,1))}t=n}}},"../../node_modules/.pnpm/style-loader@4.0.0_webpack@5.105.0_@swc+core@1.15.18_@swc+helpers@0.5.19__esbuild@0.27.4_postcss@8.5.15_/node_modules/style-loader/dist/runtime/insertBySelector.js"(f){var r={};function s(a){if(typeof r[a]=="undefined"){var o=document.querySelector(a);if(window.HTMLIFrameElement&&o instanceof window.HTMLIFrameElement)try{o=o.contentDocument.head}catch(e){o=null}r[a]=o}return r[a]}function u(a,o){var e=s(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)}f.exports=u},"../../node_modules/.pnpm/style-loader@4.0.0_webpack@5.105.0_@swc+core@1.15.18_@swc+helpers@0.5.19__esbuild@0.27.4_postcss@8.5.15_/node_modules/style-loader/dist/runtime/insertStyleElement.js"(f){function r(s){var u=document.createElement("style");return s.setAttributes(u,s.attributes),s.insert(u,s.options),u}f.exports=r},"../../node_modules/.pnpm/style-loader@4.0.0_webpack@5.105.0_@swc+core@1.15.18_@swc+helpers@0.5.19__esbuild@0.27.4_postcss@8.5.15_/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"(f,r,s){function u(a){var o=s.nc;o&&a.setAttribute("nonce",o)}f.exports=u},"../../node_modules/.pnpm/style-loader@4.0.0_webpack@5.105.0_@swc+core@1.15.18_@swc+helpers@0.5.19__esbuild@0.27.4_postcss@8.5.15_/node_modules/style-loader/dist/runtime/styleDomAPI.js"(f){function r(a,o,e){var t="";e.supports&&(t+="@supports (".concat(e.supports,") {")),e.media&&(t+="@media ".concat(e.media," {"));var d=typeof e.layer!="undefined";d&&(t+="@layer".concat(e.layer.length>0?" ".concat(e.layer):""," {")),t+=e.css,d&&(t+="}"),e.media&&(t+="}"),e.supports&&(t+="}");var l=e.sourceMap;l&&typeof btoa!="undefined"&&(t+=`
/*# sourceMappingURL=data:application/json;base64,`.concat(btoa(unescape(encodeURIComponent(JSON.stringify(l))))," */")),o.styleTagTransform(t,a,o.options)}function s(a){if(a.parentNode===null)return!1;a.parentNode.removeChild(a)}function u(a){if(typeof document=="undefined")return{update:function(){},remove:function(){}};var o=a.insertStyleElement(a);return{update:function(t){r(o,a,t)},remove:function(){s(o)}}}f.exports=u},"../../node_modules/.pnpm/style-loader@4.0.0_webpack@5.105.0_@swc+core@1.15.18_@swc+helpers@0.5.19__esbuild@0.27.4_postcss@8.5.15_/node_modules/style-loader/dist/runtime/styleTagTransform.js"(f){function r(s,u){if(u.styleSheet)u.styleSheet.cssText=s;else{for(;u.firstChild;)u.removeChild(u.firstChild);u.appendChild(document.createTextNode(s))}}f.exports=r},"./src/components/UICheckbox/UICheckbox.tsx"(f,r,s){var u=this&&this.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(r,"__esModule",{value:!0}),r.UICheckbox=void 0;const a=u(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),o=s("../../node_modules/.pnpm/@fluentui+react@8.125.6_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_03684c25d5c3502754322356d0aa96d9/node_modules/@fluentui/react/lib-commonjs/index.js"),e=s("./src/helper/ValidationMessage/index.tsx"),t=s("./src/components/UIInput/index.tsx");class d extends a.default.Component{constructor(c){super(c),this.GlobalClassNames={root:"ms-Checkbox",label:"ms-Checkbox-label",checkbox:"ms-Checkbox-checkbox",checkmark:"ms-Checkbox-checkmark",text:"ms-Checkbox-text"},this.setStyle=(m,i)=>({root:[!i.disabled&&[!i.checked&&{[`:hover .${this.GlobalClassNames.checkbox}`]:{background:"var(--vscode-checkbox-background)",borderColor:"var(--vscode-focusBorder)",[o.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,[o.HighContrastSelector]:{color:"Highlight"}}},{[`:hover .${this.GlobalClassNames.text}, :focus .${this.GlobalClassNames.text}`]:{color:"var(--vscode-foreground)",[o.HighContrastSelector]:{color:i.disabled?"GrayText":"WindowText"}}}],i.checked&&!i.indeterminate&&{[`:hover .${this.GlobalClassNames.checkbox}`]:{background:i.disabled?"":"var(--vscode-checkbox-background)",borderColor:i.disabled?"":"var(--vscode-focusBorder)"},[`:focus .${this.GlobalClassNames.checkbox}`]:{background:"var(--vscode-checkbox-background)",borderColor:"var(--vscode-focusBorder)"},[o.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"}}},m.message&&{marginBottom:2}],input:{[`.${o.IsFocusVisibleClassName} &:focus + label::before`]:{content:"",position:"absolute",inset:-1,border:"1px solid transparent !important",outline:"1px solid var(--vscode-focusBorder) !important",[o.HighContrastSelector]:{outline:"1px solid WindowText"}}},checkbox:{backgroundColor:"var(--vscode-debugToolBar-background, var(--vscode-editorWidget-background))",borderColor:"var(--vscode-editorWidget-border)",opacity:i.disabled?.4:void 0,borderRadius:t.COMMON_INPUT_STYLES.borderRadius},checkmark:{color:"var(--vscode-checkbox-foreground, var(--vscode-editorWidget-foreground))"},text:{color:"var(--vscode-foreground)",opacity:i.disabled?.4:void 0}})}render(){const c=(0,e.getMessageInfo)(this.props),m=a.default.createElement(o.Checkbox,v(b({},this.props),{styles:i=>b(b({},this.setStyle(c,i)),this.props.styles)}));return c.message?a.default.createElement(e.MessageWrapper,{message:c},m):m}}r.UICheckbox=d,d.__docgenInfo={description:`UICheckbox component.
based on https://developer.microsoft.com/en-us/fluentui#/controls/web/checkbox
@exports
@class UICheckbox
@extends {React.Component<ICheckboxProps, {}>}`,methods:[{name:"setStyle",docblock:null,modifiers:[],params:[{name:"messageInfo",optional:!1,type:{name:"InputValidationMessageInfo",alias:"InputValidationMessageInfo"}},{name:"props",optional:!1,type:{name:"ICheckboxStyleProps",alias:"ICheckboxStyleProps"}}],returns:{type:{name:"ICheckboxStyles"}}}],displayName:"UICheckbox",props:{warningMessage:{required:!1,tsType:{name:"string"},description:""},infoMessage:{required:!1,tsType:{name:"string"},description:""},errorMessage:{required:!1,tsType:{name:"string"},description:""},CheckboxMinWidth:{required:!1,tsType:{name:"number"},description:""}},composes:["ICheckboxProps"]}},"./src/components/UICheckbox/index.tsx"(f,r,s){var u=this&&this.__createBinding||(Object.create?(function(o,e,t,d){d===void 0&&(d=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(o,d,l)}):(function(o,e,t,d){d===void 0&&(d=t),o[d]=e[t]})),a=this&&this.__exportStar||function(o,e){for(var t in o)t!=="default"&&!Object.prototype.hasOwnProperty.call(e,t)&&u(e,o,t)};Object.defineProperty(r,"__esModule",{value:!0}),a(s("./src/components/UICheckbox/UICheckbox.tsx"),r)},"./src/components/UILink/UILink.tsx"(f,r,s){var u=this&&this.__importDefault||function(d){return d&&d.__esModule?d:{default:d}};Object.defineProperty(r,"__esModule",{value:!0}),r.UILink=void 0;const a=u(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),o=s("../../node_modules/.pnpm/@fluentui+react@8.125.6_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_03684c25d5c3502754322356d0aa96d9/node_modules/@fluentui/react/lib-commonjs/index.js"),e={primary:{color:"var(--vscode-textLink-foreground)",hoverColor:"var(--vscode-textLink-activeForeground)"},secondary:{color:"var(--vscode-foreground)",hoverColor:"var(--vscode-foreground)"}};class t extends a.default.Component{constructor(l){super(l)}render(){const{secondary:l,underline:c,disabled:m}=this.props,i=l?e.secondary:e.primary,n=()=>({root:{color:i.color,textDecoration:c===!1?void 0:"underline",selectors:m?void 0:{"&:hover, &:hover:focus, &:hover:active":{color:i.hoverColor,textDecoration:c===!1?"underline":"none"},"&:active, &:focus":{color:i.hoverColor,textDecoration:c===!1?"underline":"none",outline:"none"},".ms-Fabric--isFocusVisible &:focus":{boxShadow:"none",outline:"1px solid var(--vscode-focusBorder)",outlineOffset:"-1px"}},opacity:m?.4:void 0}});return a.default.createElement(o.Link,v(b({},this.props),{styles:n}))}}r.UILink=t,t.__docgenInfo={description:`UILink component
based on https://developer.microsoft.com/en-us/fluentui#/controls/web/link
@exports
@class UILink
@extends {React.Component<UILinkProps, {}>}`,methods:[],displayName:"UILink",props:{secondary:{required:!1,tsType:{name:"boolean"},description:""}},composes:["ILinkProps"]}},"./src/components/UILink/index.tsx"(f,r,s){var u=this&&this.__createBinding||(Object.create?(function(o,e,t,d){d===void 0&&(d=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(o,d,l)}):(function(o,e,t,d){d===void 0&&(d=t),o[d]=e[t]})),a=this&&this.__exportStar||function(o,e){for(var t in o)t!=="default"&&!Object.prototype.hasOwnProperty.call(e,t)&&u(e,o,t)};Object.defineProperty(r,"__esModule",{value:!0}),a(s("./src/components/UILink/UILink.tsx"),r)},"./stories/UILink.story.tsx"(f,r,s){var u=this&&this.__createBinding||(Object.create?(function(i,n,p,h){h===void 0&&(h=p);var _=Object.getOwnPropertyDescriptor(n,p);(!_||("get"in _?!n.__esModule:_.writable||_.configurable))&&(_={enumerable:!0,get:function(){return n[p]}}),Object.defineProperty(i,h,_)}):(function(i,n,p,h){h===void 0&&(h=p),i[h]=n[p]})),a=this&&this.__setModuleDefault||(Object.create?(function(i,n){Object.defineProperty(i,"default",{enumerable:!0,value:n})}):function(i,n){i.default=n}),o=this&&this.__importStar||(function(){var i=function(n){return i=Object.getOwnPropertyNames||function(p){var h=[];for(var _ in p)Object.prototype.hasOwnProperty.call(p,_)&&(h[h.length]=_);return h},i(n)};return function(n){if(n&&n.__esModule)return n;var p={};if(n!=null)for(var h=i(n),_=0;_<h.length;_++)h[_]!=="default"&&u(p,n,h[_]);return a(p,n),p}})();Object.defineProperty(r,"__esModule",{value:!0}),r.defaultUsage=void 0;const e=o(s("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),t=s("../../node_modules/.pnpm/@fluentui+react@8.125.6_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_03684c25d5c3502754322356d0aa96d9/node_modules/@fluentui/react/lib-commonjs/index.js"),d=s("./src/components/UILink/index.tsx"),l=s("./src/components/UICheckbox/index.tsx");r.default={title:"Basic Inputs/Link"};const c={childrenGap:40},m=()=>{const[i,n]=(0,e.useState)(!1);return e.default.createElement(t.Stack,{tokens:c},e.default.createElement(t.Stack,{tokens:c},e.default.createElement(t.Stack,{horizontal:!0,tokens:c},e.default.createElement(l.UICheckbox,{label:"Disabled",checked:i,onChange:(p,h)=>{n(!!h)}}))),e.default.createElement(t.Stack,{tokens:c},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Primary UILink"),e.default.createElement(t.Stack,{horizontal:!0,tokens:c},e.default.createElement(d.UILink,{href:"JavaScript:void(0)",disabled:i},"I am a link"))),e.default.createElement(t.Stack,{tokens:c},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Primary UILink with no underline"),e.default.createElement(t.Stack,{horizontal:!0,tokens:c},e.default.createElement(d.UILink,{underline:!1,href:"JavaScript:void(0)",disabled:i},"I am a link"))),e.default.createElement(t.Stack,{tokens:c},e.default.createElement(t.Text,{variant:"large",className:"textColor",block:!0},"Secondary UILink"),e.default.createElement(t.Stack,{horizontal:!0,tokens:c},e.default.createElement(d.UILink,{secondary:!0,href:"JavaScript:void(0)",disabled:i},"I am a secondary link"))))};r.defaultUsage=m}}]);})();