@yahoo/uds 1.7.1 → 1.7.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.
@@ -5,7 +5,7 @@ import react__default from 'react';
5
5
  import * as react_jsx_runtime from 'react/jsx-runtime';
6
6
  import '@yahoo/uds-icons/types';
7
7
 
8
- type HtmlButtonProps$1 = Omit<react__default.ButtonHTMLAttributes<HTMLButtonElement>, 'color' | 'name'> & Omit<HTMLMotionProps<'button'>, 'color' | 'name'>;
8
+ type HtmlButtonProps$1 = Omit<HTMLMotionProps<'button'>, 'color' | 'name'> & Omit<react__default.ButtonHTMLAttributes<HTMLButtonElement>, 'color'>;
9
9
  interface ButtonProps extends HtmlButtonProps$1, UniversalButtonProps {
10
10
  }
11
11
  /**
@@ -5,7 +5,7 @@ import react__default from 'react';
5
5
  import * as react_jsx_runtime from 'react/jsx-runtime';
6
6
  import '@yahoo/uds-icons/types';
7
7
 
8
- type HtmlButtonProps$1 = Omit<react__default.ButtonHTMLAttributes<HTMLButtonElement>, 'color' | 'name'> & Omit<HTMLMotionProps<'button'>, 'color' | 'name'>;
8
+ type HtmlButtonProps$1 = Omit<HTMLMotionProps<'button'>, 'color' | 'name'> & Omit<react__default.ButtonHTMLAttributes<HTMLButtonElement>, 'color'>;
9
9
  interface ButtonProps extends HtmlButtonProps$1, UniversalButtonProps {
10
10
  }
11
11
  /**
@@ -1,7 +1,7 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import { SvgIcon, IconSize, IconVariant } from '@yahoo/uds-icons/types';
3
- import * as React$1 from 'react';
4
- import React__default, { PropsWithChildren, Ref, FC, TableHTMLAttributes, TdHTMLAttributes } from 'react';
3
+ import * as react from 'react';
4
+ import react__default, { PropsWithChildren, Ref, FC, TableHTMLAttributes, TdHTMLAttributes } from 'react';
5
5
  import * as _ariakit_react from '@ariakit/react';
6
6
  import { PopoverProviderProps, PopoverProps as PopoverProps$1, DialogProps, useDialogStore, DialogStore, DialogDismiss, PopoverArrow as PopoverArrow$1, PopoverAnchor as PopoverAnchor$1, PopoverDescription as PopoverDescription$1, PopoverDismiss as PopoverDismiss$1, PopoverProvider as PopoverProvider$1, PopoverDisclosure as PopoverDisclosure$1, PopoverDisclosureArrow as PopoverDisclosureArrow$1, TabProviderProps, TabListProps, TabPanelProps } from '@ariakit/react';
7
7
  export { DialogStore as ModalStore, TabListProps, TabPanelProps, TabProviderProps as TabsProps, usePopoverStore } from '@ariakit/react';
@@ -244,12 +244,12 @@ interface PressableProps extends UniversalPressableProps, HtmlButtonProps {
244
244
  }
245
245
 
246
246
  type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li';
247
- type TextProps = UniversalTextProps & {
247
+ type TextProps<TagName extends TextElementTagName = TextElementTagName> = {
248
248
  /** Ref passed to the inner container. */
249
249
  ref?: Ref<HTMLElement>;
250
250
  /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
251
- as?: TextElementTagName;
252
- } & Omit<JSX.IntrinsicElements[TextElementTagName], 'color'>;
251
+ as?: TagName;
252
+ } & JSX.IntrinsicElements[TagName] & UniversalTextProps;
253
253
 
254
254
  type DivProps = React.HTMLAttributes<HTMLDivElement>;
