@yahoo/uds 3.149.0 → 3.150.1-beta.1

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.
@@ -2578,7 +2578,7 @@
2578
2578
  "absolute",
2579
2579
  "inset-0",
2580
2580
  "-z-10",
2581
- "rounded-[length:var(--uds-nested-radius)]",
2581
+ "rounded-[var(--uds-nested-radius)]",
2582
2582
  "transition-[background-color,opacity]"
2583
2583
  ],
2584
2584
  "internalComponents": [
@@ -3049,155 +3049,33 @@
3049
3049
  "runtimeConfigInternalComponentProps": {},
3050
3050
  "motionVarPrefixes": []
3051
3051
  },
3052
- "Tab": {
3053
- "name": "Tab",
3054
- "defaultProps": {
3055
- "variant": "primary"
3056
- },
3057
- "getStylesLiterals": {
3058
- "tabSizeRoot": "default",
3059
- "tabVariantActiveRoot": "off",
3060
- "tabVariantActiveRoot:1": "on",
3061
- "tabSizeIcon": "default"
3062
- },
3063
- "cxLiterals": [
3064
- "pointer-events-none",
3065
- "absolute",
3066
- "bottom-0",
3067
- "left-0",
3068
- "right-0",
3069
- "h-[var(--uds-tab-underline-width,0px)]",
3070
- "bg-[var(--uds-tab-underline-color,transparent)]",
3071
- "transition-[height,background-color]",
3072
- "duration-[240ms]",
3073
- "ease-[cubic-bezier(0.2,0,0,1)]",
3074
- "!bg-transparent",
3075
- "!shadow-none",
3076
- "inline-flex",
3077
- "items-center",
3078
- "shrink-0",
3079
- "box-border",
3080
- "relative",
3081
- "z-[1]",
3082
- "cursor-pointer",
3083
- "select-none",
3084
- "whitespace-nowrap",
3085
- "uds-ring",
3086
- "opacity-50",
3087
- "cursor-default",
3088
- "border-solid",
3089
- "border-b-solid",
3090
- "transition-colors"
3091
- ],
3092
- "internalComponents": [
3093
- "IconSlot",
3094
- "AriakitTab",
3095
- "Text"
3096
- ],
3097
- "internalComponentProps": {
3098
- "Text": {
3099
- "variant": [
3100
- "inherit"
3101
- ],
3102
- "as": [
3103
- "span"
3104
- ],
3105
- "color": [
3106
- "current"
3107
- ]
3108
- }
3109
- },
3110
- "propToVariantKeys": {
3111
- "variant": [
3112
- "tabVariantRoot",
3113
- "tabVariantIcon"
3114
- ],
3115
- "activeState": [
3116
- "tabVariantActiveIcon"
3117
- ],
3118
- "startIcon": [
3119
- "icon"
3120
- ],
3121
- "endIcon": [
3122
- "icon"
3123
- ]
3124
- },
3125
- "runtimeConfigDefaultProps": {},
3126
- "runtimeConfigGetStyles": {},
3127
- "runtimeConfigInternalComponentProps": {},
3128
- "motionVarPrefixes": []
3129
- },
3130
- "TabList": {
3131
- "name": "TabList",
3132
- "defaultProps": {
3133
- "variant": "primary"
3134
- },
3135
- "getStylesLiterals": {
3136
- "tabSizeRoot": "default",
3137
- "tabVariantActiveRoot": "on"
3138
- },
3139
- "cxLiterals": [
3140
- "pointer-events-none",
3141
- "absolute",
3142
- "bottom-0",
3143
- "left-0",
3144
- "right-0",
3145
- "h-[var(--uds-tab-underline-width,0px)]",
3146
- "bg-[var(--uds-tab-underline-color,transparent)]",
3147
- "transition-[height,background-color]",
3148
- "duration-[240ms]",
3149
- "ease-[cubic-bezier(0.2,0,0,1)]",
3150
- "!m-0",
3151
- "!p-0",
3152
- "!gap-0",
3153
- "box-border",
3154
- "z-0",
3155
- "min-w-0",
3156
- "min-h-0",
3157
- "flex",
3158
- "flex-row",
3159
- "items-center",
3160
- "overflow-x-auto",
3161
- "overflow-y-clip",
3162
- "scrollbar-none",
3163
- "[overflow-clip-margin:6px]",
3164
- "overflow-clip",
3165
- "[overflow-clip-margin:8px]",
3166
- "relative",
3167
- "left",
3168
- "240ms",
3169
- "cubic-bezier(0.2,",
3170
- "0,",
3171
- "1),",
3172
- "top",
3173
- "width",
3174
- "height",
3175
- "1)",
3176
- "--uds-tab-underline-color",
3177
- "--uds-tab-underline-width"
3178
- ],
3052
+ "UDSBreakpointsConfigProvider": {
3053
+ "name": "UDSBreakpointsConfigProvider",
3054
+ "defaultProps": {},
3055
+ "getStylesLiterals": {},
3056
+ "cxLiterals": [],
3179
3057
  "internalComponents": [
3180
- "AriakitTabList"
3058
+ "UDSBreakpointsConfigContext.Provider"
3181
3059
  ],
3182
3060
  "internalComponentProps": {},
3183
- "propToVariantKeys": {
3184
- "variant": [
3185
- "tabsVariantRoot",
3186
- "tabVariantRoot"
3187
- ]
3188
- },
3061
+ "propToVariantKeys": {},
3189
3062
  "runtimeConfigDefaultProps": {},
3190
3063
  "runtimeConfigGetStyles": {},
3191
3064
  "runtimeConfigInternalComponentProps": {},
3192
3065
  "motionVarPrefixes": []
3193
3066
  },
3194
- "TabPanel": {
3195
- "name": "TabPanel",
3067
+ "UDSConfigProvider": {
3068
+ "name": "UDSConfigProvider",
3196
3069
  "defaultProps": {},
3197
3070
  "getStylesLiterals": {},
3198
3071
  "cxLiterals": [],
3199
3072
  "internalComponents": [
3200
- "AriakitTabPanel"
3073
+ "UDSBreakpointsConfigProvider",
3074
+ "UDSBottomSheetConfigProvider",
3075
+ "UDSToastConfigProvider",
3076
+ "UDSTooltipConfigProvider",
3077
+ "UDSPopoverConfigProvider",
3078
+ "UDSModalConfigProvider"
3201
3079
  ],
3202
3080
  "internalComponentProps": {},
3203
3081
  "propToVariantKeys": {},
@@ -3206,226 +3084,324 @@
3206
3084
  "runtimeConfigInternalComponentProps": {},
3207
3085
  "motionVarPrefixes": []
3208
3086
  },
3209
- "Tabs": {
3210
- "name": "Tabs",
3087
+ "Accordion": {
3088
+ "name": "Accordion",
3211
3089
  "defaultProps": {
3212
- "variant": "primary"
3090
+ "spacingHorizontal": "4",
3091
+ "spacingVertical": "4"
3213
3092
  },
3214
3093
  "getStylesLiterals": {},
3215
- "cxLiterals": [],
3094
+ "cxLiterals": [
3095
+ "hover:bg-secondary/80",
3096
+ "w-full"
3097
+ ],
3216
3098
  "internalComponents": [
3217
- "TabsContext.Provider",
3218
- "TabProvider"
3099
+ "Icon",
3100
+ "SpringMotionConfig",
3101
+ "Pressable",
3102
+ "Text",
3103
+ "HStack",
3104
+ "AnimatePresence",
3105
+ "VStack"
3219
3106
  ],
3220
- "internalComponentProps": {},
3221
- "propToVariantKeys": {
3222
- "onSelectionChange": [
3223
- "setSelectedId"
3224
- ]
3107
+ "internalComponentProps": {
3108
+ "Icon": {
3109
+ "variant": [
3110
+ "fill"
3111
+ ],
3112
+ "size": [
3113
+ "sm"
3114
+ ],
3115
+ "color": [
3116
+ "primary"
3117
+ ]
3118
+ },
3119
+ "SpringMotionConfig": {
3120
+ "layoutVariant": [
3121
+ "smooth"
3122
+ ],
3123
+ "layoutSpeed": [
3124
+ "3"
3125
+ ]
3126
+ },
3127
+ "Pressable": {
3128
+ "display": [
3129
+ "flex"
3130
+ ],
3131
+ "flexDirection": [
3132
+ "row"
3133
+ ],
3134
+ "alignItems": [
3135
+ "center"
3136
+ ],
3137
+ "justifyContent": [
3138
+ "space-between"
3139
+ ],
3140
+ "borderRadius": [
3141
+ "md"
3142
+ ]
3143
+ },
3144
+ "Text": {
3145
+ "variant": [
3146
+ "title4"
3147
+ ],
3148
+ "color": [
3149
+ "primary"
3150
+ ]
3151
+ },
3152
+ "HStack": {
3153
+ "display": [
3154
+ "flex"
3155
+ ],
3156
+ "alignItems": [
3157
+ "center"
3158
+ ],
3159
+ "justifyContent": [
3160
+ "space-between"
3161
+ ],
3162
+ "columnGap": [
3163
+ "2.5"
3164
+ ]
3165
+ }
3225
3166
  },
3167
+ "propToVariantKeys": {},
3226
3168
  "runtimeConfigDefaultProps": {},
3227
3169
  "runtimeConfigGetStyles": {},
3228
3170
  "runtimeConfigInternalComponentProps": {},
3229
- "motionVarPrefixes": []
3171
+ "motionVarPrefixes": [
3172
+ "--uds-motion-smooth-3-"
3173
+ ]
3230
3174
  },
3231
- "Toast": {
3232
- "name": "Toast",
3175
+ "AvoidMotionLibraryProvider": {
3176
+ "name": "AvoidMotionLibraryProvider",
3233
3177
  "defaultProps": {},
3178
+ "getStylesLiterals": {},
3179
+ "cxLiterals": [],
3180
+ "internalComponents": [],
3181
+ "internalComponentProps": {},
3182
+ "propToVariantKeys": {},
3183
+ "runtimeConfigDefaultProps": {},
3184
+ "runtimeConfigGetStyles": {},
3185
+ "runtimeConfigInternalComponentProps": {},
3186
+ "motionVarPrefixes": []
3187
+ },
3188
+ "SegmentedControl": {
3189
+ "name": "SegmentedControl",
3190
+ "defaultProps": {
3191
+ "textVariant": "label2"
3192
+ },
3234
3193
  "getStylesLiterals": {
3235
- "className": "animate-spin",
3236
- "className:1": "flex-none",
3237
- "spacing": "2",
3238
- "borderRadius": "full"
3194
+ "display": "flex",
3195
+ "alignItems": "center",
3196
+ "backgroundColor": "primary",
3197
+ "spacingVertical": "1",
3198
+ "spacingHorizontal": "3",
3199
+ "columnGap": "1.5",
3200
+ "borderWidth": "thin",
3201
+ "borderRadius": "full",
3202
+ "borderColor": "muted",
3203
+ "borderColor:1": "transparent",
3204
+ "color": "primary",
3205
+ "color:1": "tertiary",
3206
+ "color:2": "muted"
3239
3207
  },
3240
3208
  "cxLiterals": [
3241
- "duration-0",
3242
- "duration-120",
3243
- "transition-[background-color]",
3244
- "bg-carbon-15/0",
3245
- "hover:bg-carbon-15/10",
3246
- "active:bg-carbon-15/15",
3247
- "uds-ring"
3209
+ "uds-ring",
3210
+ "cursor-not-allowed",
3211
+ "opacity-50",
3212
+ "pointer-events-none",
3213
+ "hover:bg-primary"
3248
3214
  ],
3249
3215
  "internalComponents": [
3250
- "IconSlot",
3251
- "ToastContainer",
3252
- "Text",
3253
- "Button",
3254
- "Pressable"
3216
+ "Radio",
3217
+ "Icon",
3218
+ "RadioProvider",
3219
+ "HStack",
3220
+ "RadioGroup",
3221
+ "Pressable",
3222
+ "Text"
3255
3223
  ],
3256
- "internalComponentProps": {},
3257
- "propToVariantKeys": {
3258
- "size": [
3259
- "toastSizeLabel",
3260
- "toastSizeIcon",
3261
- "toastSizeActionButton",
3262
- "toastSizeCloseIcon"
3263
- ],
3264
- "variant": [
3265
- "toastVariantIcon",
3266
- "toastVariantActionButton",
3267
- "toastVariantCloseIcon"
3268
- ],
3269
- "closeIcon": [
3270
- "icon"
3271
- ],
3272
- "onClickActionButton": [
3273
- "onClick"
3274
- ]
3275
- },
3276
- "runtimeConfigDefaultProps": {
3277
- "size": "toast.defaultSize",
3278
- "variant": "toast.defaultVariant"
3279
- },
3280
- "runtimeConfigGetStyles": {
3281
- "toastSizeLabel": [
3282
- "toast.defaultSize"
3283
- ],
3284
- "toastVariantIcon": [
3285
- "toast.defaultVariant"
3286
- ],
3287
- "toastSizeIcon": [
3288
- "toast.defaultSize"
3289
- ],
3290
- "toastSizeActionButton": [
3291
- "toast.defaultSize"
3292
- ],
3293
- "toastVariantActionButton": [
3294
- "toast.defaultVariant"
3295
- ],
3296
- "toastVariantCloseIcon": [
3297
- "toast.defaultVariant"
3298
- ],
3299
- "toastSizeCloseIcon": [
3300
- "toast.defaultSize"
3301
- ]
3302
- },
3303
- "runtimeConfigInternalComponentProps": {
3304
- "ToastContainer": {
3224
+ "internalComponentProps": {
3225
+ "Icon": {
3305
3226
  "size": [
3306
- "toast.defaultSize"
3227
+ "sm"
3307
3228
  ],
3308
- "variant": [
3309
- "toast.defaultVariant"
3229
+ "color": [
3230
+ "current"
3231
+ ],
3232
+ "aria-hidden": [
3233
+ "true"
3234
+ ]
3235
+ },
3236
+ "HStack": {
3237
+ "spacing": [
3238
+ "1"
3239
+ ],
3240
+ "gap": [
3241
+ "1"
3242
+ ],
3243
+ "backgroundColor": [
3244
+ "secondary"
3245
+ ],
3246
+ "borderRadius": [
3247
+ "full"
3248
+ ],
3249
+ "display": [
3250
+ "inline-flex"
3310
3251
  ]
3311
3252
  },
3312
3253
  "Text": {
3313
- "variant": [
3314
- "toast.textVariant.${size}"
3315
- ],
3316
3254
  "color": [
3317
- "toast.textColor.${variant}"
3318
- ]
3319
- },
3320
- "Button": {
3321
- "size": [
3322
- "toast.buttonSize.${size}"
3323
- ],
3324
- "variant": [
3325
- "toast.buttonVariant.${variant}"
3255
+ "current"
3326
3256
  ]
3327
3257
  }
3328
3258
  },
3259
+ "propToVariantKeys": {
3260
+ "value": [
3261
+ "key"
3262
+ ],
3263
+ "label": [
3264
+ "aria-label"
3265
+ ],
3266
+ "textVariant": [
3267
+ "variant"
3268
+ ]
3269
+ },
3270
+ "runtimeConfigDefaultProps": {},
3271
+ "runtimeConfigGetStyles": {},
3272
+ "runtimeConfigInternalComponentProps": {},
3329
3273
  "motionVarPrefixes": []
3330
3274
  },
3331
- "ToastContainer": {
3332
- "name": "ToastContainer",
3333
- "defaultProps": {},
3275
+ "SwitchV2": {
3276
+ "name": "SwitchV2",
3277
+ "defaultProps": {
3278
+ "labelPosition": "start",
3279
+ "size": "md"
3280
+ },
3334
3281
  "getStylesLiterals": {
3335
- "position": "relative",
3336
- "alignItems": "center",
3337
- "display": "flex",
3338
- "className": "box-border touch-none z-0 w-full break-words mb-2 last:mb-0"
3282
+ "switchVariantRoot": "default",
3283
+ "switchVariantActiveRoot": "on",
3284
+ "switchVariantActiveRoot:1": "off",
3285
+ "switchVariantSwitch": "default",
3286
+ "switchVariantActiveSwitch": "on",
3287
+ "switchVariantActiveSwitch:1": "off",
3288
+ "switchVariantActiveHandle": "on",
3289
+ "switchVariantActiveHandle:1": "off",
3290
+ "switchVariantHandle": "default",
3291
+ "switchVariantHandleIcon": "default",
3292
+ "switchVariantActiveHandleIcon": "on",
3293
+ "switchVariantActiveHandleIcon:1": "off"
3339
3294
  },
3340
3295
  "cxLiterals": [
3341
- "w-full"
3296
+ "group",
3297
+ "flex",
3298
+ "items-center",
3299
+ "flex-row",
3300
+ "flex-row-reverse",
3301
+ "uds-ring",
3302
+ "uds-ring-within",
3303
+ "relative",
3304
+ "uds-border-radius-full",
3305
+ "transition-[background-color,box-shadow]",
3306
+ "pointer-events-none",
3307
+ "w-full",
3308
+ "h-full",
3309
+ "absolute",
3310
+ "top-0",
3311
+ "bottom-0",
3312
+ "right-0",
3313
+ "left-0",
3314
+ "overflow-hidden",
3315
+ "group-hover:scale-105",
3316
+ "opacity-95",
3317
+ "group-hover:opacity-100",
3318
+ "transition-[transform,opacity]",
3319
+ "opacity-0",
3320
+ "top-1/2",
3321
+ "left-1/2",
3322
+ "transform",
3323
+ "translate-x-[-50%]",
3324
+ "translate-y-[-50%]",
3325
+ "transition-opacity",
3326
+ "cursor-[inherit]",
3327
+ "w-[calc(100%+2px)]",
3328
+ "h-[calc(100%+2px)]",
3329
+ "text-start",
3330
+ "text-end",
3331
+ "opacity-100"
3342
3332
  ],
3343
3333
  "internalComponents": [
3344
- "HStack"
3334
+ "IconSlot",
3335
+ "Box",
3336
+ "FormLabel",
3337
+ "SpringMotionConfig",
3338
+ "RootElement",
3339
+ "MotionBox"
3345
3340
  ],
3346
3341
  "internalComponentProps": {
3347
- "HStack": {
3348
- "alignItems": [
3349
- "center"
3342
+ "IconSlot": {
3343
+ "data-testid": [
3344
+ "on-icon",
3345
+ "off-icon"
3346
+ ]
3347
+ },
3348
+ "FormLabel": {
3349
+ "as": [
3350
+ "div"
3350
3351
  ],
3351
- "justifyContent": [
3352
- "space-between"
3352
+ "variant": [
3353
+ "inherit"
3353
3354
  ],
3354
- "overflow": [
3355
- "hidden"
3355
+ "color": [
3356
+ "inherit"
3357
+ ]
3358
+ },
3359
+ "SpringMotionConfig": {
3360
+ "layoutVariant": [
3361
+ "bouncy"
3356
3362
  ],
3357
- "position": [
3358
- "relative"
3363
+ "layoutSpeed": [
3364
+ "4"
3365
+ ]
3366
+ },
3367
+ "RootElement": {
3368
+ "data-testid": [
3369
+ "switch-root"
3370
+ ]
3371
+ },
3372
+ "MotionBox": {
3373
+ "layout": [
3374
+ "position"
3359
3375
  ]
3360
3376
  }
3361
3377
  },
3362
3378
  "propToVariantKeys": {
3363
- "variant": [
3364
- "toastVariantRoot"
3365
- ],
3366
3379
  "size": [
3367
- "toastSizeRoot"
3368
- ]
3369
- },
3370
- "runtimeConfigDefaultProps": {
3371
- "size": "toast.defaultSize",
3372
- "variant": "toast.defaultVariant"
3373
- },
3374
- "runtimeConfigGetStyles": {
3375
- "toastVariantRoot": [
3376
- "toast.defaultVariant"
3380
+ "switchSizeRoot",
3381
+ "switchSizeSwitch",
3382
+ "switchSizeHandle",
3383
+ "switchSizeHandleIcon"
3377
3384
  ],
3378
- "toastSizeRoot": [
3379
- "toast.defaultSize"
3385
+ "onIcon": [
3386
+ "icon"
3387
+ ],
3388
+ "offIcon": [
3389
+ "icon"
3390
+ ],
3391
+ "reduceMotion": [
3392
+ "reducedMotion"
3393
+ ],
3394
+ "isOn": [
3395
+ "layoutDependency"
3380
3396
  ]
3381
3397
  },
3382
- "runtimeConfigInternalComponentProps": {
3383
- "HStack": {
3384
- "backgroundColor": [
3385
- "toast.backgroundColor.${variant}"
3386
- ]
3387
- }
3388
- },
3389
- "motionVarPrefixes": []
3390
- },
3391
- "ToastPortal": {
3392
- "name": "ToastPortal",
3393
- "defaultProps": {},
3394
- "getStylesLiterals": {},
3395
- "cxLiterals": [],
3396
- "internalComponents": [
3397
- "ReactToastifyToastContainer"
3398
- ],
3399
- "internalComponentProps": {},
3400
- "propToVariantKeys": {},
3401
- "runtimeConfigDefaultProps": {
3402
- "size": "toast.defaultSize",
3403
- "variant": "toast.defaultVariant"
3404
- },
3405
- "runtimeConfigGetStyles": {},
3406
- "runtimeConfigInternalComponentProps": {
3407
- "ReactToastifyToastContainer": {
3408
- "autoClose": [
3409
- "toast.autoClose"
3410
- ]
3411
- }
3412
- },
3413
- "motionVarPrefixes": []
3414
- },
3415
- "UDSToastConfigProvider": {
3416
- "name": "UDSToastConfigProvider",
3417
- "defaultProps": {},
3418
- "getStylesLiterals": {},
3419
- "cxLiterals": [],
3420
- "internalComponents": [
3421
- "ToastContext.Provider"
3422
- ],
3423
- "internalComponentProps": {},
3424
- "propToVariantKeys": {},
3425
3398
  "runtimeConfigDefaultProps": {},
3426
3399
  "runtimeConfigGetStyles": {},
3427
3400
  "runtimeConfigInternalComponentProps": {},
3428
- "motionVarPrefixes": []
3401
+ "motionVarPrefixes": [
3402
+ "--uds-motion-bouncy-4-",
3403
+ "--uds-motion-smooth-3-"
3404
+ ]
3429
3405
  },
3430
3406
  "Tooltip": {
3431
3407
  "name": "Tooltip",
@@ -3562,135 +3538,198 @@
3562
3538
  "runtimeConfigInternalComponentProps": {},
3563
3539
  "motionVarPrefixes": []
3564
3540
  },
3565
- "UDSBreakpointsConfigProvider": {
3566
- "name": "UDSBreakpointsConfigProvider",
3567
- "defaultProps": {},
3568
- "getStylesLiterals": {},
3569
- "cxLiterals": [],
3570
- "internalComponents": [
3571
- "UDSBreakpointsConfigContext.Provider"
3572
- ],
3573
- "internalComponentProps": {},
3574
- "propToVariantKeys": {},
3575
- "runtimeConfigDefaultProps": {},
3576
- "runtimeConfigGetStyles": {},
3577
- "runtimeConfigInternalComponentProps": {},
3578
- "motionVarPrefixes": []
3579
- },
3580
- "UDSConfigProvider": {
3581
- "name": "UDSConfigProvider",
3541
+ "Toast": {
3542
+ "name": "Toast",
3582
3543
  "defaultProps": {},
3583
- "getStylesLiterals": {},
3584
- "cxLiterals": [],
3585
- "internalComponents": [
3586
- "UDSBreakpointsConfigProvider",
3587
- "UDSBottomSheetConfigProvider",
3588
- "UDSToastConfigProvider",
3589
- "UDSTooltipConfigProvider",
3590
- "UDSPopoverConfigProvider",
3591
- "UDSModalConfigProvider"
3592
- ],
3593
- "internalComponentProps": {},
3594
- "propToVariantKeys": {},
3595
- "runtimeConfigDefaultProps": {},
3596
- "runtimeConfigGetStyles": {},
3597
- "runtimeConfigInternalComponentProps": {},
3598
- "motionVarPrefixes": []
3599
- },
3600
- "Accordion": {
3601
- "name": "Accordion",
3602
- "defaultProps": {
3603
- "spacingHorizontal": "4",
3604
- "spacingVertical": "4"
3544
+ "getStylesLiterals": {
3545
+ "className": "animate-spin",
3546
+ "className:1": "flex-none",
3547
+ "spacing": "2",
3548
+ "borderRadius": "full"
3605
3549
  },
3606
- "getStylesLiterals": {},
3607
3550
  "cxLiterals": [
3608
- "hover:bg-secondary/80",
3609
- "w-full"
3551
+ "duration-0",
3552
+ "duration-120",
3553
+ "transition-[background-color]",
3554
+ "bg-carbon-15/0",
3555
+ "hover:bg-carbon-15/10",
3556
+ "active:bg-carbon-15/15",
3557
+ "uds-ring"
3610
3558
  ],
3611
3559
  "internalComponents": [
3612
- "Icon",
3613
- "SpringMotionConfig",
3614
- "Pressable",
3560
+ "IconSlot",
3561
+ "ToastContainer",
3615
3562
  "Text",
3616
- "HStack",
3617
- "AnimatePresence",
3618
- "VStack"
3563
+ "Button",
3564
+ "Pressable"
3619
3565
  ],
3620
- "internalComponentProps": {
3621
- "Icon": {
3622
- "variant": [
3623
- "fill"
3624
- ],
3566
+ "internalComponentProps": {},
3567
+ "propToVariantKeys": {
3568
+ "size": [
3569
+ "toastSizeLabel",
3570
+ "toastSizeIcon",
3571
+ "toastSizeActionButton",
3572
+ "toastSizeCloseIcon"
3573
+ ],
3574
+ "variant": [
3575
+ "toastVariantIcon",
3576
+ "toastVariantActionButton",
3577
+ "toastVariantCloseIcon"
3578
+ ],
3579
+ "closeIcon": [
3580
+ "icon"
3581
+ ],
3582
+ "onClickActionButton": [
3583
+ "onClick"
3584
+ ]
3585
+ },
3586
+ "runtimeConfigDefaultProps": {
3587
+ "size": "toast.defaultSize",
3588
+ "variant": "toast.defaultVariant"
3589
+ },
3590
+ "runtimeConfigGetStyles": {
3591
+ "toastSizeLabel": [
3592
+ "toast.defaultSize"
3593
+ ],
3594
+ "toastVariantIcon": [
3595
+ "toast.defaultVariant"
3596
+ ],
3597
+ "toastSizeIcon": [
3598
+ "toast.defaultSize"
3599
+ ],
3600
+ "toastSizeActionButton": [
3601
+ "toast.defaultSize"
3602
+ ],
3603
+ "toastVariantActionButton": [
3604
+ "toast.defaultVariant"
3605
+ ],
3606
+ "toastVariantCloseIcon": [
3607
+ "toast.defaultVariant"
3608
+ ],
3609
+ "toastSizeCloseIcon": [
3610
+ "toast.defaultSize"
3611
+ ]
3612
+ },
3613
+ "runtimeConfigInternalComponentProps": {
3614
+ "ToastContainer": {
3625
3615
  "size": [
3626
- "sm"
3627
- ],
3628
- "color": [
3629
- "primary"
3630
- ]
3631
- },
3632
- "SpringMotionConfig": {
3633
- "layoutVariant": [
3634
- "smooth"
3635
- ],
3636
- "layoutSpeed": [
3637
- "3"
3638
- ]
3639
- },
3640
- "Pressable": {
3641
- "display": [
3642
- "flex"
3643
- ],
3644
- "flexDirection": [
3645
- "row"
3646
- ],
3647
- "alignItems": [
3648
- "center"
3649
- ],
3650
- "justifyContent": [
3651
- "space-between"
3616
+ "toast.defaultSize"
3652
3617
  ],
3653
- "borderRadius": [
3654
- "md"
3618
+ "variant": [
3619
+ "toast.defaultVariant"
3655
3620
  ]
3656
3621
  },
3657
3622
  "Text": {
3658
3623
  "variant": [
3659
- "title4"
3624
+ "toast.textVariant.${size}"
3660
3625
  ],
3661
3626
  "color": [
3662
- "primary"
3627
+ "toast.textColor.${variant}"
3663
3628
  ]
3664
3629
  },
3665
- "HStack": {
3666
- "display": [
3667
- "flex"
3630
+ "Button": {
3631
+ "size": [
3632
+ "toast.buttonSize.${size}"
3668
3633
  ],
3634
+ "variant": [
3635
+ "toast.buttonVariant.${variant}"
3636
+ ]
3637
+ }
3638
+ },
3639
+ "motionVarPrefixes": []
3640
+ },
3641
+ "ToastContainer": {
3642
+ "name": "ToastContainer",
3643
+ "defaultProps": {},
3644
+ "getStylesLiterals": {
3645
+ "position": "relative",
3646
+ "alignItems": "center",
3647
+ "display": "flex",
3648
+ "className": "box-border touch-none z-0 w-full break-words mb-2 last:mb-0"
3649
+ },
3650
+ "cxLiterals": [
3651
+ "w-full"
3652
+ ],
3653
+ "internalComponents": [
3654
+ "HStack"
3655
+ ],
3656
+ "internalComponentProps": {
3657
+ "HStack": {
3669
3658
  "alignItems": [
3670
3659
  "center"
3671
3660
  ],
3672
3661
  "justifyContent": [
3673
3662
  "space-between"
3674
3663
  ],
3675
- "columnGap": [
3676
- "2.5"
3664
+ "overflow": [
3665
+ "hidden"
3666
+ ],
3667
+ "position": [
3668
+ "relative"
3669
+ ]
3670
+ }
3671
+ },
3672
+ "propToVariantKeys": {
3673
+ "variant": [
3674
+ "toastVariantRoot"
3675
+ ],
3676
+ "size": [
3677
+ "toastSizeRoot"
3678
+ ]
3679
+ },
3680
+ "runtimeConfigDefaultProps": {
3681
+ "size": "toast.defaultSize",
3682
+ "variant": "toast.defaultVariant"
3683
+ },
3684
+ "runtimeConfigGetStyles": {
3685
+ "toastVariantRoot": [
3686
+ "toast.defaultVariant"
3687
+ ],
3688
+ "toastSizeRoot": [
3689
+ "toast.defaultSize"
3690
+ ]
3691
+ },
3692
+ "runtimeConfigInternalComponentProps": {
3693
+ "HStack": {
3694
+ "backgroundColor": [
3695
+ "toast.backgroundColor.${variant}"
3677
3696
  ]
3678
3697
  }
3679
3698
  },
3699
+ "motionVarPrefixes": []
3700
+ },
3701
+ "ToastPortal": {
3702
+ "name": "ToastPortal",
3703
+ "defaultProps": {},
3704
+ "getStylesLiterals": {},
3705
+ "cxLiterals": [],
3706
+ "internalComponents": [
3707
+ "ReactToastifyToastContainer"
3708
+ ],
3709
+ "internalComponentProps": {},
3680
3710
  "propToVariantKeys": {},
3681
- "runtimeConfigDefaultProps": {},
3711
+ "runtimeConfigDefaultProps": {
3712
+ "size": "toast.defaultSize",
3713
+ "variant": "toast.defaultVariant"
3714
+ },
3682
3715
  "runtimeConfigGetStyles": {},
3683
- "runtimeConfigInternalComponentProps": {},
3684
- "motionVarPrefixes": [
3685
- "--uds-motion-smooth-3-"
3686
- ]
3716
+ "runtimeConfigInternalComponentProps": {
3717
+ "ReactToastifyToastContainer": {
3718
+ "autoClose": [
3719
+ "toast.autoClose"
3720
+ ]
3721
+ }
3722
+ },
3723
+ "motionVarPrefixes": []
3687
3724
  },
3688
- "AvoidMotionLibraryProvider": {
3689
- "name": "AvoidMotionLibraryProvider",
3725
+ "UDSToastConfigProvider": {
3726
+ "name": "UDSToastConfigProvider",
3690
3727
  "defaultProps": {},
3691
3728
  "getStylesLiterals": {},
3692
3729
  "cxLiterals": [],
3693
- "internalComponents": [],
3730
+ "internalComponents": [
3731
+ "ToastContext.Provider"
3732
+ ],
3694
3733
  "internalComponentProps": {},
3695
3734
  "propToVariantKeys": {},
3696
3735
  "runtimeConfigDefaultProps": {},
@@ -3698,86 +3737,77 @@
3698
3737
  "runtimeConfigInternalComponentProps": {},
3699
3738
  "motionVarPrefixes": []
3700
3739
  },
3701
- "SegmentedControl": {
3702
- "name": "SegmentedControl",
3740
+ "Tab": {
3741
+ "name": "Tab",
3703
3742
  "defaultProps": {
3704
- "textVariant": "label2"
3743
+ "variant": "primary"
3705
3744
  },
3706
3745
  "getStylesLiterals": {
3707
- "display": "flex",
3708
- "alignItems": "center",
3709
- "backgroundColor": "primary",
3710
- "spacingVertical": "1",
3711
- "spacingHorizontal": "3",
3712
- "columnGap": "1.5",
3713
- "borderWidth": "thin",
3714
- "borderRadius": "full",
3715
- "borderColor": "muted",
3716
- "borderColor:1": "transparent",
3717
- "color": "primary",
3718
- "color:1": "tertiary",
3719
- "color:2": "muted"
3746
+ "tabSizeRoot": "default",
3747
+ "tabVariantActiveRoot": "off",
3748
+ "tabVariantActiveRoot:1": "on",
3749
+ "tabSizeIcon": "default"
3720
3750
  },
3721
3751
  "cxLiterals": [
3752
+ "pointer-events-none",
3753
+ "absolute",
3754
+ "bottom-0",
3755
+ "left-0",
3756
+ "right-0",
3757
+ "h-[var(--uds-tab-underline-width,0px)]",
3758
+ "bg-[var(--uds-tab-underline-color,transparent)]",
3759
+ "transition-[height,background-color]",
3760
+ "duration-[240ms]",
3761
+ "ease-[cubic-bezier(0.2,0,0,1)]",
3762
+ "!bg-transparent",
3763
+ "!shadow-none",
3764
+ "inline-flex",
3765
+ "items-center",
3766
+ "shrink-0",
3767
+ "box-border",
3768
+ "relative",
3769
+ "z-[1]",
3770
+ "cursor-pointer",
3771
+ "select-none",
3772
+ "whitespace-nowrap",
3722
3773
  "uds-ring",
3723
- "cursor-not-allowed",
3724
3774
  "opacity-50",
3725
- "pointer-events-none",
3726
- "hover:bg-primary"
3775
+ "cursor-default",
3776
+ "border-solid",
3777
+ "border-b-solid",
3778
+ "transition-colors"
3727
3779
  ],
3728
3780
  "internalComponents": [
3729
- "Radio",
3730
- "Icon",
3731
- "RadioProvider",
3732
- "HStack",
3733
- "RadioGroup",
3734
- "Pressable",
3781
+ "IconSlot",
3782
+ "AriakitTab",
3735
3783
  "Text"
3736
3784
  ],
3737
3785
  "internalComponentProps": {
3738
- "Icon": {
3739
- "size": [
3740
- "sm"
3741
- ],
3742
- "color": [
3743
- "current"
3744
- ],
3745
- "aria-hidden": [
3746
- "true"
3747
- ]
3748
- },
3749
- "HStack": {
3750
- "spacing": [
3751
- "1"
3752
- ],
3753
- "gap": [
3754
- "1"
3755
- ],
3756
- "backgroundColor": [
3757
- "secondary"
3786
+ "Text": {
3787
+ "variant": [
3788
+ "inherit"
3758
3789
  ],
3759
- "borderRadius": [
3760
- "full"
3790
+ "as": [
3791
+ "span"
3761
3792
  ],
3762
- "display": [
3763
- "inline-flex"
3764
- ]
3765
- },
3766
- "Text": {
3767
3793
  "color": [
3768
3794
  "current"
3769
3795
  ]
3770
3796
  }
3771
3797
  },
3772
3798
  "propToVariantKeys": {
3773
- "value": [
3774
- "key"
3799
+ "variant": [
3800
+ "tabVariantRoot",
3801
+ "tabVariantIcon"
3775
3802
  ],
3776
- "label": [
3777
- "aria-label"
3803
+ "activeState": [
3804
+ "tabVariantActiveIcon"
3778
3805
  ],
3779
- "textVariant": [
3780
- "variant"
3806
+ "startIcon": [
3807
+ "icon"
3808
+ ],
3809
+ "endIcon": [
3810
+ "icon"
3781
3811
  ]
3782
3812
  },
3783
3813
  "runtimeConfigDefaultProps": {},
@@ -3785,135 +3815,105 @@
3785
3815
  "runtimeConfigInternalComponentProps": {},
3786
3816
  "motionVarPrefixes": []
3787
3817
  },
3788
- "SwitchV2": {
3789
- "name": "SwitchV2",
3818
+ "TabList": {
3819
+ "name": "TabList",
3790
3820
  "defaultProps": {
3791
- "labelPosition": "start",
3792
- "size": "md"
3821
+ "variant": "primary"
3793
3822
  },
3794
3823
  "getStylesLiterals": {
3795
- "switchVariantRoot": "default",
3796
- "switchVariantActiveRoot": "on",
3797
- "switchVariantActiveRoot:1": "off",
3798
- "switchVariantSwitch": "default",
3799
- "switchVariantActiveSwitch": "on",
3800
- "switchVariantActiveSwitch:1": "off",
3801
- "switchVariantActiveHandle": "on",
3802
- "switchVariantActiveHandle:1": "off",
3803
- "switchVariantHandle": "default",
3804
- "switchVariantHandleIcon": "default",
3805
- "switchVariantActiveHandleIcon": "on",
3806
- "switchVariantActiveHandleIcon:1": "off"
3824
+ "tabSizeRoot": "default",
3825
+ "tabVariantActiveRoot": "on"
3807
3826
  },
3808
3827
  "cxLiterals": [
3809
- "group",
3810
- "flex",
3811
- "items-center",
3812
- "flex-row",
3813
- "flex-row-reverse",
3814
- "uds-ring",
3815
- "uds-ring-within",
3816
- "relative",
3817
- "uds-border-radius-full",
3818
- "transition-[background-color,box-shadow]",
3819
3828
  "pointer-events-none",
3820
- "w-full",
3821
- "h-full",
3822
3829
  "absolute",
3823
- "top-0",
3824
3830
  "bottom-0",
3825
- "right-0",
3826
3831
  "left-0",
3827
- "overflow-hidden",
3828
- "group-hover:scale-105",
3829
- "opacity-95",
3830
- "group-hover:opacity-100",
3831
- "transition-[transform,opacity]",
3832
- "opacity-0",
3833
- "top-1/2",
3834
- "left-1/2",
3835
- "transform",
3836
- "translate-x-[-50%]",
3837
- "translate-y-[-50%]",
3838
- "transition-opacity",
3839
- "cursor-[inherit]",
3840
- "w-[calc(100%+2px)]",
3841
- "h-[calc(100%+2px)]",
3842
- "text-start",
3843
- "text-end",
3844
- "opacity-100"
3832
+ "right-0",
3833
+ "h-[var(--uds-tab-underline-width,0px)]",
3834
+ "bg-[var(--uds-tab-underline-color,transparent)]",
3835
+ "transition-[height,background-color]",
3836
+ "duration-[240ms]",
3837
+ "ease-[cubic-bezier(0.2,0,0,1)]",
3838
+ "!m-0",
3839
+ "!p-0",
3840
+ "!gap-0",
3841
+ "box-border",
3842
+ "z-0",
3843
+ "min-w-0",
3844
+ "min-h-0",
3845
+ "flex",
3846
+ "flex-row",
3847
+ "items-center",
3848
+ "overflow-x-auto",
3849
+ "overflow-y-clip",
3850
+ "scrollbar-none",
3851
+ "[overflow-clip-margin:6px]",
3852
+ "overflow-clip",
3853
+ "[overflow-clip-margin:8px]",
3854
+ "relative",
3855
+ "left",
3856
+ "240ms",
3857
+ "cubic-bezier(0.2,",
3858
+ "0,",
3859
+ "1),",
3860
+ "top",
3861
+ "width",
3862
+ "height",
3863
+ "1)",
3864
+ "--uds-tab-underline-color",
3865
+ "--uds-tab-underline-width"
3845
3866
  ],
3846
3867
  "internalComponents": [
3847
- "IconSlot",
3848
- "Box",
3849
- "FormLabel",
3850
- "SpringMotionConfig",
3851
- "RootElement",
3852
- "MotionBox"
3868
+ "AriakitTabList"
3853
3869
  ],
3854
- "internalComponentProps": {
3855
- "IconSlot": {
3856
- "data-testid": [
3857
- "on-icon",
3858
- "off-icon"
3859
- ]
3860
- },
3861
- "FormLabel": {
3862
- "as": [
3863
- "div"
3864
- ],
3865
- "variant": [
3866
- "inherit"
3867
- ],
3868
- "color": [
3869
- "inherit"
3870
- ]
3871
- },
3872
- "SpringMotionConfig": {
3873
- "layoutVariant": [
3874
- "bouncy"
3875
- ],
3876
- "layoutSpeed": [
3877
- "4"
3878
- ]
3879
- },
3880
- "RootElement": {
3881
- "data-testid": [
3882
- "switch-root"
3883
- ]
3884
- },
3885
- "MotionBox": {
3886
- "layout": [
3887
- "position"
3888
- ]
3889
- }
3870
+ "internalComponentProps": {},
3871
+ "propToVariantKeys": {
3872
+ "variant": [
3873
+ "tabsVariantRoot",
3874
+ "tabVariantRoot"
3875
+ ]
3876
+ },
3877
+ "runtimeConfigDefaultProps": {},
3878
+ "runtimeConfigGetStyles": {},
3879
+ "runtimeConfigInternalComponentProps": {},
3880
+ "motionVarPrefixes": []
3881
+ },
3882
+ "TabPanel": {
3883
+ "name": "TabPanel",
3884
+ "defaultProps": {},
3885
+ "getStylesLiterals": {},
3886
+ "cxLiterals": [],
3887
+ "internalComponents": [
3888
+ "AriakitTabPanel"
3889
+ ],
3890
+ "internalComponentProps": {},
3891
+ "propToVariantKeys": {},
3892
+ "runtimeConfigDefaultProps": {},
3893
+ "runtimeConfigGetStyles": {},
3894
+ "runtimeConfigInternalComponentProps": {},
3895
+ "motionVarPrefixes": []
3896
+ },
3897
+ "Tabs": {
3898
+ "name": "Tabs",
3899
+ "defaultProps": {
3900
+ "variant": "primary"
3890
3901
  },
3902
+ "getStylesLiterals": {},
3903
+ "cxLiterals": [],
3904
+ "internalComponents": [
3905
+ "TabsContext.Provider",
3906
+ "TabProvider"
3907
+ ],
3908
+ "internalComponentProps": {},
3891
3909
  "propToVariantKeys": {
3892
- "size": [
3893
- "switchSizeRoot",
3894
- "switchSizeSwitch",
3895
- "switchSizeHandle",
3896
- "switchSizeHandleIcon"
3897
- ],
3898
- "onIcon": [
3899
- "icon"
3900
- ],
3901
- "offIcon": [
3902
- "icon"
3903
- ],
3904
- "reduceMotion": [
3905
- "reducedMotion"
3906
- ],
3907
- "isOn": [
3908
- "layoutDependency"
3910
+ "onSelectionChange": [
3911
+ "setSelectedId"
3909
3912
  ]
3910
3913
  },
3911
3914
  "runtimeConfigDefaultProps": {},
3912
3915
  "runtimeConfigGetStyles": {},
3913
3916
  "runtimeConfigInternalComponentProps": {},
3914
- "motionVarPrefixes": [
3915
- "--uds-motion-bouncy-4-",
3916
- "--uds-motion-smooth-3-"
3917
- ]
3917
+ "motionVarPrefixes": []
3918
3918
  }
3919
3919
  }