@telus-uds/components-base 4.0.0-alpha.1 → 4.0.0-beta.0

package/types/Tags.d.ts

@@ -0,0 +1,24 @@
+import type { ComponentType } from 'react'
+
+export interface TagItem {
+  id?: string
+  label: string
+  accessibilityLabel?: string
+  defaultChecked?: boolean
+  checked?: boolean
+  [key: string]: any
+}
+
+export interface TagsProps {
+  items: TagItem[]
+  maxValues?: number
+  tokens?: Record<string, string | number | boolean | object>
+  variant?: Record<string, string | number | boolean | undefined>
+  onChange?: (selectedIds: string[]) => void
+  testID?: string
+  dataSet?: Record<string, any>
+}
+
+declare const Tags: ComponentType<TagsProps>
+
+export { Tags }

package/types/TextButton.d.ts

@@ -1,11 +1,18 @@
-import React from 'react'
+import type { ComponentType, ReactNode } from 'react'
 import { LinkTokens, LinkAndTextButtonVariants } from './Link'
 
 export interface TextButtonProps {
-  onPress: () => void
-  accessibilityLabel: string
-  children: string | React.ReactNode
+  onPress?: () => void
+  accessibilityLabel?: string
+  children: string | ReactNode
   variant?: LinkAndTextButtonVariants
   tokens?: LinkTokens
   testID?: string
+  href?: string
+  onPressIn?: () => void
+  onPressOut?: () => void
 }
+
+declare const TextButton: ComponentType<TextButtonProps>
+
+export { TextButton }

package/types/TextInput.d.ts

@@ -0,0 +1,38 @@
+import type { ComponentType } from 'react'
+
+export interface TextInputProps {
+  value?: string
+  type?: string
+  initialValue?: string
+  inactive?: boolean
+  readOnly?: boolean
+  onChange?: (value: string, event?: any) => void
+  label?: string
+  hint?: string
+  hintPosition?: 'inline' | 'below'
+  feedback?: string
+  validation?: 'error' | 'success'
+  tooltip?: string | Record<string, any>
+  copy?: 'en' | 'fr'
+  placeholder?: string
+  id?: string
+  name?: string
+  maxLength?: number
+  multiline?: boolean
+  numberOfLines?: number
+  autoComplete?: string
+  autoFocus?: boolean
+  keyboardType?: string
+  returnKeyType?: string
+  secureTextEntry?: boolean
+  tokens?: Record<string, string | number | boolean | object>
+  variant?: Record<string, string | number | boolean | undefined>
+  testID?: string
+  dataSet?: Record<string, any>
+  accessibilityLabel?: string
+  nativeID?: string
+}
+
+declare const TextInput: ComponentType<TextInputProps>
+
+export { TextInput }

package/types/ThemeProvider.d.ts

@@ -0,0 +1,29 @@
+import type { ComponentType, ReactNode } from 'react'
+
+export interface ThemeMetadata {
+  themeTokensVersion: string
+  name: string
+}
+
+export interface ThemeOptions {
+  forceAbsoluteFontSizing?: boolean
+  contentMaxWidth?: number
+  forceZIndex?: boolean
+  enableHelmetSSR?: boolean
+  enableMediaQueryStyleSheet?: boolean
+}
+
+export interface Theme {
+  metadata: ThemeMetadata
+  [key: string]: any
+}
+
+export interface ThemeProviderProps {
+  children: ReactNode
+  defaultTheme: Theme
+  options?: ThemeOptions
+}
+
+declare const ThemeProvider: ComponentType<ThemeProviderProps>
+
+export { ThemeProvider }

package/types/Timeline.d.ts

@@ -0,0 +1,16 @@
+import type { ComponentType, ReactNode } from 'react'
+
+export interface TimelineProps {
+  children: ReactNode[]
+  accessibilityLabel: string
+  tokens?: Record<string, string | number | boolean | object>
+  variant?: Record<string, string | number | boolean | undefined>
+  tag?: string
+  childrenTag?: string
+  testID?: string
+  dataSet?: Record<string, any>
+}
+
+declare const Timeline: ComponentType<TimelineProps>
+
+export { Timeline }

package/types/ToggleSwitch.d.ts

