@nuxt/devtools-ui-kit 3.4.1 → 3.4.2

package/dist/components/NNotification.vue

@@ -0,0 +1,44 @@
+<script setup>
+import { ref } from "vue";
+import { devtoolsUiProvideNotificationFn } from "../composables/notification";
+const show = ref(false);
+const icon = ref();
+const text = ref();
+const classes = ref();
+const position = ref("top-center");
+devtoolsUiProvideNotificationFn((data) => {
+  text.value = data.message;
+  icon.value = data.icon;
+  classes.value = data.classes ?? "text-primary border-primary";
+  icon.value = data.icon;
+  show.value = true;
+  position.value = data.position ?? "top-center";
+  setTimeout(() => {
+    show.value = false;
+  }, data.duration ?? 1500);
+});
+</script>
+
+<template>
+  <div
+    fixed left-0 right-0 z-999 text-center
+    :class="[
+  { 'pointer-events-none overflow-hidden': !show },
+  { 'top-0': position.startsWith('top') },
+  { 'bottom-0': position.startsWith('bottom') }
+]"
+  >
+    <div flex :style="{ justifyContent: position.includes('right') ? 'right' : position.includes('left') ? 'left' : 'center' }">
+      <div
+        border="~ base"
+        flex="~ inline gap2"
+        m-3 inline-block items-center rounded bg-base px-4 py-1 transition-all duration-300
+        :style="show ? {} : { transform: `translateY(${position.startsWith('top') ? '-' : ''}300%)` }"
+        :class="[show ? 'shadow' : 'shadow-none', classes]"
+      >
+        <div v-if="icon" :class="icon" />
+        <div>{{ text }}</div>
+      </div>
+    </div>
+  </div>
+</template>

package/dist/components/NPanelGrids.d.vue.ts

@@ -1,5 +1,13 @@
-<template>
-  <div class="n-panel-grids-center">
-    <slot />
-  </div>
-</template>
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/NPanelGrids.vue

@@ -0,0 +1,5 @@
+<template>
+  <div class="n-panel-grids-center">
+    <slot />
+  </div>
+</template>

package/dist/components/NRadio.d.vue.ts

