@yahoo/uds-v5-wip 1.33.0 → 1.34.0

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 (38) hide show
  1. package/dist/config/dist/index.js +2 -0
  2. package/dist/config/dist/propertyAcceptedTypes.js +148 -0
  3. package/dist/config/dist/resolveStyleProp.d.ts +1 -0
  4. package/dist/config/dist/resolveStyleProp.js +2 -0
  5. package/dist/config.d.ts +197 -197
  6. package/dist/core/dist/compositeStyles.d.ts +2 -1
  7. package/dist/core/dist/createComponent.d.ts +2 -1
  8. package/dist/core/dist/createComponentExample.d.ts +2 -1
  9. package/dist/core/dist/createProvider.d.ts +2 -1
  10. package/dist/core/dist/generated/stylePropsTwMap.d.ts +2 -1
  11. package/dist/core/dist/getComponentStyles.d.ts +2 -1
  12. package/dist/core/dist/getStyles.d.ts +2 -1
  13. package/dist/core/dist/propMappings.d.ts +2 -1
  14. package/dist/core/dist/resolveMotionState.d.ts +2 -1
  15. package/dist/core/dist/transformPreset.d.ts +2 -1
  16. package/dist/core/dist/withDefaultStyleProps.d.ts +2 -1
  17. package/dist/foundational-presets/dist/boldVibrant.d.ts +198 -197
  18. package/dist/foundational-presets/dist/brutalist.d.ts +198 -197
  19. package/dist/foundational-presets/dist/candy.d.ts +198 -197
  20. package/dist/foundational-presets/dist/cleanMinimalist.d.ts +198 -197
  21. package/dist/foundational-presets/dist/corporate.d.ts +198 -197
  22. package/dist/foundational-presets/dist/darkMoody.d.ts +198 -197
  23. package/dist/foundational-presets/dist/defaultPreset.d.ts +198 -197
  24. package/dist/foundational-presets/dist/forest.d.ts +198 -197
  25. package/dist/foundational-presets/dist/highContrast.d.ts +198 -197
  26. package/dist/foundational-presets/dist/lavender.d.ts +198 -197
  27. package/dist/foundational-presets/dist/luxury.d.ts +198 -197
  28. package/dist/foundational-presets/dist/monochrome.d.ts +198 -197
  29. package/dist/foundational-presets/dist/motion.d.ts +2 -1
  30. package/dist/foundational-presets/dist/neonCyber.d.ts +198 -197
  31. package/dist/foundational-presets/dist/newspaper.d.ts +198 -197
  32. package/dist/foundational-presets/dist/ocean.d.ts +198 -197
  33. package/dist/foundational-presets/dist/slate.d.ts +198 -197
  34. package/dist/foundational-presets/dist/sunset.d.ts +198 -197
  35. package/dist/foundational-presets/dist/terminal.d.ts +198 -197
  36. package/dist/foundational-presets/dist/warmOrganic.d.ts +198 -197
  37. package/dist/tsconfig.tsbuildinfo +1 -1
  38. package/package.json +3 -3
@@ -1,6 +1,7 @@
1
1
  import { ComponentProps, ComponentType } from "react";
2
2
 
3
3
  //#region ../core/dist/createComponentExample.d.ts
4
+ //#region src/createComponentExample.d.ts
4
5
  /**
5
6
  * Extracts variant fixtures from a Component's props type.
6
7
  * If Button has `variant?: 'brand' | 'outline'` and `size?: 'sm' | 'md'`,
@@ -36,6 +37,6 @@ type ExamplesResult<TComponent extends ComponentType<any>> = {
36
37
  * }));
37
38
  * ```
38
39
  */
39
- declare function createComponentExample<TComponent extends ComponentType<any>, T extends Record<string, ExampleFn<TComponent>>>(Component: TComponent, examplesFn: (fixtures: VariantFixtures<TComponent>) => ExamplesResult<TComponent>): ComponentExample<T>;
40
+ declare function createComponentExample<TComponent extends ComponentType<any>, T extends Record<string, ExampleFn<TComponent>>>(Component: TComponent, examplesFn: (fixtures: VariantFixtures<TComponent>) => ExamplesResult<TComponent>): ComponentExample<T>; //#endregion
40
41
  //#endregion
