@plasmicpkgs/plasmic-chakra-ui 0.0.2 → 0.0.4

package/dist/plasmic-chakra-ui.cjs.development.js

@@ -6,432 +6,348 @@ function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'defau
 
 var react = require('@chakra-ui/react');
 var registerComponent = _interopDefault(require('@plasmicapp/host/registerComponent'));
+var registerGlobalContext = _interopDefault(require('@plasmicapp/host/registerGlobalContext'));
 var React = _interopDefault(require('react'));
 
-var aspectRatioMeta = {
-  name: "AspectRatio",
-  importPath: "@chakra-ui/react",
-  defaultStyles: {
-    width: "320px"
-  },
-  props: {
-    ratio: {
-      type: "number",
-      defaultValue: 1.333
-    },
-    children: {
-      type: "slot",
-      defaultValue: {
-        type: "component",
-        name: "Image"
+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];
+        }
       }
     }
-  }
-};
-function registerAspectRatio(loader, customAspectRatioMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+
+    return target;
   };
 
-  doRegisterComponent(react.AspectRatio, customAspectRatioMeta != null ? customAspectRatioMeta : aspectRatioMeta);
+  return _extends.apply(this, arguments);
 }
 
-var badgeMeta = {
-  name: "Badge",
-  importPath: "@chakra-ui/react",
-  props: {
-    colorScheme: {
-      type: "choice",
-      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"],
-      defaultValue: "gray"
-    },
-    variant: {
-      type: "choice",
-      options: ["solid", "subtle", "outline"],
-      defaultValue: "subtle"
-    }
-  }
+var CHAKRA_UI_IMPORT_PATH = "@chakra-ui/react";
+var getPlasmicComponentName = function getPlasmicComponentName(componentName) {
+  return "chakra-ui-" + componentName;
 };
-function registerBadge(loader, customBadgeMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
+var getDisplayComponentName = function getDisplayComponentName(componentName) {
+  return "Chakra-UI " + componentName;
+};
+var getComponentNameAndImportMeta = function getComponentNameAndImportMeta(componentName, parentComponentName, opts) {
+  var _opts$displayName, _opts$importPath;
 
-  doRegisterComponent(react.Badge, customBadgeMeta != null ? customBadgeMeta : badgeMeta);
-}
+  return _extends({
+    name: getPlasmicComponentName(componentName),
+    displayName: (_opts$displayName = opts == null ? void 0 : opts.displayName) != null ? _opts$displayName : getDisplayComponentName(componentName),
+    importPath: (_opts$importPath = opts == null ? void 0 : opts.importPath) != null ? _opts$importPath : CHAKRA_UI_IMPORT_PATH,
+    importName: componentName
+  }, parentComponentName ? {
+    parentComponentName: parentComponentName
+  } : {});
+};
 
-var breadcrumbItemMeta = {
-  name: "BreadcrumbItem",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Breadcrumb",
+var accordionMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Accordion"), {
   props: {
-    isCurrentPage: {
-      type: "boolean"
+    allowMultiple: {
+      type: "boolean",
+      description: "If true, multiple accordion items can be expanded at the same time."
     },
-    isLastChild: {
-      type: "boolean"
+    allowToggle: {
+      type: "boolean",
+      description: "If true, an expanded accordion item can be collapsed again."
     },
-    seperator: {
-      type: "string",
-      defaultValue: "/"
+    defaultIndex: {
+      type: "number",
+      description: "The index of the accordion item that should be expanded by default."
     },
-    spacing: {
-      type: "string",
-      defaultValue: "8px"
+    reduceMotion: {
+      type: "boolean",
+      description: "If true, height animation and transitions will be disabled."
     },
     children: {
       type: "slot",
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("AccordionItem")],
       defaultValue: [{
         type: "component",
-        name: "BreadcrumbLink",
-        props: {
-          children: {
-            type: "text",
-            value: "BreadcrumbItem"
-          }
-        }
+        name: /*#__PURE__*/getPlasmicComponentName("AccordionItem")
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("AccordionItem")
       }]
     }
   }
-};
-function registerBreadcrumbItem(loader, customBreadcrumbItemMeta) {
+});
+function registerAccordion(loader, customAccordionMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.BreadcrumbItem, customBreadcrumbItemMeta != null ? customBreadcrumbItemMeta : breadcrumbItemMeta);
+  doRegisterComponent(react.Accordion, customAccordionMeta != null ? customAccordionMeta : accordionMeta);
 }
-var breadcrumbLinkMeta = {
-  name: "BreadcrumbLink",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "BreadcrumbItem",
+var accordionItemMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("AccordionItem", "Accordion"), {
   props: {
-    href: {
+    id: {
       type: "string",
-      defaultValue: "#"
+      description: "The unique id of the accordion item."
+    },
+    isDisabled: {
+      type: "boolean",
+      description: "If true, the accordion item will be disabled."
+    },
+    isFocusable: {
+      type: "boolean",
+      description: "If true, the accordion item will be focusable."
     },
     children: {
       type: "slot",
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("AccordionButton"), /*#__PURE__*/getPlasmicComponentName("AccordionPanel")],
       defaultValue: [{
-        type: "text",
-        value: "Home"
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("AccordionButton")
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("AccordionPanel")
       }]
     }
   }
-};
-function registerBreadcrumbLink(loader, customBreadcrumbLinkMeta) {
+});
+function registerAccordionItem(loader, customAccordionItemMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.BreadcrumbLink, customBreadcrumbLinkMeta != null ? customBreadcrumbLinkMeta : breadcrumbLinkMeta);
+  doRegisterComponent(react.AccordionItem, customAccordionItemMeta != null ? customAccordionItemMeta : accordionItemMeta);
 }
-var breadcrumbMeta = {
-  name: "Breadcrumb",
-  importPath: "@chakra-ui/react",
+var accordionButtonMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("AccordionButton", "AccordionItem"), {
   props: {
-    separator: {
-      type: "string",
-      defaultValue: "/"
-    },
-    spacing: {
-      type: "string",
-      defaultValue: "8px"
+    _expanded: {
+      type: "object",
+      displayName: "expandedStyle",
+      defaultValueHint: {
+        bg: "orange",
+        color: "white"
+      }
     },
     children: {
       type: "slot",
       defaultValue: [{
-        type: "component",
-        name: "BreadcrumbItem",
-        props: {
-          children: {
-            type: "component",
-            name: "BreadcrumbLink",
-            props: {
-              children: {
-                type: "text",
-                value: "Home"
-              }
-            }
-          }
-        }
-      }, {
-        type: "component",
-        name: "BreadcrumbItem",
-        props: {
-          children: {
-            type: "component",
-            name: "BreadcrumbLink",
-            props: {
-              children: {
-                type: "text",
-                value: "Docs"
-              }
-            }
-          }
+        type: "text",
+        value: "Section 1 title",
+        styles: {
+          textAlign: "left"
         }
       }, {
         type: "component",
-        name: "BreadcrumbItem",
-        props: {
-          isLastChild: true,
-          isCurrentPage: true,
-          children: {
-            type: "component",
-            name: "BreadcrumbLink",
-            props: {
-              children: {
-                type: "text",
-                value: "Breadcrumb"
-              }
-            }
-          }
-        }
+        name: /*#__PURE__*/getPlasmicComponentName("AccordionIcon")
       }]
     }
   }
-};
-function registerBreadcrumb(loader, customBreadcrumbMeta) {
+});
+function registerAccordionButton(loader, customAccordionButtonMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Breadcrumb, customBreadcrumbMeta != null ? customBreadcrumbMeta : breadcrumbMeta);
+  doRegisterComponent(react.AccordionButton, customAccordionButtonMeta != null ? customAccordionButtonMeta : accordionButtonMeta);
 }
-var breadcrumbSeparatorMeta = {
-  name: "BreadcrumbSeparator",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Breadcrumb",
+var accordionPanelMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("AccordionPanel", "AccordionItem"), {
   props: {
     children: {
       type: "slot",
       defaultValue: {
-        type: "text",
-        value: "/"
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("Text"),
+        props: {
+          children: {
+            type: "text",
+            value: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
+          }
+        }
       }
     }
   }
-};
-function registerBreadcrumbSeparator(loader, customBreadcrumbSeparatorMeta) {
+});
+function registerAccordionPanel(loader, customAccordionPanelMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.BreadcrumbSeparator, customBreadcrumbSeparatorMeta != null ? customBreadcrumbSeparatorMeta : breadcrumbSeparatorMeta);
+  doRegisterComponent(react.AccordionPanel, customAccordionPanelMeta != null ? customAccordionPanelMeta : accordionPanelMeta);
 }
+var accordionIconMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("AccordionIcon", "AccordionButton"), {
+  props: {}
+});
+function registerAccordionIcon(loader, customAccordionIconMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
 
-var buttonGroupMeta = {
-  name: "ButtonGroup",
-  importPath: "@chakra-ui/react",
+  doRegisterComponent(react.AccordionIcon, customAccordionIconMeta != null ? customAccordionIconMeta : accordionIconMeta);
+}
+
+var aspectRatioMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("AspectRatio"), {
+  defaultStyles: {
+    width: "320px"
+  },
   props: {
-    colorScheme: {
-      type: "choice",
-      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"]
-    },
-    size: {
-      type: "choice",
-      options: ["xl", "sm", "md", "lg"],
-      defaultValue: "md"
-    },
-    isAttached: {
-      type: "boolean",
-      defaultValue: false
-    },
-    isDisabled: {
-      type: "boolean",
-      defaultValue: false
-    },
-    spacing: {
-      type: "string",
-      defaultValue: "0.5rem"
+    ratio: {
+      type: "number",
+      defaultValue: 1.333
     },
     children: {
       type: "slot",
-      defaultValue: [{
-        type: "component",
-        name: "Button",
-        props: {
-          children: {
-            type: "text",
-            value: "Button 1"
-          }
-        }
-      }, {
+      defaultValue: {
         type: "component",
-        name: "Button",
-        props: {
-          children: {
-            type: "text",
-            value: "Button 2"
-          }
-        }
-      }]
+        name: /*#__PURE__*/getPlasmicComponentName("Image")
+      }
     }
   }
-};
-function registerButtonGroup(loader, customButtonGroupMeta) {
+});
+function registerAspectRatio(loader, customAspectRatioMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.ButtonGroup, customButtonGroupMeta != null ? customButtonGroupMeta : buttonGroupMeta);
+  doRegisterComponent(react.AspectRatio, customAspectRatioMeta != null ? customAspectRatioMeta : aspectRatioMeta);
 }
