@hina-ui/vue 1.7.4 → 1.7.6

package/src/locale/types.ts

@@ -1,225 +1 @@
-export interface UiMessages {
-  qrCode: {
-    label: string
-    empty: string
-    expired: string
-    scanned: string
-    error: string
-    refresh: string
-  }
-  carousel: {
-    label: string
-    role: string
-    slide: string
-    prev: string
-    next: string
-    choose: string
-    play: string
-    pause: string
-    empty: string
-    position: (index: number, total: number) => string
-    goTo: (index: number) => string
-  }
-  monthGrid: { today: string }
-  masonry: { empty: string }
-  splitButton: { more: string }
-  editable: { edit: string; save: string; placeholder: string; failed: string }
-  tag: string
-  stepper: {
-    label: string
-    progress: (step: number, total: number) => string
-    completed: string
-    error: string
-  }
-  common: {
-    close: string
-    copy: string
-    copied: string
-    clear: string
-    loading: string
-    confirm: string
-    cancel: string
-  }
-  banner: {
-    prev: string
-    next: string
-  }
-  pagination: {
-    rangeLabel: (from: number, to: number, total: number) => string
-    pageCountLabel: (page: number, count: number) => string
-    pageSizeLabel: string
-    pageSizeOption: (n: number) => string
-    jumpLabel: string
-    previousPagesLabel: (n: number) => string
-    nextPagesLabel: (n: number) => string
-    choosePage: string
-    choosePageHint: string
-    navLabel: string
-    prev: string
-    next: string
-    first: string
-    last: string
-    pageLabel: (n: number) => string
-    totalLabel: (n: number) => string
-  }
-  table: {
-    edit: string
-    save: string
-    cancel: string
-    editFailed: string
-    selectPage: string
-    selectFiltered: string
-    expand: string
-    collapse: string
-    moveRow: string
-    moveColumn: string
-    resizeColumn: string
-
-    noColumns: string
-    empty: string
-    loading: string
-    sortAsc: string
-    sortDesc: string
-    sortNone: string
-    selectRow: string
-    selectAll: string
-  }
-  select: {
-    placeholder: string
-    empty: string
-    optionCountLabel: (n: number) => string
-  }
-  upload: {
-    choose: string
-    dropHint: string
-    tooLargeLabel: (readableSize: string) => string
-    remove: string
-    removeFile: (name: string) => string
-  }
-  time: {
-    justNow: string
-    unknown: string
-  }
-  scroll: {
-    regionLabel: string
-    backToTop: string
-  }
-  virtualList: {
-    empty: string
-  }
-  dataList: {
-    empty: string
-    list: string
-    grid: string
-    layout: string
-  }
-  toast: {
-    regionLabel: string
-  }
-  spoiler: {
-    revealLabel: string
-    hideLabel: string
-  }
-  codeblock: {
-    copy: string
-  }
-  splitter: {
-    handleLabel: string
-  }
-  sidebar: {
-    navLabel: string
-    toggleLabel: string
-  }
-  anchor: {
-    navLabel: string
-  }
-  breadcrumb: {
-    navLabel: string
-  }
-  lightbox: {
-    zoomIn: string
-    zoomOut: string
-    resetZoom: string
-    actualSize: string
-    rotate: string
-    download: string
-    loadingLarge: string
-  }
-  chip: {
-    remove: string
-  }
-  numberInput: {
-    increase: string
-    decrease: string
-  }
-  passwordInput: {
-    show: string
-    hide: string
-  }
-  tree: {
-    empty: string
-  }
-  treeSelect: {
-    search: string
-  }
-  combobox: {
-    placeholder: string
-    toggle: string
-  }
-  slider: {
-    minimum: string
-    maximum: string
-  }
-  pinInput: {
-    cellLabel: (index: number, total: number) => string
-  }
-  dateField: {
-    year: string
-    month: string
-    day: string
-    hour: string
-    minute: string
-    second: string
-    dayPeriod: string
-  }
-  dateRangeField: {
-    start: string
-    end: string
-    separator: string
-  }
-  datePicker: {
-    open: string
-  }
-  dateTimePicker: {
-    time: string
-  }
-  rating: {
-    star: (value: number) => string
-    label: (value: number, max: number) => string
-    score: (value: number, max: number) => string
-  }
-  form: {
-    required: string
-  }
-  command: {
-    label: string
-    placeholder: string
-    empty: string
-  }
-  calendar: {
-    label: string
-    prev: string
-    next: string
-    prevYear: string
-    nextYear: string
-    prevYears: string
-    nextYears: string
-    pickMonth: string
-    pickYear: string
-    weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6
-  }
-}
-
-export type PartialUiMessages = {
-  [K in keyof UiMessages]?: UiMessages[K] extends object ? Partial<UiMessages[K]> : UiMessages[K]
-}
+export type * from '../../../shared/src/locale/types'

