@finema/core 1.3.3 → 1.3.5

package/dist/runtime/components/Slideover/index.vue

@@ -1,109 +1,109 @@
-<template>
-  <USlideover
-    v-bind="attrs"
-    :model-value="modelValue"
-    :prevent-close="preventClose"
-    :overlay="overlay"
-    :transition="transition"
-    :side="side"
-    :initial-focus="emptyFocusRef"
-    :ui="ui"
-    @update:model-value="$emit('update:modelValue', $event)"
-  >
-    <div v-if="!isHideCloseBtn && preventClose" class="absolute right-0 m-4">
-      <Icon
-        v-if="!isHideCloseBtn"
-        name="i-heroicons-x-mark"
-        class="h-6 w-6 cursor-pointer"
-        @click="close"
-      />
-    </div>
-
-    <div :class="['overflow-y-auto', ui.bodyWrapper]">
-      <slot />
-    </div>
-  </USlideover>
-
-  <div ref="emptyFocusRef" />
-</template>
-
-<script lang="ts" setup>
-import { ref, type PropType, toRef, defineShortcuts, watch } from '#imports'
-import type { Strategy } from '#core/types/utils'
-import { useUI } from '#ui/composables/useUI'
-import { slideover } from '#core/ui.config'
-import { useUiConfig } from '#core/composables/useConfig'
-
-const config = useUiConfig<typeof slideover>(slideover, 'slideover')
-
-const props = defineProps({
-  modelValue: {
-    type: Boolean as PropType<boolean>,
-    default: false,
-  },
-  side: {
-    type: String as PropType<'left' | 'right'>,
-    default: 'right',
-    validator: (value: string) => ['left', 'right'].includes(value),
-  },
-  overlay: {
-    type: Boolean,
-    default: true,
-  },
-  preventClose: {
-    type: Boolean,
-    default: false,
-  },
-  isHideCloseBtn: {
-    type: Boolean,
-    default: false,
-  },
-  transition: {
-    type: Boolean,
-    default: true,
-  },
-  size: {
-    type: String as PropType<keyof typeof slideover.size>,
-    default: () => slideover.default.size,
-  },
-  class: {
-    type: [String, Array, Object] as PropType<any>,
-    default: undefined,
-  },
-  ui: {
-    type: Object as PropType<Partial<typeof config & { strategy?: Strategy }>>,
-    default: undefined,
-  },
-})
-
-const emits = defineEmits(['update:modelValue'])
-
-const emptyFocusRef = ref<HTMLElement | null>(null)
-
-defineShortcuts({
-  escape: {
-    usingInput: true,
-    handler: () => {
-      if (props.preventClose) return
-      emits('update:modelValue', false)
-    },
-  },
-})
-
-const close = () => {
-  emits('update:modelValue', false)
-}
-
-const { ui, attrs } = useUI('slideover', toRef(props, 'ui'), config, toRef(props, 'class'))
-
-watch(
-  () => props.modelValue,
-  () => {
-    if (props.modelValue) {
-      const size = config.size[props.size]
-
-      ui.value.width = size
-    }
-  }
-)
-</script>
+<template>
+  <USlideover
+    v-bind="attrs"
+    :model-value="modelValue"
+    :prevent-close="preventClose"
+    :overlay="overlay"
+    :transition="transition"
+    :side="side"
+    :initial-focus="emptyFocusRef"
+    :ui="ui"
+    @update:model-value="$emit('update:modelValue', $event)"
+  >
+    <div v-if="!isHideCloseBtn && preventClose" class="absolute right-0 m-4">
+      <Icon
+        v-if="!isHideCloseBtn"
+        name="i-heroicons-x-mark"
+        class="h-6 w-6 cursor-pointer"
+        @click="close"
+      />
+    </div>
+
+    <div :class="['overflow-y-auto', ui.bodyWrapper]">
+      <slot />
+    </div>
+  </USlideover>
+
+  <div ref="emptyFocusRef" />
+</template>
+
+<script lang="ts" setup>
+import { ref, type PropType, toRef, defineShortcuts, watch } from '#imports'
+import type { Strategy } from '#core/types/utils'
+import { useUI } from '#ui/composables/useUI'
+import { slideover } from '#core/ui.config'
+import { useUiConfig } from '#core/composables/useConfig'
+
+const config = useUiConfig<typeof slideover>(slideover, 'slideover')
+
+const props = defineProps({
+  modelValue: {
+    type: Boolean as PropType<boolean>,
+    default: false,
+  },
+  side: {
+    type: String as PropType<'left' | 'right'>,
+    default: 'right',
+    validator: (value: string) => ['left', 'right'].includes(value),
+  },
+  overlay: {
+    type: Boolean,
+    default: true,
+  },
+  preventClose: {
+    type: Boolean,
+    default: false,
+  },
+  isHideCloseBtn: {
+    type: Boolean,
+    default: false,
+  },
+  transition: {
+    type: Boolean,
+    default: true,
+  },
+  size: {
+    type: String as PropType<keyof typeof slideover.size>,
+    default: () => slideover.default.size,
+  },
+  class: {
+    type: [String, Array, Object] as PropType<any>,
+    default: undefined,
+  },
+  ui: {
+    type: Object as PropType<Partial<typeof config & { strategy?: Strategy }>>,
+    default: undefined,
+  },
+})
+
+const emits = defineEmits(['update:modelValue'])
+
+const emptyFocusRef = ref<HTMLElement | null>(null)
+
+defineShortcuts({
+  escape: {
+    usingInput: true,
+    handler: () => {
+      if (props.preventClose) return
+      emits('update:modelValue', false)
+    },
+  },
+})
+
+const close = () => {
+  emits('update:modelValue', false)
+}
+
+const { ui, attrs } = useUI('slideover', toRef(props, 'ui'), config, toRef(props, 'class'))
+
+watch(
+  () => props.modelValue,
+  () => {
+    if (props.modelValue) {
+      const size = config.size[props.size]
+
+      ui.value.width = size
+    }
+  }
+)
+</script>