-var buttonMeta = {
-  name: "Button",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "ButtonGroup",
+
+var avatarBadgeMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("AvatarBadge", "Avatar"), {
   props: {
-    size: {
-      type: "choice",
-      options: ["xl", "sm", "md", "lg"]
-    },
-    variant: {
-      type: "choice",
-      options: ["ghost", "outline", "solid", "link", "unstyled"],
-      defaultValue: "solid"
+    boxSize: {
+      type: "string",
+      defaultValue: "1.25em"
     },
-    colorScheme: {
-      type: "choice",
-      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"]
+    bg: {
+      type: "string",
+      defaultValue: "green.500"
     },
-    iconSpacing: "number",
-    isActive: {
-      type: "boolean"
-    },
-    isDisabled: {
-      type: "boolean"
-    },
-    isLoading: {
-      type: "boolean"
-    },
-    children: {
-      type: "slot",
-      defaultValue: {
-        type: "text",
-        value: "Button"
-      }
-    }
+    borderColor: "string"
   }
-};
-function registerButton(loader, customButtonMeta) {
+});
+function registerAvatarBadge(loader, customAvatarBadgeMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Button, customButtonMeta != null ? customButtonMeta : buttonMeta);
+  doRegisterComponent(react.AvatarBadge, customAvatarBadgeMeta != null ? customAvatarBadgeMeta : avatarBadgeMeta);
 }
-
-var checkboxMeta = {
-  name: "Checkbox",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "CheckboxGroup",
+var avatarMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Avatar", "AvatarGroup"), {
   props: {
-    colorScheme: {
-      type: "choice",
-      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"],
-      defaultValue: "blue"
-    },
-    size: {
-      type: "choice",
-      options: ["xl", "sm", "md", "lg"]
-    },
-    value: {
-      type: "string"
-    },
-    spacing: {
+    name: {
       type: "string",
-      defaultValue: "0.5rem"
-    },
-    isChecked: {
-      type: "boolean"
-    },
-    isIndeterminate: {
-      type: "boolean"
+      defaultValue: "Kola Tioluwani"
     },
-    isDisabled: {
-      type: "boolean"
+    src: {
+      type: "string",
+      defaultValue: "https://bit.ly/dan-abramov"
     },
-    isRequired: {
-      type: "boolean"
+    size: {
+      type: "choice",
+      options: ["2xs", "xs", "sm", "md", "lg", "xl", "2xl", "full"]
     },
-    isInvalid: {
-      type: "boolean"
+    loading: {
+      type: "choice",
+      options: ["eager", "lazy"]
     },
+    showBorder: "boolean",
     children: {
       type: "slot",
+      hidePlaceholder: true,
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("AvatarBadge")],
       defaultValue: {
-        type: "text",
-        value: "Checkbox"
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("AvatarBadge")
       }
     }
   }
-};
-function registerCheckbox(loader, customCheckboxMeta) {
+});
+function registerAvatar(loader, customAvatarMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Checkbox, customCheckboxMeta != null ? customCheckboxMeta : checkboxMeta);
+  doRegisterComponent(react.Avatar, customAvatarMeta != null ? customAvatarMeta : avatarMeta);
 }
-var checkboxGroupMeta = {
-  name: "CheckboxGroup",
-  importPath: "@chakra-ui/react",
+var avatarGroupMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("AvatarGroup"), {
   props: {
     size: {
       type: "choice",
-      options: ["xl", "sm", "md", "lg"],
-      defaultValue: "md"
+      options: ["2xs", "xs", "sm", "md", "lg", "xl", "2xl", "full"]
     },
-    isDisabled: {
-      type: "boolean"
+    max: {
+      type: "number",
+      description: "The maximum number of avatars to show before truncating."
+    },
+    spacing: {
+      type: "string",
+      defaultValue: "-0.75rem"
     },
     children: {
       type: "slot",
-      allowedComponents: ["Checkbox"],
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("Avatar")],
       defaultValue: [{
         type: "component",
-        name: "Checkbox",
+        name: /*#__PURE__*/getPlasmicComponentName("Avatar"),
         props: {
-          value: "1",
-          children: {
-            type: "text",
-            value: "Checkbox 1"
-          }
+          name: "Dan Abrahmov",
+          src: "https://bit.ly/dan-abramov"
         }
       }, {
         type: "component",
-        name: "Checkbox",
+        name: /*#__PURE__*/getPlasmicComponentName("Avatar"),
         props: {
-          value: "2",
-          children: {
-            type: "text",
-            value: "Checkbox 2"
-          }
+          name: "Kola Tioluwani",
+          src: "https://bit.ly/tioluwani-kolawole"
         }
       }, {
         type: "component",
-        name: "Checkbox",
+        name: /*#__PURE__*/getPlasmicComponentName("Avatar"),
         props: {
-          value: "3",
-          children: {
-            type: "text",
-            value: "Checkbox 3"
-          }
+          name: "Kent Dodds",
+          src: "https://bit.ly/kent-c-dodds"
+        }
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("Avatar"),
+        props: {
+          name: "Ryan Florence",
+          src: "https://bit.ly/ryan-florence"
+        }
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("Avatar"),
+        props: {
+          name: "Prosper Otemuyiwa",
+          src: "https://bit.ly/prosper-baba"
+        }
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("Avatar"),
+        props: {
+          name: "Christian Nwamba",
+          src: "https://bit.ly/code-beast"
+        }
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("Avatar"),
+        props: {
+          name: "Segun Adebayo",
+          src: "https://bit.ly/sage-adebayo"
         }
       }]
     }
   }
-};
-function registerCheckboxGroup(loader, customCheckboxGroupMeta) {
+});
+function registerAvatarGroup(loader, customAvatarGroupMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.CheckboxGroup, customCheckboxGroupMeta != null ? customCheckboxGroupMeta : checkboxGroupMeta);
+  doRegisterComponent(react.AvatarGroup, customAvatarGroupMeta != null ? customAvatarGroupMeta : avatarGroupMeta);
 }
 
-var codeMeta = {
-  name: "Code",
+var badgeMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Badge"), {
   importPath: "@chakra-ui/react",
   props: {
     colorScheme: {
@@ -443,652 +359,289 @@ var codeMeta = {
       type: "choice",
       options: ["solid", "subtle", "outline"],
       defaultValue: "subtle"
-    },
-    children: {
-      type: "slot",
-      defaultValue: [{
-        type: "text",
-        value: "Code"
-      }]
     }
   }
-};
-function registerCode(loader, customCodeMeta) {
+});
+function registerBadge(loader, customBadgeMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Code, customCodeMeta != null ? customCodeMeta : codeMeta);
+  doRegisterComponent(react.Badge, customBadgeMeta != null ? customBadgeMeta : badgeMeta);
 }
 
-var dividerMeta = {
-  name: "Divider",
-  importPath: "@chakra-ui/react",
+var breadcrumbItemMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("BreadcrumbItem", "Breadcrumb"), {
   props: {
-    orientation: {
-      type: "choice",
-      options: ["vertical", "horizontal"]
+    isCurrentPage: {
+      type: "boolean"
     },
-    variant: {
-      type: "choice",
-      options: ["solid", "dashed"]
-    }
-  }
-};
-function registerDivider(loader, customDividerMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.Divider, customDividerMeta != null ? customDividerMeta : dividerMeta);
-}
-
-var imageMeta = {
-  name: "Image",
-  importPath: "@chakra-ui/react",
-  props: {
-    src: {
-      type: "string",
-      defaultValue: "https://bit.ly/naruto-sage"
+    isLastChild: {
+      type: "boolean"
     },
-    fallbackSrc: {
+    seperator: {
       type: "string",
-      defaultValue: "https://via.placeholder.com/150"
+      defaultValue: "/"
     },
-    alt: {
+    spacing: {
       type: "string",
-      defaultValueHint: "name of the image"
+      defaultValue: "8px"
     },
-    loading: {
-      type: "choice",
-      options: ["lazy", "eager"]
+    children: {
+      type: "slot",
+      defaultValue: [{
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("BreadcrumbLink"),
+        props: {
+          children: {
+            type: "text",
+            value: "BreadcrumbItem"
+          }
+        }
+      }]
     }
   }
-};
-function registerImage(loader, customImageMeta) {
+});
+function registerBreadcrumbItem(loader, customBreadcrumbItemMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Image, customImageMeta != null ? customImageMeta : imageMeta);
+  doRegisterComponent(react.BreadcrumbItem, customBreadcrumbItemMeta != null ? customBreadcrumbItemMeta : breadcrumbItemMeta);
 }
-
-var inputMeta = {
-  name: "Input",
-  importPath: "@chakra-ui/react",
+var breadcrumbLinkMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("BreadcrumbLink", "BreadcrumbItem"), {
   props: {
-    size: {
-      type: "choice",
-      options: ["xl", "sm", "md", "lg"]
-    },
-    variant: {
-      type: "choice",
-      options: ["outline", "filled", "flushed", "unstyled"]
-    },
-    isDisabled: {
-      type: "boolean"
-    },
-    isInvalid: {
-      type: "boolean"
-    },
-    isReadOnly: {
-      type: "boolean"
-    },
-    isRequired: {
-      type: "boolean"
-    },
-    errorBorderColor: {
+    href: {
       type: "string",
-      defaultValue: "red.500"
+      defaultValue: "#"
     },
-    focusBorderColor: {
-      type: "string",
-      defaultValue: "blue.500"
-    }
-  }
-};
-function registerInput(loader, customInputMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.Input, customInputMeta != null ? customInputMeta : inputMeta);
-}
-
-var kbdMeta = {
-  name: "Kbd",
-  importPath: "@chakra-ui/react",
-  displayName: "Keyboard Key",
-  props: {
     children: {
       type: "slot",
       defaultValue: [{
         type: "text",
-        value: "⌘"
+        value: "Home"
       }]
     }
   }
-};
-function registerKbd(loader, customKbdMeta) {
+});
+function registerBreadcrumbLink(loader, customBreadcrumbLinkMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Kbd, customKbdMeta != null ? customKbdMeta : kbdMeta);
+  doRegisterComponent(react.BreadcrumbLink, customBreadcrumbLinkMeta != null ? customBreadcrumbLinkMeta : breadcrumbLinkMeta);
 }
-
-var numberInputMeta = {
-  name: "NumberInput",
-  importPath: "@chakra-ui/react",
+var breadcrumbMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Breadcrumb"), {
   props: {
-    size: {
-      type: "choice",
-      options: ["xl", "sm", "md", "lg"]
-    },
-    variant: {
-      type: "choice",
-      options: ["outline", "filled", "flushed", "unstyled"]
-    },
-    inputMode: {
-      type: "choice",
-      options: ["text", "search", "none", "tel", "url", "email", "numeric", "decimal"]
-    },
-    format: {
-      type: "string"
-    },
-    step: {
-      type: "number"
-    },
-    precision: {
-      type: "number"
-    },
-    max: {
-      type: "number"
-    },
-    min: {
-      type: "number"
-    },
-    errorBorderColor: {
+    separator: {
       type: "string",
-      defaultValue: "red.500"
+      defaultValue: "/"
     },
-    focusBorderColor: {
+    spacing: {
       type: "string",
-      defaultValue: "blue.500"
-    },
-    allowMouseWheel: {
-      type: "boolean"
-    },
-    isDisabled: {
-      type: "boolean"
-    },
-    isInvalid: {
-      type: "boolean"
-    },
-    isReadOnly: {
-      type: "boolean"
-    },
-    isRequired: {
-      type: "boolean"
+      defaultValue: "8px"
     },
     children: {
       type: "slot",
       defaultValue: [{
         type: "component",
-        name: "NumberInputField"
+        name: /*#__PURE__*/getPlasmicComponentName("BreadcrumbItem"),
+        props: {
+          children: {
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("BreadcrumbLink"),
+            props: {
+              children: {
+                type: "text",
+                value: "Home"
+              }
+            }
+          }
+        }
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("BreadcrumbItem"),
+        props: {
+          children: {
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("BreadcrumbLink"),
+            props: {
+              children: {
+                type: "text",
+                value: "Docs"
+              }
+            }
+          }
+        }
       }, {
         type: "component",
-        name: "NumberInputStepper"
+        name: /*#__PURE__*/getPlasmicComponentName("BreadcrumbItem"),
+        props: {
+          isLastChild: true,
+          isCurrentPage: true,
+          children: {
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("BreadcrumbLink"),
+            props: {
+              children: {
+                type: "text",
+                value: "Breadcrumb"
+              }
+            }
+          }
+        }
       }]
     }
   }
-};
-function registerNumberInput(loader, customNumberInputMeta) {
+});
+function registerBreadcrumb(loader, customBreadcrumbMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.NumberInput, customNumberInputMeta != null ? customNumberInputMeta : numberInputMeta);
+  doRegisterComponent(react.Breadcrumb, customBreadcrumbMeta != null ? customBreadcrumbMeta : breadcrumbMeta);
 }
-var numberInputStepperMeta = {
-  name: "NumberInputStepper",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "NumberInput",
+var breadcrumbSeparatorMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("BreadcrumbSeparator", "Breadcrumb"), {
   props: {
     children: {
       type: "slot",
-      allowedComponents: ["NumberIncrementStepper", "NumberDecrementStepper"],
-      defaultValue: [{
-        type: "component",
-        name: "NumberIncrementStepper"
-      }, {
-        type: "component",
-        name: "NumberDecrementStepper"
-      }]
+      defaultValue: {
+        type: "text",
+        value: "/"
+      }
     }
   }
-};
-function registerNumberInputStepper(loader, customNumberInputStepperMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.NumberInputStepper, customNumberInputStepperMeta != null ? customNumberInputStepperMeta : numberInputStepperMeta);
-}
-var numberDecrementStepperMeta = {
-  name: "NumberDecrementStepper",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "NumberInputStepper",
-  props: {}
-};
-function registerNumberDecrementStepper(loader, customNumberDecrementStepperMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.NumberDecrementStepper, customNumberDecrementStepperMeta != null ? customNumberDecrementStepperMeta : numberDecrementStepperMeta);
-}
-var numberIncrementStepperMeta = {
-  name: "NumberIncrementStepper",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "NumberInputStepper",
-  props: {}
-};
-function registerNumberIncrementStepper(loader, customNumberIncrementStepperMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.NumberIncrementStepper, customNumberIncrementStepperMeta != null ? customNumberIncrementStepperMeta : numberIncrementStepperMeta);
-}
-var numberInputFieldMeta = {
-  name: "NumberInputField",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "NumberInput",
-  props: {}
-};
-function registerNumberInputField(loader, customNumberInputFieldMeta) {
+});
+function registerBreadcrumbSeparator(loader, customBreadcrumbSeparatorMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.NumberInputField, customNumberInputFieldMeta != null ? customNumberInputFieldMeta : numberInputFieldMeta);
+  doRegisterComponent(react.BreadcrumbSeparator, customBreadcrumbSeparatorMeta != null ? customBreadcrumbSeparatorMeta : breadcrumbSeparatorMeta);
 }
 
