@kiva/kv-components 3.75.2 → 3.77.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.
Files changed (6) hide show
  1. package/CHANGELOG.md +30 -0
  2. package/package.json +2 -2
  3. package/vue/KvChip.vue +54 -0
  4. package/vue/KvLoanCallouts.vue +1 -1
  5. package/vue/stories/KvChip.stories.js +43 -0
  6. package/vue/stories/KvLoanCallouts.stories.js +5 -4
package/CHANGELOG.md CHANGED
@@ -3,6 +3,36 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [3.77.0](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@3.76.0...@kiva/kv-components@3.77.0) (2024-05-08)
7
+
8
+
9
+ ### Features
10
+
11
+ * clickable activity tag ([#397](https://github.com/kiva/kv-ui-elements/issues/397)) ([0b808a5](https://github.com/kiva/kv-ui-elements/commit/0b808a591d1b6f43c12df8f6f54920cd77f59125))
12
+
13
+
14
+
15
+
16
+
17
+ # [3.76.0](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@3.75.2...@kiva/kv-components@3.76.0) (2024-05-02)
18
+
19
+
20
+ ### Bug Fixes
21
+
22
+ * removal of unnecessary classes, v-if, and added slot tag ([dd46624](https://github.com/kiva/kv-ui-elements/commit/dd46624bde0f99f3889d11cc0c68bf5b0eeab182))
23
+ * style classes -> Tailwinds classes ([920e364](https://github.com/kiva/kv-ui-elements/commit/920e364749d47a8e73770a3c43eb5c3e1a36df1d))
24
+ * tags within storybook component, also font for title ([23e6c0d](https://github.com/kiva/kv-ui-elements/commit/23e6c0d7c50d6c097960553356740aa10c9ffff2))
25
+
26
+
27
+ ### Features
28
+
29
+ * newly created global chip component [CIT-1429] ([82cb335](https://github.com/kiva/kv-ui-elements/commit/82cb33538cadbc0c817501df70e36a37c21d5dd8))
30
+ * scss section removal, additional stories, new props + setup ([c7000d7](https://github.com/kiva/kv-ui-elements/commit/c7000d7f4d0e4446b40de0840805079aa863473a))
31
+
32
+
33
+
34
+
35
+
6
36
  ## [3.75.2](https://github.com/kiva/kv-ui-elements/compare/@kiva/kv-components@3.75.1...@kiva/kv-components@3.75.2) (2024-04-29)
7
37
 
8
38
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kiva/kv-components",
3
- "version": "3.75.2",
3
+ "version": "3.77.0",
4
4
  "type": "module",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -75,5 +75,5 @@
75
75
  "optional": true
76
76
  }
77
77
  },
78
- "gitHead": "489d7831ed1eb950eb559003530e4fed7e0e5d98"
78
+ "gitHead": "55a76b52fec99dd56e0f1203a6dd8dd2f0d25370"
79
79
  }
package/vue/KvChip.vue ADDED
@@ -0,0 +1,54 @@
1
+ <template>
2
+ <div class="tw-inline-flex">
3
+ <button
4
+ class="
5
+ tw-bg-secondary
6
+ hover:tw-bg-tertiary
7
+ tw-items-center
8
+ tw-flex
9
+ tw-flex-row
10
+ tw-cursor-pointer
11
+ tw-whitespace-nowrap
12
+ tw-rounded
13
+ tw-h-2
14
+ tw-py-2
15
+ tw-px-2
16
+ tw-select-none
17
+ "
18
+ @click="handleClick"
19
+ >
20
+ <div
21
+ class="tw-text-base tw-pr-1"
22
+ >
23
+ <slot></slot>
24
+ </div>
25
+ <kv-material-icon
26
+ :icon="mdiClose"
27
+ class="tw-w-2 tw-h-2"
28
+ :from-sprite="true"
29
+ />
30
+ </button>
31
+ </div>
32
+ </template>
33
+ <script>
34
+ import { mdiClose } from '@mdi/js';
35
+ import KvMaterialIcon from './KvMaterialIcon.vue';
36
+
37
+ export default {
38
+ name: 'KvChip',
39
+ components: { KvMaterialIcon },
40
+ emits: [
41
+ 'click-chip',
42
+ ],
43
+ setup() {
44
+ return {
45
+ mdiClose,
46
+ };
47
+ },
48
+ methods: {
49
+ handleClick() {
50
+ this.$emit('click-chip');
51
+ },
52
+ },
53
+ };
54
+ </script>
package/vue/KvLoanCallouts.vue CHANGED
@@ -60,7 +60,7 @@ export default {
60
60
  } = toRefs(props);
61
61
 
62
62
  const isClickable = (tag) => {
63
- const clickableTypes = ['sector', 'tag', 'attribute'];
63
+ const clickableTypes = ['sector', 'tag', 'attribute', 'activity'];
64
64
  const isClickableType = clickableTypes.includes(tag.type);
65
65
 
66
66
  return enableClickable.value && isClickableType && !!tag.id;
package/vue/stories/KvChip.stories.js ADDED
@@ -0,0 +1,43 @@
1
+ import KvChip from '../KvChip.vue';
2
+
3
+ export default {
4
+ title: 'KvChip',
5
+ component: KvChip,
6
+ };
7
+
8
+ const story = (args) => {
9
+ const template = (_args, { argTypes }) => ({
10
+ props: Object.keys(argTypes),
11
+ components: { KvChip },
12
+ template: `
13
+ <kv-chip
14
+ >
15
+ <p> Chip Title </p>
16
+ </kv-chip>
17
+ `,
18
+ });
19
+ template.args = args;
20
+ return template;
21
+ };
22
+
23
+ export const Default = story();
24
+ export const LongChipTitle = (args, { argTypes }) => ({
25
+ props: Object.keys(argTypes),
26
+ components: { KvChip },
27
+ template: `
28
+ <kv-chip
29
+ >
30
+ <p> Longer Chip Title </p>
31
+ </kv-chip>
32
+ `,
33
+ });
34
+ export const EmailAddress = (args, { argTypes }) => ({
35
+ props: Object.keys(argTypes),
36
+ components: { KvChip },
37
+ template: `
38
+ <kv-chip
39
+ >
40
+ <h4> @BankofAmerica.com </h4>
41
+ </kv-chip>
42
+ `,
43
+ });
package/vue/stories/KvLoanCallouts.stories.js CHANGED
@@ -24,10 +24,11 @@ export const Default = story({ callouts: [{ label: 'callout 1' }, { label: 'call
24
24
 
25
25
  export const Clickable = story({
26
26
  callouts: [
27
- { label: 'callout 2' },
28
- { id: 33, label: 'callout 3', type: 'sector' },
29
- { id: null, label: 'callout 4', type: 'tag' },
30
- { id: 12, label: 'callout 5', type: 'attribute' },
27
+ { label: 'callout 1' },
28
+ { id: 33, label: 'callout 2', type: 'sector' },
29
+ { id: null, label: 'callout 3', type: 'tag' },
30
+ { id: 12, label: 'callout 4', type: 'attribute' },
31
+ { id: 9, label: 'callout 5', type: 'activity' },
31
32
  ],
32
33
  enableClickable: true,
33
34
  });