@up42/up-components 0.2.1 → 0.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (28) hide show
  1. package/dist/cjs/index.js +1 -1
  2. package/dist/cjs/types/components/FormSelect/FormSelect.d.ts +1 -1
  3. package/dist/cjs/types/components/TabGroup/TabGroup.d.ts +18 -0
  4. package/dist/cjs/types/components/TabGroup/TabGroup.stories.d.ts +5 -0
  5. package/dist/cjs/types/components/TabGroup/TabGroup.test.d.ts +1 -0
  6. package/dist/cjs/types/components/Tabs/Tabs.d.ts +7 -0
  7. package/dist/cjs/types/{global/overrides/tabs.d.ts → components/Tabs/Tabs.overrides.d.ts} +1 -0
  8. package/dist/cjs/types/components/Tabs/Tabs.stories.d.ts +4 -0
  9. package/dist/cjs/types/components/Tabs/Tabs.test.d.ts +1 -0
  10. package/dist/cjs/types/components/index.d.ts +2 -0
  11. package/dist/cjs/types/global/overrides/index.d.ts +0 -2
  12. package/dist/cjs/types/index.d.ts +1 -1
  13. package/dist/esm/index.js +1 -1
  14. package/dist/esm/types/components/FormSelect/FormSelect.d.ts +1 -1
  15. package/dist/esm/types/components/TabGroup/TabGroup.d.ts +18 -0
  16. package/dist/esm/types/components/TabGroup/TabGroup.stories.d.ts +5 -0
  17. package/dist/esm/types/components/TabGroup/TabGroup.test.d.ts +1 -0
  18. package/dist/esm/types/components/Tabs/Tabs.d.ts +7 -0
  19. package/dist/esm/types/{global/overrides/tabs.d.ts → components/Tabs/Tabs.overrides.d.ts} +1 -0
  20. package/dist/esm/types/components/Tabs/Tabs.stories.d.ts +4 -0
  21. package/dist/esm/types/components/Tabs/Tabs.test.d.ts +1 -0
  22. package/dist/esm/types/components/index.d.ts +2 -0
  23. package/dist/esm/types/global/overrides/index.d.ts +0 -2
  24. package/dist/esm/types/index.d.ts +1 -1
  25. package/dist/index.d.ts +24 -4
  26. package/package.json +1 -1
  27. package/dist/cjs/types/global/overrides/tab.d.ts +0 -2
  28. package/dist/esm/types/global/overrides/tab.d.ts +0 -2
