UNPKG

@sap-ux/ui-components

Version:
2 lines (1 loc) 7.32 kB
"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(p){return p&&p.__esModule?p:{default:p}};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,family:"var(--vscode-font-family)",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 f 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=f},"./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)",fontFamily:"var(--vscode-font-family)",padding:"4px 0"};class t extends a.default.Component{constructor(e){super(e)}render(){const e=f=>({root:[d({marginTop:25},o.labelGlobalStyle),f.disabled&&{opacity:"0.4"},f.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,f)=>{console.log(f.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}}]);})();