@chakra-ui/theme - npm Package Compare versions

Comparing version 1.0.0-next.6 to 1.0.0-next.7

CHANGELOG.md

@@ -6,2 +6,21 @@ # Change Log
 
+# [1.0.0-next.7](https://github.com/chakra-ui/chakra-ui/compare/@chakra-ui/theme@1.0.0-next.6...@chakra-ui/theme@1.0.0-next.7) (2020-07-26)
+
+### Bug Fixes
+
+- added ColorModeOptions type to theme config
+  ([648d41f](https://github.com/chakra-ui/chakra-ui/commit/648d41f56b9fd501d730c55f34058e61c6a9febb))
+- select option issue in dark mode
+  ([f36a747](https://github.com/chakra-ui/chakra-ui/commit/f36a747007451204d4895f48d0d22e5afd393d45))
+
+### Reverts
+
+- breakpoint handling
+  ([f3ee5f1](https://github.com/chakra-ui/chakra-ui/commit/f3ee5f15c48da242c4d4d43de0dc67ff7664c81e))
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
 # [1.0.0-next.6](https://github.com/chakra-ui/chakra-ui/compare/@chakra-ui/theme@1.0.0-next.5...@chakra-ui/theme@1.0.0-next.6) (2020-07-15)
@@ -8,0 +27,0 @@

dist/cjs/components/accordion.js

@@ -5,40 +5,43 @@ "use strict";
 exports["default"] = void 0;
-var register = {
-  parts: ["container", "item", "button", "panel"]
-};
-var baseStyle = {
-  item: {
-    borderTopWidth: "1px",
-    borderColor: "inherit",
-    _last: {
-      borderBottomWidth: "1px"
-    }
+
+var _themeTools = require("@chakra-ui/theme-tools");
+
+var accordion = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    container: "the container for an accordion item",
+    button: "the trigger for an accordion item",
+    panel: "the panel for an accordion item"
   },
-  button: {
-    fontSize: "1rem",
-    _focus: {
-      boxShadow: "outline"
+  baseStyle: {
+    container: {
+      borderTopWidth: "1px",
+      borderColor: "inherit",
+      _last: {
+        borderBottomWidth: "1px"
+      }
     },
-    _hover: {
-      bg: "blackAlpha.50"
+    button: {
+      fontSize: "1rem",
+      _focus: {
+        boxShadow: "outline"
+      },
+      _hover: {
+        bg: "blackAlpha.50"
+      },
+      _disabled: {
+        opacity: 0.4,
+        cursor: "not-allowed"
+      },
+      px: 4,
+      py: 2
     },
-    _disabled: {
-      opacity: 0.4,
-      cursor: "not-allowed"
-    },
-    paddingX: 4,
-    paddingY: 2
-  },
-  panel: {
-    paddingTop: 2,
-    paddingX: 4,
-    paddingBottom: 5
+    panel: {
+      pt: 2,
+      px: 4,
+      pb: 5
+    }
   }
-};
-var accordion = {
-  register: register,
-  baseStyle: baseStyle
-};
+});
 var _default = accordion;
 exports["default"] = _default;
 //# sourceMappingURL=accordion.js.map

dist/cjs/components/alert.js

@@ -8,91 +8,88 @@ "use strict";
 
-var register = {
-  parts: ["container", "title", "icon"],
-  variants: ["subtle", "left-accent", "top-accent", "solid"]
-};
-var baseStyle = {
-  container: {
-    paddingX: 4,
-    paddingY: 3
+var alert = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    container: "the alert container",
+    title: "the alert title",
+    icon: "the alert icon"
   },
-  title: {
-    fontWeight: "bold",
-    lineHeight: "normal"
+  baseStyle: {
+    container: {
+      px: 4,
+      py: 3
+    },
+    title: {
+      fontWeight: "bold",
+      lineHeight: "normal"
+    },
+    icon: {
+      mr: 3,
+      w: 5,
+      h: 5
+    }
   },
-  icon: {
-    marginRight: 3,
-    width: 5,
-    height: 5
+  variants: {
+    subtle: function subtle(props) {
+      var c = props.colorScheme;
+      return {
+        container: {
+          bg: getBg(props)
+        },
+        icon: {
+          color: (0, _themeTools.mode)(c + ".500", c + ".200")(props)
+        }
+      };
+    },
+    "left-accent": function leftAccent(props) {
+      var c = props.colorScheme;
+      return {
+        container: {
+          pl: 3,
+          borderLeft: "4px solid",
+          borderColor: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
+          bg: getBg(props)
+        },
+        icon: {
+          color: (0, _themeTools.mode)(c + ".500", c + ".200")(props)
+        }
+      };
+    },
+    "top-accent": function topAccent(props) {
+      var c = props.colorScheme;
+      return {
+        container: {
+          pt: 2,
+          borderTop: "4px solid",
+          borderColor: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
+          bg: getBg(props)
+        },
+        icon: {
+          color: (0, _themeTools.mode)(c + ".500", c + ".200")(props)
+        }
+      };
+    },
+    solid: function solid(props) {
+      var c = props.colorScheme;
+      return {
+        container: {
+          bg: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
+          color: (0, _themeTools.mode)("white", "gray.900")(props)
+        }
+      };
+    }
+  },
+  defaultProps: {
+    variant: "subtle"
   }
-};
+});
 
 function getBg(props) {
-  var t = props.theme,
+  var theme = props.theme,
       c = props.colorScheme;
-  var lightBg = (0, _themeTools.getColor)(t, c + ".100", c);
-  var darkBg = (0, _themeTools.ink)(c + ".200", "lowest")(t);
+  var lightBg = (0, _themeTools.getColor)(theme, c + ".100", c);
+  var darkBg = (0, _themeTools.transparentize)(c + ".200", 0.16)(theme);
   return (0, _themeTools.mode)(lightBg, darkBg)(props);
 }
 
-var variants = {
-  subtle: function subtle(props) {
-    var c = props.colorScheme;
-    return {
-      container: {
-        bg: getBg(props)
-      },
-      icon: {
-        color: (0, _themeTools.mode)(c + ".500", c + ".200")(props)
-      }
-    };
-  },
-  "left-accent": function leftAccent(props) {
-    var c = props.colorScheme;
-    return {
-      container: {
-        paddingLeft: 3,
-        borderLeft: "4px solid",
-        borderColor: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
-        bg: getBg(props)
-      },
-      icon: {
-        color: (0, _themeTools.mode)(c + ".500", c + ".200")(props)
-      }
-    };
-  },
-  "top-accent": function topAccent(props) {
-    var c = props.colorScheme;
-    return {
-      container: {
-        paddingTop: 2,
-        borderTop: "4px solid",
-        borderColor: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
-        bg: getBg(props)
-      },
-      icon: {
-        color: (0, _themeTools.mode)(c + ".500", c + ".200")(props)
-      }
-    };
-  },
-  solid: function solid(props) {
-    var c = props.colorScheme;
-    return {
-      container: {
-        bg: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
-        color: (0, _themeTools.mode)("white", "gray.900")(props)
-      }
-    };
-  }
-};
-var defaultProps = {
-  variant: "subtle"
-};
-var alert = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  variants: variants
-};
 var _default = alert;
 exports["default"] = _default;
 //# sourceMappingURL=alert.js.map

dist/cjs/components/avatar.js

@@ -12,58 +12,62 @@ "use strict";
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var avatar = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    container: "the avatar wrapper",
+    excessLabel: "for avatar group, the excess avatar label",
+    badge: "the top or bottom left badge",
+    label: "the avatar's name initials text"
+  },
+  baseStyle: function baseStyle(props) {
+    var name = props.name,
+        theme = props.theme;
+    var bg = name ? (0, _themeTools.randomColor)({
+      string: name
+    }) : "gray.400";
+    var color = name ? (0, _themeTools.isDark)(bg)(theme) ? "white" : "gray.800" : "white";
+    var borderColor = (0, _themeTools.mode)("white", "gray.800")(props);
+    return {
+      badge: {
+        transform: "translate(25%, 25%)",
+        borderRadius: "full",
+        border: "0.2em solid",
+        borderColor: (0, _themeTools.mode)("white", "gray.800")(props)
+      },
+      excessLabel: {
+        bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.400")(props)
+      },
+      container: {
+        bg: bg,
+        color: color,
+        borderColor: borderColor,
+        verticalAlign: "top"
+      }
+    };
+  },
+  sizes: {
+    "2xs": getSize("4"),
+    xs: getSize("6"),
+    sm: getSize("8"),
+    md: getSize("12"),
+    lg: getSize("16"),
+    xl: getSize("24"),
+    "2xl": getSize("32"),
+    full: getSize("100%")
+  },
+  defaultProps: {
+    size: "md"
+  }
+});
 
-var register = {
-  parts: ["container", "excessLabel", "badge", "label"],
-  sizes: ["2xs", "xs", "sm", "md", "lg", "xl", "2xl", "full"]
-};
-
-var baseStyle = function baseStyle(props) {
-  var name = props.name,
-      theme = props.theme;
-  var bg = name ? (0, _themeTools.randomColor)({
-    string: name
-  }) : "gray.400";
-  var color = name ? (0, _themeTools.isDark)(bg)(theme) ? "white" : "gray.800" : "white";
-  var borderColor = (0, _themeTools.mode)("white", "gray.800")(props);
+function getSize(size) {
+  var themeSize = _sizes["default"][size];
   return {
-    badge: {
-      transform: "translate(25%, 25%)",
-      borderRadius: "full",
-      border: "0.2em solid",
-      borderColor: (0, _themeTools.mode)("white", "gray.800")(props)
+    container: {
+      width: size,
+      height: size,
+      fontSize: "calc(" + (themeSize != null ? themeSize : size) + " / 2.5)"
     },
     excessLabel: {
-      bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.400")(props)
+      width: size,
+      height: size
     },
-    container: {
-      bg: bg,
-      color: color,
-      borderColor: borderColor,
-      verticalAlign: "top"
-    }
-  };
-};
-
-var sizes = {
-  "2xs": getSize("4"),
-  xs: getSize("6"),
-  sm: getSize("8"),
-  md: getSize("12"),
-  lg: getSize("16"),
-  xl: getSize("24"),
-  "2xl": getSize("32"),
-  full: getSize("100%")
-};
-
-function getSize(size) {
-  var themeSize = _sizes["default"][size];
-  var styles = {
-    width: size,
-    height: size
-  };
-  return {
-    container: _extends({
-      fontSize: "calc(" + (themeSize != null ? themeSize : size) + " / 2.5)"
-    }, styles),
-    excessLabel: styles,
     label: {
@@ -76,13 +80,4 @@ fontSize: "calc(" + (themeSize != null ? themeSize : size) + " / 2.5)",
 
-var defaultProps = {
-  size: "md"
-};
-var avatar = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes
-};
 var _default = avatar;
 exports["default"] = _default;
 //# sourceMappingURL=avatar.js.map

dist/cjs/components/badge.js

@@ -8,8 +8,4 @@ "use strict";
 
-var register = {
-  parts: ["container"],
-  variants: ["solid", "subtle", "outline"]
-};
-var baseStyle = {
-  container: {
+var badge = (0, _themeTools.styleConfig)({
+  baseStyle: {
     paddingX: 1,
@@ -20,53 +16,41 @@ textTransform: "uppercase",
     fontWeight: "bold"
-  }
-};
-var variants = {
-  solid: function solid(props) {
-    var c = props.colorScheme,
-        theme = props.theme;
-    var dark = (0, _themeTools.transparentize)(c + ".500", 0.6)(theme);
-    return {
-      container: {
+  },
+  variants: {
+    solid: function solid(props) {
+      var c = props.colorScheme,
+          theme = props.theme;
+      var dark = (0, _themeTools.transparentize)(c + ".500", 0.6)(theme);
+      return {
         bg: (0, _themeTools.mode)(c + ".500", dark)(props),
         color: (0, _themeTools.mode)("white", "whiteAlpha.800")(props)
-      }
-    };
-  },
-  subtle: function subtle(props) {
-    var c = props.colorScheme,
-        theme = props.theme;
-    var darkBg = (0, _themeTools.ink)(c + ".200", "lowest")(theme);
-    return {
-      container: {
+      };
+    },
+    subtle: function subtle(props) {
+      var c = props.colorScheme,
+          theme = props.theme;
+      var darkBg = (0, _themeTools.transparentize)(c + ".200", 0.16)(theme);
+      return {
         bg: (0, _themeTools.mode)(c + ".100", darkBg)(props),
         color: (0, _themeTools.mode)(c + ".800", c + ".200")(props)
-      }
-    };
-  },
-  outline: function outline(props) {
-    var c = props.colorScheme,
-        theme = props.theme;
-    var darkColor = (0, _themeTools.transparentize)(c + ".200", 0.8)(theme);
-    var lightColor = (0, _themeTools.getColor)(theme, c + ".500");
-    var color = (0, _themeTools.mode)(lightColor, darkColor)(props);
-    return {
-      container: {
+      };
+    },
+    outline: function outline(props) {
+      var c = props.colorScheme,
+          theme = props.theme;
+      var darkColor = (0, _themeTools.transparentize)(c + ".200", 0.8)(theme);
+      var lightColor = (0, _themeTools.getColor)(theme, c + ".500");
+      var color = (0, _themeTools.mode)(lightColor, darkColor)(props);
+      return {
         color: color,
         boxShadow: "inset 0 0 0px 1px " + color
-      }
-    };
+      };
+    }
+  },
+  defaultProps: {
+    variant: "subtle",
+    colorScheme: "gray"
   }
-};
-var defaultProps = {
-  variant: "subtle",
-  colorScheme: "gray"
-};
-var Badge = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  variants: variants
-};
-var _default = Badge;
+});
+var _default = badge;
 exports["default"] = _default;
 //# sourceMappingURL=badge.js.map

dist/cjs/components/breadcumb.js

@@ -5,27 +5,28 @@ "use strict";
 exports["default"] = void 0;
-var register = {
-  parts: ["container", "link", "separator"]
-};
-var baseStyle = {
-  separator: {},
-  link: {
-    transition: "all 0.15s ease-out",
-    cursor: "pointer",
-    textDecoration: "none",
-    outline: "none",
-    color: "inherit",
-    _hover: {
-      textDecoration: "underline"
-    },
-    _focus: {
-      boxShadow: "outline"
+
+var _themeTools = require("@chakra-ui/theme-tools");
+
+var breadcrumb = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    link: "the breadcrumb",
+    separator: "the separator between each link"
+  },
+  baseStyle: {
+    link: {
+      transition: "all 0.15s ease-out",
+      cursor: "pointer",
+      textDecoration: "none",
+      outline: "none",
+      color: "inherit",
+      _hover: {
+        textDecoration: "underline"
+      },
+      _focus: {
+        boxShadow: "outline"
+      }
     }
   }
-};
-var Breadcrumb = {
-  register: register,
-  baseStyle: baseStyle
-};
-var _default = Breadcrumb;
+});
+var _default = breadcrumb;
 exports["default"] = _default;
 //# sourceMappingURL=breadcumb.js.map

dist/cjs/components/button.js

@@ -10,33 +10,8 @@ "use strict";
 
-var register = {
-  parts: ["container", "icon", "spinner"],
-  sizes: ["sm", "md", "lg", "xs"],
-  variants: ["solid", "outline", "ghost", "unstyled"]
-};
-var baseStyle = {
-  spinner: {
-    fontSize: "1em",
-    lineHeight: "normal"
-  },
-  container: {
-    lineHeight: "1.2",
-    borderRadius: "md",
-    fontWeight: "semibold",
-    _focus: {
-      boxShadow: "outline"
-    },
-    _disabled: {
-      opacity: 0.4,
-      cursor: "not-allowed",
-      boxShadow: "none"
-    }
-  }
-};
-/**
- * Variants Style
- */
+var ghost = function ghost(props) {
+  var c = props.colorScheme,
+      theme = props.theme;
 
-function grayGhost(props) {
-  return {
-    container: {
+  if (c === "gray") {
+    return {
       color: (0, _themeTools.mode)("inherit", "whiteAlpha.900")(props),
@@ -49,152 +24,123 @@ _hover: {
       }
-    }
-  };
-}
+    };
+  }
 
-function ghost(props) {
-  var c = props.colorScheme,
-      theme = props.theme;
-  if (c === "gray") return grayGhost(props);
-  var darkHover = (0, _themeTools.transparentize)(c + ".200", 0.12)(theme);
-  var darkActive = (0, _themeTools.transparentize)(c + ".200", 0.24)(theme);
+  var darkHoverBg = (0, _themeTools.transparentize)(c + ".200", 0.12)(theme);
+  var darkActiveBg = (0, _themeTools.transparentize)(c + ".200", 0.24)(theme);
   return {
-    container: {
-      color: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
-      bg: "transparent",
-      _hover: {
-        bg: (0, _themeTools.mode)(c + ".50", darkHover)(props)
-      },
-      _active: {
-        bg: (0, _themeTools.mode)(c + ".100", darkActive)(props)
-      }
+    color: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
+    bg: "transparent",
+    _hover: {
+      bg: (0, _themeTools.mode)(c + ".50", darkHoverBg)(props)
+    },
+    _active: {
+      bg: (0, _themeTools.mode)(c + ".100", darkActiveBg)(props)
     }
   };
-}
+};
 
-function outline(props) {
-  var c = props.colorScheme;
-  var borderColor = (0, _themeTools.mode)("gray.200", "whiteAlpha.300")(props);
-  return {
-    container: _extends({
-      border: "1px solid",
-      borderColor: c === "gray" ? borderColor : "currentColor"
-    }, ghost(props).container)
-  };
-}
-
-function graySolid(props) {
-  return {
-    container: {
-      bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.200")(props),
-      _hover: {
-        bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.300")(props)
-      },
-      _active: {
-        bg: (0, _themeTools.mode)("gray.300", "whiteAlpha.400")(props)
-      }
+var button = (0, _themeTools.styleConfig)({
+  baseStyle: {
+    lineHeight: "1.2",
+    borderRadius: "md",
+    fontWeight: "semibold",
+    _focus: {
+      boxShadow: "outline"
+    },
+    _disabled: {
+      opacity: 0.4,
+      cursor: "not-allowed",
+      boxShadow: "none"
     }
-  };
-}
-
-function solid(props) {
-  var c = props.colorScheme;
-  if (c === "gray") return graySolid(props);
-  return {
-    container: {
-      bg: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
-      color: (0, _themeTools.mode)("white", "gray.800")(props),
-      _hover: {
-        bg: (0, _themeTools.mode)(c + ".600", c + ".300")(props)
-      },
-      _active: {
-        bg: (0, _themeTools.mode)(c + ".700", c + ".400")(props)
-      }
+  },
+  variants: {
+    ghost: ghost,
+    outline: function outline(props) {
+      var c = props.colorScheme;
+      var borderColor = (0, _themeTools.mode)("gray.200", "whiteAlpha.300")(props);
+      return _extends({
+        border: "1px solid",
+        borderColor: c === "gray" ? borderColor : "currentColor"
+      }, ghost(props));
+    },
+    solid: function solid(props) {
+      var c = props.colorScheme;
+      if (c === "gray") return {
+        bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.200")(props),
+        _hover: {
+          bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.300")(props)
+        },
+        _active: {
+          bg: (0, _themeTools.mode)("gray.300", "whiteAlpha.400")(props)
+        }
+      };
+      return {
+        bg: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
+        color: (0, _themeTools.mode)("white", "gray.800")(props),
+        _hover: {
+          bg: (0, _themeTools.mode)(c + ".600", c + ".300")(props)
+        },
+        _active: {
+          bg: (0, _themeTools.mode)(c + ".700", c + ".400")(props)
+        }
+      };
+    },
+    link: function link(props) {
+      var c = props.colorScheme;
+      return {
+        padding: 0,
+        height: "auto",
+        lineHeight: "normal",
+        color: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
+        _hover: {
+          textDecoration: "underline"
+        },
+        _active: {
+          color: (0, _themeTools.mode)(c + ".700", c + ".500")(props)
+        }
+      };
+    },
+    unstyled: {
+      bg: "none",
+      color: "inherit",
+      display: "inline",
+      lineHeight: "inherit",
+      m: 0,
+      p: 0
     }
-  };
-}
-
-function link(props) {
-  var c = props.colorScheme;
-  return {
-    container: {
-      padding: 0,
-      height: "auto",
-      lineHeight: "normal",
-      color: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
-      _hover: {
-        textDecoration: "underline"
-      },
-      _active: {
-        color: (0, _themeTools.mode)(c + ".700", c + ".500")(props)
-      }
-    }
-  };
-}
-
-var unstyled = {
-  container: {
-    bg: "none",
-    border: 0,
-    color: "inherit",
-    display: "inline",
-    font: "inherit",
-    lineHeight: "inherit",
-    margin: 0,
-    padding: 0
-  }
-};
-var sizes = {
-  lg: {
-    container: {
-      height: 12,
-      minWidth: 12,
+  },
+  sizes: {
+    lg: {
+      h: 12,
+      minW: 12,
       fontSize: "lg",
-      paddingX: 6
-    }
-  },
-  md: {
-    container: {
-      height: 10,
-      minWidth: 10,
+      px: 6
+    },
+    md: {
+      h: 10,
+      minW: 10,
       fontSize: "md",
-      paddingX: 4
-    }
-  },
-  sm: {
-    container: {
-      height: 8,
-      minWidth: 8,
+      px: 4
+    },
+    sm: {
+      h: 8,
+      minW: 8,
       fontSize: "sm",
-      paddingX: 3
+      px: 3
+    },
+    xs: {
+      h: 6,
+      minW: 6,
+      fontSize: "xs",
+      px: 2
     }
   },
-  xs: {
-    container: {
-      height: 6,
-      minWidth: 6,
-      fontSize: "xs",
-      paddingX: 2
-    }
+  defaultProps: {
+    variant: "solid",
+    size: "md",
+    colorScheme: "gray"
   }
-};
-var defaultProps = {
-  variant: "solid",
-  size: "md",
-  colorScheme: "gray"
-};
-var Button = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes,
-  variants: {
-    unstyled: unstyled,
-    solid: solid,
-    ghost: ghost,
-    link: link,
-    outline: outline
-  }
-};
-var _default = Button;
+});
+var _default = button;
 exports["default"] = _default;
 //# sourceMappingURL=button.js.map

dist/cjs/components/checkbox.js

@@ -8,100 +8,96 @@ "use strict";
 
-var register = {
-  parts: ["control", "label", "description", "icon"],
-  sizes: ["sm", "md", "lg"]
-};
-
-var baseStyle = function baseStyle(props) {
-  var c = props.colorScheme;
-  return {
-    control: {
-      width: "100%",
-      transition: "box-shadow 250ms, background-color 250ms",
-      border: "2px solid",
-      borderRadius: "sm",
-      borderColor: "inherit",
-      color: "white",
-      _checked: {
-        bg: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
-        borderColor: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
-        color: (0, _themeTools.mode)("white", "gray.900")(props),
-        _hover: {
-          bg: (0, _themeTools.mode)(c + ".600", c + ".300")(props),
-          borderColor: (0, _themeTools.mode)(c + ".600", c + ".300")(props)
+var checkbox = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    control: "the main checkbox container",
+    label: "the checkbox label",
+    description: "the checkbox assistive text",
+    icon: "the checkmark icon"
+  },
+  baseStyle: function baseStyle(props) {
+    var c = props.colorScheme;
+    return {
+      control: {
+        w: "100%",
+        transition: "box-shadow 250ms",
+        border: "2px solid",
+        borderRadius: "sm",
+        borderColor: "inherit",
+        color: "white",
+        _checked: {
+          bg: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
+          borderColor: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
+          color: (0, _themeTools.mode)("white", "gray.900")(props),
+          _hover: {
+            bg: (0, _themeTools.mode)(c + ".600", c + ".300")(props),
+            borderColor: (0, _themeTools.mode)(c + ".600", c + ".300")(props)
+          },
+          _disabled: {
+            borderColor: (0, _themeTools.mode)("gray.200", "transparent")(props),
+            bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.300")(props),
+            color: (0, _themeTools.mode)("gray.500", "whiteAlpha.500")(props)
+          }
         },
+        _indeterminate: {
+          bg: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
+          borderColor: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
+          color: (0, _themeTools.mode)("white", "gray.900")(props)
+        },
         _disabled: {
-          borderColor: (0, _themeTools.mode)("gray.200", "transparent")(props),
-          bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.300")(props),
-          color: (0, _themeTools.mode)("gray.500", "whiteAlpha.500")(props)
+          bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.100")(props),
+          borderColor: (0, _themeTools.mode)("gray.100", "transparent")(props)
+        },
+        _focus: {
+          boxShadow: "outline"
+        },
+        _invalid: {
+          borderColor: (0, _themeTools.mode)("red.500", "red.300")(props)
         }
       },
-      _indeterminate: {
-        bg: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
-        borderColor: (0, _themeTools.mode)(c + ".500", c + ".200")(props),
-        color: (0, _themeTools.mode)("white", "gray.900")(props)
+      label: {
+        userSelect: "none",
+        _disabled: {
+          opacity: 0.4
+        }
       },
-      _disabled: {
-        bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.100")(props),
-        borderColor: (0, _themeTools.mode)("gray.100", "transparent")(props)
+      icon: {
+        fontSize: "0.625rem"
+      }
+    };
+  },
+  sizes: {
+    sm: {
+      control: {
+        h: 3,
+        w: 3
       },
-      _focus: {
-        boxShadow: "outline"
+      label: {
+        fontSize: "sm"
+      }
+    },
+    md: {
+      control: {
+        w: 4,
+        h: 4
       },
-      _invalid: {
-        borderColor: (0, _themeTools.mode)("red.500", "red.300")(props)
+      label: {
+        fontSize: "md"
       }
     },
-    label: {
-      userSelect: "none",
-      _disabled: {
-        opacity: 0.4
+    lg: {
+      control: {
+        w: 5,
+        h: 5
+      },
+      label: {
+        fontSize: "lg"
       }
-    },
-    icon: {
-      fontSize: "0.625rem"
     }
-  };
-};
-
-var sizes = {
-  sm: {
-    control: {
-      height: 3,
-      width: 3
-    },
-    label: {
-      fontSize: "sm"
-    }
   },
-  md: {
-    control: {
-      width: 4,
-      height: 4
-    },
-    label: {
-      fontSize: "md"
-    }
-  },
-  lg: {
-    control: {
-      width: 5,
-      height: 5
-    },
-    label: {
-      fontSize: "lg"
-    }
+  defaultProps: {
+    size: "md",
+    colorScheme: "blue"
   }
-};
-var defaultProps = {
-  size: "md",
-  colorScheme: "blue"
-};
-var checkbox = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes
-};
+});
 var _default = checkbox;
 exports["default"] = _default;
 //# sourceMappingURL=checkbox.js.map

dist/cjs/components/close-button.js

@@ -8,11 +8,7 @@ "use strict";
 
-var register = {
-  parts: ["icon", "container"],
-  sizes: ["sm", "md", "lg"]
-};
-
-var baseStyle = function baseStyle(props) {
-  return {
-    icon: {},
-    container: {
+var closeButton = (0, _themeTools.styleConfig)({
+  baseStyle: function baseStyle(props) {
+    var hoverBg = (0, _themeTools.mode)("blackAlpha.100", "whiteAlpha.100")(props);
+    var activeBg = (0, _themeTools.mode)("blackAlpha.200", "whiteAlpha.200")(props);
+    return {
       borderRadius: "md",
@@ -26,6 +22,6 @@ transition: "all 0.2s",
       _hover: {
-        bg: (0, _themeTools.mode)("blackAlpha.100", "whiteAlpha.100")(props)
+        bg: hoverBg
       },
       _active: {
-        bg: (0, _themeTools.mode)("blackAlpha.200", "whiteAlpha.200")(props)
+        bg: activeBg
       },
@@ -35,46 +31,27 @@ _focus: {
       }
-    }
-  };
-};
-
-var sizes = {
-  lg: {
-    container: {
-      width: "40px",
-      height: "40px"
-    },
-    icon: {
+    };
+  },
+  sizes: {
+    lg: {
+      w: "40px",
+      h: "40px",
       fontSize: "16px"
-    }
-  },
-  md: {
-    container: {
-      width: "32px",
-      height: "32px"
     },
-    icon: {
+    md: {
+      w: "32px",
+      h: "32px",
       fontSize: "12px"
-    }
-  },
-  sm: {
-    container: {
-      width: "24px",
-      height: "24px"
     },
-    icon: {
+    sm: {
+      w: "24px",
+      h: "24px",
       fontSize: "10px"
     }
+  },
+  defaultProps: {
+    size: "md"
   }
-};
-var defaultProps = {
-  size: "md"
-};
-var closeButton = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes
-};
+});
 var _default = closeButton;
 exports["default"] = _default;
 //# sourceMappingURL=close-button.js.map

dist/cjs/components/code.js

@@ -6,2 +6,4 @@ "use strict";
 
+var _themeTools = require("@chakra-ui/theme-tools");
+
 var _badge = _interopRequireDefault(require("./badge"));
@@ -11,24 +13,15 @@
 
-var register = {
-  parts: ["container"],
-  variants: _badge["default"].register.variants
-};
-var baseStyle = {
-  container: {
+var code = (0, _themeTools.styleConfig)({
+  baseStyle: {
     fontFamily: "mono",
     fontSize: "sm",
-    paddingX: "0.2em",
+    px: "0.2em",
     borderRadius: "sm"
-  }
-};
-var variants = _badge["default"].variants;
-var defaultProps = _badge["default"].defaultProps;
-var code = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  variants: variants
-};
+  },
+  variants: _badge["default"].variants,
+  sizes: _badge["default"].sizes,
+  defaultProps: _badge["default"].defaultProps
+});
 var _default = code;
 exports["default"] = _default;
 //# sourceMappingURL=code.js.map

dist/cjs/components/drawer.js

@@ -10,37 +10,53 @@ "use strict";
 
-var register = {
-  parts: ["overlay", "content", "header", "body", "footer"],
-  sizes: ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "full"]
-};
-
-var baseStyle = function baseStyle(props) {
-  return {
-    overlay: {
-      bg: "blackAlpha.600"
-    },
-    content: _extends({}, props.isFullHeight && {
-      height: "100vh"
-    }, {
-      bg: (0, _themeTools.mode)("white", "gray.700")(props),
-      color: "inherit",
-      boxShadow: (0, _themeTools.mode)("lg", "dark-lg")(props)
-    }),
-    header: {
-      paddingX: 6,
-      paddingY: 4,
-      fontSize: "xl",
-      fontWeight: "semibold"
-    },
-    body: {
-      paddingX: 6,
-      paddingY: 2,
-      flex: 1,
-      overflow: "auto"
-    },
-    footer: {
-      paddingX: 6,
-      paddingY: 4
-    }
-  };
-};
+var drawer = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    overlay: "the overlay or shim",
+    content: "the main content wrapper",
+    header: "the content heading",
+    body: "the main content area",
+    footer: "the action footer"
+  },
+  baseStyle: function baseStyle(props) {
+    var isFullHeight = props.isFullHeight;
+    return {
+      overlay: {
+        bg: "blackAlpha.600"
+      },
+      content: _extends({}, isFullHeight && {
+        height: "100vh"
+      }, {
+        bg: (0, _themeTools.mode)("white", "gray.700")(props),
+        color: "inherit",
+        boxShadow: (0, _themeTools.mode)("lg", "dark-lg")(props)
+      }),
+      header: {
+        px: 6,
+        py: 4,
+        fontSize: "xl",
+        fontWeight: "semibold"
+      },
+      body: {
+        px: 6,
+        py: 2,
+        flex: 1,
+        overflow: "auto"
+      },
+      footer: {
+        px: 6,
+        py: 4
+      }
+    };
+  },
+  sizes: {
+    xs: getSize("xs"),
+    sm: getSize("md"),
+    md: getSize("lg"),
+    lg: getSize("2xl"),
+    xl: getSize("4xl"),
+    full: getSize("full")
+  },
+  defaultProps: {
+    size: "xs"
+  }
+});
 /**
@@ -51,30 +67,21 @@ * Since the `maxWidth` prop references theme.sizes internally,
 
+function getSize(value) {
+  if (value === "full") {
+    return {
+      content: {
+        maxW: "100vw",
+        h: "100vh"
+      }
+    };
+  }
 
-var getSize = function getSize(value) {
   return {
     content: {
-      maxWidth: value
+      maxW: value
     }
   };
-};
+}
 
-var sizes = {
-  xs: getSize("xs"),
-  sm: getSize("md"),
-  md: getSize("lg"),
-  lg: getSize("2xl"),
-  xl: getSize("4xl"),
-  full: getSize("100vw")
-};
-var defaultProps = {
-  size: "xs"
-};
-var modal = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes
-};
-var _default = modal;
+var _default = drawer;
 exports["default"] = _default;
 //# sourceMappingURL=drawer.js.map

dist/cjs/components/editable.js

@@ -6,31 +6,31 @@ "use strict";
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+var _themeTools = require("@chakra-ui/theme-tools");
 
-var register = {
-  parts: ["container", "preview", "input"]
-};
-var previewStyle = {
-  borderRadius: "md",
-  paddingY: "3px",
-  transition: "all 0.2s"
-};
-var baseStyle = {
-  container: {},
-  preview: previewStyle,
-  input: _extends({}, previewStyle, {
-    width: "full",
-    _focus: {
-      boxShadow: "outline"
+var editable = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    preview: "the editable text preview",
+    input: "the editable input field"
+  },
+  baseStyle: {
+    preview: {
+      borderRadius: "md",
+      py: "3px",
+      transition: "all 0.2s"
     },
-    _placeholder: {
-      opacity: 0.6
+    input: {
+      borderRadius: "md",
+      py: "3px",
+      transition: "all 0.2s",
+      width: "full",
+      _focus: {
+        boxShadow: "outline"
+      },
+      _placeholder: {
+        opacity: 0.6
+      }
     }
-  })
-};
-var editable = {
-  register: register,
-  baseStyle: baseStyle
-};
+  }
+});
 var _default = editable;
 exports["default"] = _default;
 //# sourceMappingURL=editable.js.map

dist/cjs/components/form.js

@@ -8,47 +8,35 @@ "use strict";
 
-var register = {
-  parts: ["label", "errorText", "requiredIndicator", "helperText", "errorIcon"]
-};
-
-var baseStyle = function baseStyle(props) {
-  return {
-    label: {
-      fontSize: "md",
-      marginRight: 3,
-      marginBottom: 2,
-      fontWeight: "medium",
-      transition: "all 0.2s",
-      opacity: 1,
-      _disabled: {
-        opacity: 0.4
+var form = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    errorText: "the error message",
+    errorIcon: "the error icon",
+    requiredIndicator: "the requied asterisks",
+    helperText: "the helper text"
+  },
+  baseStyle: function baseStyle(props) {
+    return {
+      errorText: {
+        color: (0, _themeTools.mode)("red.500", "red.300")(props),
+        mt: 2,
+        fontSize: "sm"
+      },
+      requiredIndicator: {
+        ml: 1,
+        color: (0, _themeTools.mode)("red.500", "red.300")(props)
+      },
+      helperText: {
+        mt: 2,
+        color: (0, _themeTools.mode)("gray.500", "whiteAlpha.600")(props),
+        lineHeight: "normal",
+        fontSize: "sm"
+      },
+      errorIcon: {
+        mr: "0.5em",
+        color: (0, _themeTools.mode)("red.500", "red.300")(props)
       }
-    },
-    errorText: {
-      color: (0, _themeTools.mode)("red.500", "red.300")(props),
-      marginTop: 2,
-      fontSize: "sm"
-    },
-    requiredIndicator: {
-      marginLeft: 1,
-      color: (0, _themeTools.mode)("red.500", "red.300")(props)
-    },
-    helperText: {
-      marginTop: 2,
-      color: (0, _themeTools.mode)("gray.500", "whiteAlpha.600")(props),
-      lineHeight: "normal",
-      fontSize: "sm"
-    },
-    errorIcon: {
-      marginRight: "0.5em",
-      color: (0, _themeTools.mode)("red.500", "red.300")(props)
-    }
-  };
-};
-
-var form = {
-  register: register,
-  baseStyle: baseStyle
-};
+    };
+  }
+});
 var _default = form;
 exports["default"] = _default;
 //# sourceMappingURL=form.js.map

dist/cjs/components/heading.js

@@ -5,56 +5,37 @@ "use strict";
 exports["default"] = void 0;
-var register = {
-  parts: ["heading"],
-  sizes: ["2xl", "xl", "lg", "md", "sm", "xs"]
-};
-var baseStyle = {
-  heading: {
+
+var _themeTools = require("@chakra-ui/theme-tools");
+
+var heading = (0, _themeTools.styleConfig)({
+  baseStyle: {
     fontFamily: "heading",
     lineHeight: "shorter",
     fontWeight: "bold"
-  }
-};
-var sizes = {
-  "2xl": {
-    heading: {
+  },
+  sizes: {
+    "2xl": {
       fontSize: ["4xl", null, "5xl"]
-    }
-  },
-  xl: {
-    heading: {
+    },
+    xl: {
       fontSize: ["3xl", null, "4xl"]
-    }
-  },
-  lg: {
-    heading: {
-      fontSize: ["xl", null, "2xl"]
-    }
-  },
-  md: {
-    heading: {
+    },
+    lg: {
+      fontSize: ["2xl", null, "3xl"]
+    },
+    md: {
       fontSize: "xl"
-    }
-  },
-  sm: {
-    heading: {
+    },
+    sm: {
       fontSize: "md"
+    },
+    xs: {
+      fontSize: "sm"
     }
   },
-  xs: {
-    heading: {
-      fontSize: "sm"
-    }
+  defaultProps: {
+    size: "xl"
   }
-};
-var defaultProps = {
-  size: "xl"
-};
-var heading = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes
-};
+});
 var _default = heading;
 exports["default"] = _default;
 //# sourceMappingURL=heading.js.map

dist/cjs/components/index.js

@@ -32,2 +32,4 @@ "use strict";
 
+var _formLabel = _interopRequireDefault(require("./form-label"));
+
 var _menu = _interopRequireDefault(require("./menu"));
@@ -87,2 +89,3 @@
   Code: _code["default"],
+  FormLabel: _formLabel["default"],
   Spinner: _spinner["default"],
@@ -89,0 +92,0 @@ Drawer: _drawer["default"],

dist/cjs/components/input.js

@@ -8,22 +8,8 @@ "use strict";
 
-var register = {
-  parts: ["field", "addon"],
-  sizes: ["sm", "md", "lg"],
-  variants: ["outline", "flushed", "filled", "unstyled"]
-};
-var baseStyle = {
-  field: {
-    width: "100%",
-    outline: 0,
-    position: "relative",
-    appearance: "none",
-    transition: "all 0.2s"
-  }
-};
-var commonSizeStyle = {
+var size = {
   lg: {
     fontSize: "lg",
-    paddingLeft: 4,
+    pl: 4,
     paddingRight: 4,
-    height: 12,
+    h: 12,
     borderRadius: "md"
@@ -33,5 +19,5 @@ },
     fontSize: "md",
-    paddingLeft: 4,
+    pl: 4,
     paddingRight: 4,
-    height: 10,
+    h: 10,
     borderRadius: "md"
@@ -41,163 +27,166 @@ },
     fontSize: "sm",
-    paddingLeft: 3,
+    pl: 3,
     paddingRight: 3,
-    height: 8,
+    h: 8,
     borderRadius: "sm"
   }
 };
-var sizes = {
-  lg: {
-    field: commonSizeStyle.lg,
-    addon: commonSizeStyle.lg
+var input = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    field: "the input field itself",
+    addon: "the left and right input addon"
   },
-  md: {
-    field: commonSizeStyle.md,
-    addon: commonSizeStyle.md
+  baseStyle: {
+    field: {
+      width: "100%",
+      outline: 0,
+      position: "relative",
+      appearance: "none",
+      transition: "all 0.2s"
+    }
   },
-  sm: {
-    field: commonSizeStyle.sm,
-    addon: commonSizeStyle.sm
-  }
-};
-var variants = {
-  outline: function outline(props) {
-    var theme = props.theme;
+  sizes: {
+    lg: {
+      field: size.lg,
+      addon: size.lg
+    },
+    md: {
+      field: size.md,
+      addon: size.md
+    },
+    sm: {
+      field: size.sm,
+      addon: size.sm
+    }
+  },
+  variants: {
+    outline: function outline(props) {
+      var theme = props.theme;
 
-    var _getDefaults = getDefaults(props),
-        fc = _getDefaults.focusBorderColor,
-        ec = _getDefaults.errorBorderColor;
+      var _getDefaults = getDefaults(props),
+          fc = _getDefaults.focusBorderColor,
+          ec = _getDefaults.errorBorderColor;
 
-    return {
-      field: {
-        border: "1px solid",
-        borderColor: (0, _themeTools.mode)("inherit", "whiteAlpha.50")(props),
-        bg: (0, _themeTools.mode)("white", "whiteAlpha.100")(props),
-        _hover: {
-          borderColor: (0, _themeTools.mode)("gray.300", "whiteAlpha.200")(props)
+      return {
+        field: {
+          border: "1px solid",
+          borderColor: (0, _themeTools.mode)("inherit", "whiteAlpha.50")(props),
+          bg: (0, _themeTools.mode)("white", "whiteAlpha.100")(props),
+          _hover: {
+            borderColor: (0, _themeTools.mode)("gray.300", "whiteAlpha.200")(props)
+          },
+          _readOnly: {
+            boxShadow: "none !important",
+            userSelect: "all"
+          },
+          _disabled: {
+            opacity: 0.4,
+            cursor: "not-allowed"
+          },
+          _focus: {
+            borderColor: (0, _themeTools.getColor)(theme, fc),
+            boxShadow: "0 0 0 1px " + (0, _themeTools.getColor)(theme, fc)
+          },
+          _invalid: {
+            borderColor: (0, _themeTools.getColor)(theme, ec),
+            boxShadow: "0 0 0 1px " + (0, _themeTools.getColor)(theme, ec)
+          }
         },
-        _readOnly: {
-          boxShadow: "none !important",
-          userSelect: "all"
+        addon: {
+          border: "1px solid",
+          borderColor: (0, _themeTools.mode)("inherit", "whiteAlpha.50")(props),
+          bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.300")(props)
+        }
+      };
+    },
+    filled: function filled(props) {
+      var theme = props.theme;
+
+      var _getDefaults2 = getDefaults(props),
+          fc = _getDefaults2.focusBorderColor,
+          ec = _getDefaults2.errorBorderColor;
+
+      return {
+        field: {
+          border: "2px solid",
+          borderColor: "transparent",
+          bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.50")(props),
+          _hover: {
+            bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.100")(props)
+          },
+          _readOnly: {
+            boxShadow: "none !important",
+            userSelect: "all"
+          },
+          _disabled: {
+            opacity: 0.4,
+            cursor: "not-allowed"
+          },
+          _focus: {
+            bg: "transparent",
+            borderColor: (0, _themeTools.getColor)(theme, fc)
+          },
+          _invalid: {
+            borderColor: (0, _themeTools.getColor)(theme, ec)
+          }
         },
-        _disabled: {
-          opacity: 0.4,
-          cursor: "not-allowed"
-        },
-        _focus: {
-          zIndex: 1,
-          borderColor: (0, _themeTools.getColor)(theme, fc),
-          boxShadow: "0 0 0 1px " + (0, _themeTools.getColor)(theme, fc)
-        },
-        _invalid: {
-          borderColor: (0, _themeTools.getColor)(theme, ec),
-          boxShadow: "0 0 0 1px " + (0, _themeTools.getColor)(theme, ec)
+        addon: {
+          border: "2px solid",
+          borderColor: "transparent",
+          bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.50")(props)
         }
-      },
-      addon: {
-        border: "1px solid",
-        borderColor: (0, _themeTools.mode)("inherit", "whiteAlpha.50")(props),
-        bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.300")(props)
-      }
-    };
-  },
-  filled: function filled(props) {
-    var theme = props.theme;
+      };
+    },
+    flushed: function flushed(props) {
+      var theme = props.theme;
 
-    var _getDefaults2 = getDefaults(props),
-        fc = _getDefaults2.focusBorderColor,
-        ec = _getDefaults2.errorBorderColor;
+      var _getDefaults3 = getDefaults(props),
+          fc = _getDefaults3.focusBorderColor,
+          ec = _getDefaults3.errorBorderColor;
 
-    return {
-      field: {
-        border: "2px solid",
-        borderColor: "transparent",
-        bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.50")(props),
-        _hover: {
-          bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.100")(props)
-        },
-        _readOnly: {
-          boxShadow: "none !important",
-          userSelect: "all"
-        },
-        _disabled: {
-          opacity: 0.4,
-          cursor: "not-allowed"
-        },
-        _focus: {
-          zIndex: 1,
+      return {
+        field: {
+          borderBottom: "2px solid",
+          borderColor: "inherit",
+          borderRadius: 0,
+          paddingX: 0,
           bg: "transparent",
-          borderColor: (0, _themeTools.getColor)(theme, fc)
+          _readOnly: {
+            boxShadow: "none !important",
+            userSelect: "all"
+          },
+          _focus: {
+            borderColor: (0, _themeTools.getColor)(theme, fc)
+          },
+          _invalid: {
+            borderColor: (0, _themeTools.getColor)(theme, ec)
+          }
         },
-        _invalid: {
-          borderColor: (0, _themeTools.getColor)(theme, ec)
+        addon: {
+          borderBottom: "2px solid",
+          borderColor: "inherit",
+          borderRadius: 0,
+          paddingX: 0,
+          bg: "transparent"
         }
-      },
-      addon: {
-        border: "2px solid",
-        borderColor: "transparent",
-        bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.50")(props)
-      }
-    };
-  },
-  flushed: function flushed(props) {
-    var theme = props.theme;
-
-    var _getDefaults3 = getDefaults(props),
-        fc = _getDefaults3.focusBorderColor,
-        ec = _getDefaults3.errorBorderColor;
-
-    return {
+      };
+    },
+    unstyled: {
       field: {
-        borderBottom: "2px solid",
-        borderColor: "inherit",
-        borderRadius: 0,
+        bg: "transparent",
         paddingX: 0,
-        bg: "transparent",
-        _readOnly: {
-          boxShadow: "none !important",
-          userSelect: "all"
-        },
-        _focus: {
-          zIndex: 1,
-          borderColor: (0, _themeTools.getColor)(theme, fc)
-        },
-        _invalid: {
-          borderColor: (0, _themeTools.getColor)(theme, ec)
-        }
+        height: "auto"
       },
       addon: {
-        borderBottom: "2px solid",
-        borderColor: "inherit",
-        borderRadius: 0,
+        bg: "transparent",
         paddingX: 0,
-        bg: "transparent"
+        height: "auto"
       }
-    };
+    }
   },
-  unstyled: {
-    field: {
-      bg: "transparent",
-      paddingX: 0,
-      height: "auto"
-    },
-    addon: {
-      bg: "transparent",
-      paddingX: 0,
-      height: "auto"
-    }
+  defaultProps: {
+    size: "md",
+    variant: "outline"
   }
-};
-var defaultProps = {
-  size: "md",
-  variant: "outline"
-};
-var input = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes,
-  variants: variants
-};
-var _default = input;
-exports["default"] = _default;
+});
 
@@ -212,2 +201,5 @@ function getDefaults(props) {
 }
+
+var _default = input;
+exports["default"] = _default;
 //# sourceMappingURL=input.js.map

dist/cjs/components/kbd.js

@@ -8,9 +8,5 @@ "use strict";
 
-var register = {
-  parts: ["kbd"]
-};
-
-var baseStyle = function baseStyle(props) {
-  return {
-    kbd: {
+var kbd = (0, _themeTools.styleConfig)({
+  baseStyle: function baseStyle(props) {
+    return {
       bg: (0, _themeTools.mode)("gray.100", "whiteAlpha")(props),
@@ -25,12 +21,7 @@ borderRadius: "md",
       whiteSpace: "nowrap"
-    }
-  };
-};
-
-var kbd = {
-  register: register,
-  baseStyle: baseStyle
-};
+    };
+  }
+});
 var _default = kbd;
 exports["default"] = _default;
 //# sourceMappingURL=kbd.js.map

dist/cjs/components/link.js

@@ -5,7 +5,7 @@ "use strict";
 exports["default"] = void 0;
-var register = {
-  parts: ["link"]
-};
-var baseStyle = {
-  link: {
+
+var _themeTools = require("@chakra-ui/theme-tools");
+
+var link = (0, _themeTools.styleConfig)({
+  baseStyle: {
     transition: "all 0.15s ease-out",
@@ -28,9 +28,5 @@ cursor: "pointer",
   }
-};
-var link = {
-  register: register,
-  baseStyle: baseStyle
-};
+});
 var _default = link;
 exports["default"] = _default;
 //# sourceMappingURL=link.js.map

dist/cjs/components/menu.js

@@ -8,54 +8,54 @@ "use strict";
 
-var register = {
-  parts: ["menuList", "menuItem", "menuButton", "groupTitle", "menuDivider", "icon", "command"]
-};
-
-var baseStyle = function baseStyle(props) {
-  return {
-    menuList: {
-      bg: (0, _themeTools.mode)("#fff", "gray.700")(props),
-      boxShadow: (0, _themeTools.mode)("sm", "dark-lg")(props),
-      color: "inherit",
-      minWidth: "3xs",
-      paddingY: "2",
-      zIndex: 1,
-      borderRadius: "md",
-      borderWidth: "1px"
-    },
-    menuItem: {
-      paddingY: "0.4rem",
-      paddingX: "0.8rem",
-      transition: "background 50ms ease-in 0s",
-      _focus: {
-        bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.100")(props)
+var menu = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    item: "the menu item button",
+    command: "the menu item command",
+    list: "the menu items wrapper",
+    button: "the menu list trigger",
+    groupTitle: "the menu group title"
+  },
+  baseStyle: function baseStyle(props) {
+    return {
+      list: {
+        bg: (0, _themeTools.mode)("#fff", "gray.700")(props),
+        boxShadow: (0, _themeTools.mode)("sm", "dark-lg")(props),
+        color: "inherit",
+        minW: "3xs",
+        py: "2",
+        zIndex: 1,
+        borderRadius: "md",
+        borderWidth: "1px"
       },
-      _active: {
-        bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.200")(props)
+      item: {
+        py: "0.4rem",
+        paddingX: "0.8rem",
+        transition: "background 50ms ease-in 0s",
+        _focus: {
+          bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.100")(props)
+        },
+        _active: {
+          bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.200")(props)
+        },
+        _expanded: {
+          bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.100")(props)
+        },
+        _disabled: {
+          opacity: 0.4,
+          cursor: "not-allowed"
+        }
       },
-      _expanded: {
-        bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.100")(props)
+      groupTitle: {
+        marginX: 4,
+        marginY: 2,
+        fontWeight: "semibold",
+        fontSize: "sm"
       },
-      _disabled: {
-        opacity: 0.4,
-        cursor: "not-allowed"
+      command: {
+        opacity: 0.6
       }
-    },
-    groupTitle: {
-      marginX: 4,
-      marginY: 2,
-      fontWeight: "semibold",
-      fontSize: "sm"
-    },
-    command: {
-      opacity: 0.6
-    }
-  };
-};
-
-var menu = {
-  register: register,
-  baseStyle: baseStyle
-};
+    };
+  }
+});
 var _default = menu;
 exports["default"] = _default;
 //# sourceMappingURL=menu.js.map

dist/cjs/components/modal.js

@@ -8,44 +8,64 @@ "use strict";
 
-var register = {
-  parts: ["overlay", "content", "header", "body", "footer"],
-  sizes: ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "full"]
-};
-
-var baseStyle = function baseStyle(props) {
-  var isCentered = props.isCentered,
-      scrollBehavior = props.scrollBehavior;
-  return {
-    overlay: {
-      bg: "blackAlpha.600",
-      display: "flex",
-      justifyContent: "center",
-      alignItems: isCentered ? "center" : "flex-start",
-      overflow: scrollBehavior === "inside" ? "hidden" : "auto"
-    },
-    content: {
-      borderRadius: "md",
-      bg: (0, _themeTools.mode)("white", "gray.700")(props),
-      color: "inherit",
-      marginY: "3.75rem",
-      maxHeight: scrollBehavior === "inside" ? "calc(100vh - 7.5rem)" : undefined,
-      boxShadow: (0, _themeTools.mode)("lg", "dark-lg")(props)
-    },
-    header: {
-      paddingX: 6,
-      paddingY: 4,
-      fontSize: "xl",
-      fontWeight: "semibold"
-    },
-    body: {
-      paddingX: 6,
-      paddingY: 2,
-      flex: 1,
-      overflow: scrollBehavior === "inside" ? "auto" : undefined
-    },
-    footer: {
-      paddingX: 6,
-      paddingY: 4
-    }
-  };
-};
+var modal = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    overlay: "the modal overlay",
+    content: "the modal content wrapper",
+    header: "the modal content header",
+    body: "the modal main content area",
+    footer: "the modal footer action"
+  },
+  baseStyle: function baseStyle(props) {
+    var isCentered = props.isCentered,
+        scrollBehavior = props.scrollBehavior;
+    return {
+      overlay: {
+        bg: "blackAlpha.600",
+        display: "flex",
+        justifyContent: "center",
+        alignItems: isCentered ? "center" : "flex-start",
+        overflow: scrollBehavior === "inside" ? "hidden" : "auto"
+      },
+      content: {
+        borderRadius: "md",
+        bg: (0, _themeTools.mode)("white", "gray.700")(props),
+        color: "inherit",
+        my: "3.75rem",
+        maxH: scrollBehavior === "inside" ? "calc(100vh - 7.5rem)" : undefined,
+        boxShadow: (0, _themeTools.mode)("lg", "dark-lg")(props)
+      },
+      header: {
+        px: 6,
+        py: 4,
+        fontSize: "xl",
+        fontWeight: "semibold"
+      },
+      body: {
+        px: 6,
+        py: 2,
+        flex: 1,
+        overflow: scrollBehavior === "inside" ? "auto" : undefined
+      },
+      footer: {
+        px: 6,
+        py: 4
+      }
+    };
+  },
+  sizes: {
+    xs: getSize("xs"),
+    sm: getSize("sm"),
+    md: getSize("md"),
+    lg: getSize("lg"),
+    xl: getSize("xl"),
+    "2xl": getSize("2xl"),
+    "3xl": getSize("3xl"),
+    "4xl": getSize("4xl"),
+    "5xl": getSize("5xl"),
+    "6xl": getSize("6xl"),
+    full: getSize("full")
+  },
+  defaultProps: {
+    size: "md"
+  }
+});
 /**
@@ -56,7 +76,15 @@ * Since the `maxWidth` prop references theme.sizes internally,
 
+function getSize(value) {
+  if (value === "full") {
+    return {
+      content: {
+        maxW: "100vw",
+        h: "100vh"
+      }
+    };
+  }
 
-function getSize(value) {
   return {
     content: {
-      maxWidth: value
+      maxW: value
     }
@@ -66,98 +94,4 @@ };
 
-var sizes = {
-  xs: getSize("xs"),
-  sm: getSize("sm"),
-  md: getSize("md"),
-  lg: getSize("lg"),
-  xl: getSize("xl"),
-  "2xl": getSize("2xl"),
-  "3xl": getSize("3xl"),
-  "4xl": getSize("4xl"),
-  "5xl": getSize("5xl"),
-  "6xl": getSize("6xl"),
-  full: getSize("full")
-};
-var defaultProps = {
-  size: "md"
-};
-var transition = {
-  overlay: {
-    timeout: {
-      enter: 150,
-      exit: 100
-    },
-    enter: {
-      transition: {
-        easing: "cubic-bezier(0,0,.2,1)",
-        duration: "150ms",
-        property: "opacity"
-      },
-      from: {
-        opacity: 0.01
-      },
-      to: {
-        opacity: 1
-      }
-    },
-    exit: {
-      transition: {
-        easing: "cubic-bezier(.4,0,1,1)",
-        duration: "100ms",
-        property: "opacity"
-      },
-      from: {
-        opacity: 1
-      },
-      to: {
-        opacity: 0.01
-      }
-    }
-  },
-  content: {
-    addAppearStyles: true,
-    timeout: {
-      enter: 150,
-      exit: 100
-    },
-    enter: {
-      transition: {
-        easing: "cubic-bezier(0,0,.2,1)",
-        duration: "150ms",
-        property: "opacity, transform"
-      },
-      from: {
-        opacity: 0.01,
-        transform: "scale(0.97)"
-      },
-      to: {
-        opacity: 1,
-        transform: "scale(1)"
-      }
-    },
-    exit: {
-      transition: {
-        easing: "cubic-bezier(.4,0,1,1)",
-        duration: "100ms",
-        property: "opacity, transform"
-      },
-      from: {
-        opacity: 1,
-        transform: "scale(1)"
-      },
-      to: {
-        opacity: 0.01,
-        transform: "scale(0.97)"
-      }
-    }
-  }
-};
-var modal = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes,
-  transition: transition
-};
 var _default = modal;
 exports["default"] = _default;
 //# sourceMappingURL=modal.js.map

dist/cjs/components/number-input.js

@@ -12,38 +12,43 @@ "use strict";
 
-var register = {
-  parts: ["field", "stepper", "stepperGroup"],
-  sizes: _input["default"].register.sizes,
-  variants: _input["default"].register.variants
-};
+var numberInput = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    field: "the input field",
+    stepper: "desktop - the increment and decrement button",
+    stepperGroup: "desktop - the increment and decrement button group"
+  },
+  baseStyle: function baseStyle(props) {
+    var _input$baseStyle;
 
-var baseStyle = function baseStyle(props) {
-  return {
-    field: _input["default"].baseStyle.field,
-    stepperGroup: {
-      width: "24px"
-    },
-    stepper: {
-      borderLeft: "1px solid",
-      borderColor: (0, _themeTools.mode)("inherit", "whiteAlpha.300")(props),
-      color: (0, _themeTools.mode)("inherit", "whiteAlpha.800")(props),
-      _active: {
-        bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.300")(props)
+    return {
+      field: (_input$baseStyle = _input["default"].baseStyle) == null ? void 0 : _input$baseStyle.field,
+      stepperGroup: {
+        width: "24px"
       },
-      _disabled: {
-        opacity: 0.4,
-        cursor: "not-allowed"
+      stepper: {
+        borderLeft: "1px solid",
+        borderColor: (0, _themeTools.mode)("inherit", "whiteAlpha.300")(props),
+        color: (0, _themeTools.mode)("inherit", "whiteAlpha.800")(props),
+        _active: {
+          bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.300")(props)
+        },
+        _disabled: {
+          opacity: 0.4,
+          cursor: "not-allowed"
+        }
       }
-    }
-  };
-};
+    };
+  },
+  sizes: {
+    sm: getSize("sm"),
+    md: getSize("md"),
+    lg: getSize("lg")
+  },
+  variants: _input["default"].variants,
+  defaultProps: _input["default"].defaultProps
+});
 
-var sizes = {
-  sm: getSizeStyle("sm"),
-  md: getSizeStyle("md"),
-  lg: getSizeStyle("lg")
-};
+function getSize(size) {
+  var _input$sizes;
 
-function getSizeStyle(size) {
-  var inputPartsStyle = _input["default"].sizes[size];
-  var inputStyle = typeof inputPartsStyle !== "function" ? inputPartsStyle == null ? void 0 : inputPartsStyle.field : {};
+  var sizeStyle = (_input$sizes = _input["default"].sizes) == null ? void 0 : _input$sizes[size];
   var radius = {
@@ -55,3 +60,3 @@ lg: "md",
   return {
-    field: inputStyle,
+    field: sizeStyle == null ? void 0 : sizeStyle.field,
     stepper: {
@@ -64,3 +69,3 @@ fontSize: size === "lg" ? "14px" : "10px",
         borderBottomRightRadius: radius[size],
-        marginTop: "-1px",
+        mt: "-1px",
         borderTopWidth: 1
@@ -72,42 +77,4 @@ }
 
-var variants = {
-  outline: function outline(props) {
-    return {
-      field: getVariantStyle("outline", props)
-    };
-  },
-  filled: function filled(props) {
-    return {
-      field: getVariantStyle("filled", props)
-    };
-  },
-  flushed: function flushed(props) {
-    return {
-      field: getVariantStyle("flushed", props)
-    };
-  },
-  unstyled: function unstyled(props) {
-    return {
-      field: getVariantStyle("unstyled", props)
-    };
-  }
-};
-
-function getVariantStyle(variant, props) {
-  var _partsStyle$field;
-
-  var partsStyle = (0, _themeTools.runIfFn)(_input["default"].variants[variant], props);
-  return (_partsStyle$field = partsStyle == null ? void 0 : partsStyle.field) != null ? _partsStyle$field : {};
-}
-
-var defaultProps = _input["default"].defaultProps;
-var numberInput = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes,
-  variants: variants
-};
 var _default = numberInput;
 exports["default"] = _default;
 //# sourceMappingURL=number-input.js.map

dist/cjs/components/pin-input.js

@@ -6,49 +6,58 @@ "use strict";
 
+var _themeTools = require("@chakra-ui/theme-tools");
+
 var _input = _interopRequireDefault(require("./input"));
 
+var _input$baseStyle, _input$variants4;
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-var register = {
-  parts: ["field"],
-  sizes: _input["default"].register.sizes,
-  variants: _input["default"].register.variants
-};
-var baseStyle = _input["default"].baseStyle;
-var variants = _input["default"].variants;
-var sizes = {
-  lg: {
-    field: {
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+var pinInput = (0, _themeTools.styleConfig)({
+  baseStyle: _extends({}, (_input$baseStyle = _input["default"].baseStyle) == null ? void 0 : _input$baseStyle.field, {
+    textAlign: "center"
+  }),
+  sizes: {
+    lg: {
       fontSize: "lg",
-      width: 12,
-      height: 12,
+      w: 12,
+      h: 12,
       borderRadius: "md"
-    }
-  },
-  md: {
-    field: {
+    },
+    md: {
       fontSize: "md",
-      width: 10,
-      height: 10,
+      w: 10,
+      h: 10,
       borderRadius: "md"
-    }
-  },
-  sm: {
-    field: {
+    },
+    sm: {
       fontSize: "sm",
-      width: 8,
-      height: 8,
+      w: 8,
+      h: 8,
       borderRadius: "sm"
     }
-  }
-};
-var defaultProps = _input["default"].defaultProps;
-var pinInput = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  variants: variants,
-  sizes: sizes
-};
+  },
+  variants: {
+    outline: function outline(props) {
+      var _input$variants$outli, _input$variants, _input$variants$outli2;
+
+      return (_input$variants$outli = (_input$variants = _input["default"].variants) == null ? void 0 : (_input$variants$outli2 = _input$variants.outline(props)) == null ? void 0 : _input$variants$outli2.field) != null ? _input$variants$outli : {};
+    },
+    flushed: function flushed(props) {
+      var _input$variants$flush, _input$variants2, _input$variants2$flus;
+
+      return (_input$variants$flush = (_input$variants2 = _input["default"].variants) == null ? void 0 : (_input$variants2$flus = _input$variants2.flushed(props)) == null ? void 0 : _input$variants2$flus.field) != null ? _input$variants$flush : {};
+    },
+    filled: function filled(props) {
+      var _input$variants$fille, _input$variants3;
+
+      return (_input$variants$fille = (_input$variants3 = _input["default"].variants) == null ? void 0 : _input$variants3.filled(props).field) != null ? _input$variants$fille : {};
+    },
+    unstyled: (_input$variants4 = _input["default"].variants) == null ? void 0 : _input$variants4.unstyled.field
+  },
+  defaultProps: _input["default"].defaultProps
+});
 var _default = pinInput;
 exports["default"] = _default;
 //# sourceMappingURL=pin-input.js.map

dist/cjs/components/popover.js

@@ -8,49 +8,44 @@ "use strict";
 
-var register = {
-  parts: ["content", "header", "body", "footer"]
-};
-
-var baseStyle = function baseStyle(props) {
-  return {
-    content: {
-      bg: (0, _themeTools.mode)("white", "gray.700")(props),
-      border: "1px solid",
-      borderColor: "inherit",
-      borderRadius: "md",
-      boxShadow: "sm",
-      width: "100%",
-      maxWidth: "xs",
-      zIndex: "1",
-      _focus: {
-        outline: 0,
-        boxShadow: "outline"
+var popover = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    content: "the popover's content wrapper",
+    header: "the popover heading",
+    body: "the popover main content",
+    footer: "the action footers for popover"
+  },
+  baseStyle: function baseStyle(props) {
+    return {
+      content: {
+        bg: (0, _themeTools.mode)("white", "gray.700")(props),
+        border: "1px solid",
+        borderColor: "inherit",
+        borderRadius: "md",
+        boxShadow: "sm",
+        w: "100%",
+        maxW: "xs",
+        zIndex: "1",
+        _focus: {
+          outline: 0,
+          boxShadow: "outline"
+        }
+      },
+      header: {
+        px: 3,
+        py: 2,
+        borderBottomWidth: "1px"
+      },
+      body: {
+        px: 3,
+        py: 2
+      },
+      footer: {
+        px: 3,
+        py: 2,
+        borderTopWidth: "1px"
       }
-    },
-    header: {
-      paddingX: 3,
-      paddingY: 2,
-      borderBottomWidth: "1px"
-    },
-    body: {
-      paddingX: 3,
-      paddingY: 2
-    },
-    footer: {
-      paddingX: 3,
-      paddingY: 2,
-      borderTopWidth: "1px"
-    }
-  };
-};
-
-var transition = {
-  content: _themeTools.scaleFade
-};
-var popover = {
-  register: register,
-  baseStyle: baseStyle,
-  transition: transition
-};
+    };
+  }
+});
 var _default = popover;
 exports["default"] = _default;
 //# sourceMappingURL=popover.js.map

dist/cjs/components/progress.js

@@ -10,25 +10,53 @@ "use strict";
 
-var register = {
-  parts: ["track", "filledTrack", "label"],
-  sizes: ["xs", "sm", "md", "lg"]
-};
-
-var baseStyle = function baseStyle(props) {
-  return {
-    label: {
-      lineHeight: "1",
-      fontSize: "0.25em",
-      fontWeight: "bold",
-      color: "white"
+var progress = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    track: "the linear progress track",
+    filledTrack: "the inner filled track",
+    label: "the value indicator or label"
+  },
+  baseStyle: function baseStyle(props) {
+    return {
+      label: {
+        lineHeight: "1",
+        fontSize: "0.25em",
+        fontWeight: "bold",
+        color: "white"
+      },
+      track: {
+        bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.300")(props)
+      },
+      filledTrack: _extends({
+        transition: "all 0.3s"
+      }, filledStyle(props))
+    };
+  },
+  sizes: {
+    xs: {
+      track: {
+        h: "0.25rem"
+      }
     },
-    track: {
-      bg: (0, _themeTools.mode)("gray.100", "whiteAlpha.300")(props)
+    sm: {
+      track: {
+        h: "0.5rem"
+      }
     },
-    filledTrack: _extends({
-      transition: "all 0.3s"
-    }, getFilledTrackStyle(props))
-  };
-};
+    md: {
+      track: {
+        h: "0.75rem"
+      }
+    },
+    lg: {
+      track: {
+        h: "1rem"
+      }
+    }
+  },
+  defaultProps: {
+    size: "md",
+    colorScheme: "blue"
+  }
+});
 
-function getFilledTrackStyle(props) {
+function filledStyle(props) {
   var c = props.colorScheme,
@@ -41,42 +69,10 @@ t = props.theme,
   var gradient = "linear-gradient(\n    to right,\n    transparent 0%,\n    " + (0, _themeTools.getColor)(t, bg) + " 50%,\n    transparent 100%\n  )";
-  var shouldAddStripe = !isIndeterminate && hasStripe;
-  return _extends({}, shouldAddStripe && stripeStyle, {
-    bg: isIndeterminate ? gradient : bg
+  var addStripe = !isIndeterminate && hasStripe;
+  return _extends({}, addStripe && stripeStyle, {
+    bgColor: isIndeterminate ? gradient : bg
   });
 }
 
-var sizes = {
-  xs: {
-    track: {
-      height: "0.25rem"
-    }
-  },
-  sm: {
-    track: {
-      height: "0.5rem"
-    }
-  },
-  md: {
-    track: {
-      height: "0.75rem"
-    }
-  },
-  lg: {
-    track: {
-      height: "1rem"
-    }
-  }
-};
-var defaultProps = {
-  size: "md",
-  colorScheme: "blue"
-};
-var progress = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes
-};
 var _default = progress;
 exports["default"] = _default;
 //# sourceMappingURL=progress.js.map

dist/cjs/components/radio.js

@@ -14,49 +14,68 @@ "use strict";
 
-var register = {
-  parts: ["control", "label"],
-  sizes: _checkbox["default"].register.sizes
-};
+var radio = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    control: "the radio input container",
+    label: "the radio label"
+  },
+  baseStyle: function baseStyle(props) {
+    var _checkbox$baseStyle;
 
-var baseStyle = function baseStyle(props) {
-  var _runIfFn = (0, _themeTools.runIfFn)(_checkbox["default"].baseStyle, props),
-      label = _runIfFn.label,
-      control = _runIfFn.control;
+    var _ref = (_checkbox$baseStyle = _checkbox["default"].baseStyle == null ? void 0 : _checkbox["default"].baseStyle(props)) != null ? _checkbox$baseStyle : {},
+        label = _ref.label,
+        control = _ref.control;
 
-  return {
-    label: label,
-    control: _extends({}, control, {
-      borderRadius: "full",
-      _checked: _extends({}, control == null ? void 0 : control["_checked"], {
-        _before: {
-          content: "\"\"",
-          display: "inline-block",
-          position: "relative",
-          width: "50%",
-          height: "50%",
-          borderRadius: "50%",
-          bg: "currentColor"
-        }
+    return {
+      label: label,
+      control: _extends({}, control, {
+        borderRadius: "full",
+        _checked: _extends({}, control == null ? void 0 : control["_checked"], {
+          _before: {
+            content: "\"\"",
+            display: "inline-block",
+            position: "relative",
+            width: "50%",
+            height: "50%",
+            borderRadius: "50%",
+            bg: "currentColor"
+          }
+        })
       })
-    })
-  };
-};
-
-var sizes = _extends({}, _checkbox["default"].sizes, {
-  sm: {
-    control: {
-      width: 3,
-      height: 3
+    };
+  },
+  sizes: {
+    md: {
+      control: {
+        w: 4,
+        h: 4
+      },
+      label: {
+        fontSize: "md"
+      }
+    },
+    lg: {
+      control: {
+        w: 5,
+        h: 5
+      },
+      label: {
+        fontSize: "lg"
+      }
+    },
+    sm: {
+      control: {
+        width: 3,
+        height: 3
+      },
+      label: {
+        fontSize: "sm"
+      }
     }
+  },
+  defaultProps: {
+    size: "md",
+    colorScheme: "blue"
   }
 });
-
-var defaultProps = _checkbox["default"].defaultProps;
-var radio = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes
-};
 var _default = radio;
 exports["default"] = _default;
 //# sourceMappingURL=radio.js.map

dist/cjs/components/select.js

@@ -6,2 +6,4 @@ "use strict";
 
+var _themeTools = require("@chakra-ui/theme-tools");
+
 var _input = _interopRequireDefault(require("./input"));
@@ -13,34 +15,34 @@
 
-var register = {
-  parts: ["field", "icon"],
-  sizes: _input["default"].register.sizes,
-  variants: _input["default"].register.variants
-};
-var baseStyle = {
-  field: _extends({}, _input["default"].baseStyle.field, {
-    appearance: "none",
-    paddingRight: "2rem",
-    paddingBottom: "1px",
-    lineHeight: "normal"
-  }),
-  icon: {
-    color: "currentColor",
-    fontSize: "1.25rem",
-    _disabled: {
-      opacity: 0.5
-    }
-  }
-};
-var sizes = _input["default"].sizes;
-var variants = _input["default"].variants;
-var defaultProps = _input["default"].defaultProps;
-var select = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes,
-  variants: variants
-};
+var select = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    field: "the select field itself",
+    icon: "the select field icon"
+  },
+  baseStyle: function baseStyle(props) {
+    var _input$baseStyle;
+
+    return {
+      field: _extends({}, (_input$baseStyle = _input["default"].baseStyle) == null ? void 0 : _input$baseStyle.field, {
+        appearance: "none",
+        paddingBottom: "1px",
+        lineHeight: "normal",
+        "> option": {
+          bg: (0, _themeTools.mode)("white", "gray.700")(props)
+        }
+      }),
+      icon: {
+        color: "currentColor",
+        fontSize: "1.25rem",
+        _disabled: {
+          opacity: 0.5
+        }
+      }
+    };
+  },
+  sizes: _input["default"].sizes,
+  variants: _input["default"].variants,
+  defaultProps: _input["default"].defaultProps
+});
 var _default = select;
 exports["default"] = _default;
 //# sourceMappingURL=select.js.map

dist/cjs/components/skeleton.js

 "use strict";
 
 exports.__esModule = true;
-exports.frame = frame;
+exports.fade = fade;
 exports["default"] = void 0;
@@ -11,17 +11,15 @@
 
-var register = {
-  parts: ["skeleton"]
-};
-
-var baseStyle = function baseStyle(props) {
-  var _props$startColor = props.startColor,
-      startColor = _props$startColor === void 0 ? (0, _themeTools.mode)("gray.100", "gray.800")(props) : _props$startColor,
-      _props$endColor = props.endColor,
-      endColor = _props$endColor === void 0 ? (0, _themeTools.mode)("gray.400", "gray.600")(props) : _props$endColor,
-      speed = props.speed,
-      theme = props.theme;
-  var start = (0, _themeTools.getColor)(theme, startColor);
-  var end = (0, _themeTools.getColor)(theme, endColor);
-  return {
-    skeleton: {
+var skeleton = (0, _themeTools.styleConfig)({
+  baseStyle: function baseStyle(props) {
+    var defaultStartColor = (0, _themeTools.mode)("gray.100", "gray.800")(props);
+    var defaultEndColor = (0, _themeTools.mode)("gray.400", "gray.600")(props);
+    var _props$startColor = props.startColor,
+        startColor = _props$startColor === void 0 ? defaultStartColor : _props$startColor,
+        _props$endColor = props.endColor,
+        endColor = _props$endColor === void 0 ? defaultEndColor : _props$endColor,
+        speed = props.speed,
+        theme = props.theme;
+    var start = (0, _themeTools.getColor)(theme, startColor);
+    var end = (0, _themeTools.getColor)(theme, endColor);
+    return {
       opacity: 0.7,
@@ -31,15 +29,10 @@ borderRadius: "2px",
       background: end,
-      animation: speed + "s linear infinite alternate " + frame(start, end)
-    }
-  };
-};
-
-var skeleton = {
-  register: register,
-  baseStyle: baseStyle
-};
+      animation: speed + "s linear infinite alternate " + fade(start, end)
+    };
+  }
+});
 var _default = skeleton;
 exports["default"] = _default;
 
-function frame(startColor, endColor) {
+function fade(startColor, endColor) {
   return (0, _system.keyframes)({
@@ -46,0 +39,0 @@ from: {

dist/cjs/components/skip-link.js

@@ -8,9 +8,5 @@ "use strict";
 
-var register = {
-  parts: ["link"]
-};
-
-var baseStyle = function baseStyle(props) {
-  return {
-    link: {
+var skipLink = (0, _themeTools.styleConfig)({
+  baseStyle: function baseStyle(props) {
+    return {
       borderRadius: "md",
@@ -26,12 +22,7 @@ fontWeight: "semibold",
       }
-    }
-  };
-};
-
-var skipLink = {
-  register: register,
-  baseStyle: baseStyle
-};
+    };
+  }
+});
 var _default = skipLink;
 exports["default"] = _default;
 //# sourceMappingURL=skip-link.js.map

dist/cjs/components/slider.js

@@ -10,133 +10,136 @@ "use strict";
 
-var register = {
-  parts: ["container", "thumb", "track", "filledTrack"],
-  sizes: ["sm", "md", "lg"]
-};
-
-var baseStyle = function baseStyle(props) {
-  return {
-    container: _extends({
-      _disabled: {
-        opacity: 0.6,
-        cursor: "default",
-        pointerEvents: "none"
-      }
-    }, (0, _themeTools.orient)({
-      orientation: props.orientation,
-      vertical: {
-        height: "100%"
-      },
-      horizontal: {
-        width: "100%"
-      }
-    })),
-    track: {
-      borderRadius: "sm",
-      bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.200")(props),
-      _disabled: {
-        bg: (0, _themeTools.mode)("gray.300", "whiteAlpha.300")(props)
-      }
-    },
-    thumb: _extends({
-      zIndex: 1,
-      borderRadius: "full",
-      bg: "white",
-      boxShadow: "sm",
-      border: "1px solid",
-      borderColor: "transparent",
-      transition: "transform 0.2s",
-      _focus: {
-        boxShadow: "outline"
-      },
-      _disabled: {
-        bg: "gray.300"
-      }
-    }, (0, _themeTools.orient)({
-      orientation: props.orientation,
-      vertical: {
-        left: "50%",
-        transform: "translateX(-50%)",
-        _active: {
-          transform: "translateX(-50%) scale(1.15)"
+var slider = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    container: "the slider wrapper",
+    thumb: "the slider thumb or handle",
+    track: "the slider outer track",
+    filledTrack: "the slider inner/filled track"
+  },
+  baseStyle: function baseStyle(props) {
+    var orientation = props.orientation,
+        c = props.colorScheme;
+    return {
+      container: _extends({
+        _disabled: {
+          opacity: 0.6,
+          cursor: "default",
+          pointerEvents: "none"
         }
-      },
-      horizontal: {
-        top: "50%",
-        transform: "translateY(-50%)",
-        _active: {
-          transform: "translateY(-50%) scale(1.15)"
+      }, (0, _themeTools.orient)({
+        orientation: orientation,
+        vertical: {
+          h: "100%"
+        },
+        horizontal: {
+          w: "100%"
         }
-      }
-    })),
-    filledTrack: {
-      bg: (0, _themeTools.mode)(props.colorScheme + ".500", props.colorScheme + ".200")(props)
-    }
-  };
-};
-
-var sizes = {
-  lg: function lg(props) {
-    return {
-      thumb: {
-        width: "16px",
-        height: "16px"
+      })),
+      track: {
+        borderRadius: "sm",
+        bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.200")(props),
+        _disabled: {
+          bg: (0, _themeTools.mode)("gray.300", "whiteAlpha.300")(props)
+        }
       },
-      track: (0, _themeTools.orient)({
-        orientation: props.orientation,
-        horizontal: {
-          height: "4px"
+      thumb: _extends({
+        zIndex: 1,
+        borderRadius: "full",
+        bg: "white",
+        boxShadow: "base",
+        border: "1px solid",
+        borderColor: "transparent",
+        transition: "transform 0.2s",
+        _focus: {
+          boxShadow: "outline"
         },
-        vertical: {
-          width: "4px"
+        _disabled: {
+          bg: "gray.300"
         }
-      })
+      }, thumbOrientation(props)),
+      filledTrack: {
+        bg: (0, _themeTools.mode)(c + ".500", c + ".200")(props)
+      }
     };
   },
-  md: function md(props) {
-    return {
-      thumb: {
-        width: "14px",
-        height: "14px"
-      },
-      track: (0, _themeTools.orient)({
-        orientation: props.orientation,
-        horizontal: {
-          height: "4px"
+  sizes: {
+    lg: function lg(props) {
+      return {
+        thumb: {
+          w: "16px",
+          h: "16px"
         },
-        vertical: {
-          width: "4px"
-        }
-      })
-    };
+        track: (0, _themeTools.orient)({
+          orientation: props.orientation,
+          horizontal: {
+            h: "4px"
+          },
+          vertical: {
+            w: "4px"
+          }
+        })
+      };
+    },
+    md: function md(props) {
+      return {
+        thumb: {
+          w: "14px",
+          h: "14px"
+        },
+        track: (0, _themeTools.orient)({
+          orientation: props.orientation,
+          horizontal: {
+            h: "4px"
+          },
+          vertical: {
+            w: "4px"
+          }
+        })
+      };
+    },
+    sm: function sm(props) {
+      return {
+        thumb: {
+          w: "10px",
+          h: "10px"
+        },
+        track: (0, _themeTools.orient)({
+          orientation: props.orientation,
+          horizontal: {
+            h: "2px"
+          },
+          vertical: {
+            w: "2px"
+          }
+        })
+      };
+    }
   },
-  sm: function sm(props) {
-    return {
-      thumb: {
-        width: "10px",
-        height: "10px"
-      },
-      track: (0, _themeTools.orient)({
-        orientation: props.orientation,
-        horizontal: {
-          height: "2px"
-        },
-        vertical: {
-          width: "2px"
-        }
-      })
-    };
+  defaultProps: {
+    size: "md",
+    colorScheme: "blue"
   }
-};
-var defaultProps = {
-  size: "md",
-  colorScheme: "blue"
-};
-var slider = {
-  register: register,
-  defaultProps: defaultProps,
-  sizes: sizes,
-  baseStyle: baseStyle
-};
+});
+
+function thumbOrientation(props) {
+  return (0, _themeTools.orient)({
+    orientation: props.orientation,
+    vertical: {
+      left: "50%",
+      transform: "translateX(-50%)",
+      _active: {
+        transform: "translateX(-50%) scale(1.15)"
+      }
+    },
+    horizontal: {
+      top: "50%",
+      transform: "translateY(-50%)",
+      _active: {
+        transform: "translateY(-50%) scale(1.15)"
+      }
+    }
+  });
+}
+
 var _default = slider;
 exports["default"] = _default;
 //# sourceMappingURL=slider.js.map

dist/cjs/components/spinner.js

@@ -5,48 +5,34 @@ "use strict";
 exports["default"] = void 0;
-var register = {
-  parts: ["spinner"],
-  sizes: ["xs", "sm", "md", "lg", "xl"]
-};
-var sizes = {
-  xs: {
-    spinner: {
-      width: "0.75rem",
-      height: "0.75rem"
+
+var _themeTools = require("@chakra-ui/theme-tools");
+
+var spinner = (0, _themeTools.styleConfig)({
+  sizes: {
+    xs: {
+      w: "0.75rem",
+      h: "0.75rem"
+    },
+    sm: {
+      w: "1rem",
+      h: "1rem"
+    },
+    md: {
+      w: "1.5rem",
+      h: "1.5rem"
+    },
+    lg: {
+      w: "2rem",
+      h: "2rem"
+    },
+    xl: {
+      w: "3rem",
+      h: "3rem"
     }
   },
-  sm: {
-    spinner: {
-      width: "1rem",
-      height: "1rem"
-    }
-  },
-  md: {
-    spinner: {
-      width: "1.5rem",
-      height: "1.5rem"
-    }
-  },
-  lg: {
-    spinner: {
-      width: "2rem",
-      height: "2rem"
-    }
-  },
-  xl: {
-    spinner: {
-      width: "3rem",
-      height: "3rem"
-    }
+  defaultProps: {
+    size: "md"
   }
-};
-var defaultProps = {
-  size: "md"
-};
-var spinner = {
-  register: register,
-  defaultProps: defaultProps,
-  sizes: sizes
-};
+});
 var _default = spinner;
 exports["default"] = _default;
 //# sourceMappingURL=spinner.js.map

dist/cjs/components/stat.js

@@ -5,53 +5,50 @@ "use strict";
 exports["default"] = void 0;
-var register = {
-  parts: ["label", "helpText", "number", "container", "icon"],
-  sizes: ["sm", "md", "lg"]
-};
-var baseStyle = {
-  container: {
-    flex: "1",
-    paddingRight: 4
+
+var _themeTools = require("@chakra-ui/theme-tools");
+
+var stat = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    label: "the stat label",
+    number: "the numeric value of the stat",
+    icon: "the stat icon, if used",
+    helpText: "the stat description text"
   },
-  label: {
-    fontWeight: "medium"
-  },
-  helpText: {
-    opacity: 0.8,
-    marginBottom: 2
-  },
-  number: {
-    verticalAlign: "baseline",
-    fontWeight: "semibold"
-  },
-  icon: {
-    marginRight: 1,
-    width: "14px",
-    height: "14px",
-    verticalAlign: "middle"
-  }
-};
-var sizes = {
-  md: {
+  baseStyle: {
     label: {
-      fontSize: "sm"
+      fontWeight: "medium"
     },
     helpText: {
-      fontSize: "sm"
+      opacity: 0.8,
+      marginBottom: 2
     },
     number: {
-      fontSize: "2xl"
+      verticalAlign: "baseline",
+      fontWeight: "semibold"
+    },
+    icon: {
+      mr: 1,
+      w: "14px",
+      h: "14px",
+      verticalAlign: "middle"
     }
+  },
+  sizes: {
+    md: {
+      label: {
+        fontSize: "sm"
+      },
+      helpText: {
+        fontSize: "sm"
+      },
+      number: {
+        fontSize: "2xl"
+      }
+    }
+  },
+  defaultProps: {
+    size: "md"
   }
-};
-var defaultProps = {
-  size: "md"
-};
-var stat = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes
-};
+});
 var _default = stat;
 exports["default"] = _default;
 //# sourceMappingURL=stat.js.map

dist/cjs/components/switch.js

@@ -8,89 +8,82 @@ "use strict";
 
-var register = {
-  parts: ["track", "thumb"],
-  sizes: ["sm", "md", "lg"]
-};
-
-var baseStyle = function baseStyle(props) {
-  var c = props.colorScheme;
-  return {
-    track: {
-      borderRadius: "full",
-      padding: "2px",
-      transition: "all 120ms",
-      bg: (0, _themeTools.mode)("gray.300", "whiteAlpha.400")(props),
-      _focus: {
-        boxShadow: "outline"
+var Switch = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    track: "the switch outer track",
+    thumb: "the switch inner circle"
+  },
+  baseStyle: function baseStyle(props) {
+    var c = props.colorScheme;
+    return {
+      track: {
+        borderRadius: "full",
+        p: "2px",
+        transition: "all 120ms",
+        bg: (0, _themeTools.mode)("gray.300", "whiteAlpha.400")(props),
+        _focus: {
+          boxShadow: "outline"
+        },
+        _disabled: {
+          opacity: 0.4,
+          cursor: "not-allowed"
+        },
+        _checked: {
+          bg: (0, _themeTools.mode)(c + ".500", c + ".200")(props)
+        }
       },
-      _disabled: {
-        opacity: 0.4,
-        cursor: "not-allowed"
+      thumb: {
+        bg: "white",
+        transition: "transform 250ms",
+        borderRadius: "full",
+        transform: "translateX(0)"
+      }
+    };
+  },
+  sizes: {
+    sm: {
+      track: {
+        w: "1.375rem",
+        h: "0.75rem"
       },
-      _checked: {
-        bg: (0, _themeTools.mode)(c + ".500", c + ".200")(props)
+      thumb: {
+        w: "0.75rem",
+        h: "0.75rem",
+        _checked: {
+          transform: "translateX(0.625rem)"
+        }
       }
     },
-    thumb: {
-      bg: "white",
-      transition: "transform 250ms",
-      borderRadius: "full",
-      transform: "translateX(0)"
-    }
-  };
-};
-
-var sizes = {
-  sm: {
-    track: {
-      width: "1.375rem",
-      height: "0.75rem"
-    },
-    thumb: {
-      width: "0.75rem",
-      height: "0.75rem",
-      _checked: {
-        transform: "translateX(0.625rem)"
+    md: {
+      track: {
+        w: "1.875rem",
+        h: "1rem"
+      },
+      thumb: {
+        w: "1rem",
+        h: "1rem",
+        _checked: {
+          transform: "translateX(0.875rem)"
+        }
       }
-    }
-  },
-  md: {
-    track: {
-      width: "1.875rem",
-      height: "1rem"
     },
-    thumb: {
-      width: "1rem",
-      height: "1rem",
-      _checked: {
-        transform: "translateX(0.875rem)"
+    lg: {
+      track: {
+        w: "2.875rem",
+        h: "1.5rem"
+      },
+      thumb: {
+        w: "1.5rem",
+        h: "1.5rem",
+        _checked: {
+          transform: "translateX(1.375rem)"
+        }
       }
     }
   },
-  lg: {
-    track: {
-      width: "2.875rem",
-      height: "1.5rem"
-    },
-    thumb: {
-      width: "1.5rem",
-      height: "1.5rem",
-      _checked: {
-        transform: "translateX(1.375rem)"
-      }
-    }
+  defaultProps: {
+    size: "md",
+    colorScheme: "blue"
   }
-};
-var defaultProps = {
-  size: "md",
-  colorScheme: "blue"
-}; // can't use the `switch` here since it's a reserved keyword
-
-var _switch = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes
-};
-var _default = _switch;
+});
+var _default = Switch;
 exports["default"] = _default;
 //# sourceMappingURL=switch.js.map

dist/cjs/components/tabs.js

@@ -8,177 +8,170 @@ "use strict";
 
-var register = {
-  parts: ["tablist", "tab", "tabpanel", "indicator"],
-  sizes: ["sm", "md", "lg"],
-  variants: ["line", "enclosed", "soft-rounded", "enclosed-colored", "solid-rounded", "unstyled"]
-};
-var alignments = {
-  end: "flex-end",
-  center: "center",
-  start: "flex-start"
-};
-
-var baseStyle = function baseStyle(props) {
-  var _props$align = props.align,
-      align = _props$align === void 0 ? "start" : _props$align,
-      isFitted = props.isFitted;
-  return {
-    tab: {
-      flex: isFitted ? 1 : undefined,
-      transition: "all 0.2s",
-      _focus: {
-        zIndex: 1,
-        boxShadow: "outline"
-      }
-    },
-    tablist: {
-      justifyContent: alignments[align]
-    },
-    tabpanel: {
-      padding: 4
-    }
-  };
-};
-
-var sizes = {
-  sm: {
-    tab: {
-      paddingY: "0.25rem",
-      paddingX: "1rem",
-      fontSize: "0.85rem"
-    }
+var tabs = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    tablist: "the tab list or button group",
+    tab: "the tab button",
+    tabpanel: "the tab content",
+    indicator: "the active tab indicator"
   },
-  md: {
-    tab: {
-      fontSize: "1rem",
-      paddingY: "0.5rem",
-      paddingX: "1rem"
-    }
-  },
-  lg: {
-    tab: {
-      fontSize: "1.15rem",
-      paddingY: "0.75rem",
-      paddingX: "1rem"
-    }
-  }
-};
-var variants = {
-  line: function line(props) {
-    var c = props.colorScheme;
+  baseStyle: function baseStyle(props) {
+    var _props$align = props.align,
+        align = _props$align === void 0 ? "start" : _props$align,
+        isFitted = props.isFitted;
     return {
+      tab: {
+        flex: isFitted ? 1 : undefined,
+        transition: "all 0.2s",
+        _focus: {
+          zIndex: 1,
+          boxShadow: "outline"
+        }
+      },
       tablist: {
-        borderBottom: "2px solid",
-        borderColor: "inherit"
+        justifyContent: alignments[align]
       },
-      tab: {
-        borderBottom: "2px solid",
-        borderColor: "transparent",
-        marginBottom: "-2px",
-        _selected: {
-          color: (0, _themeTools.mode)(c + ".600", c + ".300")(props),
-          borderColor: "currentColor"
-        },
-        _active: {
-          bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.300")(props)
-        },
-        _disabled: {
-          opacity: 0.4,
-          cursor: "not-allowed"
-        }
+      tabpanel: {
+        p: 4
       }
     };
   },
-  enclosed: function enclosed(props) {
-    var c = props.colorScheme;
-    return {
+  sizes: {
+    sm: {
       tab: {
-        borderTopRadius: "md",
-        border: "1px solid",
-        borderColor: "transparent",
-        marginBottom: "-1px",
-        _selected: {
-          color: (0, _themeTools.mode)(c + ".600", c + ".300")(props),
-          borderColor: "inherit",
-          borderBottomColor: (0, _themeTools.mode)("white", "gray.800")(props)
-        }
-      },
-      tablist: {
-        marginBottom: "-1px",
-        borderBottom: "1px solid",
-        borderColor: "inherit"
+        py: "0.25rem",
+        px: "1rem",
+        fontSize: "0.85rem"
       }
-    };
+    },
+    md: {
+      tab: {
+        fontSize: "1rem",
+        py: "0.5rem",
+        px: "1rem"
+      }
+    },
+    lg: {
+      tab: {
+        fontSize: "1.15rem",
+        py: "0.75rem",
+        px: "1rem"
+      }
+    }
   },
-  "enclosed-colored": function enclosedColored(props) {
-    var c = props.colorScheme;
-    return {
-      tab: {
-        border: "1px solid",
-        borderColor: "inherit",
-        bg: (0, _themeTools.mode)("gray.50", "whiteAlpha.50")(props),
-        marginBottom: "-1px",
-        _notLast: {
-          mr: "-1px"
+  variants: {
+    line: function line(props) {
+      var c = props.colorScheme;
+      return {
+        tablist: {
+          borderBottom: "2px solid",
+          borderColor: "inherit"
         },
-        _selected: {
-          bg: (0, _themeTools.mode)("#fff", "gray.800")(props),
-          color: (0, _themeTools.mode)(c + ".600", c + ".300")(props),
+        tab: {
+          borderBottom: "2px solid",
+          borderColor: "transparent",
+          mb: "-2px",
+          _selected: {
+            color: (0, _themeTools.mode)(c + ".600", c + ".300")(props),
+            borderColor: "currentColor"
+          },
+          _active: {
+            bg: (0, _themeTools.mode)("gray.200", "whiteAlpha.300")(props)
+          },
+          _disabled: {
+            opacity: 0.4,
+            cursor: "not-allowed"
+          }
+        }
+      };
+    },
+    enclosed: function enclosed(props) {
+      var c = props.colorScheme;
+      return {
+        tab: {
+          borderTopRadius: "md",
+          border: "1px solid",
+          borderColor: "transparent",
+          mb: "-1px",
+          _selected: {
+            color: (0, _themeTools.mode)(c + ".600", c + ".300")(props),
+            borderColor: "inherit",
+            borderBottomColor: (0, _themeTools.mode)("white", "gray.800")(props)
+          }
+        },
+        tablist: {
+          mb: "-1px",
+          borderBottom: "1px solid",
+          borderColor: "inherit"
+        }
+      };
+    },
+    "enclosed-colored": function enclosedColored(props) {
+      var c = props.colorScheme;
+      return {
+        tab: {
+          border: "1px solid",
           borderColor: "inherit",
-          borderTopColor: "currentColor",
-          borderBottomColor: "transparent"
+          bg: (0, _themeTools.mode)("gray.50", "whiteAlpha.50")(props),
+          mb: "-1px",
+          _notLast: {
+            mr: "-1px"
+          },
+          _selected: {
+            bg: (0, _themeTools.mode)("#fff", "gray.800")(props),
+            color: (0, _themeTools.mode)(c + ".600", c + ".300")(props),
+            borderColor: "inherit",
+            borderTopColor: "currentColor",
+            borderBottomColor: "transparent"
+          }
+        },
+        tablist: {
+          mb: "-1px",
+          borderBottom: "1px solid",
+          borderColor: "inherit"
         }
-      },
-      tablist: {
-        marginBottom: "-1px",
-        borderBottom: "1px solid",
-        borderColor: "inherit"
-      }
-    };
-  },
-  "soft-rounded": function softRounded(props) {
-    var c = props.colorScheme,
-        theme = props.theme;
-    return {
-      tab: {
-        borderRadius: "full",
-        fontWeight: "semibold",
-        color: "gray.600",
-        _selected: {
-          color: (0, _themeTools.getColor)(theme, c + ".700"),
-          bg: (0, _themeTools.getColor)(theme, c + ".100")
+      };
+    },
+    "soft-rounded": function softRounded(props) {
+      var c = props.colorScheme,
+          theme = props.theme;
+      return {
+        tab: {
+          borderRadius: "full",
+          fontWeight: "semibold",
+          color: "gray.600",
+          _selected: {
+            color: (0, _themeTools.getColor)(theme, c + ".700"),
+            bg: (0, _themeTools.getColor)(theme, c + ".100")
+          }
         }
-      },
-      tablist: {}
-    };
-  },
-  "solid-rounded": function solidRounded(props) {
-    var c = props.colorScheme;
-    return {
-      tab: {
-        borderRadius: "full",
-        fontWeight: "semibold",
-        color: (0, _themeTools.mode)("gray.600", "inherit")(props),
-        _selected: {
-          color: (0, _themeTools.mode)("#fff", "gray.800")(props),
-          bg: (0, _themeTools.mode)(c + ".600", c + ".300")(props)
+      };
+    },
+    "solid-rounded": function solidRounded(props) {
+      var c = props.colorScheme;
+      return {
+        tab: {
+          borderRadius: "full",
+          fontWeight: "semibold",
+          color: (0, _themeTools.mode)("gray.600", "inherit")(props),
+          _selected: {
+            color: (0, _themeTools.mode)("#fff", "gray.800")(props),
+            bg: (0, _themeTools.mode)(c + ".600", c + ".300")(props)
+          }
         }
-      }
-    };
+      };
+    },
+    unstyled: {}
   },
-  unstyled: {}
+  defaultProps: {
+    size: "md",
+    variant: "line",
+    colorScheme: "blue"
+  }
+});
+var alignments = {
+  end: "flex-end",
+  center: "center",
+  start: "flex-start"
 };
-var defaultProps = {
-  size: "md",
-  variant: "line",
-  colorScheme: "blue"
-};
-var tabs = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes,
-  variants: variants
-};
 var _default = tabs;
 exports["default"] = _default;
 //# sourceMappingURL=tabs.js.map

dist/cjs/components/tag.js

@@ -6,2 +6,4 @@ "use strict";
 
+var _themeTools = require("@chakra-ui/theme-tools");
+
 var _badge = _interopRequireDefault(require("./badge"));
@@ -11,83 +13,103 @@
 
-var register = {
-  parts: ["container", "label", "closeButton"],
-  sizes: ["sm", "md", "lg"],
-  variants: _badge["default"].register.variants
-};
-var baseStyle = {
-  container: {
-    outline: 0,
-    _focus: {
-      boxShadow: "outline"
+var tag = (0, _themeTools.multiStyleConfig)({
+  parts: {
+    container: "the tag container",
+    label: "the tag inner text",
+    closeButton: "the close button"
+  },
+  baseStyle: {
+    container: {
+      fontWeight: "medium",
+      lineHeight: 1.2,
+      outline: 0,
+      _focus: {
+        boxShadow: "outline"
+      }
+    },
+    label: {
+      lineHeight: 1.2
+    },
+    closeButton: {
+      fontSize: "18px",
+      w: "1.25rem",
+      h: "1.25rem",
+      borderRadius: "sm",
+      ml: "0.375rem",
+      mr: "-1",
+      opacity: 0.5,
+      _disabled: {
+        opacity: 0.4
+      },
+      _focus: {
+        boxShadow: "outline",
+        bg: "rgba(0, 0, 0, 0.14)"
+      },
+      _hover: {
+        opacity: 0.8
+      },
+      _active: {
+        opacity: 1
+      }
     }
   },
-  label: {
-    lineHeight: 1.2
-  },
-  closeButton: {
-    fontSize: "1em",
-    width: "1.25rem",
-    height: "1.25rem",
-    borderRadius: "sm",
-    marginLeft: "0.375rem",
-    opacity: 0.5,
-    _disabled: {
-      opacity: 0.4
+  sizes: {
+    sm: {
+      container: {
+        minH: "1.25rem",
+        minW: "1.25rem",
+        fontSize: "xs",
+        px: 1,
+        borderRadius: "sm"
+      }
     },
-    _focus: {
-      boxShadow: "outline",
-      bg: "rgba(0, 0, 0, 0.14)"
+    md: {
+      container: {
+        minH: "1.5rem",
+        minW: "1.5rem",
+        fontSize: "sm",
+        borderRadius: "md",
+        px: 2
+      }
     },
-    _hover: {
-      opacity: 0.8
-    },
-    _active: {
-      opacity: 1
+    lg: {
+      container: {
+        minH: 8,
+        minW: 8,
+        fontSize: "md",
+        borderRadius: "md",
+        px: 3
+      }
     }
-  }
-};
-var sizes = {
-  sm: {
-    container: {
-      minHeight: "1.25rem",
-      minWidth: "1.25rem",
-      fontSize: "xs",
-      paddingX: 1,
-      borderRadius: "sm"
-    }
   },
-  md: {
-    container: {
-      minHeight: "1.5rem",
-      minWidth: "1.5rem",
-      fontSize: "sm",
-      borderRadius: "md",
-      paddingX: 2
+  variants: {
+    subtle: function subtle(props) {
+      var _badge$variants;
+
+      return {
+        container: (_badge$variants = _badge["default"].variants) == null ? void 0 : _badge$variants.subtle(props)
+      };
+    },
+    solid: function solid(props) {
+      var _badge$variants2;
+
+      return {
+        container: (_badge$variants2 = _badge["default"].variants) == null ? void 0 : _badge$variants2.solid(props)
+      };
+    },
+    outline: function outline(props) {
+      var _badge$variants3;
+
+      return {
+        container: (_badge$variants3 = _badge["default"].variants) == null ? void 0 : _badge$variants3.outline(props)
+      };
     }
   },
-  lg: {
-    container: {
-      minHeight: 8,
-      minWidth: 8,
-      fontSize: "md",
-      borderRadius: "md",
-      paddingX: 3
-    }
+  defaultProps: {
+    size: "lg",
+    variant: "subtle",
+    colorScheme: "gray"
   }
-};
-var variants = _badge["default"].variants;
-var defaultProps = {
-  size: "lg",
-  variant: "subtle",
-  colorScheme: "gray"
-};
-var tag = {
-  register: register,
-  defaultProps: defaultProps,
-  baseStyle: baseStyle,
-  sizes: sizes,
-  variants: variants
-};
+});
 var _default = tag;
 exports["default"] = _default;
 //# sourceMappingURL=tag.js.map

dist/cjs/components/textarea.js

@@ -6,4 +6,8 @@ "use strict";
 
+var _themeTools = require("@chakra-ui/theme-tools");
+
 var _input = _interopRequireDefault(require("./input"));
 
+var _input$baseStyle, _input$sizes, _input$sizes2, _input$sizes3, _input$variants4;
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -13,22 +17,38 @@
 
-var register = {
-  parts: ["field"],
-  variants: _input["default"].register.variants,
-  sizes: _input["default"].register.sizes
-};
-var baseStyle = {
-  field: _extends({}, _input["default"].baseStyle.field, {
+var textarea = (0, _themeTools.styleConfig)({
+  baseStyle: _extends({}, (_input$baseStyle = _input["default"].baseStyle) == null ? void 0 : _input$baseStyle.field, {
     paddingY: "8px",
     minHeight: "80px",
     lineHeight: "short"
-  })
-};
+  }),
+  sizes: {
+    sm: (_input$sizes = _input["default"].sizes) == null ? void 0 : _input$sizes.sm.field,
+    md: (_input$sizes2 = _input["default"].sizes) == null ? void 0 : _input$sizes2.md.field,
+    lg: (_input$sizes3 = _input["default"].sizes) == null ? void 0 : _input$sizes3.lg.field
+  },
+  variants: {
+    outline: function outline(props) {
+      var _input$variants$outli, _input$variants, _input$variants$outli2;
 
-var textarea = _extends({}, _input["default"], {
-  register: register,
-  baseStyle: baseStyle
+      return (_input$variants$outli = (_input$variants = _input["default"].variants) == null ? void 0 : (_input$variants$outli2 = _input$variants.outline(props)) == null ? void 0 : _input$variants$outli2.field) != null ? _input$variants$outli : {};
+    },
+    flushed: function flushed(props) {
+      var _input$variants$flush, _input$variants2, _input$variants2$flus;
+
+      return (_input$variants$flush = (_input$variants2 = _input["default"].variants) == null ? void 0 : (_input$variants2$flus = _input$variants2.flushed(props)) == null ? void 0 : _input$variants2$flus.field) != null ? _input$variants$flush : {};
+    },
+    filled: function filled(props) {
+      var _input$variants$fille, _input$variants3;
+
+      return (_input$variants$fille = (_input$variants3 = _input["default"].variants) == null ? void 0 : _input$variants3.filled(props).field) != null ? _input$variants$fille : {};
+    },
+    unstyled: (_input$variants4 = _input["default"].variants) == null ? void 0 : _input$variants4.unstyled.field
+  },
+  defaultProps: {
+    size: "md",
+    variant: "outline"
+  }
 });
-
 var _default = textarea;
 exports["default"] = _default;
 //# sourceMappingURL=textarea.js.map

dist/cjs/components/tooltip.js

@@ -8,11 +8,7 @@ "use strict";
 
-var register = {
-  parts: ["arrow", "container"]
-};
-
-var baseStyle = function baseStyle(props) {
-  return {
-    container: {
-      paddingX: "8px",
-      paddingY: "2px",
+var tooltip = (0, _themeTools.styleConfig)({
+  baseStyle: function baseStyle(props) {
+    return {
+      px: "8px",
+      py: "2px",
       bg: (0, _themeTools.mode)("gray.700", "gray.300")(props),
@@ -25,44 +21,8 @@ color: (0, _themeTools.mode)("whiteAlpha.900", "gray.900")(props),
       boxShadow: "md",
-      maxWidth: "320px"
-    }
-  };
-};
-
-var transition = {
-  container: {
-    timeout: 120,
-    transition: {
-      easing: "ease-in-out",
-      duration: "120ms",
-      property: "common"
-    },
-    enter: {
-      from: {
-        opacity: 0.01,
-        transform: "scale(0.9)"
-      },
-      to: {
-        opacity: 1,
-        transform: "scale(1)"
-      }
-    },
-    exit: {
-      from: {
-        opacity: 1,
-        transform: "scale(1)"
-      },
-      to: {
-        opacity: 0.01,
-        transform: "scale(0.9)"
-      }
-    }
+      maxW: "320px"
+    };
   }
-};
-var tooltip = {
-  register: register,
-  baseStyle: baseStyle,
-  transition: transition
-};
+});
 var _default = tooltip;
 exports["default"] = _default;
 //# sourceMappingURL=tooltip.js.map

dist/cjs/foundations/breakpoints.js

@@ -5,10 +5,18 @@ "use strict";
 exports["default"] = void 0;
-var breakpoints = {
-  sm: "30em",
-  md: "48em",
-  lg: "62em",
-  xl: "80em"
-};
+
+/**
+ * Breakpoints for responsive design
+ */
+var breakpoints = ["30em", "48em", "62em", "80em"];
+/**
+ * This is needed for object responsive breakpoints to work.
+ * At the moment, we require the keys to be `sm`, `md`, `lg` and `xl`
+ */
+
+breakpoints.sm = breakpoints[0];
+breakpoints.md = breakpoints[1];
+breakpoints.lg = breakpoints[2];
+breakpoints.xl = breakpoints[3];
 var _default = breakpoints;
 exports["default"] = _default;
 //# sourceMappingURL=breakpoints.js.map

dist/cjs/foundations/shadows.js

@@ -6,5 +6,6 @@ "use strict";
 var shadows = {
-  sm: "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
+  xs: "0 0 0 1px rgba(0, 0, 0, 0.05)",
+  sm: "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
+  base: "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
   md: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
-  "dark-lg": "rgba(0, 0, 0, 0.1) 0px 0px 0px 1px, rgba(0, 0, 0, 0.2) 0px 5px 10px, rgba(0, 0, 0, 0.4) 0px 15px 40px",
   lg: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
@@ -15,3 +16,4 @@ xl: "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
   inner: "inset 0 2px 4px 0 rgba(0,0,0,0.06)",
-  none: "none"
+  none: "none",
+  "dark-lg": "rgba(0, 0, 0, 0.1) 0px 0px 0px 1px, rgba(0, 0, 0, 0.2) 0px 5px 10px, rgba(0, 0, 0, 0.4) 0px 15px 40px"
 };
@@ -18,0 +20,0 @@ var _default = shadows;

dist/cjs/foundations/sizes.js

@@ -43,3 +43,4 @@ "use strict";
   "5xl": "64rem",
-  "6xl": "72rem"
+  "6xl": "72rem",
+  "7xl": "80rem"
 };
@@ -46,0 +47,0 @@ var container = {

dist/cjs/foundations/typography.js

@@ -16,8 +16,16 @@ "use strict";
     normal: "normal",
-    none: "1",
-    shorter: "1.25",
-    "short": "1.375",
-    base: "1.5",
-    tall: "1.625",
-    taller: "2"
+    none: 1,
+    shorter: 1.25,
+    "short": 1.375,
+    base: 1.5,
+    tall: 1.625,
+    taller: "2",
+    "3": ".75rem",
+    "4": "1rem",
+    "5": "1.25rem",
+    "6": "1.5rem",
+    "7": "1.75rem",
+    "8": "2rem",
+    "9": "2.25rem",
+    "10": "2.5rem"
   },
@@ -24,0 +32,0 @@ fontWeights: {

dist/esm/components/accordion.js

@@ -1,38 +0,39 @@
-var register = {
-  parts: ["container", "item", "button", "panel"]
-};
-var baseStyle = {
-  item: {
-    borderTopWidth: "1px",
-    borderColor: "inherit",
-    _last: {
-      borderBottomWidth: "1px"
-    }
+import { multiStyleConfig } from "@chakra-ui/theme-tools";
+var accordion = multiStyleConfig({
+  parts: {
+    container: "the container for an accordion item",
+    button: "the trigger for an accordion item",
+    panel: "the panel for an accordion item"
   },
-  button: {
-    fontSize: "1rem",
-    _focus: {
-      boxShadow: "outline"
+  baseStyle: {
+    container: {
+      borderTopWidth: "1px",
+      borderColor: "inherit",
+      _last: {
+        borderBottomWidth: "1px"
+      }
     },
-    _hover: {
-      bg: "blackAlpha.50"
+    button: {
+      fontSize: "1rem",
+      _focus: {
+        boxShadow: "outline"
+      },
+      _hover: {
+        bg: "blackAlpha.50"
+      },
+      _disabled: {
+        opacity: 0.4,
+        cursor: "not-allowed"
+      },
+      px: 4,
+      py: 2
     },
-    _disabled: {
-      opacity: 0.4,
-      cursor: "not-allowed"
-    },
-    paddingX: 4,
-    paddingY: 2
-  },
-  panel: {
-    paddingTop: 2,
-    paddingX: 4,
-    paddingBottom: 5
+    panel: {
+      pt: 2,
+      px: 4,
+      pb: 5
+    }
   }
-};
-var accordion = {
-  register,
-  baseStyle
-};
+});
 export default accordion;
 //# sourceMappingURL=accordion.js.map

dist/esm/components/alert.js

@@ -1,100 +0,97 @@
-import { getColor, ink, mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["container", "title", "icon"],
-  variants: ["subtle", "left-accent", "top-accent", "solid"]
-};
-var baseStyle = {
-  container: {
-    paddingX: 4,
-    paddingY: 3
+import { getColor, mode, multiStyleConfig, transparentize } from "@chakra-ui/theme-tools";
+var alert = multiStyleConfig({
+  parts: {
+    container: "the alert container",
+    title: "the alert title",
+    icon: "the alert icon"
   },
-  title: {
-    fontWeight: "bold",
-    lineHeight: "normal"
+  baseStyle: {
+    container: {
+      px: 4,
+      py: 3
+    },
+    title: {
+      fontWeight: "bold",
+      lineHeight: "normal"
+    },
+    icon: {
+      mr: 3,
+      w: 5,
+      h: 5
+    }
   },
-  icon: {
-    marginRight: 3,
-    width: 5,
-    height: 5
+  variants: {
+    subtle: function subtle(props) {
+      var {
+        colorScheme: c
+      } = props;
+      return {
+        container: {
+          bg: getBg(props)
+        },
+        icon: {
+          color: mode(c + ".500", c + ".200")(props)
+        }
+      };
+    },
+    "left-accent": function leftAccent(props) {
+      var {
+        colorScheme: c
+      } = props;
+      return {
+        container: {
+          pl: 3,
+          borderLeft: "4px solid",
+          borderColor: mode(c + ".500", c + ".200")(props),
+          bg: getBg(props)
+        },
+        icon: {
+          color: mode(c + ".500", c + ".200")(props)
+        }
+      };
+    },
+    "top-accent": function topAccent(props) {
+      var {
+        colorScheme: c
+      } = props;
+      return {
+        container: {
+          pt: 2,
+          borderTop: "4px solid",
+          borderColor: mode(c + ".500", c + ".200")(props),
+          bg: getBg(props)
+        },
+        icon: {
+          color: mode(c + ".500", c + ".200")(props)
+        }
+      };
+    },
+    solid: function solid(props) {
+      var {
+        colorScheme: c
+      } = props;
+      return {
+        container: {
+          bg: mode(c + ".500", c + ".200")(props),
+          color: mode("white", "gray.900")(props)
+        }
+      };
+    }
+  },
+  defaultProps: {
+    variant: "subtle"
   }
-};
+});
 
 function getBg(props) {
   var {
-    theme: t,
+    theme,
     colorScheme: c
   } = props;
-  var lightBg = getColor(t, c + ".100", c);
-  var darkBg = ink(c + ".200", "lowest")(t);
+  var lightBg = getColor(theme, c + ".100", c);
+  var darkBg = transparentize(c + ".200", 0.16)(theme);
   return mode(lightBg, darkBg)(props);
 }
 
-var variants = {
-  subtle: function subtle(props) {
-    var {
-      colorScheme: c
-    } = props;
-    return {
-      container: {
-        bg: getBg(props)
-      },
-      icon: {
-        color: mode(c + ".500", c + ".200")(props)
-      }
-    };
-  },
-  "left-accent": function leftAccent(props) {
-    var {
-      colorScheme: c
-    } = props;
-    return {
-      container: {
-        paddingLeft: 3,
-        borderLeft: "4px solid",
-        borderColor: mode(c + ".500", c + ".200")(props),
-        bg: getBg(props)
-      },
-      icon: {
-        color: mode(c + ".500", c + ".200")(props)
-      }
-    };
-  },
-  "top-accent": function topAccent(props) {
-    var {
-      colorScheme: c
-    } = props;
-    return {
-      container: {
-        paddingTop: 2,
-        borderTop: "4px solid",
-        borderColor: mode(c + ".500", c + ".200")(props),
-        bg: getBg(props)
-      },
-      icon: {
-        color: mode(c + ".500", c + ".200")(props)
-      }
-    };
-  },
-  solid: function solid(props) {
-    var {
-      colorScheme: c
-    } = props;
-    return {
-      container: {
-        bg: mode(c + ".500", c + ".200")(props),
-        color: mode("white", "gray.900")(props)
-      }
-    };
-  }
-};
-var defaultProps = {
-  variant: "subtle"
-};
-var alert = {
-  register,
-  defaultProps,
-  baseStyle,
-  variants
-};
 export default alert;
 //# sourceMappingURL=alert.js.map

dist/esm/components/avatar.js

@@ -1,61 +0,65 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-import { isDark, mode, randomColor } from "@chakra-ui/theme-tools";
+import { isDark, mode, randomColor, multiStyleConfig } from "@chakra-ui/theme-tools";
 import themeSizes from "../foundations/sizes";
-var register = {
-  parts: ["container", "excessLabel", "badge", "label"],
-  sizes: ["2xs", "xs", "sm", "md", "lg", "xl", "2xl", "full"]
-};
+var avatar = multiStyleConfig({
+  parts: {
+    container: "the avatar wrapper",
+    excessLabel: "for avatar group, the excess avatar label",
+    badge: "the top or bottom left badge",
+    label: "the avatar's name initials text"
+  },
+  baseStyle: function baseStyle(props) {
+    var {
+      name,
+      theme
+    } = props;
+    var bg = name ? randomColor({
+      string: name
+    }) : "gray.400";
+    var color = name ? isDark(bg)(theme) ? "white" : "gray.800" : "white";
+    var borderColor = mode("white", "gray.800")(props);
+    return {
+      badge: {
+        transform: "translate(25%, 25%)",
+        borderRadius: "full",
+        border: "0.2em solid",
+        borderColor: mode("white", "gray.800")(props)
+      },
+      excessLabel: {
+        bg: mode("gray.200", "whiteAlpha.400")(props)
+      },
+      container: {
+        bg,
+        color,
+        borderColor,
+        verticalAlign: "top"
+      }
+    };
+  },
+  sizes: {
+    "2xs": getSize("4"),
+    xs: getSize("6"),
+    sm: getSize("8"),
+    md: getSize("12"),
+    lg: getSize("16"),
+    xl: getSize("24"),
+    "2xl": getSize("32"),
+    full: getSize("100%")
+  },
+  defaultProps: {
+    size: "md"
+  }
+});
 
-var baseStyle = function baseStyle(props) {
-  var {
-    name,
-    theme
-  } = props;
-  var bg = name ? randomColor({
-    string: name
-  }) : "gray.400";
-  var color = name ? isDark(bg)(theme) ? "white" : "gray.800" : "white";
-  var borderColor = mode("white", "gray.800")(props);
+function getSize(size) {
+  var themeSize = themeSizes[size];
   return {
-    badge: {
-      transform: "translate(25%, 25%)",
-      borderRadius: "full",
-      border: "0.2em solid",
-      borderColor: mode("white", "gray.800")(props)
+    container: {
+      width: size,
+      height: size,
+      fontSize: "calc(" + (themeSize != null ? themeSize : size) + " / 2.5)"
     },
     excessLabel: {
-      bg: mode("gray.200", "whiteAlpha.400")(props)
+      width: size,
+      height: size
     },
-    container: {
-      bg,
-      color,
-      borderColor,
-      verticalAlign: "top"
-    }
-  };
-};
-
-var sizes = {
-  "2xs": getSize("4"),
-  xs: getSize("6"),
-  sm: getSize("8"),
-  md: getSize("12"),
-  lg: getSize("16"),
-  xl: getSize("24"),
-  "2xl": getSize("32"),
-  full: getSize("100%")
-};
-
-function getSize(size) {
-  var themeSize = themeSizes[size];
-  var styles = {
-    width: size,
-    height: size
-  };
-  return {
-    container: _extends({
-      fontSize: "calc(" + (themeSize != null ? themeSize : size) + " / 2.5)"
-    }, styles),
-    excessLabel: styles,
     label: {
@@ -68,12 +72,3 @@ fontSize: "calc(" + (themeSize != null ? themeSize : size) + " / 2.5)",
 
-var defaultProps = {
-  size: "md"
-};
-var avatar = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes
-};
 export default avatar;
 //# sourceMappingURL=avatar.js.map

dist/esm/components/badge.js

@@ -1,8 +0,4 @@
-import { getColor, ink, mode, transparentize } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["container"],
-  variants: ["solid", "subtle", "outline"]
-};
-var baseStyle = {
-  container: {
+import { getColor, mode, styleConfig, transparentize } from "@chakra-ui/theme-tools";
+var badge = styleConfig({
+  baseStyle: {
     paddingX: 1,
@@ -13,61 +9,46 @@ textTransform: "uppercase",
     fontWeight: "bold"
-  }
-};
-var variants = {
-  solid(props) {
-    var {
-      colorScheme: c,
-      theme
-    } = props;
-    var dark = transparentize(c + ".500", 0.6)(theme);
-    return {
-      container: {
+  },
+  variants: {
+    solid: function solid(props) {
+      var {
+        colorScheme: c,
+        theme
+      } = props;
+      var dark = transparentize(c + ".500", 0.6)(theme);
+      return {
         bg: mode(c + ".500", dark)(props),
         color: mode("white", "whiteAlpha.800")(props)
-      }
-    };
-  },
-
-  subtle(props) {
-    var {
-      colorScheme: c,
-      theme
-    } = props;
-    var darkBg = ink(c + ".200", "lowest")(theme);
-    return {
-      container: {
+      };
+    },
+    subtle: function subtle(props) {
+      var {
+        colorScheme: c,
+        theme
+      } = props;
+      var darkBg = transparentize(c + ".200", 0.16)(theme);
+      return {
         bg: mode(c + ".100", darkBg)(props),
         color: mode(c + ".800", c + ".200")(props)
-      }
-    };
-  },
-
-  outline(props) {
-    var {
-      colorScheme: c,
-      theme
-    } = props;
-    var darkColor = transparentize(c + ".200", 0.8)(theme);
-    var lightColor = getColor(theme, c + ".500");
-    var color = mode(lightColor, darkColor)(props);
-    return {
-      container: {
+      };
+    },
+    outline: function outline(props) {
+      var {
+        colorScheme: c,
+        theme
+      } = props;
+      var darkColor = transparentize(c + ".200", 0.8)(theme);
+      var lightColor = getColor(theme, c + ".500");
+      var color = mode(lightColor, darkColor)(props);
+      return {
         color,
         boxShadow: "inset 0 0 0px 1px " + color
-      }
-    };
+      };
+    }
+  },
+  defaultProps: {
+    variant: "subtle",
+    colorScheme: "gray"
   }
-
-};
-var defaultProps = {
-  variant: "subtle",
-  colorScheme: "gray"
-};
-var Badge = {
-  register,
-  defaultProps,
-  baseStyle,
-  variants
-};
-export default Badge;
+});
+export default badge;
 //# sourceMappingURL=badge.js.map

dist/esm/components/breadcumb.js

@@ -1,25 +0,24 @@
-var register = {
-  parts: ["container", "link", "separator"]
-};
-var baseStyle = {
-  separator: {},
-  link: {
-    transition: "all 0.15s ease-out",
-    cursor: "pointer",
-    textDecoration: "none",
-    outline: "none",
-    color: "inherit",
-    _hover: {
-      textDecoration: "underline"
-    },
-    _focus: {
-      boxShadow: "outline"
+import { multiStyleConfig } from "@chakra-ui/theme-tools";
+var breadcrumb = multiStyleConfig({
+  parts: {
+    link: "the breadcrumb",
+    separator: "the separator between each link"
+  },
+  baseStyle: {
+    link: {
+      transition: "all 0.15s ease-out",
+      cursor: "pointer",
+      textDecoration: "none",
+      outline: "none",
+      color: "inherit",
+      _hover: {
+        textDecoration: "underline"
+      },
+      _focus: {
+        boxShadow: "outline"
+      }
     }
   }
-};
-var Breadcrumb = {
-  register,
-  baseStyle
-};
-export default Breadcrumb;
+});
+export default breadcrumb;
 //# sourceMappingURL=breadcumb.js.map

dist/esm/components/button.js

 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-import { mode, transparentize } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["container", "icon", "spinner"],
-  sizes: ["sm", "md", "lg", "xs"],
-  variants: ["solid", "outline", "ghost", "unstyled"]
-};
-var baseStyle = {
-  spinner: {
-    fontSize: "1em",
-    lineHeight: "normal"
-  },
-  container: {
-    lineHeight: "1.2",
-    borderRadius: "md",
-    fontWeight: "semibold",
-    _focus: {
-      boxShadow: "outline"
-    },
-    _disabled: {
-      opacity: 0.4,
-      cursor: "not-allowed",
-      boxShadow: "none"
-    }
-  }
-};
-/**
- * Variants Style
- */
+import { mode, styleConfig, transparentize } from "@chakra-ui/theme-tools";
 
-function grayGhost(props) {
-  return {
-    container: {
-      color: mode("inherit", "whiteAlpha.900")(props),
-      _hover: {
-        bg: mode("gray.100", "whiteAlpha.200")(props)
-      },
-      _active: {
-        bg: mode("gray.200", "whiteAlpha.300")(props)
-      }
-    }
-  };
-}
-
-function ghost(props) {
+var ghost = function ghost(props) {
   var {
@@ -51,150 +10,138 @@ colorScheme: c,
   } = props;
-  if (c === "gray") return grayGhost(props);
-  var darkHover = transparentize(c + ".200", 0.12)(theme);
-  var darkActive = transparentize(c + ".200", 0.24)(theme);
-  return {
-    container: {
-      color: mode(c + ".500", c + ".200")(props),
-      bg: "transparent",
+
+  if (c === "gray") {
+    return {
+      color: mode("inherit", "whiteAlpha.900")(props),
       _hover: {
-        bg: mode(c + ".50", darkHover)(props)
+        bg: mode("gray.100", "whiteAlpha.200")(props)
       },
       _active: {
-        bg: mode(c + ".100", darkActive)(props)
-      }
-    }
-  };
-}
-
-function outline(props) {
-  var {
-    colorScheme: c
-  } = props;
-  var borderColor = mode("gray.200", "whiteAlpha.300")(props);
-  return {
-    container: _extends({
-      border: "1px solid",
-      borderColor: c === "gray" ? borderColor : "currentColor"
-    }, ghost(props).container)
-  };
-}
-
-function graySolid(props) {
-  return {
-    container: {
-      bg: mode("gray.100", "whiteAlpha.200")(props),
-      _hover: {
         bg: mode("gray.200", "whiteAlpha.300")(props)
-      },
-      _active: {
-        bg: mode("gray.300", "whiteAlpha.400")(props)
       }
-    }
-  };
-}
+    };
+  }
 
-function solid(props) {
-  var {
-    colorScheme: c
-  } = props;
-  if (c === "gray") return graySolid(props);
+  var darkHoverBg = transparentize(c + ".200", 0.12)(theme);
+  var darkActiveBg = transparentize(c + ".200", 0.24)(theme);
   return {
-    container: {
-      bg: mode(c + ".500", c + ".200")(props),
-      color: mode("white", "gray.800")(props),
-      _hover: {
-        bg: mode(c + ".600", c + ".300")(props)
-      },
-      _active: {
-        bg: mode(c + ".700", c + ".400")(props)
-      }
+    color: mode(c + ".500", c + ".200")(props),
+    bg: "transparent",
+    _hover: {
+      bg: mode(c + ".50", darkHoverBg)(props)
+    },
+    _active: {
+      bg: mode(c + ".100", darkActiveBg)(props)
     }
   };
-}
+};
 
-function link(props) {
-  var {
-    colorScheme: c
-  } = props;
-  return {
-    container: {
-      padding: 0,
-      height: "auto",
-      lineHeight: "normal",
-      color: mode(c + ".500", c + ".200")(props),
-      _hover: {
-        textDecoration: "underline"
-      },
-      _active: {
-        color: mode(c + ".700", c + ".500")(props)
-      }
+var button = styleConfig({
+  baseStyle: {
+    lineHeight: "1.2",
+    borderRadius: "md",
+    fontWeight: "semibold",
+    _focus: {
+      boxShadow: "outline"
+    },
+    _disabled: {
+      opacity: 0.4,
+      cursor: "not-allowed",
+      boxShadow: "none"
     }
-  };
-}
-
-var unstyled = {
-  container: {
-    bg: "none",
-    border: 0,
-    color: "inherit",
-    display: "inline",
-    font: "inherit",
-    lineHeight: "inherit",
-    margin: 0,
-    padding: 0
-  }
-};
-var sizes = {
-  lg: {
-    container: {
-      height: 12,
-      minWidth: 12,
-      fontSize: "lg",
-      paddingX: 6
+  },
+  variants: {
+    ghost,
+    outline: function outline(props) {
+      var {
+        colorScheme: c
+      } = props;
+      var borderColor = mode("gray.200", "whiteAlpha.300")(props);
+      return _extends({
+        border: "1px solid",
+        borderColor: c === "gray" ? borderColor : "currentColor"
+      }, ghost(props));
+    },
+    solid: function solid(props) {
+      var {
+        colorScheme: c
+      } = props;
+      if (c === "gray") return {
+        bg: mode("gray.100", "whiteAlpha.200")(props),
+        _hover: {
+          bg: mode("gray.200", "whiteAlpha.300")(props)
+        },
+        _active: {
+          bg: mode("gray.300", "whiteAlpha.400")(props)
+        }
+      };
+      return {
+        bg: mode(c + ".500", c + ".200")(props),
+        color: mode("white", "gray.800")(props),
+        _hover: {
+          bg: mode(c + ".600", c + ".300")(props)
+        },
+        _active: {
+          bg: mode(c + ".700", c + ".400")(props)
+        }
+      };
+    },
+    link: function link(props) {
+      var {
+        colorScheme: c
+      } = props;
+      return {
+        padding: 0,
+        height: "auto",
+        lineHeight: "normal",
+        color: mode(c + ".500", c + ".200")(props),
+        _hover: {
+          textDecoration: "underline"
+        },
+        _active: {
+          color: mode(c + ".700", c + ".500")(props)
+        }
+      };
+    },
+    unstyled: {
+      bg: "none",
+      color: "inherit",
+      display: "inline",
+      lineHeight: "inherit",
+      m: 0,
+      p: 0
     }
   },
-  md: {
-    container: {
-      height: 10,
-      minWidth: 10,
+  sizes: {
+    lg: {
+      h: 12,
+      minW: 12,
+      fontSize: "lg",
+      px: 6
+    },
+    md: {
+      h: 10,
+      minW: 10,
       fontSize: "md",
-      paddingX: 4
-    }
-  },
-  sm: {
-    container: {
-      height: 8,
-      minWidth: 8,
+      px: 4
+    },
+    sm: {
+      h: 8,
+      minW: 8,
       fontSize: "sm",
-      paddingX: 3
+      px: 3
+    },
+    xs: {
+      h: 6,
+      minW: 6,
+      fontSize: "xs",
+      px: 2
     }
   },
-  xs: {
-    container: {
-      height: 6,
-      minWidth: 6,
-      fontSize: "xs",
-      paddingX: 2
-    }
+  defaultProps: {
+    variant: "solid",
+    size: "md",
+    colorScheme: "gray"
   }
-};
-var defaultProps = {
-  variant: "solid",
-  size: "md",
-  colorScheme: "gray"
-};
-var Button = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes,
-  variants: {
-    unstyled,
-    solid,
-    ghost,
-    link,
-    outline
-  }
-};
-export default Button;
+});
+export default button;
 //# sourceMappingURL=button.js.map

dist/esm/components/checkbox.js

@@ -1,101 +0,97 @@
-import { mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["control", "label", "description", "icon"],
-  sizes: ["sm", "md", "lg"]
-};
-
-var baseStyle = props => {
-  var {
-    colorScheme: c
-  } = props;
-  return {
-    control: {
-      width: "100%",
-      transition: "box-shadow 250ms, background-color 250ms",
-      border: "2px solid",
-      borderRadius: "sm",
-      borderColor: "inherit",
-      color: "white",
-      _checked: {
-        bg: mode(c + ".500", c + ".200")(props),
-        borderColor: mode(c + ".500", c + ".200")(props),
-        color: mode("white", "gray.900")(props),
-        _hover: {
-          bg: mode(c + ".600", c + ".300")(props),
-          borderColor: mode(c + ".600", c + ".300")(props)
+import { mode, multiStyleConfig } from "@chakra-ui/theme-tools";
+var checkbox = multiStyleConfig({
+  parts: {
+    control: "the main checkbox container",
+    label: "the checkbox label",
+    description: "the checkbox assistive text",
+    icon: "the checkmark icon"
+  },
+  baseStyle: function baseStyle(props) {
+    var {
+      colorScheme: c
+    } = props;
+    return {
+      control: {
+        w: "100%",
+        transition: "box-shadow 250ms",
+        border: "2px solid",
+        borderRadius: "sm",
+        borderColor: "inherit",
+        color: "white",
+        _checked: {
+          bg: mode(c + ".500", c + ".200")(props),
+          borderColor: mode(c + ".500", c + ".200")(props),
+          color: mode("white", "gray.900")(props),
+          _hover: {
+            bg: mode(c + ".600", c + ".300")(props),
+            borderColor: mode(c + ".600", c + ".300")(props)
+          },
+          _disabled: {
+            borderColor: mode("gray.200", "transparent")(props),
+            bg: mode("gray.200", "whiteAlpha.300")(props),
+            color: mode("gray.500", "whiteAlpha.500")(props)
+          }
         },
+        _indeterminate: {
+          bg: mode(c + ".500", c + ".200")(props),
+          borderColor: mode(c + ".500", c + ".200")(props),
+          color: mode("white", "gray.900")(props)
+        },
         _disabled: {
-          borderColor: mode("gray.200", "transparent")(props),
-          bg: mode("gray.200", "whiteAlpha.300")(props),
-          color: mode("gray.500", "whiteAlpha.500")(props)
+          bg: mode("gray.100", "whiteAlpha.100")(props),
+          borderColor: mode("gray.100", "transparent")(props)
+        },
+        _focus: {
+          boxShadow: "outline"
+        },
+        _invalid: {
+          borderColor: mode("red.500", "red.300")(props)
         }
       },
-      _indeterminate: {
-        bg: mode(c + ".500", c + ".200")(props),
-        borderColor: mode(c + ".500", c + ".200")(props),
-        color: mode("white", "gray.900")(props)
+      label: {
+        userSelect: "none",
+        _disabled: {
+          opacity: 0.4
+        }
       },
-      _disabled: {
-        bg: mode("gray.100", "whiteAlpha.100")(props),
-        borderColor: mode("gray.100", "transparent")(props)
+      icon: {
+        fontSize: "0.625rem"
+      }
+    };
+  },
+  sizes: {
+    sm: {
+      control: {
+        h: 3,
+        w: 3
       },
-      _focus: {
-        boxShadow: "outline"
+      label: {
+        fontSize: "sm"
+      }
+    },
+    md: {
+      control: {
+        w: 4,
+        h: 4
       },
-      _invalid: {
-        borderColor: mode("red.500", "red.300")(props)
+      label: {
+        fontSize: "md"
       }
     },
-    label: {
-      userSelect: "none",
-      _disabled: {
-        opacity: 0.4
+    lg: {
+      control: {
+        w: 5,
+        h: 5
+      },
+      label: {
+        fontSize: "lg"
       }
-    },
-    icon: {
-      fontSize: "0.625rem"
     }
-  };
-};
-
-var sizes = {
-  sm: {
-    control: {
-      height: 3,
-      width: 3
-    },
-    label: {
-      fontSize: "sm"
-    }
   },
-  md: {
-    control: {
-      width: 4,
-      height: 4
-    },
-    label: {
-      fontSize: "md"
-    }
-  },
-  lg: {
-    control: {
-      width: 5,
-      height: 5
-    },
-    label: {
-      fontSize: "lg"
-    }
+  defaultProps: {
+    size: "md",
+    colorScheme: "blue"
   }
-};
-var defaultProps = {
-  size: "md",
-  colorScheme: "blue"
-};
-var checkbox = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes
-};
+});
 export default checkbox;
 //# sourceMappingURL=checkbox.js.map

dist/esm/components/close-button.js

@@ -1,11 +0,7 @@
-import { mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["icon", "container"],
-  sizes: ["sm", "md", "lg"]
-};
-
-var baseStyle = props => {
-  return {
-    icon: {},
-    container: {
+import { mode, styleConfig } from "@chakra-ui/theme-tools";
+var closeButton = styleConfig({
+  baseStyle: function baseStyle(props) {
+    var hoverBg = mode("blackAlpha.100", "whiteAlpha.100")(props);
+    var activeBg = mode("blackAlpha.200", "whiteAlpha.200")(props);
+    return {
       borderRadius: "md",
@@ -19,6 +15,6 @@ transition: "all 0.2s",
       _hover: {
-        bg: mode("blackAlpha.100", "whiteAlpha.100")(props)
+        bg: hoverBg
       },
       _active: {
-        bg: mode("blackAlpha.200", "whiteAlpha.200")(props)
+        bg: activeBg
       },
@@ -28,45 +24,26 @@ _focus: {
       }
-    }
-  };
-};
-
-var sizes = {
-  lg: {
-    container: {
-      width: "40px",
-      height: "40px"
-    },
-    icon: {
+    };
+  },
+  sizes: {
+    lg: {
+      w: "40px",
+      h: "40px",
       fontSize: "16px"
-    }
-  },
-  md: {
-    container: {
-      width: "32px",
-      height: "32px"
     },
-    icon: {
+    md: {
+      w: "32px",
+      h: "32px",
       fontSize: "12px"
-    }
-  },
-  sm: {
-    container: {
-      width: "24px",
-      height: "24px"
     },
-    icon: {
+    sm: {
+      w: "24px",
+      h: "24px",
       fontSize: "10px"
     }
+  },
+  defaultProps: {
+    size: "md"
   }
-};
-var defaultProps = {
-  size: "md"
-};
-var closeButton = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes
-};
+});
 export default closeButton;
 //# sourceMappingURL=close-button.js.map

dist/esm/components/code.js

@@ -0,23 +1,15 @@
+import { styleConfig } from "@chakra-ui/theme-tools";
 import badge from "./badge";
-var register = {
-  parts: ["container"],
-  variants: badge.register.variants
-};
-var baseStyle = {
-  container: {
+var code = styleConfig({
+  baseStyle: {
     fontFamily: "mono",
     fontSize: "sm",
-    paddingX: "0.2em",
+    px: "0.2em",
     borderRadius: "sm"
-  }
-};
-var variants = badge.variants;
-var defaultProps = badge.defaultProps;
-var code = {
-  register,
-  defaultProps,
-  baseStyle,
-  variants
-};
+  },
+  variants: badge.variants,
+  sizes: badge.sizes,
+  defaultProps: badge.defaultProps
+});
 export default code;
 //# sourceMappingURL=code.js.map

dist/esm/components/drawer.js

 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-import { mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["overlay", "content", "header", "body", "footer"],
-  sizes: ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "full"]
-};
-
-var baseStyle = props => {
-  return {
-    overlay: {
-      bg: "blackAlpha.600"
-    },
-    content: _extends({}, props.isFullHeight && {
-      height: "100vh"
-    }, {
-      bg: mode("white", "gray.700")(props),
-      color: "inherit",
-      boxShadow: mode("lg", "dark-lg")(props)
-    }),
-    header: {
-      paddingX: 6,
-      paddingY: 4,
-      fontSize: "xl",
-      fontWeight: "semibold"
-    },
-    body: {
-      paddingX: 6,
-      paddingY: 2,
-      flex: 1,
-      overflow: "auto"
-    },
-    footer: {
-      paddingX: 6,
-      paddingY: 4
-    }
-  };
-};
+import { mode, multiStyleConfig } from "@chakra-ui/theme-tools";
+var drawer = multiStyleConfig({
+  parts: {
+    overlay: "the overlay or shim",
+    content: "the main content wrapper",
+    header: "the content heading",
+    body: "the main content area",
+    footer: "the action footer"
+  },
+  baseStyle: function baseStyle(props) {
+    var {
+      isFullHeight
+    } = props;
+    return {
+      overlay: {
+        bg: "blackAlpha.600"
+      },
+      content: _extends({}, isFullHeight && {
+        height: "100vh"
+      }, {
+        bg: mode("white", "gray.700")(props),
+        color: "inherit",
+        boxShadow: mode("lg", "dark-lg")(props)
+      }),
+      header: {
+        px: 6,
+        py: 4,
+        fontSize: "xl",
+        fontWeight: "semibold"
+      },
+      body: {
+        px: 6,
+        py: 2,
+        flex: 1,
+        overflow: "auto"
+      },
+      footer: {
+        px: 6,
+        py: 4
+      }
+    };
+  },
+  sizes: {
+    xs: getSize("xs"),
+    sm: getSize("md"),
+    md: getSize("lg"),
+    lg: getSize("2xl"),
+    xl: getSize("4xl"),
+    full: getSize("full")
+  },
+  defaultProps: {
+    size: "xs"
+  }
+});
 /**
@@ -44,27 +62,20 @@ * Since the `maxWidth` prop references theme.sizes internally,
 
-
-var getSize = value => ({
-  content: {
-    maxWidth: value
+function getSize(value) {
+  if (value === "full") {
+    return {
+      content: {
+        maxW: "100vw",
+        h: "100vh"
+      }
+    };
   }
-});
 
-var sizes = {
-  xs: getSize("xs"),
-  sm: getSize("md"),
-  md: getSize("lg"),
-  lg: getSize("2xl"),
-  xl: getSize("4xl"),
-  full: getSize("100vw")
-};
-var defaultProps = {
-  size: "xs"
-};
-var modal = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes
-};
-export default modal;
+  return {
+    content: {
+      maxW: value
+    }
+  };
+}
+
+export default drawer;
 //# sourceMappingURL=drawer.js.map

dist/esm/components/editable.js

@@ -1,29 +0,28 @@
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-var register = {
-  parts: ["container", "preview", "input"]
-};
-var previewStyle = {
-  borderRadius: "md",
-  paddingY: "3px",
-  transition: "all 0.2s"
-};
-var baseStyle = {
-  container: {},
-  preview: previewStyle,
-  input: _extends({}, previewStyle, {
-    width: "full",
-    _focus: {
-      boxShadow: "outline"
+import { multiStyleConfig } from "@chakra-ui/theme-tools";
+var editable = multiStyleConfig({
+  parts: {
+    preview: "the editable text preview",
+    input: "the editable input field"
+  },
+  baseStyle: {
+    preview: {
+      borderRadius: "md",
+      py: "3px",
+      transition: "all 0.2s"
     },
-    _placeholder: {
-      opacity: 0.6
+    input: {
+      borderRadius: "md",
+      py: "3px",
+      transition: "all 0.2s",
+      width: "full",
+      _focus: {
+        boxShadow: "outline"
+      },
+      _placeholder: {
+        opacity: 0.6
+      }
     }
-  })
-};
-var editable = {
-  register,
-  baseStyle
-};
+  }
+});
 export default editable;
 //# sourceMappingURL=editable.js.map

dist/esm/components/form.js

@@ -1,46 +0,34 @@
-import { mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["label", "errorText", "requiredIndicator", "helperText", "errorIcon"]
-};
-
-var baseStyle = props => {
-  return {
-    label: {
-      fontSize: "md",
-      marginRight: 3,
-      marginBottom: 2,
-      fontWeight: "medium",
-      transition: "all 0.2s",
-      opacity: 1,
-      _disabled: {
-        opacity: 0.4
+import { mode, multiStyleConfig } from "@chakra-ui/theme-tools";
+var form = multiStyleConfig({
+  parts: {
+    errorText: "the error message",
+    errorIcon: "the error icon",
+    requiredIndicator: "the requied asterisks",
+    helperText: "the helper text"
+  },
+  baseStyle: function baseStyle(props) {
+    return {
+      errorText: {
+        color: mode("red.500", "red.300")(props),
+        mt: 2,
+        fontSize: "sm"
+      },
+      requiredIndicator: {
+        ml: 1,
+        color: mode("red.500", "red.300")(props)
+      },
+      helperText: {
+        mt: 2,
+        color: mode("gray.500", "whiteAlpha.600")(props),
+        lineHeight: "normal",
+        fontSize: "sm"
+      },
+      errorIcon: {
+        mr: "0.5em",
+        color: mode("red.500", "red.300")(props)
       }
-    },
-    errorText: {
-      color: mode("red.500", "red.300")(props),
-      marginTop: 2,
-      fontSize: "sm"
-    },
-    requiredIndicator: {
-      marginLeft: 1,
-      color: mode("red.500", "red.300")(props)
-    },
-    helperText: {
-      marginTop: 2,
-      color: mode("gray.500", "whiteAlpha.600")(props),
-      lineHeight: "normal",
-      fontSize: "sm"
-    },
-    errorIcon: {
-      marginRight: "0.5em",
-      color: mode("red.500", "red.300")(props)
-    }
-  };
-};
-
-var form = {
-  register,
-  baseStyle
-};
+    };
+  }
+});
 export default form;
 //# sourceMappingURL=form.js.map

dist/esm/components/heading.js

@@ -1,54 +0,33 @@
-var register = {
-  parts: ["heading"],
-  sizes: ["2xl", "xl", "lg", "md", "sm", "xs"]
-};
-var baseStyle = {
-  heading: {
+import { styleConfig } from "@chakra-ui/theme-tools";
+var heading = styleConfig({
+  baseStyle: {
     fontFamily: "heading",
     lineHeight: "shorter",
     fontWeight: "bold"
-  }
-};
-var sizes = {
-  "2xl": {
-    heading: {
+  },
+  sizes: {
+    "2xl": {
       fontSize: ["4xl", null, "5xl"]
-    }
-  },
-  xl: {
-    heading: {
+    },
+    xl: {
       fontSize: ["3xl", null, "4xl"]
-    }
-  },
-  lg: {
-    heading: {
-      fontSize: ["xl", null, "2xl"]
-    }
-  },
-  md: {
-    heading: {
+    },
+    lg: {
+      fontSize: ["2xl", null, "3xl"]
+    },
+    md: {
       fontSize: "xl"
-    }
-  },
-  sm: {
-    heading: {
+    },
+    sm: {
       fontSize: "md"
+    },
+    xs: {
+      fontSize: "sm"
     }
   },
-  xs: {
-    heading: {
-      fontSize: "sm"
-    }
+  defaultProps: {
+    size: "xl"
   }
-};
-var defaultProps = {
-  size: "xl"
-};
-var heading = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes
-};
+});
 export default heading;
 //# sourceMappingURL=heading.js.map

dist/esm/components/index.js

@@ -14,2 +14,3 @@ import Accordion from "./accordion";
 import Link from "./link";
+import FormLabel from "./form-label";
 import Menu from "./menu";
@@ -46,2 +47,3 @@ import NumberInput from "./number-input";
   Code,
+  FormLabel,
   Spinner,
@@ -48,0 +50,0 @@ Drawer,

dist/esm/components/input.js

@@ -1,22 +0,8 @@
-import { getColor, mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["field", "addon"],
-  sizes: ["sm", "md", "lg"],
-  variants: ["outline", "flushed", "filled", "unstyled"]
-};
-var baseStyle = {
-  field: {
-    width: "100%",
-    outline: 0,
-    position: "relative",
-    appearance: "none",
-    transition: "all 0.2s"
-  }
-};
-var commonSizeStyle = {
+import { getColor, mode, multiStyleConfig } from "@chakra-ui/theme-tools";
+var size = {
   lg: {
     fontSize: "lg",
-    paddingLeft: 4,
+    pl: 4,
     paddingRight: 4,
-    height: 12,
+    h: 12,
     borderRadius: "md"
@@ -26,5 +12,5 @@ },
     fontSize: "md",
-    paddingLeft: 4,
+    pl: 4,
     paddingRight: 4,
-    height: 10,
+    h: 10,
     borderRadius: "md"
@@ -34,168 +20,169 @@ },
     fontSize: "sm",
-    paddingLeft: 3,
+    pl: 3,
     paddingRight: 3,
-    height: 8,
+    h: 8,
     borderRadius: "sm"
   }
 };
-var sizes = {
-  lg: {
-    field: commonSizeStyle.lg,
-    addon: commonSizeStyle.lg
+var input = multiStyleConfig({
+  parts: {
+    field: "the input field itself",
+    addon: "the left and right input addon"
   },
-  md: {
-    field: commonSizeStyle.md,
-    addon: commonSizeStyle.md
+  baseStyle: {
+    field: {
+      width: "100%",
+      outline: 0,
+      position: "relative",
+      appearance: "none",
+      transition: "all 0.2s"
+    }
   },
-  sm: {
-    field: commonSizeStyle.sm,
-    addon: commonSizeStyle.sm
-  }
-};
-var variants = {
-  outline(props) {
-    var {
-      theme
-    } = props;
-    var {
-      focusBorderColor: fc,
-      errorBorderColor: ec
-    } = getDefaults(props);
-    return {
-      field: {
-        border: "1px solid",
-        borderColor: mode("inherit", "whiteAlpha.50")(props),
-        bg: mode("white", "whiteAlpha.100")(props),
-        _hover: {
-          borderColor: mode("gray.300", "whiteAlpha.200")(props)
+  sizes: {
+    lg: {
+      field: size.lg,
+      addon: size.lg
+    },
+    md: {
+      field: size.md,
+      addon: size.md
+    },
+    sm: {
+      field: size.sm,
+      addon: size.sm
+    }
+  },
+  variants: {
+    outline: function outline(props) {
+      var {
+        theme
+      } = props;
+      var {
+        focusBorderColor: fc,
+        errorBorderColor: ec
+      } = getDefaults(props);
+      return {
+        field: {
+          border: "1px solid",
+          borderColor: mode("inherit", "whiteAlpha.50")(props),
+          bg: mode("white", "whiteAlpha.100")(props),
+          _hover: {
+            borderColor: mode("gray.300", "whiteAlpha.200")(props)
+          },
+          _readOnly: {
+            boxShadow: "none !important",
+            userSelect: "all"
+          },
+          _disabled: {
+            opacity: 0.4,
+            cursor: "not-allowed"
+          },
+          _focus: {
+            borderColor: getColor(theme, fc),
+            boxShadow: "0 0 0 1px " + getColor(theme, fc)
+          },
+          _invalid: {
+            borderColor: getColor(theme, ec),
+            boxShadow: "0 0 0 1px " + getColor(theme, ec)
+          }
         },
-        _readOnly: {
-          boxShadow: "none !important",
-          userSelect: "all"
+        addon: {
+          border: "1px solid",
+          borderColor: mode("inherit", "whiteAlpha.50")(props),
+          bg: mode("gray.100", "whiteAlpha.300")(props)
+        }
+      };
+    },
+    filled: function filled(props) {
+      var {
+        theme
+      } = props;
+      var {
+        focusBorderColor: fc,
+        errorBorderColor: ec
+      } = getDefaults(props);
+      return {
+        field: {
+          border: "2px solid",
+          borderColor: "transparent",
+          bg: mode("gray.100", "whiteAlpha.50")(props),
+          _hover: {
+            bg: mode("gray.200", "whiteAlpha.100")(props)
+          },
+          _readOnly: {
+            boxShadow: "none !important",
+            userSelect: "all"
+          },
+          _disabled: {
+            opacity: 0.4,
+            cursor: "not-allowed"
+          },
+          _focus: {
+            bg: "transparent",
+            borderColor: getColor(theme, fc)
+          },
+          _invalid: {
+            borderColor: getColor(theme, ec)
+          }
         },
-        _disabled: {
-          opacity: 0.4,
-          cursor: "not-allowed"
-        },
-        _focus: {
-          zIndex: 1,
-          borderColor: getColor(theme, fc),
-          boxShadow: "0 0 0 1px " + getColor(theme, fc)
-        },
-        _invalid: {
-          borderColor: getColor(theme, ec),
-          boxShadow: "0 0 0 1px " + getColor(theme, ec)
+        addon: {
+          border: "2px solid",
+          borderColor: "transparent",
+          bg: mode("gray.100", "whiteAlpha.50")(props)
         }
-      },
-      addon: {
-        border: "1px solid",
-        borderColor: mode("inherit", "whiteAlpha.50")(props),
-        bg: mode("gray.100", "whiteAlpha.300")(props)
-      }
-    };
-  },
-
-  filled(props) {
-    var {
-      theme
-    } = props;
-    var {
-      focusBorderColor: fc,
-      errorBorderColor: ec
-    } = getDefaults(props);
-    return {
-      field: {
-        border: "2px solid",
-        borderColor: "transparent",
-        bg: mode("gray.100", "whiteAlpha.50")(props),
-        _hover: {
-          bg: mode("gray.200", "whiteAlpha.100")(props)
-        },
-        _readOnly: {
-          boxShadow: "none !important",
-          userSelect: "all"
-        },
-        _disabled: {
-          opacity: 0.4,
-          cursor: "not-allowed"
-        },
-        _focus: {
-          zIndex: 1,
+      };
+    },
+    flushed: function flushed(props) {
+      var {
+        theme
+      } = props;
+      var {
+        focusBorderColor: fc,
+        errorBorderColor: ec
+      } = getDefaults(props);
+      return {
+        field: {
+          borderBottom: "2px solid",
+          borderColor: "inherit",
+          borderRadius: 0,
+          paddingX: 0,
           bg: "transparent",
-          borderColor: getColor(theme, fc)
+          _readOnly: {
+            boxShadow: "none !important",
+            userSelect: "all"
+          },
+          _focus: {
+            borderColor: getColor(theme, fc)
+          },
+          _invalid: {
+            borderColor: getColor(theme, ec)
+          }
         },
-        _invalid: {
-          borderColor: getColor(theme, ec)
+        addon: {
+          borderBottom: "2px solid",
+          borderColor: "inherit",
+          borderRadius: 0,
+          paddingX: 0,
+          bg: "transparent"
         }
-      },
-      addon: {
-        border: "2px solid",
-        borderColor: "transparent",
-        bg: mode("gray.100", "whiteAlpha.50")(props)
-      }
-    };
-  },
-
-  flushed(props) {
-    var {
-      theme
-    } = props;
-    var {
-      focusBorderColor: fc,
-      errorBorderColor: ec
-    } = getDefaults(props);
-    return {
+      };
+    },
+    unstyled: {
       field: {
-        borderBottom: "2px solid",
-        borderColor: "inherit",
-        borderRadius: 0,
+        bg: "transparent",
         paddingX: 0,
-        bg: "transparent",
-        _readOnly: {
-          boxShadow: "none !important",
-          userSelect: "all"
-        },
-        _focus: {
-          zIndex: 1,
-          borderColor: getColor(theme, fc)
-        },
-        _invalid: {
-          borderColor: getColor(theme, ec)
-        }
+        height: "auto"
       },
       addon: {
-        borderBottom: "2px solid",
-        borderColor: "inherit",
-        borderRadius: 0,
+        bg: "transparent",
         paddingX: 0,
-        bg: "transparent"
+        height: "auto"
       }
-    };
+    }
   },
-
-  unstyled: {
-    field: {
-      bg: "transparent",
-      paddingX: 0,
-      height: "auto"
-    },
-    addon: {
-      bg: "transparent",
-      paddingX: 0,
-      height: "auto"
-    }
+  defaultProps: {
+    size: "md",
+    variant: "outline"
   }
-};
-var defaultProps = {
-  size: "md",
-  variant: "outline"
-};
-var input = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes,
-  variants
-};
-export default input;
+});
 
@@ -212,2 +199,4 @@ function getDefaults(props) {
 }
+
+export default input;
 //# sourceMappingURL=input.js.map

dist/esm/components/kbd.js

@@ -1,9 +0,5 @@
-import { mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["kbd"]
-};
-
-var baseStyle = props => {
-  return {
-    kbd: {
+import { mode, styleConfig } from "@chakra-ui/theme-tools";
+var kbd = styleConfig({
+  baseStyle: function baseStyle(props) {
+    return {
       bg: mode("gray.100", "whiteAlpha")(props),
@@ -18,11 +14,6 @@ borderRadius: "md",
       whiteSpace: "nowrap"
-    }
-  };
-};
-
-var kbd = {
-  register,
-  baseStyle
-};
+    };
+  }
+});
 export default kbd;
 //# sourceMappingURL=kbd.js.map

dist/esm/components/link.js

@@ -1,6 +0,4 @@
-var register = {
-  parts: ["link"]
-};
-var baseStyle = {
-  link: {
+import { styleConfig } from "@chakra-ui/theme-tools";
+var link = styleConfig({
+  baseStyle: {
     transition: "all 0.15s ease-out",
@@ -23,8 +21,4 @@ cursor: "pointer",
   }
-};
-var link = {
-  register,
-  baseStyle
-};
+});
 export default link;
 //# sourceMappingURL=link.js.map

dist/esm/components/menu.js

@@ -1,53 +0,53 @@
-import { mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["menuList", "menuItem", "menuButton", "groupTitle", "menuDivider", "icon", "command"]
-};
-
-var baseStyle = props => {
-  return {
-    menuList: {
-      bg: mode("#fff", "gray.700")(props),
-      boxShadow: mode("sm", "dark-lg")(props),
-      color: "inherit",
-      minWidth: "3xs",
-      paddingY: "2",
-      zIndex: 1,
-      borderRadius: "md",
-      borderWidth: "1px"
-    },
-    menuItem: {
-      paddingY: "0.4rem",
-      paddingX: "0.8rem",
-      transition: "background 50ms ease-in 0s",
-      _focus: {
-        bg: mode("gray.100", "whiteAlpha.100")(props)
+import { mode, multiStyleConfig } from "@chakra-ui/theme-tools";
+var menu = multiStyleConfig({
+  parts: {
+    item: "the menu item button",
+    command: "the menu item command",
+    list: "the menu items wrapper",
+    button: "the menu list trigger",
+    groupTitle: "the menu group title"
+  },
+  baseStyle: function baseStyle(props) {
+    return {
+      list: {
+        bg: mode("#fff", "gray.700")(props),
+        boxShadow: mode("sm", "dark-lg")(props),
+        color: "inherit",
+        minW: "3xs",
+        py: "2",
+        zIndex: 1,
+        borderRadius: "md",
+        borderWidth: "1px"
       },
-      _active: {
-        bg: mode("gray.200", "whiteAlpha.200")(props)
+      item: {
+        py: "0.4rem",
+        paddingX: "0.8rem",
+        transition: "background 50ms ease-in 0s",
+        _focus: {
+          bg: mode("gray.100", "whiteAlpha.100")(props)
+        },
+        _active: {
+          bg: mode("gray.200", "whiteAlpha.200")(props)
+        },
+        _expanded: {
+          bg: mode("gray.100", "whiteAlpha.100")(props)
+        },
+        _disabled: {
+          opacity: 0.4,
+          cursor: "not-allowed"
+        }
       },
-      _expanded: {
-        bg: mode("gray.100", "whiteAlpha.100")(props)
+      groupTitle: {
+        marginX: 4,
+        marginY: 2,
+        fontWeight: "semibold",
+        fontSize: "sm"
       },
-      _disabled: {
-        opacity: 0.4,
-        cursor: "not-allowed"
+      command: {
+        opacity: 0.6
       }
-    },
-    groupTitle: {
-      marginX: 4,
-      marginY: 2,
-      fontWeight: "semibold",
-      fontSize: "sm"
-    },
-    command: {
-      opacity: 0.6
-    }
-  };
-};
-
-var menu = {
-  register,
-  baseStyle
-};
+    };
+  }
+});
 export default menu;
 //# sourceMappingURL=menu.js.map

dist/esm/components/modal.js

@@ -1,46 +0,66 @@
-import { mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["overlay", "content", "header", "body", "footer"],
-  sizes: ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "full"]
-};
-
-var baseStyle = props => {
-  var {
-    isCentered,
-    scrollBehavior
-  } = props;
-  return {
-    overlay: {
-      bg: "blackAlpha.600",
-      display: "flex",
-      justifyContent: "center",
-      alignItems: isCentered ? "center" : "flex-start",
-      overflow: scrollBehavior === "inside" ? "hidden" : "auto"
-    },
-    content: {
-      borderRadius: "md",
-      bg: mode("white", "gray.700")(props),
-      color: "inherit",
-      marginY: "3.75rem",
-      maxHeight: scrollBehavior === "inside" ? "calc(100vh - 7.5rem)" : undefined,
-      boxShadow: mode("lg", "dark-lg")(props)
-    },
-    header: {
-      paddingX: 6,
-      paddingY: 4,
-      fontSize: "xl",
-      fontWeight: "semibold"
-    },
-    body: {
-      paddingX: 6,
-      paddingY: 2,
-      flex: 1,
-      overflow: scrollBehavior === "inside" ? "auto" : undefined
-    },
-    footer: {
-      paddingX: 6,
-      paddingY: 4
-    }
-  };
-};
+import { mode, multiStyleConfig } from "@chakra-ui/theme-tools";
+var modal = multiStyleConfig({
+  parts: {
+    overlay: "the modal overlay",
+    content: "the modal content wrapper",
+    header: "the modal content header",
+    body: "the modal main content area",
+    footer: "the modal footer action"
+  },
+  baseStyle: function baseStyle(props) {
+    var {
+      isCentered,
+      scrollBehavior
+    } = props;
+    return {
+      overlay: {
+        bg: "blackAlpha.600",
+        display: "flex",
+        justifyContent: "center",
+        alignItems: isCentered ? "center" : "flex-start",
+        overflow: scrollBehavior === "inside" ? "hidden" : "auto"
+      },
+      content: {
+        borderRadius: "md",
+        bg: mode("white", "gray.700")(props),
+        color: "inherit",
+        my: "3.75rem",
+        maxH: scrollBehavior === "inside" ? "calc(100vh - 7.5rem)" : undefined,
+        boxShadow: mode("lg", "dark-lg")(props)
+      },
+      header: {
+        px: 6,
+        py: 4,
+        fontSize: "xl",
+        fontWeight: "semibold"
+      },
+      body: {
+        px: 6,
+        py: 2,
+        flex: 1,
+        overflow: scrollBehavior === "inside" ? "auto" : undefined
+      },
+      footer: {
+        px: 6,
+        py: 4
+      }
+    };
+  },
+  sizes: {
+    xs: getSize("xs"),
+    sm: getSize("sm"),
+    md: getSize("md"),
+    lg: getSize("lg"),
+    xl: getSize("xl"),
+    "2xl": getSize("2xl"),
+    "3xl": getSize("3xl"),
+    "4xl": getSize("4xl"),
+    "5xl": getSize("5xl"),
+    "6xl": getSize("6xl"),
+    full: getSize("full")
+  },
+  defaultProps: {
+    size: "md"
+  }
+});
 /**
@@ -51,7 +71,15 @@ * Since the `maxWidth` prop references theme.sizes internally,
 
+function getSize(value) {
+  if (value === "full") {
+    return {
+      content: {
+        maxW: "100vw",
+        h: "100vh"
+      }
+    };
+  }
 
-function getSize(value) {
   return {
     content: {
-      maxWidth: value
+      maxW: value
     }
@@ -61,97 +89,3 @@ };
 
-var sizes = {
-  xs: getSize("xs"),
-  sm: getSize("sm"),
-  md: getSize("md"),
-  lg: getSize("lg"),
-  xl: getSize("xl"),
-  "2xl": getSize("2xl"),
-  "3xl": getSize("3xl"),
-  "4xl": getSize("4xl"),
-  "5xl": getSize("5xl"),
-  "6xl": getSize("6xl"),
-  full: getSize("full")
-};
-var defaultProps = {
-  size: "md"
-};
-var transition = {
-  overlay: {
-    timeout: {
-      enter: 150,
-      exit: 100
-    },
-    enter: {
-      transition: {
-        easing: "cubic-bezier(0,0,.2,1)",
-        duration: "150ms",
-        property: "opacity"
-      },
-      from: {
-        opacity: 0.01
-      },
-      to: {
-        opacity: 1
-      }
-    },
-    exit: {
-      transition: {
-        easing: "cubic-bezier(.4,0,1,1)",
-        duration: "100ms",
-        property: "opacity"
-      },
-      from: {
-        opacity: 1
-      },
-      to: {
-        opacity: 0.01
-      }
-    }
-  },
-  content: {
-    addAppearStyles: true,
-    timeout: {
-      enter: 150,
-      exit: 100
-    },
-    enter: {
-      transition: {
-        easing: "cubic-bezier(0,0,.2,1)",
-        duration: "150ms",
-        property: "opacity, transform"
-      },
-      from: {
-        opacity: 0.01,
-        transform: "scale(0.97)"
-      },
-      to: {
-        opacity: 1,
-        transform: "scale(1)"
-      }
-    },
-    exit: {
-      transition: {
-        easing: "cubic-bezier(.4,0,1,1)",
-        duration: "100ms",
-        property: "opacity, transform"
-      },
-      from: {
-        opacity: 1,
-        transform: "scale(1)"
-      },
-      to: {
-        opacity: 0.01,
-        transform: "scale(0.97)"
-      }
-    }
-  }
-};
-var modal = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes,
-  transition
-};
 export default modal;
 //# sourceMappingURL=modal.js.map

dist/esm/components/number-input.js

@@ -1,39 +0,44 @@
-import { mode, runIfFn } from "@chakra-ui/theme-tools";
+import { mode, multiStyleConfig } from "@chakra-ui/theme-tools";
 import input from "./input";
-var register = {
-  parts: ["field", "stepper", "stepperGroup"],
-  sizes: input.register.sizes,
-  variants: input.register.variants
-};
+var numberInput = multiStyleConfig({
+  parts: {
+    field: "the input field",
+    stepper: "desktop - the increment and decrement button",
+    stepperGroup: "desktop - the increment and decrement button group"
+  },
+  baseStyle: function baseStyle(props) {
+    var _input$baseStyle;
 
-var baseStyle = props => {
-  return {
-    field: input.baseStyle.field,
-    stepperGroup: {
-      width: "24px"
-    },
-    stepper: {
-      borderLeft: "1px solid",
-      borderColor: mode("inherit", "whiteAlpha.300")(props),
-      color: mode("inherit", "whiteAlpha.800")(props),
-      _active: {
-        bg: mode("gray.200", "whiteAlpha.300")(props)
+    return {
+      field: (_input$baseStyle = input.baseStyle) == null ? void 0 : _input$baseStyle.field,
+      stepperGroup: {
+        width: "24px"
       },
-      _disabled: {
-        opacity: 0.4,
-        cursor: "not-allowed"
+      stepper: {
+        borderLeft: "1px solid",
+        borderColor: mode("inherit", "whiteAlpha.300")(props),
+        color: mode("inherit", "whiteAlpha.800")(props),
+        _active: {
+          bg: mode("gray.200", "whiteAlpha.300")(props)
+        },
+        _disabled: {
+          opacity: 0.4,
+          cursor: "not-allowed"
+        }
       }
-    }
-  };
-};
+    };
+  },
+  sizes: {
+    sm: getSize("sm"),
+    md: getSize("md"),
+    lg: getSize("lg")
+  },
+  variants: input.variants,
+  defaultProps: input.defaultProps
+});
 
-var sizes = {
-  sm: getSizeStyle("sm"),
-  md: getSizeStyle("md"),
-  lg: getSizeStyle("lg")
-};
+function getSize(size) {
+  var _input$sizes;
 
-function getSizeStyle(size) {
-  var inputPartsStyle = input.sizes[size];
-  var inputStyle = typeof inputPartsStyle !== "function" ? inputPartsStyle == null ? void 0 : inputPartsStyle.field : {};
+  var sizeStyle = (_input$sizes = input.sizes) == null ? void 0 : _input$sizes[size];
   var radius = {
@@ -45,3 +50,3 @@ lg: "md",
   return {
-    field: inputStyle,
+    field: sizeStyle == null ? void 0 : sizeStyle.field,
     stepper: {
@@ -54,3 +59,3 @@ fontSize: size === "lg" ? "14px" : "10px",
         borderBottomRightRadius: radius[size],
-        marginTop: "-1px",
+        mt: "-1px",
         borderTopWidth: 1
@@ -62,33 +67,3 @@ }
 
-var variants = {
-  outline: props => ({
-    field: getVariantStyle("outline", props)
-  }),
-  filled: props => ({
-    field: getVariantStyle("filled", props)
-  }),
-  flushed: props => ({
-    field: getVariantStyle("flushed", props)
-  }),
-  unstyled: props => ({
-    field: getVariantStyle("unstyled", props)
-  })
-};
-
-function getVariantStyle(variant, props) {
-  var _partsStyle$field;
-
-  var partsStyle = runIfFn(input.variants[variant], props);
-  return (_partsStyle$field = partsStyle == null ? void 0 : partsStyle.field) != null ? _partsStyle$field : {};
-}
-
-var defaultProps = input.defaultProps;
-var numberInput = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes,
-  variants
-};
 export default numberInput;
 //# sourceMappingURL=number-input.js.map

dist/esm/components/pin-input.js

@@ -0,44 +1,52 @@
+var _input$baseStyle, _input$variants4;
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+import { styleConfig } from "@chakra-ui/theme-tools";
 import input from "./input";
-var register = {
-  parts: ["field"],
-  sizes: input.register.sizes,
-  variants: input.register.variants
-};
-var baseStyle = input.baseStyle;
-var variants = input.variants;
-var sizes = {
-  lg: {
-    field: {
+var pinInput = styleConfig({
+  baseStyle: _extends({}, (_input$baseStyle = input.baseStyle) == null ? void 0 : _input$baseStyle.field, {
+    textAlign: "center"
+  }),
+  sizes: {
+    lg: {
       fontSize: "lg",
-      width: 12,
-      height: 12,
+      w: 12,
+      h: 12,
       borderRadius: "md"
-    }
-  },
-  md: {
-    field: {
+    },
+    md: {
       fontSize: "md",
-      width: 10,
-      height: 10,
+      w: 10,
+      h: 10,
       borderRadius: "md"
-    }
-  },
-  sm: {
-    field: {
+    },
+    sm: {
       fontSize: "sm",
-      width: 8,
-      height: 8,
+      w: 8,
+      h: 8,
       borderRadius: "sm"
     }
-  }
-};
-var defaultProps = input.defaultProps;
-var pinInput = {
-  register,
-  defaultProps,
-  baseStyle,
-  variants,
-  sizes
-};
+  },
+  variants: {
+    outline: props => {
+      var _input$variants$outli, _input$variants, _input$variants$outli2;
+
+      return (_input$variants$outli = (_input$variants = input.variants) == null ? void 0 : (_input$variants$outli2 = _input$variants.outline(props)) == null ? void 0 : _input$variants$outli2.field) != null ? _input$variants$outli : {};
+    },
+    flushed: props => {
+      var _input$variants$flush, _input$variants2, _input$variants2$flus;
+
+      return (_input$variants$flush = (_input$variants2 = input.variants) == null ? void 0 : (_input$variants2$flus = _input$variants2.flushed(props)) == null ? void 0 : _input$variants2$flus.field) != null ? _input$variants$flush : {};
+    },
+    filled: props => {
+      var _input$variants$fille, _input$variants3;
+
+      return (_input$variants$fille = (_input$variants3 = input.variants) == null ? void 0 : _input$variants3.filled(props).field) != null ? _input$variants$fille : {};
+    },
+    unstyled: (_input$variants4 = input.variants) == null ? void 0 : _input$variants4.unstyled.field
+  },
+  defaultProps: input.defaultProps
+});
 export default pinInput;
 //# sourceMappingURL=pin-input.js.map

dist/esm/components/popover.js

@@ -1,48 +0,43 @@
-import { mode, scaleFade } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["content", "header", "body", "footer"]
-};
-
-var baseStyle = props => {
-  return {
-    content: {
-      bg: mode("white", "gray.700")(props),
-      border: "1px solid",
-      borderColor: "inherit",
-      borderRadius: "md",
-      boxShadow: "sm",
-      width: "100%",
-      maxWidth: "xs",
-      zIndex: "1",
-      _focus: {
-        outline: 0,
-        boxShadow: "outline"
+import { mode, multiStyleConfig } from "@chakra-ui/theme-tools";
+var popover = multiStyleConfig({
+  parts: {
+    content: "the popover's content wrapper",
+    header: "the popover heading",
+    body: "the popover main content",
+    footer: "the action footers for popover"
+  },
+  baseStyle: function baseStyle(props) {
+    return {
+      content: {
+        bg: mode("white", "gray.700")(props),
+        border: "1px solid",
+        borderColor: "inherit",
+        borderRadius: "md",
+        boxShadow: "sm",
+        w: "100%",
+        maxW: "xs",
+        zIndex: "1",
+        _focus: {
+          outline: 0,
+          boxShadow: "outline"
+        }
+      },
+      header: {
+        px: 3,
+        py: 2,
+        borderBottomWidth: "1px"
+      },
+      body: {
+        px: 3,
+        py: 2
+      },
+      footer: {
+        px: 3,
+        py: 2,
+        borderTopWidth: "1px"
       }
-    },
-    header: {
-      paddingX: 3,
-      paddingY: 2,
-      borderBottomWidth: "1px"
-    },
-    body: {
-      paddingX: 3,
-      paddingY: 2
-    },
-    footer: {
-      paddingX: 3,
-      paddingY: 2,
-      borderTopWidth: "1px"
-    }
-  };
-};
-
-var transition = {
-  content: scaleFade
-};
-var popover = {
-  register,
-  baseStyle,
-  transition
-};
+    };
+  }
+});
 export default popover;
 //# sourceMappingURL=popover.js.map

dist/esm/components/progress.js

 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-import { generateStripe, getColor, mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["track", "filledTrack", "label"],
-  sizes: ["xs", "sm", "md", "lg"]
-};
-
-var baseStyle = props => {
-  return {
-    label: {
-      lineHeight: "1",
-      fontSize: "0.25em",
-      fontWeight: "bold",
-      color: "white"
+import { generateStripe, getColor, mode, multiStyleConfig } from "@chakra-ui/theme-tools";
+var progress = multiStyleConfig({
+  parts: {
+    track: "the linear progress track",
+    filledTrack: "the inner filled track",
+    label: "the value indicator or label"
+  },
+  baseStyle: function baseStyle(props) {
+    return {
+      label: {
+        lineHeight: "1",
+        fontSize: "0.25em",
+        fontWeight: "bold",
+        color: "white"
+      },
+      track: {
+        bg: mode("gray.100", "whiteAlpha.300")(props)
+      },
+      filledTrack: _extends({
+        transition: "all 0.3s"
+      }, filledStyle(props))
+    };
+  },
+  sizes: {
+    xs: {
+      track: {
+        h: "0.25rem"
+      }
     },
-    track: {
-      bg: mode("gray.100", "whiteAlpha.300")(props)
+    sm: {
+      track: {
+        h: "0.5rem"
+      }
     },
-    filledTrack: _extends({
-      transition: "all 0.3s"
-    }, getFilledTrackStyle(props))
-  };
-};
+    md: {
+      track: {
+        h: "0.75rem"
+      }
+    },
+    lg: {
+      track: {
+        h: "1rem"
+      }
+    }
+  },
+  defaultProps: {
+    size: "md",
+    colorScheme: "blue"
+  }
+});
 
-function getFilledTrackStyle(props) {
+function filledStyle(props) {
   var {
@@ -36,41 +64,9 @@ colorScheme: c,
   var gradient = "linear-gradient(\n    to right,\n    transparent 0%,\n    " + getColor(t, bg) + " 50%,\n    transparent 100%\n  )";
-  var shouldAddStripe = !isIndeterminate && hasStripe;
-  return _extends({}, shouldAddStripe && stripeStyle, {
-    bg: isIndeterminate ? gradient : bg
+  var addStripe = !isIndeterminate && hasStripe;
+  return _extends({}, addStripe && stripeStyle, {
+    bgColor: isIndeterminate ? gradient : bg
   });
 }
 
-var sizes = {
-  xs: {
-    track: {
-      height: "0.25rem"
-    }
-  },
-  sm: {
-    track: {
-      height: "0.5rem"
-    }
-  },
-  md: {
-    track: {
-      height: "0.75rem"
-    }
-  },
-  lg: {
-    track: {
-      height: "1rem"
-    }
-  }
-};
-var defaultProps = {
-  size: "md",
-  colorScheme: "blue"
-};
-var progress = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes
-};
 export default progress;
 //# sourceMappingURL=progress.js.map

dist/esm/components/radio.js

 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-import { runIfFn } from "@chakra-ui/theme-tools";
+import { multiStyleConfig } from "@chakra-ui/theme-tools";
 import checkbox from "./checkbox";
-var register = {
-  parts: ["control", "label"],
-  sizes: checkbox.register.sizes
-};
+var radio = multiStyleConfig({
+  parts: {
+    control: "the radio input container",
+    label: "the radio label"
+  },
+  baseStyle: function baseStyle(props) {
+    var _checkbox$baseStyle;
 
-var baseStyle = props => {
-  var {
-    label,
-    control
-  } = runIfFn(checkbox.baseStyle, props);
-  return {
-    label,
-    control: _extends({}, control, {
-      borderRadius: "full",
-      _checked: _extends({}, control == null ? void 0 : control["_checked"], {
-        _before: {
-          content: "\"\"",
-          display: "inline-block",
-          position: "relative",
-          width: "50%",
-          height: "50%",
-          borderRadius: "50%",
-          bg: "currentColor"
-        }
+    var {
+      label,
+      control
+    } = (_checkbox$baseStyle = checkbox.baseStyle == null ? void 0 : checkbox.baseStyle(props)) != null ? _checkbox$baseStyle : {};
+    return {
+      label,
+      control: _extends({}, control, {
+        borderRadius: "full",
+        _checked: _extends({}, control == null ? void 0 : control["_checked"], {
+          _before: {
+            content: "\"\"",
+            display: "inline-block",
+            position: "relative",
+            width: "50%",
+            height: "50%",
+            borderRadius: "50%",
+            bg: "currentColor"
+          }
+        })
       })
-    })
-  };
-};
-
-var sizes = _extends({}, checkbox.sizes, {
-  sm: {
-    control: {
-      width: 3,
-      height: 3
+    };
+  },
+  sizes: {
+    md: {
+      control: {
+        w: 4,
+        h: 4
+      },
+      label: {
+        fontSize: "md"
+      }
+    },
+    lg: {
+      control: {
+        w: 5,
+        h: 5
+      },
+      label: {
+        fontSize: "lg"
+      }
+    },
+    sm: {
+      control: {
+        width: 3,
+        height: 3
+      },
+      label: {
+        fontSize: "sm"
+      }
     }
+  },
+  defaultProps: {
+    size: "md",
+    colorScheme: "blue"
   }
 });
-
-var defaultProps = checkbox.defaultProps;
-var radio = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes
-};
 export default radio;
 //# sourceMappingURL=radio.js.map

dist/esm/components/select.js

 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
+import { multiStyleConfig, mode } from "@chakra-ui/theme-tools";
 import input from "./input";
-var register = {
-  parts: ["field", "icon"],
-  sizes: input.register.sizes,
-  variants: input.register.variants
-};
-var baseStyle = {
-  field: _extends({}, input.baseStyle.field, {
-    appearance: "none",
-    paddingRight: "2rem",
-    paddingBottom: "1px",
-    lineHeight: "normal"
-  }),
-  icon: {
-    color: "currentColor",
-    fontSize: "1.25rem",
-    _disabled: {
-      opacity: 0.5
-    }
-  }
-};
-var sizes = input.sizes;
-var variants = input.variants;
-var defaultProps = input.defaultProps;
-var select = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes,
-  variants
-};
+var select = multiStyleConfig({
+  parts: {
+    field: "the select field itself",
+    icon: "the select field icon"
+  },
+  baseStyle: props => {
+    var _input$baseStyle;
+
+    return {
+      field: _extends({}, (_input$baseStyle = input.baseStyle) == null ? void 0 : _input$baseStyle.field, {
+        appearance: "none",
+        paddingBottom: "1px",
+        lineHeight: "normal",
+        "> option": {
+          bg: mode("white", "gray.700")(props)
+        }
+      }),
+      icon: {
+        color: "currentColor",
+        fontSize: "1.25rem",
+        _disabled: {
+          opacity: 0.5
+        }
+      }
+    };
+  },
+  sizes: input.sizes,
+  variants: input.variants,
+  defaultProps: input.defaultProps
+});
 export default select;
 //# sourceMappingURL=select.js.map

dist/esm/components/skeleton.js

 import { keyframes } from "@chakra-ui/system";
-import { getColor, mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["skeleton"]
-};
-
-var baseStyle = props => {
-  var {
-    startColor = mode("gray.100", "gray.800")(props),
-    endColor = mode("gray.400", "gray.600")(props),
-    speed,
-    theme
-  } = props;
-  var start = getColor(theme, startColor);
-  var end = getColor(theme, endColor);
-  return {
-    skeleton: {
+import { getColor, mode, styleConfig } from "@chakra-ui/theme-tools";
+var skeleton = styleConfig({
+  baseStyle: function baseStyle(props) {
+    var defaultStartColor = mode("gray.100", "gray.800")(props);
+    var defaultEndColor = mode("gray.400", "gray.600")(props);
+    var {
+      startColor = defaultStartColor,
+      endColor = defaultEndColor,
+      speed,
+      theme
+    } = props;
+    var start = getColor(theme, startColor);
+    var end = getColor(theme, endColor);
+    return {
       opacity: 0.7,
@@ -22,13 +20,8 @@ borderRadius: "2px",
       background: end,
-      animation: speed + "s linear infinite alternate " + frame(start, end)
-    }
-  };
-};
-
-var skeleton = {
-  register,
-  baseStyle
-};
+      animation: speed + "s linear infinite alternate " + fade(start, end)
+    };
+  }
+});
 export default skeleton;
-export function frame(startColor, endColor) {
+export function fade(startColor, endColor) {
   return keyframes({
@@ -35,0 +28,0 @@ from: {

dist/esm/components/skip-link.js

@@ -1,9 +0,5 @@
-import { mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["link"]
-};
-
-var baseStyle = props => {
-  return {
-    link: {
+import { mode, styleConfig } from "@chakra-ui/theme-tools";
+var skipLink = styleConfig({
+  baseStyle: function baseStyle(props) {
+    return {
       borderRadius: "md",
@@ -19,11 +15,6 @@ fontWeight: "semibold",
       }
-    }
-  };
-};
-
-var skipLink = {
-  register,
-  baseStyle
-};
+    };
+  }
+});
 export default skipLink;
 //# sourceMappingURL=skip-link.js.map

dist/esm/components/slider.js

 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-import { mode, orient } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["container", "thumb", "track", "filledTrack"],
-  sizes: ["sm", "md", "lg"]
-};
-
-var baseStyle = props => {
-  return {
-    container: _extends({
-      _disabled: {
-        opacity: 0.6,
-        cursor: "default",
-        pointerEvents: "none"
-      }
-    }, orient({
-      orientation: props.orientation,
-      vertical: {
-        height: "100%"
-      },
-      horizontal: {
-        width: "100%"
-      }
-    })),
-    track: {
-      borderRadius: "sm",
-      bg: mode("gray.200", "whiteAlpha.200")(props),
-      _disabled: {
-        bg: mode("gray.300", "whiteAlpha.300")(props)
-      }
-    },
-    thumb: _extends({
-      zIndex: 1,
-      borderRadius: "full",
-      bg: "white",
-      boxShadow: "sm",
-      border: "1px solid",
-      borderColor: "transparent",
-      transition: "transform 0.2s",
-      _focus: {
-        boxShadow: "outline"
-      },
-      _disabled: {
-        bg: "gray.300"
-      }
-    }, orient({
-      orientation: props.orientation,
-      vertical: {
-        left: "50%",
-        transform: "translateX(-50%)",
-        _active: {
-          transform: "translateX(-50%) scale(1.15)"
+import { mode, orient, multiStyleConfig } from "@chakra-ui/theme-tools";
+var slider = multiStyleConfig({
+  parts: {
+    container: "the slider wrapper",
+    thumb: "the slider thumb or handle",
+    track: "the slider outer track",
+    filledTrack: "the slider inner/filled track"
+  },
+  baseStyle: function baseStyle(props) {
+    var {
+      orientation,
+      colorScheme: c
+    } = props;
+    return {
+      container: _extends({
+        _disabled: {
+          opacity: 0.6,
+          cursor: "default",
+          pointerEvents: "none"
         }
-      },
-      horizontal: {
-        top: "50%",
-        transform: "translateY(-50%)",
-        _active: {
-          transform: "translateY(-50%) scale(1.15)"
+      }, orient({
+        orientation,
+        vertical: {
+          h: "100%"
+        },
+        horizontal: {
+          w: "100%"
         }
-      }
-    })),
-    filledTrack: {
-      bg: mode(props.colorScheme + ".500", props.colorScheme + ".200")(props)
-    }
-  };
-};
-
-var sizes = {
-  lg: function lg(props) {
-    return {
-      thumb: {
-        width: "16px",
-        height: "16px"
+      })),
+      track: {
+        borderRadius: "sm",
+        bg: mode("gray.200", "whiteAlpha.200")(props),
+        _disabled: {
+          bg: mode("gray.300", "whiteAlpha.300")(props)
+        }
       },
-      track: orient({
-        orientation: props.orientation,
-        horizontal: {
-          height: "4px"
+      thumb: _extends({
+        zIndex: 1,
+        borderRadius: "full",
+        bg: "white",
+        boxShadow: "base",
+        border: "1px solid",
+        borderColor: "transparent",
+        transition: "transform 0.2s",
+        _focus: {
+          boxShadow: "outline"
         },
-        vertical: {
-          width: "4px"
+        _disabled: {
+          bg: "gray.300"
         }
-      })
+      }, thumbOrientation(props)),
+      filledTrack: {
+        bg: mode(c + ".500", c + ".200")(props)
+      }
     };
   },
-  md: function md(props) {
-    return {
-      thumb: {
-        width: "14px",
-        height: "14px"
-      },
-      track: orient({
-        orientation: props.orientation,
-        horizontal: {
-          height: "4px"
+  sizes: {
+    lg: function lg(props) {
+      return {
+        thumb: {
+          w: "16px",
+          h: "16px"
         },
-        vertical: {
-          width: "4px"
-        }
-      })
-    };
+        track: orient({
+          orientation: props.orientation,
+          horizontal: {
+            h: "4px"
+          },
+          vertical: {
+            w: "4px"
+          }
+        })
+      };
+    },
+    md: function md(props) {
+      return {
+        thumb: {
+          w: "14px",
+          h: "14px"
+        },
+        track: orient({
+          orientation: props.orientation,
+          horizontal: {
+            h: "4px"
+          },
+          vertical: {
+            w: "4px"
+          }
+        })
+      };
+    },
+    sm: function sm(props) {
+      return {
+        thumb: {
+          w: "10px",
+          h: "10px"
+        },
+        track: orient({
+          orientation: props.orientation,
+          horizontal: {
+            h: "2px"
+          },
+          vertical: {
+            w: "2px"
+          }
+        })
+      };
+    }
   },
-  sm: function sm(props) {
-    return {
-      thumb: {
-        width: "10px",
-        height: "10px"
-      },
-      track: orient({
-        orientation: props.orientation,
-        horizontal: {
-          height: "2px"
-        },
-        vertical: {
-          width: "2px"
-        }
-      })
-    };
+  defaultProps: {
+    size: "md",
+    colorScheme: "blue"
   }
-};
-var defaultProps = {
-  size: "md",
-  colorScheme: "blue"
-};
-var slider = {
-  register,
-  defaultProps,
-  sizes,
-  baseStyle
-};
+});
+
+function thumbOrientation(props) {
+  return orient({
+    orientation: props.orientation,
+    vertical: {
+      left: "50%",
+      transform: "translateX(-50%)",
+      _active: {
+        transform: "translateX(-50%) scale(1.15)"
+      }
+    },
+    horizontal: {
+      top: "50%",
+      transform: "translateY(-50%)",
+      _active: {
+        transform: "translateY(-50%) scale(1.15)"
+      }
+    }
+  });
+}
+
 export default slider;
 //# sourceMappingURL=slider.js.map

dist/esm/components/spinner.js

@@ -1,46 +0,30 @@
-var register = {
-  parts: ["spinner"],
-  sizes: ["xs", "sm", "md", "lg", "xl"]
-};
-var sizes = {
-  xs: {
-    spinner: {
-      width: "0.75rem",
-      height: "0.75rem"
+import { styleConfig } from "@chakra-ui/theme-tools";
+var spinner = styleConfig({
+  sizes: {
+    xs: {
+      w: "0.75rem",
+      h: "0.75rem"
+    },
+    sm: {
+      w: "1rem",
+      h: "1rem"
+    },
+    md: {
+      w: "1.5rem",
+      h: "1.5rem"
+    },
+    lg: {
+      w: "2rem",
+      h: "2rem"
+    },
+    xl: {
+      w: "3rem",
+      h: "3rem"
     }
   },
-  sm: {
-    spinner: {
-      width: "1rem",
-      height: "1rem"
-    }
-  },
-  md: {
-    spinner: {
-      width: "1.5rem",
-      height: "1.5rem"
-    }
-  },
-  lg: {
-    spinner: {
-      width: "2rem",
-      height: "2rem"
-    }
-  },
-  xl: {
-    spinner: {
-      width: "3rem",
-      height: "3rem"
-    }
+  defaultProps: {
+    size: "md"
   }
-};
-var defaultProps = {
-  size: "md"
-};
-var spinner = {
-  register,
-  defaultProps,
-  sizes
-};
+});
 export default spinner;
 //# sourceMappingURL=spinner.js.map

dist/esm/components/stat.js

@@ -1,51 +0,46 @@
-var register = {
-  parts: ["label", "helpText", "number", "container", "icon"],
-  sizes: ["sm", "md", "lg"]
-};
-var baseStyle = {
-  container: {
-    flex: "1",
-    paddingRight: 4
+import { multiStyleConfig } from "@chakra-ui/theme-tools";
+var stat = multiStyleConfig({
+  parts: {
+    label: "the stat label",
+    number: "the numeric value of the stat",
+    icon: "the stat icon, if used",
+    helpText: "the stat description text"
   },
-  label: {
-    fontWeight: "medium"
-  },
-  helpText: {
-    opacity: 0.8,
-    marginBottom: 2
-  },
-  number: {
-    verticalAlign: "baseline",
-    fontWeight: "semibold"
-  },
-  icon: {
-    marginRight: 1,
-    width: "14px",
-    height: "14px",
-    verticalAlign: "middle"
-  }
-};
-var sizes = {
-  md: {
+  baseStyle: {
     label: {
-      fontSize: "sm"
+      fontWeight: "medium"
     },
     helpText: {
-      fontSize: "sm"
+      opacity: 0.8,
+      marginBottom: 2
     },
     number: {
-      fontSize: "2xl"
+      verticalAlign: "baseline",
+      fontWeight: "semibold"
+    },
+    icon: {
+      mr: 1,
+      w: "14px",
+      h: "14px",
+      verticalAlign: "middle"
     }
+  },
+  sizes: {
+    md: {
+      label: {
+        fontSize: "sm"
+      },
+      helpText: {
+        fontSize: "sm"
+      },
+      number: {
+        fontSize: "2xl"
+      }
+    }
+  },
+  defaultProps: {
+    size: "md"
   }
-};
-var defaultProps = {
-  size: "md"
-};
-var stat = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes
-};
+});
 export default stat;
 //# sourceMappingURL=stat.js.map

dist/esm/components/switch.js

@@ -1,90 +0,83 @@
-import { mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["track", "thumb"],
-  sizes: ["sm", "md", "lg"]
-};
-
-var baseStyle = props => {
-  var {
-    colorScheme: c
-  } = props;
-  return {
-    track: {
-      borderRadius: "full",
-      padding: "2px",
-      transition: "all 120ms",
-      bg: mode("gray.300", "whiteAlpha.400")(props),
-      _focus: {
-        boxShadow: "outline"
+import { mode, multiStyleConfig } from "@chakra-ui/theme-tools";
+var Switch = multiStyleConfig({
+  parts: {
+    track: "the switch outer track",
+    thumb: "the switch inner circle"
+  },
+  baseStyle: function baseStyle(props) {
+    var {
+      colorScheme: c
+    } = props;
+    return {
+      track: {
+        borderRadius: "full",
+        p: "2px",
+        transition: "all 120ms",
+        bg: mode("gray.300", "whiteAlpha.400")(props),
+        _focus: {
+          boxShadow: "outline"
+        },
+        _disabled: {
+          opacity: 0.4,
+          cursor: "not-allowed"
+        },
+        _checked: {
+          bg: mode(c + ".500", c + ".200")(props)
+        }
       },
-      _disabled: {
-        opacity: 0.4,
-        cursor: "not-allowed"
+      thumb: {
+        bg: "white",
+        transition: "transform 250ms",
+        borderRadius: "full",
+        transform: "translateX(0)"
+      }
+    };
+  },
+  sizes: {
+    sm: {
+      track: {
+        w: "1.375rem",
+        h: "0.75rem"
       },
-      _checked: {
-        bg: mode(c + ".500", c + ".200")(props)
+      thumb: {
+        w: "0.75rem",
+        h: "0.75rem",
+        _checked: {
+          transform: "translateX(0.625rem)"
+        }
       }
     },
-    thumb: {
-      bg: "white",
-      transition: "transform 250ms",
-      borderRadius: "full",
-      transform: "translateX(0)"
-    }
-  };
-};
-
-var sizes = {
-  sm: {
-    track: {
-      width: "1.375rem",
-      height: "0.75rem"
-    },
-    thumb: {
-      width: "0.75rem",
-      height: "0.75rem",
-      _checked: {
-        transform: "translateX(0.625rem)"
+    md: {
+      track: {
+        w: "1.875rem",
+        h: "1rem"
+      },
+      thumb: {
+        w: "1rem",
+        h: "1rem",
+        _checked: {
+          transform: "translateX(0.875rem)"
+        }
       }
-    }
-  },
-  md: {
-    track: {
-      width: "1.875rem",
-      height: "1rem"
     },
-    thumb: {
-      width: "1rem",
-      height: "1rem",
-      _checked: {
-        transform: "translateX(0.875rem)"
+    lg: {
+      track: {
+        w: "2.875rem",
+        h: "1.5rem"
+      },
+      thumb: {
+        w: "1.5rem",
+        h: "1.5rem",
+        _checked: {
+          transform: "translateX(1.375rem)"
+        }
       }
     }
   },
-  lg: {
-    track: {
-      width: "2.875rem",
-      height: "1.5rem"
-    },
-    thumb: {
-      width: "1.5rem",
-      height: "1.5rem",
-      _checked: {
-        transform: "translateX(1.375rem)"
-      }
-    }
+  defaultProps: {
+    size: "md",
+    colorScheme: "blue"
   }
-};
-var defaultProps = {
-  size: "md",
-  colorScheme: "blue"
-}; // can't use the `switch` here since it's a reserved keyword
-
-var _switch = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes
-};
-export default _switch;
+});
+export default Switch;
 //# sourceMappingURL=switch.js.map

dist/esm/components/tabs.js

@@ -1,187 +0,180 @@
-import { getColor, mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["tablist", "tab", "tabpanel", "indicator"],
-  sizes: ["sm", "md", "lg"],
-  variants: ["line", "enclosed", "soft-rounded", "enclosed-colored", "solid-rounded", "unstyled"]
-};
-var alignments = {
-  end: "flex-end",
-  center: "center",
-  start: "flex-start"
-};
-
-var baseStyle = props => {
-  var {
-    align = "start",
-    isFitted
-  } = props;
-  return {
-    tab: {
-      flex: isFitted ? 1 : undefined,
-      transition: "all 0.2s",
-      _focus: {
-        zIndex: 1,
-        boxShadow: "outline"
-      }
-    },
-    tablist: {
-      justifyContent: alignments[align]
-    },
-    tabpanel: {
-      padding: 4
-    }
-  };
-};
-
-var sizes = {
-  sm: {
-    tab: {
-      paddingY: "0.25rem",
-      paddingX: "1rem",
-      fontSize: "0.85rem"
-    }
+import { getColor, mode, multiStyleConfig } from "@chakra-ui/theme-tools";
+var tabs = multiStyleConfig({
+  parts: {
+    tablist: "the tab list or button group",
+    tab: "the tab button",
+    tabpanel: "the tab content",
+    indicator: "the active tab indicator"
   },
-  md: {
-    tab: {
-      fontSize: "1rem",
-      paddingY: "0.5rem",
-      paddingX: "1rem"
-    }
-  },
-  lg: {
-    tab: {
-      fontSize: "1.15rem",
-      paddingY: "0.75rem",
-      paddingX: "1rem"
-    }
-  }
-};
-var variants = {
-  line: function line(props) {
+  baseStyle: function baseStyle(props) {
     var {
-      colorScheme: c
+      align = "start",
+      isFitted
     } = props;
     return {
+      tab: {
+        flex: isFitted ? 1 : undefined,
+        transition: "all 0.2s",
+        _focus: {
+          zIndex: 1,
+          boxShadow: "outline"
+        }
+      },
       tablist: {
-        borderBottom: "2px solid",
-        borderColor: "inherit"
+        justifyContent: alignments[align]
       },
-      tab: {
-        borderBottom: "2px solid",
-        borderColor: "transparent",
-        marginBottom: "-2px",
-        _selected: {
-          color: mode(c + ".600", c + ".300")(props),
-          borderColor: "currentColor"
-        },
-        _active: {
-          bg: mode("gray.200", "whiteAlpha.300")(props)
-        },
-        _disabled: {
-          opacity: 0.4,
-          cursor: "not-allowed"
-        }
+      tabpanel: {
+        p: 4
       }
     };
   },
-  enclosed: function enclosed(props) {
-    var {
-      colorScheme: c
-    } = props;
-    return {
+  sizes: {
+    sm: {
       tab: {
-        borderTopRadius: "md",
-        border: "1px solid",
-        borderColor: "transparent",
-        marginBottom: "-1px",
-        _selected: {
-          color: mode(c + ".600", c + ".300")(props),
-          borderColor: "inherit",
-          borderBottomColor: mode("white", "gray.800")(props)
-        }
-      },
-      tablist: {
-        marginBottom: "-1px",
-        borderBottom: "1px solid",
-        borderColor: "inherit"
+        py: "0.25rem",
+        px: "1rem",
+        fontSize: "0.85rem"
       }
-    };
+    },
+    md: {
+      tab: {
+        fontSize: "1rem",
+        py: "0.5rem",
+        px: "1rem"
+      }
+    },
+    lg: {
+      tab: {
+        fontSize: "1.15rem",
+        py: "0.75rem",
+        px: "1rem"
+      }
+    }
   },
-  "enclosed-colored": function enclosedColored(props) {
-    var {
-      colorScheme: c
-    } = props;
-    return {
-      tab: {
-        border: "1px solid",
-        borderColor: "inherit",
-        bg: mode("gray.50", "whiteAlpha.50")(props),
-        marginBottom: "-1px",
-        _notLast: {
-          mr: "-1px"
+  variants: {
+    line: function line(props) {
+      var {
+        colorScheme: c
+      } = props;
+      return {
+        tablist: {
+          borderBottom: "2px solid",
+          borderColor: "inherit"
         },
-        _selected: {
-          bg: mode("#fff", "gray.800")(props),
-          color: mode(c + ".600", c + ".300")(props),
+        tab: {
+          borderBottom: "2px solid",
+          borderColor: "transparent",
+          mb: "-2px",
+          _selected: {
+            color: mode(c + ".600", c + ".300")(props),
+            borderColor: "currentColor"
+          },
+          _active: {
+            bg: mode("gray.200", "whiteAlpha.300")(props)
+          },
+          _disabled: {
+            opacity: 0.4,
+            cursor: "not-allowed"
+          }
+        }
+      };
+    },
+    enclosed: function enclosed(props) {
+      var {
+        colorScheme: c
+      } = props;
+      return {
+        tab: {
+          borderTopRadius: "md",
+          border: "1px solid",
+          borderColor: "transparent",
+          mb: "-1px",
+          _selected: {
+            color: mode(c + ".600", c + ".300")(props),
+            borderColor: "inherit",
+            borderBottomColor: mode("white", "gray.800")(props)
+          }
+        },
+        tablist: {
+          mb: "-1px",
+          borderBottom: "1px solid",
+          borderColor: "inherit"
+        }
+      };
+    },
+    "enclosed-colored": function enclosedColored(props) {
+      var {
+        colorScheme: c
+      } = props;
+      return {
+        tab: {
+          border: "1px solid",
           borderColor: "inherit",
-          borderTopColor: "currentColor",
-          borderBottomColor: "transparent"
+          bg: mode("gray.50", "whiteAlpha.50")(props),
+          mb: "-1px",
+          _notLast: {
+            mr: "-1px"
+          },
+          _selected: {
+            bg: mode("#fff", "gray.800")(props),
+            color: mode(c + ".600", c + ".300")(props),
+            borderColor: "inherit",
+            borderTopColor: "currentColor",
+            borderBottomColor: "transparent"
+          }
+        },
+        tablist: {
+          mb: "-1px",
+          borderBottom: "1px solid",
+          borderColor: "inherit"
         }
-      },
-      tablist: {
-        marginBottom: "-1px",
-        borderBottom: "1px solid",
-        borderColor: "inherit"
-      }
-    };
-  },
-  "soft-rounded": function softRounded(props) {
-    var {
-      colorScheme: c,
-      theme
-    } = props;
-    return {
-      tab: {
-        borderRadius: "full",
-        fontWeight: "semibold",
-        color: "gray.600",
-        _selected: {
-          color: getColor(theme, c + ".700"),
-          bg: getColor(theme, c + ".100")
+      };
+    },
+    "soft-rounded": function softRounded(props) {
+      var {
+        colorScheme: c,
+        theme
+      } = props;
+      return {
+        tab: {
+          borderRadius: "full",
+          fontWeight: "semibold",
+          color: "gray.600",
+          _selected: {
+            color: getColor(theme, c + ".700"),
+            bg: getColor(theme, c + ".100")
+          }
         }
-      },
-      tablist: {}
-    };
-  },
-  "solid-rounded": function solidRounded(props) {
-    var {
-      colorScheme: c
-    } = props;
-    return {
-      tab: {
-        borderRadius: "full",
-        fontWeight: "semibold",
-        color: mode("gray.600", "inherit")(props),
-        _selected: {
-          color: mode("#fff", "gray.800")(props),
-          bg: mode(c + ".600", c + ".300")(props)
+      };
+    },
+    "solid-rounded": function solidRounded(props) {
+      var {
+        colorScheme: c
+      } = props;
+      return {
+        tab: {
+          borderRadius: "full",
+          fontWeight: "semibold",
+          color: mode("gray.600", "inherit")(props),
+          _selected: {
+            color: mode("#fff", "gray.800")(props),
+            bg: mode(c + ".600", c + ".300")(props)
+          }
         }
-      }
-    };
+      };
+    },
+    unstyled: {}
   },
-  unstyled: {}
+  defaultProps: {
+    size: "md",
+    variant: "line",
+    colorScheme: "blue"
+  }
+});
+var alignments = {
+  end: "flex-end",
+  center: "center",
+  start: "flex-start"
 };
-var defaultProps = {
-  size: "md",
-  variant: "line",
-  colorScheme: "blue"
-};
-var tabs = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes,
-  variants
-};
 export default tabs;
 //# sourceMappingURL=tabs.js.map

dist/esm/components/tag.js

@@ -0,82 +1,103 @@
+import { multiStyleConfig } from "@chakra-ui/theme-tools";
 import badge from "./badge";
-var register = {
-  parts: ["container", "label", "closeButton"],
-  sizes: ["sm", "md", "lg"],
-  variants: badge.register.variants
-};
-var baseStyle = {
-  container: {
-    outline: 0,
-    _focus: {
-      boxShadow: "outline"
+var tag = multiStyleConfig({
+  parts: {
+    container: "the tag container",
+    label: "the tag inner text",
+    closeButton: "the close button"
+  },
+  baseStyle: {
+    container: {
+      fontWeight: "medium",
+      lineHeight: 1.2,
+      outline: 0,
+      _focus: {
+        boxShadow: "outline"
+      }
+    },
+    label: {
+      lineHeight: 1.2
+    },
+    closeButton: {
+      fontSize: "18px",
+      w: "1.25rem",
+      h: "1.25rem",
+      borderRadius: "sm",
+      ml: "0.375rem",
+      mr: "-1",
+      opacity: 0.5,
+      _disabled: {
+        opacity: 0.4
+      },
+      _focus: {
+        boxShadow: "outline",
+        bg: "rgba(0, 0, 0, 0.14)"
+      },
+      _hover: {
+        opacity: 0.8
+      },
+      _active: {
+        opacity: 1
+      }
     }
   },
-  label: {
-    lineHeight: 1.2
-  },
-  closeButton: {
-    fontSize: "1em",
-    width: "1.25rem",
-    height: "1.25rem",
-    borderRadius: "sm",
-    marginLeft: "0.375rem",
-    opacity: 0.5,
-    _disabled: {
-      opacity: 0.4
+  sizes: {
+    sm: {
+      container: {
+        minH: "1.25rem",
+        minW: "1.25rem",
+        fontSize: "xs",
+        px: 1,
+        borderRadius: "sm"
+      }
     },
-    _focus: {
-      boxShadow: "outline",
-      bg: "rgba(0, 0, 0, 0.14)"
+    md: {
+      container: {
+        minH: "1.5rem",
+        minW: "1.5rem",
+        fontSize: "sm",
+        borderRadius: "md",
+        px: 2
+      }
     },
-    _hover: {
-      opacity: 0.8
-    },
-    _active: {
-      opacity: 1
+    lg: {
+      container: {
+        minH: 8,
+        minW: 8,
+        fontSize: "md",
+        borderRadius: "md",
+        px: 3
+      }
     }
-  }
-};
-var sizes = {
-  sm: {
-    container: {
-      minHeight: "1.25rem",
-      minWidth: "1.25rem",
-      fontSize: "xs",
-      paddingX: 1,
-      borderRadius: "sm"
-    }
   },
-  md: {
-    container: {
-      minHeight: "1.5rem",
-      minWidth: "1.5rem",
-      fontSize: "sm",
-      borderRadius: "md",
-      paddingX: 2
+  variants: {
+    subtle: function subtle(props) {
+      var _badge$variants;
+
+      return {
+        container: (_badge$variants = badge.variants) == null ? void 0 : _badge$variants.subtle(props)
+      };
+    },
+    solid: function solid(props) {
+      var _badge$variants2;
+
+      return {
+        container: (_badge$variants2 = badge.variants) == null ? void 0 : _badge$variants2.solid(props)
+      };
+    },
+    outline: function outline(props) {
+      var _badge$variants3;
+
+      return {
+        container: (_badge$variants3 = badge.variants) == null ? void 0 : _badge$variants3.outline(props)
+      };
     }
   },
-  lg: {
-    container: {
-      minHeight: 8,
-      minWidth: 8,
-      fontSize: "md",
-      borderRadius: "md",
-      paddingX: 3
-    }
+  defaultProps: {
+    size: "lg",
+    variant: "subtle",
+    colorScheme: "gray"
   }
-};
-var variants = badge.variants;
-var defaultProps = {
-  size: "lg",
-  variant: "subtle",
-  colorScheme: "gray"
-};
-var tag = {
-  register,
-  defaultProps,
-  baseStyle,
-  sizes,
-  variants
-};
+});
 export default tag;
 //# sourceMappingURL=tag.js.map

dist/esm/components/textarea.js

@@ -0,23 +1,42 @@
+var _input$baseStyle, _input$sizes, _input$sizes2, _input$sizes3, _input$variants4;
+
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
+import { styleConfig } from "@chakra-ui/theme-tools";
 import input from "./input";
-var register = {
-  parts: ["field"],
-  variants: input.register.variants,
-  sizes: input.register.sizes
-};
-var baseStyle = {
-  field: _extends({}, input.baseStyle.field, {
+var textarea = styleConfig({
+  baseStyle: _extends({}, (_input$baseStyle = input.baseStyle) == null ? void 0 : _input$baseStyle.field, {
     paddingY: "8px",
     minHeight: "80px",
     lineHeight: "short"
-  })
-};
+  }),
+  sizes: {
+    sm: (_input$sizes = input.sizes) == null ? void 0 : _input$sizes.sm.field,
+    md: (_input$sizes2 = input.sizes) == null ? void 0 : _input$sizes2.md.field,
+    lg: (_input$sizes3 = input.sizes) == null ? void 0 : _input$sizes3.lg.field
+  },
+  variants: {
+    outline: props => {
+      var _input$variants$outli, _input$variants, _input$variants$outli2;
 
-var textarea = _extends({}, input, {
-  register,
-  baseStyle
+      return (_input$variants$outli = (_input$variants = input.variants) == null ? void 0 : (_input$variants$outli2 = _input$variants.outline(props)) == null ? void 0 : _input$variants$outli2.field) != null ? _input$variants$outli : {};
+    },
+    flushed: props => {
+      var _input$variants$flush, _input$variants2, _input$variants2$flus;
+
+      return (_input$variants$flush = (_input$variants2 = input.variants) == null ? void 0 : (_input$variants2$flus = _input$variants2.flushed(props)) == null ? void 0 : _input$variants2$flus.field) != null ? _input$variants$flush : {};
+    },
+    filled: props => {
+      var _input$variants$fille, _input$variants3;
+
+      return (_input$variants$fille = (_input$variants3 = input.variants) == null ? void 0 : _input$variants3.filled(props).field) != null ? _input$variants$fille : {};
+    },
+    unstyled: (_input$variants4 = input.variants) == null ? void 0 : _input$variants4.unstyled.field
+  },
+  defaultProps: {
+    size: "md",
+    variant: "outline"
+  }
 });
-
 export default textarea;
 //# sourceMappingURL=textarea.js.map

dist/esm/components/tooltip.js

@@ -1,11 +0,7 @@
-import { mode } from "@chakra-ui/theme-tools";
-var register = {
-  parts: ["arrow", "container"]
-};
-
-var baseStyle = props => {
-  return {
-    container: {
-      paddingX: "8px",
-      paddingY: "2px",
+import { mode, styleConfig } from "@chakra-ui/theme-tools";
+var tooltip = styleConfig({
+  baseStyle: function baseStyle(props) {
+    return {
+      px: "8px",
+      py: "2px",
       bg: mode("gray.700", "gray.300")(props),
@@ -18,43 +14,7 @@ color: mode("whiteAlpha.900", "gray.900")(props),
       boxShadow: "md",
-      maxWidth: "320px"
-    }
-  };
-};
-
-var transition = {
-  container: {
-    timeout: 120,
-    transition: {
-      easing: "ease-in-out",
-      duration: "120ms",
-      property: "common"
-    },
-    enter: {
-      from: {
-        opacity: 0.01,
-        transform: "scale(0.9)"
-      },
-      to: {
-        opacity: 1,
-        transform: "scale(1)"
-      }
-    },
-    exit: {
-      from: {
-        opacity: 1,
-        transform: "scale(1)"
-      },
-      to: {
-        opacity: 0.01,
-        transform: "scale(0.9)"
-      }
-    }
+      maxW: "320px"
+    };
   }
-};
-var tooltip = {
-  register,
-  baseStyle,
-  transition
-};
+});
 export default tooltip;
 //# sourceMappingURL=tooltip.js.map

dist/esm/foundations/breakpoints.js

@@ -1,8 +0,15 @@
-var breakpoints = {
-  sm: "30em",
-  md: "48em",
-  lg: "62em",
-  xl: "80em"
-};
+/**
+ * Breakpoints for responsive design
+ */
+var breakpoints = ["30em", "48em", "62em", "80em"];
+/**
+ * This is needed for object responsive breakpoints to work.
+ * At the moment, we require the keys to be `sm`, `md`, `lg` and `xl`
+ */
+
+breakpoints.sm = breakpoints[0];
+breakpoints.md = breakpoints[1];
+breakpoints.lg = breakpoints[2];
+breakpoints.xl = breakpoints[3];
 export default breakpoints;
 //# sourceMappingURL=breakpoints.js.map

dist/esm/foundations/shadows.js

 var shadows = {
-  sm: "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
+  xs: "0 0 0 1px rgba(0, 0, 0, 0.05)",
+  sm: "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
+  base: "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)",
   md: "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
-  "dark-lg": "rgba(0, 0, 0, 0.1) 0px 0px 0px 1px, rgba(0, 0, 0, 0.2) 0px 5px 10px, rgba(0, 0, 0, 0.4) 0px 15px 40px",
   lg: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
@@ -10,5 +11,6 @@ xl: "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
   inner: "inset 0 2px 4px 0 rgba(0,0,0,0.06)",
-  none: "none"
+  none: "none",
+  "dark-lg": "rgba(0, 0, 0, 0.1) 0px 0px 0px 1px, rgba(0, 0, 0, 0.2) 0px 5px 10px, rgba(0, 0, 0, 0.4) 0px 15px 40px"
 };
 export default shadows;
 //# sourceMappingURL=shadows.js.map

dist/esm/foundations/sizes.js

@@ -37,3 +37,4 @@ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
   "5xl": "64rem",
-  "6xl": "72rem"
+  "6xl": "72rem",
+  "7xl": "80rem"
 };
@@ -40,0 +41,0 @@ var container = {

dist/esm/foundations/typography.js

@@ -12,8 +12,16 @@ var typography = {
     normal: "normal",
-    none: "1",
-    shorter: "1.25",
-    short: "1.375",
-    base: "1.5",
-    tall: "1.625",
-    taller: "2"
+    none: 1,
+    shorter: 1.25,
+    short: 1.375,
+    base: 1.5,
+    tall: 1.625,
+    taller: "2",
+    "3": ".75rem",
+    "4": "1rem",
+    "5": "1.25rem",
+    "6": "1.5rem",
+    "7": "1.75rem",
+    "8": "2rem",
+    "9": "2.25rem",
+    "10": "2.5rem"
   },
@@ -20,0 +28,0 @@ fontWeights: {

dist/esm/index.js

@@ -6,6 +6,6 @@ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import styles from "./styles";
+
 /**
  * Color mode config
  */
-
 var config = {
@@ -12,0 +12,0 @@ useSystemColorMode: false,

dist/types/components/accordion.d.ts

@@ -1,6 +0,35 @@
-declare const accordion: {
-    register: {
-        readonly parts: readonly ["container", "item", "button", "panel"];
+declare const accordion: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    container: string;
+    button: string;
+    panel: string;
+}, {
+    container: {
+        borderTopWidth: string;
+        borderColor: string;
+        _last: {
+            borderBottomWidth: string;
+        };
     };
-    baseStyle: {
+    button: {
+        fontSize: string;
+        _focus: {
+            boxShadow: string;
+        };
+        _hover: {
+            bg: string;
+        };
+        _disabled: {
+            opacity: number;
+            cursor: string;
+        };
+        px: number;
+        py: number;
+    };
+    panel: {
+        pt: number;
+        px: number;
+        pb: number;
+    };
+}, {
+    [value: string]: {
         container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -51,3 +80,3 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
-        item?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        button?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
             _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
@@ -97,2 +126,93 @@ _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        panel?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    } | ((props: Record<string, any>) => {
+        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         button?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -188,4 +308,284 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+    }) | undefined;
+}, {
+    [value: string]: {
+        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        button?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        panel?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    } | ((props: Record<string, any>) => {
+        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        button?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        panel?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: string | number | undefined;
+        colorScheme?: string | undefined;
     };
 };
 export default accordion;

dist/types/components/alert.d.ts

@@ -1,12 +0,21 @@
-import { DefaultProps, Variants } from "@chakra-ui/theme-tools";
-declare const alert: {
-    register: {
-        readonly parts: readonly ["container", "title", "icon"];
-        readonly variants: readonly ["subtle", "left-accent", "top-accent", "solid"];
+declare const alert: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    container: string;
+    title: string;
+    icon: string;
+}, {
+    container: {
+        px: number;
+        py: number;
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["container", "title", "icon"];
-        readonly variants: readonly ["subtle", "left-accent", "top-accent", "solid"];
-    }>;
-    baseStyle: {
+    title: {
+        fontWeight: string;
+        lineHeight: string;
+    };
+    icon: {
+        mr: number;
+        w: number;
+        h: number;
+    };
+}, {
+    [value: string]: {
         container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -57,2 +66,47 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        title?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         icon?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -103,2 +157,48 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+    } | ((props: Record<string, any>) => {
+        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         title?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -149,8 +249,92 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        icon?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    }) | undefined;
+}, {
+    subtle: (props: Record<string, any>) => {
+        container: {
+            bg: any;
+        };
+        icon: {
+            color: any;
+        };
     };
-    variants: Variants<{
-        readonly parts: readonly ["container", "title", "icon"];
-        readonly variants: readonly ["subtle", "left-accent", "top-accent", "solid"];
-    }>;
+    "left-accent": (props: Record<string, any>) => {
+        container: {
+            pl: number;
+            borderLeft: string;
+            borderColor: any;
+            bg: any;
+        };
+        icon: {
+            color: any;
+        };
+    };
+    "top-accent": (props: Record<string, any>) => {
+        container: {
+            pt: number;
+            borderTop: string;
+            borderColor: any;
+            bg: any;
+        };
+        icon: {
+            color: any;
+        };
+    };
+    solid: (props: Record<string, any>) => {
+        container: {
+            bg: any;
+            color: any;
+        };
+    };
+}> & {
+    propTypes: {
+        variant?: "solid" | "subtle" | "left-accent" | "top-accent" | undefined;
+        size?: string | number | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default alert;

dist/types/components/avatar.d.ts

@@ -1,12 +0,145 @@
-import { DefaultProps, Sizes } from "@chakra-ui/theme-tools";
-declare const avatar: {
-    register: {
-        readonly parts: readonly ["container", "excessLabel", "badge", "label"];
-        readonly sizes: readonly ["2xs", "xs", "sm", "md", "lg", "xl", "2xl", "full"];
+declare const avatar: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    container: string;
+    excessLabel: string;
+    badge: string;
+    label: string;
+}, (props: Record<string, any>) => {
+    badge: {
+        transform: string;
+        borderRadius: string;
+        border: string;
+        borderColor: any;
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["container", "excessLabel", "badge", "label"];
-        readonly sizes: readonly ["2xs", "xs", "sm", "md", "lg", "xl", "2xl", "full"];
-    }>;
-    baseStyle: (props: any) => {
+    excessLabel: {
+        bg: any;
+    };
+    container: {
+        bg: string;
+        color: string;
+        borderColor: any;
+        verticalAlign: string;
+    };
+}, {
+    "2xs": {
+        container: {
+            width: string;
+            height: string;
+            fontSize: string;
+        };
+        excessLabel: {
+            width: string;
+            height: string;
+        };
+        label: {
+            fontSize: string;
+            lineHeight: any;
+        };
+    };
+    xs: {
+        container: {
+            width: string;
+            height: string;
+            fontSize: string;
+        };
+        excessLabel: {
+            width: string;
+            height: string;
+        };
+        label: {
+            fontSize: string;
+            lineHeight: any;
+        };
+    };
+    sm: {
+        container: {
+            width: string;
+            height: string;
+            fontSize: string;
+        };
+        excessLabel: {
+            width: string;
+            height: string;
+        };
+        label: {
+            fontSize: string;
+            lineHeight: any;
+        };
+    };
+    md: {
+        container: {
+            width: string;
+            height: string;
+            fontSize: string;
+        };
+        excessLabel: {
+            width: string;
+            height: string;
+        };
+        label: {
+            fontSize: string;
+            lineHeight: any;
+        };
+    };
+    lg: {
+        container: {
+            width: string;
+            height: string;
+            fontSize: string;
+        };
+        excessLabel: {
+            width: string;
+            height: string;
+        };
+        label: {
+            fontSize: string;
+            lineHeight: any;
+        };
+    };
+    xl: {
+        container: {
+            width: string;
+            height: string;
+            fontSize: string;
+        };
+        excessLabel: {
+            width: string;
+            height: string;
+        };
+        label: {
+            fontSize: string;
+            lineHeight: any;
+        };
+    };
+    "2xl": {
+        container: {
+            width: string;
+            height: string;
+            fontSize: string;
+        };
+        excessLabel: {
+            width: string;
+            height: string;
+        };
+        label: {
+            fontSize: string;
+            lineHeight: any;
+        };
+    };
+    full: {
+        container: {
+            width: string;
+            height: string;
+            fontSize: string;
+        };
+        excessLabel: {
+            width: string;
+            height: string;
+        };
+        label: {
+            fontSize: string;
+            lineHeight: any;
+        };
+    };
+}, {
+    [value: string]: {
         container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -192,8 +325,191 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+    } | ((props: Record<string, any>) => {
+        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        excessLabel?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        badge?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        label?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | "2xs" | "xs" | "sm" | "lg" | "xl" | "2xl" | "full" | undefined;
+        colorScheme?: string | undefined;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["container", "excessLabel", "badge", "label"];
-        readonly sizes: readonly ["2xs", "xs", "sm", "md", "lg", "xl", "2xl", "full"];
-    }>;
 };
 export default avatar;

dist/types/components/badge.d.ts

@@ -1,63 +0,73 @@
-import { DefaultProps, Variants } from "@chakra-ui/theme-tools";
-declare const Badge: {
-    register: {
-        readonly parts: readonly ["container"];
-        readonly variants: readonly ["solid", "subtle", "outline"];
+declare const badge: import("@chakra-ui/theme-tools").StyleConfig<{
+    paddingX: number;
+    textTransform: string;
+    fontSize: string;
+    borderRadius: string;
+    fontWeight: string;
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}, {
+    solid: (props: Record<string, any>) => {
+        bg: any;
+        color: any;
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["container"];
-        readonly variants: readonly ["solid", "subtle", "outline"];
-    }>;
-    baseStyle: {
-        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
+    subtle: (props: Record<string, any>) => {
+        bg: any;
+        color: any;
     };
-    variants: Variants<{
-        readonly parts: readonly ["container"];
-        readonly variants: readonly ["solid", "subtle", "outline"];
-    }>;
+    outline: (props: Record<string, any>) => {
+        color: any;
+        boxShadow: string;
+    };
+}> & {
+    propTypes: {
+        variant?: "solid" | "outline" | "subtle" | undefined;
+        size?: string | number | undefined;
+        colorScheme?: string | undefined;
+    };
 };
-export default Badge;
+export default badge;

dist/types/components/breadcumb.d.ts

@@ -1,7 +0,21 @@
-declare const Breadcrumb: {
-    register: {
-        readonly parts: readonly ["container", "link", "separator"];
+declare const breadcrumb: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    link: string;
+    separator: string;
+}, {
+    link: {
+        transition: string;
+        cursor: string;
+        textDecoration: string;
+        outline: string;
+        color: string;
+        _hover: {
+            textDecoration: string;
+        };
+        _focus: {
+            boxShadow: string;
+        };
     };
-    baseStyle: {
-        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+}, {
+    [value: string]: {
+        link?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
             _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
@@ -51,2 +65,48 @@ _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        separator?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    } | ((props: Record<string, any>) => {
         link?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -142,4 +202,194 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+    }) | undefined;
+}, {
+    [value: string]: {
+        link?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        separator?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    } | ((props: Record<string, any>) => {
+        link?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        separator?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: string | number | undefined;
+        colorScheme?: string | undefined;
     };
 };
-export default Breadcrumb;
+export default breadcrumb;

dist/types/components/button.d.ts

@@ -1,4 +0,40 @@
-import { DefaultProps, Props, Sizes } from "@chakra-ui/theme-tools";
-declare function ghost(props: Props): {
-    container: {
+declare const button: import("@chakra-ui/theme-tools").StyleConfig<{
+    lineHeight: string;
+    borderRadius: string;
+    fontWeight: string;
+    _focus: {
+        boxShadow: string;
+    };
+    _disabled: {
+        opacity: number;
+        cursor: string;
+        boxShadow: string;
+    };
+}, {
+    lg: {
+        h: number;
+        minW: number;
+        fontSize: string;
+        px: number;
+    };
+    md: {
+        h: number;
+        minW: number;
+        fontSize: string;
+        px: number;
+    };
+    sm: {
+        h: number;
+        minW: number;
+        fontSize: string;
+        px: number;
+    };
+    xs: {
+        h: number;
+        minW: number;
+        fontSize: string;
+        px: number;
+    };
+}, {
+    ghost: (props: Record<string, any>) => {
         color: any;
@@ -11,5 +47,4 @@ _hover: {
         };
-    };
-} | {
-    container: {
+        bg?: undefined;
+    } | {
         color: any;
@@ -24,5 +59,3 @@ bg: string;
     };
-};
-declare function outline(props: Props): {
-    container: {
+    outline: (props: Record<string, any>) => {
         color: any;
@@ -35,2 +68,3 @@ _hover: {
         };
+        bg?: undefined;
         border: string;
@@ -50,5 +84,3 @@ borderColor: any;
     };
-};
-declare function solid(props: Props): {
-    container: {
+    solid: (props: Record<string, any>) => {
         bg: any;
@@ -61,5 +93,4 @@ _hover: {
         };
-    };
-} | {
-    container: {
+        color?: undefined;
+    } | {
         bg: any;
@@ -74,5 +105,3 @@ color: any;
     };
-};
-declare function link(props: Props): {
-    container: {
+    link: (props: Record<string, any>) => {
         padding: number;
@@ -89,175 +118,17 @@ height: string;
     };
-};
-declare const Button: {
-    register: {
-        readonly parts: readonly ["container", "icon", "spinner"];
-        readonly sizes: readonly ["sm", "md", "lg", "xs"];
-        readonly variants: readonly ["solid", "outline", "ghost", "unstyled"];
+    unstyled: {
+        bg: string;
+        color: string;
+        display: string;
+        lineHeight: string;
+        m: number;
+        p: number;
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["container", "icon", "spinner"];
-        readonly sizes: readonly ["sm", "md", "lg", "xs"];
-        readonly variants: readonly ["solid", "outline", "ghost", "unstyled"];
-    }>;
-    baseStyle: {
-        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-        icon?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-        spinner?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
+}> & {
+    propTypes: {
+        variant?: "solid" | "outline" | "ghost" | "link" | "unstyled" | undefined;
+        size?: "md" | "xs" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["container", "icon", "spinner"];
-        readonly sizes: readonly ["sm", "md", "lg", "xs"];
-        readonly variants: readonly ["solid", "outline", "ghost", "unstyled"];
-    }>;
-    variants: {
-        unstyled: {
-            container: {
-                bg: string;
-                border: number;
-                color: string;
-                display: string;
-                font: string;
-                lineHeight: string;
-                margin: number;
-                padding: number;
-            };
-        };
-        solid: typeof solid;
-        ghost: typeof ghost;
-        link: typeof link;
-        outline: typeof outline;
-    };
 };
-export default Button;
+export default button;

dist/types/components/checkbox.d.ts

@@ -1,13 +0,84 @@
-import { DefaultProps, Sizes } from "@chakra-ui/theme-tools";
-declare const checkbox: {
-    register: {
-        readonly parts: readonly ["control", "label", "description", "icon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
+declare const checkbox: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    control: string;
+    label: string;
+    description: string;
+    icon: string;
+}, (props: Record<string, any>) => {
+    control: {
+        w: string;
+        transition: string;
+        border: string;
+        borderRadius: string;
+        borderColor: string;
+        color: string;
+        _checked: {
+            bg: any;
+            borderColor: any;
+            color: any;
+            _hover: {
+                bg: any;
+                borderColor: any;
+            };
+            _disabled: {
+                borderColor: any;
+                bg: any;
+                color: any;
+            };
+        };
+        _indeterminate: {
+            bg: any;
+            borderColor: any;
+            color: any;
+        };
+        _disabled: {
+            bg: any;
+            borderColor: any;
+        };
+        _focus: {
+            boxShadow: string;
+        };
+        _invalid: {
+            borderColor: any;
+        };
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["control", "label", "description", "icon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
-    baseStyle: (props: any) => {
-        icon?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+    label: {
+        userSelect: string;
+        _disabled: {
+            opacity: number;
+        };
+    };
+    icon: {
+        fontSize: string;
+    };
+}, {
+    sm: {
+        control: {
+            h: number;
+            w: number;
+        };
+        label: {
+            fontSize: string;
+        };
+    };
+    md: {
+        control: {
+            w: number;
+            h: number;
+        };
+        label: {
+            fontSize: string;
+        };
+    };
+    lg: {
+        control: {
+            w: number;
+            h: number;
+        };
+        label: {
+            fontSize: string;
+        };
+    };
+}, {
+    [value: string]: {
+        control?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
             _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
@@ -102,2 +173,93 @@ _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        description?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        icon?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    } | ((props: Record<string, any>) => {
         control?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -148,2 +310,47 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        label?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         description?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -194,8 +401,55 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        icon?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["control", "label", "description", "icon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
 };
 export default checkbox;

dist/types/components/close-button.d.ts

@@ -1,108 +0,87 @@
-import { DefaultProps, Sizes } from "@chakra-ui/theme-tools";
-declare const closeButton: {
-    register: {
-        readonly parts: readonly ["icon", "container"];
-        readonly sizes: readonly ["sm", "md", "lg"];
+declare const closeButton: import("@chakra-ui/theme-tools").StyleConfig<(props: Record<string, any>) => {
+    borderRadius: string;
+    transition: string;
+    _disabled: {
+        opacity: number;
+        cursor: string;
+        boxShadow: string;
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["icon", "container"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
-    baseStyle: (props: any) => {
-        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-        icon?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
+    _hover: {
+        bg: any;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["icon", "container"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
+    _active: {
+        bg: any;
+    };
+    _focus: {
+        boxShadow: string;
+    };
+}, {
+    lg: {
+        w: string;
+        h: string;
+        fontSize: string;
+    };
+    md: {
+        w: string;
+        h: string;
+        fontSize: string;
+    };
+    sm: {
+        w: string;
+        h: string;
+        fontSize: string;
+    };
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default closeButton;

dist/types/components/code.d.ts

@@ -1,62 +0,72 @@
-declare const code: {
-    register: {
-        readonly parts: readonly ["container"];
-        readonly variants: readonly ["solid", "subtle", "outline"];
+declare const code: import("@chakra-ui/theme-tools").StyleConfig<{
+    fontFamily: string;
+    fontSize: string;
+    px: string;
+    borderRadius: string;
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}, {
+    solid: (props: Record<string, any>) => {
+        bg: any;
+        color: any;
     };
-    defaultProps: import("@chakra-ui/theme-tools").DefaultProps<{
-        readonly parts: readonly ["container"];
-        readonly variants: readonly ["solid", "subtle", "outline"];
-    }>;
-    baseStyle: {
-        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
+    subtle: (props: Record<string, any>) => {
+        bg: any;
+        color: any;
     };
-    variants: import("@chakra-ui/theme-tools").Variants<{
-        readonly parts: readonly ["container"];
-        readonly variants: readonly ["solid", "subtle", "outline"];
-    }>;
+    outline: (props: Record<string, any>) => {
+        color: any;
+        boxShadow: string;
+    };
+}> & {
+    propTypes: {
+        variant?: "solid" | "outline" | "subtle" | undefined;
+        size?: string | number | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default code;

dist/types/components/drawer.d.ts

@@ -1,12 +0,147 @@
-import { DefaultProps, Sizes } from "@chakra-ui/theme-tools";
-declare const modal: {
-    register: {
-        readonly parts: readonly ["overlay", "content", "header", "body", "footer"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "full"];
+declare const drawer: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    overlay: string;
+    content: string;
+    header: string;
+    body: string;
+    footer: string;
+}, (props: Record<string, any>) => {
+    overlay: {
+        bg: string;
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["overlay", "content", "header", "body", "footer"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "full"];
-    }>;
-    baseStyle: (props: any) => {
+    content: {
+        bg: any;
+        color: string;
+        boxShadow: any;
+        height: string;
+    };
+    header: {
+        px: number;
+        py: number;
+        fontSize: string;
+        fontWeight: string;
+    };
+    body: {
+        px: number;
+        py: number;
+        flex: number;
+        overflow: string;
+    };
+    footer: {
+        px: number;
+        py: number;
+    };
+}, {
+    xs: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    sm: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    md: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    lg: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    xl: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    full: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+}, {
+    [value: string]: {
+        overlay?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         content?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -57,2 +192,138 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        header?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        body?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        footer?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    } | ((props: Record<string, any>) => {
         overlay?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -103,2 +374,47 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        content?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         header?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -239,8 +555,10 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | "xs" | "sm" | "lg" | "xl" | "full" | undefined;
+        colorScheme?: string | undefined;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["overlay", "content", "header", "body", "footer"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "full"];
-    }>;
 };
-export default modal;
+export default drawer;

dist/types/components/editable.d.ts

@@ -1,143 +0,397 @@
-declare const editable: {
-    register: {
-        readonly parts: readonly ["container", "preview", "input"];
+declare const editable: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    preview: string;
+    input: string;
+}, {
+    preview: {
+        borderRadius: string;
+        py: string;
+        transition: string;
     };
-    baseStyle: {
-        container?: import("@chakra-ui/system").SystemCSSProperties | import("@chakra-ui/system").CSSPseudoStyles | import("@chakra-ui/system").CSSSelectorStyles | import("@chakra-ui/system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/system").SystemCSSProperties & {
+    input: {
+        borderRadius: string;
+        py: string;
+        transition: string;
+        width: string;
+        _focus: {
+            boxShadow: string;
+        };
+        _placeholder: {
+            opacity: number;
+        };
+    };
+}, {
+    [value: string]: {
+        preview?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
                 content?: string | undefined;
             }) | undefined;
-            _after?: (import("@chakra-ui/system").SystemCSSProperties & {
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
                 content?: string | undefined;
             }) | undefined;
-            _empty?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
-        preview?: import("@chakra-ui/system").SystemCSSProperties | import("@chakra-ui/system").CSSPseudoStyles | import("@chakra-ui/system").CSSSelectorStyles | import("@chakra-ui/system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/system").SystemCSSProperties & {
+        input?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
                 content?: string | undefined;
             }) | undefined;
-            _after?: (import("@chakra-ui/system").SystemCSSProperties & {
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
                 content?: string | undefined;
             }) | undefined;
-            _empty?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
-        input?: import("@chakra-ui/system").SystemCSSProperties | import("@chakra-ui/system").CSSPseudoStyles | import("@chakra-ui/system").CSSSelectorStyles | import("@chakra-ui/system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/system").SystemCSSProperties & {
+    } | ((props: Record<string, any>) => {
+        preview?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
                 content?: string | undefined;
             }) | undefined;
-            _after?: (import("@chakra-ui/system").SystemCSSProperties & {
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
                 content?: string | undefined;
             }) | undefined;
-            _empty?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        input?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    }) | undefined;
+}, {
+    [value: string]: {
+        preview?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        input?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    } | ((props: Record<string, any>) => {
+        preview?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        input?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: string | number | undefined;
+        colorScheme?: string | undefined;
     };
 };
 export default editable;

dist/types/components/heading.d.ts

@@ -1,63 +0,77 @@
-import { DefaultProps, Sizes } from "@chakra-ui/theme-tools";
-declare const heading: {
-    register: {
-        readonly parts: readonly ["heading"];
-        readonly sizes: readonly ["2xl", "xl", "lg", "md", "sm", "xs"];
+declare const heading: import("@chakra-ui/theme-tools").StyleConfig<{
+    fontFamily: string;
+    lineHeight: string;
+    fontWeight: string;
+}, {
+    "2xl": {
+        fontSize: (string | null)[];
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["heading"];
-        readonly sizes: readonly ["2xl", "xl", "lg", "md", "sm", "xs"];
-    }>;
-    baseStyle: {
-        heading?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
+    xl: {
+        fontSize: (string | null)[];
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["heading"];
-        readonly sizes: readonly ["2xl", "xl", "lg", "md", "sm", "xs"];
-    }>;
+    lg: {
+        fontSize: (string | null)[];
+    };
+    md: {
+        fontSize: string;
+    };
+    sm: {
+        fontSize: string;
+    };
+    xs: {
+        fontSize: string;
+    };
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | "xs" | "sm" | "lg" | "xl" | "2xl" | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default heading;

dist/types/components/input.d.ts

@@ -1,116 +0,168 @@
-import { DefaultProps, Sizes, Variants } from "@chakra-ui/theme-tools";
-declare const input: {
-    register: {
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
+declare const input: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    field: string;
+    addon: string;
+}, {
+    field: {
+        width: string;
+        outline: number;
+        position: string;
+        appearance: string;
+        transition: string;
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
-    baseStyle: {
-        field?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-        addon?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
+}, {
+    lg: {
+        field: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
+        addon: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
-    variants: Variants<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
+    md: {
+        field: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
+        addon: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
+    };
+    sm: {
+        field: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
+        addon: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
+    };
+}, {
+    outline: (props: Record<string, any>) => {
+        field: {
+            border: string;
+            borderColor: any;
+            bg: any;
+            _hover: {
+                borderColor: any;
+            };
+            _readOnly: {
+                boxShadow: string;
+                userSelect: string;
+            };
+            _disabled: {
+                opacity: number;
+                cursor: string;
+            };
+            _focus: {
+                borderColor: any;
+                boxShadow: string;
+            };
+            _invalid: {
+                borderColor: any;
+                boxShadow: string;
+            };
+        };
+        addon: {
+            border: string;
+            borderColor: any;
+            bg: any;
+        };
+    };
+    filled: (props: Record<string, any>) => {
+        field: {
+            border: string;
+            borderColor: string;
+            bg: any;
+            _hover: {
+                bg: any;
+            };
+            _readOnly: {
+                boxShadow: string;
+                userSelect: string;
+            };
+            _disabled: {
+                opacity: number;
+                cursor: string;
+            };
+            _focus: {
+                bg: string;
+                borderColor: any;
+            };
+            _invalid: {
+                borderColor: any;
+            };
+        };
+        addon: {
+            border: string;
+            borderColor: string;
+            bg: any;
+        };
+    };
+    flushed: (props: Record<string, any>) => {
+        field: {
+            borderBottom: string;
+            borderColor: string;
+            borderRadius: number;
+            paddingX: number;
+            bg: string;
+            _readOnly: {
+                boxShadow: string;
+                userSelect: string;
+            };
+            _focus: {
+                borderColor: any;
+            };
+            _invalid: {
+                borderColor: any;
+            };
+        };
+        addon: {
+            borderBottom: string;
+            borderColor: string;
+            borderRadius: number;
+            paddingX: number;
+            bg: string;
+        };
+    };
+    unstyled: {
+        field: {
+            bg: string;
+            paddingX: number;
+            height: string;
+        };
+        addon: {
+            bg: string;
+            paddingX: number;
+            height: string;
+        };
+    };
+}> & {
+    propTypes: {
+        variant?: "outline" | "unstyled" | "filled" | "flushed" | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default input;

dist/types/components/kbd.d.ts

@@ -1,53 +0,110 @@
-declare const kbd: {
-    register: {
-        readonly parts: readonly ["kbd"];
+declare const kbd: import("@chakra-ui/theme-tools").StyleConfig<(props: Record<string, any>) => {
+    bg: any;
+    borderRadius: string;
+    borderWidth: string;
+    borderBottomWidth: string;
+    fontSize: string;
+    fontWeight: string;
+    lineHeight: string;
+    px: string;
+    whiteSpace: string;
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: string | number | undefined;
+        colorScheme?: string | undefined;
     };
-    baseStyle: (props: any) => {
-        kbd?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-    };
 };
 export default kbd;

dist/types/components/link.d.ts

@@ -1,53 +0,117 @@
-declare const link: {
-    register: {
-        readonly parts: readonly ["link"];
+declare const link: import("@chakra-ui/theme-tools").StyleConfig<{
+    transition: string;
+    cursor: string;
+    textDecoration: string;
+    outline: string;
+    color: string;
+    _hover: {
+        textDecoration: string;
     };
-    baseStyle: {
-        link?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
+    _focus: {
+        boxShadow: string;
     };
+    _disabled: {
+        opacity: number;
+        cursor: string;
+        textDecoration: string;
+    };
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: string | number | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default link;

dist/types/components/modal.d.ts

@@ -1,12 +0,208 @@
-import { DefaultProps, Sizes } from "@chakra-ui/theme-tools";
-declare const modal: {
-    register: {
-        readonly parts: readonly ["overlay", "content", "header", "body", "footer"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "full"];
+declare const modal: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    overlay: string;
+    content: string;
+    header: string;
+    body: string;
+    footer: string;
+}, (props: Record<string, any>) => {
+    overlay: {
+        bg: string;
+        display: string;
+        justifyContent: string;
+        alignItems: string;
+        overflow: string;
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["overlay", "content", "header", "body", "footer"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "full"];
-    }>;
-    baseStyle: (props: any) => {
+    content: {
+        borderRadius: string;
+        bg: any;
+        color: string;
+        my: string;
+        maxH: string | undefined;
+        boxShadow: any;
+    };
+    header: {
+        px: number;
+        py: number;
+        fontSize: string;
+        fontWeight: string;
+    };
+    body: {
+        px: number;
+        py: number;
+        flex: number;
+        overflow: string | undefined;
+    };
+    footer: {
+        px: number;
+        py: number;
+    };
+}, {
+    xs: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    sm: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    md: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    lg: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    xl: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    "2xl": {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    "3xl": {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    "4xl": {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    "5xl": {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    "6xl": {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+    full: {
+        content: {
+            maxW: string;
+            h: string;
+        };
+    } | {
+        content: {
+            maxW: string;
+            h?: undefined;
+        };
+    };
+}, {
+    [value: string]: {
+        overlay?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         content?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -57,2 +253,138 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        header?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        body?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        footer?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    } | ((props: Record<string, any>) => {
         overlay?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -103,2 +435,47 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        content?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         header?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -239,15 +616,10 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | "xs" | "sm" | "lg" | "xl" | "2xl" | "full" | "3xl" | "4xl" | "5xl" | "6xl" | undefined;
+        colorScheme?: string | undefined;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["overlay", "content", "header", "body", "footer"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "full"];
-    }>;
-    transition: {
-        content?: import("@chakra-ui/theme-tools").TransitionConfig | undefined;
-        overlay?: import("@chakra-ui/theme-tools").TransitionConfig | undefined;
-        header?: import("@chakra-ui/theme-tools").TransitionConfig | undefined;
-        body?: import("@chakra-ui/theme-tools").TransitionConfig | undefined;
-        footer?: import("@chakra-ui/theme-tools").TransitionConfig | undefined;
-    };
 };
 export default modal;

dist/types/components/number-input.d.ts

@@ -1,161 +0,232 @@
-import { Sizes, Variants } from "@chakra-ui/theme-tools";
-declare const numberInput: {
-    register: {
-        readonly parts: readonly ["field", "stepper", "stepperGroup"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
+declare const numberInput: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    field: string;
+    stepper: string;
+    stepperGroup: string;
+}, (props: Record<string, any>) => {
+    field: {
+        width: string;
+        outline: number;
+        position: string;
+        appearance: string;
+        transition: string;
+    } | undefined;
+    stepperGroup: {
+        width: string;
     };
-    defaultProps: import("@chakra-ui/theme-tools").DefaultProps<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
-    baseStyle: (props: any) => {
-        field?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    stepper: {
+        borderLeft: string;
+        borderColor: any;
+        color: any;
+        _active: {
+            bg: any;
+        };
+        _disabled: {
+            opacity: number;
+            cursor: string;
+        };
+    };
+}, {
+    sm: {
+        field: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        } | {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        } | {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
         } | undefined;
-        stepper?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        stepper: {
+            fontSize: string;
+            _first: {
+                borderTopRightRadius: string;
+            };
+            _last: {
+                borderBottomRightRadius: string;
+                mt: string;
+                borderTopWidth: number;
+            };
+        };
+    };
+    md: {
+        field: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        } | {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        } | {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
         } | undefined;
-        stepperGroup?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        stepper: {
+            fontSize: string;
+            _first: {
+                borderTopRightRadius: string;
+            };
+            _last: {
+                borderBottomRightRadius: string;
+                mt: string;
+                borderTopWidth: number;
+            };
+        };
+    };
+    lg: {
+        field: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        } | {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        } | {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
         } | undefined;
+        stepper: {
+            fontSize: string;
+            _first: {
+                borderTopRightRadius: string;
+            };
+            _last: {
+                borderBottomRightRadius: string;
+                mt: string;
+                borderTopWidth: number;
+            };
+        };
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["field", "stepper", "stepperGroup"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
-    variants: Variants<{
-        readonly parts: readonly ["field", "stepper", "stepperGroup"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
+}, {
+    outline: (props: Record<string, any>) => {
+        field: {
+            border: string;
+            borderColor: any;
+            bg: any;
+            _hover: {
+                borderColor: any;
+            };
+            _readOnly: {
+                boxShadow: string;
+                userSelect: string;
+            };
+            _disabled: {
+                opacity: number;
+                cursor: string;
+            };
+            _focus: {
+                borderColor: any;
+                boxShadow: string;
+            };
+            _invalid: {
+                borderColor: any;
+                boxShadow: string;
+            };
+        };
+        addon: {
+            border: string;
+            borderColor: any;
+            bg: any;
+        };
+    };
+    filled: (props: Record<string, any>) => {
+        field: {
+            border: string;
+            borderColor: string;
+            bg: any;
+            _hover: {
+                bg: any;
+            };
+            _readOnly: {
+                boxShadow: string;
+                userSelect: string;
+            };
+            _disabled: {
+                opacity: number;
+                cursor: string;
+            };
+            _focus: {
+                bg: string;
+                borderColor: any;
+            };
+            _invalid: {
+                borderColor: any;
+            };
+        };
+        addon: {
+            border: string;
+            borderColor: string;
+            bg: any;
+        };
+    };
+    flushed: (props: Record<string, any>) => {
+        field: {
+            borderBottom: string;
+            borderColor: string;
+            borderRadius: number;
+            paddingX: number;
+            bg: string;
+            _readOnly: {
+                boxShadow: string;
+                userSelect: string;
+            };
+            _focus: {
+                borderColor: any;
+            };
+            _invalid: {
+                borderColor: any;
+            };
+        };
+        addon: {
+            borderBottom: string;
+            borderColor: string;
+            borderRadius: number;
+            paddingX: number;
+            bg: string;
+        };
+    };
+    unstyled: {
+        field: {
+            bg: string;
+            paddingX: number;
+            height: string;
+        };
+        addon: {
+            bg: string;
+            paddingX: number;
+            height: string;
+        };
+    };
+}> & {
+    propTypes: {
+        variant?: "outline" | "unstyled" | "filled" | "flushed" | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default numberInput;

dist/types/components/pin-input.d.ts

@@ -1,116 +0,45 @@
-import { Sizes } from "@chakra-ui/theme-tools";
-declare const pinInput: {
-    register: {
-        readonly parts: readonly ["field"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
+declare const pinInput: import("@chakra-ui/theme-tools").StyleConfig<{
+    textAlign: string;
+} | {
+    textAlign: string;
+    width: string;
+    outline: number;
+    position: string;
+    appearance: string;
+    transition: string;
+}, {
+    lg: {
+        fontSize: string;
+        w: number;
+        h: number;
+        borderRadius: string;
     };
-    defaultProps: import("@chakra-ui/theme-tools").DefaultProps<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
-    baseStyle: {
-        field?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-        addon?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
+    md: {
+        fontSize: string;
+        w: number;
+        h: number;
+        borderRadius: string;
     };
-    variants: import("@chakra-ui/theme-tools").Variants<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
-    sizes: Sizes<{
-        readonly parts: readonly ["field"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
+    sm: {
+        fontSize: string;
+        w: number;
+        h: number;
+        borderRadius: string;
+    };
+}, {
+    outline: (props: Record<string, any>) => {};
+    flushed: (props: Record<string, any>) => {};
+    filled: (props: Record<string, any>) => {};
+    unstyled: {
+        bg: string;
+        paddingX: number;
+        height: string;
+    } | undefined;
+}> & {
+    propTypes: {
+        variant?: "outline" | "unstyled" | "filled" | "flushed" | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default pinInput;

dist/types/components/progress.d.ts

@@ -1,12 +0,129 @@
-import { DefaultProps, Sizes } from "@chakra-ui/theme-tools";
-declare const progress: {
-    register: {
-        readonly parts: readonly ["track", "filledTrack", "label"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg"];
+declare const progress: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    track: string;
+    filledTrack: string;
+    label: string;
+}, (props: Record<string, any>) => {
+    label: {
+        lineHeight: string;
+        fontSize: string;
+        fontWeight: string;
+        color: string;
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["track", "filledTrack", "label"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg"];
-    }>;
-    baseStyle: (props: any) => {
+    track: {
+        bg: any;
+    };
+    filledTrack: any;
+}, {
+    xs: {
+        track: {
+            h: string;
+        };
+    };
+    sm: {
+        track: {
+            h: string;
+        };
+    };
+    md: {
+        track: {
+            h: string;
+        };
+    };
+    lg: {
+        track: {
+            h: string;
+        };
+    };
+}, {
+    [value: string]: {
+        track?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        filledTrack?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         label?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -57,2 +174,3 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+    } | ((props: Record<string, any>) => {
         track?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -148,8 +266,55 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        label?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | "xs" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["track", "filledTrack", "label"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg"];
-    }>;
 };
 export default progress;

dist/types/components/radio.d.ts

@@ -1,12 +0,177 @@
-import { Sizes } from "@chakra-ui/theme-tools";
-declare const radio: {
-    register: {
-        readonly parts: readonly ["control", "label"];
-        readonly sizes: readonly ["sm", "md", "lg"];
+declare const radio: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    control: string;
+    label: string;
+}, (props: Record<string, any>) => {
+    label: {
+        userSelect: string;
+        _disabled: {
+            opacity: number;
+        };
+    } | undefined;
+    control: {
+        borderRadius: string;
+        _checked: {
+            _before: {
+                content: string;
+                display: string;
+                position: string;
+                width: string;
+                height: string;
+                borderRadius: string;
+                bg: string;
+            };
+        } | {
+            _before: {
+                content: string;
+                display: string;
+                position: string;
+                width: string;
+                height: string;
+                borderRadius: string;
+                bg: string;
+            };
+            bg: any;
+            borderColor: any;
+            color: any;
+            _hover: {
+                bg: any;
+                borderColor: any;
+            };
+            _disabled: {
+                borderColor: any;
+                bg: any;
+                color: any;
+            };
+        };
+    } | {
+        borderRadius: string;
+        _checked: {
+            _before: {
+                content: string;
+                display: string;
+                position: string;
+                width: string;
+                height: string;
+                borderRadius: string;
+                bg: string;
+            };
+        } | {
+            _before: {
+                content: string;
+                display: string;
+                position: string;
+                width: string;
+                height: string;
+                borderRadius: string;
+                bg: string;
+            };
+            bg: any;
+            borderColor: any;
+            color: any;
+            _hover: {
+                bg: any;
+                borderColor: any;
+            };
+            _disabled: {
+                borderColor: any;
+                bg: any;
+                color: any;
+            };
+        };
+        w: string;
+        transition: string;
+        border: string;
+        borderColor: string;
+        color: string;
+        _indeterminate: {
+            bg: any;
+            borderColor: any;
+            color: any;
+        };
+        _disabled: {
+            bg: any;
+            borderColor: any;
+        };
+        _focus: {
+            boxShadow: string;
+        };
+        _invalid: {
+            borderColor: any;
+        };
     };
-    defaultProps: import("@chakra-ui/theme-tools").DefaultProps<{
-        readonly parts: readonly ["control", "label", "description", "icon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
-    baseStyle: (props: any) => {
+}, {
+    md: {
+        control: {
+            w: number;
+            h: number;
+        };
+        label: {
+            fontSize: string;
+        };
+    };
+    lg: {
+        control: {
+            w: number;
+            h: number;
+        };
+        label: {
+            fontSize: string;
+        };
+    };
+    sm: {
+        control: {
+            width: number;
+            height: number;
+        };
+        label: {
+            fontSize: string;
+        };
+    };
+}, {
+    [value: string]: {
+        control?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         label?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -57,2 +222,3 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+    } | ((props: Record<string, any>) => {
         control?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -103,8 +269,55 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        label?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["control", "label"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
 };
 export default radio;

dist/types/components/select.d.ts

@@ -1,115 +0,187 @@
-declare const select: {
-    register: {
-        readonly parts: readonly ["field", "icon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
+declare const select: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    field: string;
+    icon: string;
+}, (props: Record<string, any>) => {
+    field: {
+        appearance: string;
+        paddingBottom: string;
+        lineHeight: string;
+        "> option": {
+            bg: any;
+        };
+    } | {
+        appearance: string;
+        paddingBottom: string;
+        lineHeight: string;
+        "> option": {
+            bg: any;
+        };
+        width: string;
+        outline: number;
+        position: string;
+        transition: string;
     };
-    defaultProps: import("@chakra-ui/theme-tools").DefaultProps<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
-    baseStyle: {
-        icon?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-        field?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
+    icon: {
+        color: string;
+        fontSize: string;
+        _disabled: {
+            opacity: number;
+        };
     };
-    sizes: import("@chakra-ui/theme-tools").Sizes<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
-    variants: import("@chakra-ui/theme-tools").Variants<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
+}, {
+    lg: {
+        field: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
+        addon: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
+    };
+    md: {
+        field: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
+        addon: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
+    };
+    sm: {
+        field: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
+        addon: {
+            fontSize: string;
+            pl: number;
+            paddingRight: number;
+            h: number;
+            borderRadius: string;
+        };
+    };
+}, {
+    outline: (props: Record<string, any>) => {
+        field: {
+            border: string;
+            borderColor: any;
+            bg: any;
+            _hover: {
+                borderColor: any;
+            };
+            _readOnly: {
+                boxShadow: string;
+                userSelect: string;
+            };
+            _disabled: {
+                opacity: number;
+                cursor: string;
+            };
+            _focus: {
+                borderColor: any;
+                boxShadow: string;
+            };
+            _invalid: {
+                borderColor: any;
+                boxShadow: string;
+            };
+        };
+        addon: {
+            border: string;
+            borderColor: any;
+            bg: any;
+        };
+    };
+    filled: (props: Record<string, any>) => {
+        field: {
+            border: string;
+            borderColor: string;
+            bg: any;
+            _hover: {
+                bg: any;
+            };
+            _readOnly: {
+                boxShadow: string;
+                userSelect: string;
+            };
+            _disabled: {
+                opacity: number;
+                cursor: string;
+            };
+            _focus: {
+                bg: string;
+                borderColor: any;
+            };
+            _invalid: {
+                borderColor: any;
+            };
+        };
+        addon: {
+            border: string;
+            borderColor: string;
+            bg: any;
+        };
+    };
+    flushed: (props: Record<string, any>) => {
+        field: {
+            borderBottom: string;
+            borderColor: string;
+            borderRadius: number;
+            paddingX: number;
+            bg: string;
+            _readOnly: {
+                boxShadow: string;
+                userSelect: string;
+            };
+            _focus: {
+                borderColor: any;
+            };
+            _invalid: {
+                borderColor: any;
+            };
+        };
+        addon: {
+            borderBottom: string;
+            borderColor: string;
+            borderRadius: number;
+            paddingX: number;
+            bg: string;
+        };
+    };
+    unstyled: {
+        field: {
+            bg: string;
+            paddingX: number;
+            height: string;
+        };
+        addon: {
+            bg: string;
+            paddingX: number;
+            height: string;
+        };
+    };
+}> & {
+    propTypes: {
+        variant?: "outline" | "unstyled" | "filled" | "flushed" | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default select;

dist/types/components/skeleton.d.ts

@@ -1,54 +0,107 @@
-declare const skeleton: {
-    register: {
-        readonly parts: readonly ["skeleton"];
+declare const skeleton: import("@chakra-ui/theme-tools").StyleConfig<(props: Record<string, any>) => {
+    opacity: number;
+    borderRadius: string;
+    borderColor: any;
+    background: any;
+    animation: string;
+}, {
+    [value: string]: import("@chakra-ui/system").SystemCSSProperties | import("@chakra-ui/system").CSSPseudoStyles | import("@chakra-ui/system").CSSSelectorStyles | import("@chakra-ui/system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/system").SystemStyleObject) | undefined;
+}, {
+    [value: string]: import("@chakra-ui/system").SystemCSSProperties | import("@chakra-ui/system").CSSPseudoStyles | import("@chakra-ui/system").CSSSelectorStyles | import("@chakra-ui/system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/system").SystemStyleObject) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: string | number | undefined;
+        colorScheme?: string | undefined;
     };
-    baseStyle: (props: any) => {
-        skeleton?: import("@chakra-ui/system").SystemCSSProperties | import("@chakra-ui/system").CSSPseudoStyles | import("@chakra-ui/system").CSSSelectorStyles | import("@chakra-ui/system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/system").SystemCSSProperties | undefined;
-        } | undefined;
-    };
 };
 export default skeleton;
-export declare function frame(startColor: string, endColor: string): import("@emotion/serialize").Keyframes;
+export declare function fade(startColor: string, endColor: string): import("@emotion/serialize").Keyframes;

dist/types/components/skip-link.d.ts

@@ -1,53 +0,111 @@
-declare const skipLink: {
-    register: {
-        readonly parts: readonly ["link"];
+declare const skipLink: import("@chakra-ui/theme-tools").StyleConfig<(props: Record<string, any>) => {
+    borderRadius: string;
+    fontWeight: string;
+    _focus: {
+        boxShadow: string;
+        padding: string;
+        position: string;
+        top: string;
+        left: string;
+        bg: any;
     };
-    baseStyle: (props: any) => {
-        link?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: string | number | undefined;
+        colorScheme?: string | undefined;
     };
 };
 export default skipLink;

dist/types/components/slider.d.ts

@@ -1,16 +0,43 @@
-import { DefaultProps, Sizes } from "@chakra-ui/theme-tools";
-declare const slider: {
-    register: {
-        readonly parts: readonly ["container", "thumb", "track", "filledTrack"];
-        readonly sizes: readonly ["sm", "md", "lg"];
+declare const slider: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    container: string;
+    thumb: string;
+    track: string;
+    filledTrack: string;
+}, (props: Record<string, any>) => {
+    container: any;
+    track: {
+        borderRadius: string;
+        bg: any;
+        _disabled: {
+            bg: any;
+        };
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["container", "thumb", "track", "filledTrack"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
-    sizes: Sizes<{
-        readonly parts: readonly ["container", "thumb", "track", "filledTrack"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
-    baseStyle: (props: any) => {
+    thumb: any;
+    filledTrack: {
+        bg: any;
+    };
+}, {
+    lg: (props: Record<string, any>) => {
+        thumb: {
+            w: string;
+            h: string;
+        };
+        track: any;
+    };
+    md: (props: Record<string, any>) => {
+        thumb: {
+            w: string;
+            h: string;
+        };
+        track: any;
+    };
+    sm: (props: Record<string, any>) => {
+        thumb: {
+            w: string;
+            h: string;
+        };
+        track: any;
+    };
+}, {
+    [value: string]: {
         container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -196,4 +223,191 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+    } | ((props: Record<string, any>) => {
+        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        thumb?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        track?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        filledTrack?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
     };
 };
 export default slider;

dist/types/components/spinner.d.ts

@@ -1,16 +0,119 @@
-import { DefaultProps, Sizes } from "@chakra-ui/theme-tools";
-declare const spinner: {
-    register: {
-        readonly parts: readonly ["spinner"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg", "xl"];
+declare const spinner: import("@chakra-ui/theme-tools").StyleConfig<import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+    _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+        content?: string | undefined;
+    }) | undefined;
+    _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+        content?: string | undefined;
+    }) | undefined;
+    _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+} | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject), {
+    xs: {
+        w: string;
+        h: string;
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["spinner"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg", "xl"];
-    }>;
-    sizes: Sizes<{
-        readonly parts: readonly ["spinner"];
-        readonly sizes: readonly ["xs", "sm", "md", "lg", "xl"];
-    }>;
+    sm: {
+        w: string;
+        h: string;
+    };
+    md: {
+        w: string;
+        h: string;
+    };
+    lg: {
+        w: string;
+        h: string;
+    };
+    xl: {
+        w: string;
+        h: string;
+    };
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | "xs" | "sm" | "lg" | "xl" | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default spinner;

dist/types/components/stat.d.ts

@@ -1,13 +0,39 @@
-import { DefaultProps, Sizes } from "@chakra-ui/theme-tools";
-declare const stat: {
-    register: {
-        readonly parts: readonly ["label", "helpText", "number", "container", "icon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
+declare const stat: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    label: string;
+    number: string;
+    icon: string;
+    helpText: string;
+}, {
+    label: {
+        fontWeight: string;
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["label", "helpText", "number", "container", "icon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
-    baseStyle: {
-        number?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+    helpText: {
+        opacity: number;
+        marginBottom: number;
+    };
+    number: {
+        verticalAlign: string;
+        fontWeight: string;
+    };
+    icon: {
+        mr: number;
+        w: string;
+        h: string;
+        verticalAlign: string;
+    };
+}, {
+    md: {
+        label: {
+            fontSize: string;
+        };
+        helpText: {
+            fontSize: string;
+        };
+        number: {
+            fontSize: string;
+        };
+    };
+}, {
+    [value: string]: {
+        label?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
             _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
@@ -57,3 +83,3 @@ _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
-        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        number?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
             _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
@@ -148,2 +174,48 @@ _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        helpText?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    } | ((props: Record<string, any>) => {
         label?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -194,2 +266,92 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        number?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+        icon?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         helpText?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -240,8 +402,10 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | undefined;
+        colorScheme?: string | undefined;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["label", "helpText", "number", "container", "icon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
 };
 export default stat;

dist/types/components/switch.d.ts

@@ -1,12 +0,114 @@
-import { DefaultProps, Sizes } from "@chakra-ui/theme-tools";
-declare const _switch: {
-    register: {
-        readonly parts: readonly ["track", "thumb"];
-        readonly sizes: readonly ["sm", "md", "lg"];
+declare const Switch: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    track: string;
+    thumb: string;
+}, (props: Record<string, any>) => {
+    track: {
+        borderRadius: string;
+        p: string;
+        transition: string;
+        bg: any;
+        _focus: {
+            boxShadow: string;
+        };
+        _disabled: {
+            opacity: number;
+            cursor: string;
+        };
+        _checked: {
+            bg: any;
+        };
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["track", "thumb"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
-    baseStyle: (props: any) => {
+    thumb: {
+        bg: string;
+        transition: string;
+        borderRadius: string;
+        transform: string;
+    };
+}, {
+    sm: {
+        track: {
+            w: string;
+            h: string;
+        };
+        thumb: {
+            w: string;
+            h: string;
+            _checked: {
+                transform: string;
+            };
+        };
+    };
+    md: {
+        track: {
+            w: string;
+            h: string;
+        };
+        thumb: {
+            w: string;
+            h: string;
+            _checked: {
+                transform: string;
+            };
+        };
+    };
+    lg: {
+        track: {
+            w: string;
+            h: string;
+        };
+        thumb: {
+            w: string;
+            h: string;
+            _checked: {
+                transform: string;
+            };
+        };
+    };
+}, {
+    [value: string]: {
+        track?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
         thumb?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -57,2 +159,3 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+    } | ((props: Record<string, any>) => {
         track?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
@@ -103,8 +206,55 @@ _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
         } | undefined;
+        thumb?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+                content?: string | undefined;
+            }) | undefined;
+            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        } | undefined;
+    }) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["track", "thumb"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-    }>;
 };
-export default _switch;
+export default Switch;

dist/types/components/tabs.d.ts

@@ -1,206 +0,137 @@
-import { DefaultProps, Sizes, Variants } from "@chakra-ui/theme-tools";
-declare const tabs: {
-    register: {
-        readonly parts: readonly ["tablist", "tab", "tabpanel", "indicator"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["line", "enclosed", "soft-rounded", "enclosed-colored", "solid-rounded", "unstyled"];
+declare const tabs: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    tablist: string;
+    tab: string;
+    tabpanel: string;
+    indicator: string;
+}, (props: Record<string, any>) => {
+    tab: {
+        flex: number | undefined;
+        transition: string;
+        _focus: {
+            zIndex: number;
+            boxShadow: string;
+        };
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["tablist", "tab", "tabpanel", "indicator"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["line", "enclosed", "soft-rounded", "enclosed-colored", "solid-rounded", "unstyled"];
-    }>;
-    baseStyle: (props: any) => {
-        tablist?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-        tab?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-        tabpanel?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-        indicator?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
+    tablist: {
+        justifyContent: any;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["tablist", "tab", "tabpanel", "indicator"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["line", "enclosed", "soft-rounded", "enclosed-colored", "solid-rounded", "unstyled"];
-    }>;
-    variants: Variants<{
-        readonly parts: readonly ["tablist", "tab", "tabpanel", "indicator"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["line", "enclosed", "soft-rounded", "enclosed-colored", "solid-rounded", "unstyled"];
-    }>;
+    tabpanel: {
+        p: number;
+    };
+}, {
+    sm: {
+        tab: {
+            py: string;
+            px: string;
+            fontSize: string;
+        };
+    };
+    md: {
+        tab: {
+            fontSize: string;
+            py: string;
+            px: string;
+        };
+    };
+    lg: {
+        tab: {
+            fontSize: string;
+            py: string;
+            px: string;
+        };
+    };
+}, {
+    line: (props: Record<string, any>) => {
+        tablist: {
+            borderBottom: string;
+            borderColor: string;
+        };
+        tab: {
+            borderBottom: string;
+            borderColor: string;
+            mb: string;
+            _selected: {
+                color: any;
+                borderColor: string;
+            };
+            _active: {
+                bg: any;
+            };
+            _disabled: {
+                opacity: number;
+                cursor: string;
+            };
+        };
+    };
+    enclosed: (props: Record<string, any>) => {
+        tab: {
+            borderTopRadius: string;
+            border: string;
+            borderColor: string;
+            mb: string;
+            _selected: {
+                color: any;
+                borderColor: string;
+                borderBottomColor: any;
+            };
+        };
+        tablist: {
+            mb: string;
+            borderBottom: string;
+            borderColor: string;
+        };
+    };
+    "enclosed-colored": (props: Record<string, any>) => {
+        tab: {
+            border: string;
+            borderColor: string;
+            bg: any;
+            mb: string;
+            _notLast: {
+                mr: string;
+            };
+            _selected: {
+                bg: any;
+                color: any;
+                borderColor: string;
+                borderTopColor: string;
+                borderBottomColor: string;
+            };
+        };
+        tablist: {
+            mb: string;
+            borderBottom: string;
+            borderColor: string;
+        };
+    };
+    "soft-rounded": (props: Record<string, any>) => {
+        tab: {
+            borderRadius: string;
+            fontWeight: string;
+            color: string;
+            _selected: {
+                color: any;
+                bg: any;
+            };
+        };
+    };
+    "solid-rounded": (props: Record<string, any>) => {
+        tab: {
+            borderRadius: string;
+            fontWeight: string;
+            color: any;
+            _selected: {
+                color: any;
+                bg: any;
+            };
+        };
+    };
+    unstyled: {};
+}> & {
+    propTypes: {
+        variant?: "unstyled" | "line" | "enclosed" | "enclosed-colored" | "soft-rounded" | "solid-rounded" | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default tabs;

dist/types/components/tag.d.ts

@@ -1,160 +0,93 @@
-import { Sizes, DefaultProps } from "@chakra-ui/theme-tools";
-declare const tag: {
-    register: {
-        readonly parts: readonly ["container", "label", "closeButton"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["solid", "subtle", "outline"];
+declare const tag: import("@chakra-ui/theme-tools").MultiStyleConfig<{
+    container: string;
+    label: string;
+    closeButton: string;
+}, {
+    container: {
+        fontWeight: string;
+        lineHeight: number;
+        outline: number;
+        _focus: {
+            boxShadow: string;
+        };
     };
-    defaultProps: DefaultProps<{
-        readonly parts: readonly ["container", "label", "closeButton"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["solid", "subtle", "outline"];
-    }>;
-    baseStyle: {
-        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    label: {
+        lineHeight: number;
+    };
+    closeButton: {
+        fontSize: string;
+        w: string;
+        h: string;
+        borderRadius: string;
+        ml: string;
+        mr: string;
+        opacity: number;
+        _disabled: {
+            opacity: number;
+        };
+        _focus: {
+            boxShadow: string;
+            bg: string;
+        };
+        _hover: {
+            opacity: number;
+        };
+        _active: {
+            opacity: number;
+        };
+    };
+}, {
+    sm: {
+        container: {
+            minH: string;
+            minW: string;
+            fontSize: string;
+            px: number;
+            borderRadius: string;
+        };
+    };
+    md: {
+        container: {
+            minH: string;
+            minW: string;
+            fontSize: string;
+            borderRadius: string;
+            px: number;
+        };
+    };
+    lg: {
+        container: {
+            minH: number;
+            minW: number;
+            fontSize: string;
+            borderRadius: string;
+            px: number;
+        };
+    };
+}, {
+    subtle: (props: Record<string, any>) => {
+        container: {
+            bg: any;
+            color: any;
         } | undefined;
-        label?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    };
+    solid: (props: Record<string, any>) => {
+        container: {
+            bg: any;
+            color: any;
         } | undefined;
-        closeButton?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    };
+    outline: (props: Record<string, any>) => {
+        container: {
+            color: any;
+            boxShadow: string;
         } | undefined;
     };
-    sizes: Sizes<{
-        readonly parts: readonly ["container", "label", "closeButton"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["solid", "subtle", "outline"];
-    }>;
-    variants: import("@chakra-ui/theme-tools").Variants<{
-        readonly parts: readonly ["container"];
-        readonly variants: readonly ["solid", "subtle", "outline"];
-    }>;
+}> & {
+    propTypes: {
+        variant?: "solid" | "outline" | "subtle" | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
+    };
 };
 export default tag;

dist/types/components/textarea.d.ts

@@ -1,70 +0,52 @@
-declare const textarea: {
-    register: {
-        readonly parts: readonly ["field"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-        readonly sizes: readonly ["sm", "md", "lg"];
+declare const textarea: import("@chakra-ui/theme-tools").StyleConfig<{
+    paddingY: string;
+    minHeight: string;
+    lineHeight: string;
+} | {
+    paddingY: string;
+    minHeight: string;
+    lineHeight: string;
+    width: string;
+    outline: number;
+    position: string;
+    appearance: string;
+    transition: string;
+}, {
+    sm: {
+        fontSize: string;
+        pl: number;
+        paddingRight: number;
+        h: number;
+        borderRadius: string;
+    } | undefined;
+    md: {
+        fontSize: string;
+        pl: number;
+        paddingRight: number;
+        h: number;
+        borderRadius: string;
+    } | undefined;
+    lg: {
+        fontSize: string;
+        pl: number;
+        paddingRight: number;
+        h: number;
+        borderRadius: string;
+    } | undefined;
+}, {
+    outline: (props: Record<string, any>) => {};
+    flushed: (props: Record<string, any>) => {};
+    filled: (props: Record<string, any>) => {};
+    unstyled: {
+        bg: string;
+        paddingX: number;
+        height: string;
+    } | undefined;
+}> & {
+    propTypes: {
+        variant?: "outline" | "unstyled" | "filled" | "flushed" | undefined;
+        size?: "md" | "sm" | "lg" | undefined;
+        colorScheme?: string | undefined;
     };
-    baseStyle: {
-        field?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-    };
-    defaultProps: import("@chakra-ui/theme-tools").DefaultProps<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
-    sizes: import("@chakra-ui/theme-tools").Sizes<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
-    variants: import("@chakra-ui/theme-tools").Variants<{
-        readonly parts: readonly ["field", "addon"];
-        readonly sizes: readonly ["sm", "md", "lg"];
-        readonly variants: readonly ["outline", "flushed", "filled", "unstyled"];
-    }>;
 };
 export default textarea;

dist/types/components/tooltip.d.ts

@@ -1,102 +0,111 @@
-declare const tooltip: {
-    register: {
-        readonly parts: readonly ["arrow", "container"];
+declare const tooltip: import("@chakra-ui/theme-tools").StyleConfig<(props: Record<string, any>) => {
+    px: string;
+    py: string;
+    bg: any;
+    color: any;
+    borderRadius: string;
+    fontWeight: string;
+    pointerEvents: string;
+    fontSize: string;
+    boxShadow: string;
+    maxW: string;
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}, {
+    [value: string]: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
+        _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
+            content?: string | undefined;
+        }) | undefined;
+        _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+        _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
+    } | ((props: Record<string, any>) => import("@chakra-ui/styled-system").SystemStyleObject) | undefined;
+}> & {
+    propTypes: {
+        variant?: string | number | undefined;
+        size?: string | number | undefined;
+        colorScheme?: string | undefined;
     };
-    baseStyle: (props: any) => {
-        container?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-        arrow?: import("@chakra-ui/styled-system").SystemCSSProperties | import("@chakra-ui/styled-system").CSSPseudoStyles | import("@chakra-ui/styled-system").CSSSelectorStyles | import("@chakra-ui/styled-system").ApplyPropStyles | {
-            _hover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _active?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _highlighted?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusWithin?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _focusVisible?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _disabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _readOnly?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _before?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _after?: (import("@chakra-ui/styled-system").SystemCSSProperties & {
-                content?: string | undefined;
-            }) | undefined;
-            _empty?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _expanded?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _checked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _grabbed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _pressed?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _invalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _valid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _loading?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selected?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _hidden?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _autofill?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _even?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _odd?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _first?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _last?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notFirst?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _notLast?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _visited?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _activeLink?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _indeterminate?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupHover?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupFocus?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupActive?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupDisabled?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupInvalid?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _groupChecked?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _placeholder?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _fullScreen?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-            _selection?: import("@chakra-ui/styled-system").SystemCSSProperties | undefined;
-        } | undefined;
-    };
-    transition: {
-        container?: import("@chakra-ui/theme-tools").TransitionConfig | undefined;
-        arrow?: import("@chakra-ui/theme-tools").TransitionConfig | undefined;
-    };
 };
 export default tooltip;

dist/types/foundations/breakpoints.d.ts

@@ -1,7 +0,5 @@
-declare const breakpoints: {
-    sm: string;
-    md: string;
-    lg: string;
-    xl: string;
-};
+/**
+ * Breakpoints for responsive design
+ */
+declare const breakpoints: any;
 export default breakpoints;

dist/types/foundations/index.d.ts

@@ -22,2 +22,3 @@ declare const theme: {
         "6xl": string;
+        "7xl": string;
         px: string;
@@ -44,5 +45,6 @@ 0: string;
     shadows: {
+        xs: string;
         sm: string;
+        base: string;
         md: string;
-        "dark-lg": string;
         lg: string;
@@ -54,2 +56,3 @@ xl: string;
         none: string;
+        "dark-lg": string;
     };
@@ -116,8 +119,16 @@ space: {
         normal: string;
-        none: string;
-        shorter: string;
-        short: string;
-        base: string;
-        tall: string;
+        none: number;
+        shorter: number;
+        short: number;
+        base: number;
+        tall: number;
         taller: string;
+        3: string;
+        4: string;
+        5: string;
+        6: string;
+        7: string;
+        8: string;
+        9: string;
+        10: string;
     };
@@ -152,8 +163,3 @@ fontWeights: {
     };
-    breakpoints: {
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-    };
+    breakpoints: any;
     zIndices: {
@@ -160,0 +166,0 @@ hide: number;

dist/types/foundations/shadows.d.ts

 declare const shadows: {
+    xs: string;
     sm: string;
+    base: string;
     md: string;
-    "dark-lg": string;
     lg: string;
@@ -11,4 +12,5 @@ xl: string;
     none: string;
+    "dark-lg": string;
 };
 export declare type Shadows = typeof shadows;
 export default shadows;

dist/types/foundations/sizes.d.ts

@@ -37,2 +37,3 @@ export declare const baseSizes: {
     "6xl": string;
+    "7xl": string;
 };
@@ -65,2 +66,3 @@ declare const container: {
     "6xl": string;
+    "7xl": string;
     px: string;
@@ -67,0 +69,0 @@ 0: string;

dist/types/foundations/typography.d.ts

@@ -12,8 +12,16 @@ declare const typography: {
         normal: string;
-        none: string;
-        shorter: string;
-        short: string;
-        base: string;
-        tall: string;
+        none: number;
+        shorter: number;
+        short: number;
+        base: number;
+        tall: number;
         taller: string;
+        3: string;
+        4: string;
+        5: string;
+        6: string;
+        7: string;
+        8: string;
+        9: string;
+        10: string;
     };
@@ -20,0 +28,0 @@ fontWeights: {

package.json

 {
   "name": "@chakra-ui/theme",
-  "version": "1.0.0-next.6",
+  "version": "1.0.0-next.7",
   "description": "The default theme for chakra components",
@@ -47,11 +47,11 @@ "keywords": [
   "dependencies": {
-    "@chakra-ui/theme-tools": "^1.0.0-next.6"
+    "@chakra-ui/theme-tools": "^1.0.0-next.7"
   },
   "peerDependencies": {
-    "@chakra-ui/system": "^1.0.0-next.5"
+    "@chakra-ui/system": "^1.0.0-next.7"
   },
   "devDependencies": {
-    "@chakra-ui/system": "^1.0.0-next.6"
+    "@chakra-ui/system": "^1.0.0-next.7"
   },
-  "gitHead": "72eeca4ba3fc6e7d8845b0d283a03cb6ec384a50"
+  "gitHead": "3dcabd8c7e21b32ae1b61485588f70370c4e626f"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2716552

increased by58.23%

Number of package files

244

increased by2.09%

Lines of code

37357

increased by71.43%

Dependency changes

• Updated@chakra-ui/theme-tools@^1.0.0-next.7