package/dist/runtime/components/Table/index.vue

@@ -1,84 +1,84 @@
-<template>
-  <div>
-    <div
-      v-if="!options.isHideToolbar"
-      class="flex border-b border-gray-200 px-3 py-3.5 dark:border-gray-700"
-    >
-      <UInput v-model="q" placeholder="Search..." />
-    </div>
-    <UTable
-      :loading="options.status.isLoading"
-      :columns="options.columns"
-      :rows="options.rawData"
-      v-bind="$attrs"
-    >
-      <template #empty-state>
-        <div class="flex flex-col items-center justify-center gap-3 py-6">
-          <span class="text-sm italic">No one here!</span>
-        </div>
-      </template>
-      <template
-        v-for="column in options.columns"
-        #[`${column.key}-data`]="{ row }"
-        :key="column.key"
-      >
-        <ColumnNumber
-          v-if="column.type === COLUMN_TYPES.NUMBER"
-          :value="row[column.key]"
-          :column="column"
-          :row="row"
-        />
-        <ColumnImage
-          v-if="column.type === COLUMN_TYPES.IMAGE"
-          :value="row[column.key]"
-          :column="column"
-          :row="row"
-        />
-        <template v-else>
-          <span :title="row[column.key]">{{ row[column.key] ?? '-' }}</span>
-        </template>
-      </template>
-      <template v-for="(_, slot) of $slots" #[slot]="scope">
-        <slot :name="slot" v-bind="scope" />
-      </template>
-    </UTable>
-    <div class="mt-4 flex justify-end">
-      <UPagination
-        v-model="page"
-        :page-count="options.pageOptions.totalPage"
-        :total="options.pageOptions.totalCount"
-      />
-    </div>
-  </div>
-</template>
-<script lang="ts" setup>
-import { type PropType } from 'vue'
-import { COLUMN_TYPES, type ITableOptions } from '#core/components/Table/types'
-import { _debounce, ref, watch } from '#imports'
-import ColumnNumber from '#core/components/Table/ColumnNumber.vue'
-import ColumnImage from '#core/components/Table/ColumnImage.vue'
-
-const emits = defineEmits<{
-  (event: 'pageChange', page: number): void
-  (event: 'search', q: string): void
-}>()
-
-const props = defineProps({
-  options: { type: Object as PropType<ITableOptions>, required: true },
-})
-
-const q = ref(props.options?.pageOptions.search ?? '')
-
-const page = ref(props.options?.pageOptions.currentPage)
-
-watch(
-  q,
-  _debounce((value) => {
-    emits('search', value)
-  }, 500)
-)
-
-watch(page, () => {
-  emits('pageChange', page.value)
-})
-</script>
+<template>
+  <div>
+    <div
+      v-if="!options.isHideToolbar"
+      class="flex border-b border-gray-200 px-3 py-3.5 dark:border-gray-700"
+    >
+      <UInput v-model="q" placeholder="Search..." />
+    </div>
+    <UTable
+      :loading="options.status.isLoading"
+      :columns="options.columns"
+      :rows="options.rawData"
+      v-bind="$attrs"
+    >
+      <template #empty-state>
+        <div class="flex flex-col items-center justify-center gap-3 py-6">
+          <span class="text-sm italic">No one here!</span>
+        </div>
+      </template>
+      <template
+        v-for="column in options.columns"
+        #[`${column.key}-data`]="{ row }"
+        :key="column.key"
+      >
+        <ColumnNumber
+          v-if="column.type === COLUMN_TYPES.NUMBER"
+          :value="row[column.key]"
+          :column="column"
+          :row="row"
+        />
+        <ColumnImage
+          v-if="column.type === COLUMN_TYPES.IMAGE"
+          :value="row[column.key]"
+          :column="column"
+          :row="row"
+        />
+        <template v-else>
+          <span :title="row[column.key]">{{ row[column.key] ?? '-' }}</span>
+        </template>
+      </template>
+      <template v-for="(_, slot) of $slots" #[slot]="scope">
+        <slot :name="slot" v-bind="scope" />
+      </template>
+    </UTable>
+    <div class="mt-4 flex justify-end">
+      <UPagination
+        v-model="page"
+        :page-count="options.pageOptions.totalPage"
+        :total="options.pageOptions.totalCount"
+      />
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+import { type PropType } from 'vue'
+import { COLUMN_TYPES, type ITableOptions } from '#core/components/Table/types'
+import { _debounce, ref, watch } from '#imports'
+import ColumnNumber from '#core/components/Table/ColumnNumber.vue'
+import ColumnImage from '#core/components/Table/ColumnImage.vue'
+
+const emits = defineEmits<{
+  (event: 'pageChange', page: number): void
+  (event: 'search', q: string): void
+}>()
+
+const props = defineProps({
+  options: { type: Object as PropType<ITableOptions>, required: true },
+})
+
+const q = ref(props.options?.pageOptions.search ?? '')
+
+const page = ref(props.options?.pageOptions.currentPage)
+
+watch(
+  q,
+  _debounce((value) => {
+    emits('search', value)
+  }, 500)
+)
+
+watch(page, () => {
+  emits('pageChange', page.value)
+})
+</script>