-var pinInputMeta = {
-  name: "PinInput",
-  importPath: "@chakra-ui/react",
+var buttonGroupMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("ButtonGroup"), {
   props: {
-    size: {
-      type: "choice",
-      options: ["xl", "sm", "md", "lg"]
-    },
-    type: {
+    colorScheme: {
       type: "choice",
-      options: ["number", "alphanumeric"]
+      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"]
     },
-    variant: {
+    size: {
       type: "choice",
-      options: ["outline", "filled", "flushed", "unstyled"]
-    },
-    mask: {
-      type: "boolean",
-      description: "Whether the pin input's value should be masked like 'type=password'."
-    },
-    manageFocus: {
-      type: "boolean",
-      defaultValue: true,
-      description: "Whether the pin input should move automatically to the next input once filled."
+      options: ["xl", "sm", "md", "lg"],
+      defaultValue: "md"
     },
-    autoFocus: {
+    isAttached: {
       type: "boolean",
-      description: "Whether the pin input should be focused on mount."
+      defaultValue: false
     },
-    opt: {
+    isDisabled: {
       type: "boolean",
-      description: "autocomplete='one-time-code'"
-    },
-    errorBorderColor: {
-      type: "string",
-      defaultValue: "red.500"
+      defaultValue: false
     },
-    focusBorderColor: {
+    spacing: {
       type: "string",
-      defaultValue: "blue.500"
-    },
-    isDisabled: {
-      type: "boolean"
-    },
-    isInvalid: {
-      type: "boolean"
+      defaultValue: "0.5rem"
     },
     children: {
       type: "slot",
-      allowedComponents: ["PintInputField"],
       defaultValue: [{
         type: "component",
-        name: "PinInputField"
-      }, {
-        type: "component",
-        name: "PinInputField"
-      }, {
-        type: "component",
-        name: "PinInputField"
+        name: /*#__PURE__*/getPlasmicComponentName("Button"),
+        props: {
+          children: {
+            type: "text",
+            value: "Button 1"
+          }
+        }
       }, {
         type: "component",
-        name: "PinInputField"
+        name: /*#__PURE__*/getPlasmicComponentName("Button"),
+        props: {
+          children: {
+            type: "text",
+            value: "Button 2"
+          }
+        }
       }]
     }
   }
-};
-function registerPinInput(loader, customPinInputMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.PinInput, customPinInputMeta != null ? customPinInputMeta : pinInputMeta);
-}
-var pinInputFieldMeta = {
-  name: "PinInputField",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "PinInput",
-  props: {}
-};
-function registerPinInputField(loader, customPinInputFieldMeta) {
+});
+function registerButtonGroup(loader, customButtonGroupMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.PinInputField, customPinInputFieldMeta != null ? customPinInputFieldMeta : pinInputFieldMeta);
+  doRegisterComponent(react.ButtonGroup, customButtonGroupMeta != null ? customButtonGroupMeta : buttonGroupMeta);
 }
-
-var popoverMeta = {
-  name: "Popover",
-  importPath: "@chakra-ui/react",
+var buttonMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Button", "ButtonGroup"), {
   props: {
-    gutter: {
-      type: "number",
-      defaultValue: 8
-    },
-    arrowPadding: "number",
-    arrowShadowColor: {
-      type: "string",
-      defaultValue: "rgba(0, 0, 0, 0.15)"
-    },
-    arrowSize: {
-      type: "number"
-    },
-    offset: {
-      type: "array",
-      defaultValue: [0, 0]
-    },
-    closeDelay: "number",
-    orientation: {
+    size: {
       type: "choice",
-      options: ["horizontal", "vertical"]
+      options: ["xl", "sm", "md", "lg"]
     },
-    placement: {
+    variant: {
       type: "choice",
-      options: ["top", "bottom", "left", "right"],
-      defaultValue: "bottom"
+      options: ["ghost", "outline", "solid", "link", "unstyled"],
+      defaultValue: "solid"
     },
-    direction: {
+    colorScheme: {
       type: "choice",
-      options: ["ltr", "rtl"],
-      defaultValue: "ltr"
+      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"]
     },
-    trigger: {
-      type: "choice",
-      options: ["click", "hover"],
-      defaultValue: "click"
+    iconSpacing: "number",
+    isActive: {
+      type: "boolean"
     },
-    isLazy: {
+    isDisabled: {
       type: "boolean"
     },
-    isOpen: {
+    isLoading: {
       type: "boolean"
     },
-    children: {
-      type: "slot",
-      defaultValue: [{
-        type: "component",
-        name: "PopoverTrigger"
-      }, {
-        type: "component",
-        name: "PopoverContent"
-      }]
-    }
-  }
-};
-function registerPopover(loader, customPopoverMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.Popover, customPopoverMeta != null ? customPopoverMeta : popoverMeta);
-}
-var popoverContentMeta = {
-  name: "PopoverContent",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Popover",
-  props: {
-    children: {
-      type: "slot",
-      defaultValue: [{
-        type: "component",
-        name: "PopoverArrow"
-      }, {
-        type: "component",
-        name: "PopoverCloseButton"
-      }, {
-        type: "component",
-        name: "PopoverHeader",
-        props: {
-          children: {
-            type: "text",
-            value: "Confirmation!"
-          }
-        }
-      }, {
-        type: "component",
-        name: "PopoverBody",
-        props: {
-          children: {
-            type: "text",
-            value: "Are you sure you want to have that milkshake?"
-          }
-        }
-      }]
-    }
-  }
-};
-function registerPopoverContent(loader, customPopoverContentMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.PopoverContent, customPopoverContentMeta != null ? customPopoverContentMeta : popoverContentMeta);
-}
-var popoverArrowMeta = {
-  name: "PopoverArrow",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "PopoverContent",
-  props: {}
-};
-function registerPopoverArrow(loader, customPopoverArrowMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.PopoverArrow, customPopoverArrowMeta != null ? customPopoverArrowMeta : popoverArrowMeta);
-}
-var popoverCloseButtonMeta = {
-  name: "PopoverCloseButton",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "PopoverContent",
-  props: {}
-};
-function registerPopoverCloseButton(loader, customPopoverCloseButtonMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.PopoverCloseButton, customPopoverCloseButtonMeta != null ? customPopoverCloseButtonMeta : popoverCloseButtonMeta);
-}
-var popoverHeaderMeta = {
-  name: "PopoverHeader",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "PopoverContent",
-  props: {
     children: {
       type: "slot",
       defaultValue: {
         type: "text",
-        value: "Confirmation!"
+        value: "Button"
       }
     }
   }
-};
-function registerPopoverHeader(loader, customPopoverHeaderMeta) {
+});
+function registerButton(loader, customButtonMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.PopoverHeader, customPopoverHeaderMeta != null ? customPopoverHeaderMeta : popoverHeaderMeta);
+  doRegisterComponent(react.Button, customButtonMeta != null ? customButtonMeta : buttonMeta);
 }
-var popoverBodyMeta = {
-  name: "PopoverBody",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "PopoverContent",
-  props: {
-    children: {
-      type: "slot",
-      defaultValue: {
-        type: "text",
-        value: "Are you sure you want to have that milkshake?"
-      }
-    }
-  }
-};
-function registerPopoverBody(loader, customPopoverBodyMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
 
-  doRegisterComponent(react.PopoverBody, customPopoverBodyMeta != null ? customPopoverBodyMeta : popoverBodyMeta);
-}
-var popoverTriggerMeta = {
-  name: "PopoverTrigger",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Popover",
+var chakraProviderMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("ChakraProvider"), {
   props: {
-    children: {
-      type: "slot",
-      defaultValue: {
-        type: "component",
-        name: "Button",
-        props: {
-          children: {
-            type: "text",
-            value: "Trigger"
-          }
-        }
-      }
-    }
+    theme: "object"
   }
-};
-function registerPopoverTrigger(loader, customPopoverTriggerMeta) {
+});
+function registerChakraProvider(loader, customChakraProviderMeta) {
   var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+    return loader ? loader.registerGlobalContext.apply(loader, arguments) : registerGlobalContext.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.PopoverTrigger, customPopoverTriggerMeta != null ? customPopoverTriggerMeta : popoverTriggerMeta);
+  doRegisterComponent(react.ChakraProvider, customChakraProviderMeta != null ? customChakraProviderMeta : chakraProviderMeta);
 }
 
-var radioGroupMeta = {
-  name: "RadioGroup",
-  importPath: "@chakra-ui/react",
+var checkboxMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Checkbox", "CheckboxGroup"), {
   props: {
-    value: {
-      type: "string"
+    colorScheme: {
+      type: "choice",
+      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"],
+      defaultValue: "blue"
     },
     size: {
       type: "choice",
       options: ["xl", "sm", "md", "lg"]
     },
-    isDisabled: {
-      type: "boolean"
-    },
-    isInvalid: {
-      type: "boolean"
-    },
-    isReadOnly: {
-      type: "boolean"
-    },
-    isRequired: {
-      type: "boolean"
-    },
-    children: {
-      type: "slot",
-      defaultValue: {
-        type: "hbox",
-        styles: {
-          gap: "12px"
-        },
-        children: [{
-          type: "component",
-          name: "Radio",
-          props: {
-            value: "1",
-            children: {
-              type: "text",
-              value: "Radio 1"
-            }
-          }
-        }, {
-          type: "component",
-          name: "Radio",
-          props: {
-            value: "2",
-            children: {
-              type: "text",
-              value: "Radio 2"
-            }
-          }
-        }, {
-          type: "component",
-          name: "Radio",
-          props: {
-            value: "3",
-            children: {
-              type: "text",
-              value: "Radio 3"
-            }
-          }
-        }]
-      }
-    }
-  }
-};
-function registerRadioGroup(loader, customRadioGroupMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.RadioGroup, customRadioGroupMeta != null ? customRadioGroupMeta : radioGroupMeta);
-}
-var radioMeta = {
-  name: "Radio",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "RadioGroup",
-  props: {
     value: {
       type: "string"
     },
-    size: {
-      type: "choice",
-      options: ["xl", "sm", "md", "lg"]
-    },
     spacing: {
       type: "string",
       defaultValue: "0.5rem"
@@ -1096,1438 +649,1764 @@ var radioMeta = {
     isChecked: {
       type: "boolean"
     },
-    isDisabled: {
+    isIndeterminate: {
       type: "boolean"
     },
-    isInvalid: {
+    isDisabled: {
       type: "boolean"
     },
-    isReadOnly: {
+    isRequired: {
       type: "boolean"
     },
-    isRequired: {
+    isInvalid: {
       type: "boolean"
     },
     children: {
       type: "slot",
-      defaultValue: [{
+      defaultValue: {
         type: "text",
-        value: "Radio"
-      }]
+        value: "Checkbox"
+      }
     }
   }
-};
-function registerRadio(loader, customRadioMeta) {
+});
+function registerCheckbox(loader, customCheckboxMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Radio, customRadioMeta != null ? customRadioMeta : radioMeta);
+  doRegisterComponent(react.Checkbox, customCheckboxMeta != null ? customCheckboxMeta : checkboxMeta);
 }
-
-var selectMeta = {
-  name: "Select",
-  importPath: "@chakra-ui/react",
+var checkboxGroupMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("CheckboxGroup"), {
   props: {
     size: {
       type: "choice",
-      options: ["lg", "md", "sm", "xs"],
+      options: ["xl", "sm", "md", "lg"],
       defaultValue: "md"
     },
-    variant: {
-      type: "choice",
-      options: ["outline", "filled", "flushed", "unstyled"],
-      defaultValue: "outline"
-    },
-    placeholder: {
-      type: "string"
-    },
-    errorBorderColor: {
-      type: "string",
-      defaultValueHint: "red.500"
-    },
     isDisabled: {
       type: "boolean"
     },
-    isInvalid: {
-      type: "boolean"
-    },
-    isReadOnly: {
-      type: "boolean"
-    },
-    isRequred: {
-      type: "boolean"
-    },
     children: {
       type: "slot",
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("Checkbox")],
       defaultValue: [{
         type: "component",
-        name: "Option",
+        name: /*#__PURE__*/getPlasmicComponentName("Checkbox"),
         props: {
+          value: "1",
           children: {
             type: "text",
-            value: "Option 01"
+            value: "Checkbox 1"
           }
         }
       }, {
         type: "component",
-        name: "Option",
+        name: /*#__PURE__*/getPlasmicComponentName("Checkbox"),
         props: {
+          value: "2",
           children: {
             type: "text",
-            value: "Option 02"
+            value: "Checkbox 2"
           }
         }
       }, {
         type: "component",
-        name: "Option",
+        name: /*#__PURE__*/getPlasmicComponentName("Checkbox"),
         props: {
+          value: "3",
           children: {
             type: "text",
-            value: "Option 03"
+            value: "Checkbox 3"
           }
         }
       }]
     }
   }
-};
-function registerSelect(loader, customSelectMeta) {
+});
+function registerCheckboxGroup(loader, customCheckboxGroupMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Select, customSelectMeta != null ? customSelectMeta : selectMeta);
-}
-function Option(props) {
-  var value = props.value,
-      className = props.className,
-      children = props.children;
-  return React.createElement("option", {
-    className: className,
-    value: value
-  }, children);
+  doRegisterComponent(react.CheckboxGroup, customCheckboxGroupMeta != null ? customCheckboxGroupMeta : checkboxGroupMeta);
 }
-var optionMeta = {
-  name: "Option",
-  importPath: "@plasmicpkgs/plasmic-chakra-ui",
-  parentComponentName: "Select",
+
+var codeMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Code"), {
   props: {
-    value: "string",
-    children: {
-      type: "slot",
-      defaultValue: {
-        type: "text",
-        value: "Option"
-      }
+    colorScheme: {
+      type: "choice",
+      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"],
+      defaultValue: "gray"
+    },
+    variant: {
+      type: "choice",
+      options: ["solid", "subtle", "outline"],
+      defaultValue: "subtle"
+    },
+    children: {
+      type: "slot",
+      defaultValue: [{
+        type: "text",
+        value: "Code"
+      }]
     }
   }
-};
-function registerOption(loader, customOptionMeta) {
+});
+function registerCode(loader, customCodeMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(Option, customOptionMeta != null ? customOptionMeta : optionMeta);
+  doRegisterComponent(react.Code, customCodeMeta != null ? customCodeMeta : codeMeta);
 }
 
-var statMeta = {
-  name: "Stat",
-  importPath: "@chakra-ui/react",
+var dividerMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Divider"), {
+  props: {
+    orientation: {
+      type: "choice",
+      options: ["vertical", "horizontal"]
+    },
+    variant: {
+      type: "choice",
+      options: ["solid", "dashed"]
+    }
+  }
+});
+function registerDivider(loader, customDividerMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.Divider, customDividerMeta != null ? customDividerMeta : dividerMeta);
+}
+
+var formControlMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("FormControl"), {
   props: {
+    label: "string",
+    isDisabled: "boolean",
+    isInvalid: "boolean",
+    isRequired: "boolean",
+    isreadOnly: "boolean",
     children: {
       type: "slot",
       defaultValue: [{
         type: "component",
-        name: "StatLabel",
-        props: {
-          children: {
-            type: "text",
-            value: "Collected Fees"
-          }
-        }
-      }, {
-        type: "component",
-        name: "StatNumber",
-        props: {
-          children: {
-            type: "text",
-            value: "£345,670"
-          }
-        }
+        name: /*#__PURE__*/getPlasmicComponentName("FormLabel")
       }, {
         type: "component",
-        name: "StatHelpText",
-        props: {
-          children: {
-            type: "hbox",
-            styles: {
-              alignItems: "center",
-              padding: "0px"
-            },
-            children: [{
-              type: "component",
-              name: "StatArrow",
-              props: {
-                type: "increase"
-              }
-            }, {
-              type: "text",
-              value: "Last 7 days"
-            }]
-          }
-        }
+        name: /*#__PURE__*/getPlasmicComponentName("Input")
       }]
     }
   }
-};
-function registerStat(loader, customStatMeta) {
+});
+function registerFormControl(loader, customFormControlMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Stat, customStatMeta != null ? customStatMeta : statMeta);
+  doRegisterComponent(react.FormControl, customFormControlMeta != null ? customFormControlMeta : formControlMeta);
 }
