@nextui-org/theme 2.1.12 → 2.1.13

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.
@@ -121,7 +121,7 @@ var tv = (0, import_tailwind_variants.createTV)({
121
121
  // src/components/select.ts
122
122
  var select = tv({
123
123
  slots: {
124
- base: ["group inline-flex flex-col relative w-full", "data-[has-helper=true]:mb-4"],
124
+ base: ["group inline-flex flex-col relative w-full"],
125
125
  label: [
126
126
  "block",
127
127
  "absolute",
@@ -130,18 +130,26 @@ var select = tv({
130
130
  "subpixel-antialiased",
131
131
  "text-small",
132
132
  "text-foreground-500",
133
- "pointer-events-none"
133
+ "pointer-events-none",
134
+ "opacity-70",
135
+ "group-data-[filled=true]:opacity-100"
134
136
  ],
135
137
  mainWrapper: "w-full flex flex-col",
136
138
  trigger: "relative px-3 gap-3 w-full inline-flex flex-row items-center shadow-sm outline-none tap-highlight-transparent",
137
139
  innerWrapper: "inline-flex h-full w-[calc(100%_-_theme(spacing.unit-6))] min-h-unit-4 items-center gap-1.5 box-border",
138
140
  selectorIcon: "absolute right-3 w-unit-4 h-unit-4",
139
141
  spinner: "absolute right-3",
140
- value: ["font-normal", "w-full", "text-left"],
142
+ value: [
143
+ "font-normal",
144
+ "w-full",
145
+ "text-left",
146
+ "opacity-70",
147
+ "group-data-[has-value=true]:opacity-100"
148
+ ],
141
149
  listboxWrapper: "scroll-py-6 max-h-64 w-full",
142
150
  listbox: "",
143
151
  popoverContent: "w-full p-1 overflow-hidden",
144
- helperWrapper: "flex absolute -bottom-[calc(theme(fontSize.tiny)*1.5)] flex-col gap-1.5 px-1",
152
+ helperWrapper: "p-1 flex relative flex-col gap-1.5",
145
153
  description: "text-tiny text-foreground-400",
146
154
  errorMessage: "text-tiny text-danger"
147
155
  },
@@ -152,7 +160,9 @@ var select = tv({
152
160
  "bg-default-100",
153
161
  "data-[hover=true]:bg-default-200",
154
162
  "group-data-[focus=true]:bg-default-100"
155
- ]
163
+ ],
164
+ label: "text-default-foreground",
165
+ value: "placeholder:text-default-foreground"
156
166
  },
157
167
  faded: {
158
168
  trigger: [
@@ -160,16 +170,21 @@ var select = tv({
160
170
  "border-medium",
161
171
  "border-default-200",
162
172
  "data-[hover=true]:border-default-400"
163
- ]
173
+ ],
174
+ label: "text-default-foreground",
175
+ value: "placeholder:text-default-foreground"
164
176
  },
165
177
  bordered: {
166
178
  trigger: [
167
179
  "border-medium",
168
180
  "border-default-200",
169
181
  "data-[hover=true]:border-default-400",
170
- "data-[open=true]:border-foreground",
171
- "data-[focus=true]:border-foreground"
172
- ]
182
+ "data-[open=true]:border-default-foreground",
183
+ "data-[focus=true]:border-default-foreground",
184
+ "data-[focus=true]:border-default-foreground"
185
+ ],
186
+ label: "text-foreground",
187
+ value: "placeholder:text-foreground"
173
188
  },
174
189
  underlined: {
175
190
  trigger: [
@@ -186,7 +201,7 @@ var select = tv({
186
201
  "after:content-['']",
187
202
  "after:w-0",
188
203
  "after:origin-center",
189
- "after:bg-foreground",
204
+ "after:bg-default-foreground",
190
205
  "after:absolute",
191
206
  "after:left-1/2",
192
207
  "after:-translate-x-1/2",
@@ -194,12 +209,14 @@ var select = tv({
194
209
  "after:h-[2px]",
195
210
  "data-[open=true]:after:w-full",
196
211
  "data-[focus=true]:after:w-full"
197
- ]
212
+ ],
213
+ label: "text-foreground",
214
+ value: "placeholder:text-foreground"
198
215
  }
199
216
  },
200
217
  color: {
201
218
  default: {
202
- value: ["text-foreground-500", "group-data-[has-value=true]:text-foreground"]
219
+ label: "group-data-[filled=true]:opacity-80"
203
220
  },
204
221
  primary: {},
205
222
  secondary: {},
@@ -560,13 +577,6 @@ var select = tv({
560
577
  ]
561
578
  }
562
579
  },
563
- {
564
- labelPlacement: "inside",
565
- color: "default",
566
- class: {
567
- label: "group-data-[filled=true]:text-foreground-600"
568
- }
569
- },
570
580
  {
571
581
  isInvalid: true,
572
582
  variant: "flat",
@@ -625,15 +635,7 @@ var select = tv({
625
635
  isMultiline: false,
626
636
  class: {
627
637
  base: "group relative justify-end",
628
- label: [
629
- "pb-0",
630
- "z-20",
631
- "opacity-60",
632
- "top-1/2",
633
- "-translate-y-1/2",
634
- "group-data-[filled=true]:opacity-100",
635
- "group-data-[filled=true]:left-0"
636
- ]
638
+ label: ["pb-0", "z-20", "top-1/2", "-translate-y-1/2", "group-data-[filled=true]:left-0"]
637
639
  }
638
640
  },
639
641
  {
@@ -785,6 +787,12 @@ var select = tv({
785
787
  ],
786
788
  base: "data-[has-label=true]:mt-[calc(theme(fontSize.small)_+_12px)]"
787
789
  }
790
+ },
791
+ {
792
+ labelPlacement: ["inside", "outside"],
793
+ class: {
794
+ label: ["pe-2", "max-w-full", "text-ellipsis", "overflow-hidden"]
795
+ }
788
796
  }
789
797
  ]
790
798
  });
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  select
3
- } from "../chunk-TLWI2J7W.mjs";
3
+ } from "../chunk-DNEFEC5I.mjs";
4
4
  import "../chunk-CMYR6AOY.mjs";
5
5
  import "../chunk-K7LK7NCE.mjs";
6
6
  import "../chunk-2PIR7DFM.mjs";
package/dist/index.js CHANGED
@@ -3769,7 +3769,7 @@ var circularProgress = tv({
3769
3769
  // src/components/input.ts
3770
3770
  var input = tv({
3771
3771
  slots: {
3772
- base: ["group flex relative flex-col", "data-[has-helper=true]:mb-4"],
3772
+ base: "group flex flex-col",
3773
3773
  label: [
3774
3774
  "absolute",
3775
3775
  "z-10",
@@ -3778,15 +3778,19 @@ var input = tv({
3778
3778
  "subpixel-antialiased",
3779
3779
  "block",
3780
3780
  "text-small",
3781
- "text-foreground-500"
3781
+ "text-foreground-500",
3782
+ "opacity-70",
3783
+ "group-data-[filled-within=true]:opacity-100"
3782
3784
  ],
3783
3785
  mainWrapper: "h-full",
3784
3786
  inputWrapper: "relative w-full inline-flex tap-highlight-transparent flex-row items-center shadow-sm px-3 gap-3",
3785
3787
  innerWrapper: "inline-flex w-full items-center h-full box-border",
3786
3788
  input: [
3789
+ "opacity-70",
3787
3790
  "w-full font-normal bg-transparent !outline-none placeholder:text-foreground-500 focus-visible:outline-none",
3788
3791
  "data-[has-start-content=true]:ps-1.5",
3789
- "data-[has-end-content=true]:pe-1.5"
3792
+ "data-[has-end-content=true]:pe-1.5",
3793
+ "group-data-[has-value=true]:opacity-100"
3790
3794
  ],
3791
3795
  clearButton: [
3792
3796
  "p-2",
@@ -3805,7 +3809,7 @@ var input = tv({
3805
3809
  "rounded-full",
3806
3810
  ...dataFocusVisibleClasses
3807
3811
  ],
3808
- helperWrapper: "flex absolute -bottom-[calc(theme(fontSize.tiny)*1.5)] flex-col gap-1.5 px-1",
3812
+ helperWrapper: "p-1 flex relative flex-col gap-1.5",
3809
3813
  description: "text-tiny text-foreground-400",
3810
3814
  errorMessage: "text-tiny text-danger"
3811
3815
  },
@@ -3816,7 +3820,9 @@ var input = tv({
3816
3820
  "bg-default-100",
3817
3821
  "data-[hover=true]:bg-default-200",
3818
3822
  "group-data-[focus=true]:bg-default-100"
3819
- ]
3823
+ ],
3824
+ input: "placeholder:text-default-foreground",
3825
+ label: "text-default-foreground"
3820
3826
  },
3821
3827
  faded: {
3822
3828
  inputWrapper: [
@@ -3824,15 +3830,19 @@ var input = tv({
3824
3830
  "border-medium",
3825
3831
  "border-default-200",
3826
3832
  "data-[hover=true]:border-default-400"
3827
- ]
3833
+ ],
3834
+ input: "placeholder:text-default-foreground",
3835
+ label: "text-default-foreground"
3828
3836
  },
3829
3837
  bordered: {
3830
3838
  inputWrapper: [
3831
3839
  "border-medium",
3832
3840
  "border-default-200",
3833
3841
  "data-[hover=true]:border-default-400",
3834
- "group-data-[focus=true]:border-foreground"
3835
- ]
3842
+ "group-data-[focus=true]:border-default-foreground"
3843
+ ],
3844
+ input: "placeholder:text-foreground",
3845
+ label: "text-foreground"
3836
3846
  },
3837
3847
  underlined: {
3838
3848
  inputWrapper: [
@@ -3849,7 +3859,7 @@ var input = tv({
3849
3859
  "after:content-['']",
3850
3860
  "after:w-0",
3851
3861
  "after:origin-center",
3852
- "after:bg-foreground",
3862
+ "after:bg-default-foreground",
3853
3863
  "after:absolute",
3854
3864
  "after:left-1/2",
3855
3865
  "after:-translate-x-1/2",
@@ -3857,11 +3867,15 @@ var input = tv({
3857
3867
  "after:h-[2px]",
3858
3868
  "group-data-[focus=true]:after:w-full"
3859
3869
  ],
3860
- innerWrapper: "pb-1"
3870
+ innerWrapper: "pb-1",
3871
+ input: "placeholder:text-foreground",
3872
+ label: "text-foreground"
3861
3873
  }
3862
3874
  },
3863
3875
  color: {
3864
- default: {},
3876
+ default: {
3877
+ label: "group-data-[filled-within=true]:opacity-80"
3878
+ },
3865
3879
  primary: {},
3866
3880
  secondary: {},
3867
3881
  success: {},
@@ -4230,13 +4244,6 @@ var input = tv({
4230
4244
  ]
4231
4245
  }
4232
4246
  },
4233
- {
4234
- labelPlacement: "inside",
4235
- color: "default",
4236
- class: {
4237
- label: "group-data-[filled-within=true]:text-foreground-600"
4238
- }
4239
- },
4240
4247
  {
4241
4248
  isInvalid: true,
4242
4249
  variant: "flat",
@@ -4312,11 +4319,9 @@ var input = tv({
4312
4319
  label: [
4313
4320
  "pb-0",
4314
4321
  "z-20",
4315
- "opacity-60",
4316
4322
  "top-1/2",
4317
4323
  "-translate-y-1/2",
4318
- "group-data-[filled-within=true]:left-0",
4319
- "group-data-[filled-within=true]:opacity-100"
4324
+ "group-data-[filled-within=true]:left-0"
4320
4325
  ]
4321
4326
  }
4322
4327
  },
@@ -4329,7 +4334,6 @@ var input = tv({
4329
4334
  {
4330
4335
  labelPlacement: ["inside"],
4331
4336
  variant: "flat",
4332
- size: ["md", "lg"],
4333
4337
  class: {
4334
4338
  innerWrapper: "pb-0.5"
4335
4339
  }
@@ -4527,6 +4531,12 @@ var input = tv({
4527
4531
  class: {
4528
4532
  input: "transition-height !duration-100 motion-reduce:transition-none"
4529
4533
  }
4534
+ },
4535
+ {
4536
+ labelPlacement: ["inside", "outside"],
4537
+ class: {
4538
+ label: ["pe-2", "max-w-full", "text-ellipsis", "overflow-hidden"]
4539
+ }
4530
4540
  }
4531
4541
  ]
4532
4542
  });
@@ -6045,7 +6055,7 @@ var skeleton = tv({
6045
6055
  // src/components/select.ts
6046
6056
  var select = tv({
6047
6057
  slots: {
6048
- base: ["group inline-flex flex-col relative w-full", "data-[has-helper=true]:mb-4"],
6058
+ base: ["group inline-flex flex-col relative w-full"],
6049
6059
  label: [
6050
6060
  "block",
6051
6061
  "absolute",
@@ -6054,18 +6064,26 @@ var select = tv({
6054
6064
  "subpixel-antialiased",
6055
6065
  "text-small",
6056
6066
  "text-foreground-500",
6057
- "pointer-events-none"
6067
+ "pointer-events-none",
6068
+ "opacity-70",
6069
+ "group-data-[filled=true]:opacity-100"
6058
6070
  ],
6059
6071
  mainWrapper: "w-full flex flex-col",
6060
6072
  trigger: "relative px-3 gap-3 w-full inline-flex flex-row items-center shadow-sm outline-none tap-highlight-transparent",
6061
6073
  innerWrapper: "inline-flex h-full w-[calc(100%_-_theme(spacing.unit-6))] min-h-unit-4 items-center gap-1.5 box-border",
6062
6074
  selectorIcon: "absolute right-3 w-unit-4 h-unit-4",
6063
6075
  spinner: "absolute right-3",
6064
- value: ["font-normal", "w-full", "text-left"],
6076
+ value: [
6077
+ "font-normal",
6078
+ "w-full",
6079
+ "text-left",
6080
+ "opacity-70",
6081
+ "group-data-[has-value=true]:opacity-100"
6082
+ ],
6065
6083
  listboxWrapper: "scroll-py-6 max-h-64 w-full",
6066
6084
  listbox: "",
6067
6085
  popoverContent: "w-full p-1 overflow-hidden",
6068
- helperWrapper: "flex absolute -bottom-[calc(theme(fontSize.tiny)*1.5)] flex-col gap-1.5 px-1",
6086
+ helperWrapper: "p-1 flex relative flex-col gap-1.5",
6069
6087
  description: "text-tiny text-foreground-400",
6070
6088
  errorMessage: "text-tiny text-danger"
6071
6089
  },
@@ -6076,7 +6094,9 @@ var select = tv({
6076
6094
  "bg-default-100",
6077
6095
  "data-[hover=true]:bg-default-200",
6078
6096
  "group-data-[focus=true]:bg-default-100"
6079
- ]
6097
+ ],
6098
+ label: "text-default-foreground",
6099
+ value: "placeholder:text-default-foreground"
6080
6100
  },
6081
6101
  faded: {
6082
6102
  trigger: [
@@ -6084,16 +6104,21 @@ var select = tv({
6084
6104
  "border-medium",
6085
6105
  "border-default-200",
6086
6106
  "data-[hover=true]:border-default-400"
6087
- ]
6107
+ ],
6108
+ label: "text-default-foreground",
6109
+ value: "placeholder:text-default-foreground"
6088
6110
  },
6089
6111
  bordered: {
6090
6112
  trigger: [
6091
6113
  "border-medium",
6092
6114
  "border-default-200",
6093
6115
  "data-[hover=true]:border-default-400",
6094
- "data-[open=true]:border-foreground",
6095
- "data-[focus=true]:border-foreground"
6096
- ]
6116
+ "data-[open=true]:border-default-foreground",
6117
+ "data-[focus=true]:border-default-foreground",
6118
+ "data-[focus=true]:border-default-foreground"
6119
+ ],
6120
+ label: "text-foreground",
6121
+ value: "placeholder:text-foreground"
6097
6122
  },
6098
6123
  underlined: {
6099
6124
  trigger: [
@@ -6110,7 +6135,7 @@ var select = tv({
6110
6135
  "after:content-['']",
6111
6136
  "after:w-0",
6112
6137
  "after:origin-center",
6113
- "after:bg-foreground",
6138
+ "after:bg-default-foreground",
6114
6139
  "after:absolute",
6115
6140
  "after:left-1/2",
6116
6141
  "after:-translate-x-1/2",
@@ -6118,12 +6143,14 @@ var select = tv({
6118
6143
  "after:h-[2px]",
6119
6144
  "data-[open=true]:after:w-full",
6120
6145
  "data-[focus=true]:after:w-full"
6121
- ]
6146
+ ],
6147
+ label: "text-foreground",
6148
+ value: "placeholder:text-foreground"
6122
6149
  }
6123
6150
  },
6124
6151
  color: {
6125
6152
  default: {
6126
- value: ["text-foreground-500", "group-data-[has-value=true]:text-foreground"]
6153
+ label: "group-data-[filled=true]:opacity-80"
6127
6154
  },
6128
6155
  primary: {},
6129
6156
  secondary: {},
@@ -6484,13 +6511,6 @@ var select = tv({
6484
6511
  ]
6485
6512
  }
6486
6513
  },
6487
- {
6488
- labelPlacement: "inside",
6489
- color: "default",
6490
- class: {
6491
- label: "group-data-[filled=true]:text-foreground-600"
6492
- }
6493
- },
6494
6514
  {
6495
6515
  isInvalid: true,
6496
6516
  variant: "flat",
@@ -6549,15 +6569,7 @@ var select = tv({
6549
6569
  isMultiline: false,
6550
6570
  class: {
6551
6571
  base: "group relative justify-end",
6552
- label: [
6553
- "pb-0",
6554
- "z-20",
6555
- "opacity-60",
6556
- "top-1/2",
6557
- "-translate-y-1/2",
6558
- "group-data-[filled=true]:opacity-100",
6559
- "group-data-[filled=true]:left-0"
6560
- ]
6572
+ label: ["pb-0", "z-20", "top-1/2", "-translate-y-1/2", "group-data-[filled=true]:left-0"]
6561
6573
  }
6562
6574
  },
6563
6575
  {
@@ -6709,6 +6721,12 @@ var select = tv({
6709
6721
  ],
6710
6722
  base: "data-[has-label=true]:mt-[calc(theme(fontSize.small)_+_12px)]"
6711
6723
  }
6724
+ },
6725
+ {
6726
+ labelPlacement: ["inside", "outside"],
6727
+ class: {
6728
+ label: ["pe-2", "max-w-full", "text-ellipsis", "overflow-hidden"]
6729
+ }
6712
6730
  }
6713
6731
  ]
6714
6732
  });
@@ -8492,13 +8510,14 @@ var darkLayout = {
8492
8510
 
8493
8511
  // src/plugin.ts
8494
8512
  var DEFAULT_PREFIX = "nextui";
8513
+ var parsedColorsCache = {};
8495
8514
  var resolveConfig = (themes = {}, defaultTheme, prefix) => {
8496
8515
  const resolved = {
8497
8516
  variants: [],
8498
8517
  utilities: {},
8499
8518
  colors: {}
8500
8519
  };
8501
- (0, import_lodash3.default)(themes, ({ extend, layout, colors: colors2 }, themeName) => {
8520
+ for (const [themeName, { extend, layout, colors: colors2 }] of Object.entries(themes)) {
8502
8521
  let cssSelector = `.${themeName},[data-theme="${themeName}"]`;
8503
8522
  const scheme = themeName === "light" || themeName === "dark" ? themeName : extend;
8504
8523
  if (themeName === defaultTheme) {
@@ -8513,11 +8532,13 @@ var resolveConfig = (themes = {}, defaultTheme, prefix) => {
8513
8532
  name: themeName,
8514
8533
  definition: [`&.${themeName}`, `&[data-theme='${themeName}']`]
8515
8534
  });
8516
- (0, import_lodash3.default)(flatColors, (colorValue, colorName) => {
8535
+ for (const [colorName, colorValue] of Object.entries(flatColors)) {
8517
8536
  if (!colorValue)
8518
8537
  return;
8519
8538
  try {
8520
- const [h, s, l, defaultAlphaValue] = (0, import_color.default)(colorValue).hsl().round().array();
8539
+ const parsedColor = parsedColorsCache[colorValue] || (0, import_color.default)(colorValue).hsl().round().array();
8540
+ parsedColorsCache[colorValue] = parsedColor;
8541
+ const [h, s, l, defaultAlphaValue] = parsedColor;
8521
8542
  const nextuiColorVariable = `--${prefix}-${colorName}`;
8522
8543
  const nextuiOpacityVariable = `--${prefix}-${colorName}-opacity`;
8523
8544
  resolved.utilities[cssSelector][nextuiColorVariable] = `${h} ${s}% ${l}%`;
@@ -8536,32 +8557,31 @@ var resolveConfig = (themes = {}, defaultTheme, prefix) => {
8536
8557
  } catch (error) {
8537
8558
  console.log("error", error == null ? void 0 : error.message);
8538
8559
  }
8539
- });
8540
- (0, import_lodash3.default)(flatLayout, (value, key) => {
8560
+ }
8561
+ for (const [key, value] of Object.entries(flatLayout)) {
8541
8562
  if (!value)
8542
8563
  return;
8564
+ const layoutVariablePrefix = `--${prefix}-${key}`;
8543
8565
  if (typeof value === "object") {
8544
- (0, import_lodash3.default)(value, (v, k) => {
8545
- const layoutVariable = `--${prefix}-${key}-${k}`;
8546
- resolved.utilities[cssSelector][layoutVariable] = v;
8547
- });
8548
- } else if (key === "spacing-unit") {
8549
- const layoutVariable = `--${prefix}-${key}`;
8550
- resolved.utilities[cssSelector][layoutVariable] = value;
8551
- const spacingScale = generateSpacingScale(Number(value));
8552
- (0, import_lodash3.default)(spacingScale, (v, k) => {
8553
- const layoutVariable2 = `--${prefix}-${key}-${k}`;
8554
- resolved.utilities[cssSelector][layoutVariable2] = v;
8555
- });
8566
+ for (const [nestedKey, nestedValue] of Object.entries(value)) {
8567
+ const nestedLayoutVariable = `${layoutVariablePrefix}-${nestedKey}`;
8568
+ resolved.utilities[cssSelector][nestedLayoutVariable] = nestedValue;
8569
+ }
8556
8570
  } else {
8557
- const layoutVariable = `--${prefix}-${key}`;
8558
- if (layoutVariable.includes("opacity") && typeof value === "number") {
8559
- value = value.toString().replace(/^0\./, ".");
8571
+ if (key === "spacing-unit") {
8572
+ resolved.utilities[cssSelector][layoutVariablePrefix] = value;
8573
+ const spacingScale = generateSpacingScale(Number(value));
8574
+ for (const [scaleKey, scaleValue] of Object.entries(spacingScale)) {
8575
+ const spacingVariable = `${layoutVariablePrefix}-${scaleKey}`;
8576
+ resolved.utilities[cssSelector][spacingVariable] = scaleValue;
8577
+ }
8578
+ } else {
8579
+ const formattedValue = layoutVariablePrefix.includes("opacity") && typeof value === "number" ? value.toString().replace(/^0\./, ".") : value;
8580
+ resolved.utilities[cssSelector][layoutVariablePrefix] = formattedValue;
8560
8581
  }
8561
- resolved.utilities[cssSelector][layoutVariable] = value;
8562
8582
  }
8563
- });
8564
- });
8583
+ }
8584
+ }
8565
8585
  return resolved;
8566
8586
  };
8567
8587
  var corePlugin = (themes = {}, defaultTheme, prefix, addCommonColors) => {
@@ -8591,8 +8611,8 @@ var corePlugin = (themes = {}, defaultTheme, prefix, addCommonColors) => {
8591
8611
  ...baseStyles(prefix)
8592
8612
  }
8593
8613
  });
8594
- addUtilities({ ...resolved.utilities, ...utilities });
8595
- resolved.variants.forEach((variant) => {
8614
+ addUtilities({ ...resolved == null ? void 0 : resolved.utilities, ...utilities });
8615
+ resolved == null ? void 0 : resolved.variants.forEach((variant) => {
8596
8616
  addVariant(variant.name, variant.definition);
8597
8617
  });
8598
8618
  },
@@ -8601,7 +8621,7 @@ var corePlugin = (themes = {}, defaultTheme, prefix, addCommonColors) => {
8601
8621
  extend: {
8602
8622
  colors: {
8603
8623
  ...addCommonColors ? commonColors : {},
8604
- ...resolved.colors
8624
+ ...resolved == null ? void 0 : resolved.colors
8605
8625
  },
8606
8626
  scale: {
8607
8627
  "80": "0.8",
package/dist/index.mjs CHANGED
@@ -44,7 +44,7 @@ import {
44
44
  } from "./chunk-VGHVBXXT.mjs";
45
45
  import {
46
46
  select
47
- } from "./chunk-TLWI2J7W.mjs";
47
+ } from "./chunk-DNEFEC5I.mjs";
48
48
  import {
49
49
  skeleton
50
50
  } from "./chunk-JX6O4KJS.mjs";
@@ -53,7 +53,7 @@ import {
53
53
  } from "./chunk-F36W5Y6O.mjs";
54
54
  import {
55
55
  input
56
- } from "./chunk-RNXUUR27.mjs";
56
+ } from "./chunk-D4RGWEG7.mjs";
57
57
  import {
58
58
  kbd
59
59
  } from "./chunk-J7FVLFSZ.mjs";
@@ -130,7 +130,7 @@ import {
130
130
  } from "./chunk-WBUVHAJX.mjs";
131
131
  import {
132
132
  nextui
133
- } from "./chunk-6XG3Y4GM.mjs";
133
+ } from "./chunk-5QVKTCUZ.mjs";
134
134
  import "./chunk-S7W5DQP2.mjs";
135
135
  import "./chunk-DI2L75XK.mjs";
136
136
  import "./chunk-4Z22WXZX.mjs";
package/dist/plugin.js CHANGED
@@ -711,13 +711,14 @@ var baseStyles = (prefix) => ({
711
711
 
712
712
  // src/plugin.ts
713
713
  var DEFAULT_PREFIX = "nextui";
714
+ var parsedColorsCache = {};
714
715
  var resolveConfig = (themes = {}, defaultTheme, prefix) => {
715
716
  const resolved = {
716
717
  variants: [],
717
718
  utilities: {},
718
719
  colors: {}
719
720
  };
720
- (0, import_lodash3.default)(themes, ({ extend, layout, colors: colors2 }, themeName) => {
721
+ for (const [themeName, { extend, layout, colors: colors2 }] of Object.entries(themes)) {
721
722
  let cssSelector = `.${themeName},[data-theme="${themeName}"]`;
722
723
  const scheme = themeName === "light" || themeName === "dark" ? themeName : extend;
723
724
  if (themeName === defaultTheme) {
@@ -732,11 +733,13 @@ var resolveConfig = (themes = {}, defaultTheme, prefix) => {
732
733
  name: themeName,
733
734
  definition: [`&.${themeName}`, `&[data-theme='${themeName}']`]
734
735
  });
735
- (0, import_lodash3.default)(flatColors, (colorValue, colorName) => {
736
+ for (const [colorName, colorValue] of Object.entries(flatColors)) {
736
737
  if (!colorValue)
737
738
  return;
738
739
  try {
739
- const [h, s, l, defaultAlphaValue] = (0, import_color.default)(colorValue).hsl().round().array();
740
+ const parsedColor = parsedColorsCache[colorValue] || (0, import_color.default)(colorValue).hsl().round().array();
741
+ parsedColorsCache[colorValue] = parsedColor;
742
+ const [h, s, l, defaultAlphaValue] = parsedColor;
740
743
  const nextuiColorVariable = `--${prefix}-${colorName}`;
741
744
  const nextuiOpacityVariable = `--${prefix}-${colorName}-opacity`;
742
745
  resolved.utilities[cssSelector][nextuiColorVariable] = `${h} ${s}% ${l}%`;
@@ -755,32 +758,31 @@ var resolveConfig = (themes = {}, defaultTheme, prefix) => {
755
758
  } catch (error) {
756
759
  console.log("error", error == null ? void 0 : error.message);
757
760
  }
758
- });
759
- (0, import_lodash3.default)(flatLayout, (value, key) => {
761
+ }
762
+ for (const [key, value] of Object.entries(flatLayout)) {
760
763
  if (!value)
761
764
  return;
765
+ const layoutVariablePrefix = `--${prefix}-${key}`;
762
766
  if (typeof value === "object") {
763
- (0, import_lodash3.default)(value, (v, k) => {
764
- const layoutVariable = `--${prefix}-${key}-${k}`;
765
- resolved.utilities[cssSelector][layoutVariable] = v;
766
- });
767
- } else if (key === "spacing-unit") {
768
- const layoutVariable = `--${prefix}-${key}`;
769
- resolved.utilities[cssSelector][layoutVariable] = value;
770
- const spacingScale = generateSpacingScale(Number(value));
771
- (0, import_lodash3.default)(spacingScale, (v, k) => {
772
- const layoutVariable2 = `--${prefix}-${key}-${k}`;
773
- resolved.utilities[cssSelector][layoutVariable2] = v;
774
- });
767
+ for (const [nestedKey, nestedValue] of Object.entries(value)) {
768
+ const nestedLayoutVariable = `${layoutVariablePrefix}-${nestedKey}`;
769
+ resolved.utilities[cssSelector][nestedLayoutVariable] = nestedValue;
770
+ }
775
771
  } else {
776
- const layoutVariable = `--${prefix}-${key}`;
777
- if (layoutVariable.includes("opacity") && typeof value === "number") {
778
- value = value.toString().replace(/^0\./, ".");
772
+ if (key === "spacing-unit") {
773
+ resolved.utilities[cssSelector][layoutVariablePrefix] = value;
774
+ const spacingScale = generateSpacingScale(Number(value));
775
+ for (const [scaleKey, scaleValue] of Object.entries(spacingScale)) {
776
+ const spacingVariable = `${layoutVariablePrefix}-${scaleKey}`;
777
+ resolved.utilities[cssSelector][spacingVariable] = scaleValue;
778
+ }
779
+ } else {
780
+ const formattedValue = layoutVariablePrefix.includes("opacity") && typeof value === "number" ? value.toString().replace(/^0\./, ".") : value;
781
+ resolved.utilities[cssSelector][layoutVariablePrefix] = formattedValue;
779
782
  }
780
- resolved.utilities[cssSelector][layoutVariable] = value;
781
783
  }
782
- });
783
- });
784
+ }
785
+ }
784
786
  return resolved;
785
787
  };
786
788
  var corePlugin = (themes = {}, defaultTheme, prefix, addCommonColors) => {
@@ -810,8 +812,8 @@ var corePlugin = (themes = {}, defaultTheme, prefix, addCommonColors) => {
810
812
  ...baseStyles(prefix)
811
813
  }
812
814
  });
813
- addUtilities({ ...resolved.utilities, ...utilities });
814
- resolved.variants.forEach((variant) => {
815
+ addUtilities({ ...resolved == null ? void 0 : resolved.utilities, ...utilities });
816
+ resolved == null ? void 0 : resolved.variants.forEach((variant) => {
815
817
  addVariant(variant.name, variant.definition);
816
818
  });
817
819
  },
@@ -820,7 +822,7 @@ var corePlugin = (themes = {}, defaultTheme, prefix, addCommonColors) => {
820
822
  extend: {
821
823
  colors: {
822
824
  ...addCommonColors ? commonColors : {},
823
- ...resolved.colors
825
+ ...resolved == null ? void 0 : resolved.colors
824
826
  },
825
827
  scale: {
826
828
  "80": "0.8",