package/dist/cjs/index.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@mui/material"),r=require("react"),t=require("@mui/material/styles"),o=require("@mui/material/Button"),n=require("@mui/material/Typography"),a=require("@mui/material/InputAdornment"),i=require("@mui/material/IconButton"),l=require("@mui/icons-material/VisibilityOutlined"),c=require("@mui/icons-material/VisibilityOffOutlined");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function f(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,o.get?o:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var s=d(r),u=f(r),p=d(o),m=d(n),g=d(a),h=d(i),b=d(l),x=d(c),y={animation:{speed:{normal:"0.5s",fast:"0.08s",slow:"1s"}},color:{background:{light:"#f4f5f7",dark:"#dfe1e6",indigo:"#262a59"},primary:"#262a59",secondary:"#d40fa9",info:"#262a59",error:"#e35656",success:"#aed581",indigo0:"#f4f4f6",indigo10:"#e9e9ee",indigo20:"#bdbfcd",indigo30:"#a8aabd",indigo40:"#9294ac",indigo50:"#7d7f9b",indigo60:"#67698a",indigo70:"#51557a",indigo80:"#3b3f69",indigo90:"#262a59",indigo100:"#161833",pink0:"#fff3ff",pink10:"#fedafd",pink20:"#fdc0fb",pink30:"#f98ef3",pink40:"#f362e8",pink50:"#ec3ed7",pink60:"#d40fa9",pink70:"#b0027c",pink80:"#990165",pink90:"#820050",pink100:"#390325",cyan0:"#f4ffff",cyan10:"#c6ffff",cyan20:"#96ffff",cyan30:"#59effc",cyan40:"#1dd7f0",cyan50:"#20b0c7",cyan60:"#1d8fa4",cyan70:"#167286",cyan80:"#0e5a6d",cyan90:"#064658",cyan100:"#103645",green0:"#f8fff4",green10:"#e2fccc",green20:"#e2fccc",green30:"#aed581",green40:"#8eaf65",green50:"#728f4b",green60:"#5a7533",green70:"#476020",green80:"#374e10",green90:"#2b3f05",green100:"#223300",red0:"#fff7f4",red10:"#ffe4db",red20:"#fcc4bb",red30:"#efa299",red40:"#e67e78",red50:"#e35656",red60:"#b83d3c",red70:"#922524",red80:"#6f1110",red90:"#500404",red100:"#330000",gray0:"#ffffff",gray10:"#f4f5f7",gray20:"#dfe1e6",gray30:"#c1c7d0",gray40:"#a8afba",gray50:"#9399a3",gray60:"#777c85",gray70:"#575b61",gray80:"#3c3e42",gray90:"#222426",gray100:"#121315",border:{default:"#dfe1e6"},shadow:{default:"#121315"},text:{base:"#121315",light:"#9399a3",inverted:"#ffffff",link:{default:"#20b0c7",visited:"#1d8fa4"}}},font:{family:{heading:"'Roboto Condensed', sans-serif",text:"'Source Sans Pro', sans-serif",code:"'Source Code Pro', monospace"},lineHeight:{medium:"1rem",large:"1.5rem",xlarge:"2rem",xxlarge:"3rem"},weight:{normal:400,bold:700}},size:{border:{radius:{default:"6px",small:"4px"},width:"1px"},font:{base:"16px",heading:{default:"1.728rem",small:"1.44rem",xsmall:"1rem"},overline:{large:"1.44rem",default:"0.833rem"},body:{default:"1rem"},caption:{default:"0.833rem",large:"1.44rem"},label:{default:"0.833rem",large:"1.44rem"},minorThird10:"6.192rem",minorThird9:"5.16rem",minorThird8:"4.3rem",minorThird7:"3.583rem",minorThird6:"2.986rem",minorThird5:"2.488rem",minorThird4:"2.074rem",minorThird3:"1.728rem",minorThird2:"1.44rem",minorThird1:"1.2rem",minorThird0:"1rem",minorThirdSub1:"0.833rem",minorThirdSub2:"0.694rem",minorThirdSub3:"0.579rem",minorThirdSub4:"0.482rem",minorThirdSub5:"0.402rem",minorThirdSub6:"0.335rem"},spacingXS:"8px",spacingS:"16px",spacingM:"24px",spacingL:"32px",spacingXL:"40px",spacingXXL:"48px",spacing:{main:"24px",section:"32px",header:"24px",article:"24px",paragraph:"16px",line:"8px",scale1:"1px",scale2:"2px",scale4:"4px",scale6:"6px",scale8:"8px",scale16:"16px",scale24:"24px",scale32:"32px",scale40:"40px",scale48:"48px",scale56:"56px",scale64:"64px",scale72:"72px",scale80:"80px",scale88:"88px",scale96:"96px",scale104:"104px",scale112:"112px",scale120:"120px",scale128:"128px",scale160:"160px",scale208:"208px"}}},v=function(){return v=Object.assign||function(e){for(var r,t=1,o=arguments.length;t<o;t++)for(var n in r=arguments[t])Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n]);return e},v.apply(this,arguments)};function z(e,r){var t={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(e);n<o.length;n++)r.indexOf(o[n])<0&&Object.prototype.propertyIsEnumerable.call(e,o[n])&&(t[o[n]]=e[o[n]])}return t}var k={styleOverrides:{root:{fontSize:"12px",fontWeight:600,fontFamily:y.font.family.text,"& .MuiChip-icon":{width:"12px",height:"12px",marginLeft:y.size.spacing.scale8}},colorDefault:{backgroundColor:y.color.gray10,color:y.color.gray60},colorPrimary:{backgroundColor:y.color.indigo10,color:y.color.indigo80},colorSecondary:{backgroundColor:y.color.pink10,color:y.color.pink80},colorError:{backgroundColor:y.color.red10,color:y.color.error},colorInfo:{backgroundColor:y.color.indigo10,color:y.color.indigo80},colorSuccess:{backgroundColor:y.color.green10,color:y.color.green80}}},E={h1:{fontFamily:y.font.family.heading,fontSize:y.size.font.heading.default,fontWeight:y.font.weight.bold,lineHeight:y.font.lineHeight.xlarge},h2:{fontFamily:y.font.family.heading,fontSize:y.size.font.heading.small,fontWeight:y.font.weight.bold,lineHeight:y.font.lineHeight.xlarge},h3:{fontFamily:y.font.family.heading,fontSize:y.size.font.heading.xsmall,fontWeight:y.font.weight.bold,lineHeight:y.font.lineHeight.large},body1:{fontFamily:y.font.family.text,fontSize:y.size.font.body.default,fontWeight:y.font.weight.normal,lineHeight:y.font.lineHeight.large},body2:{fontFamily:y.font.family.text,fontSize:y.size.font.body.default,fontWeight:y.font.weight.bold,lineHeight:y.font.lineHeight.large},caption:{fontFamily:y.font.family.text,fontSize:y.size.font.caption.default,fontWeight:y.font.weight.normal,lineHeight:y.font.lineHeight.medium},overline:{fontFamily:y.font.family.heading,fontSize:y.size.font.overline.default,letterSpacing:"initial",fontWeight:y.font.weight.bold,color:y.color.gray60}},S={small:"".concat(y.size.spacing.scale4," ").concat(y.size.spacing.scale8),medium:"".concat(y.size.spacing.scale8," ").concat(y.size.spacing.scale16),large:"".concat(y.size.spacing.scale16," ").concat(y.size.spacing.scale32)},C={styleOverrides:{root:{textTransform:"none",lineHeight:y.size.spacing.scale16,fontWeight:y.font.weight.bold,fontFamily:y.font.family.text},contained:{padding:S.medium},containedSizeSmall:{padding:S.small},containedSizeLarge:{padding:S.large},text:{padding:S.medium},textSizeSmall:{padding:S.small},textSizeLarge:{padding:S.large},outlined:{padding:"7px ".concat(y.size.spacing.scale16)},outlinedSizeSmall:{padding:S.small},outlinedSizeLarge:{padding:S.large},sizeSmall:{fontSize:y.size.font.label.default},sizeLarge:{fontSize:y.size.font.label.large},startIcon:{"& svg":{fill:"currentColor",width:"12px",height:"12px"}},endIcon:{"& svg":{fill:"currentColor",width:"12px",height:"12px"}}},defaultProps:{disableFocusRipple:!0},MuiIconButton:{root:{"&&:hover":{backgroundColor:"transparent"}}}},w={styleOverrides:{root:{color:y.color.gray60,backgroundColor:y.color.background.dark},sizeSmall:{padding:"3px"}}},O={styleOverrides:{root:{fontFamily:y.font.family.text,fontSize:y.size.font.label.default,fontWeight:y.font.weight.bold,width:y.size.spacing.scale24,height:y.size.spacing.scale24,"& .MuiSvgIcon-root":{width:y.size.spacing.scale16}},colorDefault:{backgroundColor:y.color.background.dark,"& .MuiSvgIcon-root":{color:y.color.gray60}}}},F={styleOverrides:{root:{paddingTop:4,paddingBottom:4,color:y.color.border.default,"& svg":{width:"16px",height:"16px"},"&&:hover":{backgroundColor:"transparent"}},colorPrimary:{"&$checked":{"&&:hover":{backgroundColor:"transparent"}}},colorSecondary:{"&$checked":{color:y.color.primary},"&$disabled":{opacity:.5}}}},T={styleOverrides:{root:{paddingTop:4,paddingBottom:4,color:y.color.border.default,"& svg":{width:"16px",height:"16px"},"&:hover":{background:"none"}}}},L={styleOverrides:{root:{marginRight:16},colorSecondary:{color:y.color.gray0,"&$checked":{color:y.color.gray0,left:2,"&:hover":{backgroundColor:"transparent"}},"&$disabled":{color:y.color.gray0}},track:{position:"absolute",width:48,height:24,borderRadius:12,opacity:1,left:"calc(50% - 48px/2)",top:"calc(50% - 24px/2)",backgroundColor:y.color.background.light,border:"2px solid ".concat(y.color.border.default),boxSizing:"border-box","$checked$checked + &":{opacity:1,backgroundColor:y.color.primary,border:"2px solid ".concat(y.color.primary)},"$disabled$disabled + &":{opacity:.5,cursor:"not-allowed"}},thumb:{boxShadow:"none"}}},M={styleOverrides:{outlined:{position:"relative",padding:y.size.spacing.scale8,fontSize:y.size.font.label.default,borderRadius:y.size.spacing.scale6,width:"100%","&.Mui-disabled":{backgroundColor:y.color.background.dark,color:y.color.text.light}}}},P={styleOverrides:{root:{input:{padding:y.size.spacing.scale8,fontSize:y.size.font.label.default,height:y.size.spacing.scale16},"& .MuiInputAdornment-root":{button:{padding:"0 ".concat(y.size.spacing.scale8," 0 0"),backgroundColor:"transparent"},svg:{width:y.size.spacing.scale16,height:y.size.spacing.scale16}}}}},j={styleOverrides:{outlined:{notchedOutline:{borderColor:y.color.border.default}},root:{underline:{"&:before":{borderBottom:"none"},"&:after":{borderBottom:"none"},"&:hover":{borderBottom:"none"},"&&:hover::before":{border:"none"}}}}};y.size.font.body.default,y.font.family.text,y.color.gray100;var B={styleOverrides:{textColorPrimary:{textTransform:"none",minWidth:"auto",fontWeight:700,marginRight:"".concat(y.size.spacing.scale16),fontFamily:y.font.family.text,color:y.color.gray60,padding:"0 0 ".concat(y.size.spacing.scale16," 0"),"&:hover":{color:y.color.primary,opacity:1},"&$selected":{color:y.color.primary},"&:focus":{color:y.color.primary}}},defaultProps:{disableRipple:!0}};y.size.font.caption.default;var W,H,I,R,q={styleOverrides:{root:{borderBottom:"1px solid ".concat(y.color.gray20)},indicator:{backgroundColor:y.color.primary}}},A={styleOverrides:{root:{fontWeight:y.font.weight.bold,lineHeight:y.font.lineHeight.medium,fontFamily:y.font.family.text,fontSize:y.size.font.caption.default,color:y.color.text.base,marginBottom:y.size.spacing.scale8}}},$=e.createTheme({typography:v({},E),palette:{background:{default:"#ffffff"},primary:{main:y.color.primary},secondary:{main:y.color.secondary},error:{main:y.color.error},info:{main:y.color.info},success:{main:y.color.success}},components:{MuiButton:C,MuiButtonBase:{defaultProps:{disableRipple:!0,disableTouchRipple:!0}},MuiContainer:{styleOverrides:{maxWidthLg:{"@media (min-width: 1280px)":{maxWidth:"1185px"}}}},MuiIconButton:w,MuiChip:k,MuiInput:j,MuiTextField:P,MuiFormLabel:A,MuiTabs:q,MuiTab:B,MuiAvatar:O,MuiCheckbox:F,MuiRadio:T,MuiSwitch:L,MuiSelect:M,MuiLink:{styleOverrides:{root:{cursor:"pointer"}}},MuiDivider:{styleOverrides:{root:{margin:"16px 0"}}},MuiFormControl:{styleOverrides:{root:{width:"100%"}}}}}),N=t.styled(e.CircularProgress)(I||(W=["\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: flex;\n align-items: center;\n justify-content: center;\n"],H=["\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: flex;\n align-items: center;\n justify-content: center;\n"],Object.defineProperty?Object.defineProperty(W,"raw",{value:H}):W.raw=H,I=W)),G={small:6,medium:8,large:12,fluid:12},V=function(r){var t=z(r,[]);return s.default.createElement(e.Checkbox,v({},t))},_=function(r){return s.default.createElement(e.Radio,v({},r))},D=function(r){return s.default.createElement(e.Switch,v({},r))},X=function(r){return s.default.createElement(e.Select,v({variant:"outlined"},r))},U=function(t){var o=t.type,n=z(t,["type"]),a=r.useState(!1),i=a[0],l=a[1],c=v(v({},n.InputProps),"password"===o&&{endAdornment:s.default.createElement(g.default,{position:"end"},s.default.createElement(h.default,{"aria-label":"toggle password visibility",onClick:function(){return l(!i)},edge:"end"},i?s.default.createElement(b.default,null):s.default.createElement(x.default,null)))});return s.default.createElement(e.TextField,v({},n,{type:i?"text":o,InputProps:c}))};function J(){return J=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])}return e},J.apply(this,arguments)}var K=function(e){return u.createElement("svg",J({viewBox:"0 0 24 24"},e),R||(R=u.createElement("path",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M12.141 4.894H3.576A1.977 1.977 0 0 0 1.6 6.871v14.494c0 1.09.885 1.976 1.976 1.976h14.495a1.977 1.977 0 0 0 1.976-1.976V12.8M17.412 1.6h4.94a.99.99 0 0 1 .99.988V7.53m-10.883 4.952L23.05 1.89"})))};exports.Avatar=function(r){var t=r.icon,o=r.firstName,n=void 0===o?"":o,a=r.lastName,i=void 0===a?"":a,l=z(r,["icon","firstName","lastName"]),c="".concat(n.substring(0,1)).concat(i.substring(0,1)).toLocaleUpperCase(),d=c?y.color.secondary:y.color.background.dark;return s.default.createElement(e.Avatar,v({sx:v({backgroundColor:d},l.sx)},l),c||t)},exports.Box=function(r){var t=r.children,o=z(r,["children"]);return s.default.createElement(e.Box,v({},o),t)},exports.Button=function(e){var r=e.color,t=void 0===r?"primary":r,o=e.variant,n=void 0===o?"contained":o,a=e.size,i=void 0===a?"medium":a,l=e.loading,c=e.children,d=z(e,["color","variant","size","loading","children"]);return s.default.createElement(p.default,v({size:i,variant:n,color:t,disabled:l},d),s.default.createElement("span",{style:{opacity:l?0:1}},c),l&&s.default.createElement(N,{size:20,color:"inherit"}))},exports.Checkbox=V,exports.Chip=function(r){var t=r.label,o=z(r,["label"]);return s.default.createElement(e.Chip,v({size:"small",label:t},o))},exports.Container=function(r){var t=r.component,o=void 0===t?"div":t,n=r.size,a=void 0===n?"large":n,i=r.children,l=z(r,["component","size","children"]),c="fluid"===a;return s.default.createElement(e.Container,v({component:o,disableGutters:c,maxWidth:!c&&"lg",sx:v({display:"flex",justifyContent:"center"},l.sx)},l),s.default.createElement(e.Grid,{container:!0,justifyContent:"center"},s.default.createElement(e.Grid,{item:!0,md:G[a]},i)))},exports.FormCheckbox=function(r){var t=r.id,o=r.required,n=void 0===o||o,a=r.data,i=r.label,l=r.error,c=r.helperText;return s.default.createElement(e.FormControl,null,s.default.createElement(e.FormLabel,{component:"label",error:l},i," ",n?"":s.default.createElement(e.Box,{component:"span",sx:{fontWeight:y.font.weight.normal,color:y.color.text.light}},"(optional)")),s.default.createElement(e.FormGroup,null,a.map((function(r,o){var n=r.value,a=r.label;return s.default.createElement(e.FormControlLabel,{key:o,value:n,label:a||"",sx:{fontSize:y.size.font.base,color:y.color.text.base},control:s.default.createElement(V,{color:"primary",inputProps:{"data-testid":"".concat(t,"-").concat(o)}})})}))),l&&s.default.createElement(e.FormHelperText,{sx:{marginLeft:0,marginRight:0},error:l},c))},exports.FormInput=function(r){var t=r.id,o=r.required,n=void 0===o||o,a=r.label,i=r.error,l=r.helperText,c=z(r,["id","required","label","error","helperText"]);return s.default.createElement(e.FormControl,null,s.default.createElement(e.FormLabel,{component:"label",error:i},a," ",!n&&s.default.createElement(e.Box,{component:"span",sx:{fontWeight:y.font.weight.normal,color:y.color.text.light}},"(optional)")),s.default.createElement(U,v({},c,{id:t,error:i,inputProps:{"data-testid":t}})),i&&s.default.createElement(e.FormHelperText,{sx:{marginLeft:0,marginRight:0},error:i},l))},exports.FormRadio=function(r){var t=r.id,o=r.helperText,n=r.label,a=r.error,i=r.required,l=void 0===i||i,c=r.name,d=r.data;return s.default.createElement(e.FormControl,{component:"fieldset",error:a},s.default.createElement(e.FormLabel,{component:"legend"},n," ",l?"":s.default.createElement(e.Box,{component:"span",sx:{fontWeight:y.font.weight.normal,color:y.color.text.light}},"(optional)")),s.default.createElement(e.RadioGroup,{"aria-label":c,name:c},d.map((function(r,o){var n=r.value,a=r.label;return s.default.createElement(e.FormControlLabel,{value:n,key:n,label:a||"",sx:{fontSize:y.size.font.base,color:y.color.text.base},control:s.default.createElement(_,{color:"primary",inputProps:{"data-testid":"".concat(t,"-").concat(o)}})})}))),a&&s.default.createElement(e.FormHelperText,{sx:{marginLeft:0,marginRight:0}},o))},exports.FormSelect=function(r){var t=r.id,o=r.required,n=void 0===o||o,a=r.options,i=r.label,l=r.error,c=r.placeholder,d=r.helperText;return s.default.createElement(e.FormControl,null,s.default.createElement(e.FormLabel,{component:"label",error:l},i," ",n?"":s.default.createElement(e.Box,{component:"span",sx:{fontWeight:y.font.weight.normal,color:y.color.text.light}},"(optional)")),s.default.createElement(X,{id:t,placeholder:c,error:l},a.map((function(r){return s.default.createElement(e.MenuItem,{key:r.value,value:r.value},r.text)}))),l&&s.default.createElement(e.FormHelperText,{sx:{marginLeft:0,marginRight:0},error:l},d))},exports.FormSwitch=function(r){var t=r.id,o=r.label,n=r.checked;return s.default.createElement(e.FormControl,null,s.default.createElement(e.FormLabel,{component:"label"},o),s.default.createElement(e.FormControlLabel,{control:s.default.createElement(D,{id:t}),label:"".concat(n?"Active":"Inactive")}))},exports.Input=U,exports.Link=function(r){var t,o=r.children,n=r.underline,a=void 0===n?"hover":n,i=r.toParentNavigation,l=z(r,["children","underline","toParentNavigation"]),c=null===(t=l.href)||void 0===t?void 0:t.startsWith("https"),d={variant:"caption",underline:a};return i?s.default.createElement(e.Link,v({},d,l,{onClick:function(){return e=i,void window.parent.postMessage({type:"NAVIGATION",content:e},"*");var e}}),o):s.default.createElement(e.Link,v({},d,c&&{target:"_blank",rel:"noopener noreferrer"},l),o,c&&s.default.createElement(e.SvgIcon,{component:K,fontSize:"inherit",sx:{marginLeft:".25em"}}))},exports.Radio=_,exports.Select=X,exports.Switch=D,exports.Typography=function(e){var r=e.children,t=z(e,["children"]);return s.default.createElement(m.default,v({},t),r)},exports.UpComponentsProvider=function(r){return s.default.createElement(s.default.Fragment,null,s.default.createElement(e.CssBaseline,null),s.default.createElement(t.ThemeProvider,{theme:$},r.children))},exports.theme=$,exports.tokens=y,Object.keys(e).forEach((function(r){"default"===r||exports.hasOwnProperty(r)||Object.defineProperty(exports,r,{enumerable:!0,get:function(){return e[r]}})}));
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@mui/material"),t=require("react"),r=require("@mui/material/styles"),o=require("@mui/material/Button"),n=require("@mui/material/Typography"),a=require("@mui/material/InputAdornment"),i=require("@mui/material/IconButton"),l=require("@mui/icons-material/VisibilityOutlined"),c=require("@mui/icons-material/VisibilityOffOutlined");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function f(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=d(t),u=f(t),p=d(o),m=d(n),g=d(a),h=d(i),b=d(l),x=d(c),y={animation:{speed:{normal:"0.5s",fast:"0.08s",slow:"1s"}},color:{background:{light:"#f4f5f7",dark:"#dfe1e6",indigo:"#262a59"},primary:"#262a59",secondary:"#d40fa9",info:"#262a59",error:"#e35656",success:"#aed581",indigo0:"#f4f4f6",indigo10:"#e9e9ee",indigo20:"#bdbfcd",indigo30:"#a8aabd",indigo40:"#9294ac",indigo50:"#7d7f9b",indigo60:"#67698a",indigo70:"#51557a",indigo80:"#3b3f69",indigo90:"#262a59",indigo100:"#161833",pink0:"#fff3ff",pink10:"#fedafd",pink20:"#fdc0fb",pink30:"#f98ef3",pink40:"#f362e8",pink50:"#ec3ed7",pink60:"#d40fa9",pink70:"#b0027c",pink80:"#990165",pink90:"#820050",pink100:"#390325",cyan0:"#f4ffff",cyan10:"#c6ffff",cyan20:"#96ffff",cyan30:"#59effc",cyan40:"#1dd7f0",cyan50:"#20b0c7",cyan60:"#1d8fa4",cyan70:"#167286",cyan80:"#0e5a6d",cyan90:"#064658",cyan100:"#103645",green0:"#f8fff4",green10:"#e2fccc",green20:"#e2fccc",green30:"#aed581",green40:"#8eaf65",green50:"#728f4b",green60:"#5a7533",green70:"#476020",green80:"#374e10",green90:"#2b3f05",green100:"#223300",red0:"#fff7f4",red10:"#ffe4db",red20:"#fcc4bb",red30:"#efa299",red40:"#e67e78",red50:"#e35656",red60:"#b83d3c",red70:"#922524",red80:"#6f1110",red90:"#500404",red100:"#330000",gray0:"#ffffff",gray10:"#f4f5f7",gray20:"#dfe1e6",gray30:"#c1c7d0",gray40:"#a8afba",gray50:"#9399a3",gray60:"#777c85",gray70:"#575b61",gray80:"#3c3e42",gray90:"#222426",gray100:"#121315",border:{default:"#dfe1e6"},shadow:{default:"#121315"},text:{base:"#121315",light:"#9399a3",inverted:"#ffffff",link:{default:"#20b0c7",visited:"#1d8fa4"}}},font:{family:{heading:"'Roboto Condensed', sans-serif",text:"'Source Sans Pro', sans-serif",code:"'Source Code Pro', monospace"},lineHeight:{medium:"1rem",large:"1.5rem",xlarge:"2rem",xxlarge:"3rem"},weight:{normal:400,bold:700}},size:{border:{radius:{default:"6px",small:"4px"},width:"1px"},font:{base:"16px",heading:{default:"1.728rem",small:"1.44rem",xsmall:"1rem"},overline:{large:"1.44rem",default:"0.833rem"},body:{default:"1rem"},caption:{default:"0.833rem",large:"1.44rem"},label:{default:"0.833rem",large:"1.44rem"},minorThird10:"6.192rem",minorThird9:"5.16rem",minorThird8:"4.3rem",minorThird7:"3.583rem",minorThird6:"2.986rem",minorThird5:"2.488rem",minorThird4:"2.074rem",minorThird3:"1.728rem",minorThird2:"1.44rem",minorThird1:"1.2rem",minorThird0:"1rem",minorThirdSub1:"0.833rem",minorThirdSub2:"0.694rem",minorThirdSub3:"0.579rem",minorThirdSub4:"0.482rem",minorThirdSub5:"0.402rem",minorThirdSub6:"0.335rem"},spacingXS:"8px",spacingS:"16px",spacingM:"24px",spacingL:"32px",spacingXL:"40px",spacingXXL:"48px",spacing:{main:"24px",section:"32px",header:"24px",article:"24px",paragraph:"16px",line:"8px",scale1:"1px",scale2:"2px",scale4:"4px",scale6:"6px",scale8:"8px",scale16:"16px",scale24:"24px",scale32:"32px",scale40:"40px",scale48:"48px",scale56:"56px",scale64:"64px",scale72:"72px",scale80:"80px",scale88:"88px",scale96:"96px",scale104:"104px",scale112:"112px",scale120:"120px",scale128:"128px",scale160:"160px",scale208:"208px"}}},v=function(){return v=Object.assign||function(e){for(var t,r=1,o=arguments.length;r<o;r++)for(var n in t=arguments[r])Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n]);return e},v.apply(this,arguments)};function z(e,t){var r={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(e);n<o.length;n++)t.indexOf(o[n])<0&&Object.prototype.propertyIsEnumerable.call(e,o[n])&&(r[o[n]]=e[o[n]])}return r}var k={styleOverrides:{root:{fontSize:"12px",fontWeight:600,fontFamily:y.font.family.text,"& .MuiChip-icon":{width:"12px",height:"12px",marginLeft:y.size.spacing.scale8}},colorDefault:{backgroundColor:y.color.gray10,color:y.color.gray60},colorPrimary:{backgroundColor:y.color.indigo10,color:y.color.indigo80},colorSecondary:{backgroundColor:y.color.pink10,color:y.color.pink80},colorError:{backgroundColor:y.color.red10,color:y.color.error},colorInfo:{backgroundColor:y.color.indigo10,color:y.color.indigo80},colorSuccess:{backgroundColor:y.color.green10,color:y.color.green80}}},E={h1:{fontFamily:y.font.family.heading,fontSize:y.size.font.heading.default,fontWeight:y.font.weight.bold,lineHeight:y.font.lineHeight.xlarge},h2:{fontFamily:y.font.family.heading,fontSize:y.size.font.heading.small,fontWeight:y.font.weight.bold,lineHeight:y.font.lineHeight.xlarge},h3:{fontFamily:y.font.family.heading,fontSize:y.size.font.heading.xsmall,fontWeight:y.font.weight.bold,lineHeight:y.font.lineHeight.large},body1:{fontFamily:y.font.family.text,fontSize:y.size.font.body.default,fontWeight:y.font.weight.normal,lineHeight:y.font.lineHeight.large},body2:{fontFamily:y.font.family.text,fontSize:y.size.font.body.default,fontWeight:y.font.weight.bold,lineHeight:y.font.lineHeight.large},caption:{fontFamily:y.font.family.text,fontSize:y.size.font.caption.default,fontWeight:y.font.weight.normal,lineHeight:y.font.lineHeight.medium},overline:{fontFamily:y.font.family.heading,fontSize:y.size.font.overline.default,letterSpacing:"initial",fontWeight:y.font.weight.bold,color:y.color.gray60}},S={small:"".concat(y.size.spacing.scale4," ").concat(y.size.spacing.scale8),medium:"".concat(y.size.spacing.scale8," ").concat(y.size.spacing.scale16),large:"".concat(y.size.spacing.scale16," ").concat(y.size.spacing.scale32)},C={styleOverrides:{root:{textTransform:"none",lineHeight:y.size.spacing.scale16,fontWeight:y.font.weight.bold,fontFamily:y.font.family.text},contained:{padding:S.medium},containedSizeSmall:{padding:S.small},containedSizeLarge:{padding:S.large},text:{padding:S.medium},textSizeSmall:{padding:S.small},textSizeLarge:{padding:S.large},outlined:{padding:"7px ".concat(y.size.spacing.scale16)},outlinedSizeSmall:{padding:S.small},outlinedSizeLarge:{padding:S.large},sizeSmall:{fontSize:y.size.font.label.default},sizeLarge:{fontSize:y.size.font.label.large},startIcon:{"& svg":{fill:"currentColor",width:"12px",height:"12px"}},endIcon:{"& svg":{fill:"currentColor",width:"12px",height:"12px"}}},defaultProps:{disableFocusRipple:!0},MuiIconButton:{root:{"&&:hover":{backgroundColor:"transparent"}}}},w={styleOverrides:{root:{color:y.color.gray60,backgroundColor:y.color.background.dark},sizeSmall:{padding:"3px"}}},O={styleOverrides:{root:{fontFamily:y.font.family.text,fontSize:y.size.font.label.default,fontWeight:y.font.weight.bold,width:y.size.spacing.scale24,height:y.size.spacing.scale24,"& .MuiSvgIcon-root":{width:y.size.spacing.scale16}},colorDefault:{backgroundColor:y.color.background.dark,"& .MuiSvgIcon-root":{color:y.color.gray60}}}},T={styleOverrides:{root:{paddingTop:4,paddingBottom:4,color:y.color.border.default,"& svg":{width:"16px",height:"16px"},"&&:hover":{backgroundColor:"transparent"}},colorPrimary:{"&$checked":{"&&:hover":{backgroundColor:"transparent"}}},colorSecondary:{"&$checked":{color:y.color.primary},"&$disabled":{opacity:.5}}}},F={styleOverrides:{root:{paddingTop:4,paddingBottom:4,color:y.color.border.default,"& svg":{width:"16px",height:"16px"},"&:hover":{background:"none"}}}},P={styleOverrides:{root:{marginRight:16},colorSecondary:{color:y.color.gray0,"&$checked":{color:y.color.gray0,left:2,"&:hover":{backgroundColor:"transparent"}},"&$disabled":{color:y.color.gray0}},track:{position:"absolute",width:48,height:24,borderRadius:12,opacity:1,left:"calc(50% - 48px/2)",top:"calc(50% - 24px/2)",backgroundColor:y.color.background.light,border:"2px solid ".concat(y.color.border.default),boxSizing:"border-box","$checked$checked + &":{opacity:1,backgroundColor:y.color.primary,border:"2px solid ".concat(y.color.primary)},"$disabled$disabled + &":{opacity:.5,cursor:"not-allowed"}},thumb:{boxShadow:"none"}}},L={styleOverrides:{outlined:{position:"relative",padding:y.size.spacing.scale8,fontSize:y.size.font.label.default,borderRadius:y.size.spacing.scale6,width:"100%","&.Mui-disabled":{backgroundColor:y.color.background.dark,color:y.color.text.light}}}},M={styleOverrides:{root:{input:{padding:y.size.spacing.scale8,fontSize:y.size.font.label.default,height:y.size.spacing.scale16},"& .MuiInputAdornment-root":{button:{padding:"0 ".concat(y.size.spacing.scale8," 0 0"),backgroundColor:"transparent"},svg:{width:y.size.spacing.scale16,height:y.size.spacing.scale16}}}}},j={styleOverrides:{outlined:{notchedOutline:{borderColor:y.color.border.default}},root:{underline:{"&:before":{borderBottom:"none"},"&:after":{borderBottom:"none"},"&:hover":{borderBottom:"none"},"&&:hover::before":{border:"none"}}}}},B={styleOverrides:{root:{borderBottom:"1px solid ".concat(y.color.gray20)},indicator:{backgroundColor:y.color.primary}}},W={styleOverrides:{textColorPrimary:{textTransform:"none",minWidth:"auto",fontWeight:700,marginRight:"".concat(y.size.spacing.scale16),fontFamily:y.font.family.text,color:y.color.gray60,padding:"0 0 ".concat(y.size.spacing.scale16," 0"),"&:hover":{color:y.color.primary,opacity:1},"&$selected":{color:y.color.primary},"&:focus":{color:y.color.primary}}},defaultProps:{disableRipple:!0}};y.size.font.body.default,y.font.family.text,y.color.gray100,y.size.font.caption.default;var H,I,R,q,A={styleOverrides:{root:{fontWeight:y.font.weight.bold,lineHeight:y.font.lineHeight.medium,fontFamily:y.font.family.text,fontSize:y.size.font.caption.default,color:y.color.text.base,marginBottom:y.size.spacing.scale8}}},$=e.createTheme({typography:v({},E),palette:{background:{default:"#ffffff"},primary:{main:y.color.primary},secondary:{main:y.color.secondary},error:{main:y.color.error},info:{main:y.color.info},success:{main:y.color.success}},components:{MuiButton:C,MuiButtonBase:{defaultProps:{disableRipple:!0,disableTouchRipple:!0}},MuiContainer:{styleOverrides:{maxWidthLg:{"@media (min-width: 1280px)":{maxWidth:"1185px"}}}},MuiIconButton:w,MuiChip:k,MuiInput:j,MuiTextField:M,MuiFormLabel:A,MuiTabs:B,MuiTab:W,MuiAvatar:O,MuiCheckbox:T,MuiRadio:F,MuiSwitch:P,MuiSelect:L,MuiLink:{styleOverrides:{root:{cursor:"pointer"}}},MuiDivider:{styleOverrides:{root:{margin:"16px 0"}}},MuiFormControl:{styleOverrides:{root:{width:"100%"}}}}}),N=r.styled(e.CircularProgress)(R||(H=["\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: flex;\n align-items: center;\n justify-content: center;\n"],I=["\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: flex;\n align-items: center;\n justify-content: center;\n"],Object.defineProperty?Object.defineProperty(H,"raw",{value:I}):H.raw=I,R=H)),G={small:6,medium:8,large:12,fluid:12},V=function(t){var r=t.children,o=z(t,["children"]);return s.default.createElement(e.Box,v({},o),r)},_=function(t){var r=z(t,[]);return s.default.createElement(e.Checkbox,v({},r))},D=function(t){return s.default.createElement(e.Radio,v({},t))},X=function(t){return s.default.createElement(e.Switch,v({},t))},U=function(t){return s.default.createElement(e.Select,v({variant:"outlined"},t))},J=function(r){var o=r.type,n=z(r,["type"]),a=t.useState(!1),i=a[0],l=a[1],c=v(v({},n.InputProps),"password"===o&&{endAdornment:s.default.createElement(g.default,{position:"end"},s.default.createElement(h.default,{"aria-label":"toggle password visibility",onClick:function(){return l(!i)},edge:"end"},i?s.default.createElement(b.default,null):s.default.createElement(x.default,null)))});return s.default.createElement(e.TextField,v({},n,{type:i?"text":o,InputProps:c}))};function K(){return K=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e},K.apply(this,arguments)}var Q=function(e){return u.createElement("svg",K({viewBox:"0 0 24 24"},e),q||(q=u.createElement("path",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M12.141 4.894H3.576A1.977 1.977 0 0 0 1.6 6.871v14.494c0 1.09.885 1.976 1.976 1.976h14.495a1.977 1.977 0 0 0 1.976-1.976V12.8M17.412 1.6h4.94a.99.99 0 0 1 .99.988V7.53m-10.883 4.952L23.05 1.89"})))},Y=function(t){var r=t.children,o=z(t,["children"]);return s.default.createElement(e.Tabs,v({},o),r)},Z=function(t){var r=t.children,o=z(t,["children"]);return s.default.createElement(e.Tab,v({},o),r)},ee=function(e){var t=e.children,r=e.value,o=void 0===r?0:r,n=e.index,a=e.id;return s.default.createElement(V,{role:"tabpanel",hidden:o!==n,id:a},t)};exports.Avatar=function(t){var r=t.icon,o=t.firstName,n=void 0===o?"":o,a=t.lastName,i=void 0===a?"":a,l=z(t,["icon","firstName","lastName"]),c="".concat(n.substring(0,1)).concat(i.substring(0,1)).toLocaleUpperCase(),d=c?y.color.secondary:y.color.background.dark;return s.default.createElement(e.Avatar,v({sx:v({backgroundColor:d},l.sx)},l),c||r)},exports.Box=V,exports.Button=function(e){var t=e.color,r=void 0===t?"primary":t,o=e.variant,n=void 0===o?"contained":o,a=e.size,i=void 0===a?"medium":a,l=e.loading,c=e.children,d=z(e,["color","variant","size","loading","children"]);return s.default.createElement(p.default,v({size:i,variant:n,color:r,disabled:l},d),s.default.createElement("span",{style:{opacity:l?0:1}},c),l&&s.default.createElement(N,{size:20,color:"inherit"}))},exports.Checkbox=_,exports.Chip=function(t){var r=t.label,o=z(t,["label"]);return s.default.createElement(e.Chip,v({size:"small",label:r},o))},exports.Container=function(t){var r=t.component,o=void 0===r?"div":r,n=t.size,a=void 0===n?"large":n,i=t.children,l=z(t,["component","size","children"]),c="fluid"===a;return s.default.createElement(e.Container,v({component:o,disableGutters:c,maxWidth:!c&&"lg",sx:v({display:"flex",justifyContent:"center"},l.sx)},l),s.default.createElement(e.Grid,{container:!0,justifyContent:"center"},s.default.createElement(e.Grid,{item:!0,md:G[a]},i)))},exports.FormCheckbox=function(t){var r=t.id,o=t.required,n=void 0===o||o,a=t.data,i=t.label,l=t.error,c=t.helperText;return s.default.createElement(e.FormControl,null,s.default.createElement(e.FormLabel,{component:"label",error:l},i," ",n?"":s.default.createElement(e.Box,{component:"span",sx:{fontWeight:y.font.weight.normal,color:y.color.text.light}},"(optional)")),s.default.createElement(e.FormGroup,null,a.map((function(t,o){var n=t.value,a=t.label;return s.default.createElement(e.FormControlLabel,{key:o,value:n,label:a||"",sx:{fontSize:y.size.font.base,color:y.color.text.base},control:s.default.createElement(_,{color:"primary",inputProps:{"data-testid":"".concat(r,"-").concat(o)}})})}))),l&&s.default.createElement(e.FormHelperText,{sx:{marginLeft:0,marginRight:0},error:l},c))},exports.FormInput=function(t){var r=t.id,o=t.required,n=void 0===o||o,a=t.label,i=t.error,l=t.helperText,c=z(t,["id","required","label","error","helperText"]);return s.default.createElement(e.FormControl,null,s.default.createElement(e.FormLabel,{component:"label",error:i},a," ",!n&&s.default.createElement(e.Box,{component:"span",sx:{fontWeight:y.font.weight.normal,color:y.color.text.light}},"(optional)")),s.default.createElement(J,v({},c,{id:r,error:i,inputProps:{"data-testid":r}})),i&&s.default.createElement(e.FormHelperText,{sx:{marginLeft:0,marginRight:0},error:i},l))},exports.FormRadio=function(t){var r=t.id,o=t.helperText,n=t.label,a=t.error,i=t.required,l=void 0===i||i,c=t.name,d=t.data;return s.default.createElement(e.FormControl,{component:"fieldset",error:a},s.default.createElement(e.FormLabel,{component:"legend"},n," ",l?"":s.default.createElement(e.Box,{component:"span",sx:{fontWeight:y.font.weight.normal,color:y.color.text.light}},"(optional)")),s.default.createElement(e.RadioGroup,{"aria-label":c,name:c},d.map((function(t,o){var n=t.value,a=t.label;return s.default.createElement(e.FormControlLabel,{value:n,key:n,label:a||"",sx:{fontSize:y.size.font.base,color:y.color.text.base},control:s.default.createElement(D,{color:"primary",inputProps:{"data-testid":"".concat(r,"-").concat(o)}})})}))),a&&s.default.createElement(e.FormHelperText,{sx:{marginLeft:0,marginRight:0}},o))},exports.FormSelect=function(t){var r=t.id,o=t.required,n=void 0===o||o,a=t.options,i=t.label,l=t.error,c=t.placeholder,d=t.helperText,f=t.value;return s.default.createElement(e.FormControl,null,s.default.createElement(e.FormLabel,{component:"label",error:l},i," ",n?"":s.default.createElement(e.Box,{component:"span",sx:{fontWeight:y.font.weight.normal,color:y.color.text.light}},"(optional)")),s.default.createElement(U,{id:r,placeholder:c,error:l,value:f},a.map((function(t){return s.default.createElement(e.MenuItem,{key:t.value,value:t.value},t.text)}))),l&&s.default.createElement(e.FormHelperText,{sx:{marginLeft:0,marginRight:0},error:l},d))},exports.FormSwitch=function(t){var r=t.id,o=t.label,n=t.checked;return s.default.createElement(e.FormControl,null,s.default.createElement(e.FormLabel,{component:"label"},o),s.default.createElement(e.FormControlLabel,{control:s.default.createElement(X,{id:r}),label:"".concat(n?"Active":"Inactive")}))},exports.Input=J,exports.Link=function(t){var r,o=t.children,n=t.underline,a=void 0===n?"hover":n,i=t.toParentNavigation,l=z(t,["children","underline","toParentNavigation"]),c=null===(r=l.href)||void 0===r?void 0:r.startsWith("https"),d={variant:"caption",underline:a};return i?s.default.createElement(e.Link,v({},d,l,{onClick:function(){return e=i,void window.parent.postMessage({type:"NAVIGATION",content:e},"*");var e}}),o):s.default.createElement(e.Link,v({},d,c&&{target:"_blank",rel:"noopener noreferrer"},l),o,c&&s.default.createElement(e.SvgIcon,{component:Q,fontSize:"inherit",sx:{marginLeft:".25em"}}))},exports.Radio=D,exports.Select=U,exports.Switch=X,exports.Tab=Z,exports.TabGroup=function(e){var r=e.tabs,o=e.nameSpace,n=e.tabContentProps,a=e.tabsProps,i=t.useState(0),l=i[0],c=i[1],d=o?"".concat(o,"-"):"";return s.default.createElement(s.default.Fragment,null,s.default.createElement(Y,v({},a,{value:l,onChange:function(e,t){c(t)}}),r.map((function(e,t){return s.default.createElement(Z,{key:"".concat(d,"tab-").concat(t),label:e.label,"aria-controls":"".concat(d,"panel-").concat(t)})}))),s.default.createElement(V,v({},n),r.map((function(e,t){var r="".concat(d,"panel-").concat(t);return s.default.createElement(ee,{key:r,value:l,index:t,id:r,"aria-labelledby":"".concat(d,"tab-").concat(t)},e.content)}))))},exports.Tabs=Y,exports.Typography=function(e){var t=e.children,r=z(e,["children"]);return s.default.createElement(m.default,v({},r),t)},exports.UpComponentsProvider=function(t){return s.default.createElement(s.default.Fragment,null,s.default.createElement(e.CssBaseline,null),s.default.createElement(r.ThemeProvider,{theme:$},t.children))},exports.theme=$,exports.tokens=y,Object.keys(e).forEach((function(t){"default"===t||exports.hasOwnProperty(t)||Object.defineProperty(exports,t,{enumerable:!0,get:function(){return e[t]}})}));
@@ -10,4 +10,4 @@ export declare type FormSelectProps = MUIGlobalOmit<SelectProps, {
10
10
  error?: boolean;
11
11
  helperText?: string;
12
12
  }>;