-var statHelpTextMeta = {
-  name: "StatHelpText",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Stat",
+var formLabelMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("FormLabel", "FormControl"), {
   props: {
     children: {
       type: "slot",
-      defaultValue: [{
+      defaultValue: {
         type: "text",
-        value: "StatHelpText"
-      }]
+        value: "Label",
+        styles: {
+          display: "inline-block",
+          width: "auto"
+        }
+      }
     }
   }
-};
-function registerStatHelpText(loader, customStatHelpTextMeta) {
+});
+function registerFormLabel(loader, customFormLabelMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.StatHelpText, customStatHelpTextMeta != null ? customStatHelpTextMeta : statHelpTextMeta);
+  doRegisterComponent(react.FormLabel, customFormLabelMeta != null ? customFormLabelMeta : formLabelMeta);
 }
-var statArrowMeta = {
-  name: "StatArrow",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Stat",
+var formHelperTextMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("FormHelperText", "FormControl"), {
   props: {
-    type: {
-      type: "choice",
-      options: ["increase", "decrease"]
+    children: {
+      type: "slot",
+      defaultValue: {
+        type: "text",
+        value: "We'll never share your email."
+      }
     }
   }
-};
-function registerStatArrow(loader, customStatArrowMeta) {
+});
+function registerFormHelperText(loader, customFormHelperTextMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.StatArrow, customStatArrowMeta != null ? customStatArrowMeta : statArrowMeta);
+  doRegisterComponent(react.FormHelperText, customFormHelperTextMeta != null ? customFormHelperTextMeta : formHelperTextMeta);
 }
-var statNumberMeta = {
-  name: "StatNumber",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Stat",
+var formErrorMessageMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("FormErrorMessage", "FormControl"), {
   props: {
     children: {
       type: "slot",
-      defaultValue: [{
+      defaultValue: {
         type: "text",
-        value: "£345,670"
-      }]
+        value: "This is an error message."
+      }
     }
   }
-};
-function registerStatNumber(loader, customStatNumberMeta) {
+});
+function registerFormErrorMessage(loader, customFormErrorMessageMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.StatNumber, customStatNumberMeta != null ? customStatNumberMeta : statNumberMeta);
+  doRegisterComponent(react.FormErrorMessage, customFormErrorMessageMeta != null ? customFormErrorMessageMeta : formErrorMessageMeta);
 }
-var statLabelMeta = {
-  name: "StatLabel",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Stat",
+
+var headingMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Heading"), {
   props: {
     children: {
       type: "slot",
-      defaultValue: [{
+      defaultValue: {
         type: "text",
-        value: "StatLabel"
-      }]
+        value: "Basic text writing, including headings, body text, lists, and more."
+      }
+    },
+    size: {
+      type: "choice",
+      options: ["4xl", "3xl", "2xl", "xl", "lg", "md", "sm", "xs"],
+      defaultValue: "xl"
+    },
+    noOfLines: {
+      type: "number",
+      defaultValue: 1
     }
   }
-};
-function registerStatLabel(loader, customStatLabelMeta) {
+});
+function registerHeading(loader, customHeadingMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.StatLabel, customStatLabelMeta != null ? customStatLabelMeta : statLabelMeta);
+  doRegisterComponent(react.Heading, customHeadingMeta != null ? customHeadingMeta : headingMeta);
 }
 
-var switchMeta = {
-  name: "Switch",
-  importPath: "@chakra-ui/react",
+var highlightMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Highlight"), {
   props: {
-    isChecked: "boolean",
-    colorScheme: {
-      type: "choice",
-      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"],
-      defaultValue: "blue"
+    children: {
+      displayName: "text",
+      type: "string",
+      defaultValue: "With the Highlight component, you can spotlight words."
     },
-    size: {
-      type: "choice",
-      options: ["sm", "md", "lg"],
-      defaultValue: "md"
+    query: {
+      type: "array",
+      defaultValue: ["Spotlight", "words"]
     },
-    spacing: {
+    styles: {
+      type: "object",
+      defaultValue: {
+        backgroundColor: "orange.100",
+        px: "0.3em",
+        py: "0.1em",
+        borderRadius: "0.3em"
+      }
+    }
+  }
+});
+function registerHighlight(loader, customHighlightMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.Highlight, customHighlightMeta != null ? customHighlightMeta : highlightMeta);
+}
+
+var imageMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Image"), {
+  props: {
+    src: {
       type: "string",
-      defaultValue: "0.5rem"
+      defaultValue: "https://bit.ly/naruto-sage"
     },
-    id: "string",
-    isDisabled: "boolean",
-    isInvalid: "boolean",
-    isReadOnly: "boolean",
-    isRequired: "boolean"
+    fallbackSrc: {
+      type: "string",
+      defaultValue: "https://via.placeholder.com/150"
+    },
+    alt: {
+      type: "string",
+      defaultValueHint: "name of the image"
+    },
+    loading: {
+      type: "choice",
+      options: ["lazy", "eager"]
+    }
   }
-};
-function registerSwitch(loader, customSwitchMeta) {
+});
+function registerImage(loader, customImageMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Switch, customSwitchMeta != null ? customSwitchMeta : switchMeta);
+  doRegisterComponent(react.Image, customImageMeta != null ? customImageMeta : imageMeta);
 }
 
-var tableMeta = {
-  name: "Table",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "TableContainer",
+var inputMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Input"), {
   props: {
-    colorScheme: {
-      type: "choice",
-      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"],
-      defaultValue: "gray"
-    },
     size: {
       type: "choice",
-      options: ["sm", "md", "lg"],
-      defaultValue: "md"
+      options: ["xl", "sm", "md", "lg"]
     },
     variant: {
       type: "choice",
-      options: ["simple", "striped", "unstyled"],
-      defaultValue: "simple"
+      options: ["outline", "filled", "flushed", "unstyled"]
     },
-    children: {
-      type: "slot"
+    isDisabled: {
+      type: "boolean"
+    },
+    isInvalid: {
+      type: "boolean"
+    },
+    isReadOnly: {
+      type: "boolean"
+    },
+    isRequired: {
+      type: "boolean"
+    },
+    errorBorderColor: {
+      type: "string",
+      defaultValue: "red.500"
+    },
+    focusBorderColor: {
+      type: "string",
+      defaultValue: "blue.500"
     }
   }
-};
-function registerTable(loader, customTableMeta) {
+});
+function registerInput(loader, customInputMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Table, customTableMeta != null ? customTableMeta : tableMeta);
+  doRegisterComponent(react.Input, customInputMeta != null ? customInputMeta : inputMeta);
 }
-var tableCaptionMeta = {
-  name: "TableCaption",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Table",
+
+var kbdMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Kbd", undefined, {
+  displayName: "Chakra-UI Keyboard Key"
+}), {
   props: {
-    placement: {
-      type: "choice",
-      options: ["top", "bottom"],
-      defaultValue: "bottom"
-    },
     children: {
       type: "slot",
-      defaultValue: {
+      defaultValue: [{
         type: "text",
-        value: "Imperial to metric conversion factors"
-      }
+        value: "⌘"
+      }]
     }
   }
-};
-function registerTableCaption(loader, customTableCaptionMeta) {
+});
+function registerKbd(loader, customKbdMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.TableCaption, customTableCaptionMeta != null ? customTableCaptionMeta : tableCaptionMeta);
+  doRegisterComponent(react.Kbd, customKbdMeta != null ? customKbdMeta : kbdMeta);
 }
-var theadMeta = {
-  name: "Thead",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Table",
+
+var numberInputMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("NumberInput"), {
   props: {
+    size: {
+      type: "choice",
+      options: ["xl", "sm", "md", "lg"]
+    },
+    variant: {
+      type: "choice",
+      options: ["outline", "filled", "flushed", "unstyled"]
+    },
+    inputMode: {
+      type: "choice",
+      options: ["text", "search", "none", "tel", "url", "email", "numeric", "decimal"]
+    },
+    format: {
+      type: "string"
+    },
+    step: {
+      type: "number"
+    },
+    precision: {
+      type: "number"
+    },
+    max: {
+      type: "number"
+    },
+    min: {
+      type: "number"
+    },
+    errorBorderColor: {
+      type: "string",
+      defaultValue: "red.500"
+    },
+    focusBorderColor: {
+      type: "string",
+      defaultValue: "blue.500"
+    },
+    allowMouseWheel: {
+      type: "boolean"
+    },
+    isDisabled: {
+      type: "boolean"
+    },
+    isInvalid: {
+      type: "boolean"
+    },
+    isReadOnly: {
+      type: "boolean"
+    },
+    isRequired: {
+      type: "boolean"
+    },
     children: {
       type: "slot",
-      allowedComponents: ["Th", "Tr"]
+      defaultValue: [{
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("NumberInputField")
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("NumberInputStepper")
+      }]
     }
   }
-};
-function registerThead(loader, customTheadMeta) {
+});
+function registerNumberInput(loader, customNumberInputMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Thead, customTheadMeta != null ? customTheadMeta : theadMeta);
+  doRegisterComponent(react.NumberInput, customNumberInputMeta != null ? customNumberInputMeta : numberInputMeta);
 }
-var tbodyMeta = {
-  name: "Tbody",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Table",
+var numberInputStepperMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("NumberInputStepper", "NumberInput"), {
   props: {
     children: {
       type: "slot",
-      allowedComponents: ["Td", "Tr"]
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("NumberIncrementStepper"), /*#__PURE__*/getPlasmicComponentName("NumberDecrementStepper")],
+      defaultValue: [{
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("NumberIncrementStepper")
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("NumberDecrementStepper")
+      }]
     }
   }
-};
-function registerTbody(loader, customTbodyMeta) {
+});
+function registerNumberInputStepper(loader, customNumberInputStepperMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Tbody, customTbodyMeta != null ? customTbodyMeta : tbodyMeta);
+  doRegisterComponent(react.NumberInputStepper, customNumberInputStepperMeta != null ? customNumberInputStepperMeta : numberInputStepperMeta);
 }
