@yahoo/uds 3.96.0-beta.1 → 3.96.0-beta.3

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 (9) hide show
  1. package/dist/cli.mjs +6 -4
  2. package/dist/rules/cursor/uds/components.mdc +25 -0
  3. package/dist/rules/cursor/uds/icons.mdc +8 -0
  4. package/dist/rules/cursor/uds/tailwind.mdc +9 -0
  5. package/dist/styles/styler.d.cts +11 -11
  6. package/dist/styles/styler.d.ts +11 -11
  7. package/dist/tailwind/utils/getTailwindAsUdsColors.d.cts +1 -1
  8. package/dist/tailwind/utils/getTailwindAsUdsColors.d.ts +1 -1
  9. package/package.json +1 -1
package/dist/cli.mjs CHANGED
@@ -4,7 +4,8 @@ import updateNotifier from "simple-update-notifier";
4
4
  import prompts from "prompts";
5
5
  import { execSync } from "node:child_process";
6
6
  import fs, { existsSync, mkdirSync, readFileSync, writeFileSync } from "node:fs";
7
- import path, { join } from "node:path";
7
+ import path, { dirname, join } from "node:path";
8
+ import { fileURLToPath } from "node:url";
8
9
  import fg from "fast-glob";
9
10
  import { Node, Project, SyntaxKind, ts } from "ts-morph";
10
11
  import { DARK_COLOR_MODE_CLASSNAME, LARGE_SCALE_MODE_CLASSNAME, LIGHT_COLOR_MODE_CLASSNAME, MEDIUM_SCALE_MODE_CLASSNAME, SMALL_SCALE_MODE_CLASSNAME, XLARGE_SCALE_MODE_CLASSNAME, XSMALL_SCALE_MODE_CLASSNAME, XXLARGE_SCALE_MODE_CLASSNAME, XXXLARGE_SCALE_MODE_CLASSNAME } from "./css-tokens/dist/index.js";
