@yahoo/uds 3.37.0 → 3.39.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@yahoo/uds",
   "description": "Yahoo Universal System",
-  "version": "3.37.0",
+  "version": "3.39.0",
   "type": "module",
   "bin": {
     "uds": "./cli/uds-cli.js"

package/cli/FullWidthClassToProp.mock.tsx

@@ -1,17 +0,0 @@
-import { Box, Button, HStack } from '@yahoo/uds';
-import { VStack } from 'another-package';
-
-export const PageA = () => {
-  return (
-    <HStack height="screen" width="full" className="max-h-screen">
-      <Button width="full">Click me</Button>
-      <Box width="full">Click me</Button>
-      <Box className="dont_touch_me">Box</Box>
-    </HStack>
-    <Box>Empty</Box>
-    <div className="w-full h-full">shouldn't be touched</div>
-    <VStack className="w-full">shouldn't be touched</VStack>
-    <Box height="full" width="full" className="foo bar">Box</Box>
-    <Box height="full">Box</Box>
-  );
-}

package/dist/Input-C267CIVV.d.cts

@@ -1,54 +0,0 @@
-import * as react from 'react';
-import { InputHTMLAttributes } from 'react';
-import { U as UniversalInputProps, I as IconPropsWithSVGProps } from './types-D0Rkj_1F.cjs';
-import { HTMLMotionProps } from 'motion/react';
-import { B as BoxProps } from './Box-BM08iUR2.cjs';
-
-type HtmlInputProps = React.InputHTMLAttributes<HTMLInputElement> & HTMLMotionProps<'input'>;
-type NativeInputProps = Omit<HtmlInputProps, 'height' | 'size' | 'width' | 'color' | 'required'>;
-type DataAttributes = {
-    [name: `data-${string}`]: string;
-};
-interface InputProps extends NativeInputProps, UniversalInputProps {
-    /** The type of the input element. Reduced set of options from the HTML input type attribute.
-     * @default 'text'
-     */
-    type?: Exclude<NativeInputProps['type'], 'button' | 'checkbox' | 'color' | 'file' | 'radio' | 'range' | 'reset' | 'submit' | 'search'>;
-    /** Props to be passed into various slots within the component. */
-    slotProps?: {
-        input?: Partial<InputHTMLAttributes<HTMLInputElement> & DataAttributes>;
-        inputWrapper?: Partial<BoxProps & DataAttributes>;
-        startIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
-        endIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
-    };
-}
-/**
- * **📦 An input that allows users to enter text and collect data.**
- *
- * @componentType Client component
- *
- * @description
- * An input field is a component that takes text typed into it. It can also serve as a way to display a selection and trigger a dropdown menu. Inputs are interactive elements that users can click, tap, or otherwise engage with to collect data and open dropdowns, or both.
- *
- * @see
- * Check out the {@link https://uds.build/docs/components/input Input Docs} for more info
- *
- * @usage
- * - Forms: For collecting data like names, emails, passwords, etc. (e.g., sign-up, login, or contact forms).
- * - Search Bars: Allowing users to enter search queries to find content.
- * - Filters/Settings: When users need to specify preferences, like selecting a date or adjusting a number value.
- * - Feedback/Comments: Letting users leave reviews, comments, or feedback.
- *
- * @example
- * ```tsx
- * 'use client';
- * import { Input } from "@yahoo/uds";
- *
- * <Input label="Name" placeholder="Enter your name" required />
- *```
- *
- * @related [Checkbox](https://uds.build/docs/components/checkbox), [Radio](https://uds.build/docs/components/radio).
- **/
-declare const Input: react.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
-
-export { type InputProps as I, Input as a };

package/dist/Input-CF4Kpe9f.d.ts

@@ -1,54 +0,0 @@
-import * as react from 'react';
-import { InputHTMLAttributes } from 'react';
-import { U as UniversalInputProps, I as IconPropsWithSVGProps } from './types-D0Rkj_1F.js';
-import { HTMLMotionProps } from 'motion/react';
-import { B as BoxProps } from './Box-D2_1_jHu.js';
-
-type HtmlInputProps = React.InputHTMLAttributes<HTMLInputElement> & HTMLMotionProps<'input'>;
-type NativeInputProps = Omit<HtmlInputProps, 'height' | 'size' | 'width' | 'color' | 'required'>;
-type DataAttributes = {
-    [name: `data-${string}`]: string;
-};
-interface InputProps extends NativeInputProps, UniversalInputProps {
-    /** The type of the input element. Reduced set of options from the HTML input type attribute.
-     * @default 'text'
-     */
-    type?: Exclude<NativeInputProps['type'], 'button' | 'checkbox' | 'color' | 'file' | 'radio' | 'range' | 'reset' | 'submit' | 'search'>;
-    /** Props to be passed into various slots within the component. */
-    slotProps?: {
-        input?: Partial<InputHTMLAttributes<HTMLInputElement> & DataAttributes>;
-        inputWrapper?: Partial<BoxProps & DataAttributes>;
-        startIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
-        endIcon?: Partial<IconPropsWithSVGProps & DataAttributes>;
-    };
-}
-/**
- * **📦 An input that allows users to enter text and collect data.**
- *
- * @componentType Client component
- *
- * @description
- * An input field is a component that takes text typed into it. It can also serve as a way to display a selection and trigger a dropdown menu. Inputs are interactive elements that users can click, tap, or otherwise engage with to collect data and open dropdowns, or both.
- *
- * @see
- * Check out the {@link https://uds.build/docs/components/input Input Docs} for more info
- *
- * @usage
- * - Forms: For collecting data like names, emails, passwords, etc. (e.g., sign-up, login, or contact forms).
- * - Search Bars: Allowing users to enter search queries to find content.
- * - Filters/Settings: When users need to specify preferences, like selecting a date or adjusting a number value.
- * - Feedback/Comments: Letting users leave reviews, comments, or feedback.
- *
- * @example
- * ```tsx
- * 'use client';
- * import { Input } from "@yahoo/uds";
- *
- * <Input label="Name" placeholder="Enter your name" required />
- *```
- *
- * @related [Checkbox](https://uds.build/docs/components/checkbox), [Radio](https://uds.build/docs/components/radio).
- **/
-declare const Input: react.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
-
-export { type InputProps as I, Input as a };

package/dist/chunk-JM4WTJDB.cjs

@@ -1,3 +0,0 @@
-"use strict";var o=require("./chunk-GJLQAO4M.cjs"),r=require("./chunk-QLXJH36U.cjs"),e=require("@yahoo/uds/fixtures"),t=require("@yahoo/uds/flags"),n=require("clsx"),i=require("imurmurhash"),a=require("tailwind-merge"),s=require("react"),l=require("react/jsx-runtime");function d(o){return o&&o.__esModule?o:{default:o}}var c=d(n),f=d(i);/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
-function p(o){return"boolean"==typeof o?`${o}`:0===o?"0":o}function u(o){const r=Object.create(null),e=Object.keys(o);for(let t=0,n=e.length;t<n;t++){const n=e[t];void 0!==o[n]&&(r[n]=o[n])}return r}var b=a.extendTailwindMerge({extend:{theme:{borderColor:e.lineColors,borderWidth:e.borderWidths,borderRadius:e.borderRadii}},override:{classGroups:{"text-color":[{text:[...e.foregroundColors,...e.spectrumColors]}],"bg-color":[{bg:e.backgroundColors}],"font-family":[{font:["icons",...e.textVariants]}],leading:[{leading:e.textVariants}]},conflictingClassGroups:{}}}),h=(...o)=>{const r=c.default(o);return b(r)},m=o=>r=>{if(!o?.variants)return h(o?.base,r?.className);const{variants:e,defaultVariants:t}=o,n=Object.keys(e).map(o=>{const n=r?.[o],i=t?.[o],a=p(n)||p(i);return e[o][a]}),i={...t,...r&&u(r)},a=o?.compoundVariants?.reduce((o,{className:r,...e})=>Object.entries(e).every(([o,r])=>i[o]===r)?h(o,r):o,"");return h(o?.base,n,a,r?.className)},g=m({variants:o.variants}),x=new Map,S=o=>{const{useGetStylesCache:r}=t.getFeatureFlags();if(r){const r=function(o){const r=Object.create(null),e=Object.keys(o).sort();for(let t=0,n=e.length;t<n;t++){const n=e[t];r[n]=o[n]}return r}(u(o)),e=(new f.default).hash(JSON.stringify(r)).result();if(x.has(e))return x.get(e);const t=g(r);return x.set(e,t),t}return g(o)};function C(...o){return r=>o.forEach(o=>function(o,r){"function"==typeof o?o(r):null!=o&&(o.current=r)}(o,r))}function w(){const o=s.forwardRef((o,e)=>{const{children:n,...i}=o,a=s.Children.toArray(n),d=a.find(t);if(d){const o=d.props.children,t=a.map(r=>r===d?s.Children.count(o)>1?s.Children.only(null):s.isValidElement(o)?o.props.children:null:r);return l.jsx(r,{...i,ref:e,children:s.isValidElement(o)?s.cloneElement(o,void 0,t):null})}return l.jsx(r,{...i,ref:e,children:n})});o.displayName="Slot";const r=s.forwardRef((o,r)=>{const{children:e,...t}=o;return s.isValidElement(e)?s.cloneElement(e,{...n(t,e.props),ref:r?C(r,e.ref):e.ref}):s.Children.count(e)>1?s.Children.only(null):null});r.displayName="SlotClone";const e=({children:o})=>o;function t(o){return s.isValidElement(o)&&o.type===e}function n(o,r){const e={...r};for(const t in r){const n=o[t],i=r[t];/^on[A-Z]/.test(t)?n&&i?e[t]=(...o)=>{i(...o),n(...o)}:n&&(e[t]=n):"style"===t&&(e[t]={...n,...i})}return{...o,...e}}return o}var y=w(),v=s.forwardRef(function({asChild:o,as:r="div",className:e,backgroundColor:t,borderRadius:n,borderTopStartRadius:i,borderTopEndRadius:a,borderBottomStartRadius:s,borderBottomEndRadius:d,borderColor:c,borderStartColor:f,borderEndColor:p,borderTopColor:u,borderBottomColor:b,borderWidth:h,borderVerticalWidth:m,borderHorizontalWidth:g,borderStartWidth:x,borderEndWidth:C,borderTopWidth:w,borderBottomWidth:v,alignContent:E,alignItems:W,alignSelf:B,flex:T,flexDirection:R,flexGrow:N,flexShrink:V,flexWrap:j,justifyContent:z,flexBasis:G,display:H="flex",overflow:k,overflowX:q,overflowY:I,position:O,spacing:_,spacingHorizontal:A,spacingVertical:F,spacingBottom:M,spacingEnd:X,spacingStart:D,spacingTop:Y,offset:J,offsetVertical:$,offsetHorizontal:L,offsetBottom:Q,offsetEnd:P,offsetStart:U,offsetTop:Z,columnGap:K,rowGap:oo,width:ro,height:eo,dropShadow:to,insetShadow:no,...io},ao){const so=S({backgroundColor:t,borderRadius:n,borderTopStartRadius:i,borderTopEndRadius:a,borderBottomStartRadius:s,borderBottomEndRadius:d,borderColor:c,borderStartColor:f,borderEndColor:p,borderTopColor:u,borderBottomColor:b,borderWidth:h,borderVerticalWidth:m,borderHorizontalWidth:g,borderStartWidth:x,borderEndWidth:C,borderTopWidth:w,borderBottomWidth:v,alignContent:E,alignItems:W,alignSelf:B,flex:T,flexDirection:R,flexGrow:N,flexShrink:V,flexWrap:j,justifyContent:z,flexBasis:G,display:H,overflow:k,overflowX:q,overflowY:I,position:O,spacing:_,spacingHorizontal:A,spacingVertical:F,spacingBottom:M,spacingEnd:X,spacingStart:D,spacingTop:Y,offset:J,offsetVertical:$,offsetHorizontal:L,offsetBottom:Q,offsetEnd:P,offsetStart:U,offsetTop:Z,columnGap:K,rowGap:oo,width:ro,height:eo,dropShadow:to,insetShadow:no,className:e}),lo=o?y:r;return l.jsx(lo,{className:so,ref:ao,...io})});v.displayName="Box";var E=w(),W={display1:"h1",display2:"h1",display3:"h1",title1:"h1",title2:"h2",title3:"h3",title4:"h4",headline1:"h5",body1:"p",label1:"p",label2:"p",label3:"p",label4:"p",caption1:"p",caption2:"p",legal1:"p",ui1:"span",ui2:"span",ui3:"span",ui4:"span",ui5:"span",ui6:"span",inherit:"p"},B=s.forwardRef(function({className:o,asChild:r,color:e="primary",variant:t="body1",as:n=W[t],fontFamily:i,fontSize:a,fontWeight:s,lineHeight:d,textTransform:c,textAlign:f,backgroundColor:p,borderRadius:u,borderTopStartRadius:b,borderTopEndRadius:h,borderBottomStartRadius:m,borderBottomEndRadius:g,borderColor:x,borderStartColor:C,borderEndColor:w,borderTopColor:y,borderBottomColor:v,borderWidth:B,borderVerticalWidth:T,borderHorizontalWidth:R,borderStartWidth:N,borderEndWidth:V,borderTopWidth:j,borderBottomWidth:z,alignContent:G,alignItems:H,alignSelf:k,flex:q,flexDirection:I,flexGrow:O,flexShrink:_,flexWrap:A,justifyContent:F,flexBasis:M,display:X,overflow:D,overflowX:Y,overflowY:J,position:$,spacing:L,spacingHorizontal:Q,spacingVertical:P,spacingBottom:U,spacingEnd:Z,spacingStart:K,spacingTop:oo,offset:ro,offsetVertical:eo,offsetHorizontal:to,offsetBottom:no,offsetEnd:io,offsetStart:ao,offsetTop:so,columnGap:lo,rowGap:co,...fo},po){const uo={...e&&"inherit"!==e?{color:e}:{},...t&&"inherit"!==t?{fontFamily:i??t,fontSize:a??t,fontWeight:s??t,lineHeight:d??t,textTransform:c??t}:{},textAlign:f},bo=S({className:o,...uo,backgroundColor:p,borderRadius:u,borderTopStartRadius:b,borderTopEndRadius:h,borderBottomStartRadius:m,borderBottomEndRadius:g,borderColor:x,borderStartColor:C,borderEndColor:w,borderTopColor:y,borderBottomColor:v,borderWidth:B,borderVerticalWidth:T,borderHorizontalWidth:R,borderStartWidth:N,borderEndWidth:V,borderTopWidth:j,borderBottomWidth:z,alignContent:G,alignItems:H,alignSelf:k,flex:q,flexDirection:I,flexGrow:O,flexShrink:_,flexWrap:A,justifyContent:F,flexBasis:M,display:X,overflow:D,overflowX:Y,overflowY:J,position:$,spacing:L,spacingHorizontal:Q,spacingVertical:P,spacingBottom:U,spacingEnd:Z,spacingStart:K,spacingTop:oo,offset:ro,offsetVertical:eo,offsetHorizontal:to,offsetBottom:no,offsetEnd:io,offsetStart:ao,offsetTop:so,columnGap:lo,rowGap:co}),ho=r?E:n;return l.jsx(ho,{className:bo,ref:po,...fo})});B.displayName="Text";var T={xs:12,sm:16,md:24,lg:32},R=s.forwardRef(function({name:o,size:r="md",variant:e="outline",color:t="primary",className:n,...i},a){const s=o.metadata?.variants??[],d=s.includes(e)?e:s[0]??"fill",c="multicolor"===d,f=S({flex:"none",color:c?void 0:t,className:h(n,!c&&"[&_path]:fill-current")}),p=T[r];return l.jsx("svg",{ref:a,xmlns:"http://www.w3.org/2000/svg",width:p,height:p,viewBox:`0 0 ${p} ${p}`,"aria-hidden":"true",focusable:"false",className:f,...i,children:l.jsx(o,{size:r,variant:d})})});R.displayName="Icon";var N=r.__toESM(o.require_isFunction(),1),V=s.memo(function({icon:o,iconProps:r,className:e,...t}){if(!o)return null;const{className:n,...i}=r||{},a=h(e,n),d=o;if(d.metadata?.isSvgIcon)return l.jsx(R,{name:d,...i,...t,className:a});if((0,N.default)(o)){const e=o(r||{}),n=e?.props.className;return s.isValidElement(e)&&s.cloneElement(e,{...t,className:h(a,n)})}return s.isValidElement(o)&&s.cloneElement(o,{...i,...o.props,...t,className:h(a,o.props.className)})});V.displayName="IconSlot",
-/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */exports.Box=v,exports.Icon=R,exports.IconSlot=V,exports.Text=B,exports.createSlot=w,exports.cva=m,exports.cx=h,exports.getStyles=S;

package/dist/{Box-DLjI-1wX.d.ts → Text-Buzrh-6W.d.cts}

@@ -253,6 +253,10 @@ interface UniversalSwitchProps {
     labelPosition?: 'start' | 'end';
 }
 
+type DivProps = React.HTMLAttributes<HTMLDivElement>;
+interface BoxProps extends UniversalBoxProps, DivProps {
+}
+
 type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li' | 'sup';
 type ColorWithInherit = Exclude<UniversalTextProps['color'], undefined> | 'inherit';
 type VariantWithInherit = Exclude<UniversalTextProps['variant'], undefined> | 'inherit';
@@ -265,8 +269,4 @@ type TextProps<TagName extends TextElementTagName = TextElementTagName> = {
     color?: ColorWithInherit;
 } & JSX.IntrinsicElements[TagName] & Omit<UniversalTextProps, 'variant' | 'color'>;
 
-type DivProps = React.HTMLAttributes<HTMLDivElement>;
-interface BoxProps extends UniversalBoxProps, DivProps {
-}
-
 export type { BoxProps as B, DivProps as D, IconPropsWithSVGProps as I, TextProps as T, UniversalTextProps as U, UniversalStackProps as a, UniversalSwitchProps as b };

package/dist/{Box-DLjI-1wX.d.cts → Text-Buzrh-6W.d.ts}

@@ -253,6 +253,10 @@ interface UniversalSwitchProps {
     labelPosition?: 'start' | 'end';
 }
 
+type DivProps = React.HTMLAttributes<HTMLDivElement>;
+interface BoxProps extends UniversalBoxProps, DivProps {
+}
+
 type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li' | 'sup';
 type ColorWithInherit = Exclude<UniversalTextProps['color'], undefined> | 'inherit';
 type VariantWithInherit = Exclude<UniversalTextProps['variant'], undefined> | 'inherit';
@@ -265,8 +269,4 @@ type TextProps<TagName extends TextElementTagName = TextElementTagName> = {
     color?: ColorWithInherit;
 } & JSX.IntrinsicElements[TagName] & Omit<UniversalTextProps, 'variant' | 'color'>;
 
-type DivProps = React.HTMLAttributes<HTMLDivElement>;
-interface BoxProps extends UniversalBoxProps, DivProps {
-}
-
 export type { BoxProps as B, DivProps as D, IconPropsWithSVGProps as I, TextProps as T, UniversalTextProps as U, UniversalStackProps as a, UniversalSwitchProps as b };