-var trMeta = {
-  name: "Tr",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Table",
-  props: {
-    children: {
-      type: "slot",
-      allowedComponents: ["Td", "Th"]
-    }
-  }
-};
-function registerTr(loader, customTrMeta) {
+var numberDecrementStepperMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("NumberDecrementStepper", "NumberInputStepper"), {
+  props: {}
+});
+function registerNumberDecrementStepper(loader, customNumberDecrementStepperMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Tr, customTrMeta != null ? customTrMeta : trMeta);
+  doRegisterComponent(react.NumberDecrementStepper, customNumberDecrementStepperMeta != null ? customNumberDecrementStepperMeta : numberDecrementStepperMeta);
 }
-var tdMeta = {
-  name: "Td",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Tr",
-  props: {
-    isNumeric: "boolean",
-    children: {
-      type: "slot",
-      defaultValue: {
-        type: "text",
-        value: "Table Cell"
-      }
-    }
-  }
-};
-function registerTd(loader, customTdMeta) {
+var numberIncrementStepperMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("NumberIncrementStepper", "NumberInputStepper"), {
+  props: {}
+});
+function registerNumberIncrementStepper(loader, customNumberIncrementStepperMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Td, customTdMeta != null ? customTdMeta : tdMeta);
+  doRegisterComponent(react.NumberIncrementStepper, customNumberIncrementStepperMeta != null ? customNumberIncrementStepperMeta : numberIncrementStepperMeta);
 }
-var thMeta = {
-  name: "Th",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Tr",
+var numberInputFieldMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("NumberInputField", "NumberInput"), {
+  props: {}
+});
+function registerNumberInputField(loader, customNumberInputFieldMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.NumberInputField, customNumberInputFieldMeta != null ? customNumberInputFieldMeta : numberInputFieldMeta);
+}
+
+var pinInputMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("PinInput"), {
   props: {
-    isNumeric: "boolean",
+    size: {
+      type: "choice",
+      options: ["xl", "sm", "md", "lg"]
+    },
+    type: {
+      type: "choice",
+      options: ["number", "alphanumeric"]
+    },
+    variant: {
+      type: "choice",
+      options: ["outline", "filled", "flushed", "unstyled"]
+    },
+    mask: {
+      type: "boolean",
+      description: "Whether the pin input's value should be masked like 'type=password'."
+    },
+    manageFocus: {
+      type: "boolean",
+      defaultValue: true,
+      description: "Whether the pin input should move automatically to the next input once filled."
+    },
+    autoFocus: {
+      type: "boolean",
+      description: "Whether the pin input should be focused on mount."
+    },
+    opt: {
+      type: "boolean",
+      description: "autocomplete='one-time-code'"
+    },
+    errorBorderColor: {
+      type: "string",
+      defaultValue: "red.500"
+    },
+    focusBorderColor: {
+      type: "string",
+      defaultValue: "blue.500"
+    },
+    isDisabled: {
+      type: "boolean"
+    },
+    isInvalid: {
+      type: "boolean"
+    },
     children: {
       type: "slot",
-      defaultValue: {
-        type: "text",
-        value: "Table Cell"
-      }
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("PinInputField")],
+      defaultValue: [{
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("PinInputField")
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("PinInputField")
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("PinInputField")
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("PinInputField")
+      }]
     }
   }
-};
-function registerTh(loader, customThMeta) {
+});
+function registerPinInput(loader, customPinInputMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Th, customThMeta != null ? customThMeta : thMeta);
+  doRegisterComponent(react.PinInput, customPinInputMeta != null ? customPinInputMeta : pinInputMeta);
 }
-var tableContainerMeta = {
-  name: "TableContainer",
-  importPath: "@chakra-ui/react",
+var pinInputFieldMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("PinInputField", "PinInput"), {
+  props: {}
+});
+function registerPinInputField(loader, customPinInputFieldMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.PinInputField, customPinInputFieldMeta != null ? customPinInputFieldMeta : pinInputFieldMeta);
+}
+
+var popoverMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Popover"), {
   props: {
-    overflowX: {
+    gutter: {
+      type: "number",
+      defaultValue: 8
+    },
+    arrowPadding: "number",
+    arrowShadowColor: {
+      type: "string",
+      defaultValue: "rgba(0, 0, 0, 0.15)"
+    },
+    arrowSize: {
+      type: "number"
+    },
+    offset: {
+      type: "array",
+      defaultValue: [0, 0]
+    },
+    closeDelay: "number",
+    orientation: {
       type: "choice",
-      options: ["auto", "scroll", "hidden", "visible"]
+      options: ["horizontal", "vertical"]
     },
-    overflowY: {
+    placement: {
       type: "choice",
-      options: ["auto", "scroll", "hidden", "visible"]
+      options: ["top", "bottom", "left", "right"],
+      defaultValue: "bottom"
     },
-    whiteSpace: {
+    direction: {
       type: "choice",
-      options: ["normal", "nowrap", "pre", "pre-line", "pre-wrap"]
+      options: ["ltr", "rtl"],
+      defaultValue: "ltr"
+    },
+    trigger: {
+      type: "choice",
+      options: ["click", "hover"],
+      defaultValue: "click"
+    },
+    isLazy: {
+      type: "boolean"
+    },
+    isOpen: {
+      type: "boolean"
     },
     children: {
       type: "slot",
-      allowedComponents: ["Table"],
-      defaultValue: {
+      defaultValue: [{
         type: "component",
-        name: "Table",
-        props: {
-          children: [{
-            type: "component",
-            name: "Thead",
-            props: {
-              children: {
-                type: "component",
-                name: "Tr",
-                props: {
-                  children: [{
-                    type: "component",
-                    name: "Th",
-                    props: {
-                      children: {
-                        type: "text",
-                        value: "TO CONVERT"
-                      }
-                    }
-                  }, {
-                    type: "component",
-                    name: "Th",
-                    props: {
-                      children: {
-                        type: "text",
-                        value: "INTO"
-                      }
-                    }
-                  }, {
-                    type: "component",
-                    name: "Th",
-                    props: {
-                      children: {
-                        type: "text",
-                        value: "MULTIPLY BY"
-                      }
-                    }
-                  }]
-                }
-              }
-            }
-          }, {
-            type: "component",
-            name: "Tbody",
-            props: {
-              children: [{
-                type: "component",
-                name: "Tr",
-                props: {
-                  children: [{
-                    type: "component",
-                    name: "Td",
-                    props: {
-                      children: {
-                        type: "text",
-                        value: "inches"
-                      }
-                    }
-                  }, {
-                    type: "component",
-                    name: "Td",
-                    props: {
-                      children: {
-                        type: "text",
-                        value: "millimetres (mm)"
-                      }
-                    }
-                  }, {
-                    type: "component",
-                    name: "Td",
-                    props: {
-                      children: {
-                        type: "text",
-                        value: "25.4"
-                      }
-                    }
-                  }]
-                }
-              }]
-            }
-          }]
-        }
-      }
+        name: /*#__PURE__*/getPlasmicComponentName("PopoverTrigger")
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("PopoverContent")
+      }]
     }
   }
-};
-function registerTableContainer(loader, customTableContainerMeta) {
+});
+function registerPopover(loader, customPopoverMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.TableContainer, customTableContainerMeta != null ? customTableContainerMeta : tableContainerMeta);
+  doRegisterComponent(react.Popover, customPopoverMeta != null ? customPopoverMeta : popoverMeta);
 }
-var tfootMeta = {
-  name: "Tfoot",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Table",
+var popoverContentMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("PopoverContent", "Popover"), {
   props: {
     children: {
       type: "slot",
       defaultValue: [{
         type: "component",
-        name: "Tr",
+        name: /*#__PURE__*/getPlasmicComponentName("PopoverArrow")
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("PopoverCloseButton")
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("PopoverHeader"),
         props: {
-          children: [{
-            type: "component",
-            name: "Th",
-            props: {
-              children: {
-                type: "text",
-                value: "Name"
-              }
-            }
-          }]
+          children: {
+            type: "text",
+            value: "Confirmation!"
+          }
+        }
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("PopoverBody"),
+        props: {
+          children: {
+            type: "text",
+            value: "Are you sure you want to have that milkshake?"
+          }
         }
       }]
     }
   }
-};
-function registerTfoot(loader, customTfootMeta) {
+});
+function registerPopoverContent(loader, customPopoverContentMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Tfoot, customTfootMeta != null ? customTfootMeta : tfootMeta);
+  doRegisterComponent(react.PopoverContent, customPopoverContentMeta != null ? customPopoverContentMeta : popoverContentMeta);
 }
-
-var tabListMeta = {
-  name: "TabList",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Tabs",
-  props: {
-    children: {
-      type: "slot",
-      allowedComponents: ["Tab"]
-    }
-  }
-};
-function registerTabList(loader, customTabListMeta) {
+var popoverArrowMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("PopoverArrow", "PopoverContent"), {
+  props: {}
+});
+function registerPopoverArrow(loader, customPopoverArrowMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.TabList, customTabListMeta != null ? customTabListMeta : tabListMeta);
+  doRegisterComponent(react.PopoverArrow, customPopoverArrowMeta != null ? customPopoverArrowMeta : popoverArrowMeta);
 }
-var tabsMeta = {
-  name: "Tabs",
-  importPath: "@chakra-ui/react",
-  props: {
-    align: {
-      type: "choice",
-      options: ["start", "center", "end"]
-    },
-    colorScheme: {
-      type: "choice",
-      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"]
-    },
-    orientation: {
-      type: "choice",
-      options: ["horizontal", "vertical"]
-    },
-    size: {
-      type: "choice",
-      options: ["sm", "md", "lg"]
-    },
-    variant: {
-      type: "choice",
-      options: ["line", "enclosed", "enclosed-colored", "soft-rounded", "solid-rounded", "unstyled"],
-      defaultValue: "line"
-    },
-    direction: {
-      type: "choice",
-      options: ["ltr", "rtl"]
-    },
-    index: {
-      type: "number"
-    },
-    isFitted: "boolean",
-    isLazy: "boolean",
-    isManual: "boolean",
-    children: {
-      type: "slot",
-      allowedComponents: ["TabList", "TabPanels"],
-      defaultValue: [{
-        type: "component",
-        name: "TabList",
-        props: {
-          children: [{
-            type: "component",
-            name: "Tab",
-            props: {
-              children: {
-                type: "text",
-                value: "Tab 1"
-              }
-            }
-          }, {
-            type: "component",
-            name: "Tab",
-            props: {
-              children: {
-                type: "text",
-                value: "Tab 2"
-              }
-            }
-          }, {
-            type: "component",
-            name: "Tab",
-            props: {
-              children: {
-                type: "text",
-                value: "Tab 3"
-              }
-            }
-          }]
-        }
-      }, {
-        type: "component",
-        name: "TabPanels",
-        props: {
-          children: [{
-            type: "component",
-            name: "TabPanel",
-            props: {
-              children: {
-                type: "text",
-                value: "Tab 1's Panel Content"
-              }
-            }
-          }, {
-            type: "component",
-            name: "TabPanel",
-            props: {
-              children: {
-                type: "text",
-                value: "Tab 2's Panel Content"
-              }
-            }
-          }, {
-            type: "component",
-            name: "TabPanel",
-            props: {
-              children: {
-                type: "text",
-                value: "Tab 3's Panel Content"
-              }
-            }
-          }]
-        }
-      }]
-    }
-  }
-};
-function registerTabs(loader, customTabsMeta) {
+var popoverCloseButtonMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("PopoverCloseButton", "PopoverContent"), {
+  props: {}
+});
+function registerPopoverCloseButton(loader, customPopoverCloseButtonMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Tabs, customTabsMeta != null ? customTabsMeta : tabsMeta);
+  doRegisterComponent(react.PopoverCloseButton, customPopoverCloseButtonMeta != null ? customPopoverCloseButtonMeta : popoverCloseButtonMeta);
 }
-var tabMeta = {
-  name: "Tab",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "TabList",
+var popoverHeaderMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("PopoverHeader", "PopoverContent"), {
   props: {
-    id: "string",
-    isDisabled: "boolean",
-    panelId: "string",
     children: {
       type: "slot",
       defaultValue: {
         type: "text",
-        value: "Tab"
+        value: "Confirmation!"
       }
     }
   }
-};
-function registerTab(loader, customTabMeta) {
+});
+function registerPopoverHeader(loader, customPopoverHeaderMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Tab, customTabMeta != null ? customTabMeta : tabMeta);
+  doRegisterComponent(react.PopoverHeader, customPopoverHeaderMeta != null ? customPopoverHeaderMeta : popoverHeaderMeta);
 }
-var tabPanelsMeta = {
-  name: "TabPanels",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Tabs",
+var popoverBodyMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("PopoverBody", "PopoverContent"), {
   props: {
     children: {
       type: "slot",
-      allowedComponents: ["TabPanel"]
+      defaultValue: {
+        type: "text",
+        value: "Are you sure you want to have that milkshake?"
+      }
     }
   }
-};
-function registerTabPanels(loader, customTabPanelsMeta) {
+});
+function registerPopoverBody(loader, customPopoverBodyMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.TabPanels, customTabPanelsMeta != null ? customTabPanelsMeta : tabPanelsMeta);
+  doRegisterComponent(react.PopoverBody, customPopoverBodyMeta != null ? customPopoverBodyMeta : popoverBodyMeta);
 }
