@sap-ux/ui-components 2.1.0 → 2.1.1

package/storybook/UITranslationInput-story.749bde8b.iframe.bundle.js

@@ -1 +0,0 @@
-"use strict";(()=>{var V=Object.defineProperty,K=Object.defineProperties;var M=Object.getOwnPropertyDescriptors;var g=Object.getOwnPropertySymbols;var O=Object.prototype.hasOwnProperty,z=Object.prototype.propertyIsEnumerable;var v=(i,n,e)=>n in i?V(i,n,{enumerable:!0,configurable:!0,writable:!0,value:e}):i[n]=e,m=(i,n)=>{for(var e in n||(n={}))O.call(n,e)&&v(i,e,n[e]);if(g)for(var e of g(n))z.call(n,e)&&v(i,e,n[e]);return i},B=(i,n)=>K(i,M(n));(self.webpackChunk_sap_ux_ui_components=self.webpackChunk_sap_ux_ui_components||[]).push([[530],{"./stories/UITranslationInput.story.tsx"(i,n,e){var S=this&&this.__importDefault||function(s){return s&&s.__esModule?s:{default:s}};Object.defineProperty(n,"__esModule",{value:!0}),n.translationInput=void 0;const t=S(e("../../node_modules/.pnpm/react@16.14.0/node_modules/react/index.js")),T=e("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),f=e("../../node_modules/.pnpm/@fluentui+react@8.120.5_@types+react-dom@16.9.25_@types+react@16.14.69__@types+react@16_dd78b5249e0d97499b5997ed3bfaf5b8/node_modules/@fluentui/react/lib-commonjs/index.js"),d=e("./src/components/UITranslationInput/index.tsx"),D=e("./src/components/Icons.tsx"),U=e("./src/components/UITable/index.tsx"),C=e("./src/components/UIButton/index.tsx"),p=e("./src/components/UICheckbox/index.tsx");n.default={title:"Basic Inputs/Input"};const h={childrenGap:60},I="ui-components-i18n-bundle",_=()=>{let s={};try{s=JSON.parse(window.localStorage.getItem(I)||"")}catch(r){s={}}return s},b=s=>{window.localStorage.setItem(I,JSON.stringify(s))},w=()=>{const[s,r]=t.default.useState("Content"),[y,k]=t.default.useState(!1),[c,u]=t.default.useState(!1),[a,x]=t.default.useState(_()),P=(l,o)=>{r(o||"")},j=l=>{a[l.key.value]||(a[l.key.value]=[B(m({},l),{dummyPath:"dddd"})],b(a),x(m({},a)))},W=l=>{const o=document.querySelector(`div[data-i18n-key="${l.key.value}"]`);(o==null?void 0:o.parentElement).focus(),(0,T.setFocusVisibility)(!0,o==null?void 0:o.parentElement)},F=l=>{a[l]&&(delete a[l],b(a),x(m({},a)))},E=[];for(const l in a){const o=a[l];for(const R of o)E.push({key:l,value:R.value.value})}return t.default.createElement(f.Stack,{tokens:h,style:{width:"100%",height:"100%"}},t.default.createElement(f.Stack,{horizontal:!0,tokens:h},t.default.createElement(p.UICheckbox,{label:"Disabled",checked:y,onChange:(l,o)=>{k(o)}}),t.default.createElement(p.UICheckbox,{label:"Busy",checked:c,onChange:(l,o)=>{u(o)}})),t.default.createElement(f.Stack,{style:{width:"300px"}},t.default.createElement(d.UITranslationInput,{entries:a,id:"test",i18nPrefix:"i18n",allowedI18nPrefixes:["i18n","@i18n"],allowedPatterns:[d.TranslationTextPattern.SingleBracketBinding,d.TranslationTextPattern.DoubleBracketReplace],defaultPattern:d.TranslationTextPattern.SingleBracketBinding,value:s,onChange:P,onCreateNewEntry:j,onShowExistingEntry:W,disabled:y,busy:c?{busy:c,useMinWaitingTime:!0}:void 0})," "),t.default.createElement(N,{tableData:E,onDelete:F}))};n.translationInput=w;function N(s){const r=Array.from({length:3}).map((k,c)=>{const u={key:"test"+(c+1),name:"",fieldName:"",minWidth:100,maxWidth:300};return c===0?(u.name="Key",u.fieldName="key",u.onRender=a=>t.default.createElement("div",{"data-i18n-key":a.key},a.key)):c===1?(u.name="Value",u.fieldName="value"):c===2&&(u.name="Delete",u.minWidth=50,u.maxWidth=50,u.onRender=a=>t.default.createElement(C.UIIconButton,{onClick:()=>{s.onDelete(a.key)},iconProps:{iconName:D.UiIcons.TrashCan}})),u});return t.default.createElement(t.default.Fragment,null,t.default.createElement("style",null,".ms-Fabric--isFocusVisible .ms-DetailsList .ms-DetailsRow-cell:focus::after { z-index: -1; }"),t.default.createElement("div",{style:{position:"relative",height:"100%"}},t.default.createElement(U.UITable,{dataSetKey:"datasetkey",items:s.tableData,columns:r})))}}}]);})();