package/src/locale/zh-CN.ts

@@ -1,215 +1 @@
-import type { UiMessages } from './types'
-
-export const zhCN: UiMessages = {
-  qrCode: {
-    label: '二维码',
-    empty: '暂无内容',
-    expired: '二维码已过期',
-    scanned: '已扫描',
-    error: '无法生成二维码',
-    refresh: '刷新二维码',
-  },
-  carousel: {
-    label: '推荐内容',
-    role: '轮播',
-    slide: '内容项',
-    prev: '上一组',
-    next: '下一组',
-    choose: '选择展示位置',
-    play: '开始自动播放',
-    pause: '暂停自动播放',
-    empty: '暂无内容',
-    position: (index, total) => `第 ${index} 项，共 ${total} 项`,
-    goTo: index => `转到第 ${index} 组`,
-  },
-  monthGrid: { today: '回到本月' },
-  masonry: { empty: '暂无内容' },
-  splitButton: { more: '更多操作' },
-  editable: { edit: '编辑', save: '保存', placeholder: '点击编辑', failed: '保存失败，请重试' },
-  tag: 'zh-CN',
-  stepper: {
-    label: '步骤',
-    progress: (step, total) => `第 ${step} 步，共 ${total} 步`,
-    completed: '已完成',
-    error: '该步骤存在错误',
-  },
-  common: {
-    close: '关闭',
-    copy: '复制',
-    copied: '已复制',
-    clear: '清除',
-    loading: '加载中',
-    confirm: '确定',
-    cancel: '取消',
-  },
-  banner: {
-    prev: '上一条',
-    next: '下一条',
-  },
-  pagination: {
-    rangeLabel: (from, to, total) =>
-      total ? String(from) + '–' + to + ' / 共 ' + total + ' 条' : '共 0 条',
-    pageCountLabel: (page, count) => '第 ' + page + ' / ' + count + ' 页',
-    pageSizeLabel: '每页条数',
-    pageSizeOption: n => String(n) + ' / 页',
-    jumpLabel: '跳至页码',
-    previousPagesLabel: n => '向前跳 ' + n + ' 页',
-    nextPagesLabel: n => '向后跳 ' + n + ' 页',
-    choosePage: '选择页码',
-    choosePageHint: '按向下或向上箭头选择页码',
-    navLabel: '翻页',
-    prev: '上一页',
-    next: '下一页',
-    first: '首页',
-    last: '末页',
-    pageLabel: n => `第 ${n} 页`,
-    totalLabel: n => `共 ${n} 条`,
-  },
-  table: {
-    edit: '编辑',
-    save: '保存',
-    cancel: '取消',
-    editFailed: '保存失败，请重试',
-    selectPage: '选择当前页',
-    selectFiltered: '选择筛选结果',
-    expand: '展开',
-    collapse: '收起',
-    moveRow: '移动行',
-    moveColumn: '移动列',
-    resizeColumn: '调整列宽',
-
-    noColumns: '没有可见列',
-    empty: '暂无数据',
-    loading: '加载中',
-    sortAsc: '升序排列',
-    sortDesc: '降序排列',
-    sortNone: '取消排序',
-    selectRow: '选择此行',
-    selectAll: '全选',
-  },
-  select: {
-    placeholder: '请选择',
-    empty: '无匹配项',
-    optionCountLabel: n => `${n} 个选项可用`,
-  },
-  upload: {
-    choose: '选择文件',
-    dropHint: '拖拽文件到此处，或点击选择',
-    tooLargeLabel: readableSize => `文件超出 ${readableSize} 上限`,
-    remove: '移除',
-    removeFile: name => `移除 ${name}`,
-  },
-  time: {
-    justNow: '刚刚',
-    unknown: '未知时间',
-  },
-  virtualList: { empty: '暂无数据' },
-  dataList: { empty: '暂无数据', list: '列表视图', grid: '网格视图', layout: '展示布局' },
-  scroll: {
-    regionLabel: '可滚动区域',
-    backToTop: '返回顶部',
-  },
-  toast: {
-    regionLabel: '通知',
-  },
-  spoiler: {
-    revealLabel: '剧透内容，点击显示',
-    hideLabel: '隐藏剧透',
-  },
-  codeblock: {
-    copy: '复制代码',
-  },
-  splitter: {
-    handleLabel: '调整面板大小',
-  },
-  sidebar: {
-    navLabel: '侧边导航',
-    toggleLabel: '切换侧栏',
-  },
-  anchor: {
-    navLabel: '本页目录',
-  },
-  breadcrumb: {
-    navLabel: '面包屑',
-  },
-  lightbox: {
-    zoomIn: '放大',
-    zoomOut: '缩小',
-    resetZoom: '适应窗口',
-    actualSize: '原始尺寸',
-    rotate: '旋转',
-    download: '下载',
-    loadingLarge: '正在加载原图',
-  },
-  chip: {
-    remove: '移除',
-  },
-  numberInput: {
-    increase: '增加',
-    decrease: '减少',
-  },
-  passwordInput: {
-    show: '显示密码',
-    hide: '隐藏密码',
-  },
-  tree: { empty: '暂无节点' },
-  treeSelect: {
-    search: '搜索节点',
-  },
-  combobox: {
-    placeholder: '输入或选择',
-    toggle: '展开选项',
-  },
-  slider: {
-    minimum: '最小值',
-    maximum: '最大值',
-  },
-  pinInput: {
-    cellLabel: (index, total) => `第 ${index} 位，共 ${total} 位`,
-  },
-  dateField: {
-    year: '年',
-    month: '月',
-    day: '日',
-    hour: '时',
-    minute: '分',
-    second: '秒',
-    dayPeriod: '上午或下午',
-  },
-  dateRangeField: {
-    start: '开始日期',
-    end: '结束日期',
-    separator: '至',
-  },
-  datePicker: {
-    open: '打开日历',
-  },
-  dateTimePicker: {
-    time: '时间',
-  },
-  rating: {
-    star: value => `${value} 星`,
-    label: (value, max) => `${value} 星，满分 ${max} 星`,
-    score: (value, max) => `${value} 分，满分 ${max} 分`,
-  },
-  form: {
-    required: '必填',
-  },
-  command: {
-    label: '命令面板',
-    placeholder: '搜索',
-    empty: '无匹配项',
-  },
-  calendar: {
-    label: '日历',
-    prev: '上个月',
-    next: '下个月',
-    prevYear: '上一年',
-    nextYear: '下一年',
-    prevYears: '前十二年',
-    nextYears: '后十二年',
-    pickMonth: '选择月份',
-    pickYear: '选择年份',
-    weekStartsOn: 1,
-  },
-}
+export { zhCN } from '../../../shared/src/locale/zh-CN'