@@ -1,40 +1,26 @@
-<script setup lang="ts">
-import { useVModel } from '@vueuse/core'
-
-const props = withDefaults(
-  defineProps<{
-    modelValue?: string
-    disabled?: boolean
-    name?: string
-    value?: string
-  }>(),
-  {
-    modelValue: '',
-    disabled: false,
-  },
-)
-const emit = defineEmits<{ (...args: any): void }>()
-const model = useVModel(props, 'modelValue', emit, { passive: true })
-</script>
-
-<template>
-  <label
-    class="n-radio inline-flex select-none items-center hover:n-radio-hover n-disabled:n-disabled"
-    :checked="model === value || null"
-    :disabled="disabled || null"
-  >
-    <input
-      v-model="model"
-      type="radio"
-      class="peer absolute op0"
-      :disabled="disabled"
-      :name="name"
-      :value="value"
-      @keypress.enter="model = value!"
-    >
-    <span class="n-radio-box n-transition n-checked:n-radio-box-checked peer-active:n-active-base peer-focus-visible:n-focus-base">
-      <div class="n-radio-inner n-transition n-checked:n-radio-inner-checked" />
-    </span>
-    <span><slot /></span>
-  </label>
-</template>
+type __VLS_Props = {
+    modelValue?: string;
+    disabled?: boolean;
+    name?: string;
+    value?: string;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    [x: string]: never;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    [x: `on${Capitalize<any>}`]: ((...args: unknown[]) => any) | undefined;
+}>, {
+    modelValue: string;
+    disabled: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/NRadio.vue

@@ -0,0 +1,33 @@
+<script setup>
+import { useVModel } from "@vueuse/core";
+const props = defineProps({
+  modelValue: { type: String, required: false, default: "" },
+  disabled: { type: Boolean, required: false, default: false },
+  name: { type: String, required: false },
+  value: { type: String, required: false }
+});
+const emit = defineEmits([]);
+const model = useVModel(props, "modelValue", emit, { passive: true });
+</script>
+
+<template>
+  <label
+    class="n-radio inline-flex select-none items-center hover:n-radio-hover n-disabled:n-disabled"
+    :checked="model === value || null"
+    :disabled="disabled || null"
+  >
+    <input
+      v-model="model"
+      type="radio"
+      class="peer absolute op0"
+      :disabled="disabled"
+      :name="name"
+      :value="value"
+      @keypress.enter="model = value"
+    >
+    <span class="n-radio-box n-transition n-checked:n-radio-box-checked peer-active:n-active-base peer-focus-visible:n-focus-base">
+      <div class="n-radio-inner n-transition n-checked:n-radio-inner-checked" />
+    </span>
+    <span><slot /></span>
+  </label>
+</template>

package/dist/components/NSectionBlock.d.vue.ts

@@ -1,97 +1,38 @@
-<script setup lang="ts">
-import { useVModel } from '@vueuse/core'
-
-const props = withDefaults(
-  defineProps<{
-    icon?: string
-    text?: string
-    description?: string
-    containerClass?: string
-    headerClass?: string
-    collapse?: boolean
-    open?: boolean
-    padding?: boolean | string
-  }>(),
-  {
-    containerClass: '',
-    open: true,
-    padding: true,
-    collapse: true,
-  },
-)
-
-const open = useVModel(props, 'open', undefined, { passive: true })
-function onToggle(e: any) {
-  open.value = e.target.open
-}
-</script>
-
-<template>
-  <!-- TODO: Seems something wrong with the DOM type -->
-  <!-- @vue-ignore -->
-  <details :open="open" @toggle="(onToggle as any)">
-    <summary
-      class="cursor-pointer select-none p4 hover:bg-active"
-      :class="collapse ? '' : 'pointer-events-none'"
-    >
-      <NIconTitle :icon="icon" :text="text" text-xl transition :class="[open ? 'op100' : 'op60', headerClass]">
-        <div>
-          <div text-base>
-            <slot name="text">
-              {{ text }}
-            </slot>
-          </div>
-          <div v-if="description || $slots.description" text-sm op50>
-            <slot name="description">
-              {{ description }}
-            </slot>
-          </div>
-        </div>
-        <div class="flex-auto" />
-        <slot name="actions" />
-        <NIcon
-          v-if="collapse"
-          icon="carbon-chevron-down"
-          class="chevron"
-          cursor-pointer place-self-start text-base op75 transition duration-500
-        />
-      </NIconTitle>
-    </summary>
-    <div
-      v-lazy-show="open"
-      class="flex flex-col flex-gap2 pb6 pt2"
-      :class="typeof padding === 'string' ? padding : padding ? 'px4' : ''"
-    >
-      <slot name="details" />
-      <div :class="containerClass" class="mt1">
-        <slot />
-      </div>
-      <slot name="footer" />
-    </div>
-  </details>
-  <div class="x-divider" />
-</template>
-
-<style scoped>
-details {
-  --at-apply: border-none;
-}
-
-summary {
-  --at-apply: border-none;
-  list-style: none;
-}
-
-details[open] summary {
-  --at-apply: border-none;
-}
-
-details summary::-webkit-details-marker {
-  display: none;
-}
-
-details[open] .chevron {
-  transform: rotate(180deg);
-  opacity: 0.75;
-}
-</style>
+type __VLS_Props = {
+    icon?: string;
+    text?: string;
+    description?: string;
+    containerClass?: string;
+    headerClass?: string;
+    collapse?: boolean;
+    open?: boolean;
+    padding?: boolean | string;
+};
+declare var __VLS_7: {}, __VLS_9: {}, __VLS_11: {}, __VLS_18: {}, __VLS_20: {}, __VLS_22: {};
+type __VLS_Slots = {} & {
+    text?: (props: typeof __VLS_7) => any;
+} & {
+    description?: (props: typeof __VLS_9) => any;
+} & {
+    actions?: (props: typeof __VLS_11) => any;
+} & {
+    details?: (props: typeof __VLS_18) => any;
+} & {
+    default?: (props: typeof __VLS_20) => any;
+} & {
+    footer?: (props: typeof __VLS_22) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    containerClass: string;
+    collapse: boolean;
+    open: boolean;
+    padding: boolean | string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/NSectionBlock.vue

@@ -0,0 +1,67 @@
+<script setup>
+import { useVModel } from "@vueuse/core";
+const props = defineProps({
+  icon: { type: String, required: false },
+  text: { type: String, required: false },
+  description: { type: String, required: false },
+  containerClass: { type: String, required: false, default: "" },
+  headerClass: { type: String, required: false },
+  collapse: { type: Boolean, required: false, default: true },
+  open: { type: Boolean, required: false, default: true },
+  padding: { type: [Boolean, String], required: false, default: true }
+});
+const open = useVModel(props, "open", void 0, { passive: true });
+function onToggle(e) {
+  open.value = e.target.open;
+}
+</script>
+
+<template>
+  <!-- TODO: Seems something wrong with the DOM type -->
+  <!-- @vue-ignore -->
+  <details :open="open" @toggle="onToggle">
+    <summary
+      class="cursor-pointer select-none p4 hover:bg-active"
+      :class="collapse ? '' : 'pointer-events-none'"
+    >
+      <NIconTitle :icon="icon" :text="text" text-xl transition :class="[open ? 'op100' : 'op60', headerClass]">
+        <div>
+          <div text-base>
+            <slot name="text">
+              {{ text }}
+            </slot>
+          </div>
+          <div v-if="description || $slots.description" text-sm op50>
+            <slot name="description">
+              {{ description }}
+            </slot>
+          </div>
+        </div>
+        <div class="flex-auto" />
+        <slot name="actions" />
+        <NIcon
+          v-if="collapse"
+          icon="carbon-chevron-down"
+          class="chevron"
+          cursor-pointer place-self-start text-base op75 transition duration-500
+        />
+      </NIconTitle>
+    </summary>
+    <div
+      v-lazy-show="open"
+      class="flex flex-col flex-gap2 pb6 pt2"
+      :class="typeof padding === 'string' ? padding : padding ? 'px4' : ''"
+    >
+      <slot name="details" />
+      <div :class="containerClass" class="mt1">
+        <slot />
+      </div>
+      <slot name="footer" />
+    </div>
+  </details>
+  <div class="x-divider" />
+</template>
+
+<style scoped>
+details,summary{--at-apply:border-none}summary{list-style:none}details[open] summary{--at-apply:border-none}details summary::-webkit-details-marker{display:none}details[open] .chevron{opacity:.75;transform:rotate(180deg)}
+</style>

package/dist/components/NSelect.d.vue.ts

@@ -1,37 +1,30 @@
-<script setup lang="ts">
-import { useVModel } from '@vueuse/core'
-
-const props = withDefaults(
-  defineProps<{
-    modelValue?: any
-    placeholder?: string
-    icon?: string
-    disabled?: boolean
-  }>(),
-  {
-    modelValue: undefined,
-    placeholder: '',
-    disabled: false,
-    icon: '',
-  },
-)
-const emit = defineEmits<{ (...args: any): void }>()
-const input = useVModel(props, 'modelValue', emit, { passive: true })
-</script>
-
-<template>
-  <div
-    class="n-select flex flex items-center border rounded n-bg-base px-2 py-1 focus-within:border-context focus-within:n-focus-base"
-    :class="disabled ? 'border-gray:10' : 'n-border-base'"
-  >
-    <slot name="icon">
-      <NIcon v-if="icon" :icon="icon" class="mr-0.4em text-1.1em op50" />
-    </slot>
-    <select v-model="input" :disabled="disabled" class="w-full flex-auto n-bg-base !outline-none" :class="disabled ? 'appearance-none' : ''">
-      <option v-if="placeholder" value="" disabled hidden>
-        {{ placeholder }}
-      </option>
-      <slot />
-    </select>
-  </div>
-</template>
+type __VLS_Props = {
+    modelValue?: any;
+    placeholder?: string;
+    icon?: string;
+    disabled?: boolean;
+};
+declare var __VLS_1: {}, __VLS_8: {};
+type __VLS_Slots = {} & {
+    icon?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    [x: string]: never;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    [x: `on${Capitalize<any>}`]: ((...args: unknown[]) => any) | undefined;
+}>, {
+    modelValue: any;
+    disabled: boolean;
+    icon: string;
+    placeholder: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/NSelect.vue

@@ -0,0 +1,28 @@
+<script setup>
+import { useVModel } from "@vueuse/core";
+const props = defineProps({
+  modelValue: { type: null, required: false, default: void 0 },
+  placeholder: { type: String, required: false, default: "" },
+  icon: { type: String, required: false, default: "" },
+  disabled: { type: Boolean, required: false, default: false }
+});
+const emit = defineEmits([]);
+const input = useVModel(props, "modelValue", emit, { passive: true });
+</script>
+
+<template>
+  <div
+    class="n-select flex flex items-center border rounded n-bg-base px-2 py-1 focus-within:border-context focus-within:n-focus-base"
+    :class="disabled ? 'border-gray:10' : 'n-border-base'"
+  >
+    <slot name="icon">
+      <NIcon v-if="icon" :icon="icon" class="mr-0.4em text-1.1em op50" />
+    </slot>
+    <select v-model="input" :disabled="disabled" class="w-full flex-auto n-bg-base !outline-none" :class="disabled ? 'appearance-none' : ''">
+      <option v-if="placeholder" value="" disabled hidden>
+        {{ placeholder }}
+      </option>
+      <slot />
+    </select>
+  </div>
+</template>

package/dist/components/NSelectTabs.d.vue.ts

@@ -1,49 +1,18 @@
-<script setup lang="ts">
-import { useVModel } from '@vueuse/core'
-
-const props = withDefaults(
-  defineProps<{
-    modelValue?: any
-    disabled?: boolean
-    options: { value: any, label: string }[]
-  }>(),
-  {
-    modelValue: undefined,
-    disabled: false,
-  },
-)
-const emit = defineEmits<{ (...args: any): void }>()
-const input = useVModel(props, 'modelValue', emit, { passive: true })
-</script>
-
-<template>
-  <fieldset
-    class="n-select-tabs flex flex-inline flex-wrap items-center border n-border-base rounded n-bg-base"
-  >
-    <label
-      v-for="i, idx of options"
-      :key="i.label"
-      :disabled="disabled"
-      class="relative n-border-base px-0.5em py-0.1em hover:n-bg-active"
-      :class="[
-        idx ? 'border-l n-border-base ml--1px' : '',
-        i.value === input ? 'n-bg-active' : '',
-      ]"
-      :title="i.label"
-    >
-      <div
-        :class="[
-          i.value === input ? '' : 'op35',
-        ]"
-      >{{ i.label }}</div>
-      <input
-        v-model="input"
-        type="radio"
-        :disabled="disabled"
-        :value="i.value"
-        :title="i.label"
-        class="absolute inset-0 op-0.1"
-      >
-    </label>
-  </fieldset>
-</template>
+type __VLS_Props = {
+    modelValue?: any;
+    disabled?: boolean;
+    options: {
+        value: any;
+        label: string;
+    }[];
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    [x: string]: never;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    [x: `on${Capitalize<any>}`]: ((...args: unknown[]) => any) | undefined;
+}>, {
+    modelValue: any;
+    disabled: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/NSelectTabs.vue

@@ -0,0 +1,42 @@
+<script setup>
+import { useVModel } from "@vueuse/core";
+const props = defineProps({
+  modelValue: { type: null, required: false, default: void 0 },
+  disabled: { type: Boolean, required: false, default: false },
+  options: { type: Array, required: true }
+});
+const emit = defineEmits([]);
+const input = useVModel(props, "modelValue", emit, { passive: true });
+</script>
+
+<template>
+  <fieldset
+    class="n-select-tabs flex flex-inline flex-wrap items-center border n-border-base rounded n-bg-base"
+  >
+    <label
+      v-for="i, idx of options"
+      :key="i.label"
+      :disabled="disabled"
+      class="relative n-border-base px-0.5em py-0.1em hover:n-bg-active"
+      :class="[
+  idx ? 'border-l n-border-base ml--1px' : '',
+  i.value === input ? 'n-bg-active' : ''
+]"
+      :title="i.label"
+    >
+      <div
+        :class="[
+  i.value === input ? '' : 'op35'
+]"
+      >{{ i.label }}</div>
+      <input
+        v-model="input"
+        type="radio"
+        :disabled="disabled"
+        :value="i.value"
+        :title="i.label"
+        class="absolute inset-0 op-0.1"
+      >
+    </label>
+  </fieldset>
+</template>