@nextui-org/react 1.0.2-alpha.2 → 1.0.2-beta.1

package/umd/nextui.js

@@ -979,12 +979,22 @@ const defaultUtils = {
     width: value,
     height: value
   }),
+  minSize: value => ({
+    minWidth: value,
+    minHeight: value,
+    width: value,
+    height: value
+  }),
   sizeMin: value => ({
     minWidth: value,
     minHeight: value,
     width: value,
     height: value
   }),
+  maxSize: value => ({
+    maxWidth: value,
+    maxHeight: value
+  }),
   sizeMax: value => ({
     maxWidth: value,
     maxHeight: value
@@ -999,6 +1009,9 @@ const defaultUtils = {
   linearGradient: value => ({
     backgroundImage: `linear-gradient(${value})`
   }),
+  tdl: value => ({
+    textDecorationLine: value
+  }),
   textGradient: value => ({
     backgroundImage: `linear-gradient(${value})`,
     WebkitBackgroundClip: 'text',
@@ -1175,13 +1188,14 @@ const sharedVisuallyHidden = css({
 });
 const createTheme = ({
   type,
-  theme
+  theme,
+  className
 }) => {
   if (!type) {
     throw new Error('Theme type is required');
   }
 
-  return createThemeBase(`${type}-theme`, deep_merge_deepMerge(type === 'dark' ? dark_theme : light_theme, theme));
+  return createThemeBase(className || `${type}-theme`, deep_merge_deepMerge(type === 'dark' ? dark_theme : light_theme, theme));
 };
 ;// CONCATENATED MODULE: ./src/theme/theme-context.ts
 
@@ -2132,48 +2146,6 @@ const omitObject = (obj, omitKeys) => {
   omitKeys.forEach(key => newObj[key] && delete newObj[key]);
   return newObj;
 };
-;// CONCATENATED MODULE: ./src/theme/ssr-provider.tsx
-var ssr_provider_jsxFileName = "/home/runner/work/nextui/nextui/packages/react/src/theme/ssr-provider.tsx";
-// Code based on the code from mantine SsrProvider https://github.dev/mantinedev/mantine
-
-
-
-function randomId() {
-  return `mantine-${Math.random().toString(36).substr(2, 9)}`;
-}
-
-const UuidContext = /*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.createContext)(() => randomId());
-const useUuid = staticId => {
-  const generateId = useContext(UuidContext);
-  const [uid, setUid] = useState('');
-
-  const _useEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
-
-  _useEffect(() => {
-    setUid(generateId());
-  }, []);
-
-  return staticId || uid;
-};
-function SsrProvider({
-  children
-}) {
-  let id = 0;
-
-  const generateId = () => {
-    id += 1;
-    return `nextui-${id}`;
-  };
-
-  return /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)(UuidContext.Provider, {
-    value: generateId,
-    children: children
-  }, void 0, false, {
-    fileName: ssr_provider_jsxFileName,
-    lineNumber: 37,
-    columnNumber: 5
-  }, this);
-}
 ;// CONCATENATED MODULE: ./src/utils/clsx.ts
 /* eslint-disable no-shadow-restricted-names */
 
@@ -2326,7 +2298,6 @@ var theme_provider_jsxFileName = "/home/runner/work/nextui/nextui/packages/react
 
 
 
-
 const defaultProps = {
   disableBaseline: false
 };
@@ -2399,22 +2370,16 @@ const ThemeProvider = ({
       changeCurrentTheme(getThemeName(userTheme.className));
     }
   }, [isBrowser, userTheme]);
-  return /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)(SsrProvider, {
-    children: /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)(theme_context.Provider, {
-      value: providerValue,
-      children: [!disableBaseline && /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)(css_baseline, {}, void 0, false, {
-        fileName: theme_provider_jsxFileName,
-        lineNumber: 102,
-        columnNumber: 30
-      }, undefined), children]
-    }, void 0, true, {
+  return /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)(theme_context.Provider, {
+    value: providerValue,
+    children: [!disableBaseline && /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)(css_baseline, {}, void 0, false, {
       fileName: theme_provider_jsxFileName,
-      lineNumber: 101,
-      columnNumber: 7
-    }, undefined)
-  }, void 0, false, {
+      lineNumber: 100,
+      columnNumber: 28
+    }, undefined), children]
+  }, void 0, true, {
     fileName: theme_provider_jsxFileName,
-    lineNumber: 100,
+    lineNumber: 99,
     columnNumber: 5
   }, undefined);
 };