package/src/primitives/number-field/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 UnoVue <https://github.com/unovue>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/src/primitives/number-field/NumberFieldDecrement.vue

@@ -0,0 +1,21 @@
+<script lang="ts">
+  import type { PrimitiveProps } from 'reka-ui'
+
+  export interface NumberFieldDecrementProps extends PrimitiveProps {
+    disabled?: boolean
+  }
+</script>
+
+<script setup lang="ts">
+  import { Primitive } from 'reka-ui'
+  import { useNumberFieldStep } from './context'
+
+  const props = withDefaults(defineProps<NumberFieldDecrementProps>(), { as: 'button' })
+  const { primitiveElement, attributes } = useNumberFieldStep('decrease', props)
+</script>
+
+<template>
+  <Primitive v-bind="{ ...props, ...attributes }" ref="primitiveElement" @contextmenu.prevent>
+    <slot />
+  </Primitive>
+</template>

package/src/primitives/number-field/NumberFieldIncrement.vue

@@ -0,0 +1,21 @@
+<script lang="ts">
+  import type { PrimitiveProps } from 'reka-ui'
+
+  export interface NumberFieldIncrementProps extends PrimitiveProps {
+    disabled?: boolean
+  }
+</script>
+
+<script setup lang="ts">
+  import { Primitive } from 'reka-ui'
+  import { useNumberFieldStep } from './context'
+
+  const props = withDefaults(defineProps<NumberFieldIncrementProps>(), { as: 'button' })
+  const { primitiveElement, attributes } = useNumberFieldStep('increase', props)
+</script>
+
+<template>
+  <Primitive v-bind="{ ...props, ...attributes }" ref="primitiveElement" @contextmenu.prevent>
+    <slot />
+  </Primitive>
+</template>