@@ -1,6 +1,7 @@
+import type { ComponentType } from 'react'
 import { CopyType } from './Common'
 
-type ToggleSwitchTokens = {
+export type ToggleSwitchTokens = {
   borderColor?: string
   borderWidth?: number
   borderRadius?: number
@@ -17,7 +18,7 @@ type ToggleSwitchTokens = {
   shadow?: string
   alignSelf?: string
   space?: number
-  icon?: React.ReactNode
+  icon?: any
   trackHeight?: number
   outerBorderGapButton?: number
   width?: number
@@ -52,4 +53,12 @@ export interface ToggleSwitchProps {
   testID?: string
   tokens?: ToggleSwitchTokens
   togglePosition?: 'start' | 'end'
+  pointerEvents?: 'all' | 'none' | 'box-only' | 'box-none'
+  onLayout?: (event: any) => void
+  nativeID?: string
+  dataSet?: Record<string, any>
 }
+
+declare const ToggleSwitch: ComponentType<ToggleSwitchProps>
+
+export { ToggleSwitch }

package/types/ToolTip.d.ts

@@ -1,7 +1,7 @@
-import { ReactNode } from 'react'
+import type { ComponentType, ReactNode } from 'react'
 import { CopyType, Position } from './Common'
 
-type TooltipTokens = {
+export type TooltipTokens = {
   backgroundColor?: string
   paddingTop?: number
   paddingBottom?: number
@@ -19,7 +19,7 @@ type TooltipTokens = {
   arrowOffset?: number
 }
 
-type TooltipVariants = {
+export type TooltipVariants = {
   inverse?: boolean
 }
 
@@ -38,3 +38,7 @@ export interface TooltipProps {
   accessible?: boolean
   testID?: string
 }
+
+declare const Tooltip: ComponentType<TooltipProps>
+
+export { Tooltip }

package/types/TooltipButton.d.ts

@@ -0,0 +1,20 @@
+import type { ComponentType } from 'react'
+
+export interface TooltipButtonPressableState {
+  pressed: boolean
+  hover: boolean
+  focus: boolean
+}
+
+export interface TooltipButtonProps {
+  pressableState?: TooltipButtonPressableState
+  tokens?: Record<string, string | number | boolean | object>
+  variant?: Record<string, string | number | boolean | undefined>
+  testID?: string
+  dataSet?: Record<string, any>
+  accessibilityLabel?: string
+}
+
+declare const TooltipButton: ComponentType<TooltipButtonProps>
+
+export { TooltipButton }

package/types/Typography.d.ts

@@ -1,4 +1,5 @@
-import { LetterSpacing, TextTransform } from './Common'
+import type { ComponentType, ReactNode } from 'react'
+import { LetterSpacing, TextTransform, tagType, headingType, alignType } from './Common'
 
 export interface TypographyProps {
   tag?: tagType | string
@@ -10,7 +11,8 @@ export interface TypographyProps {
   heading?: headingType | string
   accessible?: boolean
   accessibilityLabel?: string
-  children?: React.ReactNode
+  children?: ReactNode
+  dataSet?: Record<string, any>
 }
 
 export type TypographyVariants = {
@@ -38,3 +40,7 @@ export type TypographyTokens = {
   fontScaleCap?: number
   letterSpacing?: LetterSpacing
 }
+
+declare const Typography: ComponentType<TypographyProps>
+
+export { Typography }

package/types/Validator.d.ts

@@ -0,0 +1,16 @@
+import type { ComponentType } from 'react'
+
+export interface ValidatorProps {
+  value?: string
+  inactive?: boolean
+  mask?: string
+  onChange?: (value: string) => void
+  tokens?: Record<string, string | number | boolean | object>
+  variant?: Record<string, string | number | boolean | undefined>
+  testID?: string
+  dataSet?: Record<string, any>
+}
+
+declare const Validator: ComponentType<ValidatorProps>
+
+export { Validator }

package/types/ViewportProvider.d.ts

@@ -0,0 +1,12 @@
+import type { ComponentType, ReactNode } from 'react'
+
+export type ViewportKey = 'xs' | 'sm' | 'md' | 'lg' | 'xl'
+
+export interface ViewportProviderProps {
+  children: ReactNode
+  defaultViewport?: ViewportKey
+}
+
+declare const ViewportProvider: ComponentType<ViewportProviderProps>
+
+export { ViewportProvider }

package/types/index.d.ts

@@ -1,27 +1,66 @@
-export { default as Badge } from './Badge'
+export { A11yInfoProvider } from './A11yInfoProvider'
+export type { A11yInfoProviderProps } from './A11yInfoProvider'
+
+export { A11yText } from './A11yText'
+export type { A11yTextProps } from './A11yText'
+
+export { ActionCard } from './ActionCard'
+export type { ActionCardProps } from './ActionCard'
+
+export { ActivityIndicator } from './ActivityIndicator'
+export type { ActivityIndicatorProps } from './ActivityIndicator'
+
+export { Autocomplete } from './Autocomplete'
+export type { AutocompleteProps, AutocompleteItem } from './Autocomplete'
+
+export { Badge } from './Badge'
 export type { BadgeProps, BadgeVariants, BadgeTokens } from './Badge'
 
-export { default as Box } from './Box'
+export { BaseProvider } from './BaseProvider'
+export type { BaseProviderProps } from './BaseProvider'
+
+export { Box } from './Box'
 export type { BoxVariants, BoxTokens, BoxProps } from './Box'
 
-export { default as ChevronLink } from './ChevronLink'
-export { ChevronLinkTokens, ChevronLinkProps, HrefProps } from './ChevronLink'
+export { Button } from './Button'
+export type { ButtonProps, ButtonPressableState } from './Button'
+
+export { Card } from './Card'
+export type { CardProps } from './Card'
 
-export { default as Checkbox } from './Checkbox'
-export { CheckboxProps, CheckboxTokens } from './Checkbox'
+export { CardGroup } from './CardGroup'
+export type { CardGroupProps, CardGroupItem } from './CardGroup'
 
-export { default as CheckboxCardGroup } from './CheckboxCardGroup'
-export {
+export { Carousel } from './Carousel'
+export type { CarouselProps, CarouselItemProps } from './Carousel'
+
+export { CheckboxCard } from './CheckboxCard'
+export type { CheckboxCardProps } from './CheckboxCard'
+
+export { CheckboxCardGroup } from './CheckboxCardGroup'
+export type {
   CheckboxCardGroupProps,
   CheckboxCardGroupTokens,
-  checkboxCardTokens
+  CheckboxCardTokens
 } from './CheckboxCardGroup'
 
-export { default as Divider } from './Divider'
-export { DividerVariants, DividerProps, DividerTokens } from './Divider'
+export { Checkbox } from './Checkbox'
+export type { CheckboxProps, CheckboxTokens } from './Checkbox'
+
+export { ChevronLink } from './ChevronLink'
+export type { ChevronLinkTokens, ChevronLinkProps, HrefProps } from './ChevronLink'
+
+export { ColourToggle } from './ColourToggle'
+export type { ColourToggleProps } from './ColourToggle'
+
+export { Divider } from './Divider'
+export type { DividerVariants, DividerProps, DividerTokens } from './Divider'
+
+export { DownloadApp } from './DownloadApp'
+export type { DownloadAppProps } from './DownloadApp'
 
-export { default as ExpandCollapse } from './ExpandCollapse'
-export {
+export { ExpandCollapse } from './ExpandCollapse'
+export type {
   ExpandCollapseVariants,
   ExpandCollapseTokens,
   ExpandCollapseControlTokens,
@@ -30,29 +69,116 @@ export {
   ExpandCollapsePanelProps
 } from './ExpandCollapse'
 
-export { default as FileUpload } from './FileUpload'
-export { FileUploadTokens, FileUploadProps } from './FileUpload'
+export { ExpandCollapseMini } from './ExpandCollapseMini'
+export type { ExpandCollapseMiniProps } from './ExpandCollapseMini'
+
+export { Feedback } from './Feedback'
+export type { FeedbackProps } from './Feedback'
+
+export { Fieldset } from './Fieldset'
+export type { FieldsetProps } from './Fieldset'
+
+export { FileUpload } from './FileUpload'
+export type { FileUploadTokens, FileUploadProps } from './FileUpload'
+
+export { FlexGrid } from './FlexGrid'
+export type { FlexGridProps, FlexGridRowProps, FlexGridColProps } from './FlexGrid'
+
+export { Footnote } from './Footnote'
+export type { FootnoteProps } from './Footnote'
+
+export { HorizontalScroll } from './HorizontalScroll'
+export type { HorizontalScrollProps } from './HorizontalScroll'
+
+export { HorizontalScrollButton } from './HorizontalScrollButton'
+export type {
+  HorizontalScrollButtonTokens,
+  HorizontalScrollButtonProps
+} from './HorizontalScrollButton'
+
+export { Icon } from './Icon'
+export type { IconProps, IconTokens, IconVariant, IconPositionLeftRight } from './Icon'
+
+export { IconButton } from './IconButton'
+export type { IconButtonProps } from './IconButton'
+
+export { InputLabel } from './InputLabel'
+export type { InputLabelProps } from './InputLabel'
+
+export { InputSupports } from './InputSupports'
+export type { InputSupportsProps } from './InputSupports'
+
+export { Link } from './Link'
+export type { LinkProps, LinkSize, LinkAndTextButtonVariants, LinkTokens, HrefAttrs } from './Link'
 
-export { default as HorizontalScrollButton } from './HorizontalScrollButton'
-export { HorizontalScrollButtonTokens } from './HorizontalScrollButton'
+export { List } from './List'
+export type { ListVariants, ListTokens, ListProps, ListItemProps, ListItemTokens } from './List'
 
-export { default as Icon } from './Icon'
-export { IconProps, IconTokens, IconVariant, IconPositionLeftRight } from './Icon'
+export { Listbox } from './Listbox'
+export type { ListboxProps, ListboxTokens, ListboxItems } from './Listbox'
 
-export { default as Link } from './Link'
-export { LinkProps, LinkSize, LinkAndTextButtonVariants, LinkTokens } from './Link'
+export { Modal } from './Modal'
+export type { ModalProps } from './Modal'
 
-export { default as List } from './List'
-export { ListVariants, ListTokens, ListProps, ListItemProps, ListItemTokens } from './List'
+export { MultiSelectFilter } from './MultiSelectFilter'
+export type { MultiSelectFilterProps, MultiSelectFilterItem } from './MultiSelectFilter'
 
-export { default as Search } from './Search'
-export { SearchTokens, SearchProps } from './Search'
+export { Notification } from './Notification'
+export type { NotificationProps } from './Notification'
 
-export { default as Select } from './Select'
-export { SelectTokens, SelectProps, SelectItemProps, SelectGroupProps } from './Select'
+export { OrderedList } from './OrderedList'
+export type { OrderedListProps, OrderedListItemProps } from './OrderedList'
 
-export { default as Shortcuts, ShortcutsItem } from './Shortcuts'
-export {
+export { Pagination } from './Pagination'
+export type { PaginationProps, PaginationPageButtonProps } from './Pagination'
+
+export { Portal } from './Portal'
+export type { PortalProps } from './Portal'
+
+export { PriceLockup } from './PriceLockup'
+export type { PriceLockupProps } from './PriceLockup'
+
+export { ProductCard } from './ProductCard'
+export type { ProductCardProps, ProductCardImage } from './ProductCard'
+
+export { ProductCardGroup } from './ProductCardGroup'
+export type { ProductCardGroupProps, ProductCardGroupCardItem } from './ProductCardGroup'
+
+export { Progress } from './Progress'
+export type { ProgressProps, ProgressBarProps } from './Progress'
+
+export { QuickLinks } from './QuickLinks'
+export type { QuickLinksProps, QuickLinksItemProps } from './QuickLinks'
+
+export { QuickLinksFeature } from './QuickLinksFeature'
+export type { QuickLinksFeatureProps, QuickLinksFeatureItemProps } from './QuickLinksFeature'
+
+export { Radio } from './Radio'
+export type { RadioProps } from './Radio'
+
+export { RadioCard } from './RadioCard'
+export type { RadioCardProps } from './RadioCard'
+
+export { Responsive } from './Responsive'
+export type { ResponsiveProps, ViewportKey } from './Responsive'
+
+export { Scroll, ScrollItem } from './Scroll'
+export type {
+  ScrollProps,
+  ScrollTokens,
+  ScrollVariant,
+  ScrollItemProps,
+  ScrollDictionary
+} from './Scroll'
+
+export { Search } from './Search'
+export type { SearchTokens, SearchProps } from './Search'
+
+export { Select } from './Select'
+export type { SelectTokens, SelectProps, SelectItemProps, SelectGroupProps } from './Select'
+
+export { Shortcuts, ShortcutsItem } from './Shortcuts'
+export type {
   ShortcutsProps,
   ShortcutsTokens,
   ShortcutsVariant,
@@ -63,34 +189,64 @@ export {
   PressableState
 } from './Shortcuts'
 
-export { default as Spacer } from './Spacer'
-export { SpacerProps } from './Spacer'
+export { SideNav } from './SideNav'
+export type { SideNavProps, SideNavItemsGroupProps, SideNavItemProps } from './SideNav'
+
+export { Skeleton } from './Skeleton'
+export type { SkeletonProps } from './Skeleton'
+
+export { SkipLink } from './SkipLink'
+export type { SkipLinkProps } from './SkipLink'
+
+export { Spacer } from './Spacer'
+export type { SpacerProps } from './Spacer'
+
+export { StackView } from './StackView'
+export type { StackViewTokens, StackViewProps } from './StackView'
+
+export { Status } from './Status'
+export type { StatusProps, StatusTokensProps } from './Status'
+
+export { StepTracker } from './StepTracker'
+export type { StepTrackerProps } from './StepTracker'
+
+export { TabBar } from './TabBar'
+export type { TabBarProps, TabBarItem } from './TabBar'
+
+export { Tabs } from './Tabs'
+export type { TabsProps, TabsTokens, TabSelectorProps, TabsVariant, TabsItem } from './Tabs'
+
+export { Tags } from './Tags'
+export type { TagsProps, TagItem } from './Tags'
+
+export { TextButton } from './TextButton'
+export type { TextButtonProps } from './TextButton'
 
-export { default as StackView } from './StackView'
-export { StackViewTokens, StackViewProps } from './StackView'
+export { TextInput } from './TextInput'
+export type { TextInputProps } from './TextInput'
 
-export { default as Tabs } from './Tabs'
-export { TabsProps, TabsTokens, TabSelectorProps, TabsVariant, TabsItem } from './Tabs'
+export { ThemeProvider } from './ThemeProvider'
+export type { ThemeProviderProps, Theme, ThemeMetadata, ThemeOptions } from './ThemeProvider'
 
-export { default as TextButton } from './TextButton'
-export { TextButtonProps } from './TextButton'
+export { Timeline } from './Timeline'
+export type { TimelineProps } from './Timeline'
 
-export { default as ToggleSwitch } from './ToggleSwitch'
-export { ToggleSwitchTokens, ToggleSwitchProps } from './ToggleSwitch'
+export { ToggleSwitch } from './ToggleSwitch'
+export type { ToggleSwitchTokens, ToggleSwitchProps } from './ToggleSwitch'
 
-export { default as Tooltip } from './ToolTip'
-export { TooltipTokens, TooltipVariants, TooltipProps } from './ToolTip'
+export { Tooltip } from './Tooltip'
+export type { TooltipTokens, TooltipVariants, TooltipProps } from './Tooltip'
 
-export { default as Typography } from './Typography'
-export { TypographyProps, TypographyVariants, TypographyTokens } from './Typography'
+export { TooltipButton } from './TooltipButton'
+export type { TooltipButtonProps, TooltipButtonPressableState } from './TooltipButton'
 
-export { default as Portal } from './Portal'
-export { PortalProps } from './Portal'
+export { Typography } from './Typography'
+export type { TypographyProps, TypographyVariants, TypographyTokens } from './Typography'
 
-export { default as Listbox } from './Listbox'
-export { ListboxProps, ListboxTokens } from './Listbox'
+export { Validator } from './Validator'
+export type { ValidatorProps } from './Validator'
 
-export { default as Status } from './Status'
-export { StatusProps, StatusTokensProps } from './Status'
+export { ViewportProvider } from './ViewportProvider'
+export type { ViewportProviderProps } from './ViewportProvider'
 
 export * from './Common'