255
255
  interface BoxProps extends UniversalBoxProps, DivProps {
@@ -266,7 +266,7 @@ interface AccordionProps extends PressableProps {
266
266
  }
267
267
  declare function Accordion({ label, children, onClick, open, spacingHorizontal, _content, className, textProps, ...props }: AccordionProps): react_jsx_runtime.JSX.Element;
268
268
 
269
- type NativeImageProps = Omit<React__default.ImgHTMLAttributes<HTMLImageElement>, 'size' | 'color' | 'height' | 'width' | 'alt' | 'src'>;
269
+ type NativeImageProps = Omit<react__default.ImgHTMLAttributes<HTMLImageElement>, 'size' | 'color' | 'height' | 'width' | 'alt' | 'src'>;
270
270
  interface AvatarProps extends NativeImageProps, UniversalAvatarProps {
271
271
  }
272
272
  /**
@@ -303,7 +303,7 @@ declare const Dropdown: typeof _ariakit_react.PopoverProvider;
303
303
  interface DropdownItemPressableProps extends Omit<PressableProps, 'onClick'> {
304
304
  onClick?: (close: () => void) => void;
305
305
  }
306
- declare const DropdownItemPressable: React$1.ForwardRefExoticComponent<DropdownItemPressableProps & React$1.RefAttributes<HTMLButtonElement>>;
306
+ declare const DropdownItemPressable: react.ForwardRefExoticComponent<DropdownItemPressableProps & react.RefAttributes<HTMLButtonElement>>;
307
307
 
308
308
  interface DropdownItemProps extends DropdownItemPressableProps {
309
309
  startIcon?: IconProps['name'];
@@ -318,7 +318,7 @@ declare function DropdownItem({ title, description, _title, _description, startI
318
318
  interface DropdownItemsProps extends React.PropsWithChildren, Omit<PopoverProps$1, 'children'> {
319
319
  overflow?: Overflow;
320
320
  }
321
- declare const DropdownItems: React$1.ForwardRefExoticComponent<Omit<DropdownItemsProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
321
+ declare const DropdownItems: react.ForwardRefExoticComponent<Omit<DropdownItemsProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
322
322
 
323
323
  type DropdownTriggerProps = ButtonProps;
324
324
  declare function DropdownTrigger({ children, ...props }: DropdownTriggerProps): react_jsx_runtime.JSX.Element;
@@ -333,8 +333,8 @@ declare function Modal({ className, ...props }: ModalProps): react_jsx_runtime.J
333
333
  declare const ModalDismiss: typeof DialogDismiss;
334
334
 
335
335
  interface PopoverHeadingProps extends PropsWithChildren {
336
- leading?: React__default.ReactNode;
337
- trailing?: React__default.ReactNode;
336
+ leading?: react__default.ReactNode;
337
+ trailing?: react__default.ReactNode;
338
338
  }
339
339
  declare function PopoverHeading({ children, leading, trailing }: PopoverHeadingProps): react_jsx_runtime.JSX.Element;
340
340
  type PopoverProps = Omit<PopoverProps$1, 'key'>;
@@ -357,7 +357,7 @@ declare function Spinner({ className, ...props }: SpinnerProps): react_jsx_runti
357
357
  type TableColumn<T> = {
358
358
  title?: string;
359
359
  dataIndex: keyof T;
360
- render?: (value: T[keyof T], record: T, index: number) => React__default.ReactNode;
360
+ render?: (value: T[keyof T], record: T, index: number) => react__default.ReactNode;
361
361
  };
362
362
  type TableRootProps = TableHTMLAttributes<HTMLTableElement> & BoxProps & {
363
363
  /** Sets whether an element is treated as a block or inline box and the
@@ -396,27 +396,27 @@ type TableProps<T> = {
396
396
  */
397
397
  declare function Table<T>({ data, columns, ...props }: TableProps<T>): react_jsx_runtime.JSX.Element;
398
398
  declare namespace Table {
399
- var Root: React__default.ForwardRefExoticComponent<React__default.TableHTMLAttributes<HTMLTableElement> & BoxProps & {
399
+ var Root: react__default.ForwardRefExoticComponent<react__default.TableHTMLAttributes<HTMLTableElement> & BoxProps & {
400
400
  /** Sets whether an element is treated as a block or inline box and the
401
401
  * layout used for its children, such as flow layout, grid or flex.
402
402
  * @default "table"
403
403
  */
404
404
  display?: BoxProps["display"];
405
405
  } & {
406
- children?: React__default.ReactNode | undefined;
407
- } & React__default.RefAttributes<HTMLTableElement>>;
408
- var Row: React__default.ForwardRefExoticComponent<React__default.HTMLAttributes<HTMLTableRowElement> & BoxProps & {
409
- children?: React__default.ReactNode | undefined;
410
- } & React__default.RefAttributes<HTMLTableRowElement>>;
411
- var Header: React__default.ForwardRefExoticComponent<React__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
412
- children?: React__default.ReactNode | undefined;
413
- } & React__default.RefAttributes<HTMLTableSectionElement>>;
414
- var Body: React__default.ForwardRefExoticComponent<React__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
415
- children?: React__default.ReactNode | undefined;
416
- } & React__default.RefAttributes<HTMLTableSectionElement>>;
417
- var Cell: React__default.ForwardRefExoticComponent<TableCellProps & {
418
- children?: React__default.ReactNode | undefined;
419
- } & React__default.RefAttributes<HTMLTableCellElement | HTMLTableHeaderCellElement>>;
406
+ children?: react__default.ReactNode | undefined;
407
+ } & react__default.RefAttributes<HTMLTableElement>>;
408
+ var Row: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableRowElement> & BoxProps & {
409
+ children?: react__default.ReactNode | undefined;
410
+ } & react__default.RefAttributes<HTMLTableRowElement>>;
411
+ var Header: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
412
+ children?: react__default.ReactNode | undefined;
413
+ } & react__default.RefAttributes<HTMLTableSectionElement>>;
414
+ var Body: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
415
+ children?: react__default.ReactNode | undefined;
416
+ } & react__default.RefAttributes<HTMLTableSectionElement>>;
417
+ var Cell: react__default.ForwardRefExoticComponent<TableCellProps & {
418
+ children?: react__default.ReactNode | undefined;
419
+ } & react__default.RefAttributes<HTMLTableCellElement | HTMLTableHeaderCellElement>>;
420
420
  }
