@guardian/stand 0.0.73 → 0.0.75

package/dist/components/Tile/styles.js

@@ -0,0 +1,166 @@
+import { until } from "../../styleD/utils/semantic/mq.js";
+import { componentTile } from "../../styleD/build/typescript/component/tile.js";
+import { css } from "@emotion/react";
+//#region src/components/Tile/styles.ts
+const defaultTileTheme = componentTile;
+const tileStyles = (theme, { size }) => css`
+	display: ${theme.shared.display};
+	flex-direction: ${theme.shared.flexDirection};
+	align-items: ${theme.shared.alignItems};
+	justify-content: ${theme.shared.justifyContent};
+	gap: ${theme.shared.gap};
+	min-height: ${theme[size].minHeight};
+	padding: ${theme[size].paddingY} ${theme[size].paddingX};
+	border: ${theme.shared.borderWidth} ${theme.shared.borderStyle}
+		${theme.shared.borderColor};
+	border-radius: ${theme.shared.borderRadius};
+	background-color: ${theme.shared.backgroundColor};
+	color: ${theme.shared.color};
+	text-decoration: ${theme.shared.textDecoration};
+	cursor: ${theme.shared.cursor};
+	width: ${theme[size].width};
+	max-width: ${theme.shared.maxWidth};
+	box-sizing: border-box;
+	font: inherit;
+	text-align: left;
+
+	${until.md} {
+		width: 100%;
+	}
+
+	&[data-hovered] {
+		background-color: ${theme.shared.hover.backgroundColor};
+		border-color: ${theme.shared.hover.borderColor};
+	}
+
+	&[data-pressed] {
+		background-color: ${theme.shared.pressed.backgroundColor};
+		border-color: ${theme.shared.pressed.borderColor};
+	}
+
+	&[data-selected] {
+		background-color: ${theme.shared.pressed.backgroundColor};
+		border-color: ${theme.shared.pressed.borderColor};
+	}
+
+	&[data-focus-visible] {
+		outline: ${theme.shared.focusVisible.outline};
+		outline-offset: ${theme.shared.focusVisible.outlineOffset};
+	}
+
+	&[data-disabled] {
+		color: ${theme.shared.disabled.color};
+		border-color: ${theme.shared.disabled.borderColor};
+		background-color: ${theme.shared.disabled.backgroundColor};
+		cursor: ${theme.shared.disabled.cursor};
+	}
+`;
+const selectableTileStyles = (theme, { size }) => css`
+	${tileStyles(theme, { size })}
+
+	&[data-hovered] {
+		background-color: ${theme.shared.selectableTile.shared.hover.backgroundColor};
+		border-color: ${theme.shared.hover.borderColor};
+	}
+
+	&[data-pressed] {
+		background-color: ${theme.shared.selectableTile.shared.pressed.backgroundColor};
+		border-color: ${theme.shared.pressed.borderColor};
+	}
+
+	&[data-selected] {
+		background-color: ${theme.shared.selectableTile.shared.selected.backgroundColor};
+		border-color: ${theme.shared.pressed.borderColor};
+	}
+
+	&[data-focus-visible] {
+		background-color: ${theme.shared.selectableTile.shared.focusVisible.backgroundColor};
+		border-color: ${theme.shared.pressed.borderColor};
+	}
+
+	&[data-selected][data-hovered] {
+		background-color: ${theme.shared.selectableTile.shared.selected.hover.backgroundColor};
+		border-color: ${theme.shared.pressed.borderColor};
+	}
+
+	&[data-selected][data-pressed] {
+		background-color: ${theme.shared.selectableTile.shared.selected.pressed.backgroundColor};
+		border-color: ${theme.shared.pressed.borderColor};
+	}
+
+	&[data-selected][data-focus-visible] {
+		background-color: ${theme.shared.selectableTile.shared.selected.focusVisible.backgroundColor};
+		border-color: ${theme.shared.pressed.borderColor};
+	}
+
+	&[data-disabled] {
+		color: ${theme.shared.disabled.color};
+		border-color: ${theme.shared.disabled.borderColor};
+		background-color: ${theme.shared.disabled.backgroundColor};
+		cursor: ${theme.shared.disabled.cursor};
+	}
+`;
+const tileContentStyles = (theme, { size }) => css`
+	display: flex;
+	flex-direction: row;
+	align-items: center;
+	justify-content: space-between;
+	gap: ${theme[size].gap};
+	width: 100%;
+	min-width: 0;
+`;
+const tileTextStyles = (theme) => css`
+	color: ${theme.shared.color};
+	display: flex;
+	align-items: center;
+	min-width: 0;
+	gap: 0.5rem;
+`;
+const tileTitleStyles = (theme) => css`
+	display: block;
+	line-height: 1.2;
+	color: ${theme.shared.color};
+
+	[data-disabled] & {
+		color: ${theme.shared.disabled.color};
+	}
+`;
+const tileDescriptionStyles = (theme) => css`
+	color: ${theme.shared.descriptionColor};
+	display: block;
+	line-height: 1.2;
+	min-width: 0;
+	flex: 1;
+
+	[data-disabled] & {
+		color: ${theme.shared.disabled.color};
+	}
+`;
+const tileBottomRowStyles = () => css`
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: 0.5rem;
+	width: 100%;
+	min-width: 0;
+`;
+const tileArrowStyles = (theme) => css`
+	color: ${theme.shared.tileArrow.shared.color};
+	flex-shrink: 0;
+	margin-left: auto;
+
+	[data-disabled] & {
+		color: ${theme.shared.tileArrow.shared.disabled.color};
+	}
+`;
+const tileIconStyles = (theme) => css`
+	color: ${theme.shared.tileIcon.shared.color};
+	flex-shrink: 0;
+	margin-right: 0.25rem;
+
+	[data-disabled] & {
+		color: ${theme.shared.tileIcon.shared.disabled.color};
+	}
+`;
+//#endregion
+export { defaultTileTheme, selectableTileStyles, tileArrowStyles, tileBottomRowStyles, tileContentStyles, tileDescriptionStyles, tileIconStyles, tileStyles, tileTextStyles, tileTitleStyles };

