@musecat/uikit 0.1.3 → 0.2.0

package/packages/Components/Radio/Radio.tsx

@@ -1,11 +1,11 @@
 "use client";
 
 import { useEffect, useRef, useState } from "react";
-import styles from "@/packages/Components/Radio/Radio.module.scss";
-import type { RadioProps } from "@/packages/Components/Radio/Radio.types";
-import Text from "@/packages/Components/Text/Text";
-import { Size } from "@/packages/Frameworks/_shared/sizing";
-import View from "@/packages/Frameworks/View/View";
+import styles from "./Radio.module.scss";
+import type { RadioProps } from "./Radio.types";
+import Text from "../Text/Text";
+import { Size } from "../../Frameworks/_shared/sizing";
+import View from "../../Frameworks/View/View";
 
 export default function Radio({
   title,

package/packages/Components/Radio/Radio.types.ts

@@ -1,10 +1,10 @@
-import type { TextProps } from "@/packages/Components/Text/Text.types";
-import type { UIKitSizeValue } from "@/packages/Frameworks/_shared/sizing";
-import type { RadiusProps } from "@/packages/Frameworks/Theme/Radius.types";
+import type { TextProps } from "../Text/Text.types";
+import type { UIKitSizeValue } from "../../Frameworks/_shared/sizing";
+import type { RadiusProps } from "../../Frameworks/Theme/Radius.types";
 import type {
   BorderProps,
   ThemeSystemProps,
-} from "@/packages/Frameworks/Theme/Theme.types";
+} from "../../Frameworks/Theme/Theme.types";
 
 export interface RadioProps
   extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "color">,

package/packages/Components/Select/Select.keyboard.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useCallback, useRef } from "react";
-import type { Option } from "@/packages/Components/Select/Select.types";
+import type { Option } from "./Select.types";
 
 const TYPE_AHEAD_RESET_MS = 500;
 

package/packages/Components/Select/Select.trigger.tsx

@@ -1,8 +1,8 @@
 "use client";
 import type { KeyboardEvent, ReactElement } from "react";
