@vaneui/ui 0.0.18 → 0.0.19

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.
Files changed (11) hide show
  1. package/dist/complex.css +0 -691
  2. package/dist/components/theme/components/utils/componentUtils.d.ts +1 -1
  3. package/dist/components/theme/index.js +39 -41
  4. package/dist/components/theme/index.js.map +1 -1
  5. package/dist/components/utils/componentUtils.d.ts +1 -1
  6. package/dist/index.d.ts +2 -2
  7. package/dist/index.esm.js +42 -42
  8. package/dist/index.js +43 -41
  9. package/dist/index.js.map +1 -1
  10. package/dist/ui.css +0 -691
  11. package/package.json +2 -2
package/dist/components/theme/components/utils/componentUtils.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  /**
2
2
  * Pick the first truthy key from props, then from defaults, then fallback.
3
3
  */
4
- export declare function pickKey<P, K extends keyof P>(props: Partial<P>, defaults: Partial<P>, keys: readonly K[], fallback?: K): K | undefined;
4
+ export declare function pickFirstTruthyKey<P, K extends keyof P>(props: Partial<P>, defaults: Partial<P>, keys: readonly K[]): K | undefined;
package/dist/components/theme/index.js CHANGED
@@ -295,27 +295,26 @@ const noShadowModeClasses = {
295
295
  active: "active:shadow-none",
296
296
  };
297
297
 
298
- function pickFirstKeyOptional(props, keys, fallback = undefined) {
298
+ function pickFirstTruthyKeyOptional(collection, keys) {
299
299
  for (const k of keys) {
300
- if (props[k])
300
+ if (collection[k] === true)
301
301
  return k;
302
302
  }
303
- return fallback;
303
+ return undefined;
304
304
  }
305
305
  /**
306
306
  * Pick the first truthy key from props, then from defaults, then fallback.
307
307
  */
308
- function pickKey(props, defaults, keys, fallback) {
309
- // 1) explicit user prop
310
- const explicit = pickFirstKeyOptional(props, keys);
308
+ function pickFirstTruthyKey(props, defaults, keys) {
309
+ // first check explicit usage in props
310
+ const explicit = pickFirstTruthyKeyOptional(props, keys);
311
311
  if (explicit)
312
312
  return explicit;
313
- // 2) component‐level default
314
- const def = pickFirstKeyOptional(defaults, keys);
313
+ // then check component‐level defaults
314
+ const def = pickFirstTruthyKeyOptional(defaults, keys);
315
315
  if (def)
316
316
  return def;
317
- // 3) built‐in fallback
318
- return fallback;
317
+ return undefined;
319
318
  }
320
319
 
321
320
  class HideTheme extends BaseTheme {
@@ -327,7 +326,7 @@ class HideTheme extends BaseTheme {
327
326
  });
328
327
  }
329
328
  getClasses(props, defaults) {
330
- const key = pickKey(props, defaults, HIDE_KEYS);
329
+ const key = pickFirstTruthyKey(props, defaults, HIDE_KEYS);
331
330
  return [key ? this[key] : ''];
332
331
  }
333
332
  }
@@ -342,7 +341,7 @@ class ItemsTheme extends BaseTheme {
342
341
  });
343
342
  }
344
343
  getClasses(props, defaults) {
345
- const pickedKey = pickKey(props, defaults, ITEMS_KEYS);
344
+ const pickedKey = pickFirstTruthyKey(props, defaults, ITEMS_KEYS);
346
345
  return [pickedKey && this[pickedKey] ? this[pickedKey] : ''];
347
346
  }
348
347
  }
@@ -363,7 +362,7 @@ class JustifyTheme extends BaseTheme {
363
362
  });
364
363
  }
365
364
  getClasses(props, defaults) {
366
- const key = pickKey(props, defaults, JUSTIFY_KEYS);
365
+ const key = pickFirstTruthyKey(props, defaults, JUSTIFY_KEYS);
367
366
  return [key ? this[key] : ''];
368
367
  }
369
368
  }
@@ -378,7 +377,7 @@ class PositionTheme extends BaseTheme {
378
377
  });
379
378
  }
