@proj-airi/ui 0.4.23 → 0.4.25

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.
@@ -31,6 +31,10 @@ function updateTrackColor() {
31
31
  sliderRef.value.style.setProperty("--min", !sliderRef.value.min ? props.min.toString() : sliderRef.value.min);
32
32
  sliderRef.value.style.setProperty("--max", !sliderRef.value.max ? props.max.toString() : sliderRef.value.max);
33
33
  }
34
+ function handleInput(e) {
35
+ const target = e.target;
36
+ target.style.setProperty("--value", target.value);
37
+ }
34
38
  </script>
35
39
 
36
40
  <template>
@@ -42,9 +46,7 @@ function updateTrackColor() {
42
46
  :max="scaledMax"
43
47
  :step="scaledStep"
44
48
  class="slider-progress form_input-range"
45
- @input="(e) => {
46
- (e.target as HTMLInputElement).style.setProperty('--value', (e.target as HTMLInputElement).value)
47
- }"
49
+ @input="handleInput"
48
50
  >
49
51
  </template>
50
52
 
@@ -6,9 +6,12 @@ const modelValue = defineModel({ type: String, ...{ default: "" } });
6
6
  <template>
7
7
  <BasicTextarea
8
8
  v-model="modelValue"
9
- border="neutral-100 dark:neutral-800 solid 2 focus:neutral-200 dark:focus:neutral-700"
10
- transition="all duration-250 ease-in-out"
11
- bg="neutral-100 dark:neutral-800 focus:neutral-50 dark:focus:neutral-900"
12
- rounded-lg px-3 py-2 text-sm outline-none
9
+ border="focus:primary-300 dark:focus:primary-400/50 2 solid neutral-100 dark:neutral-900"
10
+ transition="all duration-200 ease-in-out"
11
+ text="disabled:neutral-400 dark:disabled:neutral-600"
12
+ cursor="disabled:not-allowed"
13
+ w-full rounded-lg px-3 py-2 text-sm outline-none
14
+ shadow="sm"
15
+ bg="neutral-50 dark:neutral-950 focus:neutral-50 dark:focus:neutral-900"
13
16
  />
14
17
  </template>
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@proj-airi/ui",
3
3
  "type": "module",
4
- "version": "0.4.23",
4
+ "version": "0.4.25",
5
5
  "description": "A collection of UI components that used by Project AIRI",
6
6
  "author": {
7
7
  "name": "Neko Ayaka",
@@ -46,6 +46,11 @@ function updateTrackColor() {
46
46
  sliderRef.value.style.setProperty('--min', !sliderRef.value.min ? props.min.toString() : sliderRef.value.min)
47
47
  sliderRef.value.style.setProperty('--max', !sliderRef.value.max ? props.max.toString() : sliderRef.value.max)
48
48
  }
49
+
50
+ function handleInput(e: Event) {
51
+ const target = e.target as HTMLInputElement
52
+ target.style.setProperty('--value', target.value)
53
+ }
49
54
  </script>
50
55
 
51
56
  <template>
@@ -57,9 +62,7 @@ function updateTrackColor() {
57
62
  :max="scaledMax"
58
63
  :step="scaledStep"
59
64
  class="slider-progress form_input-range"
60
- @input="(e) => {
61
- (e.target as HTMLInputElement).style.setProperty('--value', (e.target as HTMLInputElement).value)
62
- }"
65
+ @input="handleInput"
63
66
  >
64
67
  </template>
65
68
 
@@ -7,9 +7,12 @@ const modelValue = defineModel<string>({ default: '' })
7
7
  <template>
8
8
  <BasicTextarea
9
9
  v-model="modelValue"
10
- border="neutral-100 dark:neutral-800 solid 2 focus:neutral-200 dark:focus:neutral-700"
11
- transition="all duration-250 ease-in-out"
12
- bg="neutral-100 dark:neutral-800 focus:neutral-50 dark:focus:neutral-900"
13
- rounded-lg px-3 py-2 text-sm outline-none
10
+ border="focus:primary-300 dark:focus:primary-400/50 2 solid neutral-100 dark:neutral-900"
11
+ transition="all duration-200 ease-in-out"
12
+ text="disabled:neutral-400 dark:disabled:neutral-600"
13
+ cursor="disabled:not-allowed"
14
+ w-full rounded-lg px-3 py-2 text-sm outline-none
15
+ shadow="sm"
16
+ bg="neutral-50 dark:neutral-950 focus:neutral-50 dark:focus:neutral-900"
14
17
  />
15
18
  </template>