bonkers-ui 1.0.36 → 1.0.37

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "bonkers-ui",
3
- "version": "1.0.36",
3
+ "version": "1.0.37",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "storybook": "start-storybook -p 6006",
@@ -18,28 +18,28 @@
18
18
  "@fortawesome/free-brands-svg-icons": "^6.2.1",
19
19
  "@fortawesome/free-regular-svg-icons": "^6.2.1",
20
20
  "@fortawesome/free-solid-svg-icons": "^6.2.1",
21
- "@fortawesome/vue-fontawesome": "^3.0.2",
22
- "@vueuse/components": "^9.10.0",
23
- "@vueuse/core": "^9.10.0",
24
- "vue": "^3.2.45"
21
+ "@fortawesome/vue-fontawesome": "^3.0.3",
22
+ "@vueuse/components": "^9.12.0",
23
+ "@vueuse/core": "^9.12.0",
24
+ "vue": "^3.2.47"
25
25
  },
26
26
  "devDependencies": {
27
- "@storybook/addon-actions": "^6.5.15",
28
- "@storybook/addon-essentials": "^6.5.15",
29
- "@storybook/addon-links": "^6.5.15",
27
+ "@storybook/addon-actions": "^6.5.16",
28
+ "@storybook/addon-essentials": "^6.5.16",
29
+ "@storybook/addon-links": "^6.5.16",
30
30
  "@storybook/addon-postcss": "^2.0.0",
31
- "@storybook/builder-vite": "^0.2.7",
32
- "@storybook/vue3": "^6.5.15",
33
- "@typescript-eslint/eslint-plugin": "^5.48.1",
34
- "@typescript-eslint/parser": "^5.48.1",
31
+ "@storybook/builder-vite": "^0.4.0",
32
+ "@storybook/vue3": "^6.5.16",
33
+ "@typescript-eslint/eslint-plugin": "^5.50.0",
34
+ "@typescript-eslint/parser": "^5.50.0",
35
35
  "@vitejs/plugin-vue": "^4.0.0",
36
36
  "@vue/eslint-config-typescript": "^11.0.2",
37
- "@vue/test-utils": "^2.2.7",
38
- "eslint": "8.31.0",
39
- "eslint-plugin-vue": "^9.8.0",
40
- "gh-pages": "^4.0.0",
37
+ "@vue/test-utils": "^2.2.9",
38
+ "eslint": "8.33.0",
39
+ "eslint-plugin-vue": "^9.9.0",
40
+ "gh-pages": "^5.0.0",
41
41
  "husky": "4.3.8",
42
- "jsdom": "^21.0.0",
42
+ "jsdom": "^21.1.0",
43
43
  "lint-staged": "^13.1.0",
44
44
  "postcss": "^8.4.21",
45
45
  "postcss-html": "^1.4.1",
@@ -50,9 +50,9 @@
50
50
  "stylelint-config-standard": "^29.0.0",
51
51
  "tailwindcss": "^3.2.4",
52
52
  "ts-node": "^10.9.1",
53
- "typescript": "^4.9.4",
54
- "vite": "^4.0.4",
55
- "vitest": "^0.27.0",
53
+ "typescript": "^4.9.5",
54
+ "vite": "^4.1.0",
55
+ "vitest": "^0.28.3",
56
56
  "vue-eslint-parser": "^9.1.0",
57
57
  "vue-loader": "^17.0.1",
58
58
  "vue-tsc": "^1.0.24"
@@ -38,7 +38,7 @@ const Template: Story<TComponentProps> = (args) => ({
38
38
  /*html*/`
39
39
  <ui-card-result
40
40
  v-bind="args"
41
- header="Some header"
41
+ header="Some header Some header Some header Some header Some header Some header"
42
42
  :exclusive-text="args.exclusiveText
43
43
  ? 'Only available on bonkers.ie'
44
44
  : undefined"
@@ -47,7 +47,7 @@ const Template: Story<TComponentProps> = (args) => ({
47
47
  : undefined"
48
48
  >
49
49
  <template #sidebar>
50
- <ui-typography :size='ETypographySizes.XXS' line-height>
50
+ <ui-typography :size='ETypographySizes.XXS' line-height :style="{height: '64px', width: '64px', border: '1px solid black'}" class="flex items-center">
51
51
  Special offer text
52
52
  </ui-typography>
53
53
  </template>
@@ -73,26 +73,26 @@ const Template: Story<TComponentProps> = (args) => ({
73
73
  />
74
74
  </ul>
75
75
 
76
- <ui-typography
77
- :weight="ETextWeight.BOLD"
78
- :size="ETypographySizes.LG"
79
- :align="ETextAlign.RIGHT"
80
- class="mb-xs"
81
- >
82
- €1004.63 p/m
83
- </ui-typography>
76
+ <div :style="{display: 'grid', gridTemplateColumns: '1fr 1fr'}" class="items-center gap-sm">
77
+ <ui-typography
78
+ :weight="ETextWeight.BOLD"
79
+ :size="ETypographySizes.XXL"
80
+ >
81
+ €1004.63 p/m
82
+ </ui-typography>
84
83
 
85
- <div class="flex gap-sm">
86
- <ui-button :kind="EButtonTypes.SECONDARY_OVERLAY">
87
- <template #prefix>
88
- <ui-icon
89
- :icon-name="['far', 'face-smile']"
90
- :size="ESize.SM"
91
- />
92
- </template>
93
- </ui-button>
84
+ <div class="flex gap-sm">
85
+ <ui-button :kind="EButtonTypes.SECONDARY_OVERLAY">
86
+ <template #prefix>
87
+ <ui-icon
88
+ :icon-name="['far', 'face-smile']"
89
+ :size="ESize.SM"
90
+ />
91
+ </template>
92
+ </ui-button>
94
93
 
95
- <ui-button full-width>Some text</ui-button>
94
+ <ui-button full-width>Some text</ui-button>
95
+ </div>
96
96
  </div>
97
97
 
98
98
  </template>
@@ -1,8 +1,8 @@
1
1
  <template>
2
- <div class="ui-card-result__wrapper">
2
+ <div class="ui-card-result">
3
3
  <div
4
4
  v-if="exclusiveText"
5
- class="ui-card-result__exclusive bg-primary rounded-2xl px-sm pb-lg -mb-lg"
5
+ class="bg-primary rounded-2xl px-sm pb-lg -mb-lg"
6
6
  >
7
7
  <ui-typography
8
8
  class="py-xs"
@@ -16,30 +16,29 @@
16
16
  </ui-typography>
17
17
  </div>
18
18
 
19
- <div class="ui-card-result flex border border-secondary-alt rounded-2xl overflow-hidden">
20
- <div
21
- v-if="slots.sidebar"
22
- class="ui-card-result__sidebar bg-secondary-alt-200 p-sm w-xl border-r border-secondary-alt flex items-center justify-center text-center"
23
- >
24
- <slot name="sidebar" />
25
- </div>
26
-
19
+ <div class="flex border border-secondary-alt-400 rounded-2xl overflow-hidden">
27
20
  <main class="p-sm bg-white w-full overflow-hidden">
28
- <ui-typography
29
- v-if="header"
30
- class="mb-xs"
31
- :size="ETypographySizes.SM"
32
- :weight="ETextWeight.SEMI_BOLD"
33
- >
34
- {{ header }}
35
- </ui-typography>
21
+ <div class="flex gap-xs justify-between items-center rounded-lg bg-secondary-alt-200 p-xs mb-sm">
22
+ <ui-typography
23
+ v-if="header"
24
+ line-height
25
+ class="flex-1 truncate"
26
+ :size="ETypographySizes.SM"
27
+ :weight="ETextWeight.SEMI_BOLD"
28
+ >
29
+ {{ header }}
30
+ </ui-typography>
31
+
32
+ <slot name="sidebar" />
33
+ </div>
34
+
36
35
  <slot />
37
36
  </main>
38
37
  </div>
39
38
 
40
39
  <div
41
40
  v-if="exclusiveTextBottom"
42
- class="ui-card-result__exclusive_bottom bg-secondary rounded-2xl px-sm pt-lg -mt-lg"
41
+ class="bg-secondary rounded-2xl px-sm pt-lg -mt-lg"
43
42
  >
44
43
  <ui-typography
45
44
  class="py-xs"
@@ -16,6 +16,7 @@
16
16
  <ui-icon
17
17
  v-if="icon"
18
18
  class="bg-white z-[1] mt-[0.2em]"
19
+ :class="iconClass"
19
20
  :icon-name="icon"
20
21
  :size="ESize.SM"
21
22
  />
@@ -46,10 +47,12 @@
46
47
  title?: string
47
48
  kind?: EListItemTypes
48
49
  size?: EListItemSizes
50
+ iconClass?: string
49
51
  }>(), {
50
52
  kind: EListItemTypes.DEFAULT,
51
53
  size: EListItemSizes.COMPACT,
52
54
  title: "",
55
+ iconClass: "text-secondary-alt",
53
56
  icon: undefined
54
57
  });
55
58