380
379
  getClasses(props, defaults) {
381
- const key = pickKey(props, defaults, POSITION_KEYS);
380
+ const key = pickFirstTruthyKey(props, defaults, POSITION_KEYS);
382
381
  return [key ? this[key] : ''];
383
382
  }
384
383
  }
@@ -470,7 +469,7 @@ class FontStyleTheme extends BaseTheme {
470
469
  });
471
470
  }
472
471
  getClasses(props, defaults) {
473
- const key = pickKey(props, defaults, FONT_STYLE_KEYS);
472
+ const key = pickFirstTruthyKey(props, defaults, FONT_STYLE_KEYS);
474
473
  return [key ? this[key] : '']; // No default for font style
475
474
  }
476
475
  }
@@ -485,7 +484,7 @@ class FontFamilyTheme extends BaseTheme {
485
484
  });
486
485
  }
487
486
  getClasses(props, defaults) {
488
- const key = pickKey(props, defaults, FONT_FAMILY_KEYS);
487
+ const key = pickFirstTruthyKey(props, defaults, FONT_FAMILY_KEYS);
489
488
  return [this[key !== null && key !== void 0 ? key : 'sans'] || ''];
490
489
  }
491
490
  }
@@ -500,7 +499,7 @@ class FontWeightTheme extends BaseTheme {
500
499
  });
501
500
  }
502
501
  getClasses(props, defaults) {
503
- const key = pickKey(props, defaults, FONT_WEIGHT_KEYS);
502
+ const key = pickFirstTruthyKey(props, defaults, FONT_WEIGHT_KEYS);
504
503
  return [this[key !== null && key !== void 0 ? key : 'normal'] || '']; // Default to 'normal' if no key is provided
505
504
  }
506
505
  }
@@ -515,7 +514,7 @@ class TextDecorationTheme extends BaseTheme {
515
514
  });
516
515
  }
517
516
  getClasses(props, defaults) {
518
- const key = pickKey(props, defaults, TEXT_DECORATION_KEYS);
517
+ const key = pickFirstTruthyKey(props, defaults, TEXT_DECORATION_KEYS);
519
518
  return [key ? this[key] : '']; // No default for text decoration
520
519
  }
521
520
  }
@@ -530,7 +529,7 @@ class TextTransformTheme extends BaseTheme {
530
529
  });
531
530
  }
532
531
  getClasses(props, defaults) {
533
- const key = pickKey(props, defaults, TEXT_TRANSFORM_KEYS);
532
+ const key = pickFirstTruthyKey(props, defaults, TEXT_TRANSFORM_KEYS);
534
533
  return [key ? this[key] : '']; // No default for text transform
535
534
  }
536
535
  }
@@ -545,7 +544,7 @@ class TextAlignTheme extends BaseTheme {
545
544
  });
546
545
  }
547
546
  getClasses(props, defaults) {
548
- const key = pickKey(props, defaults, TEXT_ALIGN_KEYS);
547
+ const key = pickFirstTruthyKey(props, defaults, TEXT_ALIGN_KEYS);
549
548
  return [key ? this[key] : '']; // No default for text align
550
549
  }
551
550
  }
@@ -675,7 +674,7 @@ class SizeTheme extends BaseTheme {
675
674
  });
676
675
  }
677
676
  getClasses(props, defaults) {
678
- const size = pickKey(props, defaults, SIZE_KEYS);
677
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS);
679
678
  return [this[size !== null && size !== void 0 ? size : 'md'] || ''];
680
679
  }
681
680
  }
@@ -696,8 +695,8 @@ class GapTheme extends BaseTheme {
696
695
  });
697
696
  }
698
697
  getClasses(props, defaults) {
699
- const size = pickKey(props, defaults, SIZE_KEYS) || 'md';
700
- const key = pickKey(props, defaults, GAP_KEYS) || 'noGap';
698
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS) || 'md';
699
+ const key = pickFirstTruthyKey(props, defaults, GAP_KEYS) || 'noGap';
701
700
  return [typeof this[key] === 'string' ? this[key] : this[key][size]];
702
701
  }
703
702
  }
