@wistia/ui 0.4.8-beta.2116c6fb.fdbbdee → 0.4.8-beta.25eae1b2.b10e708

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.
package/dist/index.d.mts CHANGED
@@ -1,9 +1,10 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as react from 'react';
3
- import { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ChangeEvent, ForwardedRef, Ref, JSXElementConstructor, ElementType as ElementType$1, InputHTMLAttributes, RefObject } from 'react';
3
+ import { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ChangeEvent, ForwardedRef, Ref, JSXElementConstructor, ElementType as ElementType$1, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes } from 'react';
4
4
  import { LinkProps as LinkProps$1 } from 'react-router-dom';
5
5
  import * as styled_components from 'styled-components';
6
6
  import { DropdownMenuContentProps, DropdownMenuItemProps, DropdownMenuRadioGroupProps, DropdownMenuRadioItemProps, DropdownMenuCheckboxItemProps } from '@radix-ui/react-dropdown-menu';
7
+ import { ToggleGroupSingleProps } from '@radix-ui/react-toggle-group';
7
8
 
8
9
  type UIProviderProps = {
9
10
  children: ReactNode;
@@ -102,7 +103,7 @@ declare const ColorSchemeWrapper: {
102
103
  type ButtonVariants = 'ghost' | 'outline' | 'soft' | 'solid';
103
104
 
104
105
  type LinkTypes = 'default' | 'email' | 'external' | 'phone';
105
- type BaseProps = {
106
+ type BaseProps$1 = {
106
107
  /**
107
108
  * A Promise to invoke before navigating to location.
108
109
  * _Caution: if used with `external` type prop a new window will **not** be opened_
@@ -122,6 +123,14 @@ type BaseProps = {
122
123
  * Disables the link
123
124
  */
124
125
  disabled?: boolean;
126
+ /**
127
+ * Icon to display on the left side of the link, Must be an instance of [Icon](?path=/docs/components-icon--docs)
128
+ */
129
+ leftIcon?: JSX.Element | undefined;
130
+ /**
131
+ * Icon to display on the right side of the link, Must be an instance of [Icon](?path=/docs/components-icon--docs)
132
+ */
133
+ rightIcon?: JSX.Element | undefined;
125
134
  /**
126
135
  * Type of link to display
127
136
  *
@@ -135,11 +144,11 @@ type BaseProps = {
135
144
  */
136
145
  underline?: boolean;
137
146
  };
138
- type LinkAsLinkProps = BaseProps & ComponentPropsWithRef<'a'> & Omit<LinkProps$1, 'to'> & {
147
+ type LinkAsLinkProps = BaseProps$1 & ComponentPropsWithRef<'a'> & Omit<LinkProps$1, 'to'> & {
139
148
  href: string | undefined;
140
149
  type?: LinkTypes;
141
150
  };
142
- type LinkAsButtonProps = BaseProps & ComponentPropsWithRef<'button'> & {
151
+ type LinkAsButtonProps = BaseProps$1 & ComponentPropsWithRef<'button'> & {
143
152
  href?: never;
144
153
  type?: 'button' | 'reset' | 'submit';
145
154
  };
@@ -280,7 +289,7 @@ declare const useWindowSize: (interval?: number) => {
280
289
 
281
290
  type ActionButtonProps = {
282
291
  /**
283
- * The Icon component to use, e.g. `<Icon type="favorite" />`
292
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
284
293
  */
285
294
  icon: JSX.Element;
286
295
  /**
@@ -301,7 +310,7 @@ type ActionButtonProps = {
301
310
  */
302
311
  declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
303
312
  /**
304
- * The Icon component to use, e.g. `<Icon type="favorite" />`
313
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
305
314
  */
306
315
  icon: JSX.Element;
307
316
  /**
@@ -316,9 +325,9 @@ declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
316
325
  * Changes the secondary icon for different use cases
317
326
  */
318
327
  variant?: "default" | "gated" | "menu-down" | "menu-up";
319
- } & Omit<ButtonAsButtonProps, "size" | "isLoading" | "leftIcon" | "fullWidth" | "unstyled" | "rightIcon" | "variant">, "ref"> | Omit<{
328
+ } & Omit<ButtonAsButtonProps, "size" | "leftIcon" | "rightIcon" | "isLoading" | "fullWidth" | "unstyled" | "variant">, "ref"> | Omit<{
320
329
  /**
321
- * The Icon component to use, e.g. `<Icon type="favorite" />`
330
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
322
331
  */
323
332
  icon: JSX.Element;
324
333
  /**
@@ -333,7 +342,7 @@ declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
333
342
  * Changes the secondary icon for different use cases
334
343
  */
335
344
  variant?: "default" | "gated" | "menu-down" | "menu-up";
336
- } & Omit<ButtonAsLinkProps, "size" | "isLoading" | "leftIcon" | "fullWidth" | "unstyled" | "rightIcon" | "variant">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
345
+ } & Omit<ButtonAsLinkProps, "size" | "leftIcon" | "rightIcon" | "isLoading" | "fullWidth" | "unstyled" | "variant">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
337
346
 
338
347
  type AvatarInstanceType = 'image' | 'initials';
339
348
  type AvatarImageLoadStateType = 'error' | 'loaded' | 'loading';
@@ -696,7 +705,7 @@ type CheckboxProps = Omit<ComponentPropsWithRef<'label'>, 'onChange'> & {
696
705
  */
697
706
  name?: string | undefined;
698
707
  /**
699
- * Callback function invoked when the checkbox value changes
708
+ * Callback function invoked when the value changes
700
709
  */
701
710
  onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
702
711
  /**
@@ -1242,7 +1251,7 @@ type IconButtonProps = {
1242
1251
  */
1243
1252
  label: string;
1244
1253
  /**
1245
- * The Icon component to use, e.g. `<Icon type="favorite" />`
1254
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
1246
1255
  */
1247
1256
  children: JSX.Element;
1248
1257
  } & (Omit<ButtonAsButtonProps, 'fullWidth' | 'leftIcon' | 'rightIcon'> | Omit<ButtonAsLinkProps, 'fullWidth' | 'leftIcon' | 'rightIcon'>);
@@ -1256,19 +1265,19 @@ declare const IconButton: react.ForwardRefExoticComponent<(Omit<{
1256
1265
  */
1257
1266
  label: string;
1258
1267
  /**
1259
- * The Icon component to use, e.g. `<Icon type="favorite" />`
1268
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
1260
1269
  */
1261
1270
  children: JSX.Element;
1262
- } & Omit<ButtonAsButtonProps, "leftIcon" | "fullWidth" | "rightIcon">, "ref"> | Omit<{
1271
+ } & Omit<ButtonAsButtonProps, "leftIcon" | "rightIcon" | "fullWidth">, "ref"> | Omit<{
1263
1272
  /**
1264
1273
  * Accessible text for screen readers. Also shows up in a tooltip unless `disableTooltip` is true.
1265
1274
  */
1266
1275
  label: string;
1267
1276
  /**
1268
- * The Icon component to use, e.g. `<Icon type="favorite" />`
1277
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
1269
1278
  */
1270
1279
  children: JSX.Element;
1271
- } & Omit<ButtonAsLinkProps, "leftIcon" | "fullWidth" | "rightIcon">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
1280
+ } & Omit<ButtonAsLinkProps, "leftIcon" | "rightIcon" | "fullWidth">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
1272
1281
 
1273
1282
  type InputProps = Omit<InputHTMLAttributes<HTMLInputElement | HTMLTextAreaElement>, 'type'> & {
1274
1283
  /**
@@ -2012,6 +2021,76 @@ declare const ScreenReaderOnly: {
2012
2021
  displayName: string;
2013
2022
  };
2014
2023
 
2024
+ type SegmentedControlProps = Omit<ToggleGroupSingleProps, 'type'> & {
2025
+ /**
2026
+ * `SegmentedControlItem`s that will be rendered in grouping
2027
+ */
2028
+ children?: ReactNode;
2029
+ /**
2030
+ * Set the entire `SegmentedControl` to be disabled
2031
+ */
2032
+ disabled?: boolean | undefined;
2033
+ /**
2034
+ * Force `SegmentedControl` to fill the width of it's container
2035
+ */
2036
+ fullWidth?: boolean | undefined;
2037
+ /**
2038
+ * Callback function invoked when the value changes
2039
+ */
2040
+ onSelectedValueChange: (value: string) => void;
2041
+ /**
2042
+ * The value of the `SegmentedControlItem` which should be selected
2043
+ */
2044
+ selectedValue: string;
2045
+ };
2046
+ /**
2047
+ * Provides a horizontal set of segments for switching between different values
2048
+ */
2049
+ declare const SegmentedControl: ForwardRefExoticComponent<RefAttributes<HTMLDivElement> & SegmentedControlProps>;
2050
+
2051
+ type BaseProps = {
2052
+ /**
2053
+ * Disable the `SegmentedControlItem`
2054
+ */
2055
+ disabled?: boolean | undefined;
2056
+ /**
2057
+ * The value of the item
2058
+ */
2059
+ value: string;
2060
+ };
2061
+ type IconWithLabel = {
2062
+ /**
2063
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
2064
+ */
2065
+ icon?: JSX.Element;
2066
+ /**
2067
+ * The label of the item
2068
+ */
2069
+ label?: ReactNode | string | undefined;
2070
+ 'aria-label'?: never;
2071
+ };
2072
+ type IconWithAriaLabel = {
2073
+ /**
2074
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
2075
+ */
2076
+ icon?: JSX.Element;
2077
+ /**
2078
+ * Use this when displaying an icon without a label
2079
+ */
2080
+ 'aria-label'?: string | undefined;
2081
+ label?: never;
2082
+ };
2083
+ type NoIcon = {
2084
+ icon?: undefined;
2085
+ /**
2086
+ * The label of the item
2087
+ */
2088
+ label?: ReactNode | string | undefined;
2089
+ 'aria-label'?: never;
2090
+ };
2091
+ type SegmentedControlItemProps = BaseProps & (IconWithAriaLabel | IconWithLabel | NoIcon);
2092
+ declare const SegmentedControlItem: react.ForwardRefExoticComponent<SegmentedControlItemProps & react.RefAttributes<HTMLButtonElement>>;
2093
+
2015
2094
  type StackProps = {
2016
2095
  /**
2017
2096
  * Optional children
@@ -2239,30 +2318,4 @@ type SelectOptionGroupProps = {
2239
2318
  };
2240
2319
  declare const SelectOptionGroup: ({ children, label, ...props }: SelectOptionGroupProps) => react_jsx_runtime.JSX.Element;
2241
2320
 
2242
- type AnalyticsCardProps = ComponentPropsWithoutRef<'div'> & {
2243
- /**
2244
- * Label text displayed above the value
2245
- */
2246
- label: ReactNode;
2247
- /**
2248
- * Main value to display in the card
2249
- */
2250
- value: ReactNode;
2251
- /**
2252
- * Optional content to display in the top-right corner
2253
- */
2254
- upperRightSlot?: ReactNode;
2255
- /**
2256
- * Sets the color scheme of the card
2257
- */
2258
- colorScheme?: ColorSchemeTypes;
2259
- };
2260
- /**
2261
- * Component description goes here
2262
- */
2263
- declare const AnalyticsCard: {
2264
- ({ label, value, slot, colorScheme, ...props }: AnalyticsCardProps): JSX.Element;
2265
- displayName: string;
2266
- };
2267
-
2268
- export { ActionButton, type ActionButtonProps, AnalyticsCard, type AnalyticsCardProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };
2321
+ export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };
package/dist/index.d.ts CHANGED
@@ -1,9 +1,10 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as react from 'react';
3
- import { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ChangeEvent, ForwardedRef, Ref, JSXElementConstructor, ElementType as ElementType$1, InputHTMLAttributes, RefObject } from 'react';
3
+ import { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ChangeEvent, ForwardedRef, Ref, JSXElementConstructor, ElementType as ElementType$1, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes } from 'react';
4
4
  import { LinkProps as LinkProps$1 } from 'react-router-dom';
5
5
  import * as styled_components from 'styled-components';
6
6
  import { DropdownMenuContentProps, DropdownMenuItemProps, DropdownMenuRadioGroupProps, DropdownMenuRadioItemProps, DropdownMenuCheckboxItemProps } from '@radix-ui/react-dropdown-menu';
7
+ import { ToggleGroupSingleProps } from '@radix-ui/react-toggle-group';
7
8
 
8
9
  type UIProviderProps = {
9
10
  children: ReactNode;
@@ -102,7 +103,7 @@ declare const ColorSchemeWrapper: {
102
103
  type ButtonVariants = 'ghost' | 'outline' | 'soft' | 'solid';
103
104
 
104
105
  type LinkTypes = 'default' | 'email' | 'external' | 'phone';
105
- type BaseProps = {
106
+ type BaseProps$1 = {
106
107
  /**
107
108
  * A Promise to invoke before navigating to location.
108
109
  * _Caution: if used with `external` type prop a new window will **not** be opened_
@@ -122,6 +123,14 @@ type BaseProps = {
122
123
  * Disables the link
123
124
  */
124
125
  disabled?: boolean;
126
+ /**
127
+ * Icon to display on the left side of the link, Must be an instance of [Icon](?path=/docs/components-icon--docs)
128
+ */
129
+ leftIcon?: JSX.Element | undefined;
130
+ /**
131
+ * Icon to display on the right side of the link, Must be an instance of [Icon](?path=/docs/components-icon--docs)
132
+ */
133
+ rightIcon?: JSX.Element | undefined;
125
134
  /**
126
135
  * Type of link to display
127
136
  *
@@ -135,11 +144,11 @@ type BaseProps = {
135
144
  */
136
145
  underline?: boolean;
137
146
  };
138
- type LinkAsLinkProps = BaseProps & ComponentPropsWithRef<'a'> & Omit<LinkProps$1, 'to'> & {
147
+ type LinkAsLinkProps = BaseProps$1 & ComponentPropsWithRef<'a'> & Omit<LinkProps$1, 'to'> & {
139
148
  href: string | undefined;
140
149
  type?: LinkTypes;
141
150
  };
142
- type LinkAsButtonProps = BaseProps & ComponentPropsWithRef<'button'> & {
151
+ type LinkAsButtonProps = BaseProps$1 & ComponentPropsWithRef<'button'> & {
143
152
  href?: never;
144
153
  type?: 'button' | 'reset' | 'submit';
145
154
  };
@@ -280,7 +289,7 @@ declare const useWindowSize: (interval?: number) => {
280
289
 
281
290
  type ActionButtonProps = {
282
291
  /**
283
- * The Icon component to use, e.g. `<Icon type="favorite" />`
292
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
284
293
  */
285
294
  icon: JSX.Element;
286
295
  /**
@@ -301,7 +310,7 @@ type ActionButtonProps = {
301
310
  */
302
311
  declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
303
312
  /**
304
- * The Icon component to use, e.g. `<Icon type="favorite" />`
313
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
305
314
  */
306
315
  icon: JSX.Element;
307
316
  /**
@@ -316,9 +325,9 @@ declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
316
325
  * Changes the secondary icon for different use cases
317
326
  */
318
327
  variant?: "default" | "gated" | "menu-down" | "menu-up";
319
- } & Omit<ButtonAsButtonProps, "size" | "isLoading" | "leftIcon" | "fullWidth" | "unstyled" | "rightIcon" | "variant">, "ref"> | Omit<{
328
+ } & Omit<ButtonAsButtonProps, "size" | "leftIcon" | "rightIcon" | "isLoading" | "fullWidth" | "unstyled" | "variant">, "ref"> | Omit<{
320
329
  /**
321
- * The Icon component to use, e.g. `<Icon type="favorite" />`
330
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
322
331
  */
323
332
  icon: JSX.Element;
324
333
  /**
@@ -333,7 +342,7 @@ declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
333
342
  * Changes the secondary icon for different use cases
334
343
  */
335
344
  variant?: "default" | "gated" | "menu-down" | "menu-up";
336
- } & Omit<ButtonAsLinkProps, "size" | "isLoading" | "leftIcon" | "fullWidth" | "unstyled" | "rightIcon" | "variant">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
345
+ } & Omit<ButtonAsLinkProps, "size" | "leftIcon" | "rightIcon" | "isLoading" | "fullWidth" | "unstyled" | "variant">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
337
346
 
338
347
  type AvatarInstanceType = 'image' | 'initials';
339
348
  type AvatarImageLoadStateType = 'error' | 'loaded' | 'loading';
@@ -696,7 +705,7 @@ type CheckboxProps = Omit<ComponentPropsWithRef<'label'>, 'onChange'> & {
696
705
  */
697
706
  name?: string | undefined;
698
707
  /**
699
- * Callback function invoked when the checkbox value changes
708
+ * Callback function invoked when the value changes
700
709
  */
701
710
  onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
702
711
  /**
@@ -1242,7 +1251,7 @@ type IconButtonProps = {
1242
1251
  */
1243
1252
  label: string;
1244
1253
  /**
1245
- * The Icon component to use, e.g. `<Icon type="favorite" />`
1254
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
1246
1255
  */
1247
1256
  children: JSX.Element;
1248
1257
  } & (Omit<ButtonAsButtonProps, 'fullWidth' | 'leftIcon' | 'rightIcon'> | Omit<ButtonAsLinkProps, 'fullWidth' | 'leftIcon' | 'rightIcon'>);
@@ -1256,19 +1265,19 @@ declare const IconButton: react.ForwardRefExoticComponent<(Omit<{
1256
1265
  */
1257
1266
  label: string;
1258
1267
  /**
1259
- * The Icon component to use, e.g. `<Icon type="favorite" />`
1268
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
1260
1269
  */
1261
1270
  children: JSX.Element;
1262
- } & Omit<ButtonAsButtonProps, "leftIcon" | "fullWidth" | "rightIcon">, "ref"> | Omit<{
1271
+ } & Omit<ButtonAsButtonProps, "leftIcon" | "rightIcon" | "fullWidth">, "ref"> | Omit<{
1263
1272
  /**
1264
1273
  * Accessible text for screen readers. Also shows up in a tooltip unless `disableTooltip` is true.
1265
1274
  */
1266
1275
  label: string;
1267
1276
  /**
1268
- * The Icon component to use, e.g. `<Icon type="favorite" />`
1277
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
1269
1278
  */
1270
1279
  children: JSX.Element;
1271
- } & Omit<ButtonAsLinkProps, "leftIcon" | "fullWidth" | "rightIcon">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
1280
+ } & Omit<ButtonAsLinkProps, "leftIcon" | "rightIcon" | "fullWidth">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
1272
1281
 
1273
1282
  type InputProps = Omit<InputHTMLAttributes<HTMLInputElement | HTMLTextAreaElement>, 'type'> & {
1274
1283
  /**
@@ -2012,6 +2021,76 @@ declare const ScreenReaderOnly: {
2012
2021
  displayName: string;
2013
2022
  };
2014
2023
 
2024
+ type SegmentedControlProps = Omit<ToggleGroupSingleProps, 'type'> & {
2025
+ /**
2026
+ * `SegmentedControlItem`s that will be rendered in grouping
2027
+ */
2028
+ children?: ReactNode;
2029
+ /**
2030
+ * Set the entire `SegmentedControl` to be disabled
2031
+ */
2032
+ disabled?: boolean | undefined;
2033
+ /**
2034
+ * Force `SegmentedControl` to fill the width of it's container
2035
+ */
2036
+ fullWidth?: boolean | undefined;
2037
+ /**
2038
+ * Callback function invoked when the value changes
2039
+ */
2040
+ onSelectedValueChange: (value: string) => void;
2041
+ /**
2042
+ * The value of the `SegmentedControlItem` which should be selected
2043
+ */
2044
+ selectedValue: string;
2045
+ };
2046
+ /**
2047
+ * Provides a horizontal set of segments for switching between different values
2048
+ */
2049
+ declare const SegmentedControl: ForwardRefExoticComponent<RefAttributes<HTMLDivElement> & SegmentedControlProps>;
2050
+
2051
+ type BaseProps = {
2052
+ /**
2053
+ * Disable the `SegmentedControlItem`
2054
+ */
2055
+ disabled?: boolean | undefined;
2056
+ /**
2057
+ * The value of the item
2058
+ */
2059
+ value: string;
2060
+ };
2061
+ type IconWithLabel = {
2062
+ /**
2063
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
2064
+ */
2065
+ icon?: JSX.Element;
2066
+ /**
2067
+ * The label of the item
2068
+ */
2069
+ label?: ReactNode | string | undefined;
2070
+ 'aria-label'?: never;
2071
+ };
2072
+ type IconWithAriaLabel = {
2073
+ /**
2074
+ * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
2075
+ */
2076
+ icon?: JSX.Element;
2077
+ /**
2078
+ * Use this when displaying an icon without a label
2079
+ */
2080
+ 'aria-label'?: string | undefined;
2081
+ label?: never;
2082
+ };
2083
+ type NoIcon = {
2084
+ icon?: undefined;
2085
+ /**
2086
+ * The label of the item
2087
+ */
2088
+ label?: ReactNode | string | undefined;
2089
+ 'aria-label'?: never;
2090
+ };
2091
+ type SegmentedControlItemProps = BaseProps & (IconWithAriaLabel | IconWithLabel | NoIcon);
2092
+ declare const SegmentedControlItem: react.ForwardRefExoticComponent<SegmentedControlItemProps & react.RefAttributes<HTMLButtonElement>>;
2093
+
2015
2094
  type StackProps = {
2016
2095
  /**
2017
2096
  * Optional children
@@ -2239,30 +2318,4 @@ type SelectOptionGroupProps = {
2239
2318
  };
2240
2319
  declare const SelectOptionGroup: ({ children, label, ...props }: SelectOptionGroupProps) => react_jsx_runtime.JSX.Element;
2241
2320
 
2242
- type AnalyticsCardProps = ComponentPropsWithoutRef<'div'> & {
2243
- /**
2244
- * Label text displayed above the value
2245
- */
2246
- label: ReactNode;
2247
- /**
2248
- * Main value to display in the card
2249
- */
2250
- value: ReactNode;
2251
- /**
2252
- * Optional content to display in the top-right corner
2253
- */
2254
- upperRightSlot?: ReactNode;
2255
- /**
2256
- * Sets the color scheme of the card
2257
- */
2258
- colorScheme?: ColorSchemeTypes;
2259
- };
2260
- /**
2261
- * Component description goes here
2262
- */
2263
- declare const AnalyticsCard: {
2264
- ({ label, value, slot, colorScheme, ...props }: AnalyticsCardProps): JSX.Element;
2265
- displayName: string;
2266
- };
2267
-
2268
- export { ActionButton, type ActionButtonProps, AnalyticsCard, type AnalyticsCardProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };
2321
+ export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };