@tak-ps/vue-tabler 3.72.1 → 3.74.0

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.
package/CHANGELOG.md CHANGED
@@ -10,6 +10,14 @@
10
10
 
11
11
  ## Version History
12
12
 
13
+ ### v3.74.0
14
+
15
+ - :tada: Introduce TS Linting
16
+
17
+ ### v3.73.0
18
+
19
+ - :tada: Add `InlineAlert` component
20
+
13
21
  ### v3.72.1
14
22
 
15
23
  - :bug: User error not committing the file
@@ -17,7 +17,10 @@
17
17
  :size='32'
18
18
  stroke='1'
19
19
  />
20
- <span class='mx-2' v-text='label'/>
20
+ <span
21
+ class='mx-2'
22
+ v-text='label'
23
+ />
21
24
  </div>
22
25
  </template>
23
26
  <template v-else>
@@ -53,7 +53,7 @@ export default {
53
53
 
54
54
  let res = `${this.months[date.getUTCMonth()]} ${date.getUTCDate()}${suffix}`;
55
55
  if (date.getFullYear() !== new Date().getFullYear()) {
56
- res + ` ${date.getFullYear()}`;
56
+ res = res + ` ${date.getFullYear()}`;
57
57
  }
58
58
 
59
59
  res = res + `, ${String(date.getUTCHours()).padStart(2, '0')}:${String(date.getMinutes()).padEnd(2, '0')}`;
@@ -12,7 +12,7 @@
12
12
  </template>
13
13
 
14
14
  <script setup>
15
- import { useId, defineProps, useTemplateRef } from 'vue'
15
+ import { useId, useTemplateRef } from 'vue'
16
16
 
17
17
  const iconid = useId();
18
18
 
@@ -0,0 +1,75 @@
1
+ <template>
2
+ <div class='col-lg-12'>
3
+ <div
4
+ class='alert d-flex'
5
+ :class='`alert-${props.severity} ${props.dismissable ? "alert-dismissible" : ""}`'
6
+ role='alert'
7
+ >
8
+ <div class='alert-icon'>
9
+ <IconInfoCircle
10
+ v-if='props.severity === "info"'
11
+ :size='24'
12
+ stroke='1'
13
+ />
14
+ <IconExclamationCircle
15
+ v-else-if='props.severity === "danger"'
16
+ :size='24'
17
+ stroke='1'
18
+ />
19
+ <IconAlertTriangle
20
+ v-else-if='props.severity === "warning"'
21
+ :size='24'
22
+ stroke='1'
23
+ />
24
+ <IconCheck
25
+ v-else-if='props.severity === "success"'
26
+ :size='24'
27
+ stroke='1'
28
+ />
29
+ <IconQuestionMark
30
+ v-else
31
+ :size='24'
32
+ stroke='1'
33
+ />
34
+ </div>
35
+
36
+ <div>
37
+ <h4
38
+ class='alert-heading'
39
+ v-text='props.title'
40
+ />
41
+ <div
42
+ v-if='props.description'
43
+ class='alert-description'
44
+ v-text='props.description'
45
+ />
46
+ </div>
47
+ <a
48
+ v-if='props.dismissable'
49
+ class='btn-close'
50
+ data-bs-dismiss='alert'
51
+ aria-label='close'
52
+ />
53
+ </div>
54
+ </div>
55
+ </template>
56
+
57
+ <script setup lang='ts'>
58
+ import {
59
+ IconCheck,
60
+ IconQuestionMark,
61
+ IconInfoCircle,
62
+ IconExclamationCircle,
63
+ IconAlertTriangle
64
+ } from '@tabler/icons-vue';
65
+
66
+ const props = withDefaults(defineProps<{
67
+ severity?: string // info, danger, warning, success
68
+ title: string
69
+ description?: string
70
+ dismissable?: boolean
71
+ }>(), {
72
+ severity: 'info',
73
+ dismissable: false,
74
+ });
75
+ </script>
@@ -24,7 +24,6 @@
24
24
  </template>
25
25
 
26
26
  <script setup>
27
- import { defineProps } from 'vue'
28
27
  import {
29
28
  IconRefresh
30
29
  } from '@tabler/icons-vue';
@@ -11,7 +11,6 @@
11
11
  <div class='col-12'>
12
12
  <input
13
13
  ref='text-input'
14
- @change='$emit("change", $event)'
15
14
  :disabled='disabled'
16
15
  :autofocus='autofocus'
17
16
  :accept='accept'
@@ -21,8 +20,9 @@
21
20
  }'
22
21
  class='form-control'
23
22
  :placeholder='placeholder||label||""'
23
+ @change='$emit("change", $event)'
24
24
  @blur='$emit("blur")'
25
- />
25
+ >
26
26
  <span
27
27
  v-if='loading'
28
28
  class='input-icon-addon'
@@ -34,7 +34,10 @@
34
34
  v-if='label'
35
35
  class='px-2'
36
36
  >
37
- <span class='user-select-none' v-text='label' />
37
+ <span
38
+ class='user-select-none'
39
+ v-text='label'
40
+ />
38
41
  <span
39
42
  v-if='props.required'
40
43
  class='text-red mx-1'
package/eslint.config.js CHANGED
@@ -1,9 +1,11 @@
1
1
  import js from "@eslint/js";
2
2
  import globals from "globals"
3
3
  import eslintPluginVue from 'eslint-plugin-vue'
4
+ import ts from 'typescript-eslint';
4
5
 
5
6
  export default [
6
7
  js.configs.recommended,
8
+ ...ts.configs.recommended,
7
9
  ...eslintPluginVue.configs['flat/recommended'],
8
10
  {
9
11
  languageOptions: {
package/lib.js CHANGED
@@ -1,5 +1,4 @@
1
1
  // Inputs
2
- export { default as TablerAlert } from './components/Alert.vue'
3
2
  export { default as TablerTimeZone } from './components/input/TimeZone.vue'
4
3
  export { default as TablerRange } from './components/input/Range.vue'
5
4
  export { default as TablerColour } from './components/input/Colour.vue'
@@ -9,6 +8,8 @@ export { default as TablerInput } from './components/input/Input.vue'
9
8
  export { default as TablerFileInput } from './components/input/FileInput.vue'
10
9
  export { default as TablerEnum } from './components/input/Enum.vue';
11
10
 
11
+ export { default as TablerAlert } from './components/Alert.vue'
12
+ export { default as TablerInlineAlert } from './components/InlineAlert.vue'
12
13
  export { default as TablerButton } from './components/Button.vue'
13
14
  export { default as TablerRefreshButton } from './components/RefreshButton.vue'
14
15
  export { default as TablerIconButton } from './components/IconButton.vue'
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@tak-ps/vue-tabler",
3
3
  "type": "module",
4
- "version": "3.72.1",
4
+ "version": "3.74.0",
5
5
  "lib": "lib.js",
6
6
  "module": "lib.js",
7
7
  "description": "Tabler UI components for Vue3",
@@ -22,6 +22,7 @@
22
22
  "dependencies": {
23
23
  "@tabler/icons-vue": "^3.0.0",
24
24
  "showdown": "^2.1.0",
25
+ "typescript-eslint": "^8.36.0",
25
26
  "vue": "^3.5.12"
26
27
  },
27
28
  "devDependencies": {