@@ -721,8 +720,8 @@ class RadiusTheme extends BaseTheme {
721
720
  });
722
721
  }
723
722
  getClasses(props, defaults) {
724
- const size = pickKey(props, defaults, SIZE_KEYS) || 'md';
725
- const shape = pickKey(props, defaults, SHAPE_KEYS) || 'rounded';
723
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS) || 'md';
724
+ const shape = pickFirstTruthyKey(props, defaults, SHAPE_KEYS) || 'rounded';
726
725
  return [typeof this[shape] === 'string' ? this[shape] : this[shape][size]];
727
726
  }
728
727
  }
@@ -741,8 +740,8 @@ class ShadowTheme extends BaseTheme {
741
740
  });
742
741
  }
743
742
  getClasses(props, defaults) {
744
- const size = pickKey(props, defaults, SIZE_KEYS) || 'md';
745
- const key = pickKey(props, defaults, SHADOW_KEYS);
743
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS) || 'md';
744
+ const key = pickFirstTruthyKey(props, defaults, SHADOW_KEYS);
746
745
  if (key === undefined) {
747
746
  return [];
748
747
  }
@@ -772,7 +771,7 @@ class BorderTheme extends BaseTheme {
772
771
  });
773
772
  }
774
773
  getClasses(props, defaults) {
775
- const key = pickKey(props, defaults, BORDER_KEYS);
774
+ const key = pickFirstTruthyKey(props, defaults, BORDER_KEYS);
776
775
  if (!key || !this[key]) {
777
776
  return MODE_KEYS.map(() => '');
778
777
  }
@@ -808,7 +807,7 @@ class RingTheme extends BaseTheme {
808
807
  });
809
808
  }
810
809
  getClasses(props, defaults) {
811
- const key = pickKey(props, defaults, RING_KEYS);
810
+ const key = pickFirstTruthyKey(props, defaults, RING_KEYS);
812
811
  if (!key || !this[key]) {
813
812
  return MODE_KEYS.map(() => '');
814
813
  }
@@ -829,8 +828,8 @@ class PxTheme extends BaseTheme {
829
828
  });
830
829
  }
831
830
  getClasses(props, defaults) {
832
- const size = pickKey(props, defaults, SIZE_KEYS) || 'md';
833
- const key = pickKey(props, defaults, PADDING_KEYS) || 'noPadding';
831
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS) || 'md';
832
+ const key = pickFirstTruthyKey(props, defaults, PADDING_KEYS) || 'noPadding';
834
833
  return [typeof this[key] === 'string' ? this[key] : this[key][size]];
835
834
  }
836
835
  }
@@ -854,8 +853,8 @@ class PyTheme extends BaseTheme {
854
853
  });
855
854
  }
856
855
  getClasses(props, defaults) {
857
- const size = pickKey(props, defaults, SIZE_KEYS) || 'md';
858
- const key = pickKey(props, defaults, PADDING_KEYS) || 'noPadding';
856
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS) || 'md';
857
+ const key = pickFirstTruthyKey(props, defaults, PADDING_KEYS) || 'noPadding';
859
858
  return [typeof this[key] === 'string' ? this[key] : this[key][size]];
860
859
  }
861
860
  }
@@ -883,7 +882,7 @@ class TextAppearanceTheme extends BaseTheme {
883
882
  });
884
883
  }
885
884
  getClasses(props, defaults) {
886
- const pickedAppearanceKey = pickKey(props, defaults, TEXT_APPEARANCE_KEYS, 'default');
885
+ const pickedAppearanceKey = pickFirstTruthyKey(props, defaults, TEXT_APPEARANCE_KEYS) || 'default';
887
886
  const modesForAppearance = this[pickedAppearanceKey];
888
887
  if (!modesForAppearance) {
889
888
  return MODE_KEYS.map(() => '');
@@ -1105,7 +1104,7 @@ class VariantTheme extends BaseTheme {
1105
1104
  });
1106
1105
  }
