@nextui-org/theme 0.0.0-dev-v2-20230326032643 → 0.0.0-dev-v2-20230326125142

package/dist/chunk-ONURTFN3.mjs

@@ -0,0 +1,149 @@
+import {
+  utilities
+} from "./chunk-45FXWIO6.mjs";
+import {
+  baseStyles
+} from "./chunk-IJCHUO4J.mjs";
+import {
+  semanticColors
+} from "./chunk-Y52EXP4A.mjs";
+import {
+  removeDefaultKeys
+} from "./chunk-37PIXVP4.mjs";
+import {
+  animations
+} from "./chunk-QPN3H4E3.mjs";
+import {
+  commonColors
+} from "./chunk-CRCBVLUP.mjs";
+
+// src/plugin.ts
+import Color from "color";
+import plugin from "tailwindcss/plugin";
+import forEach from "lodash.foreach";
+import flatten from "flat";
+import get from "lodash.get";
+import deepMerge from "deepmerge";
+var SCHEME = Symbol("color-scheme");
+var VAR_PREFIX = "nextui";
+var dark = (colors) => {
+  return {
+    [SCHEME]: "dark",
+    ...colors
+  };
+};
+var light = (colors) => {
+  return {
+    [SCHEME]: "light",
+    ...colors
+  };
+};
+var resolveConfig = (config = {}, defaultTheme) => {
+  const resolved = {
+    variants: [],
+    utilities: {},
+    colors: {}
+  };
+  const configObject = typeof config === "function" ? config({ dark, light }) : config;
+  forEach(configObject, (colors, themeName) => {
+    let cssSelector = `.${themeName},.theme-${themeName},[data-theme="${themeName}"]`;
+    if (themeName === defaultTheme) {
+      cssSelector = `:root,${cssSelector}`;
+    }
+    resolved.utilities[cssSelector] = colors[SCHEME] ? {
+      "color-scheme": colors[SCHEME]
+    } : {};
+    const flatColors = removeDefaultKeys(
+      flatten(colors, {
+        safe: true,
+        delimiter: "-"
+      })
+    );
+    resolved.variants.push({
+      name: `theme-${themeName}`,
+      definition: [`&.${themeName}`, `&.theme-${themeName}`, `&[data-theme='${themeName}']`]
+    });
+    forEach(flatColors, (colorValue, colorName) => {
+      if (colorName === SCHEME || !colorValue)
+        return;
+      try {
+        const [h, s, l, defaultAlphaValue] = Color(colorValue).hsl().round().array();
+        const nextuiColorVariable = `--${VAR_PREFIX}-${colorName}`;
+        const nextuiOpacityVariable = `--${VAR_PREFIX}-${colorName}-opacity`;
+        resolved.utilities[cssSelector][nextuiColorVariable] = `${h} ${s}% ${l}%`;
+        if (typeof defaultAlphaValue === "number") {
+          resolved.utilities[cssSelector][nextuiOpacityVariable] = defaultAlphaValue.toFixed(2);
+        }
+        resolved.colors[colorName] = ({ opacityVariable, opacityValue }) => {
+          if (!isNaN(+opacityValue)) {
+            return `hsl(var(${nextuiColorVariable}) / ${opacityValue})`;
+          }
+          if (opacityVariable) {
+            return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, var(${opacityVariable})))`;
+          }
+          return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, 1))`;
+        };
+      } catch (error) {
+        console.log("error", error == null ? void 0 : error.message);
+      }
+    });
+  });
+  return resolved;
+};
+var corePlugin = (config = {}, defaultTheme) => {
+  const resolved = resolveConfig(config, defaultTheme);
+  return plugin(
+    ({ addBase, addUtilities, addVariant }) => {
+      addBase({
+        [":root, [data-theme]"]: {
+          ...baseStyles
+        }
+      });
+      addUtilities({ ...resolved.utilities, ...utilities });
+      resolved.variants.forEach((variant) => {
+        addVariant(variant.name, variant.definition);
+      });
+    },
+    {
+      theme: {
+        extend: {
+          colors: {
+            ...commonColors,
+            ...resolved.colors
+          },
+          fontSize: {
+            tiny: "0.625rem"
+          },
+          borderWidth: {
+            1: "1px",
+            1.5: "1.5px",
+            3: "3px",
+            5: "5px"
+          },
+          transitionDuration: {
+            0: "0ms",
+            250: "250ms"
+          },
+          ...animations
+        }
+      }
+    }
+  );
+};
+var nextui = (config = {}) => {
+  const userLightColors = get(config.themes, "light", {});
+  const userDarkColors = get(config.themes, "dark", {});
+  const defaultTheme = config.defaultTheme || "light";
+  return corePlugin(
+    {
+      light: deepMerge(semanticColors.light, userLightColors),
+      dark: deepMerge(semanticColors.dark, userDarkColors)
+    },
+    defaultTheme
+  );
+};
+
+export {
+  resolveConfig,
+  nextui
+};

