@soave/ui 0.2.0 → 0.2.2

package/dist/adapters/types.d.ts

@@ -23,7 +23,7 @@ export interface StyleAdapter {
 /**
  * Adapter レジストリ
  */
-export declare const ADAPTER_REGISTRY: any;
+export declare const ADAPTER_REGISTRY: Map<string, StyleAdapter>;
 /**
  * Adapter を登録
  */

package/dist/components/ui/Dialog.vue

@@ -44,9 +44,10 @@
 </template>
 
 <script setup lang="ts">
-import { computed, provide, type InjectionKey } from "vue"
+import { computed, provide } from "vue"
 import { useStyleAdapter } from "../../composables"
 import type { DialogProps } from "../../types/dialog"
+import { DIALOG_KEY } from "../../types/dialog"
 import type { DialogState } from "../../types/composables"
 
 interface DialogComponentProps extends DialogProps {
@@ -101,13 +102,7 @@ const handleOverlayClick = () => {
     }
 }
 
-export interface DialogContext {
-    close: () => void
-}
-
-export const DialogKey: InjectionKey<DialogContext> = Symbol("dialog")
-
-provide(DialogKey, { close })
+provide(DIALOG_KEY, { close })
 </script>
 
 <style scoped>

package/dist/components/ui/DropdownMenu.vue

@@ -5,11 +5,12 @@
 </template>
 
 <script setup lang="ts">
-import { provide, ref, type InjectionKey, type Ref } from "vue"
-import { useDropdown, type UseDropdownReturn } from "../../composables/useDropdown"
+import { provide, ref, type Ref } from "vue"
+import { useDropdown } from "../../composables/useDropdown"
 import type { DropdownSide, DropdownAlign } from "../../types/dropdown"
+import { DROPDOWN_CONTEXT_KEY } from "../../types/dropdown"
 
-export interface Props {
+interface Props {
     side?: DropdownSide
     align?: DropdownAlign
     class?: string
@@ -20,8 +21,6 @@ const props = withDefaults(defineProps<Props>(), {
     align: "start"
 })
 
-export const DROPDOWN_CONTEXT_KEY: InjectionKey<UseDropdownReturn> = Symbol("dropdown-context")
-
 const dropdown_props = ref({
     side: props.side,
     align: props.align

package/dist/components/ui/DropdownMenuContent.vue

@@ -19,8 +19,8 @@
 <script setup lang="ts">
 import { inject, ref, computed, watchEffect, nextTick, watch } from "vue"
 import { useStyleAdapter } from "../../composables"
-import { DROPDOWN_CONTEXT_KEY } from "./DropdownMenu.vue"
 import type { DropdownContentProps } from "../../types/dropdown"
+import { DROPDOWN_CONTEXT_KEY } from "../../types/dropdown"
 import type { DropdownState } from "../../types/composables"
 
 const props = withDefaults(defineProps<DropdownContentProps>(), {

package/dist/components/ui/DropdownMenuItem.vue

@@ -18,8 +18,8 @@
 <script setup lang="ts">
 import { inject, computed, onMounted } from "vue"
 import { useStyleAdapter } from "../../composables"
-import { DROPDOWN_CONTEXT_KEY } from "./DropdownMenu.vue"
 import type { DropdownItemProps } from "../../types/dropdown"
+import { DROPDOWN_CONTEXT_KEY } from "../../types/dropdown"
 
 const props = withDefaults(defineProps<DropdownItemProps>(), {
     disabled: false,

package/dist/components/ui/DropdownMenuTrigger.vue

@@ -14,7 +14,7 @@
 
 <script setup lang="ts">
 import { inject, ref, watchEffect } from "vue"
-import { DROPDOWN_CONTEXT_KEY } from "./DropdownMenu.vue"
+import { DROPDOWN_CONTEXT_KEY } from "../../types/dropdown"
 
 const context = inject(DROPDOWN_CONTEXT_KEY)
 

package/dist/components/ui/Popover.vue

@@ -5,11 +5,12 @@
 </template>
 
 <script setup lang="ts">
-import { provide, ref, type InjectionKey, type Ref } from "vue"
-import { usePopover, type UsePopoverReturn } from "../../composables/usePopover"
+import { provide, ref, type Ref } from "vue"
+import { usePopover } from "../../composables/usePopover"
 import type { PopoverSide, PopoverAlign } from "../../types/popover"
+import { POPOVER_CONTEXT_KEY } from "../../types/popover"
 
-export interface Props {
+interface Props {
     side?: PopoverSide
     align?: PopoverAlign
     modal?: boolean
@@ -22,8 +23,6 @@ const props = withDefaults(defineProps<Props>(), {
     modal: false
 })
 
-export const POPOVER_CONTEXT_KEY: InjectionKey<UsePopoverReturn> = Symbol("popover-context")
-
 const popover_props = ref({
     side: props.side,
     align: props.align,

package/dist/components/ui/PopoverContent.vue

@@ -18,8 +18,8 @@
 <script setup lang="ts">
 import { inject, ref, computed, watchEffect, onMounted } from "vue"
 import { useStyleAdapter } from "../../composables"
-import { POPOVER_CONTEXT_KEY } from "./Popover.vue"
 import type { PopoverContentProps } from "../../types/popover"
+import { POPOVER_CONTEXT_KEY } from "../../types/popover"
 import type { PopoverState } from "../../types/composables"
 
 const props = withDefaults(defineProps<PopoverContentProps>(), {

package/dist/components/ui/PopoverTrigger.vue

@@ -13,7 +13,7 @@
 
 <script setup lang="ts">
 import { inject, ref, watchEffect } from "vue"
-import { POPOVER_CONTEXT_KEY } from "./Popover.vue"
+import { POPOVER_CONTEXT_KEY } from "../../types/popover"
 
 const context = inject(POPOVER_CONTEXT_KEY)
 

package/dist/components/ui/Sheet.vue

@@ -48,9 +48,10 @@
 </template>
 
 <script setup lang="ts">
-import { ref, computed, watch, provide, onMounted, onUnmounted, type InjectionKey } from "vue"
+import { ref, computed, watch, provide, onMounted, onUnmounted } from "vue"
 import { useStyleAdapter } from "../../composables"
 import type { SheetSide, SheetContext, SheetProps } from "../../types/sheet"
+import { SHEET_CONTEXT_KEY } from "../../types/sheet"
 import type { SheetState } from "../../types/composables"
 
 interface Props extends SheetProps {}
@@ -66,7 +67,6 @@ const emit = defineEmits<{
     "update:open": [value: boolean]
 }>()
 
-export const SHEET_CONTEXT_KEY: InjectionKey<SheetContext> = Symbol("sheet-context")
 
 const style_adapter = useStyleAdapter()
 const is_open = ref(props.open)

package/dist/components/ui/Toaster.vue

@@ -30,7 +30,7 @@ import { computed, ref, watchEffect } from "vue"
 import { useStyleAdapter } from "../../composables"
 import { useToast } from "../../composables/useToast"
 import Toast from "./Toast.vue"
-import type { ToastPosition, Toast as ToastType } from "../../types/toast"
+import type { ToastPosition, ToastItem } from "../../types/toast"
 
 export interface Props {
     position?: ToastPosition
@@ -50,7 +50,7 @@ const props = withDefaults(defineProps<Props>(), {
 const { toasts, dismiss } = useToast()
 const style_adapter = useStyleAdapter()
 
-const internal_toasts = ref<ToastType[]>([])
+const internal_toasts = ref<ToastItem[]>([])
 
 watchEffect(() => {
     internal_toasts.value = [...toasts]

package/dist/components/ui/Tooltip.vue

@@ -5,11 +5,12 @@
 </template>
 
 <script setup lang="ts">
-import { provide, ref, toRef, type InjectionKey, type Ref } from "vue"
-import { useTooltip, type UseTooltipReturn } from "../../composables/useTooltip"
+import { provide, ref, type Ref } from "vue"
+import { useTooltip } from "../../composables/useTooltip"
 import type { TooltipSide, TooltipAlign } from "../../types/tooltip"
+import { TOOLTIP_CONTEXT_KEY } from "../../types/tooltip"
 
-export interface Props {
+interface Props {
     side?: TooltipSide
     align?: TooltipAlign
     delay_duration?: number
@@ -26,8 +27,6 @@ const props = withDefaults(defineProps<Props>(), {
     disabled: false
 })
 
-export const TOOLTIP_CONTEXT_KEY: InjectionKey<UseTooltipReturn> = Symbol("tooltip-context")
-
 const tooltip_props = ref({
     side: props.side,
     align: props.align,

package/dist/components/ui/TooltipContent.vue

@@ -18,8 +18,8 @@
 <script setup lang="ts">
 import { inject, ref, computed, watchEffect } from "vue"
 import { useStyleAdapter } from "../../composables"
-import { TOOLTIP_CONTEXT_KEY } from "./Tooltip.vue"
 import type { TooltipContentProps } from "../../types/tooltip"
+import { TOOLTIP_CONTEXT_KEY } from "../../types/tooltip"
 import type { TooltipState } from "../../types/composables"
 
 const props = withDefaults(defineProps<TooltipContentProps>(), {

package/dist/components/ui/TooltipTrigger.vue

@@ -13,7 +13,7 @@
 
 <script setup lang="ts">
 import { inject, ref, watchEffect } from "vue"
-import { TOOLTIP_CONTEXT_KEY } from "./Tooltip.vue"
+import { TOOLTIP_CONTEXT_KEY } from "../../types/tooltip"
 
 const context = inject(TOOLTIP_CONTEXT_KEY)
 

package/dist/composables/useForm.mjs

@@ -146,8 +146,8 @@ export const useForm = (schema) => {
     errors: readonly(form_state.errors),
     touched: readonly(form_state.touched),
     is_valid,
-    is_submitting: readonly(computed(() => form_state.is_submitting)),
-    is_dirty: readonly(computed(() => form_state.is_dirty)),
+    is_submitting: computed(() => form_state.is_submitting),
+    is_dirty: computed(() => form_state.is_dirty),
     validateField,
     validateAll,
     reset,

package/dist/composables/useToast.mjs

@@ -46,7 +46,7 @@ export function useToast() {
     });
   };
   return {
-    toasts: toasts.value,
+    toasts: [...toasts.value],
     add,
     dismiss,
     dismissAll,

package/dist/env.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="vite/client" />
+
+interface ImportMetaEnv {
+    readonly DEV: boolean
+    readonly PROD: boolean
+    readonly MODE: string
+}
+
+interface ImportMeta {
+    readonly env: ImportMetaEnv
+}

package/dist/types/composables.d.ts

@@ -1,8 +1,14 @@
 import type { Ref } from "vue";
+/**
+ * 汎用的なコンポーネント状態（基底型）
+ */
+export interface ComponentState {
+    [key: string]: unknown;
+}
 /**
  * Button の状態
  */
-export interface ButtonState {
+export interface ButtonState extends ComponentState {
     variant: "primary" | "secondary" | "ghost" | "outline" | "destructive";
     size: "sm" | "md" | "lg";
     disabled: boolean;
@@ -11,7 +17,7 @@ export interface ButtonState {
 /**
  * Input の状態
  */
-export interface InputState {
+export interface InputState extends ComponentState {
     size: "sm" | "md" | "lg";
     disabled: boolean;
     readonly: boolean;
@@ -20,19 +26,19 @@ export interface InputState {
 /**
  * Dialog の状態
  */
-export interface DialogState {
+export interface DialogState extends ComponentState {
     is_open: boolean;
 }
 /**
  * Card の状態
  */
-export interface CardState {
+export interface CardState extends ComponentState {
     padding: "sm" | "md" | "lg" | "none";
 }
 /**
  * Checkbox の状態
  */
-export interface CheckboxState {
+export interface CheckboxState extends ComponentState {
     checked: boolean;
     disabled: boolean;
     indeterminate: boolean;
@@ -40,21 +46,21 @@ export interface CheckboxState {
 /**
  * Radio の状態
  */
-export interface RadioState {
+export interface RadioState extends ComponentState {
     checked: boolean;
     disabled: boolean;
 }
 /**
  * Switch の状態
  */
-export interface SwitchState {
+export interface SwitchState extends ComponentState {
     checked: boolean;
     disabled: boolean;
 }
 /**
  * Textarea の状態
  */
-export interface TextareaState {
+export interface TextareaState extends ComponentState {
     size: "sm" | "md" | "lg";
     disabled: boolean;
     readonly: boolean;
@@ -63,7 +69,7 @@ export interface TextareaState {
 /**
  * Select の状態
  */
-export interface SelectState {
+export interface SelectState extends ComponentState {
     size: "sm" | "md" | "lg";
     disabled: boolean;
     is_open: boolean;
@@ -71,47 +77,41 @@ export interface SelectState {
 /**
  * Toast の状態
  */
-export interface ToastState {
+export interface ToastState extends ComponentState {
     variant: "default" | "success" | "error" | "warning" | "info";
 }
 /**
  * Tooltip の状態
  */
-export interface TooltipState {
+export interface TooltipState extends ComponentState {
     is_open: boolean;
     side: "top" | "right" | "bottom" | "left";
 }
 /**
  * Popover の状態
  */
-export interface PopoverState {
+export interface PopoverState extends ComponentState {
     is_open: boolean;
 }
 /**
  * Dropdown の状態
  */
-export interface DropdownState {
+export interface DropdownState extends ComponentState {
     is_open: boolean;
 }
 /**
  * Sheet の状態
  */
-export interface SheetState {
+export interface SheetState extends ComponentState {
     is_open: boolean;
     side: "top" | "right" | "bottom" | "left";
 }
 /**
  * Alert の状態
  */
-export interface AlertState {
+export interface AlertState extends ComponentState {
     variant: "default" | "info" | "success" | "warning" | "destructive";
 }
-/**
- * 汎用的なコンポーネント状態
- */
-export interface ComponentState {
-    [key: string]: unknown;
-}
 /**
  * Headless Composable の戻り値型
  * ロジック情報のみを返し、スタイル情報は返さない

package/dist/types/config.d.ts

@@ -7,6 +7,7 @@ import type { StyleAdapter } from "../adapters/types";
  * UIコンポーネントのグローバル設定
  */
 export interface UIConfig {
+    [key: string]: unknown;
     button: ButtonConfig;
     input: InputConfig;
     card: CardConfig;

package/dist/types/dialog.d.ts

@@ -1,4 +1,8 @@
-import type { Ref, DeepReadonly } from "vue";
+import type { Ref, DeepReadonly, InjectionKey } from "vue";
+export interface DialogContext {
+    close: () => void;
+}
+export declare const DIALOG_KEY: InjectionKey<DialogContext>;
 export interface DialogProps {
     open?: boolean;
     modal?: boolean;

package/dist/types/dialog.mjs

@@ -0,0 +1 @@
+export const DIALOG_KEY = Symbol("dialog");

package/dist/types/dropdown.d.ts

@@ -1,3 +1,5 @@
+import type { InjectionKey } from "vue";
+import type { UseDropdownReturn } from "../composables/useDropdown";
 export type DropdownSide = "top" | "right" | "bottom" | "left";
 export type DropdownAlign = "start" | "center" | "end";
 export interface DropdownProps {
@@ -33,3 +35,4 @@ export interface DropdownItemContext {
     is_active: boolean;
     is_disabled: boolean;
 }
+export declare const DROPDOWN_CONTEXT_KEY: InjectionKey<UseDropdownReturn>;

package/dist/types/dropdown.mjs

@@ -0,0 +1 @@
+export const DROPDOWN_CONTEXT_KEY = Symbol("dropdown-context");

package/dist/types/form.d.ts

@@ -1,4 +1,4 @@
-import type { ComputedRef, DeepReadonly } from "vue";
+import type { ComputedRef } from "vue";
 export interface FormState<T> {
     values: T;
     errors: Partial<Record<keyof T, string>>;
@@ -37,11 +37,11 @@ export interface FileFieldOptions {
 }
 export interface FormReturn<T> {
     values: T;
-    errors: DeepReadonly<Partial<Record<keyof T, string>>>;
-    touched: DeepReadonly<Partial<Record<keyof T, boolean>>>;
+    errors: Readonly<Partial<Record<keyof T, string>>>;
+    touched: Readonly<Partial<Record<keyof T, boolean>>>;
     is_valid: ComputedRef<boolean>;
-    is_submitting: DeepReadonly<ComputedRef<boolean>>;
-    is_dirty: DeepReadonly<ComputedRef<boolean>>;
+    is_submitting: ComputedRef<boolean>;
+    is_dirty: ComputedRef<boolean>;
     validateField: (field: keyof T) => void;
     validateAll: () => boolean;
     reset: () => void;

package/dist/types/popover.d.ts

@@ -1,3 +1,5 @@
+import type { InjectionKey } from "vue";
+import type { UsePopoverReturn } from "../composables/usePopover";
 export type PopoverSide = "top" | "right" | "bottom" | "left";
 export type PopoverAlign = "start" | "center" | "end";
 export interface PopoverProps {
@@ -19,3 +21,4 @@ export interface PopoverContext {
     close: () => void;
     toggle: () => void;
 }
+export declare const POPOVER_CONTEXT_KEY: InjectionKey<UsePopoverReturn>;

package/dist/types/popover.mjs

@@ -0,0 +1 @@
+export const POPOVER_CONTEXT_KEY = Symbol("popover-context");

package/dist/types/sheet.d.ts

@@ -1,3 +1,4 @@
+import type { InjectionKey } from "vue";
 export type SheetSide = "top" | "right" | "bottom" | "left";
 export interface SheetProps {
     open?: boolean;
@@ -28,3 +29,4 @@ export interface SheetContext {
     open: () => void;
     close: () => void;
 }
+export declare const SHEET_CONTEXT_KEY: InjectionKey<SheetContext>;

package/dist/types/sheet.mjs

@@ -0,0 +1 @@
+export const SHEET_CONTEXT_KEY = Symbol("sheet-context");

package/dist/types/textarea.d.ts

@@ -1,5 +1,7 @@
 import type { ComputedRef, Ref } from "vue";
+export type TextareaSize = "sm" | "md" | "lg";
 export interface TextareaProps {
+    size?: TextareaSize;
     placeholder?: string;
     disabled?: boolean;
     readonly?: boolean;

package/dist/types/toast.d.ts

@@ -15,7 +15,7 @@ export interface ToastAction {
     label: string;
     onClick: () => void;
 }
-export interface Toast extends Required<Pick<ToastProps, "id" | "variant" | "duration" | "dismissible">> {
+export interface ToastItem extends Required<Pick<ToastProps, "id" | "variant" | "duration" | "dismissible">> {
     title?: string;
     description?: string;
     action?: ToastAction;
@@ -27,7 +27,7 @@ export interface ToasterProps {
     gap?: number;
 }
 export interface ToastReturn {
-    toasts: Toast[];
+    toasts: ToastItem[];
     add: (props: ToastProps) => string;
     dismiss: (id: string) => void;
     dismissAll: () => void;

package/dist/types/tooltip.d.ts

@@ -1,3 +1,5 @@
+import type { InjectionKey } from "vue";
+import type { UseTooltipReturn } from "../composables/useTooltip";
 export type TooltipSide = "top" | "right" | "bottom" | "left";
 export type TooltipAlign = "start" | "center" | "end";
 export interface TooltipProps {
@@ -29,3 +31,4 @@ export interface TooltipAriaAttributes {
 export interface TooltipTriggerAriaAttributes {
     "aria-describedby": string;
 }
+export declare const TOOLTIP_CONTEXT_KEY: InjectionKey<UseTooltipReturn>;

package/dist/types/tooltip.mjs

@@ -0,0 +1 @@
+export const TOOLTIP_CONTEXT_KEY = Symbol("tooltip-context");

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@soave/ui",
-    "version": "0.2.0",
+    "version": "0.2.2",
     "description": "soave UI - Composable-First UI Framework for Vue 3 / Nuxt 4",
     "author": "Arata Ouchi (Original SIN Architecture)",
     "license": "MIT",