1107
1106
  getClasses(props, defaults) {
1108
- const activeVariantKey = pickKey(props, defaults, VARIANT_KEYS, 'outline');
1107
+ const activeVariantKey = pickFirstTruthyKey(props, defaults, VARIANT_KEYS) || 'outline';
1109
1108
  const activeTextAppearanceTheme = this[activeVariantKey];
1110
1109
  if (!activeTextAppearanceTheme) {
1111
1110
  return [];
@@ -1441,9 +1440,8 @@ class DirectionTheme extends BaseTheme {
1441
1440
  });
1442
1441
  }
1443
1442
  getClasses(props, defaults) {
1444
- var _a;
1445
- let direction = (_a = pickKey(props, defaults, FLEX_DIRECTION_KEYS)) !== null && _a !== void 0 ? _a : 'column';
1446
- const reverse = pickKey(props, defaults, DIRECTION_REVERSE_KEYS);
1443
+ let direction = pickFirstTruthyKey(props, defaults, FLEX_DIRECTION_KEYS) || 'column';
1444
+ const reverse = pickFirstTruthyKey(props, defaults, DIRECTION_REVERSE_KEYS);
1447
1445
  if (reverse) {
1448
1446
  switch (direction) {
1449
1447
  case "column":
@@ -1473,7 +1471,7 @@ class WrapTheme extends BaseTheme {
1473
1471
  });
1474
1472
  }
1475
1473
  getClasses(props, defaults) {
1476
- const key = pickKey(props, defaults, WRAP_KEYS);
1474
+ const key = pickFirstTruthyKey(props, defaults, WRAP_KEYS);
1477
1475
  return key ? [this[key]] : [];
1478
1476
  }
1479
1477
  }
@@ -1500,7 +1498,7 @@ class LayoutAppearanceTheme extends BaseTheme {
1500
1498
  });
1501
1499
  }
1502
1500
  getClasses(props, defaults) {
1503
- const pickedAppearanceKey = pickKey(props, defaults, APPEARANCE_KEYS, 'default');
1501
+ const pickedAppearanceKey = pickFirstTruthyKey(props, defaults, APPEARANCE_KEYS) || 'default';
1504
1502
  const modesForAppearance = this[pickedAppearanceKey];
1505
1503
  if (!modesForAppearance) {
1506
1504
  return MODE_KEYS.map(() => '');
@@ -1548,7 +1546,7 @@ class BreakpointTheme extends BaseTheme {
1548
1546
  });
1549
1547
  }