421
421
 
422
422
  interface TabProps extends React.PropsWithChildren {
@@ -426,9 +426,9 @@ interface TabProps extends React.PropsWithChildren {
426
426
  startIcon?: IconProps['name'];
427
427
  }
428
428
  declare function Tabs(props: TabProviderProps): react_jsx_runtime.JSX.Element;
429
- declare const TabList: React$1.ForwardRefExoticComponent<Omit<TabListProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
429
+ declare const TabList: react.ForwardRefExoticComponent<Omit<TabListProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
430
430
  declare const Tab: ({ asChild, label, value, startIcon }: TabProps) => react_jsx_runtime.JSX.Element;
431
- declare const TabPanel: React$1.ForwardRefExoticComponent<Omit<TabPanelProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
431
+ declare const TabPanel: react.ForwardRefExoticComponent<Omit<TabPanelProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
432
432
 
433
433
  type NativeTextInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'height' | 'size' | 'width' | 'color'>;
434
434
  interface TextInputProps extends NativeTextInputProps, UniversalTextInputProps {
@@ -1,7 +1,7 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import { SvgIcon, IconSize, IconVariant } from '@yahoo/uds-icons/types';
3
- import * as React$1 from 'react';
4
- import React__default, { PropsWithChildren, Ref, FC, TableHTMLAttributes, TdHTMLAttributes } from 'react';
3
+ import * as react from 'react';
4
+ import react__default, { PropsWithChildren, Ref, FC, TableHTMLAttributes, TdHTMLAttributes } from 'react';
5
5
  import * as _ariakit_react from '@ariakit/react';
6
6
  import { PopoverProviderProps, PopoverProps as PopoverProps$1, DialogProps, useDialogStore, DialogStore, DialogDismiss, PopoverArrow as PopoverArrow$1, PopoverAnchor as PopoverAnchor$1, PopoverDescription as PopoverDescription$1, PopoverDismiss as PopoverDismiss$1, PopoverProvider as PopoverProvider$1, PopoverDisclosure as PopoverDisclosure$1, PopoverDisclosureArrow as PopoverDisclosureArrow$1, TabProviderProps, TabListProps, TabPanelProps } from '@ariakit/react';
7
7
  export { DialogStore as ModalStore, TabListProps, TabPanelProps, TabProviderProps as TabsProps, usePopoverStore } from '@ariakit/react';
@@ -244,12 +244,12 @@ interface PressableProps extends UniversalPressableProps, HtmlButtonProps {
244
244
  }
245
245
 
246
246
  type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li';
247
- type TextProps = UniversalTextProps & {
247
+ type TextProps<TagName extends TextElementTagName = TextElementTagName> = {
248
248
  /** Ref passed to the inner container. */
249
249
  ref?: Ref<HTMLElement>;
250
250
  /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
251
- as?: TextElementTagName;
252
- } & Omit<JSX.IntrinsicElements[TextElementTagName], 'color'>;
251
+ as?: TagName;
252
+ } & JSX.IntrinsicElements[TagName] & UniversalTextProps;
253
253
 
254
254
  type DivProps = React.HTMLAttributes<HTMLDivElement>;
255
255
  interface BoxProps extends UniversalBoxProps, DivProps {
@@ -266,7 +266,7 @@ interface AccordionProps extends PressableProps {
266
266
  }
267
267
  declare function Accordion({ label, children, onClick, open, spacingHorizontal, _content, className, textProps, ...props }: AccordionProps): react_jsx_runtime.JSX.Element;
268
268
 
269
- type NativeImageProps = Omit<React__default.ImgHTMLAttributes<HTMLImageElement>, 'size' | 'color' | 'height' | 'width' | 'alt' | 'src'>;
269
+ type NativeImageProps = Omit<react__default.ImgHTMLAttributes<HTMLImageElement>, 'size' | 'color' | 'height' | 'width' | 'alt' | 'src'>;
270
270
  interface AvatarProps extends NativeImageProps, UniversalAvatarProps {
271
271
  }
272
272
  /**
@@ -303,7 +303,7 @@ declare const Dropdown: typeof _ariakit_react.PopoverProvider;
303
303
  interface DropdownItemPressableProps extends Omit<PressableProps, 'onClick'> {
304
304
  onClick?: (close: () => void) => void;
305
305
  }
306
- declare const DropdownItemPressable: React$1.ForwardRefExoticComponent<DropdownItemPressableProps & React$1.RefAttributes<HTMLButtonElement>>;
306
+ declare const DropdownItemPressable: react.ForwardRefExoticComponent<DropdownItemPressableProps & react.RefAttributes<HTMLButtonElement>>;
307
307
 
308
308
  interface DropdownItemProps extends DropdownItemPressableProps {
309
309
  startIcon?: IconProps['name'];
@@ -318,7 +318,7 @@ declare function DropdownItem({ title, description, _title, _description, startI
318
318
  interface DropdownItemsProps extends React.PropsWithChildren, Omit<PopoverProps$1, 'children'> {
319
319
  overflow?: Overflow;
320
320
  }
321
- declare const DropdownItems: React$1.ForwardRefExoticComponent<Omit<DropdownItemsProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
321
+ declare const DropdownItems: react.ForwardRefExoticComponent<Omit<DropdownItemsProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
322
322
 
323
323
  type DropdownTriggerProps = ButtonProps;
324
324
  declare function DropdownTrigger({ children, ...props }: DropdownTriggerProps): react_jsx_runtime.JSX.Element;
@@ -333,8 +333,8 @@ declare function Modal({ className, ...props }: ModalProps): react_jsx_runtime.J
333
333
  declare const ModalDismiss: typeof DialogDismiss;
334
334
 
335
335
  interface PopoverHeadingProps extends PropsWithChildren {
336
- leading?: React__default.ReactNode;
337
- trailing?: React__default.ReactNode;
336
+ leading?: react__default.ReactNode;
337
+ trailing?: react__default.ReactNode;
338
338
  }
339
339
  declare function PopoverHeading({ children, leading, trailing }: PopoverHeadingProps): react_jsx_runtime.JSX.Element;
340
340
  type PopoverProps = Omit<PopoverProps$1, 'key'>;
@@ -357,7 +357,7 @@ declare function Spinner({ className, ...props }: SpinnerProps): react_jsx_runti
357
357
  type TableColumn<T> = {
358
358
  title?: string;
359
359
  dataIndex: keyof T;
360
- render?: (value: T[keyof T], record: T, index: number) => React__default.ReactNode;
360
+ render?: (value: T[keyof T], record: T, index: number) => react__default.ReactNode;
361
361
  };
362
362
  type TableRootProps = TableHTMLAttributes<HTMLTableElement> & BoxProps & {
363
363
  /** Sets whether an element is treated as a block or inline box and the
@@ -396,27 +396,27 @@ type TableProps<T> = {
396
396
  */
397
397
  declare function Table<T>({ data, columns, ...props }: TableProps<T>): react_jsx_runtime.JSX.Element;
398
398
  declare namespace Table {
399
- var Root: React__default.ForwardRefExoticComponent<React__default.TableHTMLAttributes<HTMLTableElement> & BoxProps & {
399
+ var Root: react__default.ForwardRefExoticComponent<react__default.TableHTMLAttributes<HTMLTableElement> & BoxProps & {
400
400
  /** Sets whether an element is treated as a block or inline box and the
401
401
  * layout used for its children, such as flow layout, grid or flex.
402
402
  * @default "table"
403
403
  */
404
404
  display?: BoxProps["display"];
405
405
  } & {
406
- children?: React__default.ReactNode | undefined;
407
- } & React__default.RefAttributes<HTMLTableElement>>;
408
- var Row: React__default.ForwardRefExoticComponent<React__default.HTMLAttributes<HTMLTableRowElement> & BoxProps & {
409
- children?: React__default.ReactNode | undefined;
410
- } & React__default.RefAttributes<HTMLTableRowElement>>;
411
- var Header: React__default.ForwardRefExoticComponent<React__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
412
- children?: React__default.ReactNode | undefined;
413
- } & React__default.RefAttributes<HTMLTableSectionElement>>;
414
- var Body: React__default.ForwardRefExoticComponent<React__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
415
- children?: React__default.ReactNode | undefined;
416
- } & React__default.RefAttributes<HTMLTableSectionElement>>;
417
- var Cell: React__default.ForwardRefExoticComponent<TableCellProps & {
418
- children?: React__default.ReactNode | undefined;
419
- } & React__default.RefAttributes<HTMLTableCellElement | HTMLTableHeaderCellElement>>;
406
+ children?: react__default.ReactNode | undefined;
407
+ } & react__default.RefAttributes<HTMLTableElement>>;
408
+ var Row: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableRowElement> & BoxProps & {
409
+ children?: react__default.ReactNode | undefined;
410
+ } & react__default.RefAttributes<HTMLTableRowElement>>;
411
+ var Header: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
412
+ children?: react__default.ReactNode | undefined;
413
+ } & react__default.RefAttributes<HTMLTableSectionElement>>;
414
+ var Body: react__default.ForwardRefExoticComponent<react__default.HTMLAttributes<HTMLTableSectionElement> & BoxProps & {
415
+ children?: react__default.ReactNode | undefined;
416
+ } & react__default.RefAttributes<HTMLTableSectionElement>>;
417
+ var Cell: react__default.ForwardRefExoticComponent<TableCellProps & {
418
+ children?: react__default.ReactNode | undefined;
419
+ } & react__default.RefAttributes<HTMLTableCellElement | HTMLTableHeaderCellElement>>;
420
420
  }