package/dist/index.d.ts

@@ -24,11 +24,14 @@ export { absoluteFullClasses, baseStyles, focusVisibleClasses, ringClasses, tran
 export { SlotsToClasses } from './utils/types.js';
 export { colorVariants } from './utils/variants.js';
 export { colors } from './colors/index.js';
+export { Colors, ColorsWithScheme, ConfigFunction, ConfigObject, DefaultTheme, NextUIConfig, nextui, resolveConfig } from './plugin.js';
 export { VariantProps, tv } from 'tailwind-variants';
 export { BaseColors, ColorScale, SemanticBaseColors, SemanticColors } from './colors/types.js';
 export { commonColors } from './colors/common.js';
 export { semanticColors } from './colors/semantic.js';
 import 'tailwind-variants/dist/config';
+import 'tailwindcss';
+import 'tailwindcss/types/config';
 
 declare const cn: (...classes: any) => string;
 

package/dist/index.js

@@ -47,9 +47,11 @@ __export(src_exports, {
   drip: () => drip,
   focusVisibleClasses: () => focusVisibleClasses,
   link: () => link,
+  nextui: () => nextui,
   pagination: () => pagination,
   radio: () => radio,
   radioGroup: () => radioGroup,
+  resolveConfig: () => resolveConfig,
   ringClasses: () => ringClasses,
   semanticColors: () => semanticColors,
   snippet: () => snippet,
@@ -3600,6 +3602,17 @@ function swapColorValues(colors2) {
   }
   return swappedColors;
 }
+function removeDefaultKeys(obj) {
+  const newObj = {};
+  for (const key in obj) {
+    if (key.endsWith("-DEFAULT")) {
+      newObj[key.replace("-DEFAULT", "")] = obj[key];
+      continue;
+    }
+    newObj[key] = obj[key];
+  }
+  return newObj;
+}
 
 // src/colors/semantic.ts
 var base = {
@@ -3735,6 +3748,258 @@ var colors = {
   ...semanticColors
 };
 
+// src/plugin.ts
+var import_color = __toESM(require("color"));
+var import_plugin = __toESM(require("tailwindcss/plugin"));
+var import_lodash = __toESM(require("lodash.foreach"));
+var import_flat = __toESM(require("flat"));
+var import_lodash2 = __toESM(require("lodash.get"));
+var import_deepmerge = __toESM(require("deepmerge"));
+
+// src/animations/index.ts
+var animations = {
+  animation: {
+    "drip-expand": "drip-expand 350ms linear",
+    "spinner-ease-spin": "spinner-spin 0.8s ease infinite",
+    "spinner-linear-spin": "spinner-spin 0.8s linear infinite",
+    "appearance-in": "appearance-in 250ms ease-out normal both",
+    "appearance-out": "appearance-out 60ms ease-in normal both"
+  },
+  keyframes: {
+    "spinner-spin": {
+      "0%": {
+        transform: "rotate(0deg)"
+      },
+      "100%": {
+        transform: "rotate(360deg)"
+      }
+    },
+    "drip-expand": {
+      "0%": {
+        opacity: "0.4",
+        transform: "scale(0)"
+      },
+      "100%": {
+        opacity: "0",
+        transform: "scale(2)"
+      }
+    },
+    "appearance-in": {
+      "0%": {
+        opacity: "0",
+        transform: "translateZ(0)  scale(0.95)"
+      },
+      "60%": {
+        opacity: "0.75",
+        backfaceVisibility: "hidden",
+        webkitFontSmoothing: "antialiased",
+        transform: "translateZ(0) scale(1.05)"
+      },
+      "100%": {
+        opacity: "1",
+        transform: "translateZ(0) scale(1)"
+      }
+    },
+    "appearance-out": {
+      "0%": {
+        opacity: "1",
+        transform: "scale(1)"
+      },
+      "100%": {
+        opacity: "0",
+        transform: "scale(0.85)"
+      }
+    }
+  }
+};
+
+// src/utilities/index.ts
+var DEFAULT_TRANSITION_DURATION = "250ms";
+var utilities = {
+  ".leading-inherit": {
+    "line-height": "inherit"
+  },
+  ".bg-img-inherit": {
+    "background-image": "inherit"
+  },
+  ".bg-clip-inherit": {
+    "background-clip": "inherit"
+  },
+  ".text-fill-inherit": {
+    "-webkit-text-fill-color": "inherit"
+  },
+  ".transition-background": {
+    "transition-property": "background",
+    "transition-timing-function": "ease",
+    "transition-duration": DEFAULT_TRANSITION_DURATION
+  },
+  ".transition-all": {
+    "transition-property": "all",
+    "transition-timing-function": "ease",
+    "transition-duration": DEFAULT_TRANSITION_DURATION
+  },
+  ".transition": {
+    "transition-property": "color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter",
+    "transition-timing-function": "ease",
+    "transition-duration": DEFAULT_TRANSITION_DURATION
+  },
+  ".transition-colors": {
+    "transition-property": "color, background-color, border-color, text-decoration-color, fill, stroke",
+    "transition-timing-function": "ease",
+    "transition-duration": DEFAULT_TRANSITION_DURATION
+  },
+  ".transition-opacity": {
+    "transition-property": "opacity",
+    "transition-timing-function": "ease",
+    "transition-duration": DEFAULT_TRANSITION_DURATION
+  },
+  ".transition-width": {
+    "transition-property": "width",
+    "transition-timing-function": "ease",
+    "transition-duration": DEFAULT_TRANSITION_DURATION
+  },
+  ".transition-shadow": {
+    "transition-property": "box-shadow",
+    "transition-timing-function": "ease",
+    "transition-duration": DEFAULT_TRANSITION_DURATION
+  },
+  ".transition-transform": {
+    "transition-property": "transform",
+    "transition-timing-function": "ease",
+    "transition-duration": DEFAULT_TRANSITION_DURATION
+  },
+  ".transition-transform-opacity": {
+    "transition-property": "transform, opacity",
+    "transition-timing-function": "ease",
+    "transition-duration": DEFAULT_TRANSITION_DURATION
+  },
+  ".transition-transform-background": {
+    "transition-property": "transform, background",
+    "transition-timing-function": "ease",
+    "transition-duration": DEFAULT_TRANSITION_DURATION
+  }
+};
+
+// src/plugin.ts
+var SCHEME = Symbol("color-scheme");
+var VAR_PREFIX = "nextui";
+var dark = (colors2) => {
+  return {
+    [SCHEME]: "dark",
+    ...colors2
+  };
+};
+var light2 = (colors2) => {
+  return {
+    [SCHEME]: "light",
+    ...colors2
+  };
+};
+var resolveConfig = (config = {}, defaultTheme) => {
+  const resolved = {
+    variants: [],
+    utilities: {},
+    colors: {}
+  };
+  const configObject = typeof config === "function" ? config({ dark, light: light2 }) : config;
+  (0, import_lodash.default)(configObject, (colors2, themeName) => {
+    let cssSelector = `.${themeName},.theme-${themeName},[data-theme="${themeName}"]`;
+    if (themeName === defaultTheme) {
+      cssSelector = `:root,${cssSelector}`;
+    }
+    resolved.utilities[cssSelector] = colors2[SCHEME] ? {
+      "color-scheme": colors2[SCHEME]
+    } : {};
+    const flatColors = removeDefaultKeys(
+      (0, import_flat.default)(colors2, {
+        safe: true,
+        delimiter: "-"
+      })
+    );
+    resolved.variants.push({
+      name: `theme-${themeName}`,
+      definition: [`&.${themeName}`, `&.theme-${themeName}`, `&[data-theme='${themeName}']`]
+    });
+    (0, import_lodash.default)(flatColors, (colorValue, colorName) => {
+      if (colorName === SCHEME || !colorValue)
+        return;
+      try {
+        const [h, s, l, defaultAlphaValue] = (0, import_color.default)(colorValue).hsl().round().array();
+        const nextuiColorVariable = `--${VAR_PREFIX}-${colorName}`;
+        const nextuiOpacityVariable = `--${VAR_PREFIX}-${colorName}-opacity`;
+        resolved.utilities[cssSelector][nextuiColorVariable] = `${h} ${s}% ${l}%`;
+        if (typeof defaultAlphaValue === "number") {
+          resolved.utilities[cssSelector][nextuiOpacityVariable] = defaultAlphaValue.toFixed(2);
+        }
+        resolved.colors[colorName] = ({ opacityVariable, opacityValue }) => {
+          if (!isNaN(+opacityValue)) {
+            return `hsl(var(${nextuiColorVariable}) / ${opacityValue})`;
+          }
+          if (opacityVariable) {
+            return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, var(${opacityVariable})))`;
+          }
+          return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, 1))`;
+        };
+      } catch (error) {
+        console.log("error", error == null ? void 0 : error.message);
+      }
+    });
+  });
+  return resolved;
+};
+var corePlugin = (config = {}, defaultTheme) => {
+  const resolved = resolveConfig(config, defaultTheme);
+  return (0, import_plugin.default)(
+    ({ addBase, addUtilities, addVariant }) => {
+      addBase({
+        [":root, [data-theme]"]: {
+          ...baseStyles
+        }
+      });
+      addUtilities({ ...resolved.utilities, ...utilities });
+      resolved.variants.forEach((variant) => {
+        addVariant(variant.name, variant.definition);
+      });
+    },
+    {
+      theme: {
+        extend: {
+          colors: {
+            ...commonColors,
+            ...resolved.colors
+          },
+          fontSize: {
+            tiny: "0.625rem"
+          },
+          borderWidth: {
+            1: "1px",
+            1.5: "1.5px",
+            3: "3px",
+            5: "5px"
+          },
+          transitionDuration: {
+            0: "0ms",
+            250: "250ms"
+          },
+          ...animations
+        }
+      }
+    }
+  );
+};
+var nextui = (config = {}) => {
+  const userLightColors = (0, import_lodash2.default)(config.themes, "light", {});
+  const userDarkColors = (0, import_lodash2.default)(config.themes, "dark", {});
+  const defaultTheme = config.defaultTheme || "light";
+  return corePlugin(
+    {
+      light: (0, import_deepmerge.default)(semanticColors.light, userLightColors),
+      dark: (0, import_deepmerge.default)(semanticColors.dark, userDarkColors)
+    },
+    defaultTheme
+  );
+};
+
 // src/index.ts
 var import_tailwind_variants23 = require("tailwind-variants");
 var import_tailwind_variants24 = require("tailwind-variants");
@@ -3762,9 +4027,11 @@ var cn = (...classes) => (0, import_tailwind_variants23.cn)(classes)();
   drip,
   focusVisibleClasses,
   link,
+  nextui,
   pagination,
   radio,
   radioGroup,
+  resolveConfig,
   ringClasses,
   semanticColors,
   snippet,

package/dist/index.mjs

@@ -70,6 +70,11 @@ import "./chunk-K7LK7NCE.mjs";
 import {
   colorVariants
 } from "./chunk-LGGZKBOO.mjs";
+import {
+  nextui,
+  resolveConfig
+} from "./chunk-ONURTFN3.mjs";
+import "./chunk-45FXWIO6.mjs";
 import {
   absoluteFullClasses,
   baseStyles,
@@ -86,6 +91,7 @@ import {
 } from "./chunk-Y52EXP4A.mjs";
 import "./chunk-37PIXVP4.mjs";
 import "./chunk-M63AFAHO.mjs";
+import "./chunk-QPN3H4E3.mjs";
 import {
   commonColors
 } from "./chunk-CRCBVLUP.mjs";
@@ -123,9 +129,11 @@ export {
   drip,
   focusVisibleClasses,
   link,
+  nextui,
   pagination,
   radio,
   radioGroup,
+  resolveConfig,
   ringClasses,
   semanticColors,
   snippet,

package/dist/plugin.js

@@ -564,9 +564,6 @@ var nextui = (config = {}) => {
     defaultTheme
   );
 };
-nextui({
-  defaultTheme: "light"
-});
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   nextui,

package/dist/plugin.mjs

@@ -1,24 +1,16 @@
 import {
-  utilities
-} from "./chunk-45FXWIO6.mjs";
-import {
-  baseStyles
-} from "./chunk-IJCHUO4J.mjs";
+  nextui,
+  resolveConfig
+} from "./chunk-ONURTFN3.mjs";
+import "./chunk-45FXWIO6.mjs";
+import "./chunk-IJCHUO4J.mjs";
 import "./chunk-WQEDQHKX.mjs";
 import "./chunk-7MQD7UA2.mjs";
-import {
-  semanticColors
-} from "./chunk-Y52EXP4A.mjs";
-import {
-  removeDefaultKeys
-} from "./chunk-37PIXVP4.mjs";
+import "./chunk-Y52EXP4A.mjs";
+import "./chunk-37PIXVP4.mjs";
 import "./chunk-M63AFAHO.mjs";
-import {
-  animations
-} from "./chunk-QPN3H4E3.mjs";
-import {
-  commonColors
-} from "./chunk-CRCBVLUP.mjs";
+import "./chunk-QPN3H4E3.mjs";
+import "./chunk-CRCBVLUP.mjs";
 import "./chunk-DCEG5LGX.mjs";
 import "./chunk-L2OL7R23.mjs";
 import "./chunk-YZYGFPNK.mjs";
@@ -26,135 +18,6 @@ import "./chunk-Y4YW5MKL.mjs";
 import "./chunk-KZJBCC2H.mjs";
 import "./chunk-T3GWIVAM.mjs";
 import "./chunk-OR5PUD24.mjs";
-
-// src/plugin.ts
-import Color from "color";
-import plugin from "tailwindcss/plugin";
-import forEach from "lodash.foreach";
-import flatten from "flat";
-import get from "lodash.get";
-import deepMerge from "deepmerge";
-var SCHEME = Symbol("color-scheme");
-var VAR_PREFIX = "nextui";
-var dark = (colors) => {
-  return {
-    [SCHEME]: "dark",
-    ...colors
-  };
-};
-var light = (colors) => {
-  return {
-    [SCHEME]: "light",
-    ...colors
-  };
-};
-var resolveConfig = (config = {}, defaultTheme) => {
-  const resolved = {
-    variants: [],
-    utilities: {},
-    colors: {}
-  };
-  const configObject = typeof config === "function" ? config({ dark, light }) : config;
-  forEach(configObject, (colors, themeName) => {
-    let cssSelector = `.${themeName},.theme-${themeName},[data-theme="${themeName}"]`;
-    if (themeName === defaultTheme) {
-      cssSelector = `:root,${cssSelector}`;
-    }
-    resolved.utilities[cssSelector] = colors[SCHEME] ? {
-      "color-scheme": colors[SCHEME]
-    } : {};
-    const flatColors = removeDefaultKeys(
-      flatten(colors, {
-        safe: true,
-        delimiter: "-"
-      })
-    );
-    resolved.variants.push({
-      name: `theme-${themeName}`,
-      definition: [`&.${themeName}`, `&.theme-${themeName}`, `&[data-theme='${themeName}']`]
-    });
-    forEach(flatColors, (colorValue, colorName) => {
-      if (colorName === SCHEME || !colorValue)
-        return;
-      try {
-        const [h, s, l, defaultAlphaValue] = Color(colorValue).hsl().round().array();
-        const nextuiColorVariable = `--${VAR_PREFIX}-${colorName}`;
-        const nextuiOpacityVariable = `--${VAR_PREFIX}-${colorName}-opacity`;
-        resolved.utilities[cssSelector][nextuiColorVariable] = `${h} ${s}% ${l}%`;
-        if (typeof defaultAlphaValue === "number") {
-          resolved.utilities[cssSelector][nextuiOpacityVariable] = defaultAlphaValue.toFixed(2);
-        }
-        resolved.colors[colorName] = ({ opacityVariable, opacityValue }) => {
-          if (!isNaN(+opacityValue)) {
-            return `hsl(var(${nextuiColorVariable}) / ${opacityValue})`;
-          }
-          if (opacityVariable) {
-            return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, var(${opacityVariable})))`;
-          }
-          return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, 1))`;
-        };
-      } catch (error) {
-        console.log("error", error == null ? void 0 : error.message);
-      }
-    });
-  });
-  return resolved;
-};
-var corePlugin = (config = {}, defaultTheme) => {
-  const resolved = resolveConfig(config, defaultTheme);
-  return plugin(
-    ({ addBase, addUtilities, addVariant }) => {
-      addBase({
-        [":root, [data-theme]"]: {
-          ...baseStyles
-        }
-      });
-      addUtilities({ ...resolved.utilities, ...utilities });
-      resolved.variants.forEach((variant) => {
-        addVariant(variant.name, variant.definition);
-      });
-    },
-    {
-      theme: {
-        extend: {
-          colors: {
-            ...commonColors,
-            ...resolved.colors
-          },
-          fontSize: {
-            tiny: "0.625rem"
-          },
-          borderWidth: {
-            1: "1px",
-            1.5: "1.5px",
-            3: "3px",
-            5: "5px"
-          },
-          transitionDuration: {
-            0: "0ms",
-            250: "250ms"
-          },
-          ...animations
-        }
-      }
-    }
-  );
-};
-var nextui = (config = {}) => {
-  const userLightColors = get(config.themes, "light", {});
-  const userDarkColors = get(config.themes, "dark", {});
-  const defaultTheme = config.defaultTheme || "light";
-  return corePlugin(
-    {
-      light: deepMerge(semanticColors.light, userLightColors),
-      dark: deepMerge(semanticColors.dark, userDarkColors)
-    },
-    defaultTheme
-  );
-};
-nextui({
-  defaultTheme: "light"
-});
 export {
   nextui,
   resolveConfig

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/theme",
-  "version": "0.0.0-dev-v2-20230326032643",
+  "version": "0.0.0-dev-v2-20230326125142",
   "description": "The default theme for NextUI components",
   "keywords": [
     "theme",