@birdycom/omniaui-vue 0.11.0 → 0.11.1

package/src/composables/chartLine.ts

@@ -1,28 +1,28 @@
-// File: packages/vue/src/composables/chartLine.ts
-// Map: number format -> nice axis maximum -> smooth path (same geometry as the chart-line snippet and the React wrapper)
-
-/** Number with at most 2 decimals and no trailing zeros ("75", "37.5", "4.69"). */
-export const n2 = (n: number) => String(parseFloat(n.toFixed(2)))
-
-/** Round axis maximum: step = max / rows rounded up to 1, 1.5, 2, 2.5, 3, 4, 5, 6, 8 or 10 x 10^k. */
-export function niceMax(value: number, rows = 4) {
-  if (value <= 0) return rows
-  const raw = value / rows
-  const pow = 10 ** Math.floor(Math.log10(raw))
-  return ([1, 1.5, 2, 2.5, 3, 4, 5, 6, 8, 10].find((s) => s * pow >= raw) ?? 10) * pow * rows
-}
-
-/** Smooth path through the points (x 0-100, y = 100 - value / max * 100); control points stay between their two ends. */
-export function chartLinePath(values: number[], max: number) {
-  const pts = values.map((v, i) => [values.length > 1 ? (i / (values.length - 1)) * 100 : 50, 100 - (v / max) * 100])
-  if (!pts.length) return ''
-  const clamp = (v: number, a: number, b: number) => Math.min(Math.max(v, Math.min(a, b)), Math.max(a, b))
-  let d = `M${n2(pts[0][0])} ${n2(pts[0][1])}`
-  for (let i = 0; i < pts.length - 1; i++) {
-    const p0 = pts[i - 1] ?? pts[i], p1 = pts[i], p2 = pts[i + 1], p3 = pts[i + 2] ?? p2
-    const c1 = [p1[0] + (p2[0] - p0[0]) / 6, clamp(p1[1] + (p2[1] - p0[1]) / 6, p1[1], p2[1])]
-    const c2 = [p2[0] - (p3[0] - p1[0]) / 6, clamp(p2[1] - (p3[1] - p1[1]) / 6, p1[1], p2[1])]
-    d += ` C${n2(c1[0])} ${n2(c1[1])} ${n2(c2[0])} ${n2(c2[1])} ${n2(p2[0])} ${n2(p2[1])}`
-  }
-  return d
-}
+// File: packages/vue/src/composables/chartLine.ts
+// Map: number format -> nice axis maximum -> smooth path (same geometry as the chart-line snippet and the React wrapper)
+
+/** Number with at most 2 decimals and no trailing zeros ("75", "37.5", "4.69"). */
+export const n2 = (n: number) => String(parseFloat(n.toFixed(2)))
+
+/** Round axis maximum: step = max / rows rounded up to 1, 1.5, 2, 2.5, 3, 4, 5, 6, 8 or 10 x 10^k. */
+export function niceMax(value: number, rows = 4) {
+  if (value <= 0) return rows
+  const raw = value / rows
+  const pow = 10 ** Math.floor(Math.log10(raw))
+  return ([1, 1.5, 2, 2.5, 3, 4, 5, 6, 8, 10].find((s) => s * pow >= raw) ?? 10) * pow * rows
+}
+
+/** Smooth path through the points (x 0-100, y = 100 - value / max * 100); control points stay between their two ends. */
+export function chartLinePath(values: number[], max: number) {
+  const pts = values.map((v, i) => [values.length > 1 ? (i / (values.length - 1)) * 100 : 50, 100 - (v / max) * 100])
+  if (!pts.length) return ''
+  const clamp = (v: number, a: number, b: number) => Math.min(Math.max(v, Math.min(a, b)), Math.max(a, b))
+  let d = `M${n2(pts[0][0])} ${n2(pts[0][1])}`
+  for (let i = 0; i < pts.length - 1; i++) {
+    const p0 = pts[i - 1] ?? pts[i], p1 = pts[i], p2 = pts[i + 1], p3 = pts[i + 2] ?? p2
+    const c1 = [p1[0] + (p2[0] - p0[0]) / 6, clamp(p1[1] + (p2[1] - p0[1]) / 6, p1[1], p2[1])]
+    const c2 = [p2[0] - (p3[0] - p1[0]) / 6, clamp(p2[1] - (p3[1] - p1[1]) / 6, p1[1], p2[1])]
+    d += ` C${n2(c1[0])} ${n2(c1[1])} ${n2(c2[0])} ${n2(c2[1])} ${n2(p2[0])} ${n2(p2[1])}`
+  }
+  return d
+}

package/src/composables/keys.ts