@@ -289,6 +290,7 @@ var codemod_default = {
289
290
 
290
291
  //#endregion
291
292
  //#region cli/rules/config.ts
293
+ const __dirname = dirname(fileURLToPath(import.meta.url));
292
294
  const EDITOR_CONFIGS = { cursor: {
293
295
  name: "Cursor",
294
296
  description: "AI-powered coding assistant rules for UDS development",
@@ -297,7 +299,7 @@ const EDITOR_CONFIGS = { cursor: {
297
299
  name: "UDS Components",
298
300
  description: "Component development guidelines and patterns",
299
301
  files: [{
300
- source: "cursor/uds/components.mdc",
302
+ source: "rules/cursor/uds/components.mdc",
301
303
  target: ".cursor/rules/uds/components.mdc",
302
304
  type: "file"
303
305
  }]
@@ -306,7 +308,7 @@ const EDITOR_CONFIGS = { cursor: {
306
308
  name: "UDS Tailwind",
307
309
  description: "Tailwind CSS configuration and setup guidelines",
308
310
  files: [{
309
- source: "cursor/uds/tailwind.mdc",
311
+ source: "rules/cursor/uds/tailwind.mdc",
310
312
  target: ".cursor/rules/uds/tailwind.mdc",
311
313
  type: "file"
312
314
  }]
@@ -315,7 +317,7 @@ const EDITOR_CONFIGS = { cursor: {
315
317
  name: "UDS Icons",
316
318
  description: "Icon usage and documentation guidelines",
317
319
  files: [{
318
- source: "cursor/uds/icons.mdc",
320
+ source: "rules/cursor/uds/icons.mdc",
319
321
  target: ".cursor/rules/uds/icons.mdc",
320
322
  type: "file"
321
323
  }]
package/dist/rules/cursor/uds/components.mdc ADDED
@@ -0,0 +1,25 @@
1
+ ---
2
+ description: UDS components
3
+ globs:
4
+ alwaysApply: true
5
+ ---
6
+
7
+ - Always fetch components type definition using the UDS mcp server
8
+ - Always fetch the possible components from uds using the UDS mcp server
9
+ - Anytime you are about to use a component, fetch the type definition
10
+ - Anytime you are about to use a component, fetch the component documentation examples
11
+ - Anytime you have to create a component, make sure you are using UDS components
12
+ - Never create already existing UDS components from scratch
13
+ - Make sure there are no type errors when you create new components
14
+ - Always use UDS UI library components instead of raw HTML tags.
15
+ - Only create custom components when UDS doesn't provide the needed functionality
16
+ - `<Box>` has `display = 'flex'` by default - use `<VStack>` for vertical stacking, `<HStack>` for horizontal, or `<div>` for simple containers
17
+ - Use `<Text>` instead of `<p>`, `<span>`, `<h1>`-`<h6>`
18
+ - Use `<Button>` instead of `<button>`
19
+ - Use `<Input>` instead of `<input>`
20
+ - Use `<Checkbox>` instead of `<input type="checkbox">`
21
+ - Use `<Radio>` instead of `<input type="radio">`
22
+ - Use `<Switch>` instead of custom toggle components
23
+ - Use `<Link>` instead of `<a>`
24
+ - Use `<Icon>` instead of SVG elements
25
+ - Fix all lint errors before completing the task
package/dist/rules/cursor/uds/icons.mdc ADDED
@@ -0,0 +1,8 @@
1
+ ---
2
+ description: UDS Icons
3
+ globs:
4
+ alwaysApply: true
5
+ ---
6
+
7
+ - Anytime you have to use an icon in a UDS component or use UDS icons outside UDS components, fetch Icon documentation for more context from the MCP server
8
+ - Always check what icons are available in UDS through the MCP server
package/dist/rules/cursor/uds/tailwind.mdc ADDED
@@ -0,0 +1,9 @@
1
+ ---
2
+ description: UDS config
3
+ globs:
4
+ alwaysApply: true
5
+ ---
6
+
7
+ - Never create a UDS config manually
8
+ - If `uds.config.ts` or `uds.config.js` is not present at the root of the project, ask the user to create it using UDS CLI sync command
9
+ - Make sure that tailwind configuration has the UDS tailwind plugin
package/dist/styles/styler.d.cts CHANGED
@@ -21,8 +21,8 @@ declare const getStylesInternal: (props?: ({
21
21
  badgeVariantRoot?: "primary" | "secondary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | undefined;
22
22
  buttonSizeIcon?: "xs" | "sm" | "md" | "lg" | undefined;
23
23
  buttonSizeRoot?: "xs" | "sm" | "md" | "lg" | undefined;
24
- buttonVariantIcon?: "primary" | "secondary" | "tertiary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "alert-tertiary" | "brand-tertiary" | "info-tertiary" | "positive-tertiary" | "warning-tertiary" | undefined;
25
- buttonVariantRoot?: "primary" | "secondary" | "tertiary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "alert-tertiary" | "brand-tertiary" | "info-tertiary" | "positive-tertiary" | "warning-tertiary" | undefined;
24
+ buttonVariantIcon?: "primary" | "secondary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "tertiary" | "alert-tertiary" | "brand-tertiary" | "info-tertiary" | "positive-tertiary" | "warning-tertiary" | undefined;
25
+ buttonVariantRoot?: "primary" | "secondary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "tertiary" | "alert-tertiary" | "brand-tertiary" | "info-tertiary" | "positive-tertiary" | "warning-tertiary" | undefined;
26
26
  checkboxSizeCheckbox?: "sm" | "md" | undefined;
27
27
  checkboxSizeRoot?: "sm" | "md" | undefined;
28
28
  checkboxVariantCheckbox?: "primary" | "secondary" | "alert" | "alert-secondary" | undefined;
@@ -130,11 +130,11 @@ declare const getStylesInternal: (props?: ({
130
130
  toastVariantCloseIcon?: "warning" | "info" | "error" | "loading" | "success" | undefined;
131
131
  toastVariantIcon?: "warning" | "info" | "error" | "loading" | "success" | undefined;
132
132
  toastVariantRoot?: "warning" | "info" | "error" | "loading" | "success" | undefined;
133
- color?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "on-color" | undefined;
134
- placeholderColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "on-color" | undefined;
133
+ color?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "tertiary" | "muted" | "on-color" | undefined;
134
+ placeholderColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "tertiary" | "muted" | "on-color" | undefined;
135
135
  fontFamily?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | "sans" | "sans-alt" | "serif" | "serif-alt" | "mono" | undefined;
136
136
  fontSize?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | undefined;
137
- fontWeight?: "black" | "thin" | "medium" | "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | "bold" | "extralight" | "light" | "regular" | "semibold" | "extrabold" | undefined;
137
+ fontWeight?: "black" | "thin" | "medium" | "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | "light" | "bold" | "extralight" | "regular" | "semibold" | "extrabold" | undefined;
138
138
  lineHeight?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | undefined;
139
139
  letterSpacing?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | undefined;
140
140
  textAlign?: "center" | "justify" | "start" | "end" | undefined;
@@ -156,11 +156,11 @@ declare const getStylesInternal: (props?: ({
156
156
  columnGap?: "0" | "1" | "2" | "3" | "4" | "5" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "14" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
157
157
  rowGap?: "0" | "1" | "2" | "3" | "4" | "5" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "14" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
158
158
  backgroundColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
159
- borderColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
160
- borderStartColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
161
- borderEndColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
162
- borderBottomColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
163
- borderTopColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
159
+ borderColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "tertiary" | "muted" | undefined;
160
+ borderStartColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "tertiary" | "muted" | undefined;
161
+ borderEndColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "tertiary" | "muted" | undefined;
162
+ borderBottomColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "tertiary" | "muted" | undefined;
163
+ borderTopColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "tertiary" | "muted" | undefined;
164
164
  borderRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
165
165
  borderTopStartRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
166
166
  borderTopEndRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
@@ -190,7 +190,7 @@ declare const getStylesInternal: (props?: ({
190
190
  overflowX?: "hidden" | "auto" | "clip" | "visible" | "scroll" | undefined;
191
191
  overflowY?: "hidden" | "auto" | "clip" | "visible" | "scroll" | undefined;
192
192
  position?: "static" | "fixed" | "absolute" | "relative" | "sticky" | undefined;
193
- contentFit?: "none" | "fill" | "cover" | "contain" | "scale-down" | undefined;
193
+ contentFit?: "none" | "fill" | "contain" | "cover" | "scale-down" | undefined;
194
194
  colorMode?: "light" | "dark" | undefined;
195
195
  scaleMode?: "small" | "medium" | "xSmall" | "large" | "xLarge" | "xxLarge" | "xxxLarge" | undefined;
196
196
  width?: "full" | "fit" | "screen" | undefined;
package/dist/styles/styler.d.ts CHANGED
@@ -21,8 +21,8 @@ declare const getStylesInternal: (props?: ({
21
21
  badgeVariantRoot?: "primary" | "secondary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | undefined;
22
22
  buttonSizeIcon?: "xs" | "sm" | "md" | "lg" | undefined;
23
23
  buttonSizeRoot?: "xs" | "sm" | "md" | "lg" | undefined;
24
- buttonVariantIcon?: "primary" | "secondary" | "tertiary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "alert-tertiary" | "brand-tertiary" | "info-tertiary" | "positive-tertiary" | "warning-tertiary" | undefined;
25
- buttonVariantRoot?: "primary" | "secondary" | "tertiary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "alert-tertiary" | "brand-tertiary" | "info-tertiary" | "positive-tertiary" | "warning-tertiary" | undefined;
24
+ buttonVariantIcon?: "primary" | "secondary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "tertiary" | "alert-tertiary" | "brand-tertiary" | "info-tertiary" | "positive-tertiary" | "warning-tertiary" | undefined;
25
+ buttonVariantRoot?: "primary" | "secondary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "tertiary" | "alert-tertiary" | "brand-tertiary" | "info-tertiary" | "positive-tertiary" | "warning-tertiary" | undefined;
26
26
  checkboxSizeCheckbox?: "sm" | "md" | undefined;
27
27
  checkboxSizeRoot?: "sm" | "md" | undefined;
28
28
  checkboxVariantCheckbox?: "primary" | "secondary" | "alert" | "alert-secondary" | undefined;
@@ -130,11 +130,11 @@ declare const getStylesInternal: (props?: ({
130
130
  toastVariantCloseIcon?: "warning" | "info" | "error" | "loading" | "success" | undefined;
131
131
  toastVariantIcon?: "warning" | "info" | "error" | "loading" | "success" | undefined;
132
132
  toastVariantRoot?: "warning" | "info" | "error" | "loading" | "success" | undefined;
133
- color?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "on-color" | undefined;
134
- placeholderColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "on-color" | undefined;
133
+ color?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "tertiary" | "muted" | "on-color" | undefined;
134
+ placeholderColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "tertiary" | "muted" | "on-color" | undefined;
135
135
  fontFamily?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | "sans" | "sans-alt" | "serif" | "serif-alt" | "mono" | undefined;
136
136
  fontSize?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | undefined;
137
- fontWeight?: "black" | "thin" | "medium" | "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | "bold" | "extralight" | "light" | "regular" | "semibold" | "extrabold" | undefined;
137
+ fontWeight?: "black" | "thin" | "medium" | "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | "light" | "bold" | "extralight" | "regular" | "semibold" | "extrabold" | undefined;
138
138
  lineHeight?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | undefined;
139
139
  letterSpacing?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | undefined;
140
140
  textAlign?: "center" | "justify" | "start" | "end" | undefined;
@@ -156,11 +156,11 @@ declare const getStylesInternal: (props?: ({
156
156
  columnGap?: "0" | "1" | "2" | "3" | "4" | "5" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "14" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
157
157
  rowGap?: "0" | "1" | "2" | "3" | "4" | "5" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "14" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
158
158
  backgroundColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
159
- borderColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
160
- borderStartColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
161
- borderEndColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
162
- borderBottomColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
163
- borderTopColor?: "primary" | "secondary" | "tertiary" | "muted" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | undefined;
159
+ borderColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "tertiary" | "muted" | undefined;
160
+ borderStartColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "tertiary" | "muted" | undefined;
161
+ borderEndColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "tertiary" | "muted" | undefined;
162
+ borderBottomColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "tertiary" | "muted" | undefined;
163
+ borderTopColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "tertiary" | "muted" | undefined;
164
164
  borderRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
165
165
  borderTopStartRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
166
166
  borderTopEndRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
@@ -190,7 +190,7 @@ declare const getStylesInternal: (props?: ({
190
190
  overflowX?: "hidden" | "auto" | "clip" | "visible" | "scroll" | undefined;
191
191
  overflowY?: "hidden" | "auto" | "clip" | "visible" | "scroll" | undefined;
192
192
  position?: "static" | "fixed" | "absolute" | "relative" | "sticky" | undefined;
193
- contentFit?: "none" | "fill" | "cover" | "contain" | "scale-down" | undefined;
193
+ contentFit?: "none" | "fill" | "contain" | "cover" | "scale-down" | undefined;
194
194
  colorMode?: "light" | "dark" | undefined;
195
195
  scaleMode?: "small" | "medium" | "xSmall" | "large" | "xLarge" | "xxLarge" | "xxxLarge" | undefined;
196
196
  width?: "full" | "fit" | "screen" | undefined;
package/dist/tailwind/utils/getTailwindAsUdsColors.d.cts CHANGED
@@ -4,6 +4,6 @@ import tailwindColors from "tailwindcss/colors";
4
4
  //#region src/tailwind/utils/getTailwindAsUdsColors.d.ts
5
5
  type DeprecatedTailwindHue = 'lightBlue' | 'warmGray' | 'trueGray' | 'coolGray' | 'blueGray';
6
6
  type TailwindHue = Exclude<keyof typeof tailwindColors, DeprecatedTailwindHue>;
7
- declare function getTailwindAsUdsColors(): Record<TailwindHue, Record<"50" | "100" | "200" | "300" | "500" | "700" | "400" | "600" | "800" | "900" | "950", string>>;
7
+ declare function getTailwindAsUdsColors(): Record<TailwindHue, Record<"50" | "100" | "200" | "300" | "500" | "700" | "400" | "800" | "900" | "600" | "950", string>>;
8
8
  //#endregion
9
9
  export { getTailwindAsUdsColors };
package/dist/tailwind/utils/getTailwindAsUdsColors.d.ts CHANGED
@@ -4,6 +4,6 @@ import tailwindColors from "tailwindcss/colors";
4
4
  //#region src/tailwind/utils/getTailwindAsUdsColors.d.ts
5
5
  type DeprecatedTailwindHue = 'lightBlue' | 'warmGray' | 'trueGray' | 'coolGray' | 'blueGray';
6
6
  type TailwindHue = Exclude<keyof typeof tailwindColors, DeprecatedTailwindHue>;
7
- declare function getTailwindAsUdsColors(): Record<TailwindHue, Record<"50" | "100" | "200" | "300" | "500" | "700" | "400" | "600" | "800" | "900" | "950", string>>;
7
+ declare function getTailwindAsUdsColors(): Record<TailwindHue, Record<"50" | "100" | "200" | "300" | "500" | "700" | "400" | "800" | "900" | "600" | "950", string>>;
8
8
  //#endregion
9
9
  export { getTailwindAsUdsColors };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@yahoo/uds",
3
3
  "description": "Yahoo Universal System",
4
- "version": "3.96.0-beta.1",
4
+ "version": "3.96.0-beta.3",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",
7
7
  "module": "./dist/index.js",