@up42/up-components 0.0.4 → 0.1.1

package/README.md

@@ -2,9 +2,9 @@
 
 UP42's Shared Component Library. This is a cross-team collaborative package that enables us to reuse React components across different projects. The package uses [Storybook](https://storybook.js.org/docs/react/get-started/introduction) to organize and document UI components, and is based on [MUI](https://mui.com/getting-started/usage/) for theming and most of the APIs.
 
-Up Components library provides react components based on [UP42's design system](https://www.figma.com/file/Qd9QmAdQfcsWe3xSKtJWX9FZ/Design-System?node-id=12565%3A3972)
+Up Components library provides react components based on [UP42's design system](https://www.figma.com/file/Qd9QmAdQfcsWe3xSKtJWX9FZ/Design-System)
 
-# Getting Started
+## Getting Started
 
 ```bash
 $ npm install @up42/up-components
@@ -46,7 +46,7 @@ You can also import components from the `@mui/material` directly from the packag
 
 **Note:** UP Components currently exports all [MUI components](https://mui.com/components/) on top of our custom ones. Which means that the existing MUI documentation can be used for any component not yet documented on our own [Storybook](https://up-components.up42.dev/). In case of conflicts, our custom documentation prevails over MUI.
 
-# Developing in the up-components package
+## Developing in the up-components package
 
 This package uses [Rollup](https://github.com/rollup/rollup) for building `esm` and `cjs` modules.
 [npm](https://www.npmjs.com/) version 7 or higher is required install and build the components locally. Yarn is not supported for development as it currently does not properly handle peer dependencies.
@@ -82,6 +82,13 @@ src
 
 Components and filenames must use the `UpperCamelCase` pattern. For components that already exist on MUI, using the exact same name is preferred so that they override the MUI export.
 
+Import paths to internal modules always have to be relative:
+
+```diff
+- import { MyUtil } from 'global/utils'
++ import { MyUtil } from '../../global/utils'
+```
+
 ### Testing @up42/up-components locally
 
 In order to test the components without publishing a new version, you can use [Yalc](https://github.com/wclr/yalc) to publish the package locally and install it on your app.
@@ -106,11 +113,40 @@ $ yalc add @up42/up-components
 
 This should install the local version of `@up42/up-components` in your application so you can test new components before publishing a new version.
 
-## Publishing new versions
+### Design System Tokens 
+[UP42 tokens](https://github.com/up42/design-system-tokens) are also exposed as part of UpComponents.
 
-A new version is published whenever the version in `package.json` is updated.
+
+```diff
+- import tokens from '@up42/constellation-tokens/dist/json/tokens.json'
++ import { tokens } from "@up42/up-components"
+```
+
+## Publishing new versions
 We are using [Semantic Versioning](https://semver.org/) for controlling each release.
 
-- MAJOR version when you make incompatible API changes,
-- MINOR version when you add functionality in a backwards compatible manner, and
-- PATCH version when you make backwards compatible bug fixes.
+- `MAJOR` version when you make incompatible API changes,
+- `MINOR` version when you add functionality in a backwards compatible manner, and
+- `PATCH` version when you make backwards compatible bug fixes.
+
+### How should I write my commits?
+We follow the [Conventional Commit](https://www.conventionalcommits.org) specification. The most important prefixes you should have in mind are:
+
+- `fix`: which represents bug fixes, and correlates to a SemVer `PATCH`.
+- `feat`: which represents a new feature, and correlates to a SemVer `MINOR`.
+- `feat|fix!`: which represent a breaking change (indicated by the `!`) and will result in a SemVer `MAJOR`.
+
+Other prefixes like `chore:`, `refactor:`, `test:`, etc. can be used, but won't be included in the `CHANGELOG.md` file.
+
+### Usage
+
+```bash
+$ npm run release
+```
+
+This command is going to:
+- bump the version in `package.json` and `package-lock.json`.
+- output changes to `CHANGELOG.md`.
+- commit `package-lock.json` and `package.json` and `CHANGELOG.md`.
+
+We use [Standard Version](https://github.com/conventional-changelog/standard-version) for the automated releasing PR commit. 

package/dist/cjs/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@mui/material"),r=require("react"),a=require("@mui/material/styles"),o=require("@mui/material/Button"),t=require("@mui/material/Typography");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=i(r),d=i(o),l=i(t),c=function(){return c=Object.assign||function(e){for(var r,a=1,o=arguments.length;a<o;a++)for(var t in r=arguments[a])Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t]);return e},c.apply(this,arguments)};function s(e,r){var a={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&r.indexOf(o)<0&&(a[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var t=0;for(o=Object.getOwnPropertySymbols(e);t<o.length;t++)r.indexOf(o[t])<0&&Object.prototype.propertyIsEnumerable.call(e,o[t])&&(a[o[t]]=e[o[t]])}return a}var f,m,g,u={background:{light:"#f4f5f7",dark:"#dfe1e6",indigo:"#262a59"},base:{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 "},brand:{darkMatter:"#262a59",titanPink:"#d40fa9",planetBlue:"#1dd7f0",greenEarth:"#aed581"},shadow:{default:"#121315"},text:{base:"#121315",light:"#9399a3",inverted:"#ffffff",link:{default:"#20b0c7",visited:"#1d8fa4"}},utility:{active:"#20b0c7",danger:"#e35656",info:"#262a59",success:"#aed581"}},p={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}},b={border:{radius:{default:"0.375rem",small:"0.25rem"},width:"0.0625rem"},font:{base:"16px",heading:{default:"1.728rem",small:"1.44rem",xsmall:"16px"},overline:{large:"1.44rem",default:"0.833rem"},body:{default:"16px"},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:"16px",minorThirdSub1:"0.833rem",minorThirdSub2:"0.694rem",minorThirdSub3:"0.579rem",minorThirdSub4:"0.482rem",minorThirdSub5:"0.402rem",minorThirdSub6:"0.335rem"},spacing:{main:"1.5rem",section:"2rem",header:"1.5rem",article:"1.5rem",paragraph:"1rem",line:"0.5rem",scale1:"0.0625rem",scale2:"0.125rem",scale4:"0.25rem",scale6:"0.375rem",scale8:"0.5rem",scale16:"1rem",scale24:"1.5rem",scale32:"2rem",scale40:"2.5rem",scale48:"3rem",scale56:"3.5rem",scale64:"4rem",scale80:"5rem",scale88:"5.5rem",scale104:"6.5rem",scale112:"7rem",scale120:"7.5rem",scale128:"8rem",scale160:"10rem",scale208:"13rem"}},h={styleOverrides:{root:{fontSize:"12px",fontWeight:600,fontFamily:p.family.text,"& .MuiChip-icon":{width:"12px",height:"12px",marginLeft:b.spacing.scale8}},colorDefault:{backgroundColor:u.base.gray10,color:u.base.gray60},colorPrimary:{backgroundColor:u.base.indigo10,color:u.base.indigo80},colorSecondary:{backgroundColor:u.base.pink10,color:u.base.pink80},colorError:{backgroundColor:u.base.red10,color:u.base.red50},colorInfo:{backgroundColor:u.base.indigo10,color:u.base.indigo80},colorSuccess:{backgroundColor:u.base.green10,color:u.base.green80}}},y={h1:{fontFamily:p.family.heading,fontSize:b.font.heading.default,fontWeight:700},h2:{fontFamily:p.family.heading,fontSize:b.font.heading.small,fontWeight:700},h3:{fontFamily:p.family.heading,fontSize:b.font.heading.xsmall,fontWeight:700},body1:{fontFamily:p.family.text,fontSize:b.font.body.default},body2:{fontFamily:p.family.text,fontSize:b.font.body.default,fontWeight:700},caption:{fontFamily:p.family.text,fontSize:b.font.caption.default},overline:{fontFamily:p.family.heading,fontSize:b.font.overline.default,letterSpacing:"initial",fontWeight:700,color:u.base.gray60}},x={small:"".concat(b.spacing.scale4," ").concat(b.spacing.scale8),medium:"".concat(b.spacing.scale8," ").concat(b.spacing.scale16),large:"".concat(b.spacing.scale16," ").concat(b.spacing.scale32)},v={styleOverrides:{root:{textTransform:"none",lineHeight:b.spacing.scale16,fontWeight:p.weight.bold,fontFamily:p.family.text},contained:{padding:x.medium},containedSizeSmall:{padding:x.small},containedSizeLarge:{padding:x.large},text:{padding:x.medium},textSizeSmall:{padding:x.small},textSizeLarge:{padding:x.large},outlined:{padding:"7px ".concat(b.spacing.scale16)},outlinedSizeSmall:{padding:x.small},outlinedSizeLarge:{padding:x.large},sizeSmall:{fontSize:b.font.label.default},sizeLarge:{fontSize:b.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"}}}},k={styleOverrides:{root:{color:u.base.gray60,backgroundColor:u.background.dark},sizeSmall:{padding:"3px"}}},S={styleOverrides:{root:{fontFamily:p.family.text,fontSize:b.font.label.default,fontWeight:p.weight.bold,width:b.spacing.scale24,height:b.spacing.scale24,"& .MuiSvgIcon-root":{width:b.spacing.scale16}},colorDefault:{backgroundColor:u.background.dark,"& .MuiSvgIcon-root":{color:u.base.gray60}}}},C={styleOverrides:{textColorPrimary:{textTransform:"none",minWidth:"auto",fontWeight:700,marginRight:"".concat(b.spacing.scale16),fontFamily:p.family.text,color:u.base.gray60,padding:"0 0 ".concat(b.spacing.scale16," 0"),"&:hover":{color:u.brand.darkMatter,opacity:1},"&$selected":{color:u.brand.darkMatter},"&:focus":{color:u.brand.darkMatter}}},defaultProps:{disableRipple:!0}},O={styleOverrides:{root:{borderBottom:"1px solid ".concat(u.base.gray20)},indicator:{backgroundColor:u.brand.darkMatter}}},z={styleOverrides:{root:{paddingTop:4,paddingBottom:4,color:u.border.default,"& svg":{width:"16px",height:"16px"},"&&:hover":{backgroundColor:"transparent"}},colorPrimary:{"&$checked":{"&&:hover":{backgroundColor:"transparent"}}},colorSecondary:{"&$checked":{color:u.brand.darkMatter},"&$disabled":{opacity:.5}}}},M={styleOverrides:{outlined:{notchedOutline:{borderColor:u.border.default}},root:{underline:{"&:before":{borderBottom:"none"},"&:after":{borderBottom:"none"},"&:hover":{borderBottom:"none"},"&&:hover::before":{border:"none"}}}}},T={styleOverrides:{root:{fontWeight:p.weight.bold,lineHeight:p.lineHeight.medium,fontFamily:p.family.text,fontSize:b.font.caption.default,color:u.text.base,marginBottom:b.spacing.scale8}}},w={styleOverrides:{colorPrimary:{"&$checked":{"&:hover":{backgroundColor:"transparent"}}},root:{paddingTop:4,paddingBottom:4,color:u.border.default,"& svg":{width:"16px",height:"16px"}}}},P={styleOverrides:{root:{marginRight:16},colorSecondary:{color:u.base.gray0,"&$checked":{color:u.base.gray0,left:2,"&:hover":{backgroundColor:"transparent"}},"&$disabled":{color:u.base.gray0}},track:{position:"absolute",width:48,height:24,borderRadius:12,opacity:1,left:"calc(50% - 48px/2)",top:"calc(50% - 24px/2)",backgroundColor:u.background.light,border:"2px solid ".concat(u.border.default),boxSizing:"border-box","$checked$checked + &":{opacity:1,backgroundColor:u.brand.darkMatter,border:"2px solid ".concat(u.brand.darkMatter)},"$disabled$disabled + &":{opacity:.5,cursor:"not-allowed"}},thumb:{boxShadow:"none"}}},F=e.createTheme({typography:c({},y),palette:{background:{default:"#ffffff"},primary:{main:u.brand.darkMatter},secondary:{main:u.brand.titanPink},error:{main:u.utility.danger},info:{main:u.utility.info},success:{main:u.base.green60}},components:{MuiButton:v,MuiButtonBase:{defaultProps:{disableRipple:!0,disableTouchRipple:!0}},MuiContainer:{styleOverrides:{maxWidthLg:{"@media (min-width: 1280px)":{maxWidth:"1185px"}}}},MuiIconButton:k,MuiChip:h,MuiInput:M,MuiFormLabel:T,MuiTabs:O,MuiTab:C,MuiAvatar:S,MuiCheckbox:z,MuiRadio:w,MuiSwitch:P,MuiLink:{styleOverrides:{root:{textDecoration:"none","&:hover":{textDecoration:"underline"}}}},MuiDivider:{styleOverrides:{root:{margin:"16px 0"}}}}}),j=a.styled(e.CircularProgress)(g||(f=["\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"],m=["\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(f,"raw",{value:m}):f.raw=m,g=f)),B={small:6,medium:8,large:12,fluid:12};exports.Avatar=function(r){var a=r.icon,o=r.firstName,t=void 0===o?"":o,i=r.lastName,d=void 0===i?"":i,l=s(r,["icon","firstName","lastName"]),f="".concat(t.substring(0,1)).concat(d.substring(0,1)).toLocaleUpperCase(),m=f?u.brand.titanPink:u.background.dark;return n.default.createElement(e.Avatar,c({sx:c({backgroundColor:m},l.sx)},l),f||a)},exports.Button=function(e){var r=e.color,a=void 0===r?"primary":r,o=e.variant,t=void 0===o?"contained":o,i=e.size,l=void 0===i?"medium":i,f=e.loading,m=e.children,g=s(e,["color","variant","size","loading","children"]);return n.default.createElement(d.default,c({size:l,variant:t,color:a,disabled:f},g),n.default.createElement("span",{style:{opacity:f?0:1}},m),f&&n.default.createElement(j,{size:20,color:"inherit"}))},exports.Chip=function(r){var a=r.label,o=s(r,["label"]);return n.default.createElement(e.Chip,c({size:"small",label:a},o))},exports.Container=function(r){var a=r.component,o=void 0===a?"div":a,t=r.size,i=void 0===t?"large":t,d=r.children,l=s(r,["component","size","children"]),f="fluid"===i;return n.default.createElement(e.Container,c({component:o,disableGutters:f,maxWidth:!f&&"lg",sx:c({display:"flex",justifyContent:"center"},l.sx)},l),n.default.createElement(e.Grid,{container:!0,justifyContent:"center"},n.default.createElement(e.Grid,{item:!0,md:B[i]},d)))},exports.Typography=function(e){var r=e.children,a=s(e,["children"]);return n.default.createElement(l.default,c({},a),r)},exports.UpComponentsProvider=function(e){return n.default.createElement(a.ThemeProvider,{theme:F},e.children)},exports.theme=F,Object.keys(e).forEach((function(r){"default"===r||exports.hasOwnProperty(r)||Object.defineProperty(exports,r,{enumerable:!0,get:function(){return e[r]}})}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@up42/design-system-tokens/dist/json/tokens.json"),t=require("@mui/material"),o=require("react"),a=require("@mui/material/styles"),r=require("@mui/material/Button"),l=require("@mui/material/Typography"),n=require("@mui/material/InputAdornment"),i=require("@mui/material/IconButton"),d=require("@mui/material/utils"),u=require("react/jsx-runtime");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var f=c(e),s=c(o),m=c(r),p=c(l),g=c(n),b=c(i),h=c(d),x=c(u),y=function(){return y=Object.assign||function(e){for(var t,o=1,a=arguments.length;o<a;o++)for(var r in t=arguments[o])Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r]);return e},y.apply(this,arguments)};function v(e,t){var o={};for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&t.indexOf(a)<0&&(o[a]=e[a]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(a=Object.getOwnPropertySymbols(e);r<a.length;r++)t.indexOf(a[r])<0&&Object.prototype.propertyIsEnumerable.call(e,a[r])&&(o[a[r]]=e[a[r]])}return o}var z={styleOverrides:{root:{fontSize:"12px",fontWeight:600,fontFamily:f.default.font.family.text,"& .MuiChip-icon":{width:"12px",height:"12px",marginLeft:f.default.size.spacing.scale8}},colorDefault:{backgroundColor:f.default.color.base.gray10,color:f.default.color.base.gray60},colorPrimary:{backgroundColor:f.default.color.base.indigo10,color:f.default.color.base.indigo80},colorSecondary:{backgroundColor:f.default.color.base.pink10,color:f.default.color.base.pink80},colorError:{backgroundColor:f.default.color.base.red10,color:f.default.color.base.red50},colorInfo:{backgroundColor:f.default.color.base.indigo10,color:f.default.color.base.indigo80},colorSuccess:{backgroundColor:f.default.color.base.green10,color:f.default.color.base.green80}}},k={h1:{fontFamily:f.default.font.family.heading,fontSize:f.default.size.font.heading.default,fontWeight:f.default.font.weight.bold,lineHeight:f.default.font.lineHeight.xlarge},h2:{fontFamily:f.default.font.family.heading,fontSize:f.default.size.font.heading.small,fontWeight:f.default.font.weight.bold,lineHeight:f.default.font.lineHeight.xlarge},h3:{fontFamily:f.default.font.family.heading,fontSize:f.default.size.font.heading.xsmall,fontWeight:f.default.font.weight.bold,lineHeight:f.default.font.lineHeight.large},body1:{fontFamily:f.default.font.family.text,fontSize:f.default.size.font.body.default,fontWeight:f.default.font.weight.normal,lineHeight:f.default.font.lineHeight.large},body2:{fontFamily:f.default.font.family.text,fontSize:f.default.size.font.body.default,fontWeight:f.default.font.weight.bold,lineHeight:f.default.font.lineHeight.large},caption:{fontFamily:f.default.font.family.text,fontSize:f.default.size.font.caption.default,fontWeight:f.default.font.weight.normal,lineHeight:f.default.font.lineHeight.medium},overline:{fontFamily:f.default.font.family.heading,fontSize:f.default.size.font.overline.default,letterSpacing:"initial",fontWeight:f.default.font.weight.bold,color:f.default.color.base.gray60}},C={small:"".concat(f.default.size.spacing.scale4," ").concat(f.default.size.spacing.scale8),medium:"".concat(f.default.size.spacing.scale8," ").concat(f.default.size.spacing.scale16),large:"".concat(f.default.size.spacing.scale16," ").concat(f.default.size.spacing.scale32)},E={styleOverrides:{root:{textTransform:"none",lineHeight:f.default.size.spacing.scale16,fontWeight:f.default.font.weight.bold,fontFamily:f.default.font.family.text},contained:{padding:C.medium},containedSizeSmall:{padding:C.small},containedSizeLarge:{padding:C.large},text:{padding:C.medium},textSizeSmall:{padding:C.small},textSizeLarge:{padding:C.large},outlined:{padding:"7px ".concat(f.default.size.spacing.scale16)},outlinedSizeSmall:{padding:C.small},outlinedSizeLarge:{padding:C.large},sizeSmall:{fontSize:f.default.size.font.label.default},sizeLarge:{fontSize:f.default.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"}}}},S={styleOverrides:{root:{color:f.default.color.base.gray60,backgroundColor:f.default.color.background.dark},sizeSmall:{padding:"3px"}}},O={styleOverrides:{root:{fontFamily:f.default.font.family.text,fontSize:f.default.size.font.label.default,fontWeight:f.default.font.weight.bold,width:f.default.size.spacing.scale24,height:f.default.size.spacing.scale24,"& .MuiSvgIcon-root":{width:f.default.size.spacing.scale16}},colorDefault:{backgroundColor:f.default.color.background.dark,"& .MuiSvgIcon-root":{color:f.default.color.base.gray60}}}},w={styleOverrides:{root:{paddingTop:4,paddingBottom:4,color:f.default.color.border.default,"& svg":{width:"16px",height:"16px"},"&&:hover":{backgroundColor:"transparent"}},colorPrimary:{"&$checked":{"&&:hover":{backgroundColor:"transparent"}}},colorSecondary:{"&$checked":{color:f.default.color.brand.darkMatter},"&$disabled":{opacity:.5}}}},M={styleOverrides:{root:{paddingTop:4,paddingBottom:4,color:f.default.color.border.default,"& svg":{width:"16px",height:"16px"},"&:hover":{background:"none"}}}},F={styleOverrides:{root:{marginRight:16},colorSecondary:{color:f.default.color.base.gray0,"&$checked":{color:f.default.color.base.gray0,left:2,"&:hover":{backgroundColor:"transparent"}},"&$disabled":{color:f.default.color.base.gray0}},track:{position:"absolute",width:48,height:24,borderRadius:12,opacity:1,left:"calc(50% - 48px/2)",top:"calc(50% - 24px/2)",backgroundColor:f.default.color.background.light,border:"2px solid ".concat(f.default.color.border.default),boxSizing:"border-box","$checked$checked + &":{opacity:1,backgroundColor:f.default.color.brand.darkMatter,border:"2px solid ".concat(f.default.color.brand.darkMatter)},"$disabled$disabled + &":{opacity:.5,cursor:"not-allowed"}},thumb:{boxShadow:"none"}}},P={styleOverrides:{outlined:{position:"relative",padding:f.default.size.spacing.scale8,fontSize:f.default.size.font.label.default,borderRadius:f.default.size.spacing.scale6,width:"100%","&.Mui-disabled":{backgroundColor:f.default.color.background.dark,color:f.default.color.text.light}}}},j={styleOverrides:{root:{input:{padding:f.default.size.spacing.scale8,fontSize:f.default.size.font.label.default,height:f.default.size.spacing.scale16},"& .MuiInputAdornment-root":{button:{padding:"0 ".concat(f.default.size.spacing.scale8," 0 0"),backgroundColor:"transparent"},svg:{width:f.default.size.spacing.scale16,height:f.default.size.spacing.scale16}}}}},L={styleOverrides:{outlined:{notchedOutline:{borderColor:f.default.color.border.default}},root:{underline:{"&:before":{borderBottom:"none"},"&:after":{borderBottom:"none"},"&:hover":{borderBottom:"none"},"&&:hover::before":{border:"none"}}}}};f.default.size.font.body.default,f.default.font.family.text,f.default.color.base.gray100;var B={styleOverrides:{textColorPrimary:{textTransform:"none",minWidth:"auto",fontWeight:700,marginRight:"".concat(f.default.size.spacing.scale16),fontFamily:f.default.font.family.text,color:f.default.color.base.gray60,padding:"0 0 ".concat(f.default.size.spacing.scale16," 0"),"&:hover":{color:f.default.color.brand.darkMatter,opacity:1},"&$selected":{color:f.default.color.brand.darkMatter},"&:focus":{color:f.default.color.brand.darkMatter}}},defaultProps:{disableRipple:!0}};f.default.size.font.caption.default;var T,W,H,I,R={styleOverrides:{root:{borderBottom:"1px solid ".concat(f.default.color.base.gray20)},indicator:{backgroundColor:f.default.color.brand.darkMatter}}},q={styleOverrides:{root:{fontWeight:f.default.font.weight.bold,lineHeight:f.default.font.lineHeight.medium,fontFamily:f.default.font.family.text,fontSize:f.default.size.font.caption.default,color:f.default.color.text.base,marginBottom:f.default.size.spacing.scale8}}},_=t.createTheme({typography:y({},k),palette:{background:{default:"#ffffff"},primary:{main:f.default.color.brand.darkMatter},secondary:{main:f.default.color.brand.titanPink},error:{main:f.default.color.utility.danger},info:{main:f.default.color.utility.info},success:{main:f.default.color.base.green60}},components:{MuiButton:E,MuiButtonBase:{defaultProps:{disableRipple:!0,disableTouchRipple:!0}},MuiContainer:{styleOverrides:{maxWidthLg:{"@media (min-width: 1280px)":{maxWidth:"1185px"}}}},MuiIconButton:S,MuiChip:z,MuiInput:L,MuiTextField:j,MuiFormLabel:q,MuiTabs:R,MuiTab:B,MuiAvatar:O,MuiCheckbox:w,MuiRadio:M,MuiSwitch:F,MuiSelect:P,MuiLink:{styleOverrides:{root:{textDecoration:"none","&:hover":{textDecoration:"underline"}}}},MuiDivider:{styleOverrides:{root:{margin:"16px 0"}}},MuiFormControl:{styleOverrides:{root:{width:"100%"}}}}}),$=a.styled(t.CircularProgress)(H||(T=["\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"],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"],Object.defineProperty?Object.defineProperty(T,"raw",{value:W}):T.raw=W,H=T)),A={small:6,medium:8,large:12,fluid:12},D=function(e){var o=v(e,[]);return s.default.createElement(t.Checkbox,y({},o))},G=function(e){return s.default.createElement(t.Radio,y({},e))},N=function(e){return s.default.createElement(t.Switch,y({},e))},U=function(e){return s.default.createElement(t.Select,y({variant:"outlined"},e))},V={},J={exports:{}};(I=J).exports=function(e){return e&&e.__esModule?e:{default:e}},I.exports.__esModule=!0,I.exports.default=I.exports;var K={};!function(e){Object.defineProperty(e,"__esModule",{value:!0}),Object.defineProperty(e,"default",{enumerable:!0,get:function(){return t.createSvgIcon}});var t=h.default}(K);var Q=J.exports;Object.defineProperty(V,"__esModule",{value:!0});var X=V.default=void 0,Y=Q(K),Z=x.default,ee=(0,Y.default)((0,Z.jsx)("path",{d:"M12 6c3.79 0 7.17 2.13 8.82 5.5C19.17 14.87 15.79 17 12 17s-7.17-2.13-8.82-5.5C4.83 8.13 8.21 6 12 6m0-2C7 4 2.73 7.11 1 11.5 2.73 15.89 7 19 12 19s9.27-3.11 11-7.5C21.27 7.11 17 4 12 4zm0 5c1.38 0 2.5 1.12 2.5 2.5S13.38 14 12 14s-2.5-1.12-2.5-2.5S10.62 9 12 9m0-2c-2.48 0-4.5 2.02-4.5 4.5S9.52 16 12 16s4.5-2.02 4.5-4.5S14.48 7 12 7z"}),"VisibilityOutlined");X=V.default=ee;var te={},oe=J.exports;Object.defineProperty(te,"__esModule",{value:!0});var ae=te.default=void 0,re=oe(K),le=x.default,ne=(0,re.default)((0,le.jsx)("path",{d:"M12 6c3.79 0 7.17 2.13 8.82 5.5-.59 1.22-1.42 2.27-2.41 3.12l1.41 1.41c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l1.65 1.65C10.66 6.09 11.32 6 12 6zm-1.07 1.14L13 9.21c.57.25 1.03.71 1.28 1.28l2.07 2.07c.08-.34.14-.7.14-1.07C16.5 9.01 14.48 7 12 7c-.37 0-.72.05-1.07.14zM2.01 3.87l2.68 2.68C3.06 7.83 1.77 9.53 1 11.5 2.73 15.89 7 19 12 19c1.52 0 2.98-.29 4.32-.82l3.42 3.42 1.41-1.41L3.42 2.45 2.01 3.87zm7.5 7.5 2.61 2.61c-.04.01-.08.02-.12.02-1.38 0-2.5-1.12-2.5-2.5 0-.05.01-.08.01-.13zm-3.4-3.4 1.75 1.75c-.23.55-.36 1.15-.36 1.78 0 2.48 2.02 4.5 4.5 4.5.63 0 1.23-.13 1.77-.36l.98.98c-.88.24-1.8.38-2.75.38-3.79 0-7.17-2.13-8.82-5.5.7-1.43 1.72-2.61 2.93-3.53z"}),"VisibilityOffOutlined");ae=te.default=ne;var ie=function(e){var a=e.type,r=v(e,["type"]),l=o.useState(!1),n=l[0],i=l[1],d=y(y({},r.InputProps),"password"===a&&{endAdornment:s.default.createElement(g.default,{position:"end"},s.default.createElement(b.default,{"aria-label":"toggle password visibility",onClick:function(){return i(!n)},edge:"end"},n?s.default.createElement(X,null):s.default.createElement(ae,null)))});return s.default.createElement(t.TextField,y({},r,{type:n?"text":a,InputProps:d}))};Object.defineProperty(exports,"tokens",{enumerable:!0,get:function(){return f.default}}),exports.Avatar=function(e){var o=e.icon,a=e.firstName,r=void 0===a?"":a,l=e.lastName,n=void 0===l?"":l,i=v(e,["icon","firstName","lastName"]),d="".concat(r.substring(0,1)).concat(n.substring(0,1)).toLocaleUpperCase(),u=d?f.default.color.brand.titanPink:f.default.color.background.dark;return s.default.createElement(t.Avatar,y({sx:y({backgroundColor:u},i.sx)},i),d||o)},exports.Box=function(e){var o=e.children,a=v(e,["children"]);return s.default.createElement(t.Box,y({},a),o)},exports.Button=function(e){var t=e.color,o=void 0===t?"primary":t,a=e.variant,r=void 0===a?"contained":a,l=e.size,n=void 0===l?"medium":l,i=e.loading,d=e.children,u=v(e,["color","variant","size","loading","children"]);return s.default.createElement(m.default,y({size:n,variant:r,color:o,disabled:i},u),s.default.createElement("span",{style:{opacity:i?0:1}},d),i&&s.default.createElement($,{size:20,color:"inherit"}))},exports.Checkbox=D,exports.Chip=function(e){var o=e.label,a=v(e,["label"]);return s.default.createElement(t.Chip,y({size:"small",label:o},a))},exports.Container=function(e){var o=e.component,a=void 0===o?"div":o,r=e.size,l=void 0===r?"large":r,n=e.children,i=v(e,["component","size","children"]),d="fluid"===l;return s.default.createElement(t.Container,y({component:a,disableGutters:d,maxWidth:!d&&"lg",sx:y({display:"flex",justifyContent:"center"},i.sx)},i),s.default.createElement(t.Grid,{container:!0,justifyContent:"center"},s.default.createElement(t.Grid,{item:!0,md:A[l]},n)))},exports.FormCheckbox=function(e){var o=e.id,a=e.required,r=void 0===a||a,l=e.data,n=e.label,i=e.error,d=e.helperText;return s.default.createElement(t.FormControl,null,s.default.createElement(t.FormLabel,{component:"label",error:i},n," ",r?"":s.default.createElement(t.Box,{component:"span",sx:{fontWeight:f.default.font.weight.normal,color:f.default.color.text.light}},"(optional)")),s.default.createElement(t.FormGroup,null,l.map((function(e,a){var r=e.value,l=e.label;return s.default.createElement(t.FormControlLabel,{key:a,value:r,label:l||"",sx:{fontSize:f.default.size.font.base,color:f.default.color.text.base},control:s.default.createElement(D,{color:"primary",inputProps:{"data-testid":"".concat(o,"-").concat(a)}})})}))),i&&s.default.createElement(t.FormHelperText,{sx:{marginLeft:0,marginRight:0},error:i},d))},exports.FormInput=function(e){var o=e.id,a=e.required,r=void 0===a||a,l=e.label,n=e.error,i=e.helperText,d=v(e,["id","required","label","error","helperText"]);return s.default.createElement(t.FormControl,null,s.default.createElement(t.FormLabel,{component:"label",error:n},l," ",!r&&s.default.createElement(t.Box,{component:"span",sx:{fontWeight:f.default.font.weight.normal,color:f.default.color.text.light}},"(optional)")),s.default.createElement(ie,y({},d,{id:o,error:n,inputProps:{"data-testid":o}})),n&&s.default.createElement(t.FormHelperText,{sx:{marginLeft:0,marginRight:0},error:n},i))},exports.FormRadio=function(e){var o=e.id,a=e.helperText,r=e.label,l=e.error,n=e.required,i=void 0===n||n,d=e.name,u=e.data;return s.default.createElement(t.FormControl,{component:"fieldset",error:l},s.default.createElement(t.FormLabel,{component:"legend"},r," ",i?"":s.default.createElement(t.Box,{component:"span",sx:{fontWeight:f.default.font.weight.normal,color:f.default.color.text.light}},"(optional)")),s.default.createElement(t.RadioGroup,{"aria-label":d,name:d},u.map((function(e,a){var r=e.value,l=e.label;return s.default.createElement(t.FormControlLabel,{value:r,key:r,label:l||"",sx:{fontSize:f.default.size.font.base,color:f.default.color.text.base},control:s.default.createElement(G,{color:"primary",inputProps:{"data-testid":"".concat(o,"-").concat(a)}})})}))),l&&s.default.createElement(t.FormHelperText,{sx:{marginLeft:0,marginRight:0}},a))},exports.FormSelect=function(e){var o=e.id,a=e.required,r=void 0===a||a,l=e.options,n=e.label,i=e.error,d=e.placeholder,u=e.helperText;return s.default.createElement(t.FormControl,null,s.default.createElement(t.FormLabel,{component:"label",error:i},n," ",r?"":s.default.createElement(t.Box,{component:"span",sx:{fontWeight:f.default.font.weight.normal,color:f.default.color.text.light}},"(optional)")),s.default.createElement(U,{id:o,placeholder:d,error:i},l.map((function(e){return s.default.createElement(t.MenuItem,{key:e.value,value:e.value},e.text)}))),i&&s.default.createElement(t.FormHelperText,{sx:{marginLeft:0,marginRight:0},error:i},u))},exports.FormSwitch=function(e){var o=e.id,a=e.label,r=e.checked;return s.default.createElement(t.FormControl,null,s.default.createElement(t.FormLabel,{component:"label"},a),s.default.createElement(t.FormControlLabel,{control:s.default.createElement(N,{id:o}),label:"".concat(r?"Active":"Inactive")}))},exports.Input=ie,exports.Radio=G,exports.Select=U,exports.Switch=N,exports.Typography=function(e){var t=e.children,o=v(e,["children"]);return s.default.createElement(p.default,y({},o),t)},exports.UpComponentsProvider=function(e){return s.default.createElement(s.default.Fragment,null,s.default.createElement(t.CssBaseline,null),s.default.createElement(a.ThemeProvider,{theme:_},e.children))},exports.theme=_,Object.keys(t).forEach((function(e){"default"===e||exports.hasOwnProperty(e)||Object.defineProperty(exports,e,{enumerable:!0,get:function(){return t[e]}})}));

package/dist/cjs/types/components/Avatar/Avatar.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { AvatarProps as MUIAvatarProps } from '@mui/material';
-import { MUIGlobalOmit } from 'global/utils/types';
+import { MUIGlobalOmit } from '../../global/utils/types';
 export declare type AvatarProps = MUIGlobalOmit<Omit<MUIAvatarProps, 'children' | 'alt' | 'imgProps' | 'sizes' | 'src' | 'srcSet' | 'variant'>, {
     firstName?: string;
     lastName?: string;

package/dist/cjs/types/components/Box/Box.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { BoxProps as MUIBoxProps } from '@mui/material';
+import { MUIGlobalOmit } from '../../global/utils/types';
+export declare type BoxProps = MUIGlobalOmit<MUIBoxProps>;
+export declare const Box: ({ children, ...props }: BoxProps) => JSX.Element;

package/dist/cjs/types/components/Box/Box.stories.d.ts

@@ -0,0 +1,5 @@
+import { Story, Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Default: Story<Omit<import("@mui/material").BoxProps<"div", {}>, "disableFocusRipple" | "disableRipple" | "classes" | "tabIndex" | "action" | "centerRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "disableElevation">>;
+export declare const Padding: Story<Omit<import("@mui/material").BoxProps<"div", {}>, "disableFocusRipple" | "disableRipple" | "classes" | "tabIndex" | "action" | "centerRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "disableElevation">>;

package/dist/cjs/types/components/Box/Box.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/Button/Button.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { ButtonProps as MUIButtonProps } from '@mui/material/Button';
-import { MUIGlobalOmit } from 'global/utils/types';
+import { MUIGlobalOmit } from '../../global/utils/types';
 export declare type ButtonProps = MUIGlobalOmit<MUIButtonProps, {
     loading?: boolean;
 }>;

package/dist/cjs/types/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { CheckboxProps as MUICheckboxProps } from '@mui/material';
+import { MUIGlobalOmit } from '../../global/utils/types';
+export declare type CheckboxProps = MUIGlobalOmit<MUICheckboxProps>;
+export declare const Checkbox: ({ ...props }: CheckboxProps) => JSX.Element;

package/dist/cjs/types/components/Checkbox/Checkbox.stories.d.ts

@@ -0,0 +1,4 @@
+import { Story, Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Default: Story<Omit<import("@mui/material").CheckboxProps, "disableFocusRipple" | "disableRipple" | "classes" | "tabIndex" | "action" | "centerRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "disableElevation">>;

package/dist/cjs/types/components/Checkbox/Checkbox.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/Chip/Chip.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { ChipProps as MUIChipProps } from '@mui/material';
-import { MUIGlobalOmit } from 'global/utils/types';
+import { MUIGlobalOmit } from '../../global/utils/types';
 export declare type ChipProps = MUIGlobalOmit<Omit<MUIChipProps, 'size'>>;
 export declare const Chip: ({ label, ...props }: ChipProps) => JSX.Element;

package/dist/cjs/types/components/Container/Container.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { ContainerProps as MUIContainerProps } from '@mui/material';
-import { MUIGlobalOmit } from 'global/utils/types';
+import { MUIGlobalOmit } from '../../global/utils/types';
 export declare type ContainerProps = MUIGlobalOmit<Omit<MUIContainerProps, 'maxWidth'>, {
     /**
      * Determine the max-width of the container.

package/dist/cjs/types/components/FormCheckbox/FormCheckbox.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { MUIGlobalOmit } from '../../global/utils/types';
+import { CheckboxProps } from '../Checkbox/Checkbox';
+export declare type FormCheckboxProps = MUIGlobalOmit<CheckboxProps, {
+    data: {
+        value: string | number;
+        label?: string;
+    }[];
+    label?: string;
+    error?: boolean;
+    helperText?: string;
+}>;
+export declare const FormCheckbox: ({ id, required, data, label, error, helperText }: FormCheckboxProps) => JSX.Element;

package/dist/cjs/types/components/FormCheckbox/FormCheckbox.stories.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { Meta, Story } from '@storybook/react';
+import { FormCheckboxProps } from './FormCheckbox';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Primary: Story<React.PropsWithChildren<FormCheckboxProps>>;
+export declare const Required: Story<React.PropsWithChildren<FormCheckboxProps>>;
+export declare const withError: Story<React.PropsWithChildren<FormCheckboxProps>>;

package/dist/cjs/types/components/FormCheckbox/FormCheckbox.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/FormInput/FormInput.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { InputProps } from '../Input/Input';
+import { MUIGlobalOmit } from '../../global/utils/types';
+export declare type FormInputProps = MUIGlobalOmit<InputProps, {
+    label?: string;
+    error?: boolean;
+    helperText?: string;
+}>;
+export declare const FormInput: ({ id, required, label, error, helperText, ...props }: FormInputProps) => JSX.Element;

package/dist/cjs/types/components/FormInput/FormInput.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, Story } from '@storybook/react';
+import { FormInputProps } from './FormInput';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Primary: Story<FormInputProps>;
+export declare const Required: Story<FormInputProps>;
+export declare const withError: Story<FormInputProps>;

package/dist/cjs/types/components/FormInput/FormInput.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/FormRadio/FormRadio.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { RadioGroupProps } from '@mui/material';
+import { MUIGlobalOmit } from '../../global/utils/types';
+export declare type FormRadioProps = MUIGlobalOmit<RadioGroupProps, {
+    data: {
+        value: string | number;
+        label?: string;
+    }[];
+    helperText?: string;
+    label?: string;
+    error?: boolean;
+    required?: boolean;
+}>;
+export declare const FormRadio: ({ id, helperText, label, error, required, name, data }: FormRadioProps) => JSX.Element;

package/dist/cjs/types/components/FormRadio/FormRadio.stories.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { Meta, Story } from '@storybook/react';
+import { FormRadioProps } from './FormRadio';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Primary: Story<React.PropsWithChildren<FormRadioProps>>;
+export declare const Required: Story<React.PropsWithChildren<FormRadioProps>>;
+export declare const withError: Story<React.PropsWithChildren<FormRadioProps>>;

package/dist/cjs/types/components/FormRadio/FormRadio.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/FormSelect/FormSelect.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { MUIGlobalOmit } from '../../global/utils/types';
+import { SelectProps } from '../Select/Select';
+export declare type FormSelectProps = MUIGlobalOmit<SelectProps, {
+    options: {
+        value: string | number;
+        text: string;
+    }[];
+    label?: string;
+    error?: boolean;
+    helperText?: string;
+}>;
+export declare const FormSelect: ({ id, required, options, label, error, placeholder, helperText, }: FormSelectProps) => JSX.Element;

package/dist/cjs/types/components/FormSelect/FormSelect.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, Story } from '@storybook/react';
+import { FormSelectProps } from './FormSelect';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Primary: Story<FormSelectProps>;
+export declare const Required: Story<FormSelectProps>;
+export declare const withError: Story<FormSelectProps>;

package/dist/cjs/types/components/FormSelect/FormSelect.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/FormSwitch/FormSwitch.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { SwitchProps } from '../Switch/Switch';
+export interface FormSwitchProps extends SwitchProps {
+    label?: string;
+    id?: string;
+    checked?: boolean;
+}
+export declare const FormSwitch: ({ id, label, checked }: FormSwitchProps) => JSX.Element;

package/dist/cjs/types/components/FormSwitch/FormSwitch.stories.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { Meta, Story } from '@storybook/react';
+import { FormSwitchProps } from './FormSwitch';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Primary: Story<React.PropsWithChildren<FormSwitchProps>>;

package/dist/cjs/types/components/FormSwitch/FormSwitch.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/Input/Input.d.ts

@@ -0,0 +1,7 @@
+import { HTMLInputTypeAttribute } from 'react';
+import { TextFieldProps } from '@mui/material';
+import { MUIGlobalOmit } from '../../global/utils/types';
+export declare type InputProps = MUIGlobalOmit<TextFieldProps> & {
+    type?: HTMLInputTypeAttribute;
+};
+export declare const Input: ({ type, ...otherProps }: InputProps) => JSX.Element;

package/dist/{esm/types/global/overrides/form/input.d.ts → cjs/types/components/Input/Input.overrides.d.ts}

@@ -1,2 +1,3 @@
 import { OverridesStyleRules } from '@mui/material/styles/overrides';
+export declare const MuiTextField: OverridesStyleRules;
 export declare const MuiInput: OverridesStyleRules;

package/dist/cjs/types/components/Input/Input.stories.d.ts

@@ -0,0 +1,6 @@
+import { Story, Meta } from '@storybook/react';
+import { InputProps } from './Input';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Default: Story<InputProps>;
+export declare const Password: Story<InputProps>;

package/dist/cjs/types/components/Input/Input.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/Radio/Radio.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { RadioProps as MUIRadioProps } from '@mui/material';
+import { MUIGlobalOmit } from '../../global/utils/types';
+export declare type RadioProps = MUIGlobalOmit<MUIRadioProps>;
+export declare const Radio: (props: RadioProps) => JSX.Element;

package/dist/cjs/types/components/Radio/Radio.stories.d.ts

@@ -0,0 +1,4 @@
+import { Story, Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Default: Story<Omit<import("@mui/material").RadioProps, "disableFocusRipple" | "disableRipple" | "classes" | "tabIndex" | "action" | "centerRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "disableElevation">>;

package/dist/cjs/types/components/Radio/Radio.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/Select/Select.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { SelectProps as MUISelectProps } from '@mui/material';
+import { MUIGlobalOmit } from '../../global/utils/types';
+export declare type SelectProps = MUIGlobalOmit<Omit<MUISelectProps, 'variant' | 'label'>>;
+export declare const Select: (props: SelectProps) => JSX.Element;

package/dist/cjs/types/components/Select/Select.overrides.d.ts

@@ -0,0 +1,2 @@
+import { OverridesStyleRules } from '@mui/material/styles/overrides';
+export declare const MuiSelect: OverridesStyleRules;

package/dist/cjs/types/components/Select/Select.stories.d.ts

@@ -0,0 +1,6 @@
+import { Story, Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Default: Story<Omit<Omit<import("@mui/material").SelectProps<unknown>, "label" | "variant">, "disableFocusRipple" | "disableRipple" | "classes" | "tabIndex" | "action" | "centerRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "disableElevation">>;
+export declare const Disabled: Story<Omit<Omit<import("@mui/material").SelectProps<unknown>, "label" | "variant">, "disableFocusRipple" | "disableRipple" | "classes" | "tabIndex" | "action" | "centerRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "disableElevation">>;
+export declare const Error: Story<Omit<Omit<import("@mui/material").SelectProps<unknown>, "label" | "variant">, "disableFocusRipple" | "disableRipple" | "classes" | "tabIndex" | "action" | "centerRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "TouchRippleProps" | "disableElevation">>;

package/dist/cjs/types/components/Select/Select.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/Switch/Switch.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { SwitchProps as MUISwitchProps } from '@mui/material';
+import { MUIGlobalOmit } from '../../global/utils/types';
+export declare type SwitchProps = MUIGlobalOmit<MUISwitchProps, {
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => void;
+}>;
+export declare const Switch: (props: SwitchProps) => JSX.Element;

package/dist/cjs/types/components/Switch/Switch.stories.d.ts

@@ -0,0 +1,5 @@
+import { Story, Meta } from '@storybook/react';
+import { SwitchProps } from './Switch';
+declare const _default: Meta<import("@storybook/react").Args>;
+export default _default;
+export declare const Default: Story<SwitchProps>;

package/dist/cjs/types/components/Switch/Switch.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/Typography/Typography.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { TypographyProps as MUITypographyProps } from '@mui/material/Typography';
-import { MUIGlobalOmit } from 'global/utils/types';
+import { MUIGlobalOmit } from '../../global/utils/types';
 export declare type TypographyProps = MUIGlobalOmit<MUITypographyProps, {
     component?: React.ElementType;
 }>;

package/dist/cjs/types/components/index.d.ts

@@ -3,3 +3,14 @@ export { Typography } from './Typography/Typography';
 export { Chip } from './Chip/Chip';
 export { Avatar } from './Avatar/Avatar';
 export { Container } from './Container/Container';
+export { Box } from './Box/Box';
+export { Checkbox } from './Checkbox/Checkbox';
+export { FormCheckbox } from './FormCheckbox/FormCheckbox';
+export { Radio } from './Radio/Radio';
+export { FormRadio } from './FormRadio/FormRadio';
+export { Switch } from './Switch/Switch';
+export { FormSwitch } from './FormSwitch/FormSwitch';
+export { Select } from './Select/Select';
+export { FormSelect } from './FormSelect/FormSelect';
+export { Input } from './Input/Input';
+export { FormInput } from './FormInput/FormInput';

package/dist/cjs/types/global/overrides/index.d.ts

@@ -2,8 +2,4 @@ export * from './menuItem';
 export * from './tab';
 export * from './tablePagination';
 export * from './tabs';
-export * from './form/checkbox';
-export * from './form/input';
 export * from './form/label';
-export * from './form/radio';
-export * from './form/switch';

package/dist/cjs/types/global/tokens/colors/colors.components.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { Box } from '../../..';
+export { Box };
+export declare const SemanticColors: () => JSX.Element;
+export declare const Palette: () => JSX.Element;

package/dist/cjs/types/global/tokens/components/CodeSnippet.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export declare const CodeSnippet: ({ dark, language, code, }: {
+    dark?: boolean | undefined;
+    language?: string | undefined;
+    code: string;
+}) => JSX.Element;

package/dist/cjs/types/global/tokens/components/CopyToClipboard.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const CopyToClipboard: ({ label }: {
+    label: string;
+}) => JSX.Element;

package/dist/cjs/types/global/tokens/components/Header.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const Header: ({ title, subtitle }: {
+    title: string;
+    subtitle: string;
+}) => JSX.Element;

package/dist/cjs/types/global/tokens/components/Table.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export declare const Table: {
+    Wrapper: ({ rows, columns }: {
+        rows: React.ReactNode;
+        columns: string[];
+    }) => JSX.Element;
+    Cell: import("@emotion/styled").StyledComponent<import("@mui/material/TableCell/TableCell").TableCellProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+    Row: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material/TableRow/TableRow").TableRowTypeMap<{}, "tr">>;
+};

package/dist/cjs/types/global/tokens/spacing/spacing.components.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { Box } from '../../..';
+export { Box };
+export declare const SemanticSpacing: () => JSX.Element;
+export declare const SpacingTokens: () => JSX.Element;

package/dist/cjs/types/global/tokens/typogrpahy/typography.components.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const SemanticTypography: () => JSX.Element;
+export declare const FontSizes: () => JSX.Element;
+export declare const FontTokens: () => JSX.Element;

package/dist/cjs/types/index.d.ts

@@ -1,4 +1,6 @@
+import tokens from '@up42/design-system-tokens/dist/json/tokens.json';
 export * from '@mui/material';
+export { tokens };
 export { UpComponentsProvider } from './global/UpComponentsProvider/UpComponentsProvider';
 export { theme } from './global/theme';
-export { Button, Typography, Chip, Avatar, Container } from './components';
+export { Button, Typography, Chip, Avatar, Container, Box, Switch, FormSwitch, Checkbox, FormCheckbox, Radio, FormRadio, Select, FormSelect, Input, FormInput, } from './components';