package/src/primitives/number-field/NumberFieldInput.vue

@@ -0,0 +1,114 @@
+<script lang="ts">
+  import type { PrimitiveProps } from 'reka-ui'
+
+  export interface NumberFieldInputProps extends PrimitiveProps {}
+</script>
+
+<script setup lang="ts">
+  import { computed, nextTick, onMounted, ref, watch } from 'vue'
+  import { Primitive } from 'reka-ui'
+  import {
+    deepActiveElement,
+    numberFieldInputAttributes,
+    numberFieldKeyAction,
+    numberFieldWheelStep,
+    rejectsNumberFieldInput,
+  } from '../../../../shared/src/primitives/number-field'
+  import { usePrimitiveElement } from '../utils/usePrimitiveElement'
+  import { injectNumberFieldRootContext } from './context'
+
+  const props = withDefaults(defineProps<NumberFieldInputProps>(), { as: 'input' })
+
+  const { primitiveElement, currentElement } = usePrimitiveElement()
+  const root = injectNumberFieldRootContext()
+  const composing = ref(false)
+
+  function handleKeydown(event: KeyboardEvent) {
+    const action = numberFieldKeyAction(event, composing.value)
+    if (!action) return
+    if (action.prevent) event.preventDefault()
+    if (action.type === 'step') root.step(action.direction, action.multiplier)
+    else if (action.type === 'bound') root.jump(action.bound)
+    else root.commit((event.target as HTMLInputElement)?.value)
+  }
+
+  function handleWheel(event: WheelEvent) {
+    const direction = numberFieldWheelStep(event, {
+      focused: event.target === deepActiveElement(document),
+      disabled: root.disableWheelChange.value,
+      inverted: root.invertWheelChange.value,
+    })
+    if (!direction) return
+    event.preventDefault()
+    root.step(direction)
+  }
+
+  function handleBeforeInput(event: InputEvent) {
+    const input = event.target as HTMLInputElement
+    if (rejectsNumberFieldInput(event, input, root.range.value, root.format.value))
+      event.preventDefault()
+  }
+
+  function handleInput(event: Event) {
+    inputValue.value = (event.target as HTMLInputElement).value
+  }
+
+  function handleChange() {
+    requestAnimationFrame(() => {
+      inputValue.value = root.textValue.value
+    })
+  }
+
+  function handleBlur(event: FocusEvent) {
+    root.commit((event.target as HTMLInputElement)?.value)
+  }
+
+  function handleCompositionEnd() {
+    void nextTick(() => {
+      composing.value = false
+    })
+  }
+
+  onMounted(() => {
+    root.onInputElement(currentElement.value as HTMLInputElement)
+  })
+
+  const inputValue = ref(root.textValue.value)
+  watch(
+    () => root.textValue.value,
+    () => {
+      inputValue.value = root.textValue.value
+    },
+    { immediate: true, deep: true },
+  )
+
+  const attributes = computed(() =>
+    numberFieldInputAttributes({
+      id: root.id.value,
+      value: inputValue.value,
+      inputMode: root.inputMode.value,
+      disabled: root.disabled.value,
+      readonly: root.readonly.value,
+      modelValue: root.modelValue.value,
+      min: root.range.value.min,
+      max: root.range.value.max,
+    }),
+  )
+</script>
+
+<template>
+  <Primitive
+    v-bind="{ ...props, ...attributes }"
+    ref="primitiveElement"
+    @keydown="handleKeydown"
+    @wheel="handleWheel"
+    @beforeinput="handleBeforeInput"
+    @input="handleInput"
+    @change="handleChange"
+    @blur="handleBlur"
+    @compositionstart="composing = true"
+    @compositionend="handleCompositionEnd"
+  >
+    <slot />
+  </Primitive>
+</template>