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