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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -22,7 +22,9 @@ var button = tv({
22
22
  "subpixel-antialiased",
23
23
  "active:scale-95",
24
24
  "overflow-hidden",
25
- "gap-3"
25
+ "gap-3",
26
+ "[&>svg]:fill-current",
27
+ "[&>svg]:max-w-[2em]"
26
28
  ],
27
29
  variants: {
28
30
  variant: {
@@ -72,9 +74,12 @@ var button = tv({
72
74
  isInGroup: {
73
75
  true: "[&:not(:first-child):not(:last-child)]:rounded-none"
74
76
  },
77
+ isIconButton: {
78
+ true: "p-0 gap-0"
79
+ },
75
80
  disableAnimation: {
76
81
  true: "!transition-none",
77
- false: "transition-transform-background"
82
+ false: "transition-transform-background motion-reduce:transition-none"
78
83
  }
79
84
  },
80
85
  defaultVariants: {
@@ -317,6 +322,31 @@ var button = tv({
317
322
  isInGroup: true,
318
323
  variant: "bordered",
319
324
  class: "[&:not(:first-child)]:border-l-0"
325
+ },
326
+ {
327
+ isIconButton: true,
328
+ size: "xs",
329
+ class: "w-6 h-6"
330
+ },
331
+ {
332
+ isIconButton: true,
333
+ size: "sm",
334
+ class: "w-8 h-8"
335
+ },
336
+ {
337
+ isIconButton: true,
338
+ size: "md",
339
+ class: "w-10 h-10"
340
+ },
341
+ {
342
+ isIconButton: true,
343
+ size: "lg",
344
+ class: "w-12 h-12"
345
+ },
346
+ {
347
+ isIconButton: true,
348
+ size: "xl",
349
+ class: "w-14 h-14"
320
350
  }
321
351
  ]
322
352
  });
@@ -0,0 +1,149 @@
1
+ import {
2
+ utilities
3
+ } from "./chunk-45FXWIO6.mjs";
4
+ import {
5
+ baseStyles
6
+ } from "./chunk-IJCHUO4J.mjs";
7
+ import {
8
+ semanticColors
9
+ } from "./chunk-Y52EXP4A.mjs";
10
+ import {
11
+ removeDefaultKeys
12
+ } from "./chunk-37PIXVP4.mjs";
13
+ import {
14
+ animations
15
+ } from "./chunk-QPN3H4E3.mjs";
16
+ import {
17
+ commonColors
18
+ } from "./chunk-CRCBVLUP.mjs";
19
+
20
+ // src/plugin.ts
21
+ import Color from "color";
22
+ import plugin from "tailwindcss/plugin";
23
+ import forEach from "lodash.foreach";
24
+ import flatten from "flat";
25
+ import get from "lodash.get";
26
+ import deepMerge from "deepmerge";
27
+ var SCHEME = Symbol("color-scheme");
28
+ var VAR_PREFIX = "nextui";
29
+ var dark = (colors) => {
30
+ return {
31
+ [SCHEME]: "dark",
32
+ ...colors
33
+ };
34
+ };
35
+ var light = (colors) => {
36
+ return {
37
+ [SCHEME]: "light",
38
+ ...colors
39
+ };
40
+ };
41
+ var resolveConfig = (config = {}, defaultTheme) => {
42
+ const resolved = {
43
+ variants: [],
44
+ utilities: {},
45
+ colors: {}
46
+ };
47
+ const configObject = typeof config === "function" ? config({ dark, light }) : config;
48
+ forEach(configObject, (colors, themeName) => {
49
+ let cssSelector = `.${themeName},.theme-${themeName},[data-theme="${themeName}"]`;
50
+ if (themeName === defaultTheme) {
51
+ cssSelector = `:root,${cssSelector}`;
52
+ }
53
+ resolved.utilities[cssSelector] = colors[SCHEME] ? {
54
+ "color-scheme": colors[SCHEME]
55
+ } : {};
56
+ const flatColors = removeDefaultKeys(
57
+ flatten(colors, {
58
+ safe: true,
59
+ delimiter: "-"
60
+ })
61
+ );
62
+ resolved.variants.push({
63
+ name: `theme-${themeName}`,
64
+ definition: [`&.${themeName}`, `&.theme-${themeName}`, `&[data-theme='${themeName}']`]
65
+ });
66
+ forEach(flatColors, (colorValue, colorName) => {
67
+ if (colorName === SCHEME || !colorValue)
68
+ return;
69
+ try {
70
+ const [h, s, l, defaultAlphaValue] = Color(colorValue).hsl().round().array();
71
+ const nextuiColorVariable = `--${VAR_PREFIX}-${colorName}`;
72
+ const nextuiOpacityVariable = `--${VAR_PREFIX}-${colorName}-opacity`;
73
+ resolved.utilities[cssSelector][nextuiColorVariable] = `${h} ${s}% ${l}%`;
74
+ if (typeof defaultAlphaValue === "number") {
75
+ resolved.utilities[cssSelector][nextuiOpacityVariable] = defaultAlphaValue.toFixed(2);
76
+ }
77
+ resolved.colors[colorName] = ({ opacityVariable, opacityValue }) => {
78
+ if (!isNaN(+opacityValue)) {
79
+ return `hsl(var(${nextuiColorVariable}) / ${opacityValue})`;
80
+ }
81
+ if (opacityVariable) {
82
+ return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, var(${opacityVariable})))`;
83
+ }
84
+ return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, 1))`;
85
+ };
86
+ } catch (error) {
87
+ console.log("error", error == null ? void 0 : error.message);
88
+ }
89
+ });
90
+ });
91
+ return resolved;
92
+ };
93
+ var corePlugin = (config = {}, defaultTheme) => {
94
+ const resolved = resolveConfig(config, defaultTheme);
95
+ return plugin(
96
+ ({ addBase, addUtilities, addVariant }) => {
97
+ addBase({
98
+ [":root, [data-theme]"]: {
99
+ ...baseStyles
100
+ }
101
+ });
102
+ addUtilities({ ...resolved.utilities, ...utilities });
103
+ resolved.variants.forEach((variant) => {
104
+ addVariant(variant.name, variant.definition);
105
+ });
106
+ },
107
+ {
108
+ theme: {
109
+ extend: {
110
+ colors: {
111
+ ...commonColors,
112
+ ...resolved.colors
113
+ },
114
+ fontSize: {
115
+ tiny: "0.625rem"
116
+ },
117
+ borderWidth: {
118
+ 1: "1px",
119
+ 1.5: "1.5px",
120
+ 3: "3px",
121
+ 5: "5px"
122
+ },
123
+ transitionDuration: {
124
+ 0: "0ms",
125
+ 250: "250ms"
126
+ },
127
+ ...animations
128
+ }
129
+ }
130
+ }
131
+ );
132
+ };
133
+ var nextui = (config = {}) => {
134
+ const userLightColors = get(config.themes, "light", {});
135
+ const userDarkColors = get(config.themes, "dark", {});
136
+ const defaultTheme = config.defaultTheme || "light";
137
+ return corePlugin(
138
+ {
139
+ light: deepMerge(semanticColors.light, userLightColors),
140
+ dark: deepMerge(semanticColors.dark, userDarkColors)
141
+ },
142
+ defaultTheme
143
+ );
144
+ };
145
+
146
+ export {
147
+ resolveConfig,
148
+ nextui
149
+ };
@@ -60,6 +60,9 @@ declare const button: tailwind_variants.TVReturnType<{
60
60
  isInGroup: {
61
61
  true: string;
62
62
  };
63
+ isIconButton: {
64
+ true: string;
65
+ };
63
66
  disableAnimation: {
64
67
  true: string;
65
68
  false: string;
@@ -112,6 +115,9 @@ declare const button: tailwind_variants.TVReturnType<{
112
115
  isInGroup: {
113
116
  true: string;
114
117
  };
118
+ isIconButton: {
119
+ true: string;
120
+ };
115
121
  disableAnimation: {
116
122
  true: string;
117
123
  false: string;
@@ -125,7 +125,9 @@ var button = (0, import_tailwind_variants.tv)({
125
125
  "subpixel-antialiased",
126
126
  "active:scale-95",
127
127
  "overflow-hidden",
128
- "gap-3"
128
+ "gap-3",
129
+ "[&>svg]:fill-current",
130
+ "[&>svg]:max-w-[2em]"
129
131
  ],
130
132
  variants: {
131
133
  variant: {
@@ -175,9 +177,12 @@ var button = (0, import_tailwind_variants.tv)({
175
177
  isInGroup: {
176
178
  true: "[&:not(:first-child):not(:last-child)]:rounded-none"
177
179
  },
180
+ isIconButton: {
181
+ true: "p-0 gap-0"
182
+ },
178
183
  disableAnimation: {
179
184
  true: "!transition-none",
180
- false: "transition-transform-background"
185
+ false: "transition-transform-background motion-reduce:transition-none"
181
186
  }
182
187
  },
183
188
  defaultVariants: {
@@ -420,6 +425,31 @@ var button = (0, import_tailwind_variants.tv)({
420
425
  isInGroup: true,
421
426
  variant: "bordered",
422
427
  class: "[&:not(:first-child)]:border-l-0"
428
+ },
429
+ {
430
+ isIconButton: true,
431
+ size: "xs",
432
+ class: "w-6 h-6"
433
+ },
434
+ {
435
+ isIconButton: true,
436
+ size: "sm",
437
+ class: "w-8 h-8"
438
+ },
439
+ {
440
+ isIconButton: true,
441
+ size: "md",
442
+ class: "w-10 h-10"
443
+ },
444
+ {
445
+ isIconButton: true,
446
+ size: "lg",
447
+ class: "w-12 h-12"
448
+ },
449
+ {
450
+ isIconButton: true,
451
+ size: "xl",
452
+ class: "w-14 h-14"
423
453
  }
424
454
  ]
425
455
  });
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  button
3
- } from "../chunk-OSARGUKT.mjs";
3
+ } from "../chunk-BD2KW4ZD.mjs";
4
4
  import "../chunk-CMYR6AOY.mjs";
5
5
  import "../chunk-K7LK7NCE.mjs";
6
6
  import "../chunk-LGGZKBOO.mjs";
@@ -648,7 +648,9 @@ var button = (0, import_tailwind_variants6.tv)({
648
648
  "subpixel-antialiased",
649
649
  "active:scale-95",
650
650
  "overflow-hidden",
651
- "gap-3"
651
+ "gap-3",
652
+ "[&>svg]:fill-current",
653
+ "[&>svg]:max-w-[2em]"
652
654
  ],
653
655
  variants: {
654
656
  variant: {
@@ -698,9 +700,12 @@ var button = (0, import_tailwind_variants6.tv)({
698
700
  isInGroup: {
699
701
  true: "[&:not(:first-child):not(:last-child)]:rounded-none"
700
702
  },
703
+ isIconButton: {
704
+ true: "p-0 gap-0"
705
+ },
701
706
  disableAnimation: {
702
707
  true: "!transition-none",
703
- false: "transition-transform-background"
708
+ false: "transition-transform-background motion-reduce:transition-none"
704
709
  }
705
710
  },
706
711
  defaultVariants: {
@@ -943,6 +948,31 @@ var button = (0, import_tailwind_variants6.tv)({
943
948
  isInGroup: true,
944
949
  variant: "bordered",
945
950
  class: "[&:not(:first-child)]:border-l-0"
951
+ },
952
+ {
953
+ isIconButton: true,
954
+ size: "xs",
955
+ class: "w-6 h-6"
956
+ },
957
+ {
958
+ isIconButton: true,
959
+ size: "sm",
960
+ class: "w-8 h-8"
961
+ },
962
+ {
963
+ isIconButton: true,
964
+ size: "md",
965
+ class: "w-10 h-10"
966
+ },
967
+ {
968
+ isIconButton: true,
969
+ size: "lg",
970
+ class: "w-12 h-12"
971
+ },
972
+ {
973
+ isIconButton: true,
974
+ size: "xl",
975
+ class: "w-14 h-14"
946
976
  }
947
977
  ]
948
978
  });
@@ -55,7 +55,7 @@ import {
55
55
  } from "../chunk-VKFQ7EZN.mjs";
56
56
  import {
57
57
  button
58
- } from "../chunk-OSARGUKT.mjs";
58
+ } from "../chunk-BD2KW4ZD.mjs";
59
59
  import {
60
60
  card
61
61
  } from "../chunk-Z5OKZPNV.mjs";
package/dist/index.d.ts CHANGED
@@ -24,11 +24,14 @@ export { absoluteFullClasses, baseStyles, focusVisibleClasses, ringClasses, tran
24
24
  export { SlotsToClasses } from './utils/types.js';
25
25
  export { colorVariants } from './utils/variants.js';
26
26
  export { colors } from './colors/index.js';
27
+ export { Colors, ColorsWithScheme, ConfigFunction, ConfigObject, DefaultTheme, NextUIConfig, nextui, resolveConfig } from './plugin.js';
27
28
  export { VariantProps, tv } from 'tailwind-variants';
28
29
  export { BaseColors, ColorScale, SemanticBaseColors, SemanticColors } from './colors/types.js';
29
30
  export { commonColors } from './colors/common.js';
30
31
  export { semanticColors } from './colors/semantic.js';
31
32
  import 'tailwind-variants/dist/config';
33
+ import 'tailwindcss';
34
+ import 'tailwindcss/types/config';
32
35
 
33
36
  declare const cn: (...classes: any) => string;
34
37
 
package/dist/index.js CHANGED
@@ -47,9 +47,11 @@ __export(src_exports, {
47
47
  drip: () => drip,
48
48
  focusVisibleClasses: () => focusVisibleClasses,
49
49
  link: () => link,
50
+ nextui: () => nextui,
50
51
  pagination: () => pagination,
51
52
  radio: () => radio,
52
53
  radioGroup: () => radioGroup,
54
+ resolveConfig: () => resolveConfig,
53
55
  ringClasses: () => ringClasses,
54
56
  semanticColors: () => semanticColors,
55
57
  snippet: () => snippet,
@@ -670,7 +672,9 @@ var button = (0, import_tailwind_variants6.tv)({
670
672
  "subpixel-antialiased",
671
673
  "active:scale-95",
672
674
  "overflow-hidden",
673
- "gap-3"
675
+ "gap-3",
676
+ "[&>svg]:fill-current",
677
+ "[&>svg]:max-w-[2em]"
674
678
  ],
675
679
  variants: {
676
680
  variant: {
@@ -720,9 +724,12 @@ var button = (0, import_tailwind_variants6.tv)({
720
724
  isInGroup: {
721
725
  true: "[&:not(:first-child):not(:last-child)]:rounded-none"
722
726
  },
727
+ isIconButton: {
728
+ true: "p-0 gap-0"
729
+ },
723
730
  disableAnimation: {
724
731
  true: "!transition-none",
725
- false: "transition-transform-background"
732
+ false: "transition-transform-background motion-reduce:transition-none"
726
733
  }
727
734
  },
728
735
  defaultVariants: {
@@ -965,6 +972,31 @@ var button = (0, import_tailwind_variants6.tv)({
965
972
  isInGroup: true,
966
973
  variant: "bordered",
967
974
  class: "[&:not(:first-child)]:border-l-0"
975
+ },
976
+ {
977
+ isIconButton: true,
978
+ size: "xs",
979
+ class: "w-6 h-6"
980
+ },
981
+ {
982
+ isIconButton: true,
983
+ size: "sm",
984
+ class: "w-8 h-8"
985
+ },
986
+ {
987
+ isIconButton: true,
988
+ size: "md",
989
+ class: "w-10 h-10"
990
+ },
991
+ {
992
+ isIconButton: true,
993
+ size: "lg",
994
+ class: "w-12 h-12"
995
+ },
996
+ {
997
+ isIconButton: true,
998
+ size: "xl",
999
+ class: "w-14 h-14"
968
1000
  }
969
1001
  ]
970
1002
  });
@@ -3570,6 +3602,17 @@ function swapColorValues(colors2) {
3570
3602
  }
3571
3603
  return swappedColors;
3572
3604
  }
3605
+ function removeDefaultKeys(obj) {
3606
+ const newObj = {};
3607
+ for (const key in obj) {
3608
+ if (key.endsWith("-DEFAULT")) {
3609
+ newObj[key.replace("-DEFAULT", "")] = obj[key];
3610
+ continue;
3611
+ }
3612
+ newObj[key] = obj[key];
3613
+ }
3614
+ return newObj;
3615
+ }
3573
3616
 
3574
3617
  // src/colors/semantic.ts
3575
3618
  var base = {
@@ -3705,6 +3748,258 @@ var colors = {
3705
3748
  ...semanticColors
3706
3749
  };
3707
3750
 
3751
+ // src/plugin.ts
3752
+ var import_color = __toESM(require("color"));
3753
+ var import_plugin = __toESM(require("tailwindcss/plugin"));
3754
+ var import_lodash = __toESM(require("lodash.foreach"));
3755
+ var import_flat = __toESM(require("flat"));
3756
+ var import_lodash2 = __toESM(require("lodash.get"));
3757
+ var import_deepmerge = __toESM(require("deepmerge"));
3758
+
3759
+ // src/animations/index.ts
3760
+ var animations = {
3761
+ animation: {
3762
+ "drip-expand": "drip-expand 350ms linear",
3763
+ "spinner-ease-spin": "spinner-spin 0.8s ease infinite",
3764
+ "spinner-linear-spin": "spinner-spin 0.8s linear infinite",
3765
+ "appearance-in": "appearance-in 250ms ease-out normal both",
3766
+ "appearance-out": "appearance-out 60ms ease-in normal both"
3767
+ },
3768
+ keyframes: {
3769
+ "spinner-spin": {
3770
+ "0%": {
3771
+ transform: "rotate(0deg)"
3772
+ },
3773
+ "100%": {
3774
+ transform: "rotate(360deg)"
3775
+ }
3776
+ },
3777
+ "drip-expand": {
3778
+ "0%": {
3779
+ opacity: "0.4",
3780
+ transform: "scale(0)"
3781
+ },
3782
+ "100%": {
3783
+ opacity: "0",
3784
+ transform: "scale(2)"
3785
+ }
3786
+ },
3787
+ "appearance-in": {
3788
+ "0%": {
3789
+ opacity: "0",
3790
+ transform: "translateZ(0) scale(0.95)"
3791
+ },
3792
+ "60%": {
3793
+ opacity: "0.75",
3794
+ backfaceVisibility: "hidden",
3795
+ webkitFontSmoothing: "antialiased",
3796
+ transform: "translateZ(0) scale(1.05)"
3797
+ },
3798
+ "100%": {
3799
+ opacity: "1",
3800
+ transform: "translateZ(0) scale(1)"
3801
+ }
3802
+ },
3803
+ "appearance-out": {
3804
+ "0%": {
3805
+ opacity: "1",
3806
+ transform: "scale(1)"
3807
+ },
3808
+ "100%": {
3809
+ opacity: "0",
3810
+ transform: "scale(0.85)"
3811
+ }
3812
+ }
3813
+ }
3814
+ };
3815
+
3816
+ // src/utilities/index.ts
3817
+ var DEFAULT_TRANSITION_DURATION = "250ms";
3818
+ var utilities = {
3819
+ ".leading-inherit": {
3820
+ "line-height": "inherit"
3821
+ },
3822
+ ".bg-img-inherit": {
3823
+ "background-image": "inherit"
3824
+ },
3825
+ ".bg-clip-inherit": {
3826
+ "background-clip": "inherit"
3827
+ },
3828
+ ".text-fill-inherit": {
3829
+ "-webkit-text-fill-color": "inherit"
3830
+ },
3831
+ ".transition-background": {
3832
+ "transition-property": "background",
3833
+ "transition-timing-function": "ease",
3834
+ "transition-duration": DEFAULT_TRANSITION_DURATION
3835
+ },
3836
+ ".transition-all": {
3837
+ "transition-property": "all",
3838
+ "transition-timing-function": "ease",
3839
+ "transition-duration": DEFAULT_TRANSITION_DURATION
3840
+ },
3841
+ ".transition": {
3842
+ "transition-property": "color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter",
3843
+ "transition-timing-function": "ease",
3844
+ "transition-duration": DEFAULT_TRANSITION_DURATION
3845
+ },
3846
+ ".transition-colors": {
3847
+ "transition-property": "color, background-color, border-color, text-decoration-color, fill, stroke",
3848
+ "transition-timing-function": "ease",
3849
+ "transition-duration": DEFAULT_TRANSITION_DURATION
3850
+ },
3851
+ ".transition-opacity": {
3852
+ "transition-property": "opacity",
3853
+ "transition-timing-function": "ease",
3854
+ "transition-duration": DEFAULT_TRANSITION_DURATION
3855
+ },
3856
+ ".transition-width": {
3857
+ "transition-property": "width",
3858
+ "transition-timing-function": "ease",
3859
+ "transition-duration": DEFAULT_TRANSITION_DURATION
3860
+ },
3861
+ ".transition-shadow": {
3862
+ "transition-property": "box-shadow",
3863
+ "transition-timing-function": "ease",
3864
+ "transition-duration": DEFAULT_TRANSITION_DURATION
3865
+ },
3866
+ ".transition-transform": {
3867
+ "transition-property": "transform",
3868
+ "transition-timing-function": "ease",
3869
+ "transition-duration": DEFAULT_TRANSITION_DURATION
3870
+ },
3871
+ ".transition-transform-opacity": {
3872
+ "transition-property": "transform, opacity",
3873
+ "transition-timing-function": "ease",
3874
+ "transition-duration": DEFAULT_TRANSITION_DURATION
3875
+ },
3876
+ ".transition-transform-background": {
3877
+ "transition-property": "transform, background",
3878
+ "transition-timing-function": "ease",
3879
+ "transition-duration": DEFAULT_TRANSITION_DURATION
3880
+ }
3881
+ };
3882
+
3883
+ // src/plugin.ts
3884
+ var SCHEME = Symbol("color-scheme");
3885
+ var VAR_PREFIX = "nextui";
3886
+ var dark = (colors2) => {
3887
+ return {
3888
+ [SCHEME]: "dark",
3889
+ ...colors2
3890
+ };
3891
+ };
3892
+ var light2 = (colors2) => {
3893
+ return {
3894
+ [SCHEME]: "light",
3895
+ ...colors2
3896
+ };
3897
+ };
3898
+ var resolveConfig = (config = {}, defaultTheme) => {
3899
+ const resolved = {
3900
+ variants: [],
3901
+ utilities: {},
3902
+ colors: {}
3903
+ };
3904
+ const configObject = typeof config === "function" ? config({ dark, light: light2 }) : config;
3905
+ (0, import_lodash.default)(configObject, (colors2, themeName) => {
3906
+ let cssSelector = `.${themeName},.theme-${themeName},[data-theme="${themeName}"]`;
3907
+ if (themeName === defaultTheme) {
3908
+ cssSelector = `:root,${cssSelector}`;
3909
+ }
3910
+ resolved.utilities[cssSelector] = colors2[SCHEME] ? {
3911
+ "color-scheme": colors2[SCHEME]
3912
+ } : {};
3913
+ const flatColors = removeDefaultKeys(
3914
+ (0, import_flat.default)(colors2, {
3915
+ safe: true,
3916
+ delimiter: "-"
3917
+ })
3918
+ );
3919
+ resolved.variants.push({
3920
+ name: `theme-${themeName}`,
3921
+ definition: [`&.${themeName}`, `&.theme-${themeName}`, `&[data-theme='${themeName}']`]
3922
+ });
3923
+ (0, import_lodash.default)(flatColors, (colorValue, colorName) => {
3924
+ if (colorName === SCHEME || !colorValue)
3925
+ return;
3926
+ try {
3927
+ const [h, s, l, defaultAlphaValue] = (0, import_color.default)(colorValue).hsl().round().array();
3928
+ const nextuiColorVariable = `--${VAR_PREFIX}-${colorName}`;
3929
+ const nextuiOpacityVariable = `--${VAR_PREFIX}-${colorName}-opacity`;
3930
+ resolved.utilities[cssSelector][nextuiColorVariable] = `${h} ${s}% ${l}%`;
3931
+ if (typeof defaultAlphaValue === "number") {
3932
+ resolved.utilities[cssSelector][nextuiOpacityVariable] = defaultAlphaValue.toFixed(2);
3933
+ }
3934
+ resolved.colors[colorName] = ({ opacityVariable, opacityValue }) => {
3935
+ if (!isNaN(+opacityValue)) {
3936
+ return `hsl(var(${nextuiColorVariable}) / ${opacityValue})`;
3937
+ }
3938
+ if (opacityVariable) {
3939
+ return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, var(${opacityVariable})))`;
3940
+ }
3941
+ return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, 1))`;
3942
+ };
3943
+ } catch (error) {
3944
+ console.log("error", error == null ? void 0 : error.message);
3945
+ }
3946
+ });
3947
+ });
3948
+ return resolved;
3949
+ };
3950
+ var corePlugin = (config = {}, defaultTheme) => {
3951
+ const resolved = resolveConfig(config, defaultTheme);
3952
+ return (0, import_plugin.default)(
3953
+ ({ addBase, addUtilities, addVariant }) => {
3954
+ addBase({
3955
+ [":root, [data-theme]"]: {
3956
+ ...baseStyles
3957
+ }
3958
+ });
3959
+ addUtilities({ ...resolved.utilities, ...utilities });
3960
+ resolved.variants.forEach((variant) => {
3961
+ addVariant(variant.name, variant.definition);
3962
+ });
3963
+ },
3964
+ {
3965
+ theme: {
3966
+ extend: {
3967
+ colors: {
3968
+ ...commonColors,
3969
+ ...resolved.colors
3970
+ },
3971
+ fontSize: {
3972
+ tiny: "0.625rem"
3973
+ },
3974
+ borderWidth: {
3975
+ 1: "1px",
3976
+ 1.5: "1.5px",
3977
+ 3: "3px",
3978
+ 5: "5px"
3979
+ },
3980
+ transitionDuration: {
3981
+ 0: "0ms",
3982
+ 250: "250ms"
3983
+ },
3984
+ ...animations
3985
+ }
3986
+ }
3987
+ }
3988
+ );
3989
+ };
3990
+ var nextui = (config = {}) => {
3991
+ const userLightColors = (0, import_lodash2.default)(config.themes, "light", {});
3992
+ const userDarkColors = (0, import_lodash2.default)(config.themes, "dark", {});
3993
+ const defaultTheme = config.defaultTheme || "light";
3994
+ return corePlugin(
3995
+ {
3996
+ light: (0, import_deepmerge.default)(semanticColors.light, userLightColors),
3997
+ dark: (0, import_deepmerge.default)(semanticColors.dark, userDarkColors)
3998
+ },
3999
+ defaultTheme
4000
+ );
4001
+ };
4002
+
3708
4003
  // src/index.ts
3709
4004
  var import_tailwind_variants23 = require("tailwind-variants");
3710
4005
  var import_tailwind_variants24 = require("tailwind-variants");
@@ -3732,9 +4027,11 @@ var cn = (...classes) => (0, import_tailwind_variants23.cn)(classes)();
3732
4027
  drip,
3733
4028
  focusVisibleClasses,
3734
4029
  link,
4030
+ nextui,
3735
4031
  pagination,
3736
4032
  radio,
3737
4033
  radioGroup,
4034
+ resolveConfig,
3738
4035
  ringClasses,
3739
4036
  semanticColors,
3740
4037
  snippet,
package/dist/index.mjs CHANGED
@@ -55,7 +55,7 @@ import {
55
55
  } from "./chunk-VKFQ7EZN.mjs";
56
56
  import {
57
57
  button
58
- } from "./chunk-OSARGUKT.mjs";
58
+ } from "./chunk-BD2KW4ZD.mjs";
59
59
  import {
60
60
  card
61
61
  } from "./chunk-Z5OKZPNV.mjs";
@@ -70,6 +70,11 @@ import "./chunk-K7LK7NCE.mjs";
70
70
  import {
71
71
  colorVariants
72
72
  } from "./chunk-LGGZKBOO.mjs";
73
+ import {
74
+ nextui,
75
+ resolveConfig
76
+ } from "./chunk-ONURTFN3.mjs";
77
+ import "./chunk-45FXWIO6.mjs";
73
78
  import {
74
79
  absoluteFullClasses,
75
80
  baseStyles,
@@ -86,6 +91,7 @@ import {
86
91
  } from "./chunk-Y52EXP4A.mjs";
87
92
  import "./chunk-37PIXVP4.mjs";
88
93
  import "./chunk-M63AFAHO.mjs";
94
+ import "./chunk-QPN3H4E3.mjs";
89
95
  import {
90
96
  commonColors
91
97
  } from "./chunk-CRCBVLUP.mjs";
@@ -123,9 +129,11 @@ export {
123
129
  drip,
124
130
  focusVisibleClasses,
125
131
  link,
132
+ nextui,
126
133
  pagination,
127
134
  radio,
128
135
  radioGroup,
136
+ resolveConfig,
129
137
  ringClasses,
130
138
  semanticColors,
131
139
  snippet,
package/dist/plugin.js CHANGED
@@ -564,9 +564,6 @@ var nextui = (config = {}) => {
564
564
  defaultTheme
565
565
  );
566
566
  };
567
- nextui({
568
- defaultTheme: "light"
569
- });
570
567
  // Annotate the CommonJS export names for ESM import in node:
571
568
  0 && (module.exports = {
572
569
  nextui,
package/dist/plugin.mjs CHANGED
@@ -1,24 +1,16 @@
1
1
  import {
2
- utilities
3
- } from "./chunk-45FXWIO6.mjs";
4
- import {
5
- baseStyles
6
- } from "./chunk-IJCHUO4J.mjs";
2
+ nextui,
3
+ resolveConfig
4
+ } from "./chunk-ONURTFN3.mjs";
5
+ import "./chunk-45FXWIO6.mjs";
6
+ import "./chunk-IJCHUO4J.mjs";
7
7
  import "./chunk-WQEDQHKX.mjs";
8
8
  import "./chunk-7MQD7UA2.mjs";
9
- import {
10
- semanticColors
11
- } from "./chunk-Y52EXP4A.mjs";
12
- import {
13
- removeDefaultKeys
14
- } from "./chunk-37PIXVP4.mjs";
9
+ import "./chunk-Y52EXP4A.mjs";
10
+ import "./chunk-37PIXVP4.mjs";
15
11
  import "./chunk-M63AFAHO.mjs";
16
- import {
17
- animations
18
- } from "./chunk-QPN3H4E3.mjs";
19
- import {
20
- commonColors
21
- } from "./chunk-CRCBVLUP.mjs";
12
+ import "./chunk-QPN3H4E3.mjs";
13
+ import "./chunk-CRCBVLUP.mjs";
22
14
  import "./chunk-DCEG5LGX.mjs";
23
15
  import "./chunk-L2OL7R23.mjs";
24
16
  import "./chunk-YZYGFPNK.mjs";
@@ -26,135 +18,6 @@ import "./chunk-Y4YW5MKL.mjs";
26
18
  import "./chunk-KZJBCC2H.mjs";
27
19
  import "./chunk-T3GWIVAM.mjs";
28
20
  import "./chunk-OR5PUD24.mjs";
29
-
30
- // src/plugin.ts
31
- import Color from "color";
32
- import plugin from "tailwindcss/plugin";
33
- import forEach from "lodash.foreach";
34
- import flatten from "flat";
35
- import get from "lodash.get";
36
- import deepMerge from "deepmerge";
37
- var SCHEME = Symbol("color-scheme");
38
- var VAR_PREFIX = "nextui";
39
- var dark = (colors) => {
40
- return {
41
- [SCHEME]: "dark",
42
- ...colors
43
- };
44
- };
45
- var light = (colors) => {
46
- return {
47
- [SCHEME]: "light",
48
- ...colors
49
- };
50
- };
51
- var resolveConfig = (config = {}, defaultTheme) => {
52
- const resolved = {
53
- variants: [],
54
- utilities: {},
55
- colors: {}
56
- };
57
- const configObject = typeof config === "function" ? config({ dark, light }) : config;
58
- forEach(configObject, (colors, themeName) => {
59
- let cssSelector = `.${themeName},.theme-${themeName},[data-theme="${themeName}"]`;
60
- if (themeName === defaultTheme) {
61
- cssSelector = `:root,${cssSelector}`;
62
- }
63
- resolved.utilities[cssSelector] = colors[SCHEME] ? {
64
- "color-scheme": colors[SCHEME]
65
- } : {};
66
- const flatColors = removeDefaultKeys(
67
- flatten(colors, {
68
- safe: true,
69
- delimiter: "-"
70
- })
71
- );
72
- resolved.variants.push({
73
- name: `theme-${themeName}`,
74
- definition: [`&.${themeName}`, `&.theme-${themeName}`, `&[data-theme='${themeName}']`]
75
- });
76
- forEach(flatColors, (colorValue, colorName) => {
77
- if (colorName === SCHEME || !colorValue)
78
- return;
79
- try {
80
- const [h, s, l, defaultAlphaValue] = Color(colorValue).hsl().round().array();
81
- const nextuiColorVariable = `--${VAR_PREFIX}-${colorName}`;
82
- const nextuiOpacityVariable = `--${VAR_PREFIX}-${colorName}-opacity`;
83
- resolved.utilities[cssSelector][nextuiColorVariable] = `${h} ${s}% ${l}%`;
84
- if (typeof defaultAlphaValue === "number") {
85
- resolved.utilities[cssSelector][nextuiOpacityVariable] = defaultAlphaValue.toFixed(2);
86
- }
87
- resolved.colors[colorName] = ({ opacityVariable, opacityValue }) => {
88
- if (!isNaN(+opacityValue)) {
89
- return `hsl(var(${nextuiColorVariable}) / ${opacityValue})`;
90
- }
91
- if (opacityVariable) {
92
- return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, var(${opacityVariable})))`;
93
- }
94
- return `hsl(var(${nextuiColorVariable}) / var(${nextuiOpacityVariable}, 1))`;
95
- };
96
- } catch (error) {
97
- console.log("error", error == null ? void 0 : error.message);
98
- }
99
- });
100
- });
101
- return resolved;
102
- };
103
- var corePlugin = (config = {}, defaultTheme) => {
104
- const resolved = resolveConfig(config, defaultTheme);
105
- return plugin(
106
- ({ addBase, addUtilities, addVariant }) => {
107
- addBase({
108
- [":root, [data-theme]"]: {
109
- ...baseStyles
110
- }
111
- });
112
- addUtilities({ ...resolved.utilities, ...utilities });
113
- resolved.variants.forEach((variant) => {
114
- addVariant(variant.name, variant.definition);
115
- });
116
- },
117
- {
118
- theme: {
119
- extend: {
120
- colors: {
121
- ...commonColors,
122
- ...resolved.colors
123
- },
124
- fontSize: {
125
- tiny: "0.625rem"
126
- },
127
- borderWidth: {
128
- 1: "1px",
129
- 1.5: "1.5px",
130
- 3: "3px",
131
- 5: "5px"
132
- },
133
- transitionDuration: {
134
- 0: "0ms",
135
- 250: "250ms"
136
- },
137
- ...animations
138
- }
139
- }
140
- }
141
- );
142
- };
143
- var nextui = (config = {}) => {
144
- const userLightColors = get(config.themes, "light", {});
145
- const userDarkColors = get(config.themes, "dark", {});
146
- const defaultTheme = config.defaultTheme || "light";
147
- return corePlugin(
148
- {
149
- light: deepMerge(semanticColors.light, userLightColors),
150
- dark: deepMerge(semanticColors.dark, userDarkColors)
151
- },
152
- defaultTheme
153
- );
154
- };
155
- nextui({
156
- defaultTheme: "light"
157
- });
158
21
  export {
159
22
  nextui,
160
23
  resolveConfig
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nextui-org/theme",
3
- "version": "0.0.0-dev-v2-20230326024632",
3
+ "version": "0.0.0-dev-v2-20230326125142",
4
4
  "description": "The default theme for NextUI components",
5
5
  "keywords": [
6
6
  "theme",