package/dist/components/Tile/types.d.cts

@@ -0,0 +1,63 @@
+import { DefaultPropsWithChildren } from "../../util/types.cjs";
+import { IconProps } from "../Icon/types.cjs";
+import { TypographyVariant } from "../Typography/types.cjs";
+import { TileTheme } from "./styles.cjs";
+import { ButtonProps, LinkProps } from "react-aria-components";
+//#region src/components/Tile/types.d.ts
+export type TileInteractionMode = 'clickable' | 'selectable' | 'multi-select';
+interface TileBaseProps extends DefaultPropsWithChildren<TileTheme> {
+  /**
+   * The interaction behavior of the Tile.
+   * @default 'clickable'
+   */
+  interactionMode?: TileInteractionMode;
+  /**
+   * Size variant of the tile.
+   * @default 'md'
+   */
+  size?: keyof Omit<TileTheme, 'shared'>;
+  /**
+   * Supporting text rendered below the title.
+   */
+  description?: React.ReactNode;
+  /**
+   * Title typography variant.
+   * @default 'bodyBoldSm'
+   */
+  typography?: TypographyVariant;
+  /**
+   * to change the typography of the description, you can pass a variant from semanticTypography.
+   * By default, it is set to "body-sm".
+   */
+  descriptionTypography?: TypographyVariant;
+  /**
+   * Optional leading icon rendered before the title.
+   */
+  icon?: IconProps['symbol'] | '' | Exclude<IconProps['children'], string>;
+}
+export type ClickableTileProps = TileBaseProps & Omit<LinkProps, 'children' | 'href'> & {
+  href: string;
+};
+type SelectionTileBaseProps = TileBaseProps & Omit<ButtonProps, 'children' | 'onPress' | 'value'> & {
+  /** Value identifying this Tile in a selection. */
+  value: string;
+  /** Whether this tile is currently selected. */
+  isSelected: boolean;
+};
+export type SelectionTileProps = SelectionTileBaseProps & ({
+  interactionMode: Extract<TileInteractionMode, 'selectable'>;
+  /** Called when this Tile is selected. */
+  onSelectionChange: (value: string) => void;
+} | {
+  interactionMode: Extract<TileInteractionMode, 'multi-select'>;
+  /** Called with the next selected state when this Tile is pressed. */
+  onSelectionChange: (value: string, isSelected: boolean) => void;
+});
+export type SelectableTileProps = Extract<SelectionTileProps, {
+  interactionMode: 'selectable';
+}>;
+export type MultiSelectTileProps = Extract<SelectionTileProps, {
+  interactionMode: 'multi-select';
+}>;
+export type TileProps = ClickableTileProps | SelectionTileProps;
+//#endregion

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