package/dist/runtime/types/config.d.ts

@@ -1 +1 @@
-export type UIComponentList = 'modal' | 'slideover';
+export type UIComponentList = 'modal' | 'slideover' | 'dropdown';

package/dist/runtime/ui.css

@@ -1,14 +1,14 @@
-:root {
-  --color-primary-50: 248 248 255;
-  --color-primary-100: 232 239 253;
-  --color-primary-200: 190 227 248;
-  --color-primary-300: 144 205 244;
-  --color-primary-400: 99 179 237;
-  --color-primary-500: 54 117 251;
-  --color-primary-600: 0 104 254;
-  --color-primary-700: 43 108 176;
-  --color-primary-800: 44 82 130;
-  --color-primary-900: 32 36 62;
-  --color-primary-950: 32 36 62;
-  --color-primary-DEFAULT: 54 117 251;
-}
+:root {
+  --color-primary-50: 248 248 255;
+  --color-primary-100: 232 239 253;
+  --color-primary-200: 190 227 248;
+  --color-primary-300: 144 205 244;
+  --color-primary-400: 99 179 237;
+  --color-primary-500: 54 117 251;
+  --color-primary-600: 0 104 254;
+  --color-primary-700: 43 108 176;
+  --color-primary-800: 44 82 130;
+  --color-primary-900: 32 36 62;
+  --color-primary-950: 32 36 62;
+  --color-primary-DEFAULT: 54 117 251;
+}

package/package.json

