@meddleware/token-deployer-ui 0.0.1 → 0.0.3

package/src/components/FormSelect.vue

@@ -1,43 +0,0 @@
-<script setup lang="ts">
-defineOptions({ inheritAttrs: false })
-const model = defineModel<string>()
-</script>
-
-<template>
-  <div class="select-wrapper">
-    <select v-bind="$attrs" v-model="model"><slot /></select>
-    <svg
-      class="select-chevron"
-      xmlns="http://www.w3.org/2000/svg"
-      width="12"
-      height="8"
-      viewBox="0 0 12 8"
-      aria-hidden="true"
-    >
-      <path d="M1 1l5 5 5-5" />
-    </svg>
-  </div>
-</template>
-
-<style scoped>
-.select-wrapper {
-  position: relative;
-}
-
-.select-wrapper select {
-  appearance: none;
-  padding-right: 2.5rem;
-  width: 100%;
-}
-
-.select-chevron {
-  position: absolute;
-  right: 0.75rem;
-  top: 50%;
-  transform: translateY(-50%);
-  pointer-events: none;
-  stroke: var(--muted);
-  stroke-width: 1.5;
-  fill: none;
-}
-</style>

package/src/composables/useColorMode.ts

@@ -1,76 +0,0 @@
-import { ref, watch, type Ref } from 'vue'
-
-/**
- * Colour-mode state manager (light | dark | system). Sets `data-theme` on
- * <html>, persists the choice, and follows the OS in `system` mode.
- *
- * Vendored mirror of `@meddleware/ui`'s `useColorMode` for visual/UX parity with
- * the dashboard — this repo is self-contained (no cross-repo links).
- * TODO(unify): consume `@meddleware/ui` once it is published.
- */
-
-export type ColorMode = 'light' | 'dark' | 'system'
-
-const STORAGE_KEY = 'sui-deployer:color-mode'
-
-const mode: Ref<ColorMode> = ref<ColorMode>('system')
-let initialized = false
-
-function systemPrefersDark(): boolean {
-  return (
-    typeof window !== 'undefined' &&
-    typeof window.matchMedia === 'function' &&
-    window.matchMedia('(prefers-color-scheme: dark)').matches
-  )
-}
-
-function resolveDark(m: ColorMode): boolean {
-  return m === 'dark' || (m === 'system' && systemPrefersDark())
-}
-
-function apply(m: ColorMode): void {
-  if (typeof document === 'undefined') return
-  document.documentElement.setAttribute('data-theme', resolveDark(m) ? 'dark' : 'light')
-}
-
-export function useColorMode(defaultMode: ColorMode = 'system') {
-  if (!initialized) {
-    initialized = true
-    let stored: ColorMode | null = null
-    try {
-      stored =
-        typeof localStorage !== 'undefined'
-          ? (localStorage.getItem(STORAGE_KEY) as ColorMode | null)
-          : null
-    } catch {
-      /* no storage — ignore */
-    }
-    mode.value = stored ?? defaultMode
-    apply(mode.value)
-
-    if (typeof window !== 'undefined' && typeof window.matchMedia === 'function') {
-      window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
-        if (mode.value === 'system') apply('system')
-      })
-    }
-
-    watch(mode, (m) => {
-      apply(m)
-      try {
-        if (typeof localStorage !== 'undefined') localStorage.setItem(STORAGE_KEY, m)
-      } catch {
-        /* ignore */
-      }
-    })
-  }
-
-  function set(m: ColorMode): void {
-    mode.value = m
-  }
-
-  function cycle(): void {
-    set(mode.value === 'light' ? 'dark' : mode.value === 'dark' ? 'system' : 'light')
-  }
-
-  return { mode, set, cycle, isDark: () => resolveDark(mode.value) }
-}