@fy-/fws-vue 2.3.53 → 2.3.55

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/components/ui/DefaultPaging.vue +15 -6
  2. package/package.json +1 -1
package/components/ui/DefaultPaging.vue CHANGED
@@ -36,6 +36,15 @@ const pageWatcher = shallowRef<WatchStopHandle>()
36
36
  const jumpPageValue = ref('')
37
37
  const showJumpInput = ref(false)
38
38
 
39
+ // Compute input width based on max page digits
40
+ const inputWidthClass = computed(() => {
41
+ const digits = props.items.page_max.toString().length
42
+ if (digits >= 3) {
43
+ return 'w-12 md:w-14'
44
+ }
45
+ return 'w-8 md:w-10'
46
+ })
47
+
39
48
  // Memoize the hash string to avoid repeated computation
40
49
  const hashString = computed(() => props.hash !== '' ? `#${props.hash}` : undefined)
41
50
 
@@ -268,8 +277,8 @@ onMounted(() => {
268
277
  type="number"
269
278
  :min="1"
270
279
  :max="items.page_max"
271
- class="w-8 md:w-10 h-7 md:h-8 text-xs text-center text-fv-neutral-700 bg-white/80 border border-fv-neutral-300 rounded-md shadow-sm focus:ring-2 focus:ring-primary-400/40 focus:border-primary-400 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:border-fv-neutral-600 dark:focus:ring-primary-500/40 dark:focus:border-primary-500 transition-all"
272
- :placeholder="items.page_max.toString().length > 2 ? '···' : '••'"
280
+ :class="`${inputWidthClass} h-7 md:h-8 text-[10px] md:text-xs font-normal text-center text-fv-neutral-700 bg-white/80 border border-fv-neutral-300 rounded-md shadow-sm focus:ring-2 focus:ring-primary-400/40 focus:border-primary-400 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:border-fv-neutral-600 dark:focus:ring-primary-500/40 dark:focus:border-primary-500 transition-all [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none`"
281
+ placeholder=""
273
282
  @keydown="handleJumpInputKeydown"
274
283
  @blur="showJumpInput = false; jumpPageValue = ''"
275
284
  >
@@ -322,8 +331,8 @@ onMounted(() => {
322
331
  type="number"
323
332
  :min="1"
324
333
  :max="items.page_max"
325
- class="w-8 md:w-10 h-7 md:h-8 text-xs text-center text-fv-neutral-700 bg-white/80 border border-fv-neutral-300 rounded-md shadow-sm focus:ring-2 focus:ring-primary-400/40 focus:border-primary-400 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:border-fv-neutral-600 dark:focus:ring-primary-500/40 dark:focus:border-primary-500 transition-all"
326
- :placeholder="items.page_max.toString().length > 2 ? '···' : '••'"
334
+ :class="`${inputWidthClass} h-7 md:h-8 text-[10px] md:text-xs font-normal text-center text-fv-neutral-700 bg-white/80 border border-fv-neutral-300 rounded-md shadow-sm focus:ring-2 focus:ring-primary-400/40 focus:border-primary-400 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:border-fv-neutral-600 dark:focus:ring-primary-500/40 dark:focus:border-primary-500 transition-all [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none`"
335
+ placeholder=""
327
336
  @keydown="handleJumpInputKeydown"
328
337
  @blur="showJumpInput = false; jumpPageValue = ''"
329
338
  >
@@ -352,8 +361,8 @@ onMounted(() => {
352
361
  type="number"
353
362
  :min="1"
354
363
  :max="items.page_max"
355
- class="w-8 md:w-10 h-7 md:h-8 text-xs text-center text-fv-neutral-700 bg-white/80 border border-fv-neutral-300 rounded-md shadow-sm focus:ring-2 focus:ring-primary-400/40 focus:border-primary-400 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:border-fv-neutral-600 dark:focus:ring-primary-500/40 dark:focus:border-primary-500 transition-all"
356
- :placeholder="items.page_max.toString().length > 2 ? '···' : '••'"
364
+ :class="`${inputWidthClass} h-7 md:h-8 text-[10px] md:text-xs font-normal text-center text-fv-neutral-700 bg-white/80 border border-fv-neutral-300 rounded-md shadow-sm focus:ring-2 focus:ring-primary-400/40 focus:border-primary-400 focus:outline-none dark:bg-fv-neutral-800 dark:text-fv-neutral-300 dark:border-fv-neutral-600 dark:focus:ring-primary-500/40 dark:focus:border-primary-500 transition-all [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none`"
365
+ placeholder=""
357
366
  @keydown="handleJumpInputKeydown"
358
367
  @blur="showJumpInput = false; jumpPageValue = ''"
359
368
  >
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fy-/fws-vue",
3
- "version": "2.3.53",
3
+ "version": "2.3.55",
4
4
  "author": "Florian 'Fy' Gasquez <m@fy.to>",
5
5
  "license": "MIT",
6
6
  "homepage": "https://github.com/fy-to/FWJS#readme",