1550
1548
  getClasses(props, defaults) {
1551
- const key = pickKey(props, defaults, BREAKPOINT_KEYS);
1549
+ const key = pickFirstTruthyKey(props, defaults, BREAKPOINT_KEYS);
1552
1550
  if (!key)
1553
1551
  return [];
1554
1552
  return [this[key] || ''];
package/dist/components/theme/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/dist/components/utils/componentUtils.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  /**
2
2
  * Pick the first truthy key from props, then from defaults, then fallback.
3
3
  */
4
- export declare function pickKey<P, K extends keyof P>(props: Partial<P>, defaults: Partial<P>, keys: readonly K[], fallback?: K): K | undefined;
4
+ export declare function pickFirstTruthyKey<P, K extends keyof P>(props: Partial<P>, defaults: Partial<P>, keys: readonly K[]): K | undefined;
package/dist/index.d.ts CHANGED
@@ -4,5 +4,5 @@ export { Divider } from "./components/ui/divider";
4
4
  export { Chip } from "./components/ui/chip";
5
5
  export { Section, Container, Col, Row, Stack, Grid3, Grid4, Card } from "./components/ui/layout";
6
6
  export { Text, Title, Link, List, ListItem, SectionTitle, PageTitle } from "./components/ui/typography";
7
- export { ThemeProvider, useTheme, ThemeProps, ThemeProviderProps, PartialTheme } from './components/theme/themeContext';
8
- export { ModeKey } from "./components/ui/props/keys";
7
+ export { ThemeProvider, useTheme, type ThemeProps, type ThemeDefaults, type ThemeProviderProps, type PartialTheme, defaultTheme, type ComponentKey, COMPONENT_KEYS } from './components/theme/themeContext';
8
+ export { type ModeKey } from "./components/ui/props/keys";
package/dist/index.esm.js CHANGED
@@ -3024,27 +3024,26 @@ const noShadowModeClasses = {
3024
3024
  active: "active:shadow-none",
3025
3025
  };
3026
3026
 
3027
- function pickFirstKeyOptional(props, keys, fallback = undefined) {
3027
+ function pickFirstTruthyKeyOptional(collection, keys) {
3028
3028
  for (const k of keys) {
3029
- if (props[k])
3029
+ if (collection[k] === true)
3030
3030
  return k;
3031
3031
  }
3032
- return fallback;
3032
+ return undefined;
3033
3033
  }
3034
3034
  /**
3035
3035
  * Pick the first truthy key from props, then from defaults, then fallback.
3036
3036
  */
3037
- function pickKey(props, defaults, keys, fallback) {
3038
- // 1) explicit user prop
3039
- const explicit = pickFirstKeyOptional(props, keys);
3037
+ function pickFirstTruthyKey(props, defaults, keys) {
3038
+ // first check explicit usage in props
3039
+ const explicit = pickFirstTruthyKeyOptional(props, keys);
3040
3040
  if (explicit)
3041
3041
  return explicit;
3042
- // 2) component‐level default
3043
- const def = pickFirstKeyOptional(defaults, keys);
3042
+ // then check component‐level defaults
3043
+ const def = pickFirstTruthyKeyOptional(defaults, keys);
3044
3044
  if (def)
3045
3045
  return def;
3046
- // 3) built‐in fallback
3047
- return fallback;
3046
+ return undefined;
3048
3047
  }
3049
3048
 
3050
3049
  class HideTheme extends BaseTheme {
@@ -3056,7 +3055,7 @@ class HideTheme extends BaseTheme {
3056
3055
  });
3057
3056
  }
3058
3057
  getClasses(props, defaults) {
3059
- const key = pickKey(props, defaults, HIDE_KEYS);
3058
+ const key = pickFirstTruthyKey(props, defaults, HIDE_KEYS);
3060
3059
  return [key ? this[key] : ''];
3061
3060
  }
3062
3061
  }
@@ -3071,7 +3070,7 @@ class ItemsTheme extends BaseTheme {
3071
3070
  });
3072
3071
  }
3073
3072
  getClasses(props, defaults) {
3074
- const pickedKey = pickKey(props, defaults, ITEMS_KEYS);
3073
+ const pickedKey = pickFirstTruthyKey(props, defaults, ITEMS_KEYS);
3075
3074
  return [pickedKey && this[pickedKey] ? this[pickedKey] : ''];
3076
3075
  }
3077
3076
  }
@@ -3092,7 +3091,7 @@ class JustifyTheme extends BaseTheme {
3092
3091
  });
3093
3092
  }
3094
3093
  getClasses(props, defaults) {
3095
- const key = pickKey(props, defaults, JUSTIFY_KEYS);
3094
+ const key = pickFirstTruthyKey(props, defaults, JUSTIFY_KEYS);
3096
3095
  return [key ? this[key] : ''];
3097
3096
  }
3098
3097
  }
@@ -3107,7 +3106,7 @@ class PositionTheme extends BaseTheme {
3107
3106
  });
3108
3107
  }
3109
3108
  getClasses(props, defaults) {
3110
- const key = pickKey(props, defaults, POSITION_KEYS);
3109
+ const key = pickFirstTruthyKey(props, defaults, POSITION_KEYS);
3111
3110
  return [key ? this[key] : ''];
3112
3111
  }
3113
3112
  }
@@ -3199,7 +3198,7 @@ class FontStyleTheme extends BaseTheme {
3199
3198
  });
3200
3199
  }
3201
3200
  getClasses(props, defaults) {
3202
- const key = pickKey(props, defaults, FONT_STYLE_KEYS);
3201
+ const key = pickFirstTruthyKey(props, defaults, FONT_STYLE_KEYS);
3203
3202
  return [key ? this[key] : '']; // No default for font style
3204
3203
  }
3205
3204
  }
@@ -3214,7 +3213,7 @@ class FontFamilyTheme extends BaseTheme {
3214
3213
  });