@@ -0,0 +1,63 @@
+import { DefaultPropsWithChildren } from "../../util/types.js";
+import { IconProps } from "../Icon/types.js";
+import { TypographyVariant } from "../Typography/types.js";
+import { TileTheme } from "./styles.js";
+import { ButtonProps, LinkProps } from "react-aria-components";
+//#region src/components/Tile/types.d.ts
+export type TileInteractionMode = 'clickable' | 'selectable' | 'multi-select';
+interface TileBaseProps extends DefaultPropsWithChildren<TileTheme> {
+  /**
+   * The interaction behavior of the Tile.
+   * @default 'clickable'
+   */
+  interactionMode?: TileInteractionMode;
+  /**
+   * Size variant of the tile.
+   * @default 'md'
+   */
+  size?: keyof Omit<TileTheme, 'shared'>;
+  /**
+   * Supporting text rendered below the title.
+   */
+  description?: React.ReactNode;
+  /**
+   * Title typography variant.
+   * @default 'bodyBoldSm'
+   */
+  typography?: TypographyVariant;
+  /**
+   * to change the typography of the description, you can pass a variant from semanticTypography.
+   * By default, it is set to "body-sm".
+   */
+  descriptionTypography?: TypographyVariant;
+  /**
+   * Optional leading icon rendered before the title.
+   */
+  icon?: IconProps['symbol'] | '' | Exclude<IconProps['children'], string>;
+}
+export type ClickableTileProps = TileBaseProps & Omit<LinkProps, 'children' | 'href'> & {
+  href: string;
+};
+type SelectionTileBaseProps = TileBaseProps & Omit<ButtonProps, 'children' | 'onPress' | 'value'> & {
+  /** Value identifying this Tile in a selection. */
+  value: string;
+  /** Whether this tile is currently selected. */
+  isSelected: boolean;
+};
+export type SelectionTileProps = SelectionTileBaseProps & ({
+  interactionMode: Extract<TileInteractionMode, 'selectable'>;
+  /** Called when this Tile is selected. */
+  onSelectionChange: (value: string) => void;
+} | {
+  interactionMode: Extract<TileInteractionMode, 'multi-select'>;
+  /** Called with the next selected state when this Tile is pressed. */
+  onSelectionChange: (value: string, isSelected: boolean) => void;
+});
+export type SelectableTileProps = Extract<SelectionTileProps, {
+  interactionMode: 'selectable';
+}>;
+export type MultiSelectTileProps = Extract<SelectionTileProps, {
+  interactionMode: 'multi-select';
+}>;
+export type TileProps = ClickableTileProps | SelectionTileProps;
+//#endregion

package/dist/components/ToggleSwitch/ToggleSwitch.d.cts

@@ -1,5 +1,4 @@
 import { ToggleSwitchProps } from "./types.cjs";
 //#region src/components/ToggleSwitch/ToggleSwitch.d.ts
-declare function ToggleSwitch({ children, description, size, theme, cssOverrides, ...props }: ToggleSwitchProps): import("@emotion/react/jsx-runtime").JSX.Element;
-//#endregion
-export { ToggleSwitch };
+export declare function ToggleSwitch({ children, description, size, theme, cssOverrides, ...props }: ToggleSwitchProps): import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion

package/dist/components/ToggleSwitch/ToggleSwitch.d.ts

@@ -1,5 +1,4 @@
 import { ToggleSwitchProps } from "./types.js";
 //#region src/components/ToggleSwitch/ToggleSwitch.d.ts
-declare function ToggleSwitch({ children, description, size, theme, cssOverrides, ...props }: ToggleSwitchProps): import("@emotion/react/jsx-runtime").JSX.Element;
-//#endregion
-export { ToggleSwitch };
+export declare function ToggleSwitch({ children, description, size, theme, cssOverrides, ...props }: ToggleSwitchProps): import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion

package/dist/components/ToggleSwitch/styles.d.cts

@@ -4,7 +4,6 @@ import "./types.cjs";
 import { SerializedStyles } from "@emotion/react";
 import "react-aria-components";
 //#region src/components/ToggleSwitch/styles.d.ts
-type ToggleSwitchTheme = Prettify<ComponentToggleSwitch>;
-type PartialToggleSwitchTheme = Prettify<DeepPartial<ToggleSwitchTheme>>;
-//#endregion
-export { PartialToggleSwitchTheme, ToggleSwitchTheme };
+export type ToggleSwitchTheme = Prettify<ComponentToggleSwitch>;
+export type PartialToggleSwitchTheme = Prettify<DeepPartial<ToggleSwitchTheme>>;
+//#endregion

package/dist/components/ToggleSwitch/styles.d.ts

@@ -4,7 +4,6 @@ import "./types.js";
 import { SerializedStyles } from "@emotion/react";
 import "react-aria-components";
 //#region src/components/ToggleSwitch/styles.d.ts
-type ToggleSwitchTheme = Prettify<ComponentToggleSwitch>;
-type PartialToggleSwitchTheme = Prettify<DeepPartial<ToggleSwitchTheme>>;
-//#endregion
-export { PartialToggleSwitchTheme, ToggleSwitchTheme };
+export type ToggleSwitchTheme = Prettify<ComponentToggleSwitch>;
+export type PartialToggleSwitchTheme = Prettify<DeepPartial<ToggleSwitchTheme>>;
+//#endregion

package/dist/components/ToggleSwitch/types.d.cts

@@ -2,7 +2,7 @@ import { DefaultPropsWithChildren } from "../../util/types.cjs";
 import { ToggleSwitchTheme } from "./styles.cjs";
 import { SwitchProps } from "react-aria-components";
 //#region src/components/ToggleSwitch/types.d.ts