-import Pressable from "@/packages/Frameworks/Pressable/Pressable";
-import Text from "@/packages/Components/Text/Text";
-import View from "@/packages/Frameworks/View/View";
+import Pressable from "../../Frameworks/Pressable/Pressable";
+import Text from "../Text/Text";
+import View from "../../Frameworks/View/View";
 
 interface SelectTriggerProps {
   selectId: string;

package/packages/Components/Select/Select.tsx

@@ -1,7 +1,7 @@
 "use client";
 import type { ReactElement } from "react";
-import type { SelectProps } from "@/packages/Components/Select/Select.types";
-import SelectInner from "@/packages/Components/Select/select.inner";
+import type { SelectProps } from "./Select.types";
+import SelectInner from "./select.inner";
 
 export default function Select(props: SelectProps<false>): ReactElement;
 export default function Select(props: SelectProps<true>): ReactElement;

package/packages/Components/Select/Select.types.ts

@@ -18,7 +18,7 @@ export type SelectChangeEvent<Multiple extends boolean = false> =
   | React.ChangeEvent<HTMLSelectElement>
   | { target: { value: SelectValue<Multiple> } };
 
-import type { LabelSharedProps } from "@/packages/Components/Label/Label.types";
+import type { LabelSharedProps } from "../Label/Label.types";
 
 export interface SelectProps<Multiple extends boolean = false>
   extends LabelSharedProps {

package/packages/Components/Select/Select.utils.ts

@@ -1,7 +1,7 @@
 import type {
   OptGroup,
   Option,
-} from "@/packages/Components/Select/Select.types";
+} from "./Select.types";
 
 type ScrollLockSnapshot = {
   count: number;

package/packages/Components/Select/hooks/useSelectNavigation.ts

@@ -6,19 +6,19 @@ import {
   useCallback,
   useEffect,
 } from "react";
-import type { SelectState } from "@/packages/Components/Select/hooks/useSelectState";
+import type { SelectState } from "./useSelectState";
 import {
   handleEndKey,
   handleHomeKey,
   isPrintableCharacter,
   useTypeAhead,
-} from "@/packages/Components/Select/Select.keyboard";
-import type { Option } from "@/packages/Components/Select/Select.types";
+} from "../Select.keyboard";
+import type { Option } from "../Select.types";
 import {
   findScrollableAncestor,
   lockScrollElementSafe,
   unlockScrollElementSafe,
-} from "@/packages/Components/Select/Select.utils";
+} from "../Select.utils";
 
 export function useSelectNavigation(
   state: SelectState,
@@ -323,7 +323,7 @@ export function useSelectNavigation(
 
   const handleControlKeyDown = useCallback(
     (
-      e: KeyboardEvent<HTMLInputElement | HTMLButtonElement>,
+      e: KeyboardEvent<Element>,
       allowSpaceSelection: boolean,
     ) => {
       if (e.key === "Tab") {

package/packages/Components/Select/hooks/useSelectSelection.ts

@@ -1,12 +1,12 @@
 "use client";
 import { useCallback } from "react";
-import type { SelectState } from "@/packages/Components/Select/hooks/useSelectState";
+import type { SelectState } from "./useSelectState";
 import type {
   Option,
   SelectChangeEvent,
   SelectValue,
-} from "@/packages/Components/Select/Select.types";
-import { filterOptionsByQuery } from "@/packages/Components/Select/Select.utils";
+} from "../Select.types";
+import { filterOptionsByQuery } from "../Select.utils";
 
 export function useSelectSelection(state: SelectState) {
   const {

package/packages/Components/Select/hooks/useSelectState.ts

@@ -8,17 +8,17 @@ import {
   useRef,
   useState,
 } from "react";
-import { Word } from "@/i18n/shared";
+import { Word } from "../../../../i18n/shared";
 import type {
   Option,
   SelectProps,
-} from "@/packages/Components/Select/Select.types";
+} from "../Select.types";
 import {
   filterOptionsByQuery,
   findScrollableAncestor,
   getStringValues,
   isOptGroup,
-} from "@/packages/Components/Select/Select.utils";
+} from "../Select.utils";
 
 export function useSelectState(props: SelectProps<boolean>) {
   const t = Word();

package/packages/Components/Select/select.control.tsx

@@ -4,14 +4,14 @@ import type {
   ReactElement,
   MouseEvent as ReactMouseEvent,
 } from "react";
-import Pill from "@/packages/Components/Pill/Pill";
-import SelectTrigger from "@/packages/Components/Select/Select.trigger";
-import type { SelectNavigation } from "@/packages/Components/Select/hooks/useSelectNavigation";
-import type { SelectState } from "@/packages/Components/Select/hooks/useSelectState";
-import type { SelectValue } from "@/packages/Components/Select/Select.types";
-import { filterOptionsByQuery } from "@/packages/Components/Select/Select.utils";
-import Text from "@/packages/Components/Text/Text";
-import View from "@/packages/Frameworks/View/View";
+import Pill from "../Pill/Pill";
+import SelectTrigger from "./Select.trigger";
+import type { SelectNavigation } from "./hooks/useSelectNavigation";
+import type { SelectState } from "./hooks/useSelectState";
+import type { SelectValue } from "./Select.types";
+import { filterOptionsByQuery } from "./Select.utils";
+import Text from "../Text/Text";
+import View from "../../Frameworks/View/View";
 
 interface SelectControlProps {
   state: SelectState;

package/packages/Components/Select/select.inner.tsx

@@ -5,16 +5,16 @@ import {
   type MouseEvent as ReactMouseEvent,
   useMemo,
 } from "react";
-import ContextMenu from "@/packages/Components/ContextMenu/ContextMenu";
-import Icon from "@/packages/Components/Icon/Icon";
-import Label from "@/packages/Components/Label/Label";
-import { useSelectNavigation } from "@/packages/Components/Select/hooks/useSelectNavigation";
-import { useSelectSelection } from "@/packages/Components/Select/hooks/useSelectSelection";
-import { useSelectState } from "@/packages/Components/Select/hooks/useSelectState";
-import type { SelectProps } from "@/packages/Components/Select/Select.types";
-import { filterOptionsByQuery } from "@/packages/Components/Select/Select.utils";
-import SelectControl from "@/packages/Components/Select/select.control";
-import View from "@/packages/Frameworks/View/View";
+import ContextMenu from "../ContextMenu/ContextMenu";
+import Icon from "../Icon/Icon";
+import Label from "../Label/Label";
+import { useSelectNavigation } from "./hooks/useSelectNavigation";
+import { useSelectSelection } from "./hooks/useSelectSelection";
+import { useSelectState } from "./hooks/useSelectState";
+import type { SelectProps } from "./Select.types";
+import { filterOptionsByQuery } from "./Select.utils";
+import SelectControl from "./select.control";
+import View from "../../Frameworks/View/View";
 
 export default function SelectInner(props: SelectProps<boolean>): ReactElement {
   const state = useSelectState(props);

package/packages/Components/Skeleton/Skeleton.tsx

@@ -1,5 +1,5 @@
-import type { SkeletonProps } from "@/packages/Components/Skeleton/Skeleton.types";
-import View from "@/packages/Frameworks/View/View";
+import type { SkeletonProps } from "./Skeleton.types";
+import View from "../../Frameworks/View/View";
 
 export default function Skeleton({
   className,

package/packages/Components/Skeleton/Skeleton.types.ts

@@ -1,5 +1,5 @@
-import type { TextProps } from "@/packages/Components/Text/Text.types";
-import type { UIKitSizeValue } from "@/packages/Frameworks/_shared/sizing";
+import type { TextProps } from "../Text/Text.types";
+import type { UIKitSizeValue } from "../../Frameworks/_shared/sizing";
 
 export interface SkeletonProps {
   "data-color-mode"?: string;

package/packages/Components/Spinner/Spinner.tsx

@@ -1,10 +1,10 @@
 import clsx from "clsx";
 import type { CSSProperties } from "react";
-import styles from "@/packages/Components/Spinner/Spinner.module.scss";
-import type { SpinnerProps } from "@/packages/Components/Spinner/Spinner.types";
-import { Size } from "@/packages/Frameworks/_shared/sizing";
-import { resolveThemeClasses } from "@/packages/Frameworks/Theme/Theme.types";
-import View from "@/packages/Frameworks/View/View";
+import styles from "./Spinner.module.scss";
+import type { SpinnerProps } from "./Spinner.types";
+import { Size } from "../../Frameworks/_shared/sizing";
+import { resolveThemeClasses } from "../../Frameworks/Theme/Theme.types";
+import View from "../../Frameworks/View/View";
 
 const SPINNER_SEGMENTS = 12;
 const SPINNER_VISUAL_SCALE_BY_TYPE = {

package/packages/Components/Spinner/Spinner.types.ts

@@ -1,6 +1,6 @@
 import type { AriaRole, CSSProperties, SVGAttributes } from "react";
-import type { UIKitSizeValue } from "@/packages/Frameworks/_shared/sizing";
-import type { ThemePaint } from "@/packages/Frameworks/Theme/Theme.types";
+import type { UIKitSizeValue } from "../../Frameworks/_shared/sizing";
+import type { ThemePaint } from "../../Frameworks/Theme/Theme.types";
 
 export interface SpinnerProps {
   "data-color-mode"?: string;

package/packages/Components/Text/Text.tsx

@@ -1,7 +1,7 @@
 import clsx from "clsx";
-import styles from "@/packages/Components/Text/Text.module.scss";
-import type { TextProps } from "@/packages/Components/Text/Text.types";
-import { Size } from "@/packages/Frameworks/_shared/sizing";
+import styles from "./Text.module.scss";
+import type { TextProps } from "./Text.types";
+import { Size } from "../../Frameworks/_shared/sizing";
 
 export default function Text({
   children,

package/packages/Components/Text/Text.types.ts

@@ -1,5 +1,5 @@
-import type { UIKitSizeValue } from "@/packages/Frameworks/_shared/sizing";
-import type { ThemePaint } from "@/packages/Frameworks/Theme/Theme.types";
+import type { UIKitSizeValue } from "../../Frameworks/_shared/sizing";
+import type { ThemePaint } from "../../Frameworks/Theme/Theme.types";
 
 export interface TextProps {
   "data-color-mode"?: string;

package/packages/Components/TimePicker/TimePicker.core.tsx

@@ -9,10 +9,10 @@ import {
   useMemo,
   useRef,
 } from "react";
-import Text from "@/packages/Components/Text/Text";
-import styles from "@/packages/Components/TimePicker/TimePicker.module.scss";
-import Pressable from "@/packages/Frameworks/Pressable/Pressable";
-import View from "@/packages/Frameworks/View/View";
+import Text from "../Text/Text";
+import styles from "./TimePicker.module.scss";
+import Pressable from "../../Frameworks/Pressable/Pressable";
+import View from "../../Frameworks/View/View";
 
 type Segment = "hour" | "minute" | "second" | "ampm";
 

package/packages/Components/TimePicker/TimePicker.tsx

@@ -10,13 +10,13 @@ import {
   useRef,
   useState,
 } from "react";
-import Icon from "@/packages/Components/Icon/Icon";
-import Label from "@/packages/Components/Label/Label";
-import Text from "@/packages/Components/Text/Text";
-import styles from "@/packages/Components/TimePicker/TimePicker.module.scss";
-import type { TimePickerProps } from "@/packages/Components/TimePicker/TimePicker.types";
-import Pressable from "@/packages/Frameworks/Pressable/Pressable";
-import View from "@/packages/Frameworks/View/View";
+import Icon from "../Icon/Icon";
+import Label from "../Label/Label";
+import Text from "../Text/Text";
+import styles from "./TimePicker.module.scss";
+import type { TimePickerProps } from "./TimePicker.types";
+import Pressable from "../../Frameworks/Pressable/Pressable";
+import View from "../../Frameworks/View/View";
 
 type Segment = "hour" | "minute" | "second" | "ampm";
 

package/packages/Components/TimePicker/TimePicker.types.ts

@@ -1,4 +1,4 @@
-import type { LabelProps } from "@/packages/Components/Label/Label.types";
+import type { LabelProps } from "../Label/Label.types";
 
 export interface TimePickerProps {
   "data-color-mode"?: string;

package/packages/Components/Timeline/Timeline.tsx

@@ -1,11 +1,11 @@
-import Divider from "@/packages/Components/Divider/Divider";
-import Icon from "@/packages/Components/Icon/Icon";
+import Divider from "../Divider/Divider";
+import Icon from "../Icon/Icon";
 import type {
   TimelineItemProps,
   TimelineProps,
-} from "@/packages/Components/Timeline/Timeline.types";
-import Pressable from "@/packages/Frameworks/Pressable/Pressable";
-import View from "@/packages/Frameworks/View/View";
+} from "./Timeline.types";
+import Pressable from "../../Frameworks/Pressable/Pressable";
+import View from "../../Frameworks/View/View";
 
 function TimelineItem({
   item,

package/packages/Components/Timeline/Timeline.types.ts

@@ -1,6 +1,6 @@
-import type { IconProps } from "@/packages/Components/Icon/Icon.types";
-import type { PressableProps } from "@/packages/Frameworks/Pressable/Pressable.types";
-import type { ThemeSystemProps } from "@/packages/Frameworks/Theme/Theme.types";
+import type { IconProps } from "../Icon/Icon.types";
+import type { PressableProps } from "../../Frameworks/Pressable/Pressable.types";
+import type { ThemeSystemProps } from "../../Frameworks/Theme/Theme.types";
 
 export interface TimelineItemProps {
   children?: React.ReactNode;

package/packages/Components/Title/Title.tsx

@@ -1,15 +1,15 @@
 import clsx from "clsx";
-import IconGroup from "@/packages/Components/Icon/Icon.group";
-import { IconInner } from "@/packages/Components/Icon/Icon";
-import Pill from "@/packages/Components/Pill/Pill";
-import Text from "@/packages/Components/Text/Text";
+import IconGroup from "../Icon/Icon.group";
+import { IconInner } from "../Icon/Icon";
+import Pill from "../Pill/Pill";
+import Text from "../Text/Text";
 import type {
   TitleContextItem,
   TitleContextProps,
   TitleProps,
-} from "@/packages/Components/Title/Title.types";
-import Pressable from "@/packages/Frameworks/Pressable/Pressable";
-import View from "@/packages/Frameworks/View/View";
+} from "./Title.types";
+import Pressable from "../../Frameworks/Pressable/Pressable";
+import View from "../../Frameworks/View/View";
 
 const buildRenderKeys = <T,>(
   items: T[],

package/packages/Components/Title/Title.types.ts

@@ -1,9 +1,9 @@
-import type { IconGroupProps } from "@/packages/Components/Icon/Icon.group.types";
-import type { IconProps } from "@/packages/Components/Icon/Icon.types";
-import type { PillProps } from "@/packages/Components/Pill/Pill.types";
-import type { TextProps } from "@/packages/Components/Text/Text.types";
-import type { PressableProps } from "@/packages/Frameworks/Pressable/Pressable.types";
-import type { ViewProps } from "@/packages/Frameworks/View/View.types";
+import type { IconGroupProps } from "../Icon/Icon.group.types";
+import type { IconProps } from "../Icon/Icon.types";
+import type { PillProps } from "../Pill/Pill.types";
+import type { TextProps } from "../Text/Text.types";
+import type { PressableProps } from "../../Frameworks/Pressable/Pressable.types";
+import type { ViewProps } from "../../Frameworks/View/View.types";
 
 interface TitleItemProps {
   "data-color-mode"?: string;

package/packages/Components/Toggle/Toggle.tsx

@@ -8,15 +8,15 @@ import {
   useRef,
   useState,
 } from "react";
-import Spinner from "@/packages/Components/Spinner/Spinner";
-import Text from "@/packages/Components/Text/Text";
-import styles from "@/packages/Components/Toggle/Toggle.module.scss";
-import type { ToggleProps } from "@/packages/Components/Toggle/Toggle.types";
-import { Size, SizePX } from "@/packages/Frameworks/_shared/sizing";
-import { useControllableState } from "@/packages/Frameworks/_shared/useControllableState";
-import { Radius } from "@/packages/Frameworks/Theme/Radius.types";
-import { Border } from "@/packages/Frameworks/Theme/Theme.types";
-import View from "@/packages/Frameworks/View/View";
+import Spinner from "../Spinner/Spinner";
+import Text from "../Text/Text";
+import styles from "./Toggle.module.scss";
+import type { ToggleProps } from "./Toggle.types";
+import { Size, SizePX } from "../../Frameworks/_shared/sizing";
+import { useControllableState } from "../../Frameworks/_shared/useControllableState";
+import { Radius } from "../../Frameworks/Theme/Radius.types";
+import { Border } from "../../Frameworks/Theme/Theme.types";
+import View from "../../Frameworks/View/View";
 
 type ToggleTrackStyle = React.CSSProperties & {
   "--toggle-padding"?: string;

package/packages/Components/Toggle/Toggle.types.ts

@@ -1,6 +1,6 @@
-import type { TextProps } from "@/packages/Components/Text/Text.types";
-import type { UIKitSizeValue } from "@/packages/Frameworks/_shared/sizing";
-import type { ThemeSystemProps } from "@/packages/Frameworks/Theme/Theme.types";
+import type { TextProps } from "../Text/Text.types";
+import type { UIKitSizeValue } from "../../Frameworks/_shared/sizing";
+import type { ThemeSystemProps } from "../../Frameworks/Theme/Theme.types";
 
 export interface ToggleProps
   extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "color">,

package/packages/Components/Tooltip/Tooltip.tsx

@@ -12,12 +12,12 @@ import {
   useRef,
   useState,
 } from "react";
-import styles from "@/packages/Components/Tooltip/Tooltip.module.scss";
+import styles from "./Tooltip.module.scss";
 import type {
   TooltipPlacement,
   TooltipProps,
-} from "@/packages/Components/Tooltip/Tooltip.types";
-import View from "@/packages/Frameworks/View/View";
+} from "./Tooltip.types";
+import View from "../../Frameworks/View/View";
 
 const TOOLTIP_GAP = 8;
 const TOOLTIP_MARGIN = 4;

package/packages/Components/Tooltip/Tooltip.types.ts

@@ -1,10 +1,10 @@
-import type { RadiusValue } from "@/packages/Frameworks/Theme/Radius.types";
+import type { RadiusValue } from "../../Frameworks/Theme/Radius.types";
 import type {
   BorderProps,
   ThemeBackgroundPaint,
   ThemePaint,
   ThemePreset,
-} from "@/packages/Frameworks/Theme/Theme.types";
+} from "../../Frameworks/Theme/Theme.types";
 
 export type TooltipPlacement =
   | "top"

package/packages/Frameworks/Dialog/Dialog.background.tsx

@@ -3,13 +3,13 @@
 import clsx from "clsx";
 import type { MotionValue } from "motion/react";
 import { useEffect, useState } from "react";
-import { motionPresets } from "@/packages/Frameworks/Motion/Motion.presets";
+import { motionPresets } from "../Motion/Motion.presets";
 import type {
   BackgroundBlurValue,
   ThemeBackgroundPaint,
-} from "@/packages/Frameworks/Theme/Theme.types";
-import { BackgroundBlur } from "@/packages/Frameworks/Theme/Theme.types";
-import View from "@/packages/Frameworks/View/View";
+} from "../Theme/Theme.types";
+import { BackgroundBlur } from "../Theme/Theme.types";
+import View from "../View/View";
 
 interface BackgroundWrapperProps {
   open: boolean;

package/packages/Frameworks/Dialog/Dialog.boot.tsx

@@ -1,11 +1,11 @@
 "use client";
 
 import { useEffect, useState } from "react";
-import Dialog from "@/packages/Frameworks/Dialog/Dialog";
+import Dialog from "./Dialog";
 import {
   type DialogInstance,
   DialogStore,
-} from "@/packages/Frameworks/Dialog/Dialog.store";
+} from "./Dialog.store";
 
 interface DialogBootstrapProps {
   "data-color-mode"?: string;

package/packages/Frameworks/Dialog/Dialog.store.ts

@@ -1,6 +1,6 @@
 "use client";
 
-import type { DialogProps } from "@/packages/Frameworks/Dialog/Dialog.types";
+import type { DialogProps } from "./Dialog.types";
 
 export interface DialogInstance extends Promise<any> {
   id: string;

package/packages/Frameworks/Dialog/Dialog.tsx

@@ -2,15 +2,15 @@
 
 import { buildContext, useViewportMatch } from "@musecat/functionkit";
 import { useMemo } from "react";
-import DialogFunnel from "@/packages/Frameworks/Dialog/contents/Dialog.funnel";
+import DialogFunnel from "./contents/Dialog.funnel";
 import type {
   DialogContextValue,
   DialogMode,
   DialogProps,
-} from "@/packages/Frameworks/Dialog/Dialog.types";
-import RenderModal from "@/packages/Frameworks/Dialog/renderers/renderModal";
-import RenderPopover from "@/packages/Frameworks/Dialog/renderers/renderPopover";
-import RenderSheet from "@/packages/Frameworks/Dialog/renderers/renderSheet";
+} from "./Dialog.types";
+import RenderModal from "./renderers/renderModal";
+import RenderPopover from "./renderers/renderPopover";
+import RenderSheet from "./renderers/renderSheet";
 
 const [DialogProvider, useRawDialogContext] =
   buildContext<DialogContextValue | null>(null);

package/packages/Frameworks/Dialog/Dialog.types.ts

@@ -1,13 +1,13 @@
 import type { ReactNode, RefObject } from "react";
-import type { ButtonProps } from "@/packages/Components/Button/Button.types";
-import type { IconProps } from "@/packages/Components/Icon/Icon.types";
-import type { RadiusProps } from "@/packages/Frameworks/Theme/Radius.types";
+import type { ButtonProps } from "../../Components/Button/Button.types";
+import type { IconProps } from "../../Components/Icon/Icon.types";
+import type { RadiusProps } from "../Theme/Radius.types";
 import type {
   BackgroundBlurValue,
   BorderProps,
   ThemeBackgroundPaint,
   ThemeSystemProps,
-} from "@/packages/Frameworks/Theme/Theme.types";
+} from "../Theme/Theme.types";
 
 export type DialogMode = "popover" | "modal" | "sheet";
 export type DialogMobileMode = "modal" | "sheet";

package/packages/Frameworks/Dialog/contents/Dialog.footer.tsx

@@ -1,10 +1,10 @@
 "use client";
 
 import type { ReactNode } from "react";
-import Button from "@/packages/Components/Button/Button";
-import type { DialogFooterConfig } from "@/packages/Frameworks/Dialog/Dialog.types";
-import Pressable from "@/packages/Frameworks/Pressable/Pressable";
-import View from "@/packages/Frameworks/View/View";
+import Button from "../../../Components/Button/Button";
+import type { DialogFooterConfig } from "../Dialog.types";
+import Pressable from "../../Pressable/Pressable";
+import View from "../../View/View";
 
 interface DialogFooterProps {
   config?: DialogFooterConfig;

package/packages/Frameworks/Dialog/contents/Dialog.funnel.tsx

@@ -1,16 +1,16 @@
 "use client";
 
 import { useMemo, useState } from "react";
-import Button from "@/packages/Components/Button/Button";
-import Icon from "@/packages/Components/Icon/Icon";
-import Text from "@/packages/Components/Text/Text";
+import Button from "../../../Components/Button/Button";
+import Icon from "../../../Components/Icon/Icon";
+import Text from "../../../Components/Text/Text";
 import type {
   FunnelConfig,
   FunnelHistory,
   FunnelStepConfig,
-} from "@/packages/Frameworks/Dialog/Dialog.types";
-import Pressable from "@/packages/Frameworks/Pressable/Pressable";
-import View from "@/packages/Frameworks/View/View";
+} from "../Dialog.types";
+import Pressable from "../../Pressable/Pressable";
+import View from "../../View/View";
 
 interface DialogFunnelProps {
   config: FunnelConfig;

package/packages/Frameworks/Dialog/contents/Dialog.header.tsx

@@ -1,12 +1,12 @@
 "use client";
 
 import type { ReactNode } from "react";
-import Icon from "@/packages/Components/Icon/Icon";
-import Text from "@/packages/Components/Text/Text";
-import { useDialog } from "@/packages/Frameworks/Dialog/Dialog";
-import type { DialogHeaderConfig } from "@/packages/Frameworks/Dialog/Dialog.types";
-import Pressable from "@/packages/Frameworks/Pressable/Pressable";
-import View from "@/packages/Frameworks/View/View";
+import Icon from "../../../Components/Icon/Icon";
+import Text from "../../../Components/Text/Text";
+import { useDialog } from "../Dialog";
+import type { DialogHeaderConfig } from "../Dialog.types";
+import Pressable from "../../Pressable/Pressable";
+import View from "../../View/View";
 
 interface DialogHeaderProps {
   config?: DialogHeaderConfig & {