3215
3214
  }
3216
3215
  getClasses(props, defaults) {
3217
- const key = pickKey(props, defaults, FONT_FAMILY_KEYS);
3216
+ const key = pickFirstTruthyKey(props, defaults, FONT_FAMILY_KEYS);
3218
3217
  return [this[key !== null && key !== void 0 ? key : 'sans'] || ''];
3219
3218
  }
3220
3219
  }
@@ -3229,7 +3228,7 @@ class FontWeightTheme extends BaseTheme {
3229
3228
  });
3230
3229
  }
3231
3230
  getClasses(props, defaults) {
3232
- const key = pickKey(props, defaults, FONT_WEIGHT_KEYS);
3231
+ const key = pickFirstTruthyKey(props, defaults, FONT_WEIGHT_KEYS);
3233
3232
  return [this[key !== null && key !== void 0 ? key : 'normal'] || '']; // Default to 'normal' if no key is provided
3234
3233
  }
3235
3234
  }
@@ -3244,7 +3243,7 @@ class TextDecorationTheme extends BaseTheme {
3244
3243
  });
3245
3244
  }
3246
3245
  getClasses(props, defaults) {
3247
- const key = pickKey(props, defaults, TEXT_DECORATION_KEYS);
3246
+ const key = pickFirstTruthyKey(props, defaults, TEXT_DECORATION_KEYS);
3248
3247
  return [key ? this[key] : '']; // No default for text decoration
3249
3248
  }
3250
3249
  }
@@ -3259,7 +3258,7 @@ class TextTransformTheme extends BaseTheme {
3259
3258
  });
3260
3259
  }
3261
3260
  getClasses(props, defaults) {
3262
- const key = pickKey(props, defaults, TEXT_TRANSFORM_KEYS);
3261
+ const key = pickFirstTruthyKey(props, defaults, TEXT_TRANSFORM_KEYS);
3263
3262
  return [key ? this[key] : '']; // No default for text transform
3264
3263
  }
3265
3264
  }
@@ -3274,7 +3273,7 @@ class TextAlignTheme extends BaseTheme {
3274
3273
  });
3275
3274
  }
3276
3275
  getClasses(props, defaults) {
3277
- const key = pickKey(props, defaults, TEXT_ALIGN_KEYS);
3276
+ const key = pickFirstTruthyKey(props, defaults, TEXT_ALIGN_KEYS);
3278
3277
  return [key ? this[key] : '']; // No default for text align
3279
3278
  }
3280
3279
  }
@@ -3404,7 +3403,7 @@ class SizeTheme extends BaseTheme {
3404
3403
  });
3405
3404
  }
3406
3405
  getClasses(props, defaults) {
3407
- const size = pickKey(props, defaults, SIZE_KEYS);
3406
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS);
3408
3407
  return [this[size !== null && size !== void 0 ? size : 'md'] || ''];
3409
3408
  }
3410
3409
  }
@@ -3425,8 +3424,8 @@ class GapTheme extends BaseTheme {
3425
3424
  });
3426
3425
  }
3427
3426
  getClasses(props, defaults) {
3428
- const size = pickKey(props, defaults, SIZE_KEYS) || 'md';
3429
- const key = pickKey(props, defaults, GAP_KEYS) || 'noGap';
3427
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS) || 'md';
3428
+ const key = pickFirstTruthyKey(props, defaults, GAP_KEYS) || 'noGap';
3430
3429
  return [typeof this[key] === 'string' ? this[key] : this[key][size]];
3431
3430
  }
3432
3431
  }
@@ -3450,8 +3449,8 @@ class RadiusTheme extends BaseTheme {
3450
3449
  });
3451
3450
  }
3452
3451
  getClasses(props, defaults) {
3453
- const size = pickKey(props, defaults, SIZE_KEYS) || 'md';
3454
- const shape = pickKey(props, defaults, SHAPE_KEYS) || 'rounded';
3452
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS) || 'md';
3453
+ const shape = pickFirstTruthyKey(props, defaults, SHAPE_KEYS) || 'rounded';
3455
3454
  return [typeof this[shape] === 'string' ? this[shape] : this[shape][size]];
3456
3455
  }
3457
3456
  }
@@ -3470,8 +3469,8 @@ class ShadowTheme extends BaseTheme {
3470
3469
  });
3471
3470
  }
3472
3471
  getClasses(props, defaults) {
3473
- const size = pickKey(props, defaults, SIZE_KEYS) || 'md';
3474
- const key = pickKey(props, defaults, SHADOW_KEYS);
3472
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS) || 'md';
3473
+ const key = pickFirstTruthyKey(props, defaults, SHADOW_KEYS);
3475
3474
  if (key === undefined) {
3476
3475
  return [];
3477
3476
  }
@@ -3501,7 +3500,7 @@ class BorderTheme extends BaseTheme {
3501
3500
  });
3502
3501
  }
3503
3502
  getClasses(props, defaults) {
3504
- const key = pickKey(props, defaults, BORDER_KEYS);
3503
+ const key = pickFirstTruthyKey(props, defaults, BORDER_KEYS);
3505
3504
  if (!key || !this[key]) {
3506
3505
  return MODE_KEYS.map(() => '');
3507
3506
  }
@@ -3537,7 +3536,7 @@ class RingTheme extends BaseTheme {
3537
3536
  });
3538
3537
  }
3539
3538
  getClasses(props, defaults) {
3540
- const key = pickKey(props, defaults, RING_KEYS);
3539
+ const key = pickFirstTruthyKey(props, defaults, RING_KEYS);
3541
3540
  if (!key || !this[key]) {
3542
3541
  return MODE_KEYS.map(() => '');
3543
3542
  }
@@ -3558,8 +3557,8 @@ class PxTheme extends BaseTheme {
3558
3557
  });
3559
3558
  }
3560
3559
  getClasses(props, defaults) {
3561
- const size = pickKey(props, defaults, SIZE_KEYS) || 'md';
3562
- const key = pickKey(props, defaults, PADDING_KEYS) || 'noPadding';
3560
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS) || 'md';
3561
+ const key = pickFirstTruthyKey(props, defaults, PADDING_KEYS) || 'noPadding';
3563
3562
  return [typeof this[key] === 'string' ? this[key] : this[key][size]];
3564
3563
  }
3565
3564
  }
@@ -3583,8 +3582,8 @@ class PyTheme extends BaseTheme {
3583
3582
  });
3584
3583
  }
3585
3584
  getClasses(props, defaults) {
3586
- const size = pickKey(props, defaults, SIZE_KEYS) || 'md';
3587
- const key = pickKey(props, defaults, PADDING_KEYS) || 'noPadding';
3585
+ const size = pickFirstTruthyKey(props, defaults, SIZE_KEYS) || 'md';
3586
+ const key = pickFirstTruthyKey(props, defaults, PADDING_KEYS) || 'noPadding';
3588
3587
  return [typeof this[key] === 'string' ? this[key] : this[key][size]];
3589
3588
  }
3590
3589
  }
@@ -3612,7 +3611,7 @@ class TextAppearanceTheme extends BaseTheme {
3612
3611
  });
3613
3612
  }
3614
3613
  getClasses(props, defaults) {
3615
- const pickedAppearanceKey = pickKey(props, defaults, TEXT_APPEARANCE_KEYS, 'default');
3614
+ const pickedAppearanceKey = pickFirstTruthyKey(props, defaults, TEXT_APPEARANCE_KEYS) || 'default';
3616
3615
  const modesForAppearance = this[pickedAppearanceKey];
3617
3616
  if (!modesForAppearance) {
3618
3617
  return MODE_KEYS.map(() => '');
@@ -3834,7 +3833,7 @@ class VariantTheme extends BaseTheme {
3834
3833
  });
3835
3834
  }
3836
3835
  getClasses(props, defaults) {
3837
- const activeVariantKey = pickKey(props, defaults, VARIANT_KEYS, 'outline');
3836
+ const activeVariantKey = pickFirstTruthyKey(props, defaults, VARIANT_KEYS) || 'outline';
3838
3837
  const activeTextAppearanceTheme = this[activeVariantKey];
3839
3838
  if (!activeTextAppearanceTheme) {
3840
3839
  return [];
@@ -4170,9 +4169,8 @@ class DirectionTheme extends BaseTheme {
4170
4169
  });
4171
4170
  }