@@ -3454,11 +3419,6 @@ const StyledButton = styled('button', {
         bw: '$black'
       }
     },
-    rounded: {
-      true: {
-        br: '$pill'
-      }
-    },
     flat: {
       true: {
         color: '$text'
@@ -3512,6 +3472,11 @@ const StyledButton = styled('button', {
         width: 'auto',
         minWidth: 'min-content'
       }
+    },
+    rounded: {
+      true: {
+        br: '$pill'
+      }
     }
   },
   compoundVariants: [// size / auto
@@ -3974,6 +3939,37 @@ const StyledButton = styled('button', {
         px: '$12'
       }
     }
+  }, // rounded && size
+  {
+    rounded: true,
+    size: 'xs',
+    css: {
+      br: '$pill'
+    }
+  }, {
+    rounded: true,
+    size: 'sm',
+    css: {
+      br: '$pill'
+    }
+  }, {
+    rounded: true,
+    size: 'md',
+    css: {
+      br: '$pill'
+    }
+  }, {
+    rounded: true,
+    size: 'lg',
+    css: {
+      br: '$pill'
+    }
+  }, {
+    rounded: true,
+    size: 'xl',
+    css: {
+      br: '$pill'
+    }
   }],
   defaultVariants: {
     color: 'default',
@@ -4606,7 +4602,7 @@ const StyledCard = styled('div', {
   '@motion': {
     transition: 'none'
   },
-  'img, .nextui-image': {
+  '.nextui-image': {
     width: '100%'
   },
   [`& ${StyledDrip}`]: {
@@ -4720,7 +4716,7 @@ const StyledCard = styled('div', {
     },
     cover: {
       true: {
-        'img, .nextui-image': {
+        '.nextui-image': {
           objectFit: 'cover !important' // TODO: remove important when image be styled
 
         },
@@ -4729,7 +4725,7 @@ const StyledCard = styled('div', {
         }
       },
       false: {
-        'img, .nextui-image, .nextui-image-container': {
+        '.nextui-image, .nextui-image-container': {
           bblr: '0 !important',
           // TODO: remove important when image be styled
           bbrr: '0 !important'
@@ -5677,7 +5673,7 @@ const Checkbox = ({
       fileName: checkbox_jsxFileName,
       lineNumber: 179,
       columnNumber: 7
-    }, undefined), /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)(StyledCheckboxText, {
+    }, undefined), (children || label) && /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)(StyledCheckboxText, {
       className: "nextui-checkbox-text",
       color: textColor,
       line: line,
@@ -5687,8 +5683,8 @@ const Checkbox = ({
       children: children || label
     }, void 0, false, {
       fileName: checkbox_jsxFileName,
-      lineNumber: 227,
-      columnNumber: 7
+      lineNumber: 228,
+      columnNumber: 11
     }, undefined)]
   }, void 0, true, {
     fileName: checkbox_jsxFileName,
@@ -5903,10 +5899,12 @@ const StyledCollapse = styled('div', {
       margin: 0
     }
   },
-  '.nextui-collapse-title': {
+  '.nextui-collapse-title-container': {
     d: 'flex',
     jc: 'space-between',
-    ai: 'center',
+    ai: 'center'
+  },
+  '.nextui-collapse-title': {
     color: '$foreground'
   },
   '.nextui-collapse-subtitle': {
@@ -6417,7 +6415,7 @@ const Collapse = ({
       "aria-controls": ariaControlId,
       onClick: handleChange,
       children: /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)("div", {
-        className: clsx(`${preClass}-title`),
+        className: clsx(`${preClass}-title-container`),
         children: [contentLeft && /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)("div", {
           className: `${preClass}-title-content-left`,
           children: contentLeft
@@ -6428,17 +6426,18 @@ const Collapse = ({
         }, undefined), /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)("div", {
           className: `${preClass}-title-content`,
           children: [/*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_amd_react_default().isValidElement(title) ? title : /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)("h3", {
+            className: `${preClass}-title`,
             children: title
           }, void 0, false, {
             fileName: collapse_jsxFileName,
-            lineNumber: 183,
-            columnNumber: 52
+            lineNumber: 186,
+            columnNumber: 15
           }, undefined), subtitle && /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)("div", {
             className: `${preClass}-subtitle`,
             children: subtitle
           }, void 0, false, {
             fileName: collapse_jsxFileName,
-            lineNumber: 185,
+            lineNumber: 189,
             columnNumber: 15
           }, undefined)]
         }, void 0, true, {
@@ -6450,7 +6449,7 @@ const Collapse = ({
           children: arrowComponent
         }, void 0, false, {
           fileName: collapse_jsxFileName,
-          lineNumber: 188,
+          lineNumber: 192,
           columnNumber: 11
         }, undefined)]
       }, void 0, true, {
@@ -6474,12 +6473,12 @@ const Collapse = ({
         children: children
       }, void 0, false, {
         fileName: collapse_jsxFileName,
-        lineNumber: 194,
+        lineNumber: 198,
         columnNumber: 9
       }, undefined)
     }, void 0, false, {
       fileName: collapse_jsxFileName,
-      lineNumber: 193,
+      lineNumber: 197,
       columnNumber: 7
     }, undefined)]
   }, void 0, true, {
@@ -7637,6 +7636,7 @@ const tooltip_defaultProps = {
   animated: true,
   shadow: true,
   rounded: false,
+  keepMounted: false,
   trigger: 'hover',
   enterDelay: 0,
   leaveDelay: 0,
@@ -7666,6 +7666,7 @@ const Tooltip = ({
   css,
   triggerCss,
   onClick,
+  keepMounted,
   visible: customVisible,
   ...props
 }) => {
@@ -7673,9 +7674,9 @@ const Tooltip = ({
   const ref = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);
   const [visible, setVisible] = (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(initialVisible);
   const contentProps = {
-    css,
     animated,
     visible,
+    css,
     shadow,
     offset,
     placement,
@@ -7718,7 +7719,7 @@ const Tooltip = ({
     onClick == null ? void 0 : onClick();
   };
 
-  src_use_click_away(ref, () => trigger === 'click' && changeVisible(false));
+  src_use_click_away(ref, () => trigger === 'click' && !keepMounted && changeVisible(false));
   (0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(() => {
     if (customVisible === undefined) return;
     changeVisible(customVisible);
@@ -7741,12 +7742,12 @@ const Tooltip = ({
       children: content
     }, void 0, false, {
       fileName: tooltip_jsxFileName,
-      lineNumber: 154,
+      lineNumber: 160,
       columnNumber: 7
     }, undefined)]
   }, void 0, true, {
     fileName: tooltip_jsxFileName,
-    lineNumber: 137,
+    lineNumber: 143,
     columnNumber: 5
   }, undefined);
 };
@@ -9501,12 +9502,12 @@ const TextChild = ({
       children: children
     }, void 0, false, {
       fileName: child_jsxFileName,
-      lineNumber: 65,
+      lineNumber: 68,
       columnNumber: 7
     }, undefined)
   }, void 0, false, {
     fileName: child_jsxFileName,
-    lineNumber: 64,
+    lineNumber: 67,
     columnNumber: 5
   }, undefined);
 };
@@ -13532,6 +13533,7 @@ const Input = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_am
           lineNumber: 324,
           columnNumber: 13
         }, undefined), clearable && /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)(StyledInputClearButton, {
+          type: "button",
           className: `${input_preClass}-clear-button`,
           animated: animated,
           underlined: underlined,
@@ -13543,7 +13545,7 @@ const Input = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_am
             fill: "currentColor"
           }, void 0, false, {
             fileName: input_jsxFileName,
-            lineNumber: 366,
+            lineNumber: 367,
             columnNumber: 17
           }, undefined)
         }, void 0, false, {
@@ -13558,7 +13560,7 @@ const Input = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_am
           children: contentRight
         }, void 0, false, {
           fileName: input_jsxFileName,
-          lineNumber: 370,
+          lineNumber: 371,
           columnNumber: 15
         }, undefined), labelRight && /*#__PURE__*/(0,jsx_dev_runtime.jsxDEV)(StyledInputLabel, {
           className: `${input_preClass}-label--right`,
@@ -13570,7 +13572,7 @@ const Input = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_am
           children: labelRight
         }, void 0, false, {
           fileName: input_jsxFileName,
-          lineNumber: 385,
+          lineNumber: 386,
           columnNumber: 15
         }, undefined)]
       }, void 0, true, {
@@ -13590,12 +13592,12 @@ const Input = /*#__PURE__*/external_root_React_commonjs2_react_commonjs_react_am
         children: helperText
       }, void 0, false, {
         fileName: input_jsxFileName,
-        lineNumber: 403,
+        lineNumber: 404,
         columnNumber: 13
       }, undefined)
     }, void 0, false, {
       fileName: input_jsxFileName,
-      lineNumber: 398,
+      lineNumber: 399,
       columnNumber: 9
     }, undefined)]
   }, void 0, true, {