@atom-learning/components 6.0.0-beta.11 → 6.0.0-beta.13

package/dist/components/textarea/Textarea.d.ts

@@ -1,19 +1,19 @@
 import * as React from 'react';
-declare const StyledTextarea: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & {
+declare const StyledTextarea: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & {
     ref?: ((instance: HTMLTextAreaElement | null) => void) | React.RefObject<HTMLTextAreaElement> | null | undefined;
 }, "appearance" | "state"> & {
-    appearance?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
-    state?: ("error" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "error">>) | undefined;
+    appearance?: "standard" | "modern" | undefined;
+    state?: "error" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
+}>;
 export type TextareaProps = React.ComponentProps<typeof StyledTextarea>;
-export declare const Textarea: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & {
+export declare const Textarea: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & {
     ref?: ((instance: HTMLTextAreaElement | null) => void) | React.RefObject<HTMLTextAreaElement> | null | undefined;
 }, "appearance" | "state"> & {
-    appearance?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
-    state?: ("error" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "error">>) | undefined;
+    appearance?: "standard" | "modern" | undefined;
+    state?: "error" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLTextAreaElement>, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
+}, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
 export {};

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

@@ -1,14 +1,14 @@
 import React from 'react';
 import { TcolorScheme } from '../../experiments/color-scheme';
-export declare const StyledTile: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const StyledTile: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "border" | "borderRadius" | "diffused"> & {
-    borderRadius?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
-    border?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    diffused?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+    borderRadius?: "sm" | "md" | "lg" | undefined;
+    border?: boolean | undefined;
+    diffused?: boolean | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 type TTileProps = React.ComponentProps<typeof StyledTile> & {
     colorScheme?: TcolorScheme;
 };

package/dist/components/tile/TileGroup.d.ts

@@ -1,4 +1,4 @@
-export declare const TileGroup: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const TileGroup: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, "direction" | "align" | "wrap" | "justify" | "gap"> & {
     direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
@@ -8,4 +8,4 @@ export declare const TileGroup: import("react").ForwardRefExoticComponent<Omit<O
     gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
 } & {
     as?: import("react").ElementType;
-}, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+}>;

package/dist/components/tile-interactive/TileInteractive.d.ts

@@ -1,18 +1,18 @@
 import React from 'react';
 import { NavigatorActions } from '../../types';
-declare const StyledTileInteractive: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+declare const StyledTileInteractive: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "border" | "borderRadius" | "diffused"> & {
-    borderRadius?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
-    border?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    diffused?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+    borderRadius?: "sm" | "md" | "lg" | undefined;
+    border?: boolean | undefined;
+    diffused?: boolean | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & {
+} & {
     colorScheme?: import("../..").TcolorScheme;
 }, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 type TTileInteractiveProps = React.ComponentProps<typeof StyledTileInteractive> & React.ButtonHTMLAttributes<HTMLButtonElement> & NavigatorActions;
 export declare const TileInteractive: React.ForwardRefExoticComponent<Omit<TTileInteractiveProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/components/tile-toggle-group/TileToggleGroupItem.d.ts

@@ -1,20 +1,20 @@
 import * as ToggleGroup from '@radix-ui/react-toggle-group';
 import * as React from 'react';
-declare const StyledTileToggleGroupItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+declare const StyledTileToggleGroupItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "border" | "borderRadius" | "diffused"> & {
-    borderRadius?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
-    border?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    diffused?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+    borderRadius?: "sm" | "md" | "lg" | undefined;
+    border?: boolean | undefined;
+    diffused?: boolean | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & {
+} & {
     colorScheme?: import("../..").TcolorScheme;
 }, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & import("../../types").NavigatorActions, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
+} & React.ButtonHTMLAttributes<HTMLButtonElement> & import("../../types").NavigatorActions, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 type TTileToggleGroupItem = React.ComponentProps<typeof ToggleGroup.Item> & React.ComponentProps<typeof StyledTileToggleGroupItem>;
 export declare const TileToggleGroupItem: ({ children, ...rest }: TTileToggleGroupItem) => React.JSX.Element;
 export {};

package/dist/components/tile-toggle-group/TileToggleGroupRoot.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-export declare const TileToggleGroupRoot: React.ForwardRefExoticComponent<(Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const TileToggleGroupRoot: React.ForwardRefExoticComponent<(Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "direction" | "align" | "wrap" | "justify" | "gap"> & {
     direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
@@ -9,9 +9,9 @@ export declare const TileToggleGroupRoot: React.ForwardRefExoticComponent<(Omit<
     gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
+} & Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
-}, "ref">, "ref"> | Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+}, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "direction" | "align" | "wrap" | "justify" | "gap"> & {
     direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
@@ -21,6 +21,6 @@ export declare const TileToggleGroupRoot: React.ForwardRefExoticComponent<(Omit<
     gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement> & {
+} & Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
-}, "ref">, "ref">) & React.RefAttributes<HTMLDivElement>>;
+}, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">) & React.RefAttributes<HTMLDivElement>>;

package/dist/components/toast/Toast.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-export declare const StyledToast: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const StyledToast: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "direction" | "align" | "wrap" | "justify" | "gap"> & {
     direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
@@ -9,11 +9,11 @@ export declare const StyledToast: React.ForwardRefExoticComponent<Omit<Omit<Omit
     gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>, "type"> & {
-    type?: ("loading" | "error" | "success" | "blank" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "loading" | "error" | "success" | "blank">>) | undefined;
+}, "type"> & {
+    type?: "loading" | "error" | "success" | "blank" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 export declare const Toast: {
     (props: React.ComponentProps<typeof StyledToast>): React.JSX.Element;
     Icon: (props: React.ComponentProps<typeof import("..").Icon>) => JSX.Element;

package/dist/components/toggle-group/ToggleGroupButton.d.ts

@@ -1,23 +1,23 @@
 import * as React from 'react';
-export declare const StyledButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "theme"> & {
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+export declare const StyledButton: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "theme"> & {
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>, "theme" | "size" | "isIconOnly"> & {
-    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
-    isIconOnly?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+}, "theme" | "size" | "isIconOnly"> & {
+    size?: "sm" | "md" | "lg" | undefined;
+    isIconOnly?: boolean | undefined;
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-export declare const ToggleGroupButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "theme"> & {
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+}>;
+export declare const ToggleGroupButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "theme"> & {
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>, "theme" | "size" | "isIconOnly"> & {
-    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
-    isIconOnly?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+}, "theme" | "size" | "isIconOnly"> & {
+    size?: "sm" | "md" | "lg" | undefined;
+    isIconOnly?: boolean | undefined;
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+}, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/toggle-group/ToggleGroupItem.d.ts

@@ -1,6 +1,6 @@
 import * as ToggleGroup from '@radix-ui/react-toggle-group';
-export declare const ToggleGroupItem: import("react").ForwardRefExoticComponent<Omit<Omit<ToggleGroup.ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+export declare const ToggleGroupItem: import("react").ForwardRefExoticComponent<Omit<ToggleGroup.ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: import("react").ElementType;
-}, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+}>;

package/dist/components/toggle-group/ToggleGroupRoot.d.ts

@@ -3,19 +3,19 @@ type RootType = {
     orientation?: 'horizontal' | 'vertical';
     isFullWidth?: boolean;
 };
-export declare const StyledRoot: React.ForwardRefExoticComponent<Omit<Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
+export declare const StyledRoot: React.ForwardRefExoticComponent<Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
 }, "ref"> | Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
 }, "ref">) & React.RefAttributes<HTMLDivElement>, "theme" | "direction" | "isFullWidth" | "hasGap"> & {
-    isFullWidth?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    hasGap?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    direction?: ("row" | "column" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "column">>) | undefined;
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+    isFullWidth?: boolean | undefined;
+    hasGap?: boolean | undefined;
+    direction?: "row" | "column" | undefined;
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export declare const ToggleGroupRoot: React.ForwardRefExoticComponent<Omit<Pick<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+}>;
+export declare const ToggleGroupRoot: React.ForwardRefExoticComponent<Omit<Pick<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "direction" | "align" | "wrap" | "justify" | "gap"> & {
     direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
@@ -25,16 +25,16 @@ export declare const ToggleGroupRoot: React.ForwardRefExoticComponent<Omit<Pick<
     gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>, "wrap" | "gap"> & Omit<Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
+}, "wrap" | "gap"> & Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
 }, "ref"> | Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
 }, "ref">) & React.RefAttributes<HTMLDivElement>, "theme" | "direction" | "isFullWidth" | "hasGap"> & {
-    isFullWidth?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    hasGap?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    direction?: ("row" | "column" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "column">>) | undefined;
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+    isFullWidth?: boolean | undefined;
+    hasGap?: boolean | undefined;
+    direction?: "row" | "column" | undefined;
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & RootType, "ref"> & React.RefAttributes<HTMLDivElement>>;
+} & RootType, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/components/toggle-group/index.d.ts

@@ -1,21 +1,21 @@
 export declare const ToggleGroup: {
-    Item: import("react").ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
-        theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+    Item: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
+        theme?: "standard" | "modern" | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-    Button: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
-        theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+    }>;
+    Button: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
+        theme?: "standard" | "modern" | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>, "theme" | "size" | "isIconOnly"> & {
-        size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
-        isIconOnly?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-        theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+    }, "theme" | "size" | "isIconOnly"> & {
+        size?: "sm" | "md" | "lg" | undefined;
+        isIconOnly?: boolean | undefined;
+        theme?: "standard" | "modern" | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-    Root: import("react").ForwardRefExoticComponent<Omit<Pick<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    Root: import("react").ForwardRefExoticComponent<Omit<Pick<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
         ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
     }, "direction" | "align" | "wrap" | "justify" | "gap"> & {
         direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
@@ -25,18 +25,18 @@ export declare const ToggleGroup: {
         gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLDivElement>, "wrap" | "gap"> & Omit<Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & import("react").RefAttributes<HTMLDivElement> & {
+    }, "wrap" | "gap"> & Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & import("react").RefAttributes<HTMLDivElement> & {
         disableDeselect?: boolean;
     }, "ref"> | Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & import("react").RefAttributes<HTMLDivElement> & {
         disableDeselect?: boolean;
     }, "ref">) & import("react").RefAttributes<HTMLDivElement>, "theme" | "direction" | "isFullWidth" | "hasGap"> & {
-        isFullWidth?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-        hasGap?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-        direction?: ("row" | "column" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "column">>) | undefined;
-        theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+        isFullWidth?: boolean | undefined;
+        hasGap?: boolean | undefined;
+        direction?: "row" | "column" | undefined;
+        theme?: "standard" | "modern" | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
+    } & {
         orientation?: "horizontal" | "vertical";
         isFullWidth?: boolean;
     }, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

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

@@ -5,11 +5,11 @@ export declare const Tooltip: {
     ({ children, delayDuration, ...remainingProps }: TooltipProps): React.JSX.Element;
     displayName: string;
 } & {
-    Content: ({ children, side, sideOffset, size, ...remainingProps }: Omit<Omit<import("@radix-ui/react-tooltip").TooltipContentProps & React.RefAttributes<HTMLDivElement>, "size"> & {
-        size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+    Content: ({ children, side, sideOffset, size, ...remainingProps }: Omit<import("@radix-ui/react-tooltip").TooltipContentProps & React.RefAttributes<HTMLDivElement>, "size"> & {
+        size?: "sm" | "md" | "lg" | undefined;
     } & {
         as?: React.ElementType;
-    }, "ref"> & React.RefAttributes<HTMLDivElement> & import("@radix-ui/react-tooltip").TooltipContentProps) => React.JSX.Element;
+    } & import("@radix-ui/react-tooltip").TooltipContentProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element;
     Trigger: React.ForwardRefExoticComponent<import("@radix-ui/react-tooltip").TooltipTriggerProps & React.RefAttributes<HTMLButtonElement>>;
     Portal: React.FC<import("@radix-ui/react-tooltip").TooltipPortalProps>;
     Provider: React.FC<import("@radix-ui/react-tooltip").TooltipProviderProps>;

package/dist/components/tooltip/TooltipContent.d.ts

@@ -1,10 +1,10 @@
 import { Content } from '@radix-ui/react-tooltip';
 import * as React from 'react';
-declare const StyledContent: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-tooltip").TooltipContentProps & React.RefAttributes<HTMLDivElement>, "size"> & {
-    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+declare const StyledContent: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-tooltip").TooltipContentProps & React.RefAttributes<HTMLDivElement>, "size"> & {
+    size?: "sm" | "md" | "lg" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 type TooltipContentProps = React.ComponentProps<typeof StyledContent> & React.ComponentProps<typeof Content>;
 export declare const TooltipContent: ({ children, side, sideOffset, size, ...remainingProps }: TooltipContentProps) => React.JSX.Element;
 export {};

package/dist/components/top-bar/TopBar.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Theme } from '../../styled';
-declare const StyledRoot: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+declare const StyledRoot: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "size" | "appearance" | "diffused" | "hasScrolled"> & {
     hasScrolled?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
@@ -9,7 +9,7 @@ declare const StyledRoot: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.D
     appearance?: ("standard" | "rounded" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "rounded">>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 type StyledRootProps = React.ComponentProps<typeof StyledRoot>;
 type TopBarProps = StyledRootProps & {
     className?: string;
@@ -18,15 +18,15 @@ export declare const TopBar: {
     ({ size, diffused, theme, className, appearance, ...props }: React.PropsWithChildren<TopBarProps>): React.JSX.Element;
     displayName: string;
 } & {
-    Brand: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    Brand: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
         ref?: ((instance: HTMLAnchorElement | null) => void) | React.RefObject<HTMLAnchorElement> | null | undefined;
     }, never> & {
         as?: React.ElementType;
-    }, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+    }>;
     BrandLogo: ({ src, alt, className }: Pick<React.ComponentProps<typeof import("..").Image>, "src" | "alt"> & {
         className?: string;
     }) => JSX.Element;
-    BrandName: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
+    BrandName: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
         ref?: ((instance: HTMLParagraphElement | null) => void) | React.RefObject<HTMLParagraphElement> | null | undefined;
     }, "size" | "weight" | "family" | "noCapsize"> & {
         weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "normal">>) | undefined;
@@ -35,12 +35,12 @@ export declare const TopBar: {
         noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
     } & {
         as?: React.ElementType;
-    }, "ref"> & React.RefAttributes<HTMLParagraphElement>, "as"> & {
+    }, "as"> & {
         as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
     }, "ref"> & React.RefAttributes<HTMLParagraphElement>, never> & {
         as?: React.ElementType;
-    }, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
-    ActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    }>;
+    ActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
         ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
     }, "theme" | "size" | "appearance" | "isRounded"> & {
         theme?: ("warning" | "success" | "neutral" | "primary" | "white" | "primaryDark" | "danger" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "warning" | "success" | "neutral" | "primary" | "white" | "primaryDark" | "danger">>) | undefined;
@@ -49,7 +49,7 @@ export declare const TopBar: {
         isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
     } & {
         as?: React.ElementType;
-    }, "ref"> & React.RefAttributes<HTMLButtonElement>, "children" | "label" | keyof import("../../types").NavigatorActions | "hasTooltip" | "tooltipSide"> & {
+    }, "children" | "label" | keyof import("../../types").NavigatorActions | "hasTooltip" | "tooltipSide"> & {
         children: React.ReactNode;
         label: string;
     } & Omit<import("../../utilities/optional-tooltip-wrapper").TOptionalTooltipWrapperProps, "label"> & import("../../types").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "children" | "size"> & {

package/dist/components/top-bar/TopBar.js

@@ -1,2 +1,2 @@
-import*as e from"react";import{styled as r,Theme as p}from"../../styled.js";import{useWindowScrollPosition as c}from"../../utilities/hooks/useWindowScrollPosition.js";import{Divider as l}from"../divider/Divider.js";import{Flex as b}from"../flex/Flex.js";import{colorSchemes as u}from"./TopBar.colorscheme.config.js";import{TopBarActionIcon as f}from"./TopBarActionIcon.js";import{TopBarBrand as h,TopBarBrandLogo as x,TopBarBrandName as B}from"./TopBarBrand.js";const g=()=>e.createElement(l,{orientation:"vertical",className:"bg-divider h-6"}),w=r("div",{base:["bg-(--background)","sticky","flex","items-center","z-1","transition-shadow","duration-200","ease-out"],variants:{hasScrolled:{true:["shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]"]},size:{md:["h-16"],lg:["h-24"]},diffused:{true:["supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]","supports-color-mix:backdrop-blur-sm"]},appearance:{standard:["w-screen","max-w-full","top-0","border-b","border-b-(--border-bottom)"],rounded:["w-full","top-2","p-2","border","border-white","rounded-round"]}}}),T=r(b,{base:["items-center","h-10","mx-4","w-full","md:mx-8"]}),o=({size:a="md",diffused:t,theme:s,className:d,appearance:i="standard",...m})=>{const{y:n}=c();return e.createElement(p,{theme:s||u.light},e.createElement(w,{className:d,hasScrolled:!!n,diffused:t,appearance:i,size:a},e.createElement(T,{...m})))},v=Object.assign(o,{Brand:h,BrandLogo:x,BrandName:B,ActionIcon:f,Divider:g});o.displayName="TopBar";export{v as TopBar};
+import*as e from"react";import{styled as r,Theme as p}from"../../styled.js";import{useWindowScrollPosition as l}from"../../utilities/hooks/useWindowScrollPosition.js";import{Divider as c}from"../divider/Divider.js";import{Flex as b}from"../flex/Flex.js";import{colorSchemes as f}from"./TopBar.colorscheme.config.js";import{TopBarActionIcon as u}from"./TopBarActionIcon.js";import{TopBarBrand as h,TopBarBrandLogo as x,TopBarBrandName as B}from"./TopBarBrand.js";const g=()=>e.createElement(c,{orientation:"vertical",className:"bg-divider h-6"}),w=r("div",{base:["bg-(--background)","sticky","flex","items-center","z-1","transition-shadow","duration-200","ease-out"],variants:{hasScrolled:{true:["shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]"]},size:{md:["h-16"],lg:["h-24"]},diffused:{true:["supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]","supports-color-mix:backdrop-blur-sm"]},appearance:{standard:["w-screen","max-w-full","top-0","border-b","border-b-(--border-bottom)"],rounded:["w-full","top-2","p-2","border","border-white","rounded-full"]}}},{enabledResponsiveVariants:!0}),T=r(b,{base:["items-center","h-10","mx-4","w-full","md:mx-8"]}),o=({size:a="md",diffused:t,theme:s,className:i,appearance:d="standard",...n})=>{const{y:m}=l();return e.createElement(p,{theme:s||f.light},e.createElement(w,{className:i,hasScrolled:!!m,diffused:t,appearance:d,size:a},e.createElement(T,{...n})))},v=Object.assign(o,{Brand:h,BrandLogo:x,BrandName:B,ActionIcon:u,Divider:g});o.displayName="TopBar";export{v as TopBar};
 //# sourceMappingURL=TopBar.js.map

package/dist/components/top-bar/TopBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"TopBar.js","sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled, Theme } from '~/styled'\nimport { useWindowScrollPosition } from '~/utilities/hooks/useWindowScrollPosition'\n\nimport { Divider } from '../divider'\nimport { Flex } from '../flex'\nimport { colorSchemes as topBarColorSchemes } from './TopBar.colorscheme.config'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\nconst TopBarDivider = () => (\n  <Divider orientation=\"vertical\" className=\"bg-divider h-6\" />\n)\n\nconst StyledRoot = styled('div', {\n  base: [\n    'bg-(--background)',\n    'sticky',\n    'flex',\n    'items-center',\n    'z-1',\n    'transition-shadow',\n    'duration-200',\n    'ease-out'\n  ],\n  variants: {\n    hasScrolled: {\n      true: ['shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]']\n    },\n    size: {\n      md: ['h-16'],\n      lg: ['h-24']\n    },\n    diffused: {\n      true: [\n        'supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]',\n        'supports-color-mix:backdrop-blur-sm'\n      ]\n    },\n    appearance: {\n      standard: [\n        'w-screen',\n        'max-w-full',\n        'top-0',\n        'border-b',\n        'border-b-(--border-bottom)'\n      ],\n      rounded: [\n        'w-full',\n        'top-2',\n        'p-2',\n        'border',\n        'border-white',\n        'rounded-round'\n      ]\n    }\n  }\n})\n\nconst Container = styled(Flex, {\n  base: ['items-center', 'h-10', 'mx-4', 'w-full', 'md:mx-8']\n})\n\ntype StyledRootProps = React.ComponentProps<typeof StyledRoot>\n\ntype TopBarProps = StyledRootProps & {\n  className?: string\n} & React.ComponentProps<typeof Theme>\n\nconst TopBarComponent = ({\n  size = 'md',\n  diffused,\n  theme,\n  className,\n  appearance = 'standard',\n  ...props\n}: React.PropsWithChildren<TopBarProps>) => {\n  const { y: scrollPositionY } = useWindowScrollPosition()\n\n  return (\n    <Theme theme={theme || topBarColorSchemes['light']}>\n      <StyledRoot\n        className={className}\n        hasScrolled={!!scrollPositionY}\n        diffused={diffused}\n        appearance={appearance}\n        size={size}\n      >\n        <Container {...props} />\n      </StyledRoot>\n    </Theme>\n  )\n}\n\nexport const TopBar = Object.assign(TopBarComponent, {\n  Brand: TopBarBrand,\n  BrandLogo: TopBarBrandLogo,\n  BrandName: TopBarBrandName,\n  ActionIcon: TopBarActionIcon,\n  Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"names":["TopBarDivider","React","Divider","StyledRoot","styled","Container","Flex","TopBarComponent","size","diffused","theme","className","appearance","props","scrollPositionY","useWindowScrollPosition","Theme","topBarColorSchemes","TopBar","TopBarBrand","TopBarBrandLogo","TopBarBrandName","TopBarActionIcon"],"mappings":"8cAWA,MAAMA,EAAgB,IACpBC,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,UAAU,gBAAA,CAAiB,EAGvDC,EAAaC,EAAO,MAAO,CAC/B,KAAM,CACJ,oBACA,SACA,OACA,eACA,MACA,oBACA,eACA,UACF,EACA,SAAU,CACR,YAAa,CACX,KAAM,CAAC,8CAA8C,CACvD,EACA,KAAM,CACJ,GAAI,CAAC,MAAM,EACX,GAAI,CAAC,MAAM,CACb,EACA,SAAU,CACR,KAAM,CACJ,uEACA,qCACF,CACF,EACA,WAAY,CACV,SAAU,CACR,WACA,aACA,QACA,WACA,4BACF,EACA,QAAS,CACP,SACA,QACA,MACA,SACA,eACA,eACF,CACF,CACF,CACF,CAAC,EAEKC,EAAYD,EAAOE,EAAM,CAC7B,KAAM,CAAC,eAAgB,OAAQ,OAAQ,SAAU,SAAS,CAC5D,CAAC,EAQKC,EAAkB,CAAC,CACvB,KAAAC,EAAO,KACP,SAAAC,EACA,MAAAC,EACA,UAAAC,EACA,WAAAC,EAAa,WACb,GAAGC,CACL,IAA4C,CAC1C,KAAM,CAAE,EAAGC,CAAgB,EAAIC,EAE/B,EAAA,OACEd,EAAA,cAACe,EAAA,CAAM,MAAON,GAASO,EAAmB,KAAA,EACxChB,EAAA,cAACE,EAAA,CACC,UAAWQ,EACX,YAAa,CAAC,CAACG,EACf,SAAUL,EACV,WAAYG,EACZ,KAAMJ,CAAAA,EAENP,EAAA,cAACI,EAAA,CAAW,GAAGQ,CAAO,CAAA,CACxB,CACF,CAEJ,EAEaK,EAAS,OAAO,OAAOX,EAAiB,CACnD,MAAOY,EACP,UAAWC,EACX,UAAWC,EACX,WAAYC,EACZ,QAAStB,CACX,CAAC,EAEDO,EAAgB,YAAc"}
+{"version":3,"file":"TopBar.js","sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled, Theme } from '~/styled'\nimport { useWindowScrollPosition } from '~/utilities/hooks/useWindowScrollPosition'\n\nimport { Divider } from '../divider'\nimport { Flex } from '../flex'\nimport { colorSchemes as topBarColorSchemes } from './TopBar.colorscheme.config'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\nconst TopBarDivider = () => (\n  <Divider orientation=\"vertical\" className=\"bg-divider h-6\" />\n)\n\nconst StyledRoot = styled(\n  'div',\n  {\n    base: [\n      'bg-(--background)',\n      'sticky',\n      'flex',\n      'items-center',\n      'z-1',\n      'transition-shadow',\n      'duration-200',\n      'ease-out'\n    ],\n    variants: {\n      hasScrolled: {\n        true: ['shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]']\n      },\n      size: {\n        md: ['h-16'],\n        lg: ['h-24']\n      },\n      diffused: {\n        true: [\n          'supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]',\n          'supports-color-mix:backdrop-blur-sm'\n        ]\n      },\n      appearance: {\n        standard: [\n          'w-screen',\n          'max-w-full',\n          'top-0',\n          'border-b',\n          'border-b-(--border-bottom)'\n        ],\n        rounded: [\n          'w-full',\n          'top-2',\n          'p-2',\n          'border',\n          'border-white',\n          'rounded-full'\n        ]\n      }\n    }\n  },\n  {\n    enabledResponsiveVariants: true\n  }\n)\n\nconst Container = styled(Flex, {\n  base: ['items-center', 'h-10', 'mx-4', 'w-full', 'md:mx-8']\n})\n\ntype StyledRootProps = React.ComponentProps<typeof StyledRoot>\n\ntype TopBarProps = StyledRootProps & {\n  className?: string\n} & React.ComponentProps<typeof Theme>\n\nconst TopBarComponent = ({\n  size = 'md',\n  diffused,\n  theme,\n  className,\n  appearance = 'standard',\n  ...props\n}: React.PropsWithChildren<TopBarProps>) => {\n  const { y: scrollPositionY } = useWindowScrollPosition()\n\n  return (\n    <Theme theme={theme || topBarColorSchemes['light']}>\n      <StyledRoot\n        className={className}\n        hasScrolled={!!scrollPositionY}\n        diffused={diffused}\n        appearance={appearance}\n        size={size}\n      >\n        <Container {...props} />\n      </StyledRoot>\n    </Theme>\n  )\n}\n\nexport const TopBar = Object.assign(TopBarComponent, {\n  Brand: TopBarBrand,\n  BrandLogo: TopBarBrandLogo,\n  BrandName: TopBarBrandName,\n  ActionIcon: TopBarActionIcon,\n  Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"names":["TopBarDivider","React","Divider","StyledRoot","styled","Container","Flex","TopBarComponent","size","diffused","theme","className","appearance","props","scrollPositionY","useWindowScrollPosition","Theme","topBarColorSchemes","TopBar","TopBarBrand","TopBarBrandLogo","TopBarBrandName","TopBarActionIcon"],"mappings":"8cAWA,MAAMA,EAAgB,IACpBC,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,UAAU,gBAAiB,CAAA,EAGvDC,EAAaC,EACjB,MACA,CACE,KAAM,CACJ,oBACA,SACA,OACA,eACA,MACA,oBACA,eACA,UACF,EACA,SAAU,CACR,YAAa,CACX,KAAM,CAAC,8CAA8C,CACvD,EACA,KAAM,CACJ,GAAI,CAAC,MAAM,EACX,GAAI,CAAC,MAAM,CACb,EACA,SAAU,CACR,KAAM,CACJ,uEACA,qCACF,CACF,EACA,WAAY,CACV,SAAU,CACR,WACA,aACA,QACA,WACA,4BACF,EACA,QAAS,CACP,SACA,QACA,MACA,SACA,eACA,cACF,CACF,CACF,CACF,EACA,CACE,0BAA2B,EAC7B,CACF,EAEMC,EAAYD,EAAOE,EAAM,CAC7B,KAAM,CAAC,eAAgB,OAAQ,OAAQ,SAAU,SAAS,CAC5D,CAAC,EAQKC,EAAkB,CAAC,CACvB,KAAAC,EAAO,KACP,SAAAC,EACA,MAAAC,EACA,UAAAC,EACA,WAAAC,EAAa,WACb,GAAGC,CACL,IAA4C,CAC1C,KAAM,CAAE,EAAGC,CAAgB,EAAIC,EAAwB,EAEvD,OACEd,EAAA,cAACe,EAAA,CAAM,MAAON,GAASO,EAAmB,OACxChB,EAAA,cAACE,EAAA,CACC,UAAWQ,EACX,YAAa,CAAC,CAACG,EACf,SAAUL,EACV,WAAYG,EACZ,KAAMJ,CAAAA,EAENP,EAAA,cAACI,EAAA,CAAW,GAAGQ,CAAO,CAAA,CACxB,CACF,CAEJ,EAEaK,EAAS,OAAO,OAAOX,EAAiB,CACnD,MAAOY,EACP,UAAWC,EACX,UAAWC,EACX,WAAYC,EACZ,QAAStB,CACX,CAAC,EAEDO,EAAgB,YAAc"}

package/dist/components/top-bar/TopBarBrand.d.ts

@@ -3,7 +3,7 @@ import { Image } from '../image';
 export declare const TopBarBrandLogo: ({ src, alt, className }: Pick<React.ComponentProps<typeof Image>, "src" | "alt"> & {
     className?: string;
 }) => JSX.Element;
-export declare const TopBarBrandName: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
+export declare const TopBarBrandName: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
     ref?: ((instance: HTMLParagraphElement | null) => void) | React.RefObject<HTMLParagraphElement> | null | undefined;
 }, "size" | "weight" | "family" | "noCapsize"> & {
     weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "normal">>) | undefined;
@@ -12,13 +12,13 @@ export declare const TopBarBrandName: React.ForwardRefExoticComponent<Omit<Omit<
     noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLParagraphElement>, "as"> & {
+}, "as"> & {
     as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
 }, "ref"> & React.RefAttributes<HTMLParagraphElement>, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
-export declare const TopBarBrand: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+}>;
+export declare const TopBarBrand: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
     ref?: ((instance: HTMLAnchorElement | null) => void) | React.RefObject<HTMLAnchorElement> | null | undefined;
 }, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+}>;