@hyphen/hyphen-components 7.3.2 → 7.3.4

package/src/components/TextareaInputInset/TextareaInputInset.tsx

@@ -211,3 +211,5 @@ export const TextareaInputInset: ForwardRefExoticComponent<TextareaInputInsetPro
       );
     }
   );
+
+TextareaInputInset.displayName = 'TextareaInputInset';

package/src/components/TimePickerNative/TimePickerNative.stories.tsx

@@ -21,7 +21,6 @@ export const Default = () => {
         id="defaultTimePickerNative"
         name="defaultTimePickerNative"
         onChange={(event: ChangeEvent<HTMLInputElement>) => {
-          console.log(event.target.value);
           setValue(event.target.value);
         }}
         label="Pick a Time"

package/src/components/Toast/Toast.store.ts

@@ -90,7 +90,7 @@ const createReducer =
     handlers: THandlers
   ) =>
   (state: TState = initialState, action: TAction) => {
-    if (handlers.hasOwnProperty(action.type)) {
+    if (Object.prototype.hasOwnProperty.call(handlers, action.type)) {
       // eslint-disable-line
       return handlers[action.type](state, action);
     }

package/src/components/Toast/Toast.stories.tsx

@@ -4,6 +4,7 @@ import { ToastContainer, ToastPosition, toast } from './';
 import { Button } from '../Button/Button';
 import { Table } from '../Table/Table';
 import { Box } from '../Box/Box';
+import { Cell, Column as ColumnType } from 'src/types';
 
 const meta: Meta<typeof ToastContainer> = {
   title: 'Components/Toast',
@@ -84,12 +85,12 @@ export const Column = () =>
         description: 'Whether to render a compact toast (smaller padding)',
       },
     ];
-    const columnConfig = [
+    const columnConfig: ColumnType[] = [
       { heading: 'Name', dataKey: 'name' },
       {
         heading: 'Type',
         dataKey: 'type',
-        render: (cell: any) => <code style={codePreviewStyle}>{cell}</code>,
+        render: (cell?: Cell) => <code style={codePreviewStyle}>{cell}</code>,
       },
       { heading: 'Description', dataKey: 'description' },
     ];

package/src/components/Toast/Toast.test.tsx

@@ -258,10 +258,11 @@ describe('Toast', () => {
     test('Async Success', async () => {
       render(<ToastContainer />);
 
-      const myPromise = new Promise(async (resolve) => {
+      const myPromise = new Promise((resolve) => {
         // eslint-disable-line no-async-promise-executor
-        await wait(1000);
-        resolve('yay');
+        wait(1000).then(() => {
+          resolve('yay');
+        });
       });
 
       act(() => {
@@ -287,10 +288,11 @@ describe('Toast', () => {
     test('Async Error', async () => {
       render(<ToastContainer />);
 
-      const myPromise = new Promise(async (_resolve, reject) => {
+      const myPromise = new Promise((_resolve, reject) => {
         // eslint-disable-line no-async-promise-executor
-        await wait(1000);
-        reject('boo'); // eslint-disable-line prefer-promise-reject-errors
+        wait(1000).then(() => {
+          reject('boo'); // eslint-disable-line prefer-promise-reject-errors
+        });
       });
 
       act(() => {

package/src/components/Toggle/Toggle.tsx

@@ -30,4 +30,6 @@ const Toggle = forwardRef<
   </TogglePrimitive.Root>
 ));
 
+Toggle.displayName = 'Toggle';
+
 export { Toggle };

package/src/components/ToggleGroup/ToggleGroup.tsx

@@ -54,6 +54,8 @@ const ToggleGroup = forwardRef<
   )
 );
 
+ToggleGroup.displayName = 'ToggleGroup';
+
 type ToggleGroupItemProps = React.ComponentPropsWithoutRef<
   typeof ToggleGroupPrimitive.Item
 > & {

package/src/docs/Colors.mdx

@@ -31,19 +31,6 @@ import designTokens from '@hyphen/hyphen-design-tokens/build/json/variables.json
       return acc;
     }, {})}
   />
-  <ColorItem
-    title="color-base-primary"
-    subtitle="Primary"
-    colors={Object.keys(designTokens.color.base.primary).reduce(
-      (acc, item, i) => {
-        acc[item] = Object.keys(designTokens.color.base.primary).map(
-          (g) => designTokens.color.base.primary[g].value
-        )[i];
-        return acc;
-      },
-      {}
-    )}
-  />
   <ColorItem
     title="color-base-red"
     subtitle="Red"

package/src/index.ts

@@ -55,3 +55,5 @@ export * from './components/Toggle/Toggle';
 export * from './components/ToggleGroup/ToggleGroup';
 export * from './components/Tooltip/Tooltip';
 export * from './hooks';
+export * from './types';
+export * from './lib';

package/src/lib/getColumnKeys.ts

@@ -5,7 +5,7 @@ import { Column } from '../types';
 export const getColumnKeys = (columns: Column[]): Key[] => {
   const INTERNAL_KEY_PREFIX = 'columnKeyPrefix';
   const columnKeys: React.Key[] = [];
-  const keys: Record<any, boolean> = {};
+  const keys: Record<string, boolean> = {};
 
   columns.forEach((column) => {
     const { key, dataKey } = column || {};
@@ -15,10 +15,10 @@ export const getColumnKeys = (columns: Column[]): Key[] => {
 
     let mergedKey = key || shapedDataKey || INTERNAL_KEY_PREFIX;
 
-    while (keys[mergedKey as any]) {
+    while (keys[String(mergedKey)]) {
       mergedKey = `${mergedKey}_next`;
     }
-    keys[mergedKey as any] = true;
+    keys[String(mergedKey)] = true;
 
     columnKeys.push(mergedKey);
   });

package/src/lib/mergeRefs.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 
-export function mergeRefs<T = any>(
+export function mergeRefs<T = unknown>(
   refs: Array<React.MutableRefObject<T> | React.LegacyRef<T> | undefined | null>
 ): React.RefCallback<T> {
   return (value) => {

package/src/lib/tokens.ts

@@ -93,7 +93,7 @@ export const BORDER_COLOR_OPTIONS = Object.keys(
 // export const BORDER_COLOR_VALUES = designTokens.color.border;
 
 export const FONT_SIZE_OPTIONS = Object.keys(
-  (designTokens.size as any)['font-size']
+  designTokens.size['font-size']
 ) as FontSize[];
 // export const FONT_SIZE_VALUES = Object.values(designTokens.size['font-size']);
 
@@ -103,7 +103,7 @@ export const FONT_FAMILY_OPTIONS = Object.keys(
 // export const FONT_FAMILY_VALUES = designTokens.assets['font-family'];
 
 export const FONT_WEIGHT_OPTIONS = Object.keys(
-  (designTokens.size as any)['font-weight']
+  designTokens.size['font-weight']
 ) as FontWeight[];
 // export const FONT_WEIGHT_VALUES = designTokens.size['font-weight'];
 
@@ -112,7 +112,7 @@ export const HEADING_SIZE_OPTIONS = Object.keys(
 ) as HeadingSize[];
 
 export const HEIGHT_OPTIONS = Object.keys(
-  (designTokens.size as any).dimension
+  designTokens.size.dimension
 ) as HeightSize[];
 // export const HEIGHT_VALUES = designTokens.size.dimension;
 
@@ -127,7 +127,7 @@ export const SPACING_OPTIONS = Object.keys(
 // export const SPACING_VALUES = designTokens.size.spacing;
 
 export const WIDTH_OPTIONS = Object.keys(
-  (designTokens.size as any).dimension
+  designTokens.size.dimension
 ) as WidthSize[];
 // export const WIDTH_VALUES = designTokens.size.dimension;
 

package/dist/components/Alert/Alert.constants.d.ts

@@ -1,8 +0,0 @@
-import { IconName } from '../../types';
-import { AlertVariant } from './Alert.types';
-export declare const ALERT_VARIANTS: AlertVariant[];
-export declare const ALERT_ICONS_MAP: {
-    [key in AlertVariant]: {
-        icon: IconName;
-    };
-};

package/dist/components/Alert/Alert.d.ts

@@ -1,42 +0,0 @@
-import React, { ReactNode, MouseEvent, KeyboardEvent } from 'react';
-import { AlertVariant } from './Alert.types';
-export interface AlertProps {
-    /**
-     * Custom class to apply to the alert.
-     */
-    className?: string;
-    /**
-     * Whether the alert as an icon that corresponds to its variant (Success, warning, etc.).
-     */
-    hasIcon?: boolean;
-    /**
-     * Renders a version of the alert with smaller padding.
-     */
-    isCompact?: boolean;
-    /**
-     * @deprecated Use children instead. The text message or ReactNode to be rendered in the alert.
-     */
-    message?: string | ReactNode;
-    /**
-     * Whether the alert can be closed by the user. If `true` it will render
-     * the 'close' icon on the right hand side of the alert.
-     */
-    onClose?: (event: MouseEvent<HTMLOrSVGElement> | KeyboardEvent<HTMLSpanElement>) => void;
-    /**
-     * A render function that returns JSX if preferred over a static ReactNode or string.
-     */
-    render?: () => ReactNode;
-    /**
-     * The title for the alert.
-     */
-    title?: string;
-    /**
-     * The type/color of the alert to show.
-     */
-    variant?: AlertVariant;
-    /**
-     * Additional props to be spread to rendered element
-     */
-    [x: string]: any;
-}
-export declare const Alert: React.NamedExoticComponent<AlertProps>;

package/dist/components/Alert/Alert.stories.d.ts

@@ -1,12 +0,0 @@
-import { Alert } from './Alert';
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import React from 'react';
-declare const meta: Meta<typeof Alert>;
-export default meta;
-type Story = StoryObj<typeof Alert>;
-export declare const Overview: Story;
-export declare const Compact: Story;
-export declare const WithCustomContent: Story;
-export declare const Variants: Story;
-export declare const ClosableAlert: () => React.JSX.Element;
-export declare const Closable: Story;

package/dist/components/Alert/Alert.types.d.ts

@@ -1,7 +0,0 @@
-import { BackgroundColor, FontColor, IconName } from '../../types';
-export type AlertVariant = 'info' | 'success' | 'warning' | 'danger' | 'default';
-export type AlertAttributes = {
-    icon: IconName;
-    color: FontColor;
-    background: BackgroundColor;
-};

package/dist/components/AspectRatio/AspectRatio.d.ts

@@ -1,3 +0,0 @@
-import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
-declare const AspectRatio: import("react").ForwardRefExoticComponent<AspectRatioPrimitive.AspectRatioProps & import("react").RefAttributes<HTMLDivElement>>;
-export { AspectRatio };

package/dist/components/AspectRatio/AspectRatio.stories.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-import type { Meta } from '@storybook/react-vite';
-import { AspectRatio } from './AspectRatio';
-declare const meta: Meta<typeof AspectRatio>;
-export default meta;
-export declare const Usage: () => React.JSX.Element;

package/dist/components/Badge/Badge.d.ts

@@ -1,24 +0,0 @@
-import React, { ReactNode } from 'react';
-import { FontSize, BaseSpacing, ResponsiveProp } from '../../types';
-import { BoxProps } from '../Box/Box';
-export type BadgeSize = 'sm' | 'md' | 'lg';
-export type BadgeVariant = 'light-grey' | 'dark-grey' | 'inverse' | 'green' | 'yellow' | 'blue' | 'red' | 'purple' | 'hyphen';
-export type BadgeSizeAttributes = {
-    fontSize: FontSize;
-    padding: BaseSpacing;
-};
-export interface BadgeProps extends BoxProps {
-    /**
-     * @deprecated Use children instead. The text message or ReactNode to be rendered in the badge.
-     */
-    message?: string | ReactNode;
-    /**
-     * The size of the button.
-     */
-    size?: BadgeSize | ResponsiveProp<BadgeSize>;
-    /**
-     * The type/color of the badge to show.
-     */
-    variant?: BadgeVariant;
-}
-export declare const Badge: React.ForwardRefExoticComponent<Omit<BadgeProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Badge/Badge.stories.d.ts

@@ -1,8 +0,0 @@
-import { Badge } from './Badge';
-import type { Meta, StoryObj } from '@storybook/react-vite';
-declare const meta: Meta<typeof Badge>;
-export default meta;
-type Story = StoryObj<typeof Badge>;
-export declare const Overview: Story;
-export declare const Variants: Story;
-export declare const Sizes: Story;

package/dist/components/Box/Box.d.ts

@@ -1,247 +0,0 @@
-import * as CSS from 'csstype';
-import { BaseSpacing, BorderRadiusSize, BorderSize, BoxShadowSize, CssAlignContentValue, CssAlignItemsValue, CssDisplayValue, CssFlexDirectionValue, CssFlexValue, CssJustifyContentValue, CssOverflowValue, CssTextAlignValue, DimensionSize, FontColor, FontFamily, FontSize, FontWeight, ResponsiveProp, SpacingSize, ZIndexSize, BackgroundColor, BorderColor, CssWhiteSpaceValue, CssWordBreakValue, TextWrap, TextTransform } from '../../types';
-import { CSSProperties, FC, ReactNode } from 'react';
-import { KnownKeys } from '../../types/lib.types';
-export type HoverableBoxProperties = 'color' | 'borderColor' | 'shadow' | 'background';
-export interface BoxProps {
-    /**
-     * The element type to be rendered.
-     */
-    as?: string;
-    /**
-     * How to align the contents along the cross axis.
-     */
-    alignItems?: CssAlignItemsValue | ResponsiveProp<CssAlignItemsValue>;
-    /**
-     * How to align the contents when there is extra space in the cross axis.
-     * This property has no effect when there is only one line of flex items.
-     */
-    alignContent?: CssAlignContentValue | ResponsiveProp<CssAlignContentValue>;
-    /**
-     * How to align along the cross axis when contained in a Box.
-     * This allows the default alignment (or the one specified by `align`) to be overridden for the individual Box.
-     */
-    alignSelf?: CssAlignItemsValue | ResponsiveProp<CssAlignItemsValue>;
-    /**
-     * Any valid background color token, or a `url()` for an image
-     */
-    background?: BackgroundColor;
-    /**
-     * Any valid border color token
-     */
-    borderColor?: BorderColor;
-    /**
-     * Width of the Box's border
-     * Can be a single [border width token](/?path=/docs/foundation-design-tokens--docs#border-width).
-     * Can also be a string of [border width tokens](/?path=/docs/foundation-design-tokens--docs#border-width)
-     * that models itself after the css shorthand property,
-     * where you can set the border width on all four sides of an element.
-     * e.g: "0 sm xs 0" --> top: 0, right: sm, bottom: xs, left: 0;
-     */
-    borderWidth?: BorderSize | string | ResponsiveProp<BorderSize | string>;
-    /**
-     * Additional class names to add
-     */
-    className?: string;
-    /**
-     * The amount of spacing (implemented as margin) between child elements.
-     * Can be a single [spacing value](/?path=/docs/foundation-design-tokens--docs#spacing).
-     * NOTE: this prop is incompatible with reverse flex direction values (row-reverse, column-reverse).
-     * For grid and flex layouts, use 'gap' instead.
-     */
-    childGap?: SpacingSize | ResponsiveProp<SpacingSize>;
-    /**
-     * The box's contents
-     */
-    children?: ReactNode;
-    /**
-     * A color token identifier to use for the text color.
-     */
-    color?: FontColor;
-    /**
-     * Sets the gaps (gutters) between columns.
-     */
-    columnGap?: BaseSpacing | ResponsiveProp<BaseSpacing>;
-    /**
-     * Cursor style. Use any standard CSS value.
-     */
-    cursor?: CSS.Property.Cursor;
-    /**
-     * Sets how flex items are placed inside the Box, defining the main axis and the direction
-     * NOTE: reverse directions are incompatible with the `childGap` prop.
-     */
-    direction?: CssFlexDirectionValue | ResponsiveProp<CssFlexDirectionValue>;
-    /**
-     * Display property. Only select values supported.
-     */
-    display?: CssDisplayValue | ResponsiveProp<CssDisplayValue>;
-    /**
-     * Can be used as shorthand for the flexbox css properties `flex-grow`, `flex-shrink`, `flex-basis`
-     */
-    flex?: CssFlexValue | ResponsiveProp<CssFlexValue>;
-    /**
-     * Pass style modifiers for focus states. The following properties can be modified on focus.
-     * `* background`
-     * `* borderColor`
-     * `* borderWidth`
-     * `* color`
-     * `* shadow`
-     */
-    focus?: {
-        background?: BoxProps['background'];
-        borderColor?: BoxProps['borderColor'];
-        borderWidth?: BoxProps['borderWidth'];
-        color?: BoxProps['color'];
-        shadow?: BoxProps['shadow'];
-    };
-    /**
-     * The [font family token](/?path=/docs/foundation-design-tokens--docs#font-family) identifier for the Box's text
-     */
-    fontFamily?: FontFamily | ResponsiveProp<FontFamily>;
-    /**
-     * The [font size token](/?path=/docs/foundation-design-tokens--docs#font-size) identifier for the Box's text
-     */
-    fontSize?: FontSize | ResponsiveProp<FontSize>;
-    /**
-     * The [font weight token](/?path=/docs/design-tokens-design-tokens--page#font-weight) identifier for the Box's text
-     */
-    fontWeight?: FontWeight | ResponsiveProp<FontWeight>;
-    /**
-     * The height of the element. Can be given a standard css value (px, rem, em, %),
-     * or a [height token](/?path=/docs/foundation-design-tokens--docs#height)
-     */
-    height?: DimensionSize | ResponsiveProp<DimensionSize> | string;
-    /**
-     * Pass style modifiers for hover states. The following properties can be modified on hover:
-     * `* background`
-     * `* borderColor`
-     * `* borderWidth`
-     * `* color`
-     * `* fontSize`
-     * `* shadow`
-     */
-    hover?: {
-        background?: BoxProps['background'];
-        borderColor?: BoxProps['borderColor'];
-        borderWidth?: BoxProps['borderWidth'];
-        color?: BoxProps['color'];
-        fontSize?: BoxProps['fontSize'];
-        shadow?: BoxProps['shadow'];
-    };
-    /**
-     * Sets the gaps (gutters) between rows and columns.
-     */
-    gap?: BaseSpacing | ResponsiveProp<BaseSpacing>;
-    /**
-     * How space between and around content items is distributed along the main-axis a flex Box
-     */
-    justifyContent?: CssJustifyContentValue | ResponsiveProp<CssJustifyContentValue>;
-    /**
-     * Amount of space around the element.
-     * Can be a single [spacing value](/?path=/docs/foundation-design-tokens--docs#spacing).
-     * Can also be a string of [spacing value](/?path=/docs/foundation-design-tokens--docs#spacing)
-     * that models itself after the css shorthand property,
-     * where you can set the margin area on all four sides of an element. It is shorthand for top, right, bottom, left.
-     */
-    margin?: BaseSpacing | ResponsiveProp<BaseSpacing>;
-    /**
-     * The maximum height of the element. Can be given a standard css value (px, rem, em, %),
-     * or a [height token](/?path=/docs/foundation-design-tokens--docs#height)
-     */
-    maxHeight?: DimensionSize | ResponsiveProp<DimensionSize> | string;
-    /**
-     * The minimum height of the element. Can be given a standard css value (px, rem, em, %),
-     * or a [height token](/?path=/docs/foundation-design-tokens--docs#height)
-     */
-    minHeight?: DimensionSize | ResponsiveProp<DimensionSize> | string;
-    /**
-     * The maximum width of the element. Can be given a standard css value (px, rem, em, %),
-     * or a [width token](/?path=/docs/foundation-design-tokens--docs#width)
-     */
-    maxWidth?: DimensionSize | ResponsiveProp<DimensionSize> | string;
-    /**
-     * The minimum width of the element. Can be given a standard css value (px, rem, em, %),
-     * or a [width token](/?path=/docs/foundation-design-tokens--docs#width)
-     */
-    minWidth?: DimensionSize | ResponsiveProp<DimensionSize> | string;
-    /**
-     * The css overflow behavior of the Box
-     */
-    overflow?: CssOverflowValue | ResponsiveProp<CssOverflowValue>;
-    /**
-     * Amount of space within the element around the Box contents.
-     * Can be a single [spacing value](/?path=/docs/foundation-design-tokens--docs#spacing).
-     * Can also be a string of [spacing value](/?path=/docs/foundation-design-tokens--docs#spacing)
-     * that models itself after the css shorthand property,
-     * where you can set the margin area on all four sides of an element. It is shorthand for top, right, bottom, left.
-     */
-    padding?: BaseSpacing | ResponsiveProp<BaseSpacing>;
-    /**
-     * CSS position property.
-     */
-    position?: CSS.Property.Position | ResponsiveProp<CSS.Property.Position>;
-    /**
-     * Set the radius of all corners
-     */
-    radius?: BorderRadiusSize | ResponsiveProp<BorderRadiusSize>;
-    /**
-     * Sets the gaps (gutters) between rows.
-     */
-    rowGap?: BaseSpacing | ResponsiveProp<BaseSpacing>;
-    /**
-     * The size of the drop shadow applied to the Box
-     */
-    shadow?: BoxShadowSize | ResponsiveProp<BoxShadowSize>;
-    /**
-     * CSS Style object
-     */
-    style?: CSSProperties;
-    /**
-     * the alignment of the text
-     */
-    textAlign?: CssTextAlignValue | ResponsiveProp<CssTextAlignValue>;
-    /**
-     * Control the text transformation of the Box
-     */
-    textTransform?: TextTransform | ResponsiveProp<TextTransform>;
-    /**
-     * Control the text wrapping behavior of the Box
-     */
-    textWrap?: TextWrap | ResponsiveProp<TextWrap>;
-    /**
-     * Control the whitespace behavior of the Box
-     */
-    whiteSpace?: CssWhiteSpaceValue | ResponsiveProp<CssWhiteSpaceValue>;
-    /**
-     * Control the word break behavior of the Box
-     */
-    wordBreak?: CssWordBreakValue | ResponsiveProp<CssWordBreakValue>;
-    /**
-     * By default, a Box's items will all try to fit onto one line.
-     * Change that and allow the items to wrap as needed wrap
-     */
-    wrap?: boolean | ResponsiveProp<boolean>;
-    /**
-     * The width of the element. Can be given a standard css value (px, rem, em, %),
-     * or a [width token](/?path=/docs/foundation-design-tokens--docs#width)
-     */
-    width?: DimensionSize | ResponsiveProp<DimensionSize> | string;
-    /**
-     * Control the word break behavior of the Box
-     */
-    /**
-     * ZIndex value for the element. Can be one of the predetermined token values.
-     * Can be responsive.
-     */
-    zIndex?: ZIndexSize | ResponsiveProp<ZIndexSize>;
-    /**
-     * Additional props to be spread to rendered element
-     */
-    [x: string]: any;
-}
-/**
- * A `<Box>` is a layout component to build UIs with consistent padding and spacing between
- * elements.
- */
-export declare const Box: FC<BoxProps>;
-export declare const boxPropsKeys: (keyof Pick<BoxProps, KnownKeys<BoxProps>>)[];

package/dist/components/Box/Box.stories.d.ts

@@ -1,46 +0,0 @@
-import React from 'react';
-import type { Meta } from '@storybook/react-vite';
-import { Box } from './Box';
-declare const meta: Meta<typeof Box>;
-export default meta;
-export declare const Overview: () => React.JSX.Element;
-export declare const Background: () => React.JSX.Element;
-export declare const Border: () => React.JSX.Element;
-export declare const Gap: () => React.JSX.Element;
-export declare const ChildGap: () => React.JSX.Element;
-export declare const FlexAuto: () => React.JSX.Element;
-export declare const FlexDirection: () => React.JSX.Element;
-export declare const FlexShrinkGrow: () => React.JSX.Element;
-export declare const FlexJustify: () => React.JSX.Element;
-export declare const FlexAlign: () => React.JSX.Element;
-export declare const FlexAlignContent: () => React.JSX.Element;
-export declare const FontColor: () => React.JSX.Element;
-export declare const FontSizes: () => React.JSX.Element;
-export declare const FontWeights: () => React.JSX.Element;
-export declare const FontFamily: () => React.JSX.Element;
-export declare const TextAlign: () => React.JSX.Element;
-export declare const Margin: () => React.JSX.Element;
-export declare const Padding: () => React.JSX.Element;
-export declare const Radius: () => React.JSX.Element;
-export declare const Shadow: () => React.JSX.Element;
-export declare const WhiteSpace: () => React.JSX.Element;
-export declare const Width: () => React.JSX.Element;
-export declare const WidthTokens: () => React.JSX.Element;
-export declare const WidthPercentages: () => React.JSX.Element;
-export declare const WidthMax: () => React.JSX.Element;
-export declare const WidthMin: () => React.JSX.Element;
-export declare const WordBreak: () => React.JSX.Element;
-export declare const Height: () => React.JSX.Element;
-export declare const HeightTokens: () => React.JSX.Element;
-export declare const HeightPercentages: () => React.JSX.Element;
-export declare const HeightMax: () => React.JSX.Element;
-export declare const HeightMin: () => React.JSX.Element;
-export declare const Overflow: () => React.JSX.Element;
-export declare const Cursor: () => React.JSX.Element;
-export declare const Position: () => React.JSX.Element;
-export declare const Hover: () => React.JSX.Element;
-export declare const Focus: () => React.JSX.Element;
-export declare const Responsive: () => React.JSX.Element;
-export declare const Omit: () => React.JSX.Element;
-export declare const TextWrap: () => React.JSX.Element;
-export declare const TextTransform: () => React.JSX.Element;

package/dist/components/Button/Button.constants.d.ts

@@ -1,3 +0,0 @@
-import { ButtonSize, ButtonVariant } from './Button';
-export declare const BUTTON_VARIANTS: ButtonVariant[];
-export declare const BUTTON_SIZES: ButtonSize[];