4172
4171
  getClasses(props, defaults) {
4173
- var _a;
4174
- let direction = (_a = pickKey(props, defaults, FLEX_DIRECTION_KEYS)) !== null && _a !== void 0 ? _a : 'column';
4175
- const reverse = pickKey(props, defaults, DIRECTION_REVERSE_KEYS);
4172
+ let direction = pickFirstTruthyKey(props, defaults, FLEX_DIRECTION_KEYS) || 'column';
4173
+ const reverse = pickFirstTruthyKey(props, defaults, DIRECTION_REVERSE_KEYS);
4176
4174
  if (reverse) {
4177
4175
  switch (direction) {
4178
4176
  case "column":
@@ -4202,7 +4200,7 @@ class WrapTheme extends BaseTheme {
4202
4200
  });
4203
4201
  }
4204
4202
  getClasses(props, defaults) {
4205
- const key = pickKey(props, defaults, WRAP_KEYS);
4203
+ const key = pickFirstTruthyKey(props, defaults, WRAP_KEYS);
4206
4204
  return key ? [this[key]] : [];
4207
4205
  }
4208
4206
  }
@@ -4229,7 +4227,7 @@ class LayoutAppearanceTheme extends BaseTheme {
4229
4227
  });
4230
4228
  }
4231
4229
  getClasses(props, defaults) {
4232
- const pickedAppearanceKey = pickKey(props, defaults, APPEARANCE_KEYS, 'default');
4230
+ const pickedAppearanceKey = pickFirstTruthyKey(props, defaults, APPEARANCE_KEYS) || 'default';
4233
4231
  const modesForAppearance = this[pickedAppearanceKey];
4234
4232
  if (!modesForAppearance) {
4235
4233
  return MODE_KEYS.map(() => '');
@@ -4277,7 +4275,7 @@ class BreakpointTheme extends BaseTheme {
4277
4275
  });
4278
4276
  }
4279
4277
  getClasses(props, defaults) {
4280
- const key = pickKey(props, defaults, BREAKPOINT_KEYS);
4278
+ const key = pickFirstTruthyKey(props, defaults, BREAKPOINT_KEYS);
4281
4279
  if (!key)
4282
4280
  return [];
4283
4281
  return [this[key] || ''];
@@ -4546,6 +4544,8 @@ const gridSubThemes = {
4546
4544
  const defaultGrid3Theme = new ComponentTheme("div", "grid grid-cols-1 md:grid-cols-3", gridSubThemes, gridDefaults);
4547
4545
  const defaultGrid4Theme = new ComponentTheme("div", "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4", gridSubThemes, gridDefaults);
4548
4546
 
4547
+ const COMPONENT_KEYS = ['button', 'badge', 'chip', 'card', 'divider', 'row', 'col', 'stack', 'section',
4548
+ 'grid3', 'grid4', 'pageTitle', 'sectionTitle', 'title', 'text', 'link', 'list', 'listItem'];
4549
4549
  const defaultTheme = {
4550
4550
  button: defaultButtonTheme,
4551
4551
  badge: defaultBadgeTheme,
@@ -4703,5 +4703,5 @@ const List = (props) => {
4703
4703
  return buildComponent(props, theme.list, TYPOGRAPHY_COMPONENT_KEYS);
4704
4704
  };
4705
4705
 
4706
- export { Badge, Button, Card, Chip, Col, Container, Divider, Grid3, Grid4, Link, List, ListItem, PageTitle, Row, Section, SectionTitle, Stack, Text, ThemeProvider, Title, useTheme };
4706
+ export { Badge, Button, COMPONENT_KEYS, Card, Chip, Col, Container, Divider, Grid3, Grid4, Link, List, ListItem, PageTitle, Row, Section, SectionTitle, Stack, Text, ThemeProvider, Title, defaultTheme, useTheme };
4707
4707
  //# sourceMappingURL=index.esm.js.map