13
- export declare const FormSelect: ({ id, required, options, label, error, placeholder, helperText, }: FormSelectProps) => JSX.Element;
13
+ export declare const FormSelect: ({ id, required, options, label, error, placeholder, helperText, value, }: FormSelectProps) => JSX.Element;
@@ -0,0 +1,18 @@
1
+ import { ReactNode } from 'react';
2
+ import { TabsProps } from '../Tabs/Tabs';
3
+ import { BoxProps } from '../Box/Box';
4
+ declare type tab = {
5
+ label: string | ReactNode;
6
+ content: string | ReactNode;
7
+ };
8
+ export declare type TabGroupProps = {
9
+ tabs: tab[];
10
+ tabContentProps?: BoxProps;
11
+ tabsProps?: TabsProps;
12
+ /**
13
+ * A unique value should be provided when multiple tabGroup components are used on the same page.
14
+ */
15
+ nameSpace?: string;
16
+ };
17
+ export declare const TabGroup: ({ tabs, nameSpace: _nameSpace, tabContentProps, tabsProps }: TabGroupProps) => JSX.Element;
18
+ export {};
@@ -0,0 +1,5 @@
1
+ import { Story, Meta } from '@storybook/react';
2
+ import { TabGroupProps } from './TabGroup';
3
+ declare const _default: Meta<import("@storybook/react").Args>;
4
+ export default _default;
5
+ export declare const SimpleTabNavigation: Story<TabGroupProps>;
@@ -0,0 +1,7 @@
1
+ /// <reference types="react" />
2
+ import { TabsProps as MuiTabsProps, TabProps as MuiTabProps } from '@mui/material';
3
+ import { MUIGlobalOmit } from '@global/utils/types';
4
+ export declare type TabsProps = MUIGlobalOmit<MuiTabsProps>;
5
+ export declare type TabProps = MUIGlobalOmit<MuiTabProps>;
6
+ export declare const Tabs: ({ children, ...props }: TabsProps) => JSX.Element;
7
+ export declare const Tab: ({ children, ...props }: TabProps) => JSX.Element;
@@ -1,2 +1,3 @@
1
1
  import { OverridesStyleRules } from '@mui/material/styles/overrides';