@@ -1,22 +1,22 @@
-import type { InjectionKey, Ref } from 'vue'
-
-/** Provided by OcRadioGroup, injected by OcRadio. */
-export interface RadioGroupContext {
-  model: Ref<string | number | undefined>
-  name: Ref<string>
-  card: Ref<boolean>
-}
-export const radioGroupKey: InjectionKey<RadioGroupContext> = Symbol('oc-radio-group')
-
-/** Provided by OcToggleGroup, injected by OcToggle. */
-export interface ToggleGroupContext {
-  /** Currently pressed values. */
-  values: Ref<string[]>
-  type: Ref<'single' | 'multiple'>
-  name: Ref<string>
-  toggle: (value: string) => void
-}
-export const toggleGroupKey: InjectionKey<ToggleGroupContext> = Symbol('oc-toggle-group')
-
-/** Provided by OcResizable, injected by OcResizablePanel. */
-export const resizableVerticalKey: InjectionKey<Ref<boolean>> = Symbol('oc-resizable-vertical')
+import type { InjectionKey, Ref } from 'vue'
+
+/** Provided by OcRadioGroup, injected by OcRadio. */
+export interface RadioGroupContext {
+  model: Ref<string | number | undefined>
+  name: Ref<string>
+  card: Ref<boolean>
+}
+export const radioGroupKey: InjectionKey<RadioGroupContext> = Symbol('oc-radio-group')
+
+/** Provided by OcToggleGroup, injected by OcToggle. */
+export interface ToggleGroupContext {
+  /** Currently pressed values. */
+  values: Ref<string[]>
+  type: Ref<'single' | 'multiple'>
+  name: Ref<string>
+  toggle: (value: string) => void
+}
+export const toggleGroupKey: InjectionKey<ToggleGroupContext> = Symbol('oc-toggle-group')
+
+/** Provided by OcResizable, injected by OcResizablePanel. */
+export const resizableVerticalKey: InjectionKey<Ref<boolean>> = Symbol('oc-resizable-vertical')

package/src/composables/useAttrsSplit.ts

@@ -1,16 +1,16 @@
-import { computed, useAttrs } from 'vue'
-
-/**
- * For components whose root is a wrapper (label, div) around the real form control:
- * `class` and `style` stay on the wrapper, every other attribute (id, name, disabled,
- * autocomplete, aria-*, listeners) goes to the control. Use with defineOptions({ inheritAttrs: false }).
- */
-export function useAttrsSplit() {
-  const attrs = useAttrs()
-  const root = computed(() => ({ class: attrs.class, style: attrs.style }))
-  const control = computed(() => {
-    const { class: _c, style: _s, ...rest } = attrs
-    return rest
-  })
-  return { root, control }
-}
+import { computed, useAttrs } from 'vue'
+
+/**
+ * For components whose root is a wrapper (label, div) around the real form control:
+ * `class` and `style` stay on the wrapper, every other attribute (id, name, disabled,
+ * autocomplete, aria-*, listeners) goes to the control. Use with defineOptions({ inheritAttrs: false }).
+ */
+export function useAttrsSplit() {
+  const attrs = useAttrs()
+  const root = computed(() => ({ class: attrs.class, style: attrs.style }))
+  const control = computed(() => {
+    const { class: _c, style: _s, ...rest } = attrs
+    return rest
+  })
+  return { root, control }
+}

package/src/composables/useDialog.ts

@@ -1,21 +1,21 @@
-import { onMounted, watch, type Ref } from 'vue'
-
-/**
- * Keeps a native <dialog> in sync with a boolean `open` model:
- * open -> showModal(), closed -> close(). Native close (Esc, backdrop, form method=dialog)
- * is reported through `onClose` so v-model:open stays correct.
- */
-export function useDialog(open: Ref<boolean | undefined>, el: Ref<HTMLDialogElement | null>) {
-  function sync() {
-    const dialog = el.value
-    if (!dialog) return
-    if (open.value && !dialog.open) dialog.showModal()
-    else if (!open.value && dialog.open) dialog.close()
-  }
-  watch(open, sync, { flush: 'post' })
-  onMounted(sync)
-  function onClose() {
-    if (open.value) open.value = false
-  }
-  return { onClose }
-}
+import { onMounted, watch, type Ref } from 'vue'
+
+/**
+ * Keeps a native <dialog> in sync with a boolean `open` model:
+ * open -> showModal(), closed -> close(). Native close (Esc, backdrop, form method=dialog)
+ * is reported through `onClose` so v-model:open stays correct.
+ */
+export function useDialog(open: Ref<boolean | undefined>, el: Ref<HTMLDialogElement | null>) {
+  function sync() {
+    const dialog = el.value
+    if (!dialog) return
+    if (open.value && !dialog.open) dialog.showModal()
+    else if (!open.value && dialog.open) dialog.close()
+  }
+  watch(open, sync, { flush: 'post' })
+  onMounted(sync)
+  function onClose() {
+    if (open.value) open.value = false
+  }
+  return { onClose }
+}

package/src/composables/useToast.ts