@@ -1,79 +1,79 @@
-{
-  "name": "@finema/core",
-  "version": "1.3.3",
-  "repository": "https://gitlab.finema.co/finema/ui-kit",
-  "license": "MIT",
-  "author": "Finema Development Team",
-  "type": "module",
-  "exports": {
-    ".": {
-      "types": "./dist/types.d.ts",
-      "import": "./dist/module.mjs",
-      "require": "./dist/module.cjs"
-    }
-  },
-  "main": "./dist/module.cjs",
-  "types": "./dist/types.d.ts",
-  "files": [
-    "dist"
-  ],
-  "engines": {
-    "node": ">=18.0.0"
-  },
-  "scripts": {
-    "prepack": "nuxt-module-build build",
-    "dev": "nuxi dev playground",
-    "dev:build": "nuxi build playground",
-    "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
-    "lint": "eslint .",
-    "lint:fix": "eslint . --fix",
-    "test": "vitest run",
-    "test:watch": "vitest watch",
-    "release": "release-it",
-    "prepare": "husky install"
-  },
-  "dependencies": {
-    "@headlessui/vue": "^1.7.16",
-    "@iconify-json/mdi": "^1.1.54",
-    "@iconify-json/simple-icons": "^1.1.76",
-    "@nuxt/kit": "^3.7.4",
-    "@nuxt/ui": "^2.9.0",
-    "@pinia/nuxt": "^0.4.11",
-    "@vee-validate/nuxt": "^4.11.8",
-    "@vee-validate/zod": "^4.11.8",
-    "axios": "^1.5.1",
-    "dayjs": "^1.11.10",
-    "lodash-es": "^4.17.21",
-    "nuxt-security": "^0.14.4",
-    "pinia": "^2.1.6",
-    "url-join": "^5.0.0",
-    "zod": "^3.22.4"
-  },
-  "devDependencies": {
-    "@finema/eslint-config": "^1.2.0",
-    "@nuxt/devtools": "latest",
-    "@nuxt/eslint-config": "^0.2.0",
-    "@nuxt/module-builder": "^0.5.2",
-    "@nuxt/schema": "^3.7.4",
-    "@nuxt/test-utils": "^3.7.4",
-    "@release-it/conventional-changelog": "^7.0.2",
-    "@types/lodash-es": "^4.17.12",
-    "@types/node": "^18.18.1",
-    "changelogen": "^0.5.5",
-    "eslint": "^8.50.0",
-    "husky": "^8.0.3",
-    "lint-staged": "^14.0.1",
-    "nuxt": "^3.7.4",
-    "prettier": "^3.0.3",
-    "release-it": "^16.2.1",
-    "stylelint": "^15.10.3",
-    "stylelint-config-prettier-scss": "^1.0.0",
-    "stylelint-config-standard-scss": "^11.0.0",
-    "vitest": "^0.33.0"
-  },
-  "lint-staged": {
-    "*.{ts,vue,tsx,js}": "eslint --fix",
-    "*.{css,scss}": "stylelint --fix",
-    "*.{html,json}": "prettier --write"
-  }
-}
+{
+  "name": "@finema/core",
+  "version": "1.3.5",
+  "repository": "https://gitlab.finema.co/finema/ui-kit",
+  "license": "MIT",
+  "author": "Finema Development Team",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/types.d.ts",
+      "import": "./dist/module.mjs",
+      "require": "./dist/module.cjs"
+    }
+  },
+  "main": "./dist/module.cjs",
+  "types": "./dist/types.d.ts",
+  "files": [
+    "dist"
+  ],
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "scripts": {
+    "prepack": "nuxt-module-build build",
+    "dev": "nuxi dev playground",
+    "dev:build": "nuxi build playground",
+    "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
+    "test": "vitest run",
+    "test:watch": "vitest watch",
+    "release": "release-it",
+    "prepare": "husky install"
+  },
+  "dependencies": {
+    "@headlessui/vue": "^1.7.16",
+    "@iconify-json/mdi": "^1.1.54",
+    "@iconify-json/simple-icons": "^1.1.76",
+    "@nuxt/kit": "^3.7.4",
+    "@nuxt/ui": "^2.11.1",
+    "@pinia/nuxt": "^0.4.11",
+    "@vee-validate/nuxt": "^4.11.8",
+    "@vee-validate/zod": "^4.11.8",
+    "axios": "^1.5.1",
+    "dayjs": "^1.11.10",
+    "lodash-es": "^4.17.21",
+    "nuxt-security": "^0.14.4",
+    "pinia": "^2.1.6",
+    "url-join": "^5.0.0",
+    "zod": "^3.22.4"
+  },
+  "devDependencies": {
+    "@finema/eslint-config": "^1.2.0",
+    "@nuxt/devtools": "latest",
+    "@nuxt/eslint-config": "^0.2.0",
+    "@nuxt/module-builder": "^0.5.2",
+    "@nuxt/schema": "^3.7.4",
+    "@nuxt/test-utils": "^3.7.4",
+    "@release-it/conventional-changelog": "^7.0.2",
+    "@types/lodash-es": "^4.17.12",
+    "@types/node": "^18.18.1",
+    "changelogen": "^0.5.5",
+    "eslint": "^8.50.0",
+    "husky": "^8.0.3",
+    "lint-staged": "^14.0.1",
+    "nuxt": "^3.7.4",
+    "prettier": "^3.0.3",
+    "release-it": "^16.2.1",
+    "stylelint": "^15.10.3",
+    "stylelint-config-prettier-scss": "^1.0.0",
+    "stylelint-config-standard-scss": "^11.0.0",
+    "vitest": "^0.33.0"
+  },
+  "lint-staged": {
+    "*.{ts,vue,tsx,js}": "eslint --fix",
+    "*.{css,scss}": "stylelint --fix",
+    "*.{html,json}": "prettier --write"
+  }
+}