2
2
  export declare const MuiTabs: OverridesStyleRules;
3
+ export declare const MuiTab: OverridesStyleRules;
@@ -0,0 +1,4 @@
1
+ import { Story, Meta } from '@storybook/react';
2
+ declare const _default: Meta<import("@storybook/react").Args>;
3
+ export default _default;
4
+ export declare const Default: Story<Omit<import("@library").TabsProps<import("@library").ExtendButtonBase<import("@library").ButtonBaseTypeMap<{}, "button">>, {}>, "disableFocusRipple" | "disableRipple" | "classes" | "tabIndex" | "action" | "centerRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "disableElevation">>;
@@ -0,0 +1 @@
1
+ export {};
@@ -15,3 +15,5 @@ export { FormSelect } from './FormSelect/FormSelect';
15
15
  export { Input } from './Input/Input';
16
16
  export { FormInput } from './FormInput/FormInput';
17
17
  export { Link } from './Link/Link';
18
+ export { Tabs, Tab } from './Tabs/Tabs';
19
+ export { TabGroup } from './TabGroup/TabGroup';
@@ -1,5 +1,3 @@
1
1
  export * from './menuItem';
2
- export * from './tab';
3
2
  export * from './tablePagination';
4
- export * from './tabs';
5
3
  export * from './form/label';
@@ -3,4 +3,4 @@ export * from '@mui/material';
3
3
  export { tokens };
4
4
  export { UpComponentsProvider } from './global/UpComponentsProvider/UpComponentsProvider';
5
5
  export { theme } from './global/theme';