421
421
 
422
422
  interface TabProps extends React.PropsWithChildren {
@@ -426,9 +426,9 @@ interface TabProps extends React.PropsWithChildren {
426
426
  startIcon?: IconProps['name'];
427
427
  }
428
428
  declare function Tabs(props: TabProviderProps): react_jsx_runtime.JSX.Element;
429
- declare const TabList: React$1.ForwardRefExoticComponent<Omit<TabListProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
429
+ declare const TabList: react.ForwardRefExoticComponent<Omit<TabListProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
430
430
  declare const Tab: ({ asChild, label, value, startIcon }: TabProps) => react_jsx_runtime.JSX.Element;
431
- declare const TabPanel: React$1.ForwardRefExoticComponent<Omit<TabPanelProps, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
431
+ declare const TabPanel: react.ForwardRefExoticComponent<Omit<TabPanelProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
432
432
 
433
433
  type NativeTextInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'height' | 'size' | 'width' | 'color'>;
434
434
  interface TextInputProps extends NativeTextInputProps, UniversalTextInputProps {
package/dist/index.d.cts CHANGED
@@ -172,12 +172,12 @@ interface PressableProps extends UniversalPressableProps, HtmlButtonProps {
172
172
  declare const Pressable: react.ForwardRefExoticComponent<PressableProps & react.RefAttributes<HTMLButtonElement>>;
173
173
 
174
174
  type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li';
175
- type TextProps = UniversalTextProps & {
175
+ type TextProps<TagName extends TextElementTagName = TextElementTagName> = {
176
176
  /** Ref passed to the inner container. */
177
177
  ref?: Ref<HTMLElement>;
178
178
  /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
179
- as?: TextElementTagName;
180
- } & Omit<JSX.IntrinsicElements[TextElementTagName], 'color'>;
179
+ as?: TagName;
180
+ } & JSX.IntrinsicElements[TagName] & UniversalTextProps;
181
181
  /**
182
182
  * **💬 A text element that can be used to display text**
183
183
  *
@@ -208,7 +208,37 @@ type TextProps = UniversalTextProps & {
208
208
  *
209
209
  * @related [Button](https://uds.build/docs/components/button) and [Pressable](https://uds.build/docs/components/pressable)
210
210
  */
211
- declare const Text: react.ForwardRefExoticComponent<Omit<TextProps, "ref"> & react.RefAttributes<HTMLElement>>;
211
+ declare const Text: react.ForwardRefExoticComponent<(Omit<{
212
+ /** Ref passed to the inner container. */
213
+ ref?: Ref<HTMLElement>;
214
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
215
+ as?: TextElementTagName | undefined;
216
+ } & react.ClassAttributes<HTMLElement> & react.HTMLAttributes<HTMLElement> & UniversalTextProps, "ref"> | Omit<{
217
+ /** Ref passed to the inner container. */
218
+ ref?: Ref<HTMLElement>;
219
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
220
+ as?: TextElementTagName | undefined;
221
+ } & react.ClassAttributes<HTMLParagraphElement> & react.HTMLAttributes<HTMLParagraphElement> & UniversalTextProps, "ref"> | Omit<{
222
+ /** Ref passed to the inner container. */
223
+ ref?: Ref<HTMLElement>;
224
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
225
+ as?: TextElementTagName | undefined;
226
+ } & react.ClassAttributes<HTMLHeadingElement> & react.HTMLAttributes<HTMLHeadingElement> & UniversalTextProps, "ref"> | Omit<{
227
+ /** Ref passed to the inner container. */
228
+ ref?: Ref<HTMLElement>;
229
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
230
+ as?: TextElementTagName | undefined;
231
+ } & react.ClassAttributes<HTMLLabelElement> & react.LabelHTMLAttributes<HTMLLabelElement> & UniversalTextProps, "ref"> | Omit<{
232
+ /** Ref passed to the inner container. */
233
+ ref?: Ref<HTMLElement>;
234
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
235
+ as?: TextElementTagName | undefined;
236
+ } & react.ClassAttributes<HTMLLIElement> & react.LiHTMLAttributes<HTMLLIElement> & UniversalTextProps, "ref"> | Omit<{
237
+ /** Ref passed to the inner container. */
238
+ ref?: Ref<HTMLElement>;
239
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
240
+ as?: TextElementTagName | undefined;
241
+ } & react.ClassAttributes<HTMLSpanElement> & react.HTMLAttributes<HTMLSpanElement> & UniversalTextProps, "ref">) & react.RefAttributes<HTMLElement>>;
212
242
 
213
243
  type VStackProps = UniversalStackProps & DivProps;
214
244
  /**
package/dist/index.d.ts CHANGED
@@ -172,12 +172,12 @@ interface PressableProps extends UniversalPressableProps, HtmlButtonProps {
172
172
  declare const Pressable: react.ForwardRefExoticComponent<PressableProps & react.RefAttributes<HTMLButtonElement>>;
173
173
 
174
174
  type TextElementTagName = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'p' | 'strong' | 'span' | 'label' | 'li';
175
- type TextProps = UniversalTextProps & {
175
+ type TextProps<TagName extends TextElementTagName = TextElementTagName> = {
176
176
  /** Ref passed to the inner container. */
177
177
  ref?: Ref<HTMLElement>;
178
178
  /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
179
- as?: TextElementTagName;
180
- } & Omit<JSX.IntrinsicElements[TextElementTagName], 'color'>;
179
+ as?: TagName;
180
+ } & JSX.IntrinsicElements[TagName] & UniversalTextProps;
181
181
  /**
182
182
  * **💬 A text element that can be used to display text**
183
183
  *
@@ -208,7 +208,37 @@ type TextProps = UniversalTextProps & {
208
208
  *
209
209
  * @related [Button](https://uds.build/docs/components/button) and [Pressable](https://uds.build/docs/components/pressable)
210
210
  */
211
- declare const Text: react.ForwardRefExoticComponent<Omit<TextProps, "ref"> & react.RefAttributes<HTMLElement>>;
211
+ declare const Text: react.ForwardRefExoticComponent<(Omit<{
212
+ /** Ref passed to the inner container. */
213
+ ref?: Ref<HTMLElement>;
214
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
215
+ as?: TextElementTagName | undefined;
216
+ } & react.ClassAttributes<HTMLElement> & react.HTMLAttributes<HTMLElement> & UniversalTextProps, "ref"> | Omit<{
217
+ /** Ref passed to the inner container. */
218
+ ref?: Ref<HTMLElement>;
219
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
220
+ as?: TextElementTagName | undefined;
221
+ } & react.ClassAttributes<HTMLParagraphElement> & react.HTMLAttributes<HTMLParagraphElement> & UniversalTextProps, "ref"> | Omit<{
222
+ /** Ref passed to the inner container. */
223
+ ref?: Ref<HTMLElement>;
224
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
225
+ as?: TextElementTagName | undefined;
226
+ } & react.ClassAttributes<HTMLHeadingElement> & react.HTMLAttributes<HTMLHeadingElement> & UniversalTextProps, "ref"> | Omit<{
227
+ /** Ref passed to the inner container. */
228
+ ref?: Ref<HTMLElement>;
229
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
230
+ as?: TextElementTagName | undefined;
231
+ } & react.ClassAttributes<HTMLLabelElement> & react.LabelHTMLAttributes<HTMLLabelElement> & UniversalTextProps, "ref"> | Omit<{
232
+ /** Ref passed to the inner container. */
233
+ ref?: Ref<HTMLElement>;
234
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
235
+ as?: TextElementTagName | undefined;
236
+ } & react.ClassAttributes<HTMLLIElement> & react.LiHTMLAttributes<HTMLLIElement> & UniversalTextProps, "ref"> | Omit<{
237
+ /** Ref passed to the inner container. */
238
+ ref?: Ref<HTMLElement>;
239
+ /** Changes the HTML tag used to render text. Uses the most appropriate semantic tag based on the text style variant. */
240
+ as?: TextElementTagName | undefined;
241
+ } & react.ClassAttributes<HTMLSpanElement> & react.HTMLAttributes<HTMLSpanElement> & UniversalTextProps, "ref">) & react.RefAttributes<HTMLElement>>;
212
242
 
213
243
  type VStackProps = UniversalStackProps & DivProps;
214
244
  /**