-var tabPanelMeta = {
-  name: "TabPanel",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "TabPanels",
+var popoverTriggerMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("PopoverTrigger", "Popover"), {
   props: {
     children: {
       type: "slot",
       defaultValue: {
-        type: "text",
-        value: "Tab Panel Content"
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("Button"),
+        props: {
+          children: {
+            type: "text",
+            value: "Trigger"
+          }
+        }
       }
     }
   }
-};
-function registerTabPanel(loader, customTabPanelMeta) {
+});
+function registerPopoverTrigger(loader, customPopoverTriggerMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.TabPanel, customTabPanelMeta != null ? customTabPanelMeta : tabPanelMeta);
+  doRegisterComponent(react.PopoverTrigger, customPopoverTriggerMeta != null ? customPopoverTriggerMeta : popoverTriggerMeta);
 }
 
-var textMeta = {
-  name: "Text",
-  importPath: "@chakra-ui/react",
+var progressMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Progress"), {
   props: {
-    children: {
-      type: "slot",
-      defaultValue: [{
-        type: "text",
-        value: "Some Text"
-      }]
-    }
-  }
-};
-function registerText(loader, customTextMeta) {
+    colorScheme: {
+      type: "choice",
+      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"],
+      defaultValue: "blue"
+    },
+    size: {
+      type: "choice",
+      options: ["xs", "sm", "md", "lg"],
+      defaultValue: "md"
+    },
+    max: {
+      type: "number",
+      defaultValue: 100
+    },
+    min: {
+      type: "number",
+      defaultValue: 0
+    },
+    value: "number",
+    isIndeterminate: {
+      type: "boolean"
+    },
+    hasStripe: {
+      type: "boolean"
+    },
+    isAnimated: {
+      type: "boolean",
+      hidden: function hidden(props) {
+        return !props.hasStripe;
+      }
+    }
+  }
+});
+function registerProgress(loader, customProgressMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Text, customTextMeta != null ? customTextMeta : textMeta);
+  doRegisterComponent(react.Progress, customProgressMeta != null ? customProgressMeta : progressMeta);
 }
 
-var highlightMeta = {
-  name: "Highlight",
-  importPath: "@chakra-ui/react",
+var radioGroupMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("RadioGroup"), {
   props: {
-    children: {
-      displayName: "text",
-      type: "string",
-      defaultValue: "With the Highlight component, you can spotlight words."
+    value: {
+      type: "string"
     },
-    query: {
-      type: "array",
-      defaultValue: ["Spotlight", "words"]
+    size: {
+      type: "choice",
+      options: ["xl", "sm", "md", "lg"]
     },
-    styles: {
-      type: "object",
+    isDisabled: {
+      type: "boolean"
+    },
+    isInvalid: {
+      type: "boolean"
+    },
+    isReadOnly: {
+      type: "boolean"
+    },
+    isRequired: {
+      type: "boolean"
+    },
+    children: {
+      type: "slot",
       defaultValue: {
-        backgroundColor: "orange.100",
-        px: "0.3em",
-        py: "0.1em",
-        borderRadius: "0.3em"
+        type: "hbox",
+        styles: {
+          gap: "12px"
+        },
+        children: [{
+          type: "component",
+          name: /*#__PURE__*/getPlasmicComponentName("Radio"),
+          props: {
+            value: "1",
+            children: {
+              type: "text",
+              value: "Radio 1"
+            }
+          }
+        }, {
+          type: "component",
+          name: /*#__PURE__*/getPlasmicComponentName("Radio"),
+          props: {
+            value: "2",
+            children: {
+              type: "text",
+              value: "Radio 2"
+            }
+          }
+        }, {
+          type: "component",
+          name: /*#__PURE__*/getPlasmicComponentName("Radio"),
+          props: {
+            value: "3",
+            children: {
+              type: "text",
+              value: "Radio 3"
+            }
+          }
+        }]
       }
     }
   }
-};
-function registerHighlight(loader, customHighlightMeta) {
+});
+function registerRadioGroup(loader, customRadioGroupMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Highlight, customHighlightMeta != null ? customHighlightMeta : highlightMeta);
+  doRegisterComponent(react.RadioGroup, customRadioGroupMeta != null ? customRadioGroupMeta : radioGroupMeta);
 }
-
-var headingMeta = {
-  name: "Heading",
-  importPath: "@chakra-ui/react",
+var radioMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Radio", "RadioGroup"), {
   props: {
-    children: {
-      type: "slot",
-      defaultValue: {
-        type: "text",
-        value: "Basic text writing, including headings, body text, lists, and more."
-      }
+    value: {
+      type: "string"
     },
     size: {
       type: "choice",
-      options: ["4xl", "3xl", "2xl", "xl", "lg", "md", "sm", "xs"],
-      defaultValue: "xl"
+      options: ["xl", "sm", "md", "lg"]
     },
-    noOfLines: {
-      type: "number",
-      defaultValue: 1
+    spacing: {
+      type: "string",
+      defaultValue: "0.5rem"
+    },
+    isChecked: {
+      type: "boolean"
+    },
+    isDisabled: {
+      type: "boolean"
+    },
+    isInvalid: {
+      type: "boolean"
+    },
+    isReadOnly: {
+      type: "boolean"
+    },
+    isRequired: {
+      type: "boolean"
+    },
+    children: {
+      type: "slot",
+      defaultValue: [{
+        type: "text",
+        value: "Radio"
+      }]
     }
   }
-};
-function registerHeading(loader, customHeadingMeta) {
+});
+function registerRadio(loader, customRadioMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Heading, customHeadingMeta != null ? customHeadingMeta : headingMeta);
+  doRegisterComponent(react.Radio, customRadioMeta != null ? customRadioMeta : radioMeta);
 }
 
-var toastMeta = {
-  name: "Toast",
-  importPath: "@chakra-ui/react",
+var selectMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Select"), {
   props: {
-    title: {
-      type: "string",
-      defaultValue: "Toast Title"
-    },
-    description: {
-      type: "string",
-      defaultValue: "Toast description"
+    size: {
+      type: "choice",
+      options: ["lg", "md", "sm", "xs"],
+      defaultValue: "md"
     },
     variant: {
       type: "choice",
-      options: ["solid", "subtle", "left-accent", "top-accent"]
+      options: ["outline", "filled", "flushed", "unstyled"],
+      defaultValue: "outline"
     },
-    duration: {
-      type: "number",
-      defaultValue: 5000
+    placeholder: {
+      type: "string"
     },
-    isClosable: {
+    errorBorderColor: {
+      type: "string",
+      defaultValueHint: "red.500"
+    },
+    isDisabled: {
       type: "boolean"
     },
-    position: {
-      type: "choice",
-      options: ["top", "top-right", "top-left", "bottom", "bottom-right", "bottom-left"]
+    isInvalid: {
+      type: "boolean"
     },
-    status: {
-      type: "choice",
-      options: ["info", "success", "warning", "error", "loading"]
+    isReadOnly: {
+      type: "boolean"
+    },
+    isRequred: {
+      type: "boolean"
+    },
+    children: {
+      type: "slot",
+      defaultValue: [{
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("Option"),
+        props: {
+          children: {
+            type: "text",
+            value: "Option 01"
+          }
+        }
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("Option"),
+        props: {
+          children: {
+            type: "text",
+            value: "Option 02"
+          }
+        }
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("Option"),
+        props: {
+          children: {
+            type: "text",
+            value: "Option 03"
+          }
+        }
+      }]
     }
   }
-};
-function registerToast(loader, customToastMeta) {
+});
+function registerSelect(loader, customSelectMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Toast, customToastMeta != null ? customToastMeta : toastMeta);
+  doRegisterComponent(react.Select, customSelectMeta != null ? customSelectMeta : selectMeta);
 }
-
-var tooltipMeta = {
-  name: "Tooltip",
-  importPath: "@chakra-ui/react",
+function Option(props) {
+  var value = props.value,
+      className = props.className,
+      children = props.children;
+  return React.createElement("option", {
+    className: className,
+    value: value
+  }, children);
+}
+var optionMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Option", "Select", {
+  importPath: "@plasmicpkgs/plasmic-chakra-ui"
+}), {
   props: {
+    value: "string",
     children: {
       type: "slot",
       defaultValue: {
+        type: "text",
+        value: "Option"
+      }
+    }
+  }
+});
+function registerOption(loader, customOptionMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(Option, customOptionMeta != null ? customOptionMeta : optionMeta);
+}
+
+var statMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Stat"), {
+  props: {
+    children: {
+      type: "slot",
+      defaultValue: [{
         type: "component",
-        name: "Button",
+        name: /*#__PURE__*/getPlasmicComponentName("StatLabel"),
         props: {
           children: {
             type: "text",
-            value: "Hover me"
+            value: "Collected Fees"
           }
         }
-      }
-    },
-    label: {
-      type: "string",
-      defaultValue: "Hi! I am a tooltip"
-    },
-    placement: {
-      type: "choice",
-      options: ["auto", "auto-start", "auto-end", "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "right", "right-start", "right-end", "left", "left-start", "left-end"],
-      defaultValue: "bottom"
-    },
-    hasArrow: "boolean",
-    arrowSize: {
-      type: "number",
-      defaultValue: 10
-    },
-    arrowShadowColor: {
-      type: "string"
-    },
-    arrowPadding: {
-      type: "number",
-      defaultValue: 8
-    },
-    defaultIsOpen: "boolean",
-    isDisabled: "boolean",
-    offset: {
-      type: "array",
-      defaultValue: [0, 0]
-    },
-    closeOnClick: {
-      type: "boolean",
-      defaultValue: true
-    },
-    closeDelay: {
-      type: "number",
-      defaultValue: 0
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("StatNumber"),
+        props: {
+          children: {
+            type: "text",
+            value: "£345,670"
+          }
+        }
+      }, {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("StatHelpText"),
+        props: {
+          children: {
+            type: "hbox",
+            styles: {
+              alignItems: "center",
+              padding: "0px"
+            },
+            children: [{
+              type: "component",
+              name: /*#__PURE__*/getPlasmicComponentName("StatArrow"),
+              props: {
+                type: "increase"
+              }
+            }, {
+              type: "text",
+              value: "Last 7 days"
+            }]
+          }
+        }
+      }]
     }
   }
-};
-function registerTooltip(loader, customTooltipMeta) {
+});
+function registerStat(loader, customStatMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Tooltip, customTooltipMeta != null ? customTooltipMeta : tooltipMeta);
+  doRegisterComponent(react.Stat, customStatMeta != null ? customStatMeta : statMeta);
 }
-
-var accordionMeta = {
-  name: "Accordion",
-  importPath: "@chakra-ui/react",
+var statHelpTextMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("StatHelpText", "Stat"), {
   props: {
-    allowMultiple: {
-      type: "boolean",
-      description: "If true, multiple accordion items can be expanded at the same time."
-    },
-    allowToggle: {
-      type: "boolean",
-      description: "If true, an expanded accordion item can be collapsed again."
-    },
-    defaultIndex: {
-      type: "number",
-      description: "The index of the accordion item that should be expanded by default."
-    },
-    reduceMotion: {
-      type: "boolean",
-      description: "If true, height animation and transitions will be disabled."
-    },
     children: {
       type: "slot",
-      allowedComponents: ["AccordionItem"],
       defaultValue: [{
-        type: "component",
-        name: "AccordionItem"
-      }, {
-        type: "component",
-        name: "AccordionItem"
+        type: "text",
+        value: "StatHelpText"
       }]
     }
   }
-};
-function registerAccordion(loader, customAccordionMeta) {
+});
+function registerStatHelpText(loader, customStatHelpTextMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Accordion, customAccordionMeta != null ? customAccordionMeta : accordionMeta);
+  doRegisterComponent(react.StatHelpText, customStatHelpTextMeta != null ? customStatHelpTextMeta : statHelpTextMeta);
 }
-var accordionItemMeta = {
-  name: "AccordionItem",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Accordion",
+var statArrowMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("StatArrow", "Stat"), {
   props: {
-    id: {
-      type: "string",
-      description: "The unique id of the accordion item."
-    },
-    isDisabled: {
-      type: "boolean",
-      description: "If true, the accordion item will be disabled."
-    },
-    isFocusable: {
-      type: "boolean",
-      description: "If true, the accordion item will be focusable."
-    },
-    children: {
-      type: "slot",
-      allowedComponents: ["AccordionButton", "AccordionPanel"],
-      defaultValue: [{
-        type: "component",
-        name: "AccordionButton"
-      }, {
-        type: "component",
-        name: "AccordionPanel"
-      }]
+    type: {
+      type: "choice",
+      options: ["increase", "decrease"]
     }
   }
-};
-function registerAccordionItem(loader, customAccordionItemMeta) {
+});
+function registerStatArrow(loader, customStatArrowMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.AccordionItem, customAccordionItemMeta != null ? customAccordionItemMeta : accordionItemMeta);
+  doRegisterComponent(react.StatArrow, customStatArrowMeta != null ? customStatArrowMeta : statArrowMeta);
 }