41
42
  export { ComponentExample, createComponentExample };
@@ -1,4 +1,5 @@
1
1
  //#region ../core/dist/createProvider.d.ts
2
+ //#region src/createProvider.d.ts
2
3
  type ProviderRenderFn<TContext, TProps = Record<never, never>> = (props: {
3
4
  children: React.ReactNode;
4
5
  } & TProps) => {
@@ -7,6 +8,6 @@ type ProviderRenderFn<TContext, TProps = Record<never, never>> = (props: {
7
8
  };
8
9
  declare function createProvider<TContext, TProps = Record<never, never>>(name: string, renderFn: ProviderRenderFn<TContext, TProps>): [React.FC<{
9
10
  children: React.ReactNode;
10
- } & TProps>, () => TContext];
11
+ } & TProps>, () => TContext]; //#endregion
11
12
  //#endregion
12
13
  export { createProvider };
@@ -1,4 +1,5 @@
1
1
  //#region ../core/dist/generated/stylePropsTwMap.d.ts
2
+ //#region src/generated/stylePropsTwMap.d.ts
2
3
  declare const stylePropsTwMap: {
3
4
  readonly "border-boolean": {
4
5
  readonly border: "boolean";
@@ -1695,6 +1696,6 @@ declare const stylePropsTwMap: {
1695
1696
  readonly "hyphens-manual": {
1696
1697
  readonly hyphens: "manual";
1697
1698
  };
1698
- };
1699
+ }; //#endregion
1699
1700
  //#endregion
1700
1701
  export { stylePropsTwMap };
@@ -1,6 +1,7 @@
1
1
  import { ComponentRegistry, ComponentSlotsOf, ComponentVariantsOf } from "@uds/types";
2
2
 
3
3
  //#region ../core/dist/getComponentStyles.d.ts
4
+ //#region src/getComponentStyles.d.ts
4
5
  type ResolveSlots<Name extends string> = Name extends keyof ComponentRegistry ? ComponentSlotsOf<Name> : string;
5
6
  type ResolveVariants<Name extends string> = Name extends keyof ComponentRegistry ? ComponentVariantsOf<Name> : Record<string, string>;
6
7
  interface UdsRuntimeMeta {
@@ -44,6 +45,6 @@ interface ComponentStyler<Name extends string> {
44
45
  * @param slots - Array of slot names
45
46
  * @param element - Optional HTML element tag for element-specific prop forwarding
46
47
  */
47
- declare function createComponentStyler<Name extends string>(componentName: Name, slots: readonly string[], element?: string, variants?: readonly string[]): ComponentStyler<Name>;
48
+ declare function createComponentStyler<Name extends string>(componentName: Name, slots: readonly string[], element?: string, variants?: readonly string[]): ComponentStyler<Name>; //#endregion
48
49
  //#endregion
49
50
  export { createComponentStyler };
@@ -2,6 +2,7 @@ import { ClassValue } from "clsx";
2
2
  import { ModifierProp, ModifierProps, StyleAndModifierProps, StyleProps } from "@uds/types";
3
3
 
4
4
  //#region ../core/dist/getStyles.d.ts
5
+ //#region src/getStyles.d.ts
5
6
  /** Convert kebab-case CSS property to camelCase for React inline styles.
6
7
  * CSS custom properties (--*) are kept as-is since React supports them verbatim. */
7
8
  declare function toCamelCase(str: string): string;
@@ -37,6 +38,6 @@ interface GetStylesParams extends StyleProps, ModifierProps {
37
38
  * so they can be included in the CSS safelist.
38
39
  */
39
40
  declare function getStyles(props: GetStylesParams): string;
40
- declare function getVariantClassName(componentName: string, variant: string | undefined): string;
41
+ declare function getVariantClassName(componentName: string, variant: string | undefined): string; //#endregion
41
42
  //#endregion
42
43
  export { createVariants, cx, getStyles, getVariantClassName, processStyleProps, toCamelCase };
@@ -1,6 +1,7 @@
1
1
  import { ConfigurableProp, ModifierProp, StyleProp } from "@uds/types";
2
2
 
3
3
  //#region ../core/dist/propMappings.d.ts
4
+ //#region src/propMappings.d.ts
4
5
  interface PropMapping {
5
6
  /** Class name prefix for runtime class generation. 'no-prefix' means value IS the class. */
6
7
  classPrefix: string;
@@ -71,6 +72,6 @@ interface ModifierEntry {
71
72
  *
72
73
  * e.g. `bg="primary"` + `bgOpacity="75"` → class `bg-primary_75`
73
74
  */
74
- declare const colorPropToOpacityProp: Record<string, string>;
75
+ declare const colorPropToOpacityProp: Record<string, string>; //#endregion
75
76
  //#endregion
76
77
  export { ConfigurablePropertyEntry, CssVariablePrefixEntry, ModifierEntry, PropMapping, colorPropToOpacityProp, getConfigurablePropMapping, getConfigurableProperties, getCssVariablePrefixes, modifierMappings, propMappings };
@@ -1,4 +1,5 @@
1
1
  //#region ../core/dist/resolveMotionState.d.ts
2
- declare function resolveMotionState(stateKeyframe: Record<string, unknown>, index: number): Record<string, number>;
2
+ //#region src/resolveMotionState.d.ts
3
+ declare function resolveMotionState(stateKeyframe: Record<string, unknown>, index: number): Record<string, number>; //#endregion
3
4
  //#endregion
4
5
  export { resolveMotionState };
@@ -1,6 +1,7 @@
1
1
  import { MotionPreset } from "@uds/types";
2
2
 
3
3
  //#region ../core/dist/transformPreset.d.ts
4
+ //#region src/transformPreset.d.ts
4
5
  interface TransformedMotionProps {
5
6
  initial?: Record<string, unknown>;
6
7
  animate?: Record<string, unknown>;
@@ -12,6 +13,6 @@ interface TransformedMotionProps {
12
13
  /**
13
14
  * Convert a JS-runtime MotionPreset to a motion/react-compatible props object.
14
15
  */
15
- declare function transformPreset(preset: MotionPreset): TransformedMotionProps;
16
+ declare function transformPreset(preset: MotionPreset): TransformedMotionProps; //#endregion
16
17
  //#endregion
17
18
  export { TransformedMotionProps, transformPreset };
@@ -1,6 +1,7 @@
1
1
  import { BorderRadius, GridSpan, GridStartEnd, GridTemplate, StyleAndModifierProps } from "@uds/types";
2
2
 
3
3
  //#region ../core/dist/withDefaultStyleProps.d.ts
4
+ //#region src/withDefaultStyleProps.d.ts
4
5
  interface StackDefaultsInput extends StyleAndModifierProps {
5
6
  gap?: StyleAndModifierProps['gap'];
6
7
  }
@@ -38,6 +39,6 @@ declare const withDefaultStyleProps: {
38
39
  shape?: BorderRadius;
39
40
  }) => StyleAndModifierProps;
40
41
  Svg: (props: SvgDefaultsInput) => StyleAndModifierProps;
41
- };
42
+ }; //#endregion
42
43
  //#endregion
43
44
  export { withDefaultStyleProps };
@@ -2,7 +2,49 @@ import { UdsConfig } from "../../config/dist/createConfig.js";
2
2
  import * as _$_uds_types0 from "@uds/types";
3
3
 
4
4
  //#region ../foundational-presets/dist/boldVibrant.d.ts
5
+ //#region src/boldVibrant.d.ts
5
6
  declare const boldVibrantFoundationPreset: UdsConfig<_$_uds_types0.ModifierProp | "_light" | "_dark" | "_sm" | "_md" | "_lg" | "_xl" | "_2xl", {
7
+ opacity: {
8
+ 0: string;
9
+ 5: string;
10
+ 10: string;
11
+ 20: string;
12
+ 40: string;
13
+ 60: string;
14
+ 80: string;
15
+ 25: string;
16
+ 30: string;
17
+ 50: string;
18
+ 70: string;
19
+ 75: string;
20
+ 90: string;
21
+ 95: string;
22
+ 100: string;
23
+ };
24
+ scale: {
25
+ 0: string;
26
+ 50: string;
27
+ 75: string;
28
+ 90: string;
29
+ 95: string;
30
+ 100: string;
31
+ 105: string;
32
+ 110: string;
33
+ 125: string;
34
+ 150: string;
35
+ 200: string;
36
+ };
37
+ rotate: {
38
+ 0: string;
39
+ 2: string;
40
+ 1: string;
41
+ 3: string;
42
+ 6: string;
43
+ 12: string;
44
+ 90: string;
45
+ 45: string;
46
+ 180: string;
47
+ };
6
48
  color: {
7
49
  inherit: string;
8
50
  current: string;
@@ -28,23 +70,7 @@ declare const boldVibrantFoundationPreset: UdsConfig<_$_uds_types0.ModifierProp
28
70
  inverse: string;
29
71
  "on-inverse": string;
30
72
  };
31
- fontFamily: {
32
- sans: string;
33
- serif: string;
34
- mono: string;
35
- };
36
- fontWeight: {
37
- bold: string;
38
- light: string;
39
- thin: string;
40
- medium: string;
41
- extralight: string;
42
- normal: string;
43
- semibold: string;
44
- extrabold: string;
45
- black: string;
46
- };
47
- bg: {
73
+ borderColor: {
48
74
  brand: string;
49
75
  accent: string;
50
76
  alert: string;
@@ -55,17 +81,51 @@ declare const boldVibrantFoundationPreset: UdsConfig<_$_uds_types0.ModifierProp
55
81
  tertiary: string;
56
82
  inverse: string;
57
83
  surface: string;
58
- "elevation-1": string;
59
- "elevation-2": string;
60
- "elevation-3": string;
61
84
  "brand-wash": string;
62
85
  "accent-wash": string;
63
86
  "alert-wash": string;
64
87
  "positive-wash": string;
65
88
  "warning-wash": string;
66
- overlay: string;
67
89
  };
68
- borderColor: {
90
+ position: {
91
+ auto: string;
92
+ full: string;
93
+ "1/2": string;
94
+ "1/3": string;
95
+ "2/3": string;
96
+ "1/4": string;
97
+ "2/4": string;
98
+ "3/4": string;
99
+ };
100
+ size: {
101
+ auto: string;
102
+ full: string;
103
+ max: string;
104
+ min: string;
105
+ "1/2": string;
106
+ "1/3": string;
107
+ "2/3": string;
108
+ "1/4": string;
109
+ "2/4": string;
110
+ "3/4": string;
111
+ fit: string;
112
+ "1/5": string;
113
+ "2/5": string;
114
+ "3/5": string;
115
+ "4/5": string;
116
+ "1/6": string;
117
+ "2/6": string;
118
+ "3/6": string;
119
+ "4/6": string;
120
+ "5/6": string;
121
+ };
122
+ animation: {
123
+ none: string;
124
+ ping: string;
125
+ spin: string;
126
+ };
127
+ bg: {
128
+ overlay: string;
69
129
  brand: string;
70
130
  accent: string;
71
131
  alert: string;
@@ -76,6 +136,9 @@ declare const boldVibrantFoundationPreset: UdsConfig<_$_uds_types0.ModifierProp
76
136
  tertiary: string;
77
137
  inverse: string;
78
138
  surface: string;
139
+ "elevation-1": string;
140
+ "elevation-2": string;
141
+ "elevation-3": string;
79
142
  "brand-wash": string;
80
143
  "accent-wash": string;
81
144
  "alert-wash": string;
@@ -88,63 +151,50 @@ declare const boldVibrantFoundationPreset: UdsConfig<_$_uds_types0.ModifierProp
88
151
  medium: string;
89
152
  thick: string;
90
153
  };
91
- outlineWidth: {
154
+ divideWidth: {
92
155
  0: string;
93
- 2: string;
94
- 1: string;
95
156
  4: string;
96
- 8: string;
97
- };
98
- outlineOffset: {
99
- 0: string;
157
+ reverse: string;
100
158
  2: string;
101
- 1: string;
102
- 4: string;
103
159
  8: string;
104
160
  };
105
- divideWidth: {
106
- 0: string;
107
- 2: string;
108
- reverse: string;
109
- 4: string;
110
- 8: string;
161
+ flex: {
162
+ none: string;
163
+ initial: string;
164
+ auto: string;
165
+ 1: string;
111
166
  };
112
- ringWidth: {
167
+ flexGrow: {
113
168
  0: string;
114
- 2: string;
115
169
  1: string;
116
- inset: string;
117
- 4: string;
118
- 8: string;
119
170
  };
120
- ringOffsetWidth: {
171
+ flexShrink: {
121
172
  0: string;
122
- 2: string;
123
- 1: string;
124
- 4: string;
125
- 8: string;
126
173
  };
127
- lineHeight: {
128
- none: string;
129
- normal: string;
130
- tight: string;
131
- relaxed: string;
174
+ aspectRatio: {
175
+ square: string;
176
+ landscape: string;
177
+ portrait: string;
178
+ widescreen: string;
179
+ ultrawide: string;
180
+ golden: string;
132
181
  };
133
- letterSpacing: {
134
- normal: string;
135
- tight: string;
136
- tighter: string;
137
- wide: string;
138
- wider: string;
139
- widest: string;
182
+ zIndex: {
183
+ 0: string;
184
+ auto: string;
185
+ 10: string;
186
+ 20: string;
187
+ 40: string;
188
+ 30: string;
189
+ 50: string;
140
190
  };
141
191
  spacing: {
142
192
  0: string;
193
+ 4: string;
143
194
  2: string;
144
195
  5: string;
145
196
  1: string;
146
197
  px: string;
147
- 4: string;
148
198
  8: string;
149
199
  0.5: string;
150
200
  1.5: string;
@@ -175,183 +225,116 @@ declare const boldVibrantFoundationPreset: UdsConfig<_$_uds_types0.ModifierProp
175
225
  80: string;
176
226
  96: string;
177
227
  };
178
- position: {
179
- auto: string;
180
- full: string;
181
- "1/2": string;
182
- "1/3": string;
183
- "2/3": string;
184
- "1/4": string;
185
- "2/4": string;
186
- "3/4": string;
187
- };
188
- aspectRatio: {
189
- square: string;
190
- landscape: string;
191
- portrait: string;
192
- widescreen: string;
193
- ultrawide: string;
194
- golden: string;
228
+ w: {
229
+ screen: string;
230
+ svw: string;
231
+ lvw: string;
232
+ dvw: string;
195
233
  };
196
- flex: {
234
+ outlineWidth: {
235
+ 0: string;
236
+ 4: string;
237
+ 2: string;
197
238
  1: string;
198
- none: string;
199
- auto: string;
200
- initial: string;
239
+ 8: string;
201
240
  };
202
- flexGrow: {
241
+ outlineOffset: {
203
242
  0: string;
243
+ 4: string;
244
+ 2: string;
204
245
  1: string;
246
+ 8: string;
205
247
  };
206
- flexShrink: {
248
+ ringWidth: {
207
249
  0: string;
250
+ 4: string;
251
+ inset: string;
252
+ 2: string;
253
+ 1: string;
254
+ 8: string;
208
255
  };
209
- opacity: {
256
+ ringOffsetWidth: {
210
257
  0: string;
211
- 5: string;
212
- 10: string;
213
- 20: string;
214
- 40: string;
215
- 60: string;
216
- 80: string;
217
- 25: string;
218
- 30: string;
219
- 50: string;
220
- 70: string;
221
- 75: string;
222
- 90: string;
223
- 95: string;
224
- 100: string;
258
+ 4: string;
259
+ 2: string;
260
+ 1: string;
261
+ 8: string;
225
262
  };
226
- radius: {
263
+ shadow: {
264
+ none: string;
227
265
  sm: string;
228
266
  md: string;
229
267
  lg: string;
230
268
  xl: string;
231
- none: string;
232
- full: string;
269
+ "2xl": string;
270
+ "2xs": string;
233
271
  xs: string;
272
+ inner: string;
234
273
  };
235
- animation: {
274
+ strokeWidth: {
275
+ 0: string;
276
+ 2: string;
277
+ 1: string;
278
+ };
279
+ fontFamily: {
280
+ sans: string;
281
+ serif: string;
282
+ mono: string;
283
+ };
284
+ fontWeight: {
285
+ normal: string;
286
+ thin: string;
287
+ bold: string;
288
+ light: string;
289
+ medium: string;
290
+ extralight: string;
291
+ semibold: string;
292
+ extrabold: string;
293
+ black: string;
294
+ };
295
+ letterSpacing: {
296
+ normal: string;
297
+ tight: string;
298
+ tighter: string;
299
+ wide: string;
300
+ wider: string;
301
+ widest: string;
302
+ };
303
+ lineHeight: {
236
304
  none: string;
237
- spin: string;
238
- ping: string;
305
+ normal: string;
306
+ tight: string;
307
+ relaxed: string;
239
308
  };
240
- shadow: {
309
+ textShadow: {
310
+ none: string;
241
311
  sm: string;
242
312
  md: string;
243
313
  lg: string;
244
- xl: string;
245
- "2xl": string;
246
- none: string;
247
- xs: string;
248
314
  "2xs": string;
249
- inner: string;
315
+ xs: string;
250
316
  };
251
317
  blur: {
318
+ none: string;
252
319
  sm: string;
253
320
  md: string;
254
321
  lg: string;
255
322
  xl: string;
256
323
  "2xl": string;
257
- none: string;
258
324
  "3xl": string;
259
325
  };
260
- textShadow: {
261
- sm: string;
262
- md: string;
263
- lg: string;
264
- none: string;
265
- xs: string;
266
- "2xs": string;
267
- };
268
- zIndex: {
269
- 0: string;
270
- auto: string;
271
- 10: string;
272
- 20: string;
273
- 40: string;
274
- 30: string;
275
- 50: string;
276
- };
277
- size: {
278
- auto: string;
279
- full: string;
280
- "1/2": string;
281
- "1/3": string;
282
- "2/3": string;
283
- "1/4": string;
284
- "2/4": string;
285
- "3/4": string;
286
- min: string;
287
- max: string;
288
- fit: string;
289
- "1/5": string;
290
- "2/5": string;
291
- "3/5": string;
292
- "4/5": string;
293
- "1/6": string;
294
- "2/6": string;
295
- "3/6": string;
296
- "4/6": string;
297
- "5/6": string;
298
- };
299
- w: {
300
- screen: string;
301
- svw: string;
302
- lvw: string;
303
- dvw: string;
304
- };
305
- h: {
306
- screen: string;
307
- svh: string;
308
- lvh: string;
309
- dvh: string;
310
- };
311
- rotate: {
312
- 0: string;
313
- 2: string;
314
- 1: string;
315
- 3: string;
316
- 6: string;
317
- 12: string;
318
- 90: string;
319
- 45: string;
320
- 180: string;
321
- };
322
- scale: {
323
- 0: string;
324
- 50: string;
325
- 75: string;
326
- 90: string;
327
- 95: string;
328
- 100: string;
329
- 105: string;
330
- 110: string;
331
- 125: string;
332
- 150: string;
333
- 200: string;
334
- };
335
- skew: {
336
- 0: string;
337
- 2: string;
338
- 1: string;
339
- 3: string;
340
- 6: string;
341
- 12: string;
342
- };
343
326
  translate: {
344
327
  0: string;
328
+ 4: string;
329
+ full: string;
345
330
  2: string;
346
331
  5: string;
347
332
  1: string;
348
- full: string;
349
333
  "1/2": string;
350
334
  "1/3": string;
351
335
  "2/3": string;
352
336
  "1/4": string;
353
337
  "3/4": string;
354
- 4: string;
355
338
  8: string;
356
339
  0.5: string;
357
340
  1.5: string;
@@ -382,10 +365,28 @@ declare const boldVibrantFoundationPreset: UdsConfig<_$_uds_types0.ModifierProp
382
365
  80: string;
383
366
  96: string;
384
367
  };
385
- strokeWidth: {
368
+ radius: {
369
+ none: string;
370
+ sm: string;
371
+ md: string;
372
+ lg: string;
373
+ xl: string;
374
+ xs: string;
375
+ full: string;
376
+ };
377
+ h: {
378
+ screen: string;
379
+ svh: string;
380
+ lvh: string;
381
+ dvh: string;
382
+ };
383
+ skew: {
386
384
  0: string;
387
385
  2: string;
388
386
  1: string;
387
+ 3: string;
388
+ 6: string;
389
+ 12: string;
389
390
  };
390
391
  }, {}, {}, {}, "_light" | "_dark" | "_sm" | "_md" | "_lg" | "_xl" | "_2xl", {
391
392
  readonly color: {