@m1kapp/kit 0.0.18 → 0.0.21

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
-import React__default, { ReactNode, CSSProperties } from 'react';
+import React__default, { ReactNode, CSSProperties, RefObject } from 'react';
 import { MetadataRoute, Viewport } from 'next';
 import { ClassValue } from 'clsx';
 
@@ -69,6 +69,27 @@ interface AppShellContentProps {
  */
 declare function AppShellContent({ children, className }: AppShellContentProps): react_jsx_runtime.JSX.Element;
 
+interface FabProps {
+    onClick: () => void;
+    icon: ReactNode;
+    /** Accent background color. Default: zinc-900/white (follows dark mode) */
+    color?: string;
+    className?: string;
+}
+/**
+ * Floating Action Button — positioned absolute bottom-right inside AppShell.
+ *
+ * Portals into the nearest `.in-app-sheet-content-portal` (AppShellContent wrapper)
+ * so it stays pinned regardless of scroll content height.
+ *
+ * @example
+ * <AppShellContent>
+ *   {content}
+ *   <Fab onClick={handleAdd} icon={<PlusIcon />} color="#6366f1" />
+ * </AppShellContent>
+ */
+declare function Fab({ onClick, icon, color, className }: FabProps): react_jsx_runtime.JSX.Element;
+
 interface TabBarProps {
     children: ReactNode;
     className?: string;
@@ -559,6 +580,26 @@ declare function useInView(options?: UseInViewOptions): UseInViewResult;
  */
 declare function useFocusTrap<T extends HTMLElement = HTMLElement>(active: boolean): React$1.RefObject<T | null>;
 
+/**
+ * Calls `onEscape` when the Escape key is pressed while `active` is true.
+ */
+declare function useEscapeKey(active: boolean, onEscape: () => void): void;
+
+/**
+ * Locks scroll on the nearest `.tab-scroll` ancestor (or falls back to querySelector)
+ * while `active` is true. Restores previous overflow on cleanup.
+ */
+declare function useScrollLock(active: boolean, anchorRef?: RefObject<HTMLElement | null>): void;
+
+/**
+ * Finds the nearest portal container by walking up from a hidden anchor span.
+ * Searches for `selectors` in order via `.closest()`, falls back to `document.body`.
+ *
+ * Returns `[anchorRef, target]` — attach `anchorRef` to a hidden `<span>` so
+ * the DOM walk has a starting point.
+ */
+declare function usePortalTarget(selectors?: string | string[]): [React.RefObject<HTMLSpanElement | null>, HTMLElement | null];
+
 interface SkeletonProps {
     /** Tailwind classes for width / height (e.g. "h-4 w-3/4") */
     className?: string;
@@ -600,10 +641,16 @@ interface InAppSheetProps {
     onClose: () => void;
     children: React.ReactNode;
     className?: string;
+    /** 시트 상단 타이틀 — X 버튼과 나란히 정렬 */
+    title?: string;
     /** true면 시트가 AppShell 전체 높이를 채움 */
     fullHeight?: boolean;
+    /** 우상단 X 버튼 숨기기. Default: false (보임) */
+    hideClose?: boolean;
+    /** 닫기 버튼 aria-label. Default: "닫기" */
+    closeLabel?: string;
 }
-declare function InAppSheet({ open, onClose, children, className, fullHeight, }: InAppSheetProps): react_jsx_runtime.JSX.Element;
+declare function InAppSheet({ open, onClose, children, className, title, fullHeight, hideClose, closeLabel, }: InAppSheetProps): react_jsx_runtime.JSX.Element;
 
 type PWAInstallState = "android-ready" | "ios-safari" | "installed" | "unsupported";
 interface UsePWAInstallReturn {
@@ -818,4 +865,4 @@ declare function formatPrice(amount: number, currency?: string, locale?: string)
 
 declare function cn(...inputs: ClassValue[]): string;
 
-export { type ApiClient, type ApiClientOptions, ApiError, AppShell, AppShellContent, type AppShellContentProps, AppShellHeader, type AppShellHeaderProps, type AppShellProps, Avatar, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, type ColorName, Dialog, type DialogProps, Divider, EmojiButton, type EmojiButtonProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerProps, EmptyState, type EmptyStateProps, FontLinks, type FontName, GrassMap, type GrassMapData, type GrassMapLabels, type GrassMapProps, IOSInstallSheet, InAppSheet, type InAppSheetProps, KitStyles, PWAInstallButton, type PWAInstallState, Section, SectionHeader, type SectionHeaderProps, type SectionProps, ShareButton, type ShareButtonProps, Skeleton, type SkeletonProps, StatChip, type StatChipProps, THEME_SCRIPT, Tab, TabBar, type TabBarProps, type TabProps, ThemeButton, type ThemeButtonProps, ThemeDialog, type ThemeDialogLabels, type ThemeDialogProps, type ToastOptions, ToastProvider, type ToastVariant, Tooltip, type TooltipProps, Typewriter, type TypewriterProps, type UseFetchOptions, type UseFetchResult, type UseFormSubmitOptions, type UseFormSubmitResult, type UseInViewOptions, type UseInViewResult, type UsePWAInstallReturn, type UsePollingOptions, type UsePollingResult, type UseShareOptions, type UseShareReturn, Watermark, type WatermarkProps, type WatermarkSponsor, clearFetchCache, cn, colors, createApiClient, createManifest, fontFamily, fonts, formatNumber, formatPrice, mobileViewport, relativeTime, svgIcon, useDebounce, useFetch, useFocusTrap, useFormSubmit, useInView, useLocalStorage, usePWAInstall, usePolling, useShare, useToast };
+export { type ApiClient, type ApiClientOptions, ApiError, AppShell, AppShellContent, type AppShellContentProps, AppShellHeader, type AppShellHeaderProps, type AppShellProps, Avatar, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, type ColorName, Dialog, type DialogProps, Divider, EmojiButton, type EmojiButtonProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerProps, EmptyState, type EmptyStateProps, Fab, type FabProps, FontLinks, type FontName, GrassMap, type GrassMapData, type GrassMapLabels, type GrassMapProps, IOSInstallSheet, InAppSheet, type InAppSheetProps, KitStyles, PWAInstallButton, type PWAInstallState, Section, SectionHeader, type SectionHeaderProps, type SectionProps, ShareButton, type ShareButtonProps, Skeleton, type SkeletonProps, StatChip, type StatChipProps, THEME_SCRIPT, Tab, TabBar, type TabBarProps, type TabProps, ThemeButton, type ThemeButtonProps, ThemeDialog, type ThemeDialogLabels, type ThemeDialogProps, type ToastOptions, ToastProvider, type ToastVariant, Tooltip, type TooltipProps, Typewriter, type TypewriterProps, type UseFetchOptions, type UseFetchResult, type UseFormSubmitOptions, type UseFormSubmitResult, type UseInViewOptions, type UseInViewResult, type UsePWAInstallReturn, type UsePollingOptions, type UsePollingResult, type UseShareOptions, type UseShareReturn, Watermark, type WatermarkProps, type WatermarkSponsor, clearFetchCache, cn, colors, createApiClient, createManifest, fontFamily, fonts, formatNumber, formatPrice, mobileViewport, relativeTime, svgIcon, useDebounce, useEscapeKey, useFetch, useFocusTrap, useFormSubmit, useInView, useLocalStorage, usePWAInstall, usePolling, usePortalTarget, useScrollLock, useShare, useToast };

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
-import React__default, { ReactNode, CSSProperties } from 'react';
+import React__default, { ReactNode, CSSProperties, RefObject } from 'react';
 import { MetadataRoute, Viewport } from 'next';
 import { ClassValue } from 'clsx';
 
@@ -69,6 +69,27 @@ interface AppShellContentProps {
  */
 declare function AppShellContent({ children, className }: AppShellContentProps): react_jsx_runtime.JSX.Element;
 
+interface FabProps {
+    onClick: () => void;
+    icon: ReactNode;
+    /** Accent background color. Default: zinc-900/white (follows dark mode) */
+    color?: string;
+    className?: string;
+}
+/**
+ * Floating Action Button — positioned absolute bottom-right inside AppShell.
+ *
+ * Portals into the nearest `.in-app-sheet-content-portal` (AppShellContent wrapper)
+ * so it stays pinned regardless of scroll content height.
+ *
+ * @example
+ * <AppShellContent>
+ *   {content}
+ *   <Fab onClick={handleAdd} icon={<PlusIcon />} color="#6366f1" />
+ * </AppShellContent>
+ */
+declare function Fab({ onClick, icon, color, className }: FabProps): react_jsx_runtime.JSX.Element;
+
 interface TabBarProps {
     children: ReactNode;
     className?: string;
@@ -559,6 +580,26 @@ declare function useInView(options?: UseInViewOptions): UseInViewResult;
  */
 declare function useFocusTrap<T extends HTMLElement = HTMLElement>(active: boolean): React$1.RefObject<T | null>;
 
+/**
+ * Calls `onEscape` when the Escape key is pressed while `active` is true.
+ */
+declare function useEscapeKey(active: boolean, onEscape: () => void): void;
+
+/**
+ * Locks scroll on the nearest `.tab-scroll` ancestor (or falls back to querySelector)
+ * while `active` is true. Restores previous overflow on cleanup.
+ */
+declare function useScrollLock(active: boolean, anchorRef?: RefObject<HTMLElement | null>): void;
+
+/**
+ * Finds the nearest portal container by walking up from a hidden anchor span.
+ * Searches for `selectors` in order via `.closest()`, falls back to `document.body`.
+ *
+ * Returns `[anchorRef, target]` — attach `anchorRef` to a hidden `<span>` so
+ * the DOM walk has a starting point.
+ */
+declare function usePortalTarget(selectors?: string | string[]): [React.RefObject<HTMLSpanElement | null>, HTMLElement | null];
+
 interface SkeletonProps {
     /** Tailwind classes for width / height (e.g. "h-4 w-3/4") */
     className?: string;
@@ -600,10 +641,16 @@ interface InAppSheetProps {
     onClose: () => void;
     children: React.ReactNode;
     className?: string;
+    /** 시트 상단 타이틀 — X 버튼과 나란히 정렬 */
+    title?: string;
     /** true면 시트가 AppShell 전체 높이를 채움 */
     fullHeight?: boolean;
+    /** 우상단 X 버튼 숨기기. Default: false (보임) */
+    hideClose?: boolean;
+    /** 닫기 버튼 aria-label. Default: "닫기" */
+    closeLabel?: string;
 }
-declare function InAppSheet({ open, onClose, children, className, fullHeight, }: InAppSheetProps): react_jsx_runtime.JSX.Element;
+declare function InAppSheet({ open, onClose, children, className, title, fullHeight, hideClose, closeLabel, }: InAppSheetProps): react_jsx_runtime.JSX.Element;
 
 type PWAInstallState = "android-ready" | "ios-safari" | "installed" | "unsupported";
 interface UsePWAInstallReturn {
@@ -818,4 +865,4 @@ declare function formatPrice(amount: number, currency?: string, locale?: string)
 
 declare function cn(...inputs: ClassValue[]): string;
 
-export { type ApiClient, type ApiClientOptions, ApiError, AppShell, AppShellContent, type AppShellContentProps, AppShellHeader, type AppShellHeaderProps, type AppShellProps, Avatar, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, type ColorName, Dialog, type DialogProps, Divider, EmojiButton, type EmojiButtonProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerProps, EmptyState, type EmptyStateProps, FontLinks, type FontName, GrassMap, type GrassMapData, type GrassMapLabels, type GrassMapProps, IOSInstallSheet, InAppSheet, type InAppSheetProps, KitStyles, PWAInstallButton, type PWAInstallState, Section, SectionHeader, type SectionHeaderProps, type SectionProps, ShareButton, type ShareButtonProps, Skeleton, type SkeletonProps, StatChip, type StatChipProps, THEME_SCRIPT, Tab, TabBar, type TabBarProps, type TabProps, ThemeButton, type ThemeButtonProps, ThemeDialog, type ThemeDialogLabels, type ThemeDialogProps, type ToastOptions, ToastProvider, type ToastVariant, Tooltip, type TooltipProps, Typewriter, type TypewriterProps, type UseFetchOptions, type UseFetchResult, type UseFormSubmitOptions, type UseFormSubmitResult, type UseInViewOptions, type UseInViewResult, type UsePWAInstallReturn, type UsePollingOptions, type UsePollingResult, type UseShareOptions, type UseShareReturn, Watermark, type WatermarkProps, type WatermarkSponsor, clearFetchCache, cn, colors, createApiClient, createManifest, fontFamily, fonts, formatNumber, formatPrice, mobileViewport, relativeTime, svgIcon, useDebounce, useFetch, useFocusTrap, useFormSubmit, useInView, useLocalStorage, usePWAInstall, usePolling, useShare, useToast };
+export { type ApiClient, type ApiClientOptions, ApiError, AppShell, AppShellContent, type AppShellContentProps, AppShellHeader, type AppShellHeaderProps, type AppShellProps, Avatar, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, type ColorName, Dialog, type DialogProps, Divider, EmojiButton, type EmojiButtonProps, EmojiPicker, type EmojiPickerLabels, type EmojiPickerProps, EmptyState, type EmptyStateProps, Fab, type FabProps, FontLinks, type FontName, GrassMap, type GrassMapData, type GrassMapLabels, type GrassMapProps, IOSInstallSheet, InAppSheet, type InAppSheetProps, KitStyles, PWAInstallButton, type PWAInstallState, Section, SectionHeader, type SectionHeaderProps, type SectionProps, ShareButton, type ShareButtonProps, Skeleton, type SkeletonProps, StatChip, type StatChipProps, THEME_SCRIPT, Tab, TabBar, type TabBarProps, type TabProps, ThemeButton, type ThemeButtonProps, ThemeDialog, type ThemeDialogLabels, type ThemeDialogProps, type ToastOptions, ToastProvider, type ToastVariant, Tooltip, type TooltipProps, Typewriter, type TypewriterProps, type UseFetchOptions, type UseFetchResult, type UseFormSubmitOptions, type UseFormSubmitResult, type UseInViewOptions, type UseInViewResult, type UsePWAInstallReturn, type UsePollingOptions, type UsePollingResult, type UseShareOptions, type UseShareReturn, Watermark, type WatermarkProps, type WatermarkSponsor, clearFetchCache, cn, colors, createApiClient, createManifest, fontFamily, fonts, formatNumber, formatPrice, mobileViewport, relativeTime, svgIcon, useDebounce, useEscapeKey, useFetch, useFocusTrap, useFormSubmit, useInView, useLocalStorage, usePWAInstall, usePolling, usePortalTarget, useScrollLock, useShare, useToast };