@@ -1,66 +1,66 @@
-import { reactive, readonly } from 'vue'
-
-export type ToastVariant = 'success' | 'error' | 'warning' | 'info'
-
-export interface ToastOptions {
-  title: string
-  description?: string
-  variant?: ToastVariant
-  /** Milliseconds before auto-dismiss. 0 keeps the toast until dismissed. Default 5000. */
-  duration?: number
-}
-
-export interface ToastItem extends Required<Pick<ToastOptions, 'title' | 'variant'>> {
-  id: number
-  description?: string
-  duration: number
-}
-
-const state = reactive<{ toasts: ToastItem[] }>({ toasts: [] })
-const timers = new Map<number, ReturnType<typeof setTimeout>>()
-let nextId = 1
-
-function dismiss(id: number) {
-  const timer = timers.get(id)
-  if (timer) clearTimeout(timer)
-  timers.delete(id)
-  const i = state.toasts.findIndex((t) => t.id === id)
-  if (i !== -1) state.toasts.splice(i, 1)
-}
-
-function push(options: ToastOptions): number {
-  const id = nextId++
-  const item: ToastItem = {
-    id,
-    title: options.title,
-    description: options.description,
-    variant: options.variant ?? 'info',
-    duration: options.duration ?? 5000,
-  }
-  state.toasts.push(item)
-  if (item.duration > 0) timers.set(id, setTimeout(() => dismiss(id), item.duration))
-  return id
-}
-
-function clear() {
-  for (const t of [...state.toasts]) dismiss(t.id)
-}
-
-const shortcut =
-  (variant: ToastVariant) =>
-  (title: string, description?: string, options: Omit<ToastOptions, 'title' | 'description' | 'variant'> = {}) =>
-    push({ ...options, title, description, variant })
-
-/** Shared toast queue. Render it once with <OcToastContainer />. */
-export function useToast() {
-  return {
-    toasts: readonly(state).toasts,
-    push,
-    dismiss,
-    clear,
-    success: shortcut('success'),
-    error: shortcut('error'),
-    warning: shortcut('warning'),
-    info: shortcut('info'),
-  }
-}
+import { reactive, readonly } from 'vue'
+
+export type ToastVariant = 'success' | 'error' | 'warning' | 'info'
+
+export interface ToastOptions {
+  title: string
+  description?: string
+  variant?: ToastVariant
+  /** Milliseconds before auto-dismiss. 0 keeps the toast until dismissed. Default 5000. */
+  duration?: number
+}
+
+export interface ToastItem extends Required<Pick<ToastOptions, 'title' | 'variant'>> {
+  id: number
+  description?: string
+  duration: number
+}
+
+const state = reactive<{ toasts: ToastItem[] }>({ toasts: [] })
+const timers = new Map<number, ReturnType<typeof setTimeout>>()
+let nextId = 1
+
+function dismiss(id: number) {
+  const timer = timers.get(id)
+  if (timer) clearTimeout(timer)
+  timers.delete(id)
+  const i = state.toasts.findIndex((t) => t.id === id)
+  if (i !== -1) state.toasts.splice(i, 1)
+}
+
+function push(options: ToastOptions): number {
+  const id = nextId++
+  const item: ToastItem = {
+    id,
+    title: options.title,
+    description: options.description,
+    variant: options.variant ?? 'info',
+    duration: options.duration ?? 5000,
+  }
+  state.toasts.push(item)
+  if (item.duration > 0) timers.set(id, setTimeout(() => dismiss(id), item.duration))
+  return id
+}
+
+function clear() {
+  for (const t of [...state.toasts]) dismiss(t.id)
+}
+
+const shortcut =
+  (variant: ToastVariant) =>
+  (title: string, description?: string, options: Omit<ToastOptions, 'title' | 'description' | 'variant'> = {}) =>
+    push({ ...options, title, description, variant })
+
+/** Shared toast queue. Render it once with <OcToastContainer />. */
+export function useToast() {
+  return {
+    toasts: readonly(state).toasts,
+    push,
+    dismiss,
+    clear,
+    success: shortcut('success'),
+    error: shortcut('error'),
+    warning: shortcut('warning'),
+    info: shortcut('info'),
+  }
+}

package/src/composables/useUid.ts

@@ -1,12 +1,12 @@
-import * as Vue from 'vue'
-
-let counter = 0
-
-/**
- * Stable unique id for aria-labelledby / popovertarget / label-for wiring.
- * Uses Vue's built-in useId() when available (Vue >= 3.5, SSR safe), otherwise a counter.
- */
-export function useUid(prefix = 'oc'): string {
-  const useId = (Vue as Record<string, unknown>)['useId'] as (() => string) | undefined
-  return `${prefix}-${useId ? useId() : ++counter}`
-}
+import * as Vue from 'vue'
+
+let counter = 0
+
+/**
+ * Stable unique id for aria-labelledby / popovertarget / label-for wiring.
+ * Uses Vue's built-in useId() when available (Vue >= 3.5, SSR safe), otherwise a counter.
+ */
+export function useUid(prefix = 'oc'): string {
+  const useId = (Vue as Record<string, unknown>)['useId'] as (() => string) | undefined
+  return `${prefix}-${useId ? useId() : ++counter}`
+}