@musecat/uikit 0.1.3 → 0.2.1

package/.agents/references/Components/Box.md

@@ -40,7 +40,7 @@ interface BoxFooterProps extends ThemeSystemProps, BorderProps, RadiusProps {
 ## Example Code
 
 ```tsx
-import Box from "@/packages/Components/Box/Box";
+import { Box } from "@musecat/uikit";
 
 export default function Example() {
   return (

package/.agents/references/Components/Button.md

@@ -33,7 +33,7 @@ interface ButtonProps extends ThemeSystemProps, RadiusProps, BorderProps {
 ## Example Code
 
 ```tsx
-import Button from "@/packages/Components/Button/Button";
+import { Button } from "@musecat/uikit";
 
 export default function Example() {
   return (

package/.agents/references/Components/Card.md

@@ -45,7 +45,7 @@ type CardProps = CardDefaultProps | CardFoldableProps;
 ## Example Code
 
 ```tsx
-import Card from "@/packages/Components/Card/Card";
+import { Card } from "@musecat/uikit";
 
 export default function Example() {
   return (

package/.agents/references/Components/Checkbox.md

@@ -33,7 +33,7 @@ interface CheckboxProps
 ## Example Code
 
 ```tsx
-import Checkbox from "@/packages/Components/Checkbox/Checkbox";
+import { Checkbox } from "@musecat/uikit";
 
 export default function Example() {
   return (

package/.agents/references/Components/CodeBox.md

@@ -22,7 +22,7 @@ interface CodeBoxProps extends ThemeSystemProps, RadiusProps, BorderProps {
 ## Example Code
 
 ```tsx
-import CodeBox from "@/packages/Components/CodeBox/CodeBox";
+import { CodeBox } from "@musecat/uikit";
 
 export default function Example() {
   const sampleCode = `const hello = 'world';\nconsole.log(hello);`;

package/.agents/references/Components/ContextMenu.md

@@ -40,7 +40,7 @@ interface ContextMenuProps {
 ## Example Code
 
 ```tsx
-import ContextMenu from "@/packages/Components/ContextMenu/ContextMenu";
+import { ContextMenu } from "@musecat/uikit";
 import { useRef, useState } from "react";
 
 export default function Example() {

package/.agents/references/Components/ContributionGraph.md

@@ -39,7 +39,7 @@ export interface ContributionGraphProps
 ## 4. Example Code
 
 ```tsx
-import ContributionGraph from "@/packages/Components/ContributionGraph/ContributionGraph";
+import { ContributionGraph } from "@musecat/uikit";
 
 export default function Example() {
   const data = [

package/.agents/references/Components/DatePicker.md

@@ -63,7 +63,7 @@ export interface DatePickerProps {
 ## 4. Example Code
 
 ```tsx
-import DatePicker from "@/packages/Components/DatePicker/DatePicker";
+import { DatePicker } from "@musecat/uikit";
 
 export default function Example() {
   return (

package/.agents/references/Components/Divider.md

@@ -32,7 +32,7 @@ export interface DividerProps {
 ## 4. Example Code
 
 ```tsx
-import Divider from "@/packages/Components/Divider/Divider";
+import { Divider } from "@musecat/uikit";
 
 export default function Example() {
   return (

package/.agents/references/Components/Header.md

@@ -27,9 +27,9 @@ export interface HeaderProps {
 ## 4. Example Code
 
 ```tsx
-import Header from "@/packages/Components/Header/Header";
-import Icon from "@/packages/Components/Icon/Icon";
-import Text from "@/packages/Components/Text/Text";
+import { Header } from "@musecat/uikit";
+import { Icon } from "@musecat/uikit";
+import { Text } from "@musecat/uikit";
 
 export default function Example() {
   return (

package/.agents/references/Components/Icon.md

@@ -54,7 +54,7 @@ export interface IconProps extends ThemeSystemProps, RadiusProps, BorderProps {
 ## 4. Example Code
 
 ```tsx
-import Icon from "@/packages/Components/Icon/Icon";
+import { Icon } from "@musecat/uikit";
 
 export default function Example() {
   return (

package/.agents/references/Components/Input.md

@@ -36,7 +36,7 @@ _(LabelSharedProps includes `title`, `required`, `hint`, ThemeSystemProps, etc.)
 ## 4. Example Code
 
 ```tsx
-import Input from "@/packages/Components/Input/Input";
+import { Input } from "@musecat/uikit";
 
 export default function Example() {
   return (

package/.agents/references/Components/Label.md

@@ -55,8 +55,8 @@ export type LabelSharedProps = Omit<
 ## 4. Example Code
 
 ```tsx
-import Label from "@/packages/Components/Label/Label";
-import Checkbox from "@/packages/Components/Checkbox/Checkbox"; // virtual import
+import { Label } from "@musecat/uikit";
+import { Checkbox } from "@musecat/uikit"; // virtual import
 
 export default function Example() {
   return (

package/.agents/references/Components/Layout.md

@@ -63,8 +63,8 @@ export interface DocsLayoutProps {
 ## Example Code
 
 ```tsx
-import Layout from "@/packages/Components/Layout/Layout";
-import DocsLayout from "@/packages/Components/Layout/Layout.docs";
+import { Layout } from "@musecat/uikit";
+import { DocsLayout } from "@musecat/uikit";
 
 // Basic layout and section split
 export function MyPage() {

package/.agents/references/Components/Maps.md

@@ -38,7 +38,7 @@ export interface MapOSMProps {
 ## Example Code
 
 ```tsx
-import MapOSM from "@/packages/Components/Maps/OSM/MapOSM";
+import { MapOSM } from "@musecat/uikit";
 import { useState } from "react";
 
 export function LocationPicker() {

package/.agents/references/Components/Nav.md

@@ -42,7 +42,7 @@ export interface NavProps extends RadiusProps {
 ## Example Code
 
 ```tsx
-import Nav from "@/packages/Components/Nav/Nav";
+import { Nav } from "@musecat/uikit";
 import { useState } from "react";
 
 export function TabNavigation() {

package/.agents/references/Components/Pagination.md

@@ -40,7 +40,7 @@ export interface PaginationProps extends ThemeSystemProps, BorderProps {
 ## Example Code
 
 ```tsx
-import Pagination from "@/packages/Components/Pagination/Pagination";
+import { Pagination } from "@musecat/uikit";
 import { useState } from "react";
 
 export function DataList() {

package/.agents/references/Components/Pill.md

@@ -49,7 +49,7 @@ export interface PillProps extends ThemeSystemProps, RadiusProps, BorderProps {
 ## Example Code
 
 ```tsx
-import Pill from "@/packages/Components/Pill/Pill";
+import { Pill } from "@musecat/uikit";
 
 export function TagList() {
   return (

package/.agents/references/Components/Profile.md

@@ -54,7 +54,7 @@ export interface ProfileProps {
 ## Example Code
 
 ```tsx
-import Profile from "@/packages/Components/Profile/Profile";
+import { Profile } from "@musecat/uikit";
 
 export function UserHeader() {
   return (

package/.agents/references/Components/Progress.md

@@ -14,7 +14,7 @@ A linear progress bar component that visualizes task progress as a percentage. I
 
 ```tsx
 // Progress.types.ts
-import { RadiusProps } from "@/packages/Frameworks/Theme/Radius.types";
+import { RadiusProps } from "@musecat/uikit";
 import type {
   ThemeBackgroundPaint,
   ThemePaint,
@@ -38,7 +38,7 @@ export interface ProgressProps extends RadiusProps {
 ## Example Code
 
 ```tsx
-import Progress from "@/packages/Components/Progress/Progress";
+import { Progress } from "@musecat/uikit";
 
 export function FileUploadStatus({
   progressPercentage,

package/.agents/references/Components/Radio.md

@@ -13,7 +13,7 @@ The `Radio` component provides a radio button UI that lets the user select a sin
 ## Type Signatures
 
 ```typescript
-import type { RadiusProps } from "@/packages/Frameworks/Theme/Radius.types";
+import type { RadiusProps } from "@musecat/uikit";
 import type { UIKitSizeValue } from "../../Frameworks/_shared/sizing";
 import type {
   BorderProps,
@@ -39,7 +39,7 @@ export interface RadioProps
 ## Example Code
 
 ```tsx
-import Radio from "@/packages/Components/Radio/Radio";
+import { Radio } from "@musecat/uikit";
 import { useState } from "react";
 
 export default function RadioExample() {

package/.agents/references/Components/Select.md

@@ -55,7 +55,7 @@ export interface SelectProps<
 ## Example Code
 
 ```tsx
-import Select from "@/packages/Components/Select/Select";
+import { Select } from "@musecat/uikit";
 import { useState } from "react";
 
 export default function SelectExample() {

package/.agents/references/Components/Skeleton.md

@@ -29,7 +29,7 @@ export interface SkeletonProps {
 ## Example Code
 
 ```tsx
-import Skeleton from "@/packages/Components/Skeleton/Skeleton";
+import { Skeleton } from "@musecat/uikit";
 
 export default function SkeletonExample() {
   return (

package/.agents/references/Components/Spinner.md

@@ -37,7 +37,7 @@ export interface SpinnerProps {
 ## Example Code
 
 ```tsx
-import Spinner from "@/packages/Components/Spinner/Spinner";
+import { Spinner } from "@musecat/uikit";
 
 export default function SpinnerExample() {
   return (

package/.agents/references/Components/Text.md

@@ -51,7 +51,7 @@ export interface TextProps {
 ## Example Code
 
 ```tsx
-import Text from "@/packages/Components/Text/Text";
+import { Text } from "@musecat/uikit";
 
 export default function TextExample() {
   return (

package/.agents/references/Components/TimePicker.md

@@ -41,7 +41,7 @@ export interface TimePickerProps {
 ## Example Code
 
 ```tsx
-import TimePicker from "@/packages/Components/TimePicker/TimePicker";
+import { TimePicker } from "@musecat/uikit";
 import { useState } from "react";
 
 export default function TimePickerExample() {

package/.agents/references/Components/Timeline.md

@@ -41,8 +41,8 @@ export interface TimelineProps {
 ## Example Code
 
 ```tsx
-import Timeline from "@/packages/Components/Timeline/Timeline";
-import Text from "@/packages/Components/Text/Text";
+import { Timeline } from "@musecat/uikit";
+import { Text } from "@musecat/uikit";
 
 export default function TimelineExample() {
   const events = [

package/.agents/references/Frameworks/DNDView.md

@@ -46,7 +46,7 @@ export interface DNDViewProps<T> extends ViewProps {
 ## Example Code
 
 ```tsx
-import View from "@/packages/Frameworks/View";
+import { View } from "@musecat/uikit";
 import { useState } from "react";
 
 function SortableList() {

package/.agents/references/Frameworks/Dialog.md

@@ -63,8 +63,8 @@ dialog.popover = (anchor: HTMLElement, props: Omit<DialogProps, "mode">) =>
 ## Example Code
 
 ```tsx
-import Dialog, { dialog } from "@/packages/Frameworks/Dialog/Dialog";
-import Pressable from "@/packages/Frameworks/Pressable";
+import { Dialog, dialog } from "@musecat/uikit";
+import { Pressable } from "@musecat/uikit";
 import { useState } from "react";
 
 function Example() {

package/.agents/references/Frameworks/EdgeEffect.md

@@ -23,8 +23,8 @@ export interface EdgeEffectProps extends Omit<ViewProps, "children"> {
 ## Example Code
 
 ```tsx
-import EdgeEffect from "@/packages/Frameworks/EdgeEffect";
-import View from "@/packages/Frameworks/View";
+import { EdgeEffect } from "@musecat/uikit";
+import { View } from "@musecat/uikit";
 
 function ScrollContainer() {
   return (

package/.agents/references/Frameworks/HScrollView.md

@@ -47,8 +47,8 @@ export interface HScrollViewProps extends Omit<
 ## Example Code
 
 ```tsx
-import HScrollView from "@/packages/Frameworks/View/HScrollView/HScrollView";
-import View from "@/packages/Frameworks/View";
+import { HScrollView } from "@musecat/uikit";
+import { View } from "@musecat/uikit";
 
 function HorizontalList() {
   return (

package/.agents/references/Frameworks/ImageView.md

@@ -43,7 +43,7 @@ export interface ImageProps extends RadiusProps {
 ## Example Code
 
 ```tsx
-import View from "@/packages/Frameworks/View";
+import { View } from "@musecat/uikit";
 
 function PhotoGallery() {
   const images = [

package/.agents/references/Frameworks/Motion.md

@@ -37,7 +37,7 @@ export const motionPresets = {
 
 ```tsx
 import { motion } from "motion/react";
-import { motionPresets } from "@/packages/Frameworks/Motion";
+import { motionPresets } from "@musecat/uikit";
 
 function AnimatedModal({ isOpen, children }) {
   return (

package/.agents/references/Frameworks/Pressable.md

@@ -44,7 +44,7 @@ export interface PressableProps
 ## Example Code
 
 ```tsx
-import Pressable from "@/packages/Frameworks/Pressable/Pressable";
+import { Pressable } from "@musecat/uikit";
 
 function Example() {
   return (

package/.agents/references/Frameworks/Squircle.md

@@ -33,7 +33,7 @@ export interface SquircleProps extends Omit<
 ## Example Code
 
 ```tsx
-import Squircle from "@/packages/Frameworks/Squircle";
+import { Squircle } from "@musecat/uikit";
 
 function Card() {
   return (

package/.agents/references/Frameworks/Theme.md

@@ -51,7 +51,7 @@ import {
   resolveThemeClasses,
   Border,
   Shadow,
-} from "@/packages/Frameworks/Theme/Theme.types";
+} from "@musecat/uikit";
 import clsx from "clsx";
 
 function CustomBox(props: ThemeSystemProps) {

package/.agents/references/Frameworks/Toaster.md

@@ -34,7 +34,7 @@ export interface ToasterBootstrapProps extends ToasterProps {
 
 ```tsx
 // 1. Render at the top level (App component, etc.)
-import ToasterBootstrap from "@/packages/Frameworks/Toaster/Toaster.boot";
+import { ToasterBootstrap } from "@musecat/uikit";
 
 export default function App() {
   return (
@@ -46,7 +46,7 @@ export default function App() {
 }
 
 // 2. Show toast
-import { toast } from "@/packages/Frameworks/Toaster/Toaster.boot";
+import { toast } from "@musecat/uikit";
 
 function MyComponents() {
   const handleSuccess = () => {

package/.agents/references/Frameworks/View.md

@@ -57,7 +57,7 @@ export interface ViewProps
 ## Example Code
 
 ```tsx
-import View from "@/packages/Frameworks/View/View";
+import { View } from "@musecat/uikit";
 
 function Card() {
   return (

package/.agents/references/Frameworks/_shared.md

@@ -51,9 +51,9 @@ export function useScrollLock(locked?: boolean): { lockScroll: () => void, openS
 ## Example Code
 
 ```tsx
-import { Size } from "@/packages/Frameworks/_shared/sizing";
-import { useScrollLock } from "@/packages/Frameworks/_shared/bodyScrollLock";
-import { useControllableState } from "@/packages/Frameworks/_shared/useControllableState";
+import { Size } from "@musecat/uikit";
+import { useScrollLock } from "@musecat/uikit";
+import { useControllableState } from "@musecat/uikit";
 
 function MyComponent({ value, defaultValue, width }) {
   // Scroll lock

package/README.md

@@ -5,7 +5,29 @@ A Next.js 16 + React 19 + TypeScript UI Design component library.
 ## Installation
 
 ```bash
-npm install @musecat/uikit
+npm install @musecat/uikit @musecat/functionkit
+```
+
+This package ships **raw TypeScript + SCSS source** (no prebuilt bundle), so your app must transpile it.
+
+### Next.js setup
+
+Add the packages to `transpilePackages` in `next.config.ts`:
+
+```ts
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+  transpilePackages: ["@musecat/uikit", "@musecat/functionkit"],
+};
+
+export default nextConfig;
+```
+
+Install the Sass compiler so the bundled `*.module.scss` styles are compiled:
+
+```bash
+npm install -D sass
 ```
 
 ## Usage
@@ -50,6 +72,8 @@ This package includes `.agents/references/` directory with detailed documentatio
 - [es-hangul](https://es-hangul.toss.im/)
 - [MapLibre GL JS](https://maplibre.org/)
 
+Published as raw TypeScript + SCSS source and built with [TypeScript](https://www.typescriptlang.org/).
+
 ## License
 
 [MIT License](./LICENSE) © Musecat Team.

package/global.d.ts

@@ -0,0 +1,6 @@
+declare module "*.module.scss" {
+	const classes: { readonly [key: string]: string };
+	export default classes;
+}
+
+declare module "*.css";

package/i18n/messages/en/uikit.json

@@ -0,0 +1,50 @@
+{
+  "UIKit": {
+    "presets": {
+      "alert": {
+        "title": "Heads up.",
+        "caption": "Review the information and continue.",
+        "confirm": "Confirm"
+      },
+      "confirm": {
+        "title": "Confirmation required.",
+        "caption": "Review the details and choose how to proceed.",
+        "confirm": "Continue",
+        "cancel": "Cancel"
+      },
+      "error": {
+        "title": "Something went wrong.",
+        "caption": "Please try again in a moment.",
+        "confirm": "Confirm"
+      },
+      "success": {
+        "title": "Completed.",
+        "caption": "Your request was completed successfully.",
+        "confirm": "Confirm"
+      }
+    },
+    "actions": {
+      "cancel": "Cancel",
+      "close": "Close",
+      "confirm": "Confirm",
+      "submit": "Submit",
+      "submitting": "Processing...",
+      "required": "Required"
+    },
+    "ui": {
+      "select": "Select",
+      "noResults": "No results",
+      "imageGallery": "Image gallery",
+      "dateSelect": "Select date",
+      "dateRangeSelect": "Select date range",
+      "pagination": "Pagination",
+      "previous": "Previous",
+      "next": "Next",
+      "goToPage": "Go to page",
+      "currentPage": "Current page {value}",
+      "goToPageItem": "Go to page {value}",
+      "less": "Less",
+      "more": "More"
+    }
+  }
+}

package/i18n/messages/jp/uikit.json

@@ -0,0 +1,50 @@
+{
+  "UIKit": {
+    "presets": {
+      "alert": {
+        "title": "ご案内します。",
+        "caption": "内容を確認してから続行してください。",
+        "confirm": "確認"
+      },
+      "confirm": {
+        "title": "確認が必要です。",
+        "caption": "内容を確認して、進行するかどうか選択してください。",
+        "confirm": "続ける",
+        "cancel": "キャンセル"
+      },
+      "error": {
+        "title": "問題が発生しました。",
+        "caption": "しばらくしてから再度お試しください。",
+        "confirm": "確認"
+      },
+      "success": {
+        "title": "完了しました。",
+        "caption": "リクエストは正常に処理されました。",
+        "confirm": "確認"
+      }
+    },
+    "actions": {
+      "cancel": "キャンセル",
+      "close": "閉じる",
+      "confirm": "確認",
+      "submit": "送信",
+      "submitting": "処理中...",
+      "required": "必須"
+    },
+    "ui": {
+      "select": "選択",
+      "noResults": "結果なし",
+      "imageGallery": "画像ギャラリー",
+      "dateSelect": "日付を選択",
+      "dateRangeSelect": "期間を選択",
+      "pagination": "ページ移動",
+      "previous": "前へ",
+      "next": "次へ",
+      "goToPage": "ページへ移動",
+      "currentPage": "現在のページ {value}",
+      "goToPageItem": "{value}ページへ移動",
+      "less": "少ない",
+      "more": "多い"
+    }
+  }
+}

package/i18n/messages/kr/uikit.json

@@ -0,0 +1,50 @@
+{
+  "UIKit": {
+    "presets": {
+      "alert": {
+        "title": "안내",
+        "caption": "내용을 확인해 주세요.",
+        "confirm": "확인"
+      },
+      "confirm": {
+        "title": "정말 진행하시겠습니까?",
+        "caption": "계속 진행할지 선택해 주세요.",
+        "confirm": "진행",
+        "cancel": "취소"
+      },
+      "error": {
+        "title": "문제가 발생했습니다.",
+        "caption": "잠시 후 다시 시도해 주세요.",
+        "confirm": "확인"
+      },
+      "success": {
+        "title": "완료되었습니다.",
+        "caption": "요청이 정상적으로 처리되었습니다.",
+        "confirm": "확인"
+      }
+    },
+    "actions": {
+      "cancel": "취소",
+      "close": "닫기",
+      "confirm": "확인",
+      "submit": "제출",
+      "submitting": "처리 중...",
+      "required": "필수"
+    },
+    "ui": {
+      "select": "선택",
+      "noResults": "결과 없음",
+      "imageGallery": "이미지 갤러리",
+      "dateSelect": "날짜 선택",
+      "dateRangeSelect": "날짜 범위 선택",
+      "pagination": "페이지 이동",
+      "previous": "이전",
+      "next": "다음",
+      "goToPage": "페이지로 이동",
+      "currentPage": "현재 페이지 {value}",
+      "goToPageItem": "{value}페이지로 이동",
+      "less": "적음",
+      "more": "많음"
+    }
+  }
+}