-interface ToggleSwitchProps extends DefaultPropsWithChildren<ToggleSwitchTheme, SwitchProps['className']>, Omit<SwitchProps, 'children'> {
+export interface ToggleSwitchProps extends DefaultPropsWithChildren<ToggleSwitchTheme, SwitchProps['className']>, Omit<SwitchProps, 'children'> {
   /**
    * Size variant of the ToggleSwitch.
    * @default 'md'
@@ -13,5 +13,4 @@ interface ToggleSwitchProps extends DefaultPropsWithChildren<ToggleSwitchTheme,
    */
   description?: React.ReactNode;
 }
-//#endregion
-export { ToggleSwitchProps };
+//#endregion

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

@@ -2,7 +2,7 @@ import { DefaultPropsWithChildren } from "../../util/types.js";
 import { ToggleSwitchTheme } from "./styles.js";
 import { SwitchProps } from "react-aria-components";
 //#region src/components/ToggleSwitch/types.d.ts
-interface ToggleSwitchProps extends DefaultPropsWithChildren<ToggleSwitchTheme, SwitchProps['className']>, Omit<SwitchProps, 'children'> {
+export interface ToggleSwitchProps extends DefaultPropsWithChildren<ToggleSwitchTheme, SwitchProps['className']>, Omit<SwitchProps, 'children'> {
   /**
    * Size variant of the ToggleSwitch.
    * @default 'md'
@@ -13,5 +13,4 @@ interface ToggleSwitchProps extends DefaultPropsWithChildren<ToggleSwitchTheme,
    */
   description?: React.ReactNode;
 }
-//#endregion
-export { ToggleSwitchProps };
+//#endregion

package/dist/components/Tooltip/Tooltip.d.cts

@@ -1,5 +1,4 @@
 import { TooltipProps } from "./types.cjs";
 //#region src/components/Tooltip/Tooltip.d.ts
-declare const Tooltip: ({ children, placement, theme, cssOverrides, className, ...props }: TooltipProps) => import("@emotion/react/jsx-runtime").JSX.Element;
-//#endregion
-export { Tooltip };
+export declare const Tooltip: ({ children, placement, theme, cssOverrides, className, ...props }: TooltipProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion

package/dist/components/Tooltip/Tooltip.d.ts

@@ -1,5 +1,4 @@
 import { TooltipProps } from "./types.js";
 //#region src/components/Tooltip/Tooltip.d.ts
-declare const Tooltip: ({ children, placement, theme, cssOverrides, className, ...props }: TooltipProps) => import("@emotion/react/jsx-runtime").JSX.Element;
-//#endregion
-export { Tooltip };
+export declare const Tooltip: ({ children, placement, theme, cssOverrides, className, ...props }: TooltipProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion

package/dist/components/Tooltip/styles.d.cts

@@ -2,7 +2,6 @@ import { DeepPartial, Prettify } from "../../util/types.cjs";
 import { ComponentTooltip } from "../../styleD/build/typescript/component/tooltip.cjs";
 import { SerializedStyles } from "@emotion/react";
 //#region src/components/Tooltip/styles.d.ts
-type TooltipTheme = Prettify<ComponentTooltip>;
-type PartialTooltipTheme = Prettify<DeepPartial<TooltipTheme>>;
-//#endregion
-export { PartialTooltipTheme, TooltipTheme };
+export type TooltipTheme = Prettify<ComponentTooltip>;
+export type PartialTooltipTheme = Prettify<DeepPartial<TooltipTheme>>;
+//#endregion

package/dist/components/Tooltip/styles.d.ts

@@ -2,7 +2,6 @@ import { DeepPartial, Prettify } from "../../util/types.js";
 import { ComponentTooltip } from "../../styleD/build/typescript/component/tooltip.js";
 import { SerializedStyles } from "@emotion/react";
 //#region src/components/Tooltip/styles.d.ts
-type TooltipTheme = Prettify<ComponentTooltip>;
-type PartialTooltipTheme = Prettify<DeepPartial<TooltipTheme>>;
-//#endregion
-export { PartialTooltipTheme, TooltipTheme };
+export type TooltipTheme = Prettify<ComponentTooltip>;
+export type PartialTooltipTheme = Prettify<DeepPartial<TooltipTheme>>;
+//#endregion

package/dist/components/Tooltip/types.d.cts

@@ -1,8 +1,7 @@
 import { DefaultPropsWithChildren } from "../../util/types.cjs";
 import { TooltipTheme } from "./styles.cjs";
 //#region src/components/Tooltip/types.d.ts
-type TooltipProps = DefaultPropsWithChildren<TooltipTheme> & {
+export type TooltipProps = DefaultPropsWithChildren<TooltipTheme> & {
   placement?: 'top' | 'bottom' | 'start' | 'end';
 };
-//#endregion
-export { TooltipProps };
+//#endregion

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

@@ -1,8 +1,7 @@
 import { DefaultPropsWithChildren } from "../../util/types.js";
 import { TooltipTheme } from "./styles.js";
 //#region src/components/Tooltip/types.d.ts
-type TooltipProps = DefaultPropsWithChildren<TooltipTheme> & {
+export type TooltipProps = DefaultPropsWithChildren<TooltipTheme> & {
   placement?: 'top' | 'bottom' | 'start' | 'end';
 };
-//#endregion
-export { TooltipProps };
+//#endregion

package/dist/components/TopBar/TopBar.d.cts

@@ -1,14 +1,13 @@
 import { TopBarTheme } from "./styles.cjs";
 import { TopBarProps } from "./types.cjs";
 //#region src/components/TopBar/TopBar.d.ts
-declare function TopBarContainerRight({ children, theme }: {
+export declare function TopBarContainerRight({ children, theme }: {
   children: TopBarProps['children'];
   theme?: TopBarTheme;
 }): import("@emotion/react/jsx-runtime").JSX.Element;
-declare function TopBarContainerLeft({ children, theme }: {
+export declare function TopBarContainerLeft({ children, theme }: {
   children: TopBarProps['children'];
   theme?: TopBarTheme;
 }): import("@emotion/react/jsx-runtime").JSX.Element;
-declare function TopBar({ children, collapseBelow, theme, cssOverrides, className, ...props }: TopBarProps): import("@emotion/react/jsx-runtime").JSX.Element;
-//#endregion
-export { TopBar, TopBarContainerLeft, TopBarContainerRight };
+export declare function TopBar({ children, collapseBelow, theme, cssOverrides, className, ...props }: TopBarProps): import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion

package/dist/components/TopBar/TopBar.d.ts

@@ -1,14 +1,13 @@
 import { TopBarTheme } from "./styles.js";
 import { TopBarProps } from "./types.js";
 //#region src/components/TopBar/TopBar.d.ts
-declare function TopBarContainerRight({ children, theme }: {
+export declare function TopBarContainerRight({ children, theme }: {
   children: TopBarProps['children'];
   theme?: TopBarTheme;
 }): import("@emotion/react/jsx-runtime").JSX.Element;
-declare function TopBarContainerLeft({ children, theme }: {
+export declare function TopBarContainerLeft({ children, theme }: {
   children: TopBarProps['children'];
   theme?: TopBarTheme;
 }): import("@emotion/react/jsx-runtime").JSX.Element;
-declare function TopBar({ children, collapseBelow, theme, cssOverrides, className, ...props }: TopBarProps): import("@emotion/react/jsx-runtime").JSX.Element;
-//#endregion
-export { TopBar, TopBarContainerLeft, TopBarContainerRight };
+export declare function TopBar({ children, collapseBelow, theme, cssOverrides, className, ...props }: TopBarProps): import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion

package/dist/components/TopBar/TopBarItem/TopBarItem.d.cts

@@ -1,5 +1,4 @@
 import { TopBarItemProps } from "./types.cjs";
 //#region src/components/TopBar/TopBarItem/TopBarItem.d.ts
-declare function TopBarItem({ children, alignment, theme, cssOverrides, className, size, _menuOpen, ...props }: TopBarItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
-//#endregion
-export { TopBarItem };
+export declare function TopBarItem({ children, alignment, theme, cssOverrides, className, size, _menuOpen, ...props }: TopBarItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion

package/dist/components/TopBar/TopBarItem/TopBarItem.d.ts

@@ -1,5 +1,4 @@
 import { TopBarItemProps } from "./types.js";
 //#region src/components/TopBar/TopBarItem/TopBarItem.d.ts
-declare function TopBarItem({ children, alignment, theme, cssOverrides, className, size, _menuOpen, ...props }: TopBarItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
-//#endregion
-export { TopBarItem };
+export declare function TopBarItem({ children, alignment, theme, cssOverrides, className, size, _menuOpen, ...props }: TopBarItemProps): import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion

package/dist/components/TopBar/TopBarItem/styles.d.cts

@@ -3,7 +3,6 @@ import { ComponentTopBar } from "../../../styleD/build/typescript/component/topB
 import "./types.cjs";
 import { SerializedStyles } from "@emotion/react";
 //#region src/components/TopBar/TopBarItem/styles.d.ts
-type TopBarItemTheme = Prettify<ComponentTopBar['item']>;
-type PartialTopBarItemTheme = Prettify<DeepPartial<TopBarItemTheme>>;
-//#endregion
-export { PartialTopBarItemTheme, TopBarItemTheme };
+export type TopBarItemTheme = Prettify<ComponentTopBar['item']>;
+export type PartialTopBarItemTheme = Prettify<DeepPartial<TopBarItemTheme>>;
+//#endregion

package/dist/components/TopBar/TopBarItem/styles.d.ts

@@ -3,7 +3,6 @@ import { ComponentTopBar } from "../../../styleD/build/typescript/component/topB
 import "./types.js";
 import { SerializedStyles } from "@emotion/react";
 //#region src/components/TopBar/TopBarItem/styles.d.ts
-type TopBarItemTheme = Prettify<ComponentTopBar['item']>;
-type PartialTopBarItemTheme = Prettify<DeepPartial<TopBarItemTheme>>;
-//#endregion
-export { PartialTopBarItemTheme, TopBarItemTheme };
+export type TopBarItemTheme = Prettify<ComponentTopBar['item']>;
+export type PartialTopBarItemTheme = Prettify<DeepPartial<TopBarItemTheme>>;
+//#endregion

package/dist/components/TopBar/TopBarItem/types.d.cts

@@ -1,7 +1,7 @@
 import { DefaultProps } from "../../../util/types.cjs";
 import { TopBarItemTheme } from "./styles.cjs";
 //#region src/components/TopBar/TopBarItem/types.d.ts
-interface TopBarItemProps extends DefaultProps<TopBarItemTheme>, React.HTMLAttributes<HTMLDivElement> {
+export interface TopBarItemProps extends DefaultProps<TopBarItemTheme>, React.HTMLAttributes<HTMLDivElement> {
   children?: React.ReactNode;
   /**
    * Determines the alignment of the item within the top bar
@@ -17,5 +17,4 @@ interface TopBarItemProps extends DefaultProps<TopBarItemTheme>, React.HTMLAttri
    */
   _menuOpen?: boolean;
 }
-//#endregion
-export { TopBarItemProps };
+//#endregion

package/dist/components/TopBar/TopBarItem/types.d.ts

@@ -1,7 +1,7 @@
 import { DefaultProps } from "../../../util/types.js";
 import { TopBarItemTheme } from "./styles.js";
 //#region src/components/TopBar/TopBarItem/types.d.ts
-interface TopBarItemProps extends DefaultProps<TopBarItemTheme>, React.HTMLAttributes<HTMLDivElement> {
+export interface TopBarItemProps extends DefaultProps<TopBarItemTheme>, React.HTMLAttributes<HTMLDivElement> {
   children?: React.ReactNode;
   /**
    * Determines the alignment of the item within the top bar
@@ -17,5 +17,4 @@ interface TopBarItemProps extends DefaultProps<TopBarItemTheme>, React.HTMLAttri
    */
   _menuOpen?: boolean;
 }
-//#endregion
-export { TopBarItemProps };
+//#endregion

package/dist/components/TopBar/TopBarNavigation/TopBarNavigation.d.cts

@@ -1,5 +1,4 @@
 import { TopBarNavigationProps } from "./types.cjs";
 //#region src/components/TopBar/TopBarNavigation/TopBarNavigation.d.ts
-declare function TopBarNavigation({ text, size, isSelected, icon, menuChildren, href, onPress, isDisabled, alignment, theme, cssOverrides, className, _menuOpen, ...props }: TopBarNavigationProps): import("@emotion/react/jsx-runtime").JSX.Element;
-//#endregion
-export { TopBarNavigation };
+export declare function TopBarNavigation({ text, size, isSelected, icon, menuChildren, href, onPress, isDisabled, alignment, theme, cssOverrides, className, _menuOpen, ...props }: TopBarNavigationProps): import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion

package/dist/components/TopBar/TopBarNavigation/TopBarNavigation.d.ts

@@ -1,5 +1,4 @@
 import { TopBarNavigationProps } from "./types.js";
 //#region src/components/TopBar/TopBarNavigation/TopBarNavigation.d.ts
-declare function TopBarNavigation({ text, size, isSelected, icon, menuChildren, href, onPress, isDisabled, alignment, theme, cssOverrides, className, _menuOpen, ...props }: TopBarNavigationProps): import("@emotion/react/jsx-runtime").JSX.Element;
-//#endregion
-export { TopBarNavigation };
+export declare function TopBarNavigation({ text, size, isSelected, icon, menuChildren, href, onPress, isDisabled, alignment, theme, cssOverrides, className, _menuOpen, ...props }: TopBarNavigationProps): import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion

package/dist/components/TopBar/TopBarNavigation/styles.d.cts

@@ -3,7 +3,6 @@ import { ComponentTopBar } from "../../../styleD/build/typescript/component/topB
 import "./types.cjs";
 import { SerializedStyles } from "@emotion/react";
 //#region src/components/TopBar/TopBarNavigation/styles.d.ts
-type TopBarNavigationTheme = Prettify<ComponentTopBar['navigation']>;
-type PartialTopBarNavigationTheme = Prettify<DeepPartial<TopBarNavigationTheme>>;
-//#endregion
-export { PartialTopBarNavigationTheme, TopBarNavigationTheme };
+export type TopBarNavigationTheme = Prettify<ComponentTopBar['navigation']>;
+export type PartialTopBarNavigationTheme = Prettify<DeepPartial<TopBarNavigationTheme>>;
+//#endregion

package/dist/components/TopBar/TopBarNavigation/styles.d.ts

@@ -3,7 +3,6 @@ import { ComponentTopBar } from "../../../styleD/build/typescript/component/topB
 import "./types.js";
 import { SerializedStyles } from "@emotion/react";
 //#region src/components/TopBar/TopBarNavigation/styles.d.ts
-type TopBarNavigationTheme = Prettify<ComponentTopBar['navigation']>;
-type PartialTopBarNavigationTheme = Prettify<DeepPartial<TopBarNavigationTheme>>;
-//#endregion
-export { PartialTopBarNavigationTheme, TopBarNavigationTheme };
+export type TopBarNavigationTheme = Prettify<ComponentTopBar['navigation']>;
+export type PartialTopBarNavigationTheme = Prettify<DeepPartial<TopBarNavigationTheme>>;
+//#endregion

package/dist/components/TopBar/TopBarNavigation/types.d.cts

@@ -4,7 +4,7 @@ import { TopBarNavigationTheme } from "./styles.cjs";
 import { PressEvent } from "react-aria-components";
 import { ReactNode } from "react";
 //#region src/components/TopBar/TopBarNavigation/types.d.ts
-interface TopBarNavigationProps extends DefaultProps<TopBarNavigationTheme> {
+export interface TopBarNavigationProps extends DefaultProps<TopBarNavigationTheme> {
   /**
    * Text to display in navigation
    */
@@ -48,5 +48,4 @@ interface TopBarNavigationProps extends DefaultProps<TopBarNavigationTheme> {
    */
   _menuOpen?: boolean;
 }
-//#endregion
-export { TopBarNavigationProps };
+//#endregion

package/dist/components/TopBar/TopBarNavigation/types.d.ts

@@ -4,7 +4,7 @@ import { TopBarNavigationTheme } from "./styles.js";
 import { ReactNode } from "react";
 import { PressEvent } from "react-aria-components";
 //#region src/components/TopBar/TopBarNavigation/types.d.ts
-interface TopBarNavigationProps extends DefaultProps<TopBarNavigationTheme> {
+export interface TopBarNavigationProps extends DefaultProps<TopBarNavigationTheme> {
   /**
    * Text to display in navigation
    */
@@ -48,5 +48,4 @@ interface TopBarNavigationProps extends DefaultProps<TopBarNavigationTheme> {
    */
   _menuOpen?: boolean;
 }
-//#endregion
-export { TopBarNavigationProps };
+//#endregion

package/dist/components/TopBar/TopBarToolName/TopBarToolName.d.cts

@@ -1,5 +1,4 @@
 import { TopBarToolNameProps } from "./types.cjs";
 //#region src/components/TopBar/TopBarToolName/TopBarToolName.d.ts
-declare const TopBarToolName: ({ collapseBelow, theme, ...props }: TopBarToolNameProps) => import("@emotion/react/jsx-runtime").JSX.Element;
-//#endregion
-export { TopBarToolName };
+export declare const TopBarToolName: ({ collapseBelow, theme, ...props }: TopBarToolNameProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//#endregion