@corva/ui 3.79.0-1 → 3.79.0-3

package/cjs-bundle/components/StatusBadge/components/DQAccordionDetailsContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"DQAccordionDetailsContent.js","sources":["../../../../../src/components/StatusBadge/components/DQAccordionDetailsContent.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { Accordion, AccordionDetails, AccordionSummary, Box } from '@material-ui/core';\nimport { ExpandMore as ExpandMoreIcon } from '@material-ui/icons';\nimport { useDQUnvalidatedContentStyles } from '~/components/StatusBadge/styles';\nimport { ALERT_STATES, Alert, AlertState, AssetItem } from '~/components/StatusBadge/constants';\nimport { DQAlertTooltip } from '~/components/StatusBadge/components/DQAlertTooltip';\nimport { DQStatusIcon } from '~/components/StatusBadge/components/DQStatusIcon';\nimport { getCategoryIconType } from '~/components/StatusBadge/utils';\n\ntype DQAccordionDetailsContentProps = { assets: AssetItem[] };\n\ntype GetAlertPropsType = (state: AlertState) => {\n  alert: Alert;\n  alertsNum: number;\n  alertState: AlertState;\n  isIssueData: boolean;\n  linkToDQPage: string;\n};\n\nexport const DQAccordionDetailsContent = ({\n  assets,\n}: DQAccordionDetailsContentProps): JSX.Element => {\n  const classes = useDQUnvalidatedContentStyles({});\n\n  const assetsGroupedByCategory = assets.reduce<Record<string, AssetItem[]>>((acc, curr) => {\n    if (!acc[curr.alert.category]) acc[curr.alert.category] = [];\n\n    acc[curr.alert.category] = [...acc[curr.alert.category], curr];\n    return acc;\n  }, {});\n\n  return (\n    <div>\n      {Object.keys(assetsGroupedByCategory).map(categoryKey => {\n        const categoryIconType = getCategoryIconType(assetsGroupedByCategory[categoryKey]);\n        return (\n          <Accordion key={categoryKey}>\n            <AccordionSummary\n              className={classNames('left', classes.categoryName)}\n              expandIcon={<ExpandMoreIcon />}\n            >\n              <Box\n                display=\"flex\"\n                alignItems=\"center\"\n                justifyContent=\"space-between\"\n                gridColumnGap={4}\n                width={200}\n              >\n                <span>{`${categoryKey} (${assetsGroupedByCategory[categoryKey].length})`}</span>\n                <DQStatusIcon color={categoryIconType} iconType={categoryIconType} />\n              </Box>\n            </AccordionSummary>\n            <AccordionDetails>\n              <div className={classes.assetTable}>\n                {assetsGroupedByCategory[categoryKey].map(\n                  ({ id, name, issuesNum, missingNum, isResolved, alert, linkToDQPage }: AssetItem) => {\n                    const getAlertProps: GetAlertPropsType = state => ({\n                      alert,\n                      alertsNum: state === ALERT_STATES.issue ? issuesNum : missingNum,\n                      alertState:\n                        state === ALERT_STATES.issue ? ALERT_STATES.issue : ALERT_STATES.missing,\n                      isIssueData: issuesNum > 0,\n                      linkToDQPage,\n                    });\n                    const issueAlertProps = getAlertProps(ALERT_STATES.issue);\n                    const missingAlertProps = getAlertProps(ALERT_STATES.missing);\n\n                    return (\n                      <div className={classes.assetWrapper} key={id}>\n                        <div className={classNames(classes.assetName, classes.assetCell)}>\n                          {name}\n                        </div>\n                        {isResolved ? (\n                          <div className={classes.assetCell}>\n                            <DQAlertTooltip {...issueAlertProps} />\n                          </div>\n                        ) : (\n                          <>\n                            {issuesNum > 0 && (\n                              <div className={classes.assetCell}>\n                                <DQAlertTooltip {...issueAlertProps} />\n                              </div>\n                            )}\n                            {missingNum > 0 && (\n                              <div className={classes.assetCell}>\n                                <DQAlertTooltip {...missingAlertProps} />\n                              </div>\n                            )}\n                          </>\n                        )}\n                      </div>\n                    );\n                  }\n                )}\n              </div>\n            </AccordionDetails>\n          </Accordion>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":["_ref","assets","classes","useDQUnvalidatedContentStyles","assetsGroupedByCategory","reduce","acc","curr","alert","category","_jsx","children","Object","keys","map","categoryKey","categoryIconType","getCategoryIconType","_jsxs","Accordion","AccordionSummary","className","classNames","categoryName","expandIcon","ExpandMoreIcon","ExpandMore","Box","display","alignItems","justifyContent","gridColumnGap","width","jsx","concat","length","DQStatusIcon","color","iconType","AccordionDetails","assetTable","_ref2","id","name","issuesNum","missingNum","isResolved","linkToDQPage","getAlertProps","state","alertsNum","ALERT_STATES","issue","alertState","missing","isIssueData","issueAlertProps","missingAlertProps","assetWrapper","assetName","assetCell","DQAlertTooltip","_objectSpread","jsxs","_Fragment"],"mappings":"ioCAmByC,SAEUA,GAAA,IADjDC,IAAAA,OAEMC,EAAUC,gCAA8B,CAAA,GAExCC,EAA0BH,EAAOI,QAAoC,SAACC,EAAKC,GAI/E,OAHKD,EAAIC,EAAKC,MAAMC,YAAWH,EAAIC,EAAKC,MAAMC,UAAY,IAE1DH,EAAIC,EAAKC,MAAMC,UAAgBH,GAAAA,OAAAA,EAAAA,QAAAA,EAAIC,EAAKC,MAAMC,WAAS,CAAEF,IAClDD,CACR,GAAE,CAAE,GAEL,OACEI,EAAAA,IAAA,MAAA,CAAAC,SACGC,OAAOC,KAAKT,GAAyBU,KAAI,SAAAC,GACxC,IAAMC,EAAmBC,EAAmBA,oBAACb,EAAwBW,IACrE,OACEG,EAAAA,KAACC,EAAAA,UAAS,CAAAR,SAAA,CACRD,MAACU,mBAAgB,CACfC,UAAWC,EAAU,QAAC,OAAQpB,EAAQqB,cACtCC,WAAYd,EAAAA,IAACe,EAAcC,WAAI,IAAAf,SAE/BO,OAACS,MAAG,CACFC,QAAQ,OACRC,WAAW,SACXC,eAAe,gBACfC,cAAe,EACfC,MAAO,IAAIrB,SAEX,CAAAD,EAAAuB,IAAA,OAAA,CAAAtB,SAAA,GAAAuB,OAAUnB,EAAgBX,MAAAA,OAAAA,EAAwBW,GAAaoB,OAAM,OACrEzB,MAAC0B,eAAY,CAACC,MAAOrB,EAAkBsB,SAAUtB,SAGrDN,MAAC6B,mBAAgB,CAAA5B,SACfD,EAAAuB,IAAA,MAAA,CAAKZ,UAAWnB,EAAQsC,WAAW7B,SAChCP,EAAwBW,GAAaD,KACpC,SAAqF2B,GAAA,IAAlFC,IAAAA,GAAIC,IAAAA,KAAMC,IAAAA,UAAWC,IAAAA,WAAYC,IAAAA,WAAYtC,IAAAA,MAAOuC,IAAAA,aAC/CC,EAAmC,SAAAC,GAAK,MAAK,CACjDzC,MAAAA,EACA0C,UAAWD,IAAUE,EAAAA,aAAaC,MAAQR,EAAYC,EACtDQ,WACEJ,IAAUE,eAAaC,MAAQD,EAAAA,aAAaC,MAAQD,EAAAA,aAAaG,QACnEC,YAAaX,EAAY,EACzBG,aAAAA,IAEIS,EAAkBR,EAAcG,EAAYA,aAACC,OAC7CK,EAAoBT,EAAcG,EAAYA,aAACG,SAErD,OACEpC,EAAAA,KAAA,MAAA,CAAKG,UAAWnB,EAAQwD,aAAa/C,SACnC,CAAAD,EAAAuB,IAAA,MAAA,CAAKZ,UAAWC,EAAAA,QAAWpB,EAAQyD,UAAWzD,EAAQ0D,WAAWjD,SAC9DgC,IAEFG,EACCpC,EAAAuB,IAAA,MAAA,CAAKZ,UAAWnB,EAAQ0D,UAAUjD,SAChCD,EAAAuB,IAAC4B,EAAcA,eAAAC,EAAA,CAAA,EAAKN,MAGtBtC,EAAA6C,KAAAC,WAAA,CAAArD,SACGiC,CAAAA,EAAY,GACXlC,EAAAA,IAAA,MAAA,CAAKW,UAAWnB,EAAQ0D,UAAUjD,SAChCD,EAAAuB,IAAC4B,EAAcA,eAAAC,EAAA,CAAA,EAAKN,MAGvBX,EAAa,GACZnC,EAAAA,IAAA,MAAA,CAAKW,UAAWnB,EAAQ0D,UAAUjD,SAChCD,EAAAuB,IAAC4B,EAAcA,eAAAC,EAAA,CAAA,EAAKL,WAjBaf,YAhCvC3B,OAiE1B"}
+{"version":3,"file":"DQAccordionDetailsContent.js","sources":["../../../../../src/components/StatusBadge/components/DQAccordionDetailsContent.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { Accordion, AccordionDetails, AccordionSummary, Box } from '@material-ui/core';\nimport ExpandMoreIcon from '@material-ui/icons/ExpandMore';\nimport { useDQUnvalidatedContentStyles } from '~/components/StatusBadge/styles';\nimport { ALERT_STATES, Alert, AlertState, AssetItem } from '~/components/StatusBadge/constants';\nimport { DQAlertTooltip } from '~/components/StatusBadge/components/DQAlertTooltip';\nimport { DQStatusIcon } from '~/components/StatusBadge/components/DQStatusIcon';\nimport { getCategoryIconType } from '~/components/StatusBadge/utils';\n\ntype DQAccordionDetailsContentProps = { assets: AssetItem[] };\n\ntype GetAlertPropsType = (state: AlertState) => {\n  alert: Alert;\n  alertsNum: number;\n  alertState: AlertState;\n  isIssueData: boolean;\n  linkToDQPage: string;\n};\n\nexport const DQAccordionDetailsContent = ({\n  assets,\n}: DQAccordionDetailsContentProps): JSX.Element => {\n  const classes = useDQUnvalidatedContentStyles({});\n\n  const assetsGroupedByCategory = assets.reduce<Record<string, AssetItem[]>>((acc, curr) => {\n    if (!acc[curr.alert.category]) acc[curr.alert.category] = [];\n\n    acc[curr.alert.category] = [...acc[curr.alert.category], curr];\n    return acc;\n  }, {});\n\n  return (\n    <div>\n      {Object.keys(assetsGroupedByCategory).map(categoryKey => {\n        const categoryIconType = getCategoryIconType(assetsGroupedByCategory[categoryKey]);\n        return (\n          <Accordion key={categoryKey}>\n            <AccordionSummary\n              className={classNames('left', classes.categoryName)}\n              expandIcon={<ExpandMoreIcon />}\n            >\n              <Box\n                display=\"flex\"\n                alignItems=\"center\"\n                justifyContent=\"space-between\"\n                gridColumnGap={4}\n                width={200}\n              >\n                <span>{`${categoryKey} (${assetsGroupedByCategory[categoryKey].length})`}</span>\n                <DQStatusIcon color={categoryIconType} iconType={categoryIconType} />\n              </Box>\n            </AccordionSummary>\n            <AccordionDetails>\n              <div className={classes.assetTable}>\n                {assetsGroupedByCategory[categoryKey].map(\n                  ({\n                    id,\n                    name,\n                    issuesNum,\n                    missingNum,\n                    isResolved,\n                    alert,\n                    linkToDQPage,\n                  }: AssetItem) => {\n                    const getAlertProps: GetAlertPropsType = state => ({\n                      alert,\n                      alertsNum: state === ALERT_STATES.issue ? issuesNum : missingNum,\n                      alertState:\n                        state === ALERT_STATES.issue ? ALERT_STATES.issue : ALERT_STATES.missing,\n                      isIssueData: issuesNum > 0,\n                      linkToDQPage,\n                    });\n                    const issueAlertProps = getAlertProps(ALERT_STATES.issue);\n                    const missingAlertProps = getAlertProps(ALERT_STATES.missing);\n\n                    return (\n                      <div className={classes.assetWrapper} key={id}>\n                        <div className={classNames(classes.assetName, classes.assetCell)}>\n                          {name}\n                        </div>\n                        {isResolved ? (\n                          <div className={classes.assetCell}>\n                            <DQAlertTooltip {...issueAlertProps} />\n                          </div>\n                        ) : (\n                          <>\n                            {issuesNum > 0 && (\n                              <div className={classes.assetCell}>\n                                <DQAlertTooltip {...issueAlertProps} />\n                              </div>\n                            )}\n                            {missingNum > 0 && (\n                              <div className={classes.assetCell}>\n                                <DQAlertTooltip {...missingAlertProps} />\n                              </div>\n                            )}\n                          </>\n                        )}\n                      </div>\n                    );\n                  }\n                )}\n              </div>\n            </AccordionDetails>\n          </Accordion>\n        );\n      })}\n    </div>\n  );\n};\n"],"names":["_ref","assets","classes","useDQUnvalidatedContentStyles","assetsGroupedByCategory","reduce","acc","curr","alert","category","_jsx","children","Object","keys","map","categoryKey","categoryIconType","getCategoryIconType","_jsxs","Accordion","AccordionSummary","className","classNames","categoryName","expandIcon","ExpandMoreIcon","Box","display","alignItems","justifyContent","gridColumnGap","width","jsx","concat","length","DQStatusIcon","color","iconType","AccordionDetails","assetTable","_ref2","id","name","issuesNum","missingNum","isResolved","linkToDQPage","getAlertProps","state","alertsNum","ALERT_STATES","issue","alertState","missing","isIssueData","issueAlertProps","missingAlertProps","assetWrapper","assetName","assetCell","DQAlertTooltip","_objectSpread","jsxs","_Fragment"],"mappings":"mpCAmByC,SAEUA,GAAA,IADjDC,IAAAA,OAEMC,EAAUC,gCAA8B,CAAA,GAExCC,EAA0BH,EAAOI,QAAoC,SAACC,EAAKC,GAI/E,OAHKD,EAAIC,EAAKC,MAAMC,YAAWH,EAAIC,EAAKC,MAAMC,UAAY,IAE1DH,EAAIC,EAAKC,MAAMC,UAAgBH,GAAAA,OAAAA,EAAAA,QAAAA,EAAIC,EAAKC,MAAMC,WAAS,CAAEF,IAClDD,CACR,GAAE,CAAE,GAEL,OACEI,EAAAA,IAAA,MAAA,CAAAC,SACGC,OAAOC,KAAKT,GAAyBU,KAAI,SAAAC,GACxC,IAAMC,EAAmBC,EAAmBA,oBAACb,EAAwBW,IACrE,OACEG,EAAAA,KAACC,EAAAA,UAAS,CAAAR,SAAA,CACRD,MAACU,mBAAgB,CACfC,UAAWC,EAAU,QAAC,OAAQpB,EAAQqB,cACtCC,WAAYd,EAAAA,IAACe,EAAc,QAAI,IAAAd,SAE/BO,OAACQ,MAAG,CACFC,QAAQ,OACRC,WAAW,SACXC,eAAe,gBACfC,cAAe,EACfC,MAAO,IAAIpB,SAEX,CAAAD,EAAAsB,IAAA,OAAA,CAAArB,SAAA,GAAAsB,OAAUlB,EAAgBX,MAAAA,OAAAA,EAAwBW,GAAamB,OAAM,OACrExB,MAACyB,eAAY,CAACC,MAAOpB,EAAkBqB,SAAUrB,SAGrDN,MAAC4B,mBAAgB,CAAA3B,SACfD,EAAAsB,IAAA,MAAA,CAAKX,UAAWnB,EAAQqC,WAAW5B,SAChCP,EAAwBW,GAAaD,KACpC,SAQiB0B,GAAA,IAPfC,IAAAA,GACAC,IAAAA,KACAC,IAAAA,UACAC,IAAAA,WACAC,IAAAA,WACArC,IAAAA,MACAsC,IAAAA,aAEMC,EAAmC,SAAAC,GAAK,MAAK,CACjDxC,MAAAA,EACAyC,UAAWD,IAAUE,EAAAA,aAAaC,MAAQR,EAAYC,EACtDQ,WACEJ,IAAUE,eAAaC,MAAQD,EAAAA,aAAaC,MAAQD,EAAAA,aAAaG,QACnEC,YAAaX,EAAY,EACzBG,aAAAA,IAEIS,EAAkBR,EAAcG,EAAYA,aAACC,OAC7CK,EAAoBT,EAAcG,EAAYA,aAACG,SAErD,OACEnC,EAAAA,KAAA,MAAA,CAAKG,UAAWnB,EAAQuD,aAAa9C,SACnC,CAAAD,EAAAsB,IAAA,MAAA,CAAKX,UAAWC,EAAAA,QAAWpB,EAAQwD,UAAWxD,EAAQyD,WAAWhD,SAC9D+B,IAEFG,EACCnC,EAAAsB,IAAA,MAAA,CAAKX,UAAWnB,EAAQyD,UAAUhD,SAChCD,EAAAsB,IAAC4B,EAAcA,eAAAC,EAAA,CAAA,EAAKN,MAGtBrC,EAAA4C,KAAAC,WAAA,CAAApD,SACGgC,CAAAA,EAAY,GACXjC,EAAAA,IAAA,MAAA,CAAKW,UAAWnB,EAAQyD,UAAUhD,SAChCD,EAAAsB,IAAC4B,EAAcA,eAAAC,EAAA,CAAA,EAAKN,MAGvBX,EAAa,GACZlC,EAAAA,IAAA,MAAA,CAAKW,UAAWnB,EAAQyD,UAAUhD,SAChCD,EAAAsB,IAAC4B,EAAcA,eAAAC,EAAA,CAAA,EAAKL,WAjBaf,YAxCvC1B,OAyE1B"}

