@yahoo/uds 1.7.2 → 1.7.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (7) hide show
  1. package/dist/experimental/index.d.cts +28 -28
  2. package/dist/experimental/index.d.ts +28 -28
  3. package/dist/index.d.cts +34 -4
  4. package/dist/index.d.ts +34 -4
  5. package/dist/metafile-cjs.json +1 -1
  6. package/dist/metafile-esm.json +1 -1
  7. package/package.json +1 -1
package/dist/experimental/index.d.cts CHANGED
@@ -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/experimental/index.d.ts CHANGED
@@ -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
  /**