-var accordionButtonMeta = {
-  name: "AccordionButton",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "AccordionItem",
+var statNumberMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("StatNumber", "Stat"), {
   props: {
-    _expanded: {
-      type: "object",
-      displayName: "expandedStyle",
-      defaultValueHint: {
-        bg: "orange",
-        color: "white"
-      }
-    },
     children: {
       type: "slot",
       defaultValue: [{
         type: "text",
-        value: "Section 1 title",
-        styles: {
-          textAlign: "left"
-        }
-      }, {
-        type: "component",
-        name: "AccordionIcon"
+        value: "£345,670"
       }]
     }
   }
-};
-function registerAccordionButton(loader, customAccordionButtonMeta) {
+});
+function registerStatNumber(loader, customStatNumberMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.AccordionButton, customAccordionButtonMeta != null ? customAccordionButtonMeta : accordionButtonMeta);
+  doRegisterComponent(react.StatNumber, customStatNumberMeta != null ? customStatNumberMeta : statNumberMeta);
 }
-var accordionPanelMeta = {
-  name: "AccordionPanel",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "AccordionItem",
+var statLabelMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("StatLabel", "Stat"), {
   props: {
     children: {
       type: "slot",
-      defaultValue: {
-        type: "component",
-        name: "Text",
-        props: {
-          children: {
-            type: "text",
-            value: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."
-          }
-        }
-      }
+      defaultValue: [{
+        type: "text",
+        value: "StatLabel"
+      }]
     }
   }
-};
-function registerAccordionPanel(loader, customAccordionPanelMeta) {
-  var doRegisterComponent = function doRegisterComponent() {
-    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
-  };
-
-  doRegisterComponent(react.AccordionPanel, customAccordionPanelMeta != null ? customAccordionPanelMeta : accordionPanelMeta);
-}
-var accordionIconMeta = {
-  name: "AccordionIcon",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "AccordionButton",
-  props: {}
-};
-function registerAccordionIcon(loader, customAccordionIconMeta) {
+});
+function registerStatLabel(loader, customStatLabelMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.AccordionIcon, customAccordionIconMeta != null ? customAccordionIconMeta : accordionIconMeta);
+  doRegisterComponent(react.StatLabel, customStatLabelMeta != null ? customStatLabelMeta : statLabelMeta);
 }
 
-var avatarBadgeMeta = {
-  name: "AvatarBadge",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "Avatar",
+var switchMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Switch"), {
   props: {
-    boxSize: {
-      type: "string",
-      defaultValue: "1.25em"
+    isChecked: "boolean",
+    colorScheme: {
+      type: "choice",
+      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"],
+      defaultValue: "blue"
     },
-    bg: {
+    size: {
+      type: "choice",
+      options: ["sm", "md", "lg"],
+      defaultValue: "md"
+    },
+    spacing: {
       type: "string",
-      defaultValue: "green.500"
+      defaultValue: "0.5rem"
     },
-    borderColor: "string"
+    id: "string",
+    isDisabled: "boolean",
+    isInvalid: "boolean",
+    isReadOnly: "boolean",
+    isRequired: "boolean"
   }
-};
-function registerAvatarBadge(loader, customAvatarBadgeMeta) {
+});
+function registerSwitch(loader, customSwitchMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.AvatarBadge, customAvatarBadgeMeta != null ? customAvatarBadgeMeta : avatarBadgeMeta);
+  doRegisterComponent(react.Switch, customSwitchMeta != null ? customSwitchMeta : switchMeta);
 }
-var avatarMeta = {
-  name: "Avatar",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "AvatarGroup",
+
+var tableMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Table", "TableContainer"), {
   props: {
-    name: {
-      type: "string",
-      defaultValue: "Kola Tioluwani"
-    },
-    src: {
-      type: "string",
-      defaultValue: "https://bit.ly/dan-abramov"
+    colorScheme: {
+      type: "choice",
+      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"],
+      defaultValue: "gray"
     },
     size: {
       type: "choice",
-      options: ["2xs", "xs", "sm", "md", "lg", "xl", "2xl", "full"]
+      options: ["sm", "md", "lg"],
+      defaultValue: "md"
     },
-    loading: {
+    variant: {
       type: "choice",
-      options: ["eager", "lazy"]
+      options: ["simple", "striped", "unstyled"],
+      defaultValue: "simple"
     },
-    showBorder: "boolean",
     children: {
-      type: "slot",
-      hidePlaceholder: true,
-      allowedComponents: ["AvatarBadge"],
-      defaultValue: {
-        type: "component",
-        name: "Badge"
-      }
+      type: "slot"
     }
   }
-};
-function registerAvatar(loader, customAvatarMeta) {
+});
+function registerTable(loader, customTableMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Avatar, customAvatarMeta != null ? customAvatarMeta : avatarMeta);
+  doRegisterComponent(react.Table, customTableMeta != null ? customTableMeta : tableMeta);
 }
-var avatarGroupMeta = {
-  name: "AvatarGroup",
-  importPath: "@chakra-ui/react",
+var tableCaptionMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("TableCaption", "Table"), {
   props: {
-    size: {
+    placement: {
       type: "choice",
-      options: ["2xs", "xs", "sm", "md", "lg", "xl", "2xl", "full"]
-    },
-    max: {
-      type: "number",
-      description: "The maximum number of avatars to show before truncating."
-    },
-    spacing: {
-      type: "string",
-      defaultValue: "-0.75rem"
+      options: ["top", "bottom"],
+      defaultValue: "bottom"
     },
     children: {
       type: "slot",
-      allowedComponents: ["Avatar"],
-      defaultValue: [{
-        type: "component",
-        name: "Avatar",
-        props: {
-          name: "Dan Abrahmov",
-          src: "https://bit.ly/dan-abramov"
-        }
-      }, {
-        type: "component",
-        name: "Avatar",
-        props: {
-          name: "Kola Tioluwani",
-          src: "https://bit.ly/tioluwani-kolawole"
-        }
-      }, {
-        type: "component",
-        name: "Avatar",
-        props: {
-          name: "Kent Dodds",
-          src: "https://bit.ly/kent-c-dodds"
-        }
-      }, {
+      defaultValue: {
+        type: "text",
+        value: "Imperial to metric conversion factors"
+      }
+    }
+  }
+});
+function registerTableCaption(loader, customTableCaptionMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.TableCaption, customTableCaptionMeta != null ? customTableCaptionMeta : tableCaptionMeta);
+}
+var theadMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Thead", "Table"), {
+  props: {
+    children: {
+      type: "slot",
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("Th"), /*#__PURE__*/getPlasmicComponentName("Tr")]
+    }
+  }
+});
+function registerThead(loader, customTheadMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.Thead, customTheadMeta != null ? customTheadMeta : theadMeta);
+}
+var tbodyMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Tbody", "Table"), {
+  props: {
+    children: {
+      type: "slot",
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("Td"), /*#__PURE__*/getPlasmicComponentName("Tr")]
+    }
+  }
+});
+function registerTbody(loader, customTbodyMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.Tbody, customTbodyMeta != null ? customTbodyMeta : tbodyMeta);
+}
+var trMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Tr", "Table"), {
+  props: {
+    children: {
+      type: "slot",
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("Td"), /*#__PURE__*/getPlasmicComponentName("Th")]
+    }
+  }
+});
+function registerTr(loader, customTrMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.Tr, customTrMeta != null ? customTrMeta : trMeta);
+}
+var tdMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Td", "Tr"), {
+  props: {
+    isNumeric: "boolean",
+    children: {
+      type: "slot",
+      defaultValue: {
+        type: "text",
+        value: "Table Cell"
+      }
+    }
+  }
+});
+function registerTd(loader, customTdMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.Td, customTdMeta != null ? customTdMeta : tdMeta);
+}
+var thMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Th", "Tr"), {
+  props: {
+    isNumeric: "boolean",
+    children: {
+      type: "slot",
+      defaultValue: {
+        type: "text",
+        value: "Table Cell"
+      }
+    }
+  }
+});
+function registerTh(loader, customThMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.Th, customThMeta != null ? customThMeta : thMeta);
+}
+var tableContainerMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("TableContainer"), {
+  props: {
+    overflowX: {
+      type: "choice",
+      options: ["auto", "scroll", "hidden", "visible"]
+    },
+    overflowY: {
+      type: "choice",
+      options: ["auto", "scroll", "hidden", "visible"]
+    },
+    whiteSpace: {
+      type: "choice",
+      options: ["normal", "nowrap", "pre", "pre-line", "pre-wrap"]
+    },
+    children: {
+      type: "slot",
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("Table")],
+      defaultValue: {
         type: "component",
-        name: "Avatar",
+        name: /*#__PURE__*/getPlasmicComponentName("Table"),
         props: {
-          name: "Ryan Florence",
-          src: "https://bit.ly/ryan-florence"
+          children: [{
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("Thead"),
+            props: {
+              children: {
+                type: "component",
+                name: /*#__PURE__*/getPlasmicComponentName("Tr"),
+                props: {
+                  children: [{
+                    type: "component",
+                    name: /*#__PURE__*/getPlasmicComponentName("Th"),
+                    props: {
+                      children: {
+                        type: "text",
+                        value: "TO CONVERT"
+                      }
+                    }
+                  }, {
+                    type: "component",
+                    name: /*#__PURE__*/getPlasmicComponentName("Th"),
+                    props: {
+                      children: {
+                        type: "text",
+                        value: "INTO"
+                      }
+                    }
+                  }, {
+                    type: "component",
+                    name: /*#__PURE__*/getPlasmicComponentName("Th"),
+                    props: {
+                      children: {
+                        type: "text",
+                        value: "MULTIPLY BY"
+                      }
+                    }
+                  }]
+                }
+              }
+            }
+          }, {
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("Tbody"),
+            props: {
+              children: [{
+                type: "component",
+                name: /*#__PURE__*/getPlasmicComponentName("Tr"),
+                props: {
+                  children: [{
+                    type: "component",
+                    name: /*#__PURE__*/getPlasmicComponentName("Td"),
+                    props: {
+                      children: {
+                        type: "text",
+                        value: "inches"
+                      }
+                    }
+                  }, {
+                    type: "component",
+                    name: /*#__PURE__*/getPlasmicComponentName("Td"),
+                    props: {
+                      children: {
+                        type: "text",
+                        value: "millimetres (mm)"
+                      }
+                    }
+                  }, {
+                    type: "component",
+                    name: /*#__PURE__*/getPlasmicComponentName("Td"),
+                    props: {
+                      children: {
+                        type: "text",
+                        value: "25.4"
+                      }
+                    }
+                  }]
+                }
+              }]
+            }
+          }]
         }
-      }, {
+      }
+    }
+  }
+});
+function registerTableContainer(loader, customTableContainerMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.TableContainer, customTableContainerMeta != null ? customTableContainerMeta : tableContainerMeta);
+}
+var tfootMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Tfoot", "Table"), {
+  props: {
+    children: {
+      type: "slot",
+      defaultValue: [{
         type: "component",
-        name: "Avatar",
+        name: /*#__PURE__*/getPlasmicComponentName("Tr"),
         props: {
-          name: "Prosper Otemuyiwa",
-          src: "https://bit.ly/prosper-baba"
+          children: [{
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("Th"),
+            props: {
+              children: {
+                type: "text",
+                value: "Name"
+              }
+            }
+          }]
         }
-      }, {
+      }]
+    }
+  }
+});
+function registerTfoot(loader, customTfootMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.Tfoot, customTfootMeta != null ? customTfootMeta : tfootMeta);
+}
+
+var tabListMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("TabList", "Tabs"), {
+  props: {
+    children: {
+      type: "slot",
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("Tab")]
+    }
+  }
+});
+function registerTabList(loader, customTabListMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.TabList, customTabListMeta != null ? customTabListMeta : tabListMeta);
+}
+var tabsMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Tabs"), {
+  props: {
+    align: {
+      type: "choice",
+      options: ["start", "center", "end"]
+    },
+    colorScheme: {
+      type: "choice",
+      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"]
+    },
+    orientation: {
+      type: "choice",
+      options: ["horizontal", "vertical"]
+    },
+    size: {
+      type: "choice",
+      options: ["sm", "md", "lg"]
+    },
+    variant: {
+      type: "choice",
+      options: ["line", "enclosed", "enclosed-colored", "soft-rounded", "solid-rounded", "unstyled"],
+      defaultValue: "line"
+    },
+    direction: {
+      type: "choice",
+      options: ["ltr", "rtl"]
+    },
+    index: {
+      type: "number"
+    },
+    isFitted: "boolean",
+    isLazy: "boolean",
+    isManual: "boolean",
+    children: {
+      type: "slot",
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("TabList"), /*#__PURE__*/getPlasmicComponentName("TabPanels")],
+      defaultValue: [{
         type: "component",
-        name: "Avatar",
+        name: /*#__PURE__*/getPlasmicComponentName("TabList"),
         props: {
-          name: "Christian Nwamba",
-          src: "https://bit.ly/code-beast"
+          children: [{
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("Tab"),
+            props: {
+              children: {
+                type: "text",
+                value: "Tab 1"
+              }
+            }
+          }, {
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("Tab"),
+            props: {
+              children: {
+                type: "text",
+                value: "Tab 2"
+              }
+            }
+          }, {
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("Tab"),
+            props: {
+              children: {
+                type: "text",
+                value: "Tab 3"
+              }
+            }
+          }]
         }
       }, {
         type: "component",
-        name: "Avatar",
+        name: /*#__PURE__*/getPlasmicComponentName("TabPanels"),
         props: {
-          name: "Segun Adebayo",
-          src: "https://bit.ly/sage-adebayo"
+          children: [{
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("TabPanel"),
+            props: {
+              children: {
+                type: "text",
+                value: "Tab 1's Panel Content"
+              }
+            }
+          }, {
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("TabPanel"),
+            props: {
+              children: {
+                type: "text",
+                value: "Tab 2's Panel Content"
+              }
+            }
+          }, {
+            type: "component",
+            name: /*#__PURE__*/getPlasmicComponentName("TabPanel"),
+            props: {
+              children: {
+                type: "text",
+                value: "Tab 3's Panel Content"
+              }
+            }
+          }]
         }
       }]
     }
   }