package/cjs-bundle/components/Template/TemplatePopover/index.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("@babel/runtime/helpers/slicedToArray"),t=require("@babel/runtime/helpers/defineProperty"),a=require("react"),n=require("prop-types"),i=require("@material-ui/core"),l=require("@material-ui/icons"),r=require("classnames"),o=require("lodash"),s=require("../TemplateSharingDialog/index.js"),c=require("./Styles.js"),d=require("react/jsx-runtime");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p,m,f=u(e),h=u(t),g=u(n),j=u(r);function x(e,t){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),a.push.apply(a,n)}return a}function T(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?x(Object(a),!0).forEach((function(t){h.default(e,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):x(Object(a)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(a,t))}))}return e}var y="USER",v="DEFAULT",N="SHARED",S=(p={},h.default(p,y,"No templates yet..."),h.default(p,v,"No templates yet..."),h.default(p,N,"No shared templates yet..."),p),b=(m={},h.default(m,y,"My Template"),h.default(m,v,"Default Templates"),h.default(m,N,"Shared With Me"),m);function C(e){var t,n=e.currentUser,r=e.open,u=e.anchorEl,p=void 0===u?null:u,m=e.anchorOrigin,g=void 0===m?q:m,x=e.transformOrigin,C=void 0===x?O:x,E=e.onClose,P=e.templates,D=e.activeTemplateId,R=e.getDefaultTemplates,L=e.getUserTemplates,k=e.getSharedTemplates,B=e.onAddNewTemplate,z=e.onTemplateDelete,w=e.onTemplateCopy,U=e.onTemplateEdit,A=e.onTemplateShare,F=e.onActiveTemplateChange,W=e.loading,M=void 0!==W&&W,G=e.classes,H=void 0===G?I:G,K=e.hasNameSlot,J=void 0!==K&&K,Q=e.renderSlot,V=e.readOnly,X=void 0!==V&&V,Y=e.hideDefaultTemplates,Z=void 0!==Y&&Y,$=c.useTemplatePopoverStyles(),_=a.useState(P),ee=f.default(_,2),te=ee[0],ae=ee[1],ne=a.useState(null),ie=f.default(ne,2),le=ie[0],re=ie[1],oe=a.useState({}),se=f.default(oe,2),ce=se[0],de=se[1];a.useEffect((function(){ae(P)}),[P]);var ue=a.useMemo((function(){var e=[{type:y,templatesList:L(te)}];return Z||e.push({type:v,templatesList:R(te)}),X||e.push({type:N,templatesList:k(te)}),e}),[te,X,Z]),pe=function(e){return function(){F(e)}},me=function(e,t){return function(a){a.stopPropagation(),X||t(e)}},fe=function(e){return function(t){t.stopPropagation(),ae(te.map((function(t){return t.id===e?T(T({},t),{},{isEditing:!0,prevName:t.name}):t})))}},he=function(e){return function(t){t.stopPropagation(),ae(te.map((function(t){return t.id===e?T(T({},t),{},{isEditing:!1}):t})));var a=te.find((function(t){return t.id===e}));U(o.omit(a,["prevName","isEditing"]))}},ge=function(e){return function(t){t.stopPropagation(),ae(te.map((function(t){return t.id===e?T(T({},t),{},{name:t.prevName,isEditing:!1}):t})))}},je=function(e){return function(t){if("Enter"===t.key){ae(te.map((function(t){return t.id===e?T(T({},t),{},{isEditing:!1}):t})));var a=te.find((function(t){return t.id===e}));U(o.omit(a,["prevName","isEditing"]))}}},xe=function(e){return function(t){t.stopPropagation();var a=te.find((function(t){return t.id===e}));re(a)}},Te=function(){re(null)};return d.jsxs(i.Popover,{id:"app-settings-template-popper",classes:{paper:j.default($.paper,H.paper)},open:r,anchorEl:p,onClose:E,anchorOrigin:g,transformOrigin:C,children:[d.jsxs("div",{className:$.paperWrapper,children:[d.jsxs("div",{className:$.titleWrapper,children:[d.jsx(i.Typography,{className:$.title,children:"Templates"}),M&&d.jsx(i.CircularProgress,{size:16})]}),d.jsx("div",{className:j.default($.selectedGroup,(t={},h.default(t,$.selectedGroupSelected,-100===D),h.default(t,$.selectedGroupUnSelected,-100!==D),t)),onClick:pe(-100),children:d.jsxs("div",{className:$.noTemplateItem,children:[-100===D?d.jsx(l.Check,{fontSize:"small",className:$.selectedIcon}):d.jsx(l.LayersClear,{fontSize:"small",className:$.selectedIcon}),d.jsx("div",{className:$.selectedLabel,children:"No Template Selected"})]})}),ue.map((function(e){var t=e.type,n=e.templatesList;return d.jsxs(a.Fragment,{children:[d.jsxs("div",{className:$.templateHeader,children:[d.jsx(i.Typography,{className:$.subtitle,children:b[t]}),t===y&&!X&&d.jsx(i.Tooltip,{title:"Create Template",placement:"right",children:d.jsx(l.AddCircle,{fontSize:"small",color:"primary",className:$.addNewTemplateIcon,onClick:B})})]}),0===n.length?d.jsx(i.Typography,{className:$.noTemplateLabel,children:S[t]}):d.jsx(i.List,{className:$.templateList,children:n.map((function(e){var a,n,r;return d.jsx(i.Tooltip,{title:e.disabled?e.tooltipTitle:"",children:d.jsxs(i.ListItem,{className:j.default($.templateListItem,(a={},h.default(a,$.templateListItemSelected,e.id===D),h.default(a,$.templateListItemUnSelected,e.id!==D),a)),onClick:e.disabled?null:pe(e.id),disabled:null!==(n=e.disabled)&&void 0!==n&&n,children:[e.id===D?d.jsx(l.Check,T({fontSize:"small"},e.isEditing&&{color:"primary"})):d.jsx(l.Layers,T({fontSize:"small"},e.isEditing&&{color:"primary"})),e.isEditing?d.jsx(i.TextField,{autoFocus:!0,className:$.templateListItemInput,value:e.name,onClick:function(e){return e.stopPropagation()},onChange:(r=e.id,function(e){e.stopPropagation(),te.filter((function(e){return e.id!==r})).map((function(e){return e.name})).includes(e.target.value)?de(T(T({},ce),{},h.default({},r,"Duplicated name"))):de(T(T({},ce),{},h.default({},r,null))),ae(te.map((function(t){return t.id===r?T(T({},t),{},{name:e.target.value}):t})))}),onKeyDown:je(e.id),error:!!ce[e.id],helperText:ce[e.id]}):d.jsx(i.Typography,{className:$.templateListItemName,children:e.name}),e.isEditing?null:J&&Q(o.get(e,["settings","data"],[])),e.isEditing?d.jsxs("div",{className:j.default($.actionWrapper,$.actionWrapperEditing),children:[d.jsx(i.Tooltip,{title:"Save",children:d.jsx(i.IconButton,{className:$.actionIconButton,onClick:he(e.id),children:d.jsx(l.Check,{fontSize:"small",color:"primary"})})}),d.jsx(i.Tooltip,{title:"Cancel",children:d.jsx(i.IconButton,{className:$.actionIconButton,onClick:ge(e.id),children:d.jsx(l.Close,{className:$.actionIcon,fontSize:"small"})})})]}):d.jsx("div",{className:j.default($.actionWrapper,h.default({},$.actionWrapperHidden,e.disabled||X)),children:t===y?d.jsxs(d.Fragment,{children:[d.jsx(i.Tooltip,{title:"Delete",children:d.jsx(i.IconButton,{className:$.actionIconButton,onClick:me(e.id,z),children:d.jsx(l.Delete,{className:$.actionIcon,fontSize:"small"})})}),d.jsx(i.Tooltip,{title:"Rename",children:d.jsx(i.IconButton,{className:$.actionIconButton,onClick:fe(e.id),children:d.jsx(l.Edit,{className:$.actionIcon,fontSize:"small"})})}),d.jsx(i.Tooltip,{title:"Copy",children:d.jsx(i.IconButton,{className:$.actionIconButton,onClick:me(e.id,w),children:d.jsx(l.FileCopy,{className:$.actionIcon,fontSize:"small"})})}),d.jsx(i.Tooltip,{title:"Share",children:d.jsx(i.IconButton,{className:$.actionIconButton,onClick:xe(e.id),children:d.jsx(l.Share,{className:$.actionIcon,fontSize:"small"})})})]}):d.jsx(i.Tooltip,{title:"Copy To My Templates",children:d.jsx(i.IconButton,{className:$.actionIconButton,onClick:me(e.id,w),children:d.jsx(l.FileCopy,{className:$.actionIcon,fontSize:"small"})})})})]})},"template-list-item-".concat(e.id))}))})]},"template-list-".concat(t))}))]}),d.jsx(s,{title:'Share "'.concat(o.get(le,"name"),'"'),open:!!le,onSave:function(e){le&&A(le.id,e),Te()},onCancel:Te,currentUser:n})]})}C.propTypes={open:g.default.bool.isRequired,anchorEl:g.default.node,anchorOrigin:g.default.shape({}),transformOrigin:g.default.shape({}),onClose:g.default.func.isRequired,templates:g.default.arrayOf(g.default.shape({id:g.default.number,name:g.default.string,settings:g.default.shape({}),shared:g.default.bool})).isRequired,activeTemplateId:g.default.number.isRequired,getDefaultTemplates:g.default.func.isRequired,getUserTemplates:g.default.func.isRequired,getSharedTemplates:g.default.func.isRequired,onAddNewTemplate:g.default.func.isRequired,onTemplateDelete:g.default.func.isRequired,onTemplateCopy:g.default.func.isRequired,onTemplateEdit:g.default.func.isRequired,onTemplateShare:g.default.func.isRequired,onActiveTemplateChange:g.default.func.isRequired,loading:g.default.bool,classes:g.default.shape({paper:g.default.string}),hasNameSlot:g.default.bool,renderSlot:g.default.func.isRequired,currentUser:g.default.shape({}).isRequired,readOnly:g.default.bool,hideDefaultTemplates:g.default.bool};var I={},q={},O={};module.exports=C;
+"use strict";var e=require("@babel/runtime/helpers/slicedToArray"),t=require("@babel/runtime/helpers/defineProperty"),a=require("react"),i=require("prop-types"),n=require("@material-ui/core"),l=require("@material-ui/icons/Layers"),r=require("@material-ui/icons/LayersClear"),o=require("@material-ui/icons/AddCircle"),s=require("@material-ui/icons/Check"),c=require("@material-ui/icons/Delete"),u=require("@material-ui/icons/Edit"),d=require("@material-ui/icons/Share"),p=require("@material-ui/icons/Close"),m=require("@material-ui/icons/FileCopy"),f=require("classnames"),h=require("lodash"),g=require("../TemplateSharingDialog/index.js"),j=require("./Styles.js"),x=require("react/jsx-runtime");function T(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var y,v,N=T(e),S=T(t),b=T(i),q=T(l),I=T(r),C=T(o),O=T(s),E=T(c),P=T(u),D=T(d),R=T(p),L=T(m),k=T(f);function B(e,t){var a=Object.keys(e);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);t&&(i=i.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),a.push.apply(a,i)}return a}function z(e){for(var t=1;t<arguments.length;t++){var a=null!=arguments[t]?arguments[t]:{};t%2?B(Object(a),!0).forEach((function(t){S.default(e,t,a[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(a)):B(Object(a)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(a,t))}))}return e}var w="USER",U="DEFAULT",A="SHARED",W=(y={},S.default(y,w,"No templates yet..."),S.default(y,U,"No templates yet..."),S.default(y,A,"No shared templates yet..."),y),F=(v={},S.default(v,w,"My Template"),S.default(v,U,"Default Templates"),S.default(v,A,"Shared With Me"),v);function M(e){var t,i=e.currentUser,l=e.open,r=e.anchorEl,o=void 0===r?null:r,s=e.anchorOrigin,c=void 0===s?H:s,u=e.transformOrigin,d=void 0===u?K:u,p=e.onClose,m=e.templates,f=e.activeTemplateId,T=e.getDefaultTemplates,y=e.getUserTemplates,v=e.getSharedTemplates,b=e.onAddNewTemplate,B=e.onTemplateDelete,M=e.onTemplateCopy,J=e.onTemplateEdit,Q=e.onTemplateShare,V=e.onActiveTemplateChange,X=e.loading,Y=void 0!==X&&X,Z=e.classes,$=void 0===Z?G:Z,_=e.hasNameSlot,ee=void 0!==_&&_,te=e.renderSlot,ae=e.readOnly,ie=void 0!==ae&&ae,ne=e.hideDefaultTemplates,le=void 0!==ne&&ne,re=j.useTemplatePopoverStyles(),oe=a.useState(m),se=N.default(oe,2),ce=se[0],ue=se[1],de=a.useState(null),pe=N.default(de,2),me=pe[0],fe=pe[1],he=a.useState({}),ge=N.default(he,2),je=ge[0],xe=ge[1];a.useEffect((function(){ue(m)}),[m]);var Te=a.useMemo((function(){var e=[{type:w,templatesList:y(ce)}];return le||e.push({type:U,templatesList:T(ce)}),ie||e.push({type:A,templatesList:v(ce)}),e}),[ce,ie,le]),ye=function(e){return function(){V(e)}},ve=function(e,t){return function(a){a.stopPropagation(),ie||t(e)}},Ne=function(e){return function(t){t.stopPropagation(),ue(ce.map((function(t){return t.id===e?z(z({},t),{},{isEditing:!0,prevName:t.name}):t})))}},Se=function(e){return function(t){t.stopPropagation(),ue(ce.map((function(t){return t.id===e?z(z({},t),{},{isEditing:!1}):t})));var a=ce.find((function(t){return t.id===e}));J(h.omit(a,["prevName","isEditing"]))}},be=function(e){return function(t){t.stopPropagation(),ue(ce.map((function(t){return t.id===e?z(z({},t),{},{name:t.prevName,isEditing:!1}):t})))}},qe=function(e){return function(t){if("Enter"===t.key){ue(ce.map((function(t){return t.id===e?z(z({},t),{},{isEditing:!1}):t})));var a=ce.find((function(t){return t.id===e}));J(h.omit(a,["prevName","isEditing"]))}}},Ie=function(e){return function(t){t.stopPropagation();var a=ce.find((function(t){return t.id===e}));fe(a)}},Ce=function(){fe(null)};return x.jsxs(n.Popover,{id:"app-settings-template-popper",classes:{paper:k.default(re.paper,$.paper)},open:l,anchorEl:o,onClose:p,anchorOrigin:c,transformOrigin:d,children:[x.jsxs("div",{className:re.paperWrapper,children:[x.jsxs("div",{className:re.titleWrapper,children:[x.jsx(n.Typography,{className:re.title,children:"Templates"}),Y&&x.jsx(n.CircularProgress,{size:16})]}),x.jsx("div",{className:k.default(re.selectedGroup,(t={},S.default(t,re.selectedGroupSelected,-100===f),S.default(t,re.selectedGroupUnSelected,-100!==f),t)),onClick:ye(-100),children:x.jsxs("div",{className:re.noTemplateItem,children:[-100===f?x.jsx(O.default,{fontSize:"small",className:re.selectedIcon}):x.jsx(I.default,{fontSize:"small",className:re.selectedIcon}),x.jsx("div",{className:re.selectedLabel,children:"No Template Selected"})]})}),Te.map((function(e){var t=e.type,i=e.templatesList;return x.jsxs(a.Fragment,{children:[x.jsxs("div",{className:re.templateHeader,children:[x.jsx(n.Typography,{className:re.subtitle,children:F[t]}),t===w&&!ie&&x.jsx(n.Tooltip,{title:"Create Template",placement:"right",children:x.jsx(C.default,{fontSize:"small",color:"primary",className:re.addNewTemplateIcon,onClick:b})})]}),0===i.length?x.jsx(n.Typography,{className:re.noTemplateLabel,children:W[t]}):x.jsx(n.List,{className:re.templateList,children:i.map((function(e){var a,i,l;return x.jsx(n.Tooltip,{title:e.disabled?e.tooltipTitle:"",children:x.jsxs(n.ListItem,{className:k.default(re.templateListItem,(a={},S.default(a,re.templateListItemSelected,e.id===f),S.default(a,re.templateListItemUnSelected,e.id!==f),a)),onClick:e.disabled?null:ye(e.id),disabled:null!==(i=e.disabled)&&void 0!==i&&i,children:[e.id===f?x.jsx(O.default,z({fontSize:"small"},e.isEditing&&{color:"primary"})):x.jsx(q.default,z({fontSize:"small"},e.isEditing&&{color:"primary"})),e.isEditing?x.jsx(n.TextField,{autoFocus:!0,className:re.templateListItemInput,value:e.name,onClick:function(e){return e.stopPropagation()},onChange:(l=e.id,function(e){e.stopPropagation(),ce.filter((function(e){return e.id!==l})).map((function(e){return e.name})).includes(e.target.value)?xe(z(z({},je),{},S.default({},l,"Duplicated name"))):xe(z(z({},je),{},S.default({},l,null))),ue(ce.map((function(t){return t.id===l?z(z({},t),{},{name:e.target.value}):t})))}),onKeyDown:qe(e.id),error:!!je[e.id],helperText:je[e.id]}):x.jsx(n.Typography,{className:re.templateListItemName,children:e.name}),e.isEditing?null:ee&&te(h.get(e,["settings","data"],[])),e.isEditing?x.jsxs("div",{className:k.default(re.actionWrapper,re.actionWrapperEditing),children:[x.jsx(n.Tooltip,{title:"Save",children:x.jsx(n.IconButton,{className:re.actionIconButton,onClick:Se(e.id),children:x.jsx(O.default,{fontSize:"small",color:"primary"})})}),x.jsx(n.Tooltip,{title:"Cancel",children:x.jsx(n.IconButton,{className:re.actionIconButton,onClick:be(e.id),children:x.jsx(R.default,{className:re.actionIcon,fontSize:"small"})})})]}):x.jsx("div",{className:k.default(re.actionWrapper,S.default({},re.actionWrapperHidden,e.disabled||ie)),children:t===w?x.jsxs(x.Fragment,{children:[x.jsx(n.Tooltip,{title:"Delete",children:x.jsx(n.IconButton,{className:re.actionIconButton,onClick:ve(e.id,B),children:x.jsx(E.default,{className:re.actionIcon,fontSize:"small"})})}),x.jsx(n.Tooltip,{title:"Rename",children:x.jsx(n.IconButton,{className:re.actionIconButton,onClick:Ne(e.id),children:x.jsx(P.default,{className:re.actionIcon,fontSize:"small"})})}),x.jsx(n.Tooltip,{title:"Copy",children:x.jsx(n.IconButton,{className:re.actionIconButton,onClick:ve(e.id,M),children:x.jsx(L.default,{className:re.actionIcon,fontSize:"small"})})}),x.jsx(n.Tooltip,{title:"Share",children:x.jsx(n.IconButton,{className:re.actionIconButton,onClick:Ie(e.id),children:x.jsx(D.default,{className:re.actionIcon,fontSize:"small"})})})]}):x.jsx(n.Tooltip,{title:"Copy To My Templates",children:x.jsx(n.IconButton,{className:re.actionIconButton,onClick:ve(e.id,M),children:x.jsx(L.default,{className:re.actionIcon,fontSize:"small"})})})})]})},"template-list-item-".concat(e.id))}))})]},"template-list-".concat(t))}))]}),x.jsx(g,{title:'Share "'.concat(h.get(me,"name"),'"'),open:!!me,onSave:function(e){me&&Q(me.id,e),Ce()},onCancel:Ce,currentUser:i})]})}M.propTypes={open:b.default.bool.isRequired,anchorEl:b.default.node,anchorOrigin:b.default.shape({}),transformOrigin:b.default.shape({}),onClose:b.default.func.isRequired,templates:b.default.arrayOf(b.default.shape({id:b.default.number,name:b.default.string,settings:b.default.shape({}),shared:b.default.bool})).isRequired,activeTemplateId:b.default.number.isRequired,getDefaultTemplates:b.default.func.isRequired,getUserTemplates:b.default.func.isRequired,getSharedTemplates:b.default.func.isRequired,onAddNewTemplate:b.default.func.isRequired,onTemplateDelete:b.default.func.isRequired,onTemplateCopy:b.default.func.isRequired,onTemplateEdit:b.default.func.isRequired,onTemplateShare:b.default.func.isRequired,onActiveTemplateChange:b.default.func.isRequired,loading:b.default.bool,classes:b.default.shape({paper:b.default.string}),hasNameSlot:b.default.bool,renderSlot:b.default.func.isRequired,currentUser:b.default.shape({}).isRequired,readOnly:b.default.bool,hideDefaultTemplates:b.default.bool};var G={},H={},K={};module.exports=M;
 //# sourceMappingURL=index.js.map

package/cjs-bundle/components/Template/TemplatePopover/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/components/Template/TemplatePopover/index.js"],"sourcesContent":["import { useMemo, useState, useEffect, Fragment } from 'react';\nimport PropTypes from 'prop-types';\nimport {\n  Typography,\n  IconButton,\n  List,\n  ListItem,\n  TextField,\n  Popover,\n  CircularProgress,\n  Tooltip,\n} from '@material-ui/core';\nimport {\n  Layers as LayersIcon,\n  LayersClear as LayersClearIcon,\n  AddCircle as AddCircleIcon,\n  Check as CheckIcon,\n  Delete as DeleteIcon,\n  Edit as EditIcon,\n  Share as ShareIcon,\n  Close as CloseIcon,\n  FileCopy as CopyIcon,\n} from '@material-ui/icons';\nimport classnames from 'classnames';\nimport { get, omit } from 'lodash';\n\nimport TemplateSharingDialog from '../TemplateSharingDialog';\n\nimport { useTemplatePopoverStyles } from './Styles';\n\nconst NO_TEMPLATE_SELECTED_ID = -100;\nconst DUPLICATED_NAME_ERROR_MESSAGE = 'Duplicated name';\n\nconst TEMPLATE_TYPES = {\n  USER: 'USER',\n  DEFAULT: 'DEFAULT',\n  SHARED: 'SHARED',\n};\n\nconst NO_TEMPLATE_MSG = {\n  [TEMPLATE_TYPES.USER]: 'No templates yet...',\n  [TEMPLATE_TYPES.DEFAULT]: 'No templates yet...',\n  [TEMPLATE_TYPES.SHARED]: 'No shared templates yet...',\n};\n\nconst TEMPLATE_LABELS = {\n  [TEMPLATE_TYPES.USER]: 'My Template',\n  [TEMPLATE_TYPES.DEFAULT]: 'Default Templates',\n  [TEMPLATE_TYPES.SHARED]: 'Shared With Me',\n};\n\nfunction TemplatePopover({\n  currentUser,\n  // popover\n  open,\n  anchorEl = null,\n  anchorOrigin = DEFAULT_TEMPLATE_POPOVER_ANCHOR_ORIGIN,\n  transformOrigin = DEFAULT_TEMPLATE_POPOVER_TRANSFORM_ORIGIN,\n  onClose,\n  // templates\n  templates,\n  activeTemplateId,\n  getDefaultTemplates,\n  getUserTemplates,\n  getSharedTemplates,\n  onAddNewTemplate,\n  onTemplateDelete,\n  onTemplateCopy,\n  onTemplateEdit,\n  onTemplateShare,\n  onActiveTemplateChange,\n  loading = false,\n  classes: customMuiStyles = DEFAULT_TEMPLATE_POPOVER_CLASSES,\n  // custome slot\n  hasNameSlot = false,\n  renderSlot,\n  readOnly = false,\n  hideDefaultTemplates = false,\n}) {\n  const classes = useTemplatePopoverStyles();\n  const [allTemplates, setAllTemplates] = useState(templates);\n  const [templateToShare, setTemplateToShare] = useState(null);\n  const [error, setError] = useState({});\n  useEffect(() => {\n    setAllTemplates(templates);\n  }, [templates]);\n\n  // NOTE: Group template by type\n  const groupedTemplates = useMemo(() => {\n    const groups = [\n      {\n        type: TEMPLATE_TYPES.USER,\n        templatesList: getUserTemplates(allTemplates),\n      },\n    ];\n    if (!hideDefaultTemplates)\n      groups.push({\n        type: TEMPLATE_TYPES.DEFAULT,\n        templatesList: getDefaultTemplates(allTemplates),\n      });\n    if (!readOnly)\n      groups.push({\n        type: TEMPLATE_TYPES.SHARED,\n        templatesList: getSharedTemplates(allTemplates),\n      });\n    return groups;\n  }, [allTemplates, readOnly, hideDefaultTemplates]);\n\n  const handleClickTemplate = nextActiveTemplateId => () => {\n    onActiveTemplateChange(nextActiveTemplateId);\n  };\n\n  const handleChange = (templateId, callback) => e => {\n    e.stopPropagation();\n    if (!readOnly) callback(templateId);\n  };\n\n  // NOTE: Handlers for template name change\n  const handleTemplateNameEdit = templateId => e => {\n    e.stopPropagation();\n    setAllTemplates(\n      allTemplates.map(item =>\n        item.id === templateId ? { ...item, isEditing: true, prevName: item.name } : item\n      )\n    );\n  };\n  const handleTemplateNameChange = templateId => e => {\n    e.stopPropagation();\n\n    const allTemplateNames = allTemplates\n      .filter(template => template.id !== templateId)\n      .map(template => template.name);\n    if (allTemplateNames.includes(e.target.value)) {\n      setError({\n        ...error,\n        [templateId]: DUPLICATED_NAME_ERROR_MESSAGE,\n      });\n    } else {\n      setError({\n        ...error,\n        [templateId]: null,\n      });\n    }\n\n    setAllTemplates(\n      allTemplates.map(item => (item.id === templateId ? { ...item, name: e.target.value } : item))\n    );\n  };\n  const handleTemplateNameEditApply = templateId => e => {\n    e.stopPropagation();\n    setAllTemplates(\n      allTemplates.map(item => (item.id === templateId ? { ...item, isEditing: false } : item))\n    );\n    const currentTemplate = allTemplates.find(template => template.id === templateId);\n    onTemplateEdit(omit(currentTemplate, ['prevName', 'isEditing']));\n  };\n  const handleTemplateNameEditCancel = templateId => e => {\n    e.stopPropagation();\n    setAllTemplates(\n      allTemplates.map(item =>\n        item.id === templateId ? { ...item, name: item.prevName, isEditing: false } : item\n      )\n    );\n  };\n  const handleKeyDown = templateId => e => {\n    if (e.key === 'Enter') {\n      setAllTemplates(\n        allTemplates.map(item => (item.id === templateId ? { ...item, isEditing: false } : item))\n      );\n      const currentTemplate = allTemplates.find(template => template.id === templateId);\n      onTemplateEdit(omit(currentTemplate, ['prevName', 'isEditing']));\n    }\n  };\n\n  // NOTE: Handlers for template sharing\n  const handleTemplateSharingDialogOpen = templateId => e => {\n    e.stopPropagation();\n    const currentTemplate = allTemplates.find(item => item.id === templateId);\n    setTemplateToShare(currentTemplate);\n  };\n  const handleTemplateSharingDialogClose = () => {\n    setTemplateToShare(null);\n  };\n  const handleTemplateSharingSave = usersToShare => {\n    if (templateToShare) {\n      onTemplateShare(templateToShare.id, usersToShare);\n    }\n    handleTemplateSharingDialogClose();\n  };\n\n  return (\n    <Popover\n      id=\"app-settings-template-popper\"\n      classes={{\n        paper: classnames(classes.paper, customMuiStyles.paper),\n      }}\n      open={open}\n      anchorEl={anchorEl}\n      onClose={onClose}\n      anchorOrigin={anchorOrigin}\n      transformOrigin={transformOrigin}\n    >\n      <div className={classes.paperWrapper}>\n        <div className={classes.titleWrapper}>\n          <Typography className={classes.title}>Templates</Typography>\n          {loading && <CircularProgress size={16} />}\n        </div>\n\n        <div\n          className={classnames(classes.selectedGroup, {\n            [classes.selectedGroupSelected]: activeTemplateId === NO_TEMPLATE_SELECTED_ID,\n            [classes.selectedGroupUnSelected]: activeTemplateId !== NO_TEMPLATE_SELECTED_ID,\n          })}\n          onClick={handleClickTemplate(NO_TEMPLATE_SELECTED_ID)}\n        >\n          <div className={classes.noTemplateItem}>\n            {activeTemplateId === NO_TEMPLATE_SELECTED_ID ? (\n              <CheckIcon fontSize=\"small\" className={classes.selectedIcon} />\n            ) : (\n              <LayersClearIcon fontSize=\"small\" className={classes.selectedIcon} />\n            )}\n            <div className={classes.selectedLabel}>No Template Selected</div>\n          </div>\n        </div>\n\n        {groupedTemplates.map(({ type, templatesList }) => (\n          <Fragment key={`template-list-${type}`}>\n            <div className={classes.templateHeader}>\n              <Typography className={classes.subtitle}>{TEMPLATE_LABELS[type]}</Typography>\n              {type === TEMPLATE_TYPES.USER && !readOnly && (\n                <Tooltip title=\"Create Template\" placement=\"right\">\n                  <AddCircleIcon\n                    fontSize=\"small\"\n                    color=\"primary\"\n                    className={classes.addNewTemplateIcon}\n                    onClick={onAddNewTemplate}\n                  />\n                </Tooltip>\n              )}\n            </div>\n\n            {templatesList.length === 0 ? (\n              <Typography className={classes.noTemplateLabel}>{NO_TEMPLATE_MSG[type]}</Typography>\n            ) : (\n              <List className={classes.templateList}>\n                {templatesList.map(template => (\n                  <Tooltip\n                    key={`template-list-item-${template.id}`}\n                    title={template.disabled ? template.tooltipTitle : ''}\n                  >\n                    <ListItem\n                      className={classnames(classes.templateListItem, {\n                        [classes.templateListItemSelected]: template.id === activeTemplateId,\n                        [classes.templateListItemUnSelected]: template.id !== activeTemplateId,\n                      })}\n                      onClick={template.disabled ? null : handleClickTemplate(template.id)}\n                      disabled={template.disabled ?? false}\n                    >\n                      {template.id === activeTemplateId ? (\n                        <CheckIcon\n                          fontSize=\"small\"\n                          {...(template.isEditing && { color: 'primary' })}\n                        />\n                      ) : (\n                        <LayersIcon\n                          fontSize=\"small\"\n                          {...(template.isEditing && { color: 'primary' })}\n                        />\n                      )}\n\n                      {template.isEditing ? (\n                        <TextField\n                          autoFocus\n                          className={classes.templateListItemInput}\n                          value={template.name}\n                          onClick={e => e.stopPropagation()}\n                          onChange={handleTemplateNameChange(template.id)}\n                          onKeyDown={handleKeyDown(template.id)}\n                          error={!!error[template.id]}\n                          helperText={error[template.id]}\n                        />\n                      ) : (\n                        <Typography className={classes.templateListItemName}>\n                          {template.name}\n                        </Typography>\n                      )}\n\n                      {!template.isEditing\n                        ? hasNameSlot && renderSlot(get(template, ['settings', 'data'], []))\n                        : null}\n\n                      {template.isEditing ? (\n                        <div\n                          className={classnames(\n                            classes.actionWrapper,\n                            classes.actionWrapperEditing\n                          )}\n                        >\n                          <Tooltip title=\"Save\">\n                            <IconButton\n                              className={classes.actionIconButton}\n                              onClick={handleTemplateNameEditApply(template.id)}\n                            >\n                              <CheckIcon fontSize=\"small\" color=\"primary\" />\n                            </IconButton>\n                          </Tooltip>\n\n                          <Tooltip title=\"Cancel\">\n                            <IconButton\n                              className={classes.actionIconButton}\n                              onClick={handleTemplateNameEditCancel(template.id)}\n                            >\n                              <CloseIcon className={classes.actionIcon} fontSize=\"small\" />\n                            </IconButton>\n                          </Tooltip>\n                        </div>\n                      ) : (\n                        <div\n                          className={classnames(classes.actionWrapper, {\n                            [classes.actionWrapperHidden]: template.disabled || readOnly,\n                          })}\n                        >\n                          {type === TEMPLATE_TYPES.USER ? (\n                            <>\n                              <Tooltip title=\"Delete\">\n                                <IconButton\n                                  className={classes.actionIconButton}\n                                  onClick={handleChange(template.id, onTemplateDelete)}\n                                >\n                                  <DeleteIcon className={classes.actionIcon} fontSize=\"small\" />\n                                </IconButton>\n                              </Tooltip>\n\n                              <Tooltip title=\"Rename\">\n                                <IconButton\n                                  className={classes.actionIconButton}\n                                  onClick={handleTemplateNameEdit(template.id)}\n                                >\n                                  <EditIcon className={classes.actionIcon} fontSize=\"small\" />\n                                </IconButton>\n                              </Tooltip>\n\n                              <Tooltip title=\"Copy\">\n                                <IconButton\n                                  className={classes.actionIconButton}\n                                  onClick={handleChange(template.id, onTemplateCopy)}\n                                >\n                                  <CopyIcon className={classes.actionIcon} fontSize=\"small\" />\n                                </IconButton>\n                              </Tooltip>\n\n                              <Tooltip title=\"Share\">\n                                <IconButton\n                                  className={classes.actionIconButton}\n                                  onClick={handleTemplateSharingDialogOpen(template.id)}\n                                >\n                                  <ShareIcon className={classes.actionIcon} fontSize=\"small\" />\n                                </IconButton>\n                              </Tooltip>\n                            </>\n                          ) : (\n                            <Tooltip title=\"Copy To My Templates\">\n                              <IconButton\n                                className={classes.actionIconButton}\n                                onClick={handleChange(template.id, onTemplateCopy)}\n                              >\n                                <CopyIcon className={classes.actionIcon} fontSize=\"small\" />\n                              </IconButton>\n                            </Tooltip>\n                          )}\n                        </div>\n                      )}\n                    </ListItem>\n                  </Tooltip>\n                ))}\n              </List>\n            )}\n          </Fragment>\n        ))}\n      </div>\n\n      <TemplateSharingDialog\n        title={`Share \"${get(templateToShare, 'name')}\"`}\n        open={!!templateToShare}\n        onSave={handleTemplateSharingSave}\n        onCancel={handleTemplateSharingDialogClose}\n        currentUser={currentUser}\n      />\n    </Popover>\n  );\n}\n\nTemplatePopover.propTypes = {\n  open: PropTypes.bool.isRequired,\n  anchorEl: PropTypes.node,\n  anchorOrigin: PropTypes.shape({}),\n  transformOrigin: PropTypes.shape({}),\n  onClose: PropTypes.func.isRequired,\n  templates: PropTypes.arrayOf(\n    PropTypes.shape({\n      id: PropTypes.number,\n      name: PropTypes.string,\n      settings: PropTypes.shape({}),\n      shared: PropTypes.bool,\n    })\n  ).isRequired,\n  activeTemplateId: PropTypes.number.isRequired,\n  getDefaultTemplates: PropTypes.func.isRequired, // Needs to be pure function\n  getUserTemplates: PropTypes.func.isRequired, // Needs to be pure function\n  getSharedTemplates: PropTypes.func.isRequired, // Needs to be pure function\n  onAddNewTemplate: PropTypes.func.isRequired, // () => {}\n  onTemplateDelete: PropTypes.func.isRequired, // templateId => {}\n  onTemplateCopy: PropTypes.func.isRequired, // templateId => {}\n  onTemplateEdit: PropTypes.func.isRequired, // newTemplate => {}\n  onTemplateShare: PropTypes.func.isRequired, // (templateId, users) => {}\n  onActiveTemplateChange: PropTypes.func.isRequired, // templateId => {}\n  loading: PropTypes.bool, // Template loading status\n\n  // Customize styles\n  classes: PropTypes.shape({\n    paper: PropTypes.string,\n  }),\n  hasNameSlot: PropTypes.bool,\n  renderSlot: PropTypes.func.isRequired,\n  currentUser: PropTypes.shape({}).isRequired,\n  readOnly: PropTypes.bool,\n  hideDefaultTemplates: PropTypes.bool,\n};\n\nconst DEFAULT_TEMPLATE_POPOVER_CLASSES = {};\nconst DEFAULT_TEMPLATE_POPOVER_ANCHOR_ORIGIN = {};\nconst DEFAULT_TEMPLATE_POPOVER_TRANSFORM_ORIGIN = {};\n\nexport default TemplatePopover;\n"],"names":["TEMPLATE_TYPES","NO_TEMPLATE_MSG","_NO_TEMPLATE_MSG","TEMPLATE_LABELS","_TEMPLATE_LABELS","TemplatePopover","_ref","_classnames","currentUser","open","_ref$anchorEl","anchorEl","_ref$anchorOrigin","anchorOrigin","DEFAULT_TEMPLATE_POPOVER_ANCHOR_ORIGIN","_ref$transformOrigin","transformOrigin","DEFAULT_TEMPLATE_POPOVER_TRANSFORM_ORIGIN","onClose","templates","activeTemplateId","getDefaultTemplates","getUserTemplates","getSharedTemplates","onAddNewTemplate","onTemplateDelete","onTemplateCopy","onTemplateEdit","onTemplateShare","onActiveTemplateChange","_ref$loading","loading","_ref$classes","classes","customMuiStyles","DEFAULT_TEMPLATE_POPOVER_CLASSES","_ref$hasNameSlot","hasNameSlot","renderSlot","_ref$readOnly","readOnly","_ref$hideDefaultTempl","hideDefaultTemplates","useTemplatePopoverStyles","useState","_useState2","_slicedToArray","_useState","allTemplates","setAllTemplates","_useState4","_useState3","templateToShare","setTemplateToShare","_useState5","_useState6","error","setError","useEffect","groupedTemplates","useMemo","groups","type","templatesList","push","handleClickTemplate","nextActiveTemplateId","handleChange","templateId","callback","e","stopPropagation","handleTemplateNameEdit","map","item","id","isEditing","prevName","name","handleTemplateNameEditApply","currentTemplate","find","template","omit","handleTemplateNameEditCancel","handleKeyDown","key","handleTemplateSharingDialogOpen","handleTemplateSharingDialogClose","_jsxs","Popover","paper","classnames","children","jsxs","className","paperWrapper","titleWrapper","_jsx","Typography","title","jsx","CircularProgress","size","selectedGroup","_defineProperty","selectedGroupSelected","selectedGroupUnSelected","onClick","noTemplateItem","CheckIcon","fontSize","selectedIcon","LayersClearIcon","selectedLabel","_ref2","Fragment","templateHeader","subtitle","Tooltip","placement","AddCircleIcon","color","addNewTemplateIcon","length","noTemplateLabel","List","templateList","_classnames2","_template$disabled","disabled","tooltipTitle","ListItem","templateListItem","templateListItemSelected","templateListItemUnSelected","Check","_objectSpread","LayersIcon","Layers","TextField","autoFocus","templateListItemInput","value","onChange","filter","includes","target","onKeyDown","helperText","templateListItemName","get","actionWrapper","actionWrapperEditing","IconButton","actionIconButton","CloseIcon","actionIcon","actionWrapperHidden","_Fragment","DeleteIcon","EditIcon","CopyIcon","ShareIcon","concat","TemplateSharingDialog","onSave","usersToShare","onCancel","propTypes","PropTypes","bool","isRequired","node","shape","func","arrayOf","number","string","settings","shared"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/components/Template/TemplatePopover/index.js"],"sourcesContent":["import { useMemo, useState, useEffect, Fragment } from 'react';\nimport PropTypes from 'prop-types';\nimport {\n  Typography,\n  IconButton,\n  List,\n  ListItem,\n  TextField,\n  Popover,\n  CircularProgress,\n  Tooltip,\n} from '@material-ui/core';\nimport LayersIcon from '@material-ui/icons/Layers';\nimport LayersClearIcon from '@material-ui/icons/LayersClear';\nimport AddCircleIcon from '@material-ui/icons/AddCircle';\nimport CheckIcon from '@material-ui/icons/Check';\nimport DeleteIcon from '@material-ui/icons/Delete';\nimport EditIcon from '@material-ui/icons/Edit';\nimport ShareIcon from '@material-ui/icons/Share';\nimport CloseIcon from '@material-ui/icons/Close';\nimport CopyIcon from '@material-ui/icons/FileCopy';\nimport classnames from 'classnames';\nimport { get, omit } from 'lodash';\n\nimport TemplateSharingDialog from '../TemplateSharingDialog';\n\nimport { useTemplatePopoverStyles } from './Styles';\n\nconst NO_TEMPLATE_SELECTED_ID = -100;\nconst DUPLICATED_NAME_ERROR_MESSAGE = 'Duplicated name';\n\nconst TEMPLATE_TYPES = {\n  USER: 'USER',\n  DEFAULT: 'DEFAULT',\n  SHARED: 'SHARED',\n};\n\nconst NO_TEMPLATE_MSG = {\n  [TEMPLATE_TYPES.USER]: 'No templates yet...',\n  [TEMPLATE_TYPES.DEFAULT]: 'No templates yet...',\n  [TEMPLATE_TYPES.SHARED]: 'No shared templates yet...',\n};\n\nconst TEMPLATE_LABELS = {\n  [TEMPLATE_TYPES.USER]: 'My Template',\n  [TEMPLATE_TYPES.DEFAULT]: 'Default Templates',\n  [TEMPLATE_TYPES.SHARED]: 'Shared With Me',\n};\n\nfunction TemplatePopover({\n  currentUser,\n  // popover\n  open,\n  anchorEl = null,\n  anchorOrigin = DEFAULT_TEMPLATE_POPOVER_ANCHOR_ORIGIN,\n  transformOrigin = DEFAULT_TEMPLATE_POPOVER_TRANSFORM_ORIGIN,\n  onClose,\n  // templates\n  templates,\n  activeTemplateId,\n  getDefaultTemplates,\n  getUserTemplates,\n  getSharedTemplates,\n  onAddNewTemplate,\n  onTemplateDelete,\n  onTemplateCopy,\n  onTemplateEdit,\n  onTemplateShare,\n  onActiveTemplateChange,\n  loading = false,\n  classes: customMuiStyles = DEFAULT_TEMPLATE_POPOVER_CLASSES,\n  // custome slot\n  hasNameSlot = false,\n  renderSlot,\n  readOnly = false,\n  hideDefaultTemplates = false,\n}) {\n  const classes = useTemplatePopoverStyles();\n  const [allTemplates, setAllTemplates] = useState(templates);\n  const [templateToShare, setTemplateToShare] = useState(null);\n  const [error, setError] = useState({});\n  useEffect(() => {\n    setAllTemplates(templates);\n  }, [templates]);\n\n  // NOTE: Group template by type\n  const groupedTemplates = useMemo(() => {\n    const groups = [\n      {\n        type: TEMPLATE_TYPES.USER,\n        templatesList: getUserTemplates(allTemplates),\n      },\n    ];\n    if (!hideDefaultTemplates)\n      groups.push({\n        type: TEMPLATE_TYPES.DEFAULT,\n        templatesList: getDefaultTemplates(allTemplates),\n      });\n    if (!readOnly)\n      groups.push({\n        type: TEMPLATE_TYPES.SHARED,\n        templatesList: getSharedTemplates(allTemplates),\n      });\n    return groups;\n  }, [allTemplates, readOnly, hideDefaultTemplates]);\n\n  const handleClickTemplate = nextActiveTemplateId => () => {\n    onActiveTemplateChange(nextActiveTemplateId);\n  };\n\n  const handleChange = (templateId, callback) => e => {\n    e.stopPropagation();\n    if (!readOnly) callback(templateId);\n  };\n\n  // NOTE: Handlers for template name change\n  const handleTemplateNameEdit = templateId => e => {\n    e.stopPropagation();\n    setAllTemplates(\n      allTemplates.map(item =>\n        item.id === templateId ? { ...item, isEditing: true, prevName: item.name } : item\n      )\n    );\n  };\n  const handleTemplateNameChange = templateId => e => {\n    e.stopPropagation();\n\n    const allTemplateNames = allTemplates\n      .filter(template => template.id !== templateId)\n      .map(template => template.name);\n    if (allTemplateNames.includes(e.target.value)) {\n      setError({\n        ...error,\n        [templateId]: DUPLICATED_NAME_ERROR_MESSAGE,\n      });\n    } else {\n      setError({\n        ...error,\n        [templateId]: null,\n      });\n    }\n\n    setAllTemplates(\n      allTemplates.map(item => (item.id === templateId ? { ...item, name: e.target.value } : item))\n    );\n  };\n  const handleTemplateNameEditApply = templateId => e => {\n    e.stopPropagation();\n    setAllTemplates(\n      allTemplates.map(item => (item.id === templateId ? { ...item, isEditing: false } : item))\n    );\n    const currentTemplate = allTemplates.find(template => template.id === templateId);\n    onTemplateEdit(omit(currentTemplate, ['prevName', 'isEditing']));\n  };\n  const handleTemplateNameEditCancel = templateId => e => {\n    e.stopPropagation();\n    setAllTemplates(\n      allTemplates.map(item =>\n        item.id === templateId ? { ...item, name: item.prevName, isEditing: false } : item\n      )\n    );\n  };\n  const handleKeyDown = templateId => e => {\n    if (e.key === 'Enter') {\n      setAllTemplates(\n        allTemplates.map(item => (item.id === templateId ? { ...item, isEditing: false } : item))\n      );\n      const currentTemplate = allTemplates.find(template => template.id === templateId);\n      onTemplateEdit(omit(currentTemplate, ['prevName', 'isEditing']));\n    }\n  };\n\n  // NOTE: Handlers for template sharing\n  const handleTemplateSharingDialogOpen = templateId => e => {\n    e.stopPropagation();\n    const currentTemplate = allTemplates.find(item => item.id === templateId);\n    setTemplateToShare(currentTemplate);\n  };\n  const handleTemplateSharingDialogClose = () => {\n    setTemplateToShare(null);\n  };\n  const handleTemplateSharingSave = usersToShare => {\n    if (templateToShare) {\n      onTemplateShare(templateToShare.id, usersToShare);\n    }\n    handleTemplateSharingDialogClose();\n  };\n\n  return (\n    <Popover\n      id=\"app-settings-template-popper\"\n      classes={{\n        paper: classnames(classes.paper, customMuiStyles.paper),\n      }}\n      open={open}\n      anchorEl={anchorEl}\n      onClose={onClose}\n      anchorOrigin={anchorOrigin}\n      transformOrigin={transformOrigin}\n    >\n      <div className={classes.paperWrapper}>\n        <div className={classes.titleWrapper}>\n          <Typography className={classes.title}>Templates</Typography>\n          {loading && <CircularProgress size={16} />}\n        </div>\n\n        <div\n          className={classnames(classes.selectedGroup, {\n            [classes.selectedGroupSelected]: activeTemplateId === NO_TEMPLATE_SELECTED_ID,\n            [classes.selectedGroupUnSelected]: activeTemplateId !== NO_TEMPLATE_SELECTED_ID,\n          })}\n          onClick={handleClickTemplate(NO_TEMPLATE_SELECTED_ID)}\n        >\n          <div className={classes.noTemplateItem}>\n            {activeTemplateId === NO_TEMPLATE_SELECTED_ID ? (\n              <CheckIcon fontSize=\"small\" className={classes.selectedIcon} />\n            ) : (\n              <LayersClearIcon fontSize=\"small\" className={classes.selectedIcon} />\n            )}\n            <div className={classes.selectedLabel}>No Template Selected</div>\n          </div>\n        </div>\n\n        {groupedTemplates.map(({ type, templatesList }) => (\n          <Fragment key={`template-list-${type}`}>\n            <div className={classes.templateHeader}>\n              <Typography className={classes.subtitle}>{TEMPLATE_LABELS[type]}</Typography>\n              {type === TEMPLATE_TYPES.USER && !readOnly && (\n                <Tooltip title=\"Create Template\" placement=\"right\">\n                  <AddCircleIcon\n                    fontSize=\"small\"\n                    color=\"primary\"\n                    className={classes.addNewTemplateIcon}\n                    onClick={onAddNewTemplate}\n                  />\n                </Tooltip>\n              )}\n            </div>\n\n            {templatesList.length === 0 ? (\n              <Typography className={classes.noTemplateLabel}>{NO_TEMPLATE_MSG[type]}</Typography>\n            ) : (\n              <List className={classes.templateList}>\n                {templatesList.map(template => (\n                  <Tooltip\n                    key={`template-list-item-${template.id}`}\n                    title={template.disabled ? template.tooltipTitle : ''}\n                  >\n                    <ListItem\n                      className={classnames(classes.templateListItem, {\n                        [classes.templateListItemSelected]: template.id === activeTemplateId,\n                        [classes.templateListItemUnSelected]: template.id !== activeTemplateId,\n                      })}\n                      onClick={template.disabled ? null : handleClickTemplate(template.id)}\n                      disabled={template.disabled ?? false}\n                    >\n                      {template.id === activeTemplateId ? (\n                        <CheckIcon\n                          fontSize=\"small\"\n                          {...(template.isEditing && { color: 'primary' })}\n                        />\n                      ) : (\n                        <LayersIcon\n                          fontSize=\"small\"\n                          {...(template.isEditing && { color: 'primary' })}\n                        />\n                      )}\n\n                      {template.isEditing ? (\n                        <TextField\n                          autoFocus\n                          className={classes.templateListItemInput}\n                          value={template.name}\n                          onClick={e => e.stopPropagation()}\n                          onChange={handleTemplateNameChange(template.id)}\n                          onKeyDown={handleKeyDown(template.id)}\n                          error={!!error[template.id]}\n                          helperText={error[template.id]}\n                        />\n                      ) : (\n                        <Typography className={classes.templateListItemName}>\n                          {template.name}\n                        </Typography>\n                      )}\n\n                      {!template.isEditing\n                        ? hasNameSlot && renderSlot(get(template, ['settings', 'data'], []))\n                        : null}\n\n                      {template.isEditing ? (\n                        <div\n                          className={classnames(\n                            classes.actionWrapper,\n                            classes.actionWrapperEditing\n                          )}\n                        >\n                          <Tooltip title=\"Save\">\n                            <IconButton\n                              className={classes.actionIconButton}\n                              onClick={handleTemplateNameEditApply(template.id)}\n                            >\n                              <CheckIcon fontSize=\"small\" color=\"primary\" />\n                            </IconButton>\n                          </Tooltip>\n\n                          <Tooltip title=\"Cancel\">\n                            <IconButton\n                              className={classes.actionIconButton}\n                              onClick={handleTemplateNameEditCancel(template.id)}\n                            >\n                              <CloseIcon className={classes.actionIcon} fontSize=\"small\" />\n                            </IconButton>\n                          </Tooltip>\n                        </div>\n                      ) : (\n                        <div\n                          className={classnames(classes.actionWrapper, {\n                            [classes.actionWrapperHidden]: template.disabled || readOnly,\n                          })}\n                        >\n                          {type === TEMPLATE_TYPES.USER ? (\n                            <>\n                              <Tooltip title=\"Delete\">\n                                <IconButton\n                                  className={classes.actionIconButton}\n                                  onClick={handleChange(template.id, onTemplateDelete)}\n                                >\n                                  <DeleteIcon className={classes.actionIcon} fontSize=\"small\" />\n                                </IconButton>\n                              </Tooltip>\n\n                              <Tooltip title=\"Rename\">\n                                <IconButton\n                                  className={classes.actionIconButton}\n                                  onClick={handleTemplateNameEdit(template.id)}\n                                >\n                                  <EditIcon className={classes.actionIcon} fontSize=\"small\" />\n                                </IconButton>\n                              </Tooltip>\n\n                              <Tooltip title=\"Copy\">\n                                <IconButton\n                                  className={classes.actionIconButton}\n                                  onClick={handleChange(template.id, onTemplateCopy)}\n                                >\n                                  <CopyIcon className={classes.actionIcon} fontSize=\"small\" />\n                                </IconButton>\n                              </Tooltip>\n\n                              <Tooltip title=\"Share\">\n                                <IconButton\n                                  className={classes.actionIconButton}\n                                  onClick={handleTemplateSharingDialogOpen(template.id)}\n                                >\n                                  <ShareIcon className={classes.actionIcon} fontSize=\"small\" />\n                                </IconButton>\n                              </Tooltip>\n                            </>\n                          ) : (\n                            <Tooltip title=\"Copy To My Templates\">\n                              <IconButton\n                                className={classes.actionIconButton}\n                                onClick={handleChange(template.id, onTemplateCopy)}\n                              >\n                                <CopyIcon className={classes.actionIcon} fontSize=\"small\" />\n                              </IconButton>\n                            </Tooltip>\n                          )}\n                        </div>\n                      )}\n                    </ListItem>\n                  </Tooltip>\n                ))}\n              </List>\n            )}\n          </Fragment>\n        ))}\n      </div>\n\n      <TemplateSharingDialog\n        title={`Share \"${get(templateToShare, 'name')}\"`}\n        open={!!templateToShare}\n        onSave={handleTemplateSharingSave}\n        onCancel={handleTemplateSharingDialogClose}\n        currentUser={currentUser}\n      />\n    </Popover>\n  );\n}\n\nTemplatePopover.propTypes = {\n  open: PropTypes.bool.isRequired,\n  anchorEl: PropTypes.node,\n  anchorOrigin: PropTypes.shape({}),\n  transformOrigin: PropTypes.shape({}),\n  onClose: PropTypes.func.isRequired,\n  templates: PropTypes.arrayOf(\n    PropTypes.shape({\n      id: PropTypes.number,\n      name: PropTypes.string,\n      settings: PropTypes.shape({}),\n      shared: PropTypes.bool,\n    })\n  ).isRequired,\n  activeTemplateId: PropTypes.number.isRequired,\n  getDefaultTemplates: PropTypes.func.isRequired, // Needs to be pure function\n  getUserTemplates: PropTypes.func.isRequired, // Needs to be pure function\n  getSharedTemplates: PropTypes.func.isRequired, // Needs to be pure function\n  onAddNewTemplate: PropTypes.func.isRequired, // () => {}\n  onTemplateDelete: PropTypes.func.isRequired, // templateId => {}\n  onTemplateCopy: PropTypes.func.isRequired, // templateId => {}\n  onTemplateEdit: PropTypes.func.isRequired, // newTemplate => {}\n  onTemplateShare: PropTypes.func.isRequired, // (templateId, users) => {}\n  onActiveTemplateChange: PropTypes.func.isRequired, // templateId => {}\n  loading: PropTypes.bool, // Template loading status\n\n  // Customize styles\n  classes: PropTypes.shape({\n    paper: PropTypes.string,\n  }),\n  hasNameSlot: PropTypes.bool,\n  renderSlot: PropTypes.func.isRequired,\n  currentUser: PropTypes.shape({}).isRequired,\n  readOnly: PropTypes.bool,\n  hideDefaultTemplates: PropTypes.bool,\n};\n\nconst DEFAULT_TEMPLATE_POPOVER_CLASSES = {};\nconst DEFAULT_TEMPLATE_POPOVER_ANCHOR_ORIGIN = {};\nconst DEFAULT_TEMPLATE_POPOVER_TRANSFORM_ORIGIN = {};\n\nexport default TemplatePopover;\n"],"names":["TEMPLATE_TYPES","NO_TEMPLATE_MSG","_NO_TEMPLATE_MSG","TEMPLATE_LABELS","_TEMPLATE_LABELS","TemplatePopover","_ref","_classnames","currentUser","open","_ref$anchorEl","anchorEl","_ref$anchorOrigin","anchorOrigin","DEFAULT_TEMPLATE_POPOVER_ANCHOR_ORIGIN","_ref$transformOrigin","transformOrigin","DEFAULT_TEMPLATE_POPOVER_TRANSFORM_ORIGIN","onClose","templates","activeTemplateId","getDefaultTemplates","getUserTemplates","getSharedTemplates","onAddNewTemplate","onTemplateDelete","onTemplateCopy","onTemplateEdit","onTemplateShare","onActiveTemplateChange","_ref$loading","loading","_ref$classes","classes","customMuiStyles","DEFAULT_TEMPLATE_POPOVER_CLASSES","_ref$hasNameSlot","hasNameSlot","renderSlot","_ref$readOnly","readOnly","_ref$hideDefaultTempl","hideDefaultTemplates","useTemplatePopoverStyles","useState","_useState2","_slicedToArray","_useState","allTemplates","setAllTemplates","_useState4","_useState3","templateToShare","setTemplateToShare","_useState5","_useState6","error","setError","useEffect","groupedTemplates","useMemo","groups","type","templatesList","push","handleClickTemplate","nextActiveTemplateId","handleChange","templateId","callback","e","stopPropagation","handleTemplateNameEdit","map","item","id","isEditing","prevName","name","handleTemplateNameEditApply","currentTemplate","find","template","omit","handleTemplateNameEditCancel","handleKeyDown","key","handleTemplateSharingDialogOpen","handleTemplateSharingDialogClose","_jsxs","Popover","paper","classnames","children","jsxs","className","paperWrapper","titleWrapper","_jsx","Typography","title","jsx","CircularProgress","size","selectedGroup","_defineProperty","selectedGroupSelected","selectedGroupUnSelected","onClick","noTemplateItem","CheckIcon","fontSize","selectedIcon","LayersClearIcon","selectedLabel","_ref2","Fragment","templateHeader","subtitle","Tooltip","placement","AddCircleIcon","color","addNewTemplateIcon","length","noTemplateLabel","List","templateList","_classnames2","_template$disabled","disabled","tooltipTitle","ListItem","templateListItem","templateListItemSelected","templateListItemUnSelected","_objectSpread","LayersIcon","TextField","autoFocus","templateListItemInput","value","onChange","filter","includes","target","onKeyDown","helperText","templateListItemName","get","actionWrapper","actionWrapperEditing","IconButton","actionIconButton","CloseIcon","actionIcon","actionWrapperHidden","_Fragment","DeleteIcon","EditIcon","CopyIcon","ShareIcon","concat","TemplateSharingDialog","onSave","usersToShare","onCancel","propTypes","PropTypes","bool","isRequired","node","shape","func","arrayOf","number","string","settings","shared"],"mappings":"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"}

package/cjs-bundle/components/VirtualizedTable/VirtualizedTable.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/toConsumableArray"),t=require("@babel/runtime/helpers/defineProperty"),r=require("react"),n=require("classnames"),i=require("react-window"),o=require("@material-ui/core"),a=require("@material-ui/icons"),l=require("../../utils/convert.js"),u=require("react/jsx-runtime");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=s(e),d=s(t),f=s(n);function m(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function h(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?m(Object(r),!0).forEach((function(t){d.default(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):m(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var p="ASC",y=p,b=o.makeStyles((function(e){var t={borderBottom:e.isLightTheme?"1px solid rgba(224, 224, 224, 1)":"1px solid rgba(81, 81, 81, 1)",display:"flex",flexFlow:"row nowrap",alignItems:"center"},r={minWidth:1,marginRight:10,"&:first-child":{marginLeft:10}};return{root:{display:"flex",overflow:"auto",flexFlow:"column nowrap"},row:t,cell:r,header:t,headerCell:h(h({},r),{},{display:"flex",alignItems:"center"}),sortable:{cursor:"pointer"},oddRow:{backgroundColor:e.isLightTheme?"rgba(189, 189, 189, 0.1)":"#303030"},headerLabel:{lineHeight:"14px",fontSize:"12px",fontStyle:"normal",letterSpacing:"-0.25px",display:"flex",alignItems:"center",flexWrap:"wrap"},cellData:{lineHeight:"14px",fontSize:"12px",fontWeight:"normal",fontStyle:"normal",letterSpacing:"0.15px"},unitLabel:{fontSize:"10px",opacity:.5},settingIcon:{padding:"3px",fontSize:"20px"},sortIcon:{fontSize:"16px"}}}));function x(e,t){var r=e.find((function(e){return e.key===t}))||{},n=r.unitType,i=r.customUnit;return i?"(".concat(i,")"):n?"(".concat(l.getUnitDisplay(n),")"):""}function g(e,t){return(e.find((function(e){return e.key===t}))||{}).headerLabelClassName||""}function w(e,t){return(e.find((function(e){return e.key===t}))||{}).headerLabelUnitClassName||""}var v=function(e){var t=e.columns,n=e.data,l=e.useColumnSetting,s=e.useFixedColumnWidth,m=e.onOpenSettingDlg,v=e.width,j=e.height,S=e.headerHeight,_=e.rowHeight,C=e.showTopSettingIcon,k=e.customMuiStyles,z=e.isTopSettingIconShownAlways,O=e.CustomCellRenderer,N=e.CustomHeaderCellRenderer,D=e.customRowStyle,T=e.sort,R=e.sortBy,I=e.sortDirection,M=e.onScroll,P=void 0===M?function(){}:M,L=b(),q=r.useMemo((function(){return h(h({},L),k)}),[L,k]),V=r.useMemo((function(){return{label:"",key:"setting",width:l?25:0}}),[l]),A=r.useMemo((function(){return t.filter((function(e){return e.show}))}),[t]),H=r.useMemo((function(){return l?[].concat(c.default(A),[V]):A}),[A,l,V]),E=r.useMemo((function(){if(v<=0)return{};var e=d.default({},V.key,V.width),t=[];return A.filter((function(e){return Number.isFinite(e.width)})).forEach((function(r){e[r.key]=r.width-1,t.push(r.width-1)})),A.filter((function(e){return!Number.isFinite(e.width)})).forEach((function(r){var n=t.reduce((function(e,t){return e+t}),0),i=Math.floor((v-n-V.width)/(A.length-t.length)),o=r.minWidth||65,a=i<o?o:i;e[r.key]=a-1,t.push(a-1)})),e}),[v,A,V]),B=r.useMemo((function(){return Object.values(E).reduce((function(e,t){return e+t}),0)}),[E]),F=z||B-12.5>=v;r.useEffect((function(){C(F)}),[F]);var W=r.useCallback((function(e){var t=e.index;return f.default(d.default({},q.oddRow,t%2==1))}),[q]),K=function(e){var r=e.label,n=e.dataKey,i=R||I||T;return N?u.jsx(N,{columnKey:n,columns:t,sortBy:R,sortDirection:I}):n===V.key?F?null:u.jsx(o.IconButton,{size:"small","aria-label":"customize columns",className:q.settingIcon,onClick:m,children:u.jsx(a.Settings,{fontSize:"inherit"})}):u.jsxs(o.Typography,{variant:"body2",className:f.default(q.headerLabel,g(t,n)),children:[r," ",u.jsx("span",{className:f.default(q.unitLabel,w(t,n)),children:x(t,n)}),i&&n!==R&&u.jsx(o.Tooltip,{title:"Sort A-Z",children:u.jsx(a.Sort,{fontSize:"small",className:L.sortIcon})}),i&&n===R&&(I===p?u.jsx(a.ArrowUpward,{fontSize:"small",className:L.sortIcon}):u.jsx(a.ArrowDownward,{fontSize:"small",className:L.sortIcon}))]})},U=r.useCallback((function(e){var r=e.ariaAttributes,n=e.style,i=e.data,a=e.tableColumns,l=e.index;return u.jsx("div",h(h({style:h(h({},n),null==D?void 0:D({index:l})),className:f.default(W({index:l}),L.row,"ReactVirtualized__Table__row")},r),{},{children:a.map((function(e){var r=e.key,n=i[l],a=O?u.jsx(O,{columnKey:r,value:n[r],rowData:n,columns:t}):u.jsx(o.Typography,{variant:"body2",className:q.cellData,children:n[r]});return u.jsx("div",{className:f.default(L.cell,"ReactVirtualized__Table__rowColumn"),style:{flex:"0 1 ".concat(E[r],"px"),overflow:"hidden"},children:a},r)}))}))}),[O,W,E,D,L,q.cellData,t]),G=r.useMemo((function(){return{width:s?B:v,height:j}}),[s,B,v,j]),Z=r.useMemo((function(){return{data:n,tableColumns:H}}),[n,H]),J=r.useCallback((function(e){return function(t){null==T||T({defaultSortDirection:y,event:t,sortBy:e,sortDirection:e!==R||I&&I!==y?y:"DESC"})}}),[T,R,I]),Q=R||I||T;return u.jsxs("div",{style:G,className:f.default(q.root,q.table,"ReactVirtualized__Table"),children:[u.jsx("div",{className:f.default(q.header,"ReactVirtualized__Table__headerRow"),style:{flex:"0 0 ".concat(S,"px")},children:H.map((function(e){return u.jsx("div",{className:f.default(q.headerCell,"setting"!==e.key&&T&&q.sortable,"ReactVirtualized__Table__headerColumn",Q&&"ReactVirtualized__Table__sortableHeaderColumn"),style:{flex:"0 1 ".concat(E[e.key],"px"),height:S},onClick:"setting"!==e.key?J(e.key):void 0,children:K({label:e.label,dataKey:e.key})},e.key)}))}),u.jsx(i.List,{rowProps:Z,rowCount:n.length,rowHeight:_,rowComponent:U,onScroll:P,className:"ReactVirtualized__Grid ReactVirtualized__Table__Grid"})]})};exports.VirtualizedTableComponent=v,exports.default=v;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/toConsumableArray"),t=require("@babel/runtime/helpers/defineProperty"),r=require("react"),n=require("classnames"),i=require("react-window"),a=require("@material-ui/core"),o=require("@material-ui/icons/ArrowDownward"),l=require("@material-ui/icons/ArrowUpward"),u=require("@material-ui/icons/Settings"),s=require("@material-ui/icons/Sort"),c=require("../../utils/convert.js"),d=require("react/jsx-runtime");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=f(e),h=f(t),p=f(n),y=f(o),b=f(l),x=f(u),g=f(s);function w(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function v(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?w(Object(r),!0).forEach((function(t){h.default(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):w(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var j="ASC",S=j,_=a.makeStyles((function(e){var t={borderBottom:e.isLightTheme?"1px solid rgba(224, 224, 224, 1)":"1px solid rgba(81, 81, 81, 1)",display:"flex",flexFlow:"row nowrap",alignItems:"center"},r={minWidth:1,marginRight:10,"&:first-child":{marginLeft:10}};return{root:{display:"flex",overflow:"auto",flexFlow:"column nowrap"},row:t,cell:r,header:t,headerCell:v(v({},r),{},{display:"flex",alignItems:"center"}),sortable:{cursor:"pointer"},oddRow:{backgroundColor:e.isLightTheme?"rgba(189, 189, 189, 0.1)":"#303030"},headerLabel:{lineHeight:"14px",fontSize:"12px",fontStyle:"normal",letterSpacing:"-0.25px",display:"flex",alignItems:"center",flexWrap:"wrap"},cellData:{lineHeight:"14px",fontSize:"12px",fontWeight:"normal",fontStyle:"normal",letterSpacing:"0.15px"},unitLabel:{fontSize:"10px",opacity:.5},settingIcon:{padding:"3px",fontSize:"20px"},sortIcon:{fontSize:"16px"}}}));function C(e,t){var r=e.find((function(e){return e.key===t}))||{},n=r.unitType,i=r.customUnit;return i?"(".concat(i,")"):n?"(".concat(c.getUnitDisplay(n),")"):""}function k(e,t){return(e.find((function(e){return e.key===t}))||{}).headerLabelClassName||""}function z(e,t){return(e.find((function(e){return e.key===t}))||{}).headerLabelUnitClassName||""}var O=function(e){var t=e.columns,n=e.data,o=e.useColumnSetting,l=e.useFixedColumnWidth,u=e.onOpenSettingDlg,s=e.width,c=e.height,f=e.headerHeight,w=e.rowHeight,O=e.showTopSettingIcon,N=e.customMuiStyles,D=e.isTopSettingIconShownAlways,T=e.CustomCellRenderer,R=e.CustomHeaderCellRenderer,q=e.customRowStyle,I=e.sort,M=e.sortBy,P=e.sortDirection,L=e.onScroll,V=void 0===L?function(){}:L,A=_(),H=r.useMemo((function(){return v(v({},A),N)}),[A,N]),E=r.useMemo((function(){return{label:"",key:"setting",width:o?25:0}}),[o]),B=r.useMemo((function(){return t.filter((function(e){return e.show}))}),[t]),F=r.useMemo((function(){return o?[].concat(m.default(B),[E]):B}),[B,o,E]),W=r.useMemo((function(){if(s<=0)return{};var e=h.default({},E.key,E.width),t=[];return B.filter((function(e){return Number.isFinite(e.width)})).forEach((function(r){e[r.key]=r.width-1,t.push(r.width-1)})),B.filter((function(e){return!Number.isFinite(e.width)})).forEach((function(r){var n=t.reduce((function(e,t){return e+t}),0),i=Math.floor((s-n-E.width)/(B.length-t.length)),a=r.minWidth||65,o=i<a?a:i;e[r.key]=o-1,t.push(o-1)})),e}),[s,B,E]),K=r.useMemo((function(){return Object.values(W).reduce((function(e,t){return e+t}),0)}),[W]),U=D||K-12.5>=s;r.useEffect((function(){O(U)}),[U]);var G=r.useCallback((function(e){var t=e.index;return p.default(h.default({},H.oddRow,t%2==1))}),[H]),Z=function(e){var r=e.label,n=e.dataKey,i=M||P||I;return R?d.jsx(R,{columnKey:n,columns:t,sortBy:M,sortDirection:P}):n===E.key?U?null:d.jsx(a.IconButton,{size:"small","aria-label":"customize columns",className:H.settingIcon,onClick:u,children:d.jsx(x.default,{fontSize:"inherit"})}):d.jsxs(a.Typography,{variant:"body2",className:p.default(H.headerLabel,k(t,n)),children:[r," ",d.jsx("span",{className:p.default(H.unitLabel,z(t,n)),children:C(t,n)}),i&&n!==M&&d.jsx(a.Tooltip,{title:"Sort A-Z",children:d.jsx(g.default,{fontSize:"small",className:A.sortIcon})}),i&&n===M&&(P===j?d.jsx(b.default,{fontSize:"small",className:A.sortIcon}):d.jsx(y.default,{fontSize:"small",className:A.sortIcon}))]})},J=r.useCallback((function(e){var r=e.ariaAttributes,n=e.style,i=e.data,o=e.tableColumns,l=e.index;return d.jsx("div",v(v({style:v(v({},n),null==q?void 0:q({index:l})),className:p.default(G({index:l}),A.row,"ReactVirtualized__Table__row")},r),{},{children:o.map((function(e){var r=e.key,n=i[l],o=T?d.jsx(T,{columnKey:r,value:n[r],rowData:n,columns:t}):d.jsx(a.Typography,{variant:"body2",className:H.cellData,children:n[r]});return d.jsx("div",{className:p.default(A.cell,"ReactVirtualized__Table__rowColumn"),style:{flex:"0 1 ".concat(W[r],"px"),overflow:"hidden"},children:o},r)}))}))}),[T,G,W,q,A,H.cellData,t]),Q=r.useMemo((function(){return{width:l?K:s,height:c}}),[l,K,s,c]),X=r.useMemo((function(){return{data:n,tableColumns:F}}),[n,F]),Y=r.useCallback((function(e){return function(t){null==I||I({defaultSortDirection:S,event:t,sortBy:e,sortDirection:e!==M||P&&P!==S?S:"DESC"})}}),[I,M,P]),$=M||P||I;return d.jsxs("div",{style:Q,className:p.default(H.root,H.table,"ReactVirtualized__Table"),children:[d.jsx("div",{className:p.default(H.header,"ReactVirtualized__Table__headerRow"),style:{flex:"0 0 ".concat(f,"px")},children:F.map((function(e){return d.jsx("div",{className:p.default(H.headerCell,"setting"!==e.key&&I&&H.sortable,"ReactVirtualized__Table__headerColumn",$&&"ReactVirtualized__Table__sortableHeaderColumn"),style:{flex:"0 1 ".concat(W[e.key],"px"),height:f},onClick:"setting"!==e.key?Y(e.key):void 0,children:Z({label:e.label,dataKey:e.key})},e.key)}))}),d.jsx(i.List,{rowProps:X,rowCount:n.length,rowHeight:w,rowComponent:J,onScroll:V,className:"ReactVirtualized__Grid ReactVirtualized__Table__Grid"})]})};exports.VirtualizedTableComponent=O,exports.default=O;
 //# sourceMappingURL=VirtualizedTable.js.map

package/cjs-bundle/components/VirtualizedTable/VirtualizedTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"VirtualizedTable.js","sources":["../../../../src/components/VirtualizedTable/VirtualizedTable.tsx"],"sourcesContent":["import { FC, MouseEventHandler, ReactNode, useCallback, useEffect, useMemo } from 'react';\nimport classNames from 'classnames';\nimport { List, RowComponentProps } from 'react-window';\nimport { IconButton, makeStyles, Tooltip, Typography } from '@material-ui/core';\nimport {\n  ArrowDownward as ArrowDownwardIcon,\n  ArrowUpward as ArrowUpwardIcon,\n  Settings as SettingsIcon,\n  Sort as SortIcon,\n} from '@material-ui/icons';\n\nimport { getUnitDisplay } from '../../utils/convert';\n\nimport { VirtualizedTableProps } from './index';\n\nconst SortDirection = {\n  ASC: 'ASC',\n  DESC: 'DESC',\n};\n\nconst DEFAULT_COLUMN_MIN_WIDTH = 65;\n\nconst defaultSortDirection = SortDirection.ASC;\n\nconst useStyles = makeStyles(theme => {\n  const rowStyles = {\n    borderBottom: (theme as any).isLightTheme\n      ? '1px solid rgba(224, 224, 224, 1)'\n      : '1px solid rgba(81, 81, 81, 1)',\n    display: 'flex',\n    flexFlow: 'row nowrap',\n    alignItems: 'center',\n  };\n\n  const cellStyles = {\n    minWidth: 1,\n    marginRight: 10,\n\n    '&:first-child': {\n      marginLeft: 10,\n    },\n  };\n\n  return {\n    root: {\n      display: 'flex',\n      overflow: 'auto',\n      flexFlow: 'column nowrap',\n    },\n    row: rowStyles,\n    cell: cellStyles,\n    header: rowStyles,\n    headerCell: {\n      ...cellStyles,\n      display: 'flex',\n      alignItems: 'center',\n    },\n    sortable: {\n      cursor: 'pointer',\n    },\n    oddRow: {\n      backgroundColor: (theme as any).isLightTheme ? 'rgba(189, 189, 189, 0.1)' : '#303030',\n    },\n    headerLabel: {\n      lineHeight: '14px',\n      fontSize: '12px',\n      fontStyle: 'normal',\n      letterSpacing: '-0.25px',\n      display: 'flex',\n      alignItems: 'center',\n      flexWrap: 'wrap',\n    },\n    cellData: {\n      lineHeight: '14px',\n      fontSize: '12px',\n      fontWeight: 'normal',\n      fontStyle: 'normal',\n      letterSpacing: '0.15px',\n    },\n    unitLabel: {\n      fontSize: '10px',\n      opacity: 0.5,\n    },\n    settingIcon: {\n      padding: '3px',\n      fontSize: '20px',\n    },\n    sortIcon: {\n      fontSize: '16px',\n    },\n  } as any;\n});\n\nfunction getUnitText(columns: NonNullable<VirtualizedTableProps['columns']>, dataKey: string) {\n  const { unitType, customUnit } = columns.find(column => column.key === dataKey) || {};\n  if (customUnit) {\n    return `(${customUnit})`;\n  }\n\n  if (unitType) {\n    return `(${getUnitDisplay(unitType)})`;\n  }\n\n  return '';\n}\n\nfunction getHeaderLabelClassName(\n  columns: NonNullable<VirtualizedTableProps['columns']>,\n  dataKey: string\n) {\n  const { headerLabelClassName } = columns.find(column => column.key === dataKey) || {};\n  return headerLabelClassName || '';\n}\n\nfunction getHeaderLabelUnitClassName(\n  columns: NonNullable<VirtualizedTableProps['columns']>,\n  dataKey: string\n) {\n  const { headerLabelUnitClassName } = columns.find(column => column.key === dataKey) || {};\n  return headerLabelUnitClassName || '';\n}\n\nconst SETTING_COLUMN_WIDTH = 25;\nconst SETTING_COLUMN_KEY = 'setting';\n\ntype VirtualizedTableComponentProps = Omit<\n  VirtualizedTableProps,\n  'savedColumns' | 'onChangeColumns'\n> & {\n  columns: NonNullable<VirtualizedTableProps['columns']>;\n  data: NonNullable<VirtualizedTableProps['data']>;\n  headerHeight: NonNullable<VirtualizedTableProps['headerHeight']>;\n  rowHeight: NonNullable<VirtualizedTableProps['rowHeight']>;\n  width: number;\n  height: number;\n  onOpenSettingDlg: MouseEventHandler;\n  showTopSettingIcon: (show: boolean) => void;\n};\n\nexport const VirtualizedTableComponent: FC<VirtualizedTableComponentProps> = ({\n  columns,\n  data,\n  useColumnSetting,\n  useFixedColumnWidth,\n  onOpenSettingDlg,\n  width,\n  height,\n  headerHeight,\n  rowHeight,\n  showTopSettingIcon,\n  customMuiStyles,\n  isTopSettingIconShownAlways,\n  CustomCellRenderer,\n  CustomHeaderCellRenderer,\n  customRowStyle,\n  sort,\n  sortBy,\n  sortDirection,\n  onScroll = () => undefined,\n}) => {\n  const classes = useStyles() as Record<string, string>;\n  const appliedClasses = useMemo<Record<string, string>>(\n    () => ({ ...classes, ...customMuiStyles }),\n    [classes, customMuiStyles]\n  );\n  const settingColumn = useMemo(() => {\n    return {\n      label: '',\n      key: SETTING_COLUMN_KEY,\n      width: useColumnSetting ? SETTING_COLUMN_WIDTH : 0,\n    };\n  }, [useColumnSetting]);\n\n  const visibleColumns = useMemo(() => {\n    return columns.filter(column => column.show);\n  }, [columns]);\n\n  // NOTE: Add setting column\n  const tableColumns = useMemo(() => {\n    return useColumnSetting ? [...visibleColumns, settingColumn] : visibleColumns;\n  }, [visibleColumns, useColumnSetting, settingColumn]);\n\n  const columnWidthDict = useMemo(() => {\n    if (width <= 0) {\n      return {};\n    }\n\n    // NOTE: Reserve space for setting column\n    const result = {\n      [settingColumn.key]: settingColumn.width,\n    };\n\n    // NOTE: Keep the columns that had been adjusted due to expected width is smaller than min width\n    const adjustedColumns: number[] = [];\n\n    // NOTE: Give fixed width to the columns with \"width\" field\n    visibleColumns\n      .filter(column => Number.isFinite(column.width))\n      .forEach(column => {\n        result[column.key] = column.width - 1;\n        adjustedColumns.push(column.width - 1);\n      });\n\n    visibleColumns\n      .filter(column => !Number.isFinite(column.width))\n      .forEach(column => {\n        // NOTE: Width sum of adjusted columns\n        const sumOfAdjustColumnWidth = adjustedColumns.reduce(\n          (subResult, columnWidth) => subResult + columnWidth,\n          0\n        );\n        // NOTE: Expected space for the column\n        const calculatedWidth = Math.floor(\n          (width - sumOfAdjustColumnWidth - settingColumn.width) /\n            (visibleColumns.length - adjustedColumns.length)\n        );\n\n        const requiredWidth = column.minWidth || DEFAULT_COLUMN_MIN_WIDTH;\n        const adjustedWidth = calculatedWidth < requiredWidth ? requiredWidth : calculatedWidth;\n        result[column.key] = adjustedWidth - 1;\n        adjustedColumns.push(adjustedWidth - 1);\n      });\n\n    return result;\n  }, [width, visibleColumns, settingColumn]);\n\n  // NOTE: Calculate table width from adjusted columns width\n  const tableWidth = useMemo(() => {\n    return Object.values(columnWidthDict).reduce((result, item) => result + item, 0);\n  }, [columnWidthDict]);\n\n  const isTopSettingIconShown =\n    isTopSettingIconShownAlways || tableWidth - SETTING_COLUMN_WIDTH / 2 >= width;\n\n  useEffect(() => {\n    showTopSettingIcon(isTopSettingIconShown);\n  }, [isTopSettingIconShown]);\n\n  const rowClassName = useCallback(\n    ({ index }: { index: number }) => {\n      return classNames({\n        [appliedClasses.oddRow]: index % 2 === 1,\n      });\n    },\n    [appliedClasses]\n  );\n\n  // NOTE: table header\n  const headerRenderer = (headerData: { label?: ReactNode; dataKey: string }) => {\n    const { label, dataKey } = headerData;\n\n    const isSortable = sortBy || sortDirection || sort;\n\n    if (CustomHeaderCellRenderer) {\n      return (\n        <CustomHeaderCellRenderer\n          columnKey={dataKey}\n          columns={columns}\n          sortBy={sortBy}\n          sortDirection={sortDirection}\n        />\n      );\n    }\n\n    if (dataKey === settingColumn.key) {\n      return !isTopSettingIconShown ? (\n        <IconButton\n          size=\"small\"\n          aria-label=\"customize columns\"\n          className={appliedClasses.settingIcon}\n          onClick={onOpenSettingDlg}\n        >\n          <SettingsIcon fontSize=\"inherit\" />\n        </IconButton>\n      ) : null;\n    }\n    return (\n      <Typography\n        variant=\"body2\"\n        className={classNames(\n          appliedClasses.headerLabel,\n          getHeaderLabelClassName(columns, dataKey)\n        )}\n      >\n        {label}&nbsp;\n        <span\n          className={classNames(\n            appliedClasses.unitLabel,\n            getHeaderLabelUnitClassName(columns, dataKey)\n          )}\n        >\n          {getUnitText(columns, dataKey)}\n        </span>\n        {isSortable && dataKey !== sortBy && (\n          <Tooltip title=\"Sort A-Z\">\n            <SortIcon fontSize=\"small\" className={classes.sortIcon} />\n          </Tooltip>\n        )}\n        {isSortable &&\n          dataKey === sortBy &&\n          (sortDirection === SortDirection.ASC ? (\n            <ArrowUpwardIcon fontSize=\"small\" className={classes.sortIcon} />\n          ) : (\n            <ArrowDownwardIcon fontSize=\"small\" className={classes.sortIcon} />\n          ))}\n      </Typography>\n    );\n  };\n\n  const rowRenderer = useCallback(\n    ({\n      ariaAttributes,\n      style,\n      data,\n      tableColumns,\n      index,\n    }: RowComponentProps<{\n      data: any[];\n      tableColumns: { label: string; key: string; width: number }[];\n    }>) => {\n      return (\n        <div\n          style={{ ...style, ...customRowStyle?.({ index }) }}\n          className={classNames(\n            rowClassName({ index }),\n            classes.row,\n            'ReactVirtualized__Table__row'\n          )}\n          {...ariaAttributes}\n        >\n          {tableColumns.map(column => {\n            const dataKey = column.key;\n            const rowData = data[index];\n\n            const content = CustomCellRenderer ? (\n              <CustomCellRenderer\n                columnKey={dataKey}\n                value={rowData[dataKey]}\n                rowData={rowData}\n                columns={columns}\n              />\n            ) : (\n              <Typography variant=\"body2\" className={appliedClasses.cellData}>\n                {rowData[dataKey]}\n              </Typography>\n            );\n\n            return (\n              <div\n                className={classNames(classes.cell, 'ReactVirtualized__Table__rowColumn')}\n                key={dataKey}\n                style={{ flex: `0 1 ${columnWidthDict[dataKey]}px`, overflow: 'hidden' }}\n              >\n                {content}\n              </div>\n            );\n          })}\n        </div>\n      );\n    },\n    [\n      CustomCellRenderer,\n      rowClassName,\n      columnWidthDict,\n      customRowStyle,\n      classes,\n      appliedClasses.cellData,\n      columns,\n    ]\n  );\n\n  const style = useMemo(\n    () => ({\n      width: useFixedColumnWidth ? tableWidth : width,\n      height,\n    }),\n    [useFixedColumnWidth, tableWidth, width, height]\n  );\n\n  const cellProps = useMemo(\n    () => ({\n      data,\n      tableColumns,\n    }),\n    [data, tableColumns]\n  );\n\n  const onSort = useCallback(\n    (newSortBy: string): MouseEventHandler =>\n      event => {\n        sort?.({\n          defaultSortDirection,\n          event,\n          sortBy: newSortBy,\n          sortDirection:\n            newSortBy === sortBy && (!sortDirection || sortDirection === defaultSortDirection)\n              ? 'DESC'\n              : defaultSortDirection,\n        });\n      },\n    [sort, sortBy, sortDirection]\n  );\n\n  const isSortable = sortBy || sortDirection || sort;\n\n  return (\n    <div\n      style={style}\n      className={classNames(appliedClasses.root, appliedClasses.table, 'ReactVirtualized__Table')}\n    >\n      <div\n        className={classNames(appliedClasses.header, 'ReactVirtualized__Table__headerRow')}\n        style={{ flex: `0 0 ${headerHeight}px` }}\n      >\n        {tableColumns.map(column => (\n          <div\n            key={column.key}\n            className={classNames(\n              appliedClasses.headerCell,\n              column.key !== SETTING_COLUMN_KEY && sort && appliedClasses.sortable,\n              'ReactVirtualized__Table__headerColumn',\n              isSortable && 'ReactVirtualized__Table__sortableHeaderColumn'\n            )}\n            style={{ flex: `0 1 ${columnWidthDict[column.key]}px`, height: headerHeight }}\n            onClick={column.key !== SETTING_COLUMN_KEY ? onSort(column.key) : undefined}\n          >\n            {headerRenderer({\n              label: column.label,\n              dataKey: column.key,\n            })}\n          </div>\n        ))}\n      </div>\n      <List\n        rowProps={cellProps}\n        rowCount={data.length}\n        rowHeight={rowHeight}\n        rowComponent={rowRenderer}\n        onScroll={onScroll}\n        className=\"ReactVirtualized__Grid ReactVirtualized__Table__Grid\"\n      />\n    </div>\n  );\n};\n\nexport default VirtualizedTableComponent;\n"],"names":["SortDirection","defaultSortDirection","useStyles","makeStyles","theme","rowStyles","borderBottom","isLightTheme","display","flexFlow","alignItems","cellStyles","minWidth","marginRight","marginLeft","root","overflow","row","cell","header","headerCell","sortable","cursor","oddRow","backgroundColor","headerLabel","lineHeight","fontSize","fontStyle","letterSpacing","flexWrap","cellData","fontWeight","unitLabel","opacity","settingIcon","padding","sortIcon","getUnitText","columns","dataKey","_ref","find","column","key","unitType","customUnit","concat","getUnitDisplay","getHeaderLabelClassName","headerLabelClassName","getHeaderLabelUnitClassName","headerLabelUnitClassName","VirtualizedTableComponent","_ref4","data","useColumnSetting","useFixedColumnWidth","onOpenSettingDlg","width","height","headerHeight","rowHeight","showTopSettingIcon","customMuiStyles","isTopSettingIconShownAlways","CustomCellRenderer","CustomHeaderCellRenderer","customRowStyle","sort","sortBy","sortDirection","_ref4$onScroll","onScroll","classes","appliedClasses","useMemo","settingColumn","label","visibleColumns","filter","show","tableColumns","columnWidthDict","result","adjustedColumns","Number","isFinite","forEach","push","sumOfAdjustColumnWidth","reduce","subResult","columnWidth","calculatedWidth","Math","floor","length","requiredWidth","adjustedWidth","tableWidth","Object","values","item","isTopSettingIconShown","SETTING_COLUMN_WIDTH","useEffect","rowClassName","useCallback","_ref5","index","classNames","headerRenderer","headerData","isSortable","_jsx","columnKey","jsx","IconButton","size","className","onClick","children","SettingsIcon","_jsxs","Typography","variant","Tooltip","title","SortIcon","ArrowUpwardIcon","ArrowDownwardIcon","rowRenderer","_ref6","ariaAttributes","style","_objectSpread","map","rowData","content","value","flex","cellProps","onSort","newSortBy","event","table","undefined","List","rowProps","rowCount","rowComponent"],"mappings":"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"}
+{"version":3,"file":"VirtualizedTable.js","sources":["../../../../src/components/VirtualizedTable/VirtualizedTable.tsx"],"sourcesContent":["import { FC, MouseEventHandler, ReactNode, useCallback, useEffect, useMemo } from 'react';\nimport classNames from 'classnames';\nimport { List, RowComponentProps } from 'react-window';\nimport { IconButton, makeStyles, Tooltip, Typography } from '@material-ui/core';\nimport ArrowDownwardIcon from '@material-ui/icons/ArrowDownward';\nimport ArrowUpwardIcon from '@material-ui/icons/ArrowUpward';\nimport SettingsIcon from '@material-ui/icons/Settings';\nimport SortIcon from '@material-ui/icons/Sort';\n\nimport { getUnitDisplay } from '../../utils/convert';\n\nimport { VirtualizedTableProps } from './index';\n\nconst SortDirection = {\n  ASC: 'ASC',\n  DESC: 'DESC',\n};\n\nconst DEFAULT_COLUMN_MIN_WIDTH = 65;\n\nconst defaultSortDirection = SortDirection.ASC;\n\nconst useStyles = makeStyles(theme => {\n  const rowStyles = {\n    borderBottom: (theme as any).isLightTheme\n      ? '1px solid rgba(224, 224, 224, 1)'\n      : '1px solid rgba(81, 81, 81, 1)',\n    display: 'flex',\n    flexFlow: 'row nowrap',\n    alignItems: 'center',\n  };\n\n  const cellStyles = {\n    minWidth: 1,\n    marginRight: 10,\n\n    '&:first-child': {\n      marginLeft: 10,\n    },\n  };\n\n  return {\n    root: {\n      display: 'flex',\n      overflow: 'auto',\n      flexFlow: 'column nowrap',\n    },\n    row: rowStyles,\n    cell: cellStyles,\n    header: rowStyles,\n    headerCell: {\n      ...cellStyles,\n      display: 'flex',\n      alignItems: 'center',\n    },\n    sortable: {\n      cursor: 'pointer',\n    },\n    oddRow: {\n      backgroundColor: (theme as any).isLightTheme ? 'rgba(189, 189, 189, 0.1)' : '#303030',\n    },\n    headerLabel: {\n      lineHeight: '14px',\n      fontSize: '12px',\n      fontStyle: 'normal',\n      letterSpacing: '-0.25px',\n      display: 'flex',\n      alignItems: 'center',\n      flexWrap: 'wrap',\n    },\n    cellData: {\n      lineHeight: '14px',\n      fontSize: '12px',\n      fontWeight: 'normal',\n      fontStyle: 'normal',\n      letterSpacing: '0.15px',\n    },\n    unitLabel: {\n      fontSize: '10px',\n      opacity: 0.5,\n    },\n    settingIcon: {\n      padding: '3px',\n      fontSize: '20px',\n    },\n    sortIcon: {\n      fontSize: '16px',\n    },\n  } as any;\n});\n\nfunction getUnitText(columns: NonNullable<VirtualizedTableProps['columns']>, dataKey: string) {\n  const { unitType, customUnit } = columns.find(column => column.key === dataKey) || {};\n  if (customUnit) {\n    return `(${customUnit})`;\n  }\n\n  if (unitType) {\n    return `(${getUnitDisplay(unitType)})`;\n  }\n\n  return '';\n}\n\nfunction getHeaderLabelClassName(\n  columns: NonNullable<VirtualizedTableProps['columns']>,\n  dataKey: string\n) {\n  const { headerLabelClassName } = columns.find(column => column.key === dataKey) || {};\n  return headerLabelClassName || '';\n}\n\nfunction getHeaderLabelUnitClassName(\n  columns: NonNullable<VirtualizedTableProps['columns']>,\n  dataKey: string\n) {\n  const { headerLabelUnitClassName } = columns.find(column => column.key === dataKey) || {};\n  return headerLabelUnitClassName || '';\n}\n\nconst SETTING_COLUMN_WIDTH = 25;\nconst SETTING_COLUMN_KEY = 'setting';\n\ntype VirtualizedTableComponentProps = Omit<\n  VirtualizedTableProps,\n  'savedColumns' | 'onChangeColumns'\n> & {\n  columns: NonNullable<VirtualizedTableProps['columns']>;\n  data: NonNullable<VirtualizedTableProps['data']>;\n  headerHeight: NonNullable<VirtualizedTableProps['headerHeight']>;\n  rowHeight: NonNullable<VirtualizedTableProps['rowHeight']>;\n  width: number;\n  height: number;\n  onOpenSettingDlg: MouseEventHandler;\n  showTopSettingIcon: (show: boolean) => void;\n};\n\nexport const VirtualizedTableComponent: FC<VirtualizedTableComponentProps> = ({\n  columns,\n  data,\n  useColumnSetting,\n  useFixedColumnWidth,\n  onOpenSettingDlg,\n  width,\n  height,\n  headerHeight,\n  rowHeight,\n  showTopSettingIcon,\n  customMuiStyles,\n  isTopSettingIconShownAlways,\n  CustomCellRenderer,\n  CustomHeaderCellRenderer,\n  customRowStyle,\n  sort,\n  sortBy,\n  sortDirection,\n  onScroll = () => undefined,\n}) => {\n  const classes = useStyles() as Record<string, string>;\n  const appliedClasses = useMemo<Record<string, string>>(\n    () => ({ ...classes, ...customMuiStyles }),\n    [classes, customMuiStyles]\n  );\n  const settingColumn = useMemo(() => {\n    return {\n      label: '',\n      key: SETTING_COLUMN_KEY,\n      width: useColumnSetting ? SETTING_COLUMN_WIDTH : 0,\n    };\n  }, [useColumnSetting]);\n\n  const visibleColumns = useMemo(() => {\n    return columns.filter(column => column.show);\n  }, [columns]);\n\n  // NOTE: Add setting column\n  const tableColumns = useMemo(() => {\n    return useColumnSetting ? [...visibleColumns, settingColumn] : visibleColumns;\n  }, [visibleColumns, useColumnSetting, settingColumn]);\n\n  const columnWidthDict = useMemo(() => {\n    if (width <= 0) {\n      return {};\n    }\n\n    // NOTE: Reserve space for setting column\n    const result = {\n      [settingColumn.key]: settingColumn.width,\n    };\n\n    // NOTE: Keep the columns that had been adjusted due to expected width is smaller than min width\n    const adjustedColumns: number[] = [];\n\n    // NOTE: Give fixed width to the columns with \"width\" field\n    visibleColumns\n      .filter(column => Number.isFinite(column.width))\n      .forEach(column => {\n        result[column.key] = column.width - 1;\n        adjustedColumns.push(column.width - 1);\n      });\n\n    visibleColumns\n      .filter(column => !Number.isFinite(column.width))\n      .forEach(column => {\n        // NOTE: Width sum of adjusted columns\n        const sumOfAdjustColumnWidth = adjustedColumns.reduce(\n          (subResult, columnWidth) => subResult + columnWidth,\n          0\n        );\n        // NOTE: Expected space for the column\n        const calculatedWidth = Math.floor(\n          (width - sumOfAdjustColumnWidth - settingColumn.width) /\n            (visibleColumns.length - adjustedColumns.length)\n        );\n\n        const requiredWidth = column.minWidth || DEFAULT_COLUMN_MIN_WIDTH;\n        const adjustedWidth = calculatedWidth < requiredWidth ? requiredWidth : calculatedWidth;\n        result[column.key] = adjustedWidth - 1;\n        adjustedColumns.push(adjustedWidth - 1);\n      });\n\n    return result;\n  }, [width, visibleColumns, settingColumn]);\n\n  // NOTE: Calculate table width from adjusted columns width\n  const tableWidth = useMemo(() => {\n    return Object.values(columnWidthDict).reduce((result, item) => result + item, 0);\n  }, [columnWidthDict]);\n\n  const isTopSettingIconShown =\n    isTopSettingIconShownAlways || tableWidth - SETTING_COLUMN_WIDTH / 2 >= width;\n\n  useEffect(() => {\n    showTopSettingIcon(isTopSettingIconShown);\n  }, [isTopSettingIconShown]);\n\n  const rowClassName = useCallback(\n    ({ index }: { index: number }) => {\n      return classNames({\n        [appliedClasses.oddRow]: index % 2 === 1,\n      });\n    },\n    [appliedClasses]\n  );\n\n  // NOTE: table header\n  const headerRenderer = (headerData: { label?: ReactNode; dataKey: string }) => {\n    const { label, dataKey } = headerData;\n\n    const isSortable = sortBy || sortDirection || sort;\n\n    if (CustomHeaderCellRenderer) {\n      return (\n        <CustomHeaderCellRenderer\n          columnKey={dataKey}\n          columns={columns}\n          sortBy={sortBy}\n          sortDirection={sortDirection}\n        />\n      );\n    }\n\n    if (dataKey === settingColumn.key) {\n      return !isTopSettingIconShown ? (\n        <IconButton\n          size=\"small\"\n          aria-label=\"customize columns\"\n          className={appliedClasses.settingIcon}\n          onClick={onOpenSettingDlg}\n        >\n          <SettingsIcon fontSize=\"inherit\" />\n        </IconButton>\n      ) : null;\n    }\n    return (\n      <Typography\n        variant=\"body2\"\n        className={classNames(\n          appliedClasses.headerLabel,\n          getHeaderLabelClassName(columns, dataKey)\n        )}\n      >\n        {label}&nbsp;\n        <span\n          className={classNames(\n            appliedClasses.unitLabel,\n            getHeaderLabelUnitClassName(columns, dataKey)\n          )}\n        >\n          {getUnitText(columns, dataKey)}\n        </span>\n        {isSortable && dataKey !== sortBy && (\n          <Tooltip title=\"Sort A-Z\">\n            <SortIcon fontSize=\"small\" className={classes.sortIcon} />\n          </Tooltip>\n        )}\n        {isSortable &&\n          dataKey === sortBy &&\n          (sortDirection === SortDirection.ASC ? (\n            <ArrowUpwardIcon fontSize=\"small\" className={classes.sortIcon} />\n          ) : (\n            <ArrowDownwardIcon fontSize=\"small\" className={classes.sortIcon} />\n          ))}\n      </Typography>\n    );\n  };\n\n  const rowRenderer = useCallback(\n    ({\n      ariaAttributes,\n      style,\n      data,\n      tableColumns,\n      index,\n    }: RowComponentProps<{\n      data: any[];\n      tableColumns: { label: string; key: string; width: number }[];\n    }>) => {\n      return (\n        <div\n          style={{ ...style, ...customRowStyle?.({ index }) }}\n          className={classNames(\n            rowClassName({ index }),\n            classes.row,\n            'ReactVirtualized__Table__row'\n          )}\n          {...ariaAttributes}\n        >\n          {tableColumns.map(column => {\n            const dataKey = column.key;\n            const rowData = data[index];\n\n            const content = CustomCellRenderer ? (\n              <CustomCellRenderer\n                columnKey={dataKey}\n                value={rowData[dataKey]}\n                rowData={rowData}\n                columns={columns}\n              />\n            ) : (\n              <Typography variant=\"body2\" className={appliedClasses.cellData}>\n                {rowData[dataKey]}\n              </Typography>\n            );\n\n            return (\n              <div\n                className={classNames(classes.cell, 'ReactVirtualized__Table__rowColumn')}\n                key={dataKey}\n                style={{ flex: `0 1 ${columnWidthDict[dataKey]}px`, overflow: 'hidden' }}\n              >\n                {content}\n              </div>\n            );\n          })}\n        </div>\n      );\n    },\n    [\n      CustomCellRenderer,\n      rowClassName,\n      columnWidthDict,\n      customRowStyle,\n      classes,\n      appliedClasses.cellData,\n      columns,\n    ]\n  );\n\n  const style = useMemo(\n    () => ({\n      width: useFixedColumnWidth ? tableWidth : width,\n      height,\n    }),\n    [useFixedColumnWidth, tableWidth, width, height]\n  );\n\n  const cellProps = useMemo(\n    () => ({\n      data,\n      tableColumns,\n    }),\n    [data, tableColumns]\n  );\n\n  const onSort = useCallback(\n    (newSortBy: string): MouseEventHandler =>\n      event => {\n        sort?.({\n          defaultSortDirection,\n          event,\n          sortBy: newSortBy,\n          sortDirection:\n            newSortBy === sortBy && (!sortDirection || sortDirection === defaultSortDirection)\n              ? 'DESC'\n              : defaultSortDirection,\n        });\n      },\n    [sort, sortBy, sortDirection]\n  );\n\n  const isSortable = sortBy || sortDirection || sort;\n\n  return (\n    <div\n      style={style}\n      className={classNames(appliedClasses.root, appliedClasses.table, 'ReactVirtualized__Table')}\n    >\n      <div\n        className={classNames(appliedClasses.header, 'ReactVirtualized__Table__headerRow')}\n        style={{ flex: `0 0 ${headerHeight}px` }}\n      >\n        {tableColumns.map(column => (\n          <div\n            key={column.key}\n            className={classNames(\n              appliedClasses.headerCell,\n              column.key !== SETTING_COLUMN_KEY && sort && appliedClasses.sortable,\n              'ReactVirtualized__Table__headerColumn',\n              isSortable && 'ReactVirtualized__Table__sortableHeaderColumn'\n            )}\n            style={{ flex: `0 1 ${columnWidthDict[column.key]}px`, height: headerHeight }}\n            onClick={column.key !== SETTING_COLUMN_KEY ? onSort(column.key) : undefined}\n          >\n            {headerRenderer({\n              label: column.label,\n              dataKey: column.key,\n            })}\n          </div>\n        ))}\n      </div>\n      <List\n        rowProps={cellProps}\n        rowCount={data.length}\n        rowHeight={rowHeight}\n        rowComponent={rowRenderer}\n        onScroll={onScroll}\n        className=\"ReactVirtualized__Grid ReactVirtualized__Table__Grid\"\n      />\n    </div>\n  );\n};\n\nexport default VirtualizedTableComponent;\n"],"names":["SortDirection","defaultSortDirection","useStyles","makeStyles","theme","rowStyles","borderBottom","isLightTheme","display","flexFlow","alignItems","cellStyles","minWidth","marginRight","marginLeft","root","overflow","row","cell","header","headerCell","sortable","cursor","oddRow","backgroundColor","headerLabel","lineHeight","fontSize","fontStyle","letterSpacing","flexWrap","cellData","fontWeight","unitLabel","opacity","settingIcon","padding","sortIcon","getUnitText","columns","dataKey","_ref","find","column","key","unitType","customUnit","concat","getUnitDisplay","getHeaderLabelClassName","headerLabelClassName","getHeaderLabelUnitClassName","headerLabelUnitClassName","VirtualizedTableComponent","_ref4","data","useColumnSetting","useFixedColumnWidth","onOpenSettingDlg","width","height","headerHeight","rowHeight","showTopSettingIcon","customMuiStyles","isTopSettingIconShownAlways","CustomCellRenderer","CustomHeaderCellRenderer","customRowStyle","sort","sortBy","sortDirection","_ref4$onScroll","onScroll","classes","appliedClasses","useMemo","settingColumn","label","visibleColumns","filter","show","tableColumns","columnWidthDict","result","adjustedColumns","Number","isFinite","forEach","push","sumOfAdjustColumnWidth","reduce","subResult","columnWidth","calculatedWidth","Math","floor","length","requiredWidth","adjustedWidth","tableWidth","Object","values","item","isTopSettingIconShown","SETTING_COLUMN_WIDTH","useEffect","rowClassName","useCallback","_ref5","index","classNames","headerRenderer","headerData","isSortable","_jsx","columnKey","jsx","IconButton","size","className","onClick","children","SettingsIcon","_jsxs","Typography","variant","Tooltip","title","SortIcon","ArrowUpwardIcon","ArrowDownwardIcon","rowRenderer","_ref6","ariaAttributes","style","_objectSpread","map","rowData","content","value","flex","cellProps","onSort","newSortBy","event","table","undefined","List","rowProps","rowCount","rowComponent"],"mappings":"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"}

package/cjs-bundle/hocs/withAssetEditorLockHOC.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("@babel/runtime/helpers/defineProperty"),t=require("@babel/runtime/helpers/slicedToArray"),r=require("react"),n=require("@material-ui/core"),o=require("@material-ui/icons"),i=require("react/jsx-runtime");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=a(e),c=a(t);function s(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function u(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?s(Object(r),!0).forEach((function(t){l.default(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):s(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var d=n.makeStyles((function(e){return{root:{display:"flex"},assetEditorWrapper:{width:"100%"},iconButtonWrapper:{height:36,marginTop:10,marginLeft:16},iconButton:{color:e.palette.primary.text6,width:36,height:36,"&:hover":{backgroundColor:e.palette.background.b7}}}}));module.exports=function(e){return function(t){var a=d(),l=r.useState(!0),s=c.default(l,2),p=s[0],f=s[1],b=r.useState(!0),h=c.default(b,2),m=h[0],g=h[1];r.useEffect((function(){m||g(!0)}),[m]);var j=p?o.LockOutlined:o.ReplayOutlined;return i.jsxs("div",{className:a.root,children:[i.jsx(n.Tooltip,{title:p?"This app is using current dashboard asset.":"",placement:"bottom",children:i.jsx("div",{className:a.assetEditorWrapper,children:m&&i.jsx(e,u(u({},t),{},{disabled:p}))})}),i.jsx(n.Tooltip,{title:p?"Unlock Asset":"Return default",placement:"bottom",children:i.jsx("div",{className:a.iconButtonWrapper,children:i.jsx(n.IconButton,{className:a.iconButton,"data-testid":"".concat(p?"UnlockAsset":"ReturnDefault","_IconButton"),onClick:function(){var e=!p;f(e),e&&(t.onChangeEditorField?(t.onChangeEditorField("assetId",null),t.onChangeEditorField("replacedAssetId",null),t.onChangeEditorField("replacedAssetTime",null)):t.onSettingsChange({rigId:null,wellId:null}),g(!1))},children:i.jsx(j,{})})})})]})}};
+"use strict";var e=require("@babel/runtime/helpers/defineProperty"),t=require("@babel/runtime/helpers/slicedToArray"),r=require("react"),n=require("@material-ui/core"),i=require("@material-ui/icons/LockOutlined"),o=require("@material-ui/icons/ReplayOutlined"),a=require("react/jsx-runtime");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=l(e),u=l(t),s=l(i),d=l(o);function p(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function f(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?p(Object(r),!0).forEach((function(t){c.default(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):p(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var b=n.makeStyles((function(e){return{root:{display:"flex"},assetEditorWrapper:{width:"100%"},iconButtonWrapper:{height:36,marginTop:10,marginLeft:16},iconButton:{color:e.palette.primary.text6,width:36,height:36,"&:hover":{backgroundColor:e.palette.background.b7}}}}));module.exports=function(e){return function(t){var i=b(),o=r.useState(!0),l=u.default(o,2),c=l[0],p=l[1],h=r.useState(!0),m=u.default(h,2),g=m[0],j=m[1];r.useEffect((function(){g||j(!0)}),[g]);var O=c?s.default:d.default;return a.jsxs("div",{className:i.root,children:[a.jsx(n.Tooltip,{title:c?"This app is using current dashboard asset.":"",placement:"bottom",children:a.jsx("div",{className:i.assetEditorWrapper,children:g&&a.jsx(e,f(f({},t),{},{disabled:c}))})}),a.jsx(n.Tooltip,{title:c?"Unlock Asset":"Return default",placement:"bottom",children:a.jsx("div",{className:i.iconButtonWrapper,children:a.jsx(n.IconButton,{className:i.iconButton,"data-testid":"".concat(c?"UnlockAsset":"ReturnDefault","_IconButton"),onClick:function(){var e=!c;p(e),e&&(t.onChangeEditorField?(t.onChangeEditorField("assetId",null),t.onChangeEditorField("replacedAssetId",null),t.onChangeEditorField("replacedAssetTime",null)):t.onSettingsChange({rigId:null,wellId:null}),j(!1))},children:a.jsx(O,{})})})})]})}};
 //# sourceMappingURL=withAssetEditorLockHOC.js.map

package/cjs-bundle/hocs/withAssetEditorLockHOC.js.map

@@ -1 +1 @@
-{"version":3,"file":"withAssetEditorLockHOC.js","sources":["../../../src/hocs/withAssetEditorLockHOC.tsx"],"sourcesContent":["import { ComponentType, FC, useState, useEffect } from 'react';\nimport { Tooltip, makeStyles, IconButton } from '@material-ui/core';\nimport { LockOutlined, ReplayOutlined } from '@material-ui/icons';\n\nimport { AssetSettingsPatch } from '../components/AssetEditorV2';\n\ntype AssetEditorLockProps =\n  | {\n      onChangeEditorField: (\n        field: 'assetId' | 'replacedAssetId' | 'replacedAssetTime',\n        value: null\n      ) => void;\n    }\n  | {\n      onChangeEditorField?: never;\n      onSettingsChange: (settings: AssetSettingsPatch) => void;\n    };\n\nconst useStyles = makeStyles(theme => ({\n  root: { display: 'flex' },\n  assetEditorWrapper: { width: '100%' },\n  iconButtonWrapper: { height: 36, marginTop: 10, marginLeft: 16 },\n  iconButton: {\n    color: theme.palette.primary.text6,\n    width: 36,\n    height: 36,\n    '&:hover': { backgroundColor: theme.palette.background.b7 },\n  },\n}));\n\nconst withAssetEditorLockHOC = <Props extends { disabled?: boolean }>(\n  WrappedComponent: ComponentType<Props>\n) => {\n  const AssetEditorWithLock: FC<Props & AssetEditorLockProps> = props => {\n    const styles = useStyles();\n    const [locked, setLocked] = useState(true);\n    const [showAssetEditor, setShowAssetEditor] = useState(true);\n\n    const onToggleAssetEditorLock = () => {\n      const nextValue = !locked;\n      setLocked(nextValue);\n      if (nextValue) {\n        if (props.onChangeEditorField) {\n          props.onChangeEditorField('assetId', null);\n          props.onChangeEditorField('replacedAssetId', null);\n          props.onChangeEditorField('replacedAssetTime', null);\n        } else {\n          props.onSettingsChange({ rigId: null, wellId: null });\n        }\n        setShowAssetEditor(false);\n      }\n    };\n\n    useEffect(() => {\n      // NOTE: Here we force AssetEditor remount to correctly reset its state\n      if (!showAssetEditor) {\n        setShowAssetEditor(true);\n      }\n    }, [showAssetEditor]);\n\n    const Icon = locked ? LockOutlined : ReplayOutlined;\n    return (\n      <div className={styles.root}>\n        <Tooltip\n          title={locked ? 'This app is using current dashboard asset.' : ''}\n          placement=\"bottom\"\n        >\n          <div className={styles.assetEditorWrapper}>\n            {showAssetEditor && <WrappedComponent {...props} disabled={locked} />}\n          </div>\n        </Tooltip>\n        <Tooltip title={locked ? 'Unlock Asset' : 'Return default'} placement=\"bottom\">\n          <div className={styles.iconButtonWrapper}>\n            <IconButton\n              className={styles.iconButton}\n              data-testid={`${locked ? 'UnlockAsset' : 'ReturnDefault'}_IconButton`}\n              onClick={onToggleAssetEditorLock}\n            >\n              <Icon />\n            </IconButton>\n          </div>\n        </Tooltip>\n      </div>\n    );\n  };\n\n  return AssetEditorWithLock;\n};\n\nexport default withAssetEditorLockHOC;\n"],"names":["useStyles","makeStyles","theme","root","display","assetEditorWrapper","width","iconButtonWrapper","height","marginTop","marginLeft","iconButton","color","palette","primary","text6","backgroundColor","background","b7","WrappedComponent","props","styles","useState","_useState2","_slicedToArray","_useState","locked","setLocked","_useState4","_useState3","showAssetEditor","setShowAssetEditor","useEffect","Icon","LockOutlined","ReplayOutlined","_jsxs","className","children","_jsx","Tooltip","title","placement","jsx","disabled","IconButton","concat","onClick","nextValue","onChangeEditorField","onSettingsChange","rigId","wellId"],"mappings":"w4BAkBA,IAAMA,EAAYC,EAAAA,YAAW,SAAAC,GAAK,MAAK,CACrCC,KAAM,CAAEC,QAAS,QACjBC,mBAAoB,CAAEC,MAAO,QAC7BC,kBAAmB,CAAEC,OAAQ,GAAIC,UAAW,GAAIC,WAAY,IAC5DC,WAAY,CACVC,MAAOV,EAAMW,QAAQC,QAAQC,MAC7BT,MAAO,GACPE,OAAQ,GACR,UAAW,CAAEQ,gBAAiBd,EAAMW,QAAQI,WAAWC,KAE1D,mBAE8B,SAC7BC,GAuDA,OArD8D,SAAAC,GAC5D,IAAMC,EAASrB,IACasB,EAAAA,EAAQA,UAAC,GAAKC,EAAAC,EAAAA,QAAAC,EAAA,GAAnCC,EAAMH,EAAA,GAAEI,EAASJ,EAAA,GACsBD,EAAAA,EAAQA,UAAC,GAAKM,EAAAJ,EAAAA,QAAAK,EAAA,GAArDC,EAAeF,EAAA,GAAEG,EAAkBH,EAAA,GAiB1CI,EAAAA,WAAU,WAEHF,GACHC,GAAmB,EAEvB,GAAG,CAACD,IAEJ,IAAMG,EAAOP,EAASQ,EAAYA,aAAGC,iBACrC,OACEC,EAAAA,KAAA,MAAA,CAAKC,UAAWhB,EAAOlB,KAAKmC,SAAA,CAC1BC,MAACC,UAAO,CACNC,MAAOf,EAAS,6CAA+C,GAC/DgB,UAAU,SAAQJ,SAElBC,EAAAI,IAAA,MAAA,CAAKN,UAAWhB,EAAOhB,mBAAmBiC,SACvCR,GAAmBS,EAACI,IAAAxB,SAAqBC,GAAK,GAAA,CAAEwB,SAAUlB,SAG/Da,MAACC,UAAO,CAACC,MAAOf,EAAS,eAAiB,iBAAkBgB,UAAU,SAAQJ,SAC5EC,EAAAI,IAAA,MAAA,CAAKN,UAAWhB,EAAOd,kBAAkB+B,SACvCC,MAACM,aAAU,CACTR,UAAWhB,EAAOV,WAClB,cAAA,GAAAmC,OAAgBpB,EAAS,cAAgB,gBAA6B,eACtEqB,QAtCsB,WAC9B,IAAMC,GAAatB,EACnBC,EAAUqB,GACNA,IACE5B,EAAM6B,qBACR7B,EAAM6B,oBAAoB,UAAW,MACrC7B,EAAM6B,oBAAoB,kBAAmB,MAC7C7B,EAAM6B,oBAAoB,oBAAqB,OAE/C7B,EAAM8B,iBAAiB,CAAEC,MAAO,KAAMC,OAAQ,OAEhDrB,GAAmB,KA2BoBO,SAEjCC,EAAAA,IAACN,EAAI,aASnB"}
+{"version":3,"file":"withAssetEditorLockHOC.js","sources":["../../../src/hocs/withAssetEditorLockHOC.tsx"],"sourcesContent":["import { ComponentType, FC, useState, useEffect } from 'react';\nimport { Tooltip, makeStyles, IconButton } from '@material-ui/core';\nimport LockOutlined from '@material-ui/icons/LockOutlined';\nimport ReplayOutlined from '@material-ui/icons/ReplayOutlined';\n\nimport { AssetSettingsPatch } from '../components/AssetEditorV2';\n\ntype AssetEditorLockProps =\n  | {\n      onChangeEditorField: (\n        field: 'assetId' | 'replacedAssetId' | 'replacedAssetTime',\n        value: null\n      ) => void;\n    }\n  | {\n      onChangeEditorField?: never;\n      onSettingsChange: (settings: AssetSettingsPatch) => void;\n    };\n\nconst useStyles = makeStyles(theme => ({\n  root: { display: 'flex' },\n  assetEditorWrapper: { width: '100%' },\n  iconButtonWrapper: { height: 36, marginTop: 10, marginLeft: 16 },\n  iconButton: {\n    color: theme.palette.primary.text6,\n    width: 36,\n    height: 36,\n    '&:hover': { backgroundColor: theme.palette.background.b7 },\n  },\n}));\n\nconst withAssetEditorLockHOC = <Props extends { disabled?: boolean }>(\n  WrappedComponent: ComponentType<Props>\n) => {\n  const AssetEditorWithLock: FC<Props & AssetEditorLockProps> = props => {\n    const styles = useStyles();\n    const [locked, setLocked] = useState(true);\n    const [showAssetEditor, setShowAssetEditor] = useState(true);\n\n    const onToggleAssetEditorLock = () => {\n      const nextValue = !locked;\n      setLocked(nextValue);\n      if (nextValue) {\n        if (props.onChangeEditorField) {\n          props.onChangeEditorField('assetId', null);\n          props.onChangeEditorField('replacedAssetId', null);\n          props.onChangeEditorField('replacedAssetTime', null);\n        } else {\n          props.onSettingsChange({ rigId: null, wellId: null });\n        }\n        setShowAssetEditor(false);\n      }\n    };\n\n    useEffect(() => {\n      // NOTE: Here we force AssetEditor remount to correctly reset its state\n      if (!showAssetEditor) {\n        setShowAssetEditor(true);\n      }\n    }, [showAssetEditor]);\n\n    const Icon = locked ? LockOutlined : ReplayOutlined;\n    return (\n      <div className={styles.root}>\n        <Tooltip\n          title={locked ? 'This app is using current dashboard asset.' : ''}\n          placement=\"bottom\"\n        >\n          <div className={styles.assetEditorWrapper}>\n            {showAssetEditor && <WrappedComponent {...props} disabled={locked} />}\n          </div>\n        </Tooltip>\n        <Tooltip title={locked ? 'Unlock Asset' : 'Return default'} placement=\"bottom\">\n          <div className={styles.iconButtonWrapper}>\n            <IconButton\n              className={styles.iconButton}\n              data-testid={`${locked ? 'UnlockAsset' : 'ReturnDefault'}_IconButton`}\n              onClick={onToggleAssetEditorLock}\n            >\n              <Icon />\n            </IconButton>\n          </div>\n        </Tooltip>\n      </div>\n    );\n  };\n\n  return AssetEditorWithLock;\n};\n\nexport default withAssetEditorLockHOC;\n"],"names":["useStyles","makeStyles","theme","root","display","assetEditorWrapper","width","iconButtonWrapper","height","marginTop","marginLeft","iconButton","color","palette","primary","text6","backgroundColor","background","b7","WrappedComponent","props","styles","useState","_useState2","_slicedToArray","_useState","locked","setLocked","_useState4","_useState3","showAssetEditor","setShowAssetEditor","useEffect","Icon","LockOutlined","ReplayOutlined","_jsxs","className","children","_jsx","Tooltip","title","placement","jsx","disabled","IconButton","concat","onClick","nextValue","onChangeEditorField","onSettingsChange","rigId","wellId"],"mappings":"k9BAmBA,IAAMA,EAAYC,EAAAA,YAAW,SAAAC,GAAK,MAAK,CACrCC,KAAM,CAAEC,QAAS,QACjBC,mBAAoB,CAAEC,MAAO,QAC7BC,kBAAmB,CAAEC,OAAQ,GAAIC,UAAW,GAAIC,WAAY,IAC5DC,WAAY,CACVC,MAAOV,EAAMW,QAAQC,QAAQC,MAC7BT,MAAO,GACPE,OAAQ,GACR,UAAW,CAAEQ,gBAAiBd,EAAMW,QAAQI,WAAWC,KAE1D,mBAE8B,SAC7BC,GAuDA,OArD8D,SAAAC,GAC5D,IAAMC,EAASrB,IACasB,EAAAA,EAAQA,UAAC,GAAKC,EAAAC,EAAAA,QAAAC,EAAA,GAAnCC,EAAMH,EAAA,GAAEI,EAASJ,EAAA,GACsBD,EAAAA,EAAQA,UAAC,GAAKM,EAAAJ,EAAAA,QAAAK,EAAA,GAArDC,EAAeF,EAAA,GAAEG,EAAkBH,EAAA,GAiB1CI,EAAAA,WAAU,WAEHF,GACHC,GAAmB,EAEvB,GAAG,CAACD,IAEJ,IAAMG,EAAOP,EAASQ,EAAY,QAAGC,UACrC,OACEC,EAAAA,KAAA,MAAA,CAAKC,UAAWhB,EAAOlB,KAAKmC,SAAA,CAC1BC,MAACC,UAAO,CACNC,MAAOf,EAAS,6CAA+C,GAC/DgB,UAAU,SAAQJ,SAElBC,EAAAI,IAAA,MAAA,CAAKN,UAAWhB,EAAOhB,mBAAmBiC,SACvCR,GAAmBS,EAACI,IAAAxB,SAAqBC,GAAK,GAAA,CAAEwB,SAAUlB,SAG/Da,MAACC,UAAO,CAACC,MAAOf,EAAS,eAAiB,iBAAkBgB,UAAU,SAAQJ,SAC5EC,EAAAI,IAAA,MAAA,CAAKN,UAAWhB,EAAOd,kBAAkB+B,SACvCC,MAACM,aAAU,CACTR,UAAWhB,EAAOV,WAClB,cAAA,GAAAmC,OAAgBpB,EAAS,cAAgB,gBAA6B,eACtEqB,QAtCsB,WAC9B,IAAMC,GAAatB,EACnBC,EAAUqB,GACNA,IACE5B,EAAM6B,qBACR7B,EAAM6B,oBAAoB,UAAW,MACrC7B,EAAM6B,oBAAoB,kBAAmB,MAC7C7B,EAAM6B,oBAAoB,oBAAqB,OAE/C7B,EAAM8B,iBAAiB,CAAEC,MAAO,KAAMC,OAAQ,OAEhDrB,GAAmB,KA2BoBO,SAEjCC,EAAAA,IAACN,EAAI,aASnB"}