6
- export { Button, Typography, Chip, Avatar, Container, Box, Switch, FormSwitch, Checkbox, FormCheckbox, Radio, FormRadio, Select, FormSelect, Input, FormInput, Link, } from './components';
6
+ export { Button, Typography, Chip, Avatar, Container, Box, Switch, FormSwitch, Checkbox, FormCheckbox, Radio, FormRadio, Select, FormSelect, Input, FormInput, Link, Tabs, Tab, TabGroup, } from './components';
package/dist/esm/index.js CHANGED
@@ -1 +1 @@
1
- import{createTheme as e,CssBaseline as r,CircularProgress as o,Chip as t,Avatar as n,Container as i,Grid as a,Box as l,Checkbox as c,FormControl as d,FormLabel as s,FormGroup as f,FormControlLabel as m,FormHelperText as p,Radio as g,RadioGroup as u,Switch as h,Select as b,MenuItem as y,TextField as x,Link as v,SvgIcon as z}from"@mui/material";export*from"@mui/material";import*as k from"react";import E,{useState as S}from"react";import{ThemeProvider as w,styled as O}from"@mui/material/styles";import C from"@mui/material/Button";import T from"@mui/material/Typography";import M from"@mui/material/InputAdornment";import P from"@mui/material/IconButton";import W from"@mui/icons-material/VisibilityOutlined";import L from"@mui/icons-material/VisibilityOffOutlined";var F={animation:{speed:{normal:"0.5s",fast:"0.08s",slow:"1s"}},color:{background:{light:"#f4f5f7",dark:"#dfe1e6",indigo:"#262a59"},primary:"#262a59",secondary:"#d40fa9",info:"#262a59",error:"#e35656",success:"#aed581",indigo0:"#f4f4f6",indigo10:"#e9e9ee",indigo20:"#bdbfcd",indigo30:"#a8aabd",indigo40:"#9294ac",indigo50:"#7d7f9b",indigo60:"#67698a",indigo70:"#51557a",indigo80:"#3b3f69",indigo90:"#262a59",indigo100:"#161833",pink0:"#fff3ff",pink10:"#fedafd",pink20:"#fdc0fb",pink30:"#f98ef3",pink40:"#f362e8",pink50:"#ec3ed7",pink60:"#d40fa9",pink70:"#b0027c",pink80:"#990165",pink90:"#820050",pink100:"#390325",cyan0:"#f4ffff",cyan10:"#c6ffff",cyan20:"#96ffff",cyan30:"#59effc",cyan40:"#1dd7f0",cyan50:"#20b0c7",cyan60:"#1d8fa4",cyan70:"#167286",cyan80:"#0e5a6d",cyan90:"#064658",cyan100:"#103645",green0:"#f8fff4",green10:"#e2fccc",green20:"#e2fccc",green30:"#aed581",green40:"#8eaf65",green50:"#728f4b",green60:"#5a7533",green70:"#476020",green80:"#374e10",green90:"#2b3f05",green100:"#223300",red0:"#fff7f4",red10:"#ffe4db",red20:"#fcc4bb",red30:"#efa299",red40:"#e67e78",red50:"#e35656",red60:"#b83d3c",red70:"#922524",red80:"#6f1110",red90:"#500404",red100:"#330000",gray0:"#ffffff",gray10:"#f4f5f7",gray20:"#dfe1e6",gray30:"#c1c7d0",gray40:"#a8afba",gray50:"#9399a3",gray60:"#777c85",gray70:"#575b61",gray80:"#3c3e42",gray90:"#222426",gray100:"#121315",border:{default:"#dfe1e6"},shadow:{default:"#121315"},text:{base:"#121315",light:"#9399a3",inverted:"#ffffff",link:{default:"#20b0c7",visited:"#1d8fa4"}}},font:{family:{heading:"'Roboto Condensed', sans-serif",text:"'Source Sans Pro', sans-serif",code:"'Source Code Pro', monospace"},lineHeight:{medium:"1rem",large:"1.5rem",xlarge:"2rem",xxlarge:"3rem"},weight:{normal:400,bold:700}},size:{border:{radius:{default:"6px",small:"4px"},width:"1px"},font:{base:"16px",heading:{default:"1.728rem",small:"1.44rem",xsmall:"1rem"},overline:{large:"1.44rem",default:"0.833rem"},body:{default:"1rem"},caption:{default:"0.833rem",large:"1.44rem"},label:{default:"0.833rem",large:"1.44rem"},minorThird10:"6.192rem",minorThird9:"5.16rem",minorThird8:"4.3rem",minorThird7:"3.583rem",minorThird6:"2.986rem",minorThird5:"2.488rem",minorThird4:"2.074rem",minorThird3:"1.728rem",minorThird2:"1.44rem",minorThird1:"1.2rem",minorThird0:"1rem",minorThirdSub1:"0.833rem",minorThirdSub2:"0.694rem",minorThirdSub3:"0.579rem",minorThirdSub4:"0.482rem",minorThirdSub5:"0.402rem",minorThirdSub6:"0.335rem"},spacingXS:"8px",spacingS:"16px",spacingM:"24px",spacingL:"32px",spacingXL:"40px",spacingXXL:"48px",spacing:{main:"24px",section:"32px",header:"24px",article:"24px",paragraph:"16px",line:"8px",scale1:"1px",scale2:"2px",scale4:"4px",scale6:"6px",scale8:"8px",scale16:"16px",scale24:"24px",scale32:"32px",scale40:"40px",scale48:"48px",scale56:"56px",scale64:"64px",scale72:"72px",scale80:"80px",scale88:"88px",scale96:"96px",scale104:"104px",scale112:"112px",scale120:"120px",scale128:"128px",scale160:"160px",scale208:"208px"}}},H=function(){return H=Object.assign||function(e){for(var r,o=1,t=arguments.length;o<t;o++)for(var n in r=arguments[o])Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n]);return e},H.apply(this,arguments)};function I(e,r){var o={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&r.indexOf(t)<0&&(o[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(t=Object.getOwnPropertySymbols(e);n<t.length;n++)r.indexOf(t[n])<0&&Object.prototype.propertyIsEnumerable.call(e,t[n])&&(o[t[n]]=e[t[n]])}return o}var B={styleOverrides:{root:{fontSize:"12px",fontWeight:600,fontFamily:F.font.family.text,"& .MuiChip-icon":{width:"12px",height:"12px",marginLeft:F.size.spacing.scale8}},colorDefault:{backgroundColor:F.color.gray10,color:F.color.gray60},colorPrimary:{backgroundColor:F.color.indigo10,color:F.color.indigo80},colorSecondary:{backgroundColor:F.color.pink10,color:F.color.pink80},colorError:{backgroundColor:F.color.red10,color:F.color.error},colorInfo:{backgroundColor:F.color.indigo10,color:F.color.indigo80},colorSuccess:{backgroundColor:F.color.green10,color:F.color.green80}}},j={h1:{fontFamily:F.font.family.heading,fontSize:F.size.font.heading.default,fontWeight:F.font.weight.bold,lineHeight:F.font.lineHeight.xlarge},h2:{fontFamily:F.font.family.heading,fontSize:F.size.font.heading.small,fontWeight:F.font.weight.bold,lineHeight:F.font.lineHeight.xlarge},h3:{fontFamily:F.font.family.heading,fontSize:F.size.font.heading.xsmall,fontWeight:F.font.weight.bold,lineHeight:F.font.lineHeight.large},body1:{fontFamily:F.font.family.text,fontSize:F.size.font.body.default,fontWeight:F.font.weight.normal,lineHeight:F.font.lineHeight.large},body2:{fontFamily:F.font.family.text,fontSize:F.size.font.body.default,fontWeight:F.font.weight.bold,lineHeight:F.font.lineHeight.large},caption:{fontFamily:F.font.family.text,fontSize:F.size.font.caption.default,fontWeight:F.font.weight.normal,lineHeight:F.font.lineHeight.medium},overline:{fontFamily:F.font.family.heading,fontSize:F.size.font.overline.default,letterSpacing:"initial",fontWeight:F.font.weight.bold,color:F.color.gray60}},R={small:"".concat(F.size.spacing.scale4," ").concat(F.size.spacing.scale8),medium:"".concat(F.size.spacing.scale8," ").concat(F.size.spacing.scale16),large:"".concat(F.size.spacing.scale16," ").concat(F.size.spacing.scale32)},$={styleOverrides:{root:{textTransform:"none",lineHeight:F.size.spacing.scale16,fontWeight:F.font.weight.bold,fontFamily:F.font.family.text},contained:{padding:R.medium},containedSizeSmall:{padding:R.small},containedSizeLarge:{padding:R.large},text:{padding:R.medium},textSizeSmall:{padding:R.small},textSizeLarge:{padding:R.large},outlined:{padding:"7px ".concat(F.size.spacing.scale16)},outlinedSizeSmall:{padding:R.small},outlinedSizeLarge:{padding:R.large},sizeSmall:{fontSize:F.size.font.label.default},sizeLarge:{fontSize:F.size.font.label.large},startIcon:{"& svg":{fill:"currentColor",width:"12px",height:"12px"}},endIcon:{"& svg":{fill:"currentColor",width:"12px",height:"12px"}}},defaultProps:{disableFocusRipple:!0},MuiIconButton:{root:{"&&:hover":{backgroundColor:"transparent"}}}},A={styleOverrides:{root:{color:F.color.gray60,backgroundColor:F.color.background.dark},sizeSmall:{padding:"3px"}}},N={styleOverrides:{root:{fontFamily:F.font.family.text,fontSize:F.size.font.label.default,fontWeight:F.font.weight.bold,width:F.size.spacing.scale24,height:F.size.spacing.scale24,"& .MuiSvgIcon-root":{width:F.size.spacing.scale16}},colorDefault:{backgroundColor:F.color.background.dark,"& .MuiSvgIcon-root":{color:F.color.gray60}}}},q={styleOverrides:{root:{paddingTop:4,paddingBottom:4,color:F.color.border.default,"& svg":{width:"16px",height:"16px"},"&&:hover":{backgroundColor:"transparent"}},colorPrimary:{"&$checked":{"&&:hover":{backgroundColor:"transparent"}}},colorSecondary:{"&$checked":{color:F.color.primary},"&$disabled":{opacity:.5}}}},V={styleOverrides:{root:{paddingTop:4,paddingBottom:4,color:F.color.border.default,"& svg":{width:"16px",height:"16px"},"&:hover":{background:"none"}}}},X={styleOverrides:{root:{marginRight:16},colorSecondary:{color:F.color.gray0,"&$checked":{color:F.color.gray0,left:2,"&:hover":{backgroundColor:"transparent"}},"&$disabled":{color:F.color.gray0}},track:{position:"absolute",width:48,height:24,borderRadius:12,opacity:1,left:"calc(50% - 48px/2)",top:"calc(50% - 24px/2)",backgroundColor:F.color.background.light,border:"2px solid ".concat(F.color.border.default),boxSizing:"border-box","$checked$checked + &":{opacity:1,backgroundColor:F.color.primary,border:"2px solid ".concat(F.color.primary)},"$disabled$disabled + &":{opacity:.5,cursor:"not-allowed"}},thumb:{boxShadow:"none"}}},D={styleOverrides:{outlined:{position:"relative",padding:F.size.spacing.scale8,fontSize:F.size.font.label.default,borderRadius:F.size.spacing.scale6,width:"100%","&.Mui-disabled":{backgroundColor:F.color.background.dark,color:F.color.text.light}}}},G={styleOverrides:{root:{input:{padding:F.size.spacing.scale8,fontSize:F.size.font.label.default,height:F.size.spacing.scale16},"& .MuiInputAdornment-root":{button:{padding:"0 ".concat(F.size.spacing.scale8," 0 0"),backgroundColor:"transparent"},svg:{width:F.size.spacing.scale16,height:F.size.spacing.scale16}}}}},U={styleOverrides:{outlined:{notchedOutline:{borderColor:F.color.border.default}},root:{underline:{"&:before":{borderBottom:"none"},"&:after":{borderBottom:"none"},"&:hover":{borderBottom:"none"},"&&:hover::before":{border:"none"}}}}};F.size.font.body.default,F.font.family.text,F.color.gray100;var _={styleOverrides:{textColorPrimary:{textTransform:"none",minWidth:"auto",fontWeight:700,marginRight:"".concat(F.size.spacing.scale16),fontFamily:F.font.family.text,color:F.color.gray60,padding:"0 0 ".concat(F.size.spacing.scale16," 0"),"&:hover":{color:F.color.primary,opacity:1},"&$selected":{color:F.color.primary},"&:focus":{color:F.color.primary}}},defaultProps:{disableRipple:!0}};F.size.font.caption.default;var J,K,Q,Y,Z={styleOverrides:{root:{borderBottom:"1px solid ".concat(F.color.gray20)},indicator:{backgroundColor:F.color.primary}}},ee={styleOverrides:{root:{fontWeight:F.font.weight.bold,lineHeight:F.font.lineHeight.medium,fontFamily:F.font.family.text,fontSize:F.size.font.caption.default,color:F.color.text.base,marginBottom:F.size.spacing.scale8}}},re=e({typography:H({},j),palette:{background:{default:"#ffffff"},primary:{main:F.color.primary},secondary:{main:F.color.secondary},error:{main:F.color.error},info:{main:F.color.info},success:{main:F.color.success}},components:{MuiButton:$,MuiButtonBase:{defaultProps:{disableRipple:!0,disableTouchRipple:!0}},MuiContainer:{styleOverrides:{maxWidthLg:{"@media (min-width: 1280px)":{maxWidth:"1185px"}}}},MuiIconButton:A,MuiChip:B,MuiInput:U,MuiTextField:G,MuiFormLabel:ee,MuiTabs:Z,MuiTab:_,MuiAvatar:N,MuiCheckbox:q,MuiRadio:V,MuiSwitch:X,MuiSelect:D,MuiLink:{styleOverrides:{root:{cursor:"pointer"}}},MuiDivider:{styleOverrides:{root:{margin:"16px 0"}}},MuiFormControl:{styleOverrides:{root:{width:"100%"}}}}}),oe=function(e){return E.createElement(E.Fragment,null,E.createElement(r,null),E.createElement(w,{theme:re},e.children))},te=O(o)(Q||(J=["\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: flex;\n align-items: center;\n justify-content: center;\n"],K=["\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: flex;\n align-items: center;\n justify-content: center;\n"],Object.defineProperty?Object.defineProperty(J,"raw",{value:K}):J.raw=K,Q=J)),ne=function(e){var r=e.color,o=void 0===r?"primary":r,t=e.variant,n=void 0===t?"contained":t,i=e.size,a=void 0===i?"medium":i,l=e.loading,c=e.children,d=I(e,["color","variant","size","loading","children"]);return E.createElement(C,H({size:a,variant:n,color:o,disabled:l},d),E.createElement("span",{style:{opacity:l?0:1}},c),l&&E.createElement(te,{size:20,color:"inherit"}))},ie=function(e){var r=e.children,o=I(e,["children"]);return E.createElement(T,H({},o),r)},ae=function(e){var r=e.label,o=I(e,["label"]);return E.createElement(t,H({size:"small",label:r},o))},le=function(e){var r=e.icon,o=e.firstName,t=void 0===o?"":o,i=e.lastName,a=void 0===i?"":i,l=I(e,["icon","firstName","lastName"]),c="".concat(t.substring(0,1)).concat(a.substring(0,1)).toLocaleUpperCase(),d=c?F.color.secondary:F.color.background.dark;return E.createElement(n,H({sx:H({backgroundColor:d},l.sx)},l),c||r)},ce={small:6,medium:8,large:12,fluid:12},de=function(e){var r=e.component,o=void 0===r?"div":r,t=e.size,n=void 0===t?"large":t,l=e.children,c=I(e,["component","size","children"]),d="fluid"===n;return E.createElement(i,H({component:o,disableGutters:d,maxWidth:!d&&"lg",sx:H({display:"flex",justifyContent:"center"},c.sx)},c),E.createElement(a,{container:!0,justifyContent:"center"},E.createElement(a,{item:!0,md:ce[n]},l)))},se=function(e){var r=e.children,o=I(e,["children"]);return E.createElement(l,H({},o),r)},fe=function(e){var r=I(e,[]);return E.createElement(c,H({},r))},me=function(e){var r=e.id,o=e.required,t=void 0===o||o,n=e.data,i=e.label,a=e.error,c=e.helperText;return E.createElement(d,null,E.createElement(s,{component:"label",error:a},i," ",t?"":E.createElement(l,{component:"span",sx:{fontWeight:F.font.weight.normal,color:F.color.text.light}},"(optional)")),E.createElement(f,null,n.map((function(e,o){var t=e.value,n=e.label;return E.createElement(m,{key:o,value:t,label:n||"",sx:{fontSize:F.size.font.base,color:F.color.text.base},control:E.createElement(fe,{color:"primary",inputProps:{"data-testid":"".concat(r,"-").concat(o)}})})}))),a&&E.createElement(p,{sx:{marginLeft:0,marginRight:0},error:a},c))},pe=function(e){return E.createElement(g,H({},e))},ge=function(e){var r=e.id,o=e.helperText,t=e.label,n=e.error,i=e.required,a=void 0===i||i,c=e.name,f=e.data;return E.createElement(d,{component:"fieldset",error:n},E.createElement(s,{component:"legend"},t," ",a?"":E.createElement(l,{component:"span",sx:{fontWeight:F.font.weight.normal,color:F.color.text.light}},"(optional)")),E.createElement(u,{"aria-label":c,name:c},f.map((function(e,o){var t=e.value,n=e.label;return E.createElement(m,{value:t,key:t,label:n||"",sx:{fontSize:F.size.font.base,color:F.color.text.base},control:E.createElement(pe,{color:"primary",inputProps:{"data-testid":"".concat(r,"-").concat(o)}})})}))),n&&E.createElement(p,{sx:{marginLeft:0,marginRight:0}},o))},ue=function(e){return E.createElement(h,H({},e))},he=function(e){var r=e.id,o=e.label,t=e.checked;return E.createElement(d,null,E.createElement(s,{component:"label"},o),E.createElement(m,{control:E.createElement(ue,{id:r}),label:"".concat(t?"Active":"Inactive")}))},be=function(e){return E.createElement(b,H({variant:"outlined"},e))},ye=function(e){var r=e.id,o=e.required,t=void 0===o||o,n=e.options,i=e.label,a=e.error,c=e.placeholder,f=e.helperText;return E.createElement(d,null,E.createElement(s,{component:"label",error:a},i," ",t?"":E.createElement(l,{component:"span",sx:{fontWeight:F.font.weight.normal,color:F.color.text.light}},"(optional)")),E.createElement(be,{id:r,placeholder:c,error:a},n.map((function(e){return E.createElement(y,{key:e.value,value:e.value},e.text)}))),a&&E.createElement(p,{sx:{marginLeft:0,marginRight:0},error:a},f))},xe=function(e){var r=e.type,o=I(e,["type"]),t=S(!1),n=t[0],i=t[1],a=H(H({},o.InputProps),"password"===r&&{endAdornment:E.createElement(M,{position:"end"},E.createElement(P,{"aria-label":"toggle password visibility",onClick:function(){return i(!n)},edge:"end"},n?E.createElement(W,null):E.createElement(L,null)))});return E.createElement(x,H({},o,{type:n?"text":r,InputProps:a}))},ve=function(e){var r=e.id,o=e.required,t=void 0===o||o,n=e.label,i=e.error,a=e.helperText,c=I(e,["id","required","label","error","helperText"]);return E.createElement(d,null,E.createElement(s,{component:"label",error:i},n," ",!t&&E.createElement(l,{component:"span",sx:{fontWeight:F.font.weight.normal,color:F.color.text.light}},"(optional)")),E.createElement(xe,H({},c,{id:r,error:i,inputProps:{"data-testid":r}})),i&&E.createElement(p,{sx:{marginLeft:0,marginRight:0},error:i},a))};function ze(){return ze=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var o=arguments[r];for(var t in o)Object.prototype.hasOwnProperty.call(o,t)&&(e[t]=o[t])}return e},ze.apply(this,arguments)}var ke=function(e){return k.createElement("svg",ze({viewBox:"0 0 24 24"},e),Y||(Y=k.createElement("path",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M12.141 4.894H3.576A1.977 1.977 0 0 0 1.6 6.871v14.494c0 1.09.885 1.976 1.976 1.976h14.495a1.977 1.977 0 0 0 1.976-1.976V12.8M17.412 1.6h4.94a.99.99 0 0 1 .99.988V7.53m-10.883 4.952L23.05 1.89"})))},Ee=function(e){var r,o=e.children,t=e.underline,n=void 0===t?"hover":t,i=e.toParentNavigation,a=I(e,["children","underline","toParentNavigation"]),l=null===(r=a.href)||void 0===r?void 0:r.startsWith("https"),c={variant:"caption",underline:n};return i?E.createElement(v,H({},c,a,{onClick:function(){return e=i,void window.parent.postMessage({type:"NAVIGATION",content:e},"*");var e}}),o):E.createElement(v,H({},c,l&&{target:"_blank",rel:"noopener noreferrer"},a),o,l&&E.createElement(z,{component:ke,fontSize:"inherit",sx:{marginLeft:".25em"}}))};export{le as Avatar,se as Box,ne as Button,fe as Checkbox,ae as Chip,de as Container,me as FormCheckbox,ve as FormInput,ge as FormRadio,ye as FormSelect,he as FormSwitch,xe as Input,Ee as Link,pe as Radio,be as Select,ue as Switch,ie as Typography,oe as UpComponentsProvider,re as theme,F as tokens};
1
+ import{createTheme as e,CssBaseline as r,CircularProgress as o,Chip as t,Avatar as n,Container as i,Grid as a,Box as l,Checkbox as c,FormControl as d,FormLabel as s,FormGroup as f,FormControlLabel as m,FormHelperText as p,Radio as g,RadioGroup as u,Switch as h,Select as b,MenuItem as y,TextField as x,Link as v,SvgIcon as z,Tabs as k,Tab as E}from"@mui/material";export*from"@mui/material";import*as S from"react";import w,{useState as C}from"react";import{ThemeProvider as O,styled as T}from"@mui/material/styles";import M from"@mui/material/Button";import P from"@mui/material/Typography";import W from"@mui/material/InputAdornment";import L from"@mui/material/IconButton";import F from"@mui/icons-material/VisibilityOutlined";import H from"@mui/icons-material/VisibilityOffOutlined";var I={animation:{speed:{normal:"0.5s",fast:"0.08s",slow:"1s"}},color:{background:{light:"#f4f5f7",dark:"#dfe1e6",indigo:"#262a59"},primary:"#262a59",secondary:"#d40fa9",info:"#262a59",error:"#e35656",success:"#aed581",indigo0:"#f4f4f6",indigo10:"#e9e9ee",indigo20:"#bdbfcd",indigo30:"#a8aabd",indigo40:"#9294ac",indigo50:"#7d7f9b",indigo60:"#67698a",indigo70:"#51557a",indigo80:"#3b3f69",indigo90:"#262a59",indigo100:"#161833",pink0:"#fff3ff",pink10:"#fedafd",pink20:"#fdc0fb",pink30:"#f98ef3",pink40:"#f362e8",pink50:"#ec3ed7",pink60:"#d40fa9",pink70:"#b0027c",pink80:"#990165",pink90:"#820050",pink100:"#390325",cyan0:"#f4ffff",cyan10:"#c6ffff",cyan20:"#96ffff",cyan30:"#59effc",cyan40:"#1dd7f0",cyan50:"#20b0c7",cyan60:"#1d8fa4",cyan70:"#167286",cyan80:"#0e5a6d",cyan90:"#064658",cyan100:"#103645",green0:"#f8fff4",green10:"#e2fccc",green20:"#e2fccc",green30:"#aed581",green40:"#8eaf65",green50:"#728f4b",green60:"#5a7533",green70:"#476020",green80:"#374e10",green90:"#2b3f05",green100:"#223300",red0:"#fff7f4",red10:"#ffe4db",red20:"#fcc4bb",red30:"#efa299",red40:"#e67e78",red50:"#e35656",red60:"#b83d3c",red70:"#922524",red80:"#6f1110",red90:"#500404",red100:"#330000",gray0:"#ffffff",gray10:"#f4f5f7",gray20:"#dfe1e6",gray30:"#c1c7d0",gray40:"#a8afba",gray50:"#9399a3",gray60:"#777c85",gray70:"#575b61",gray80:"#3c3e42",gray90:"#222426",gray100:"#121315",border:{default:"#dfe1e6"},shadow:{default:"#121315"},text:{base:"#121315",light:"#9399a3",inverted:"#ffffff",link:{default:"#20b0c7",visited:"#1d8fa4"}}},font:{family:{heading:"'Roboto Condensed', sans-serif",text:"'Source Sans Pro', sans-serif",code:"'Source Code Pro', monospace"},lineHeight:{medium:"1rem",large:"1.5rem",xlarge:"2rem",xxlarge:"3rem"},weight:{normal:400,bold:700}},size:{border:{radius:{default:"6px",small:"4px"},width:"1px"},font:{base:"16px",heading:{default:"1.728rem",small:"1.44rem",xsmall:"1rem"},overline:{large:"1.44rem",default:"0.833rem"},body:{default:"1rem"},caption:{default:"0.833rem",large:"1.44rem"},label:{default:"0.833rem",large:"1.44rem"},minorThird10:"6.192rem",minorThird9:"5.16rem",minorThird8:"4.3rem",minorThird7:"3.583rem",minorThird6:"2.986rem",minorThird5:"2.488rem",minorThird4:"2.074rem",minorThird3:"1.728rem",minorThird2:"1.44rem",minorThird1:"1.2rem",minorThird0:"1rem",minorThirdSub1:"0.833rem",minorThirdSub2:"0.694rem",minorThirdSub3:"0.579rem",minorThirdSub4:"0.482rem",minorThirdSub5:"0.402rem",minorThirdSub6:"0.335rem"},spacingXS:"8px",spacingS:"16px",spacingM:"24px",spacingL:"32px",spacingXL:"40px",spacingXXL:"48px",spacing:{main:"24px",section:"32px",header:"24px",article:"24px",paragraph:"16px",line:"8px",scale1:"1px",scale2:"2px",scale4:"4px",scale6:"6px",scale8:"8px",scale16:"16px",scale24:"24px",scale32:"32px",scale40:"40px",scale48:"48px",scale56:"56px",scale64:"64px",scale72:"72px",scale80:"80px",scale88:"88px",scale96:"96px",scale104:"104px",scale112:"112px",scale120:"120px",scale128:"128px",scale160:"160px",scale208:"208px"}}},B=function(){return B=Object.assign||function(e){for(var r,o=1,t=arguments.length;o<t;o++)for(var n in r=arguments[o])Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n]);return e},B.apply(this,arguments)};function j(e,r){var o={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&r.indexOf(t)<0&&(o[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(t=Object.getOwnPropertySymbols(e);n<t.length;n++)r.indexOf(t[n])<0&&Object.prototype.propertyIsEnumerable.call(e,t[n])&&(o[t[n]]=e[t[n]])}return o}var R={styleOverrides:{root:{fontSize:"12px",fontWeight:600,fontFamily:I.font.family.text,"& .MuiChip-icon":{width:"12px",height:"12px",marginLeft:I.size.spacing.scale8}},colorDefault:{backgroundColor:I.color.gray10,color:I.color.gray60},colorPrimary:{backgroundColor:I.color.indigo10,color:I.color.indigo80},colorSecondary:{backgroundColor:I.color.pink10,color:I.color.pink80},colorError:{backgroundColor:I.color.red10,color:I.color.error},colorInfo:{backgroundColor:I.color.indigo10,color:I.color.indigo80},colorSuccess:{backgroundColor:I.color.green10,color:I.color.green80}}},$={h1:{fontFamily:I.font.family.heading,fontSize:I.size.font.heading.default,fontWeight:I.font.weight.bold,lineHeight:I.font.lineHeight.xlarge},h2:{fontFamily:I.font.family.heading,fontSize:I.size.font.heading.small,fontWeight:I.font.weight.bold,lineHeight:I.font.lineHeight.xlarge},h3:{fontFamily:I.font.family.heading,fontSize:I.size.font.heading.xsmall,fontWeight:I.font.weight.bold,lineHeight:I.font.lineHeight.large},body1:{fontFamily:I.font.family.text,fontSize:I.size.font.body.default,fontWeight:I.font.weight.normal,lineHeight:I.font.lineHeight.large},body2:{fontFamily:I.font.family.text,fontSize:I.size.font.body.default,fontWeight:I.font.weight.bold,lineHeight:I.font.lineHeight.large},caption:{fontFamily:I.font.family.text,fontSize:I.size.font.caption.default,fontWeight:I.font.weight.normal,lineHeight:I.font.lineHeight.medium},overline:{fontFamily:I.font.family.heading,fontSize:I.size.font.overline.default,letterSpacing:"initial",fontWeight:I.font.weight.bold,color:I.color.gray60}},A={small:"".concat(I.size.spacing.scale4," ").concat(I.size.spacing.scale8),medium:"".concat(I.size.spacing.scale8," ").concat(I.size.spacing.scale16),large:"".concat(I.size.spacing.scale16," ").concat(I.size.spacing.scale32)},N={styleOverrides:{root:{textTransform:"none",lineHeight:I.size.spacing.scale16,fontWeight:I.font.weight.bold,fontFamily:I.font.family.text},contained:{padding:A.medium},containedSizeSmall:{padding:A.small},containedSizeLarge:{padding:A.large},text:{padding:A.medium},textSizeSmall:{padding:A.small},textSizeLarge:{padding:A.large},outlined:{padding:"7px ".concat(I.size.spacing.scale16)},outlinedSizeSmall:{padding:A.small},outlinedSizeLarge:{padding:A.large},sizeSmall:{fontSize:I.size.font.label.default},sizeLarge:{fontSize:I.size.font.label.large},startIcon:{"& svg":{fill:"currentColor",width:"12px",height:"12px"}},endIcon:{"& svg":{fill:"currentColor",width:"12px",height:"12px"}}},defaultProps:{disableFocusRipple:!0},MuiIconButton:{root:{"&&:hover":{backgroundColor:"transparent"}}}},q={styleOverrides:{root:{color:I.color.gray60,backgroundColor:I.color.background.dark},sizeSmall:{padding:"3px"}}},V={styleOverrides:{root:{fontFamily:I.font.family.text,fontSize:I.size.font.label.default,fontWeight:I.font.weight.bold,width:I.size.spacing.scale24,height:I.size.spacing.scale24,"& .MuiSvgIcon-root":{width:I.size.spacing.scale16}},colorDefault:{backgroundColor:I.color.background.dark,"& .MuiSvgIcon-root":{color:I.color.gray60}}}},X={styleOverrides:{root:{paddingTop:4,paddingBottom:4,color:I.color.border.default,"& svg":{width:"16px",height:"16px"},"&&:hover":{backgroundColor:"transparent"}},colorPrimary:{"&$checked":{"&&:hover":{backgroundColor:"transparent"}}},colorSecondary:{"&$checked":{color:I.color.primary},"&$disabled":{opacity:.5}}}},D={styleOverrides:{root:{paddingTop:4,paddingBottom:4,color:I.color.border.default,"& svg":{width:"16px",height:"16px"},"&:hover":{background:"none"}}}},G={styleOverrides:{root:{marginRight:16},colorSecondary:{color:I.color.gray0,"&$checked":{color:I.color.gray0,left:2,"&:hover":{backgroundColor:"transparent"}},"&$disabled":{color:I.color.gray0}},track:{position:"absolute",width:48,height:24,borderRadius:12,opacity:1,left:"calc(50% - 48px/2)",top:"calc(50% - 24px/2)",backgroundColor:I.color.background.light,border:"2px solid ".concat(I.color.border.default),boxSizing:"border-box","$checked$checked + &":{opacity:1,backgroundColor:I.color.primary,border:"2px solid ".concat(I.color.primary)},"$disabled$disabled + &":{opacity:.5,cursor:"not-allowed"}},thumb:{boxShadow:"none"}}},U={styleOverrides:{outlined:{position:"relative",padding:I.size.spacing.scale8,fontSize:I.size.font.label.default,borderRadius:I.size.spacing.scale6,width:"100%","&.Mui-disabled":{backgroundColor:I.color.background.dark,color:I.color.text.light}}}},_={styleOverrides:{root:{input:{padding:I.size.spacing.scale8,fontSize:I.size.font.label.default,height:I.size.spacing.scale16},"& .MuiInputAdornment-root":{button:{padding:"0 ".concat(I.size.spacing.scale8," 0 0"),backgroundColor:"transparent"},svg:{width:I.size.spacing.scale16,height:I.size.spacing.scale16}}}}},J={styleOverrides:{outlined:{notchedOutline:{borderColor:I.color.border.default}},root:{underline:{"&:before":{borderBottom:"none"},"&:after":{borderBottom:"none"},"&:hover":{borderBottom:"none"},"&&:hover::before":{border:"none"}}}}},K={styleOverrides:{root:{borderBottom:"1px solid ".concat(I.color.gray20)},indicator:{backgroundColor:I.color.primary}}},Q={styleOverrides:{textColorPrimary:{textTransform:"none",minWidth:"auto",fontWeight:700,marginRight:"".concat(I.size.spacing.scale16),fontFamily:I.font.family.text,color:I.color.gray60,padding:"0 0 ".concat(I.size.spacing.scale16," 0"),"&:hover":{color:I.color.primary,opacity:1},"&$selected":{color:I.color.primary},"&:focus":{color:I.color.primary}}},defaultProps:{disableRipple:!0}};I.size.font.body.default,I.font.family.text,I.color.gray100,I.size.font.caption.default;var Y,Z,ee,re,oe={styleOverrides:{root:{fontWeight:I.font.weight.bold,lineHeight:I.font.lineHeight.medium,fontFamily:I.font.family.text,fontSize:I.size.font.caption.default,color:I.color.text.base,marginBottom:I.size.spacing.scale8}}},te=e({typography:B({},$),palette:{background:{default:"#ffffff"},primary:{main:I.color.primary},secondary:{main:I.color.secondary},error:{main:I.color.error},info:{main:I.color.info},success:{main:I.color.success}},components:{MuiButton:N,MuiButtonBase:{defaultProps:{disableRipple:!0,disableTouchRipple:!0}},MuiContainer:{styleOverrides:{maxWidthLg:{"@media (min-width: 1280px)":{maxWidth:"1185px"}}}},MuiIconButton:q,MuiChip:R,MuiInput:J,MuiTextField:_,MuiFormLabel:oe,MuiTabs:K,MuiTab:Q,MuiAvatar:V,MuiCheckbox:X,MuiRadio:D,MuiSwitch:G,MuiSelect:U,MuiLink:{styleOverrides:{root:{cursor:"pointer"}}},MuiDivider:{styleOverrides:{root:{margin:"16px 0"}}},MuiFormControl:{styleOverrides:{root:{width:"100%"}}}}}),ne=function(e){return w.createElement(w.Fragment,null,w.createElement(r,null),w.createElement(O,{theme:te},e.children))},ie=T(o)(ee||(Y=["\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: flex;\n align-items: center;\n justify-content: center;\n"],Z=["\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 2;\n display: flex;\n align-items: center;\n justify-content: center;\n"],Object.defineProperty?Object.defineProperty(Y,"raw",{value:Z}):Y.raw=Z,ee=Y)),ae=function(e){var r=e.color,o=void 0===r?"primary":r,t=e.variant,n=void 0===t?"contained":t,i=e.size,a=void 0===i?"medium":i,l=e.loading,c=e.children,d=j(e,["color","variant","size","loading","children"]);return w.createElement(M,B({size:a,variant:n,color:o,disabled:l},d),w.createElement("span",{style:{opacity:l?0:1}},c),l&&w.createElement(ie,{size:20,color:"inherit"}))},le=function(e){var r=e.children,o=j(e,["children"]);return w.createElement(P,B({},o),r)},ce=function(e){var r=e.label,o=j(e,["label"]);return w.createElement(t,B({size:"small",label:r},o))},de=function(e){var r=e.icon,o=e.firstName,t=void 0===o?"":o,i=e.lastName,a=void 0===i?"":i,l=j(e,["icon","firstName","lastName"]),c="".concat(t.substring(0,1)).concat(a.substring(0,1)).toLocaleUpperCase(),d=c?I.color.secondary:I.color.background.dark;return w.createElement(n,B({sx:B({backgroundColor:d},l.sx)},l),c||r)},se={small:6,medium:8,large:12,fluid:12},fe=function(e){var r=e.component,o=void 0===r?"div":r,t=e.size,n=void 0===t?"large":t,l=e.children,c=j(e,["component","size","children"]),d="fluid"===n;return w.createElement(i,B({component:o,disableGutters:d,maxWidth:!d&&"lg",sx:B({display:"flex",justifyContent:"center"},c.sx)},c),w.createElement(a,{container:!0,justifyContent:"center"},w.createElement(a,{item:!0,md:se[n]},l)))},me=function(e){var r=e.children,o=j(e,["children"]);return w.createElement(l,B({},o),r)},pe=function(e){var r=j(e,[]);return w.createElement(c,B({},r))},ge=function(e){var r=e.id,o=e.required,t=void 0===o||o,n=e.data,i=e.label,a=e.error,c=e.helperText;return w.createElement(d,null,w.createElement(s,{component:"label",error:a},i," ",t?"":w.createElement(l,{component:"span",sx:{fontWeight:I.font.weight.normal,color:I.color.text.light}},"(optional)")),w.createElement(f,null,n.map((function(e,o){var t=e.value,n=e.label;return w.createElement(m,{key:o,value:t,label:n||"",sx:{fontSize:I.size.font.base,color:I.color.text.base},control:w.createElement(pe,{color:"primary",inputProps:{"data-testid":"".concat(r,"-").concat(o)}})})}))),a&&w.createElement(p,{sx:{marginLeft:0,marginRight:0},error:a},c))},ue=function(e){return w.createElement(g,B({},e))},he=function(e){var r=e.id,o=e.helperText,t=e.label,n=e.error,i=e.required,a=void 0===i||i,c=e.name,f=e.data;return w.createElement(d,{component:"fieldset",error:n},w.createElement(s,{component:"legend"},t," ",a?"":w.createElement(l,{component:"span",sx:{fontWeight:I.font.weight.normal,color:I.color.text.light}},"(optional)")),w.createElement(u,{"aria-label":c,name:c},f.map((function(e,o){var t=e.value,n=e.label;return w.createElement(m,{value:t,key:t,label:n||"",sx:{fontSize:I.size.font.base,color:I.color.text.base},control:w.createElement(ue,{color:"primary",inputProps:{"data-testid":"".concat(r,"-").concat(o)}})})}))),n&&w.createElement(p,{sx:{marginLeft:0,marginRight:0}},o))},be=function(e){return w.createElement(h,B({},e))},ye=function(e){var r=e.id,o=e.label,t=e.checked;return w.createElement(d,null,w.createElement(s,{component:"label"},o),w.createElement(m,{control:w.createElement(be,{id:r}),label:"".concat(t?"Active":"Inactive")}))},xe=function(e){return w.createElement(b,B({variant:"outlined"},e))},ve=function(e){var r=e.id,o=e.required,t=void 0===o||o,n=e.options,i=e.label,a=e.error,c=e.placeholder,f=e.helperText,m=e.value;return w.createElement(d,null,w.createElement(s,{component:"label",error:a},i," ",t?"":w.createElement(l,{component:"span",sx:{fontWeight:I.font.weight.normal,color:I.color.text.light}},"(optional)")),w.createElement(xe,{id:r,placeholder:c,error:a,value:m},n.map((function(e){return w.createElement(y,{key:e.value,value:e.value},e.text)}))),a&&w.createElement(p,{sx:{marginLeft:0,marginRight:0},error:a},f))},ze=function(e){var r=e.type,o=j(e,["type"]),t=C(!1),n=t[0],i=t[1],a=B(B({},o.InputProps),"password"===r&&{endAdornment:w.createElement(W,{position:"end"},w.createElement(L,{"aria-label":"toggle password visibility",onClick:function(){return i(!n)},edge:"end"},n?w.createElement(F,null):w.createElement(H,null)))});return w.createElement(x,B({},o,{type:n?"text":r,InputProps:a}))},ke=function(e){var r=e.id,o=e.required,t=void 0===o||o,n=e.label,i=e.error,a=e.helperText,c=j(e,["id","required","label","error","helperText"]);return w.createElement(d,null,w.createElement(s,{component:"label",error:i},n," ",!t&&w.createElement(l,{component:"span",sx:{fontWeight:I.font.weight.normal,color:I.color.text.light}},"(optional)")),w.createElement(ze,B({},c,{id:r,error:i,inputProps:{"data-testid":r}})),i&&w.createElement(p,{sx:{marginLeft:0,marginRight:0},error:i},a))};function Ee(){return Ee=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var o=arguments[r];for(var t in o)Object.prototype.hasOwnProperty.call(o,t)&&(e[t]=o[t])}return e},Ee.apply(this,arguments)}var Se=function(e){return S.createElement("svg",Ee({viewBox:"0 0 24 24"},e),re||(re=S.createElement("path",{fill:"none",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M12.141 4.894H3.576A1.977 1.977 0 0 0 1.6 6.871v14.494c0 1.09.885 1.976 1.976 1.976h14.495a1.977 1.977 0 0 0 1.976-1.976V12.8M17.412 1.6h4.94a.99.99 0 0 1 .99.988V7.53m-10.883 4.952L23.05 1.89"})))},we=function(e){var r,o=e.children,t=e.underline,n=void 0===t?"hover":t,i=e.toParentNavigation,a=j(e,["children","underline","toParentNavigation"]),l=null===(r=a.href)||void 0===r?void 0:r.startsWith("https"),c={variant:"caption",underline:n};return i?w.createElement(v,B({},c,a,{onClick:function(){return e=i,void window.parent.postMessage({type:"NAVIGATION",content:e},"*");var e}}),o):w.createElement(v,B({},c,l&&{target:"_blank",rel:"noopener noreferrer"},a),o,l&&w.createElement(z,{component:Se,fontSize:"inherit",sx:{marginLeft:".25em"}}))},Ce=function(e){var r=e.children,o=j(e,["children"]);return w.createElement(k,B({},o),r)},Oe=function(e){var r=e.children,o=j(e,["children"]);return w.createElement(E,B({},o),r)},Te=function(e){var r=e.children,o=e.value,t=void 0===o?0:o,n=e.index,i=e.id;return w.createElement(me,{role:"tabpanel",hidden:t!==n,id:i},r)},Me=function(e){var r=e.tabs,o=e.nameSpace,t=e.tabContentProps,n=e.tabsProps,i=C(0),a=i[0],l=i[1],c=o?"".concat(o,"-"):"";return w.createElement(w.Fragment,null,w.createElement(Ce,B({},n,{value:a,onChange:function(e,r){l(r)}}),r.map((function(e,r){return w.createElement(Oe,{key:"".concat(c,"tab-").concat(r),label:e.label,"aria-controls":"".concat(c,"panel-").concat(r)})}))),w.createElement(me,B({},t),r.map((function(e,r){var o="".concat(c,"panel-").concat(r);return w.createElement(Te,{key:o,value:a,index:r,id:o,"aria-labelledby":"".concat(c,"tab-").concat(r)},e.content)}))))};export{de as Avatar,me as Box,ae as Button,pe as Checkbox,ce as Chip,fe as Container,ge as FormCheckbox,ke as FormInput,he as FormRadio,ve as FormSelect,ye as FormSwitch,ze as Input,we as Link,ue as Radio,xe as Select,be as Switch,Oe as Tab,Me as TabGroup,Ce as Tabs,le as Typography,ne as UpComponentsProvider,te as theme,I as tokens};
@@ -10,4 +10,4 @@ export declare type FormSelectProps = MUIGlobalOmit<SelectProps, {
10
10
  error?: boolean;
11
11
  helperText?: string;
12
12
  }>;
13
- export declare const FormSelect: ({ id, required, options, label, error, placeholder, helperText, }: FormSelectProps) => JSX.Element;
13
+ export declare const FormSelect: ({ id, required, options, label, error, placeholder, helperText, value, }: FormSelectProps) => JSX.Element;
@@ -0,0 +1,18 @@
1
+ import { ReactNode } from 'react';
2
+ import { TabsProps } from '../Tabs/Tabs';
3
+ import { BoxProps } from '../Box/Box';
4
+ declare type tab = {
5
+ label: string | ReactNode;
6
+ content: string | ReactNode;
7
+ };
8
+ export declare type TabGroupProps = {
9
+ tabs: tab[];
10
+ tabContentProps?: BoxProps;
11
+ tabsProps?: TabsProps;
12
+ /**
13
+ * A unique value should be provided when multiple tabGroup components are used on the same page.
14
+ */
15
+ nameSpace?: string;
16
+ };
17
+ export declare const TabGroup: ({ tabs, nameSpace: _nameSpace, tabContentProps, tabsProps }: TabGroupProps) => JSX.Element;
18
+ export {};
@@ -0,0 +1,5 @@
1
+ import { Story, Meta } from '@storybook/react';
2
+ import { TabGroupProps } from './TabGroup';
3
+ declare const _default: Meta<import("@storybook/react").Args>;
4
+ export default _default;
5
+ export declare const SimpleTabNavigation: Story<TabGroupProps>;
@@ -0,0 +1,7 @@
1
+ /// <reference types="react" />
2
+ import { TabsProps as MuiTabsProps, TabProps as MuiTabProps } from '@mui/material';
3
+ import { MUIGlobalOmit } from '@global/utils/types';
4
+ export declare type TabsProps = MUIGlobalOmit<MuiTabsProps>;
5
+ export declare type TabProps = MUIGlobalOmit<MuiTabProps>;
6
+ export declare const Tabs: ({ children, ...props }: TabsProps) => JSX.Element;
7
+ export declare const Tab: ({ children, ...props }: TabProps) => JSX.Element;
@@ -1,2 +1,3 @@
1
1
  import { OverridesStyleRules } from '@mui/material/styles/overrides';
2
2
  export declare const MuiTabs: OverridesStyleRules;
3
+ export declare const MuiTab: OverridesStyleRules;
@@ -0,0 +1,4 @@
1
+ import { Story, Meta } from '@storybook/react';
2
+ declare const _default: Meta<import("@storybook/react").Args>;
3
+ export default _default;
4
+ export declare const Default: Story<Omit<import("@library").TabsProps<import("@library").ExtendButtonBase<import("@library").ButtonBaseTypeMap<{}, "button">>, {}>, "disableFocusRipple" | "disableRipple" | "classes" | "tabIndex" | "action" | "centerRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "disableElevation">>;
@@ -0,0 +1 @@
1
+ export {};
@@ -15,3 +15,5 @@ export { FormSelect } from './FormSelect/FormSelect';
15
15
  export { Input } from './Input/Input';
16
16
  export { FormInput } from './FormInput/FormInput';
17
17
  export { Link } from './Link/Link';
18
+ export { Tabs, Tab } from './Tabs/Tabs';
19
+ export { TabGroup } from './TabGroup/TabGroup';
@@ -1,5 +1,3 @@
1
1
  export * from './menuItem';
2
- export * from './tab';
3
2
  export * from './tablePagination';
4
- export * from './tabs';
5
3
  export * from './form/label';
@@ -3,4 +3,4 @@ export * from '@mui/material';
3
3
  export { tokens };
4
4
  export { UpComponentsProvider } from './global/UpComponentsProvider/UpComponentsProvider';
5
5
  export { theme } from './global/theme';
6
- export { Button, Typography, Chip, Avatar, Container, Box, Switch, FormSwitch, Checkbox, FormCheckbox, Radio, FormRadio, Select, FormSelect, Input, FormInput, Link, } from './components';
6
+ export { Button, Typography, Chip, Avatar, Container, Box, Switch, FormSwitch, Checkbox, FormCheckbox, Radio, FormRadio, Select, FormSelect, Input, FormInput, Link, Tabs, Tab, TabGroup, } from './components';
package/dist/index.d.ts CHANGED
@@ -1,11 +1,11 @@
1
1
  /// <reference types="react" />
2
2
  export { default as tokens } from '@up42/design-system-tokens/dist/json/tokens.json';
3
3
  import * as _mui_material from '@mui/material';
4
- import { ChipProps as ChipProps$1, AvatarProps as AvatarProps$1, ContainerProps as ContainerProps$1, BoxProps as BoxProps$1, CheckboxProps as CheckboxProps$1, RadioProps as RadioProps$1, RadioGroupProps, SwitchProps as SwitchProps$1, SelectProps as SelectProps$1, TextFieldProps, LinkProps as LinkProps$1 } from '@mui/material';
4
+ import { ChipProps as ChipProps$1, AvatarProps as AvatarProps$1, ContainerProps as ContainerProps$1, BoxProps as BoxProps$1, CheckboxProps as CheckboxProps$1, RadioProps as RadioProps$1, RadioGroupProps, SwitchProps as SwitchProps$1, SelectProps as SelectProps$1, TextFieldProps, LinkProps as LinkProps$1, TabsProps as TabsProps$1, TabProps as TabProps$1 } from '@mui/material';
5
5
  export * from '@mui/material';
6
6
  import { ThemeProviderProps } from '@mui/material/styles/ThemeProvider';
7
7
  import { ButtonProps as ButtonProps$1 } from '@mui/material/Button';
8
- import React, { HTMLInputTypeAttribute } from 'react';
8
+ import React, { HTMLInputTypeAttribute, ReactNode } from 'react';
9
9
  import { TypographyProps as TypographyProps$1 } from '@mui/material/Typography';
10
10
 
11
11
  declare const UpComponentsProvider: (props: Omit<ThemeProviderProps, 'theme'>) => JSX.Element;
@@ -130,7 +130,7 @@ declare type FormSelectProps = MUIGlobalOmit<SelectProps, {
130
130
  error?: boolean;
131
131
  helperText?: string;
132
132
  }>;
133
- declare const FormSelect: ({ id, required, options, label, error, placeholder, helperText, }: FormSelectProps) => JSX.Element;
133
+ declare const FormSelect: ({ id, required, options, label, error, placeholder, helperText, value, }: FormSelectProps) => JSX.Element;
134
134
 
135
135
  declare type InputProps = MUIGlobalOmit<TextFieldProps> & {
136
136
  type?: HTMLInputTypeAttribute;
@@ -175,4 +175,24 @@ declare type LinkProps<C extends React.ElementType> = LinkProps$1<C, {
175
175
  */
176
176
  declare const Link: <C extends React.ElementType<any>>({ children, underline, toParentNavigation, ...props }: LinkProps<C>) => JSX.Element;
177
177
 
178
- export { Avatar, Box, Button, Checkbox, Chip, Container, FormCheckbox, FormInput, FormRadio, FormSelect, FormSwitch, Input, Link, Radio, Select, Switch, Typography, UpComponentsProvider, theme };
178
+ declare type TabsProps = MUIGlobalOmit<TabsProps$1>;
179
+ declare type TabProps = MUIGlobalOmit<TabProps$1>;
180
+ declare const Tabs: ({ children, ...props }: TabsProps) => JSX.Element;
181
+ declare const Tab: ({ children, ...props }: TabProps) => JSX.Element;
182
+
183
+ declare type tab = {
184
+ label: string | ReactNode;
185
+ content: string | ReactNode;
186
+ };
187
+ declare type TabGroupProps = {
188
+ tabs: tab[];
189
+ tabContentProps?: BoxProps;
190
+ tabsProps?: TabsProps;
191
+ /**
192
+ * A unique value should be provided when multiple tabGroup components are used on the same page.
193
+ */
194
+ nameSpace?: string;
195
+ };
196
+ declare const TabGroup: ({ tabs, nameSpace: _nameSpace, tabContentProps, tabsProps }: TabGroupProps) => JSX.Element;
197
+
198
+ export { Avatar, Box, Button, Checkbox, Chip, Container, FormCheckbox, FormInput, FormRadio, FormSelect, FormSwitch, Input, Link, Radio, Select, Switch, Tab, TabGroup, Tabs, Typography, UpComponentsProvider, theme };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@up42/up-components",
3
- "version": "0.2.1",
3
+ "version": "0.2.2",
4
4
  "description": "UP42 Component Library",
5
5
  "author": "Axel Fuhrmann axel.fuhrmann@up42.com",
6
6
  "license": "ISC",
@@ -1,2 +0,0 @@
1
- import { OverridesStyleRules } from '@mui/material/styles/overrides';
2
- export declare const MuiTab: OverridesStyleRules;
@@ -1,2 +0,0 @@
1
- import { OverridesStyleRules } from '@mui/material/styles/overrides';
2
- export declare const MuiTab: OverridesStyleRules;