-};
-function registerAvatarGroup(loader, customAvatarGroupMeta) {
+});
+function registerTabs(loader, customTabsMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.AvatarGroup, customAvatarGroupMeta != null ? customAvatarGroupMeta : avatarGroupMeta);
+  doRegisterComponent(react.Tabs, customTabsMeta != null ? customTabsMeta : tabsMeta);
 }
-
-var formControlMeta = {
-  name: "FormControl",
-  importPath: "@chakra-ui/react",
+var tabMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Tab", "TabList"), {
   props: {
-    label: "string",
+    id: "string",
     isDisabled: "boolean",
-    isInvalid: "boolean",
-    isRequired: "boolean",
-    isreadOnly: "boolean",
+    panelId: "string",
     children: {
       type: "slot",
-      defaultValue: [{
-        type: "component",
-        name: "FormLabel"
-      }, {
-        type: "component",
-        name: "Input"
-      }]
+      defaultValue: {
+        type: "text",
+        value: "Tab"
+      }
     }
   }
-};
-function registerFormControl(loader, customFormControlMeta) {
+});
+function registerTab(loader, customTabMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.FormControl, customFormControlMeta != null ? customFormControlMeta : formControlMeta);
+  doRegisterComponent(react.Tab, customTabMeta != null ? customTabMeta : tabMeta);
 }
-var formLabelMeta = {
-  name: "FormLabel",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "FormControl",
+var tabPanelsMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("TabPanels", "Tabs"), {
   props: {
     children: {
       type: "slot",
-      defaultValue: {
-        type: "text",
-        value: "Label",
-        styles: {
-          display: "inline-block",
-          width: "auto"
-        }
-      }
+      allowedComponents: [/*#__PURE__*/getPlasmicComponentName("TabPanel")]
     }
   }
-};
-function registerFormLabel(loader, customFormLabelMeta) {
+});
+function registerTabPanels(loader, customTabPanelsMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.FormLabel, customFormLabelMeta != null ? customFormLabelMeta : formLabelMeta);
+  doRegisterComponent(react.TabPanels, customTabPanelsMeta != null ? customTabPanelsMeta : tabPanelsMeta);
 }
-var formHelperTextMeta = {
-  name: "FormHelperText",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "FormControl",
+var tabPanelMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("TabPanel", "TabPanels"), {
   props: {
     children: {
       type: "slot",
       defaultValue: {
         type: "text",
-        value: "We'll never share your email."
+        value: "Tab Panel Content"
       }
     }
   }
-};
-function registerFormHelperText(loader, customFormHelperTextMeta) {
+});
+function registerTabPanel(loader, customTabPanelMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.FormHelperText, customFormHelperTextMeta != null ? customFormHelperTextMeta : formHelperTextMeta);
+  doRegisterComponent(react.TabPanel, customTabPanelMeta != null ? customTabPanelMeta : tabPanelMeta);
 }
-var formErrorMessageMeta = {
-  name: "FormErrorMessage",
-  importPath: "@chakra-ui/react",
-  parentComponentName: "FormControl",
+
+var textMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Text"), {
   props: {
     children: {
       type: "slot",
-      defaultValue: {
+      defaultValue: [{
         type: "text",
-        value: "This is an error message."
-      }
+        value: "Some Text"
+      }]
     }
   }
-};
-function registerFormErrorMessage(loader, customFormErrorMessageMeta) {
+});
+function registerText(loader, customTextMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.FormErrorMessage, customFormErrorMessageMeta != null ? customFormErrorMessageMeta : formErrorMessageMeta);
+  doRegisterComponent(react.Text, customTextMeta != null ? customTextMeta : textMeta);
 }
 
-var progressMeta = {
-  name: "Progress",
-  importPath: "@chakra-ui/react",
+var toastMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Toast"), {
   props: {
-    colorScheme: {
-      type: "choice",
-      options: ["whiteAlpha", "blackAlpha", "gray", "red", "orange", "yellow", "green", "teal", "blue", "cyan", "purple", "pink", "linkedin", "facebook", "messenger", "whatsapp", "twitter", "telegram"],
-      defaultValue: "blue"
+    title: {
+      type: "string",
+      defaultValue: "Toast Title"
     },
-    size: {
+    description: {
+      type: "string",
+      defaultValue: "Toast description"
+    },
+    variant: {
       type: "choice",
-      options: ["xs", "sm", "md", "lg"],
-      defaultValue: "md"
+      options: ["solid", "subtle", "left-accent", "top-accent"]
     },
-    max: {
+    duration: {
       type: "number",
-      defaultValue: 100
+      defaultValue: 5000
     },
-    min: {
+    isClosable: {
+      type: "boolean"
+    },
+    position: {
+      type: "choice",
+      options: ["top", "top-right", "top-left", "bottom", "bottom-right", "bottom-left"]
+    },
+    status: {
+      type: "choice",
+      options: ["info", "success", "warning", "error", "loading"]
+    }
+  }
+});
+function registerToast(loader, customToastMeta) {
+  var doRegisterComponent = function doRegisterComponent() {
+    return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
+  };
+
+  doRegisterComponent(react.Toast, customToastMeta != null ? customToastMeta : toastMeta);
+}
+
+var tooltipMeta = /*#__PURE__*/_extends({}, /*#__PURE__*/getComponentNameAndImportMeta("Tooltip"), {
+  props: {
+    children: {
+      type: "slot",
+      defaultValue: {
+        type: "component",
+        name: /*#__PURE__*/getPlasmicComponentName("Button"),
+        props: {
+          children: {
+            type: "text",
+            value: "Hover me"
+          }
+        }
+      }
+    },
+    label: {
+      type: "string",
+      defaultValue: "Hi! I am a tooltip"
+    },
+    placement: {
+      type: "choice",
+      options: ["auto", "auto-start", "auto-end", "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "right", "right-start", "right-end", "left", "left-start", "left-end"],
+      defaultValue: "bottom"
+    },
+    hasArrow: "boolean",
+    arrowSize: {
       type: "number",
-      defaultValue: 0
+      defaultValue: 10
     },
-    value: "number",
-    isIndeterminate: {
-      type: "boolean"
+    arrowShadowColor: {
+      type: "string"
     },
-    hasStripe: {
-      type: "boolean"
+    arrowPadding: {
+      type: "number",
+      defaultValue: 8
     },
-    isAnimated: {
+    defaultIsOpen: "boolean",
+    isDisabled: "boolean",
+    offset: {
+      type: "array",
+      defaultValue: [0, 0]
+    },
+    closeOnClick: {
       type: "boolean",
-      hidden: function hidden(props) {
-        return !props.hasStripe;
-      }
+      defaultValue: true
+    },
+    closeDelay: {
+      type: "number",
+      defaultValue: 0
     }
   }
-};
-function registerProgress(loader, customProgressMeta) {
+});
+function registerTooltip(loader, customTooltipMeta) {
   var doRegisterComponent = function doRegisterComponent() {
     return loader ? loader.registerComponent.apply(loader, arguments) : registerComponent.apply(void 0, arguments);
   };
 
-  doRegisterComponent(react.Progress, customProgressMeta != null ? customProgressMeta : progressMeta);
+  doRegisterComponent(react.Tooltip, customTooltipMeta != null ? customTooltipMeta : tooltipMeta);
 }
 
 function registerAll(loader) {
+  registerAccordion(loader);
+  registerAccordionButton(loader);
+  registerAccordionIcon(loader);
+  registerAccordionItem(loader);
+  registerAccordionPanel(loader);
+  registerAvatar(loader);
+  registerAvatarBadge(loader);
+  registerAvatarGroup(loader);
   registerAspectRatio(loader);
   registerBadge(loader);
   registerBreadcrumb(loader);
@@ -2536,69 +2415,62 @@ function registerAll(loader) {
   registerBreadcrumbSeparator(loader);
   registerButton(loader);
   registerButtonGroup(loader);
+  registerChakraProvider(loader);
   registerCheckbox(loader);
   registerCheckboxGroup(loader);
   registerCode(loader);
   registerDivider(loader);
+  registerFormControl(loader);
+  registerFormErrorMessage(loader);
+  registerFormHelperText(loader);
+  registerFormLabel(loader);
+  registerHeading(loader);
+  registerHighlight(loader);
   registerImage(loader);
   registerInput(loader);
   registerKbd(loader);
   registerNumberInput(loader);
-  registerNumberInputStepper(loader);
   registerNumberDecrementStepper(loader);
   registerNumberIncrementStepper(loader);
   registerNumberInputField(loader);
+  registerNumberInputStepper(loader);
+  registerOption(loader);
   registerPinInput(loader);
   registerPinInputField(loader);
   registerPopover(loader);
-  registerPopoverContent(loader);
+  registerPopoverBody(loader);
   registerPopoverArrow(loader);
   registerPopoverCloseButton(loader);
+  registerPopoverContent(loader);
   registerPopoverHeader(loader);
-  registerPopoverBody(loader);
   registerPopoverTrigger(loader);
+  registerProgress(loader);
   registerRadio(loader);
   registerRadioGroup(loader);
   registerSelect(loader);
-  registerOption(loader);
   registerStat(loader);
-  registerStatHelpText(loader);
   registerStatArrow(loader);
-  registerStatNumber(loader);
+  registerStatHelpText(loader);
   registerStatLabel(loader);
+  registerStatNumber(loader);
   registerSwitch(loader);
   registerTable(loader);
   registerTableCaption(loader);
-  registerThead(loader);
   registerTbody(loader);
-  registerTr(loader);
+  registerTfoot(loader);
+  registerThead(loader);
   registerTd(loader);
   registerTh(loader);
+  registerTr(loader);
   registerTableContainer(loader);
   registerTabList(loader);
-  registerTabs(loader);
   registerTab(loader);
-  registerTabPanels(loader);
   registerTabPanel(loader);
+  registerTabPanels(loader);
+  registerTabs(loader);
   registerText(loader);
-  registerTfoot(loader);
-  registerHighlight(loader);
-  registerHeading(loader);
   registerToast(loader);
   registerTooltip(loader);
-  registerAvatarBadge(loader);
-  registerAvatar(loader);
-  registerAvatarGroup(loader);
-  registerAccordion(loader);
-  registerAccordionItem(loader);
-  registerAccordionButton(loader);
-  registerAccordionPanel(loader);
-  registerAccordionIcon(loader);
-  registerFormControl(loader);
-  registerFormLabel(loader);
-  registerFormHelperText(loader);
-  registerFormErrorMessage(loader);
-  registerProgress(loader);
 }
 
 exports.Option = Option;
@@ -2618,6 +2490,7 @@ exports.breadcrumbMeta = breadcrumbMeta;
 exports.breadcrumbSeparatorMeta = breadcrumbSeparatorMeta;
 exports.buttonGroupMeta = buttonGroupMeta;
 exports.buttonMeta = buttonMeta;
+exports.chakraProviderMeta = chakraProviderMeta;
 exports.checkboxGroupMeta = checkboxGroupMeta;
 exports.checkboxMeta = checkboxMeta;
 exports.codeMeta = codeMeta;
@@ -2666,6 +2539,7 @@ exports.registerBreadcrumbLink = registerBreadcrumbLink;
 exports.registerBreadcrumbSeparator = registerBreadcrumbSeparator;
 exports.registerButton = registerButton;
 exports.registerButtonGroup = registerButtonGroup;
+exports.registerChakraProvider = registerChakraProvider;
 exports.registerCheckbox = registerCheckbox;
 exports.registerCheckboxGroup = registerCheckboxGroup;
 exports.registerCode = registerCode;