bonkers-ui 1.0.18 → 1.0.20

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 (13) hide show
  1. package/package.json +8 -4
  2. package/src/components/ui-card-cta/ui-card-cta.vue +2 -0
  3. package/src/components/ui-icon/index.ts +1 -0
  4. package/src/components/ui-list-item/_types.ts +5 -0
  5. package/src/components/ui-list-item/index.ts +1 -0
  6. package/src/components/ui-list-item/ui-list-item.stories.ts +14 -16
  7. package/src/components/ui-list-item/ui-list-item.vue +40 -20
  8. package/src/components/ui-order-card/index.ts +1 -1
  9. package/src/components/ui-order-card/ui-order-card.vue +3 -3
  10. package/src/components/ui-radio-fancy/index.ts +1 -1
  11. package/src/components/ui-typography/index.ts +1 -0
  12. package/src/components/ui-typography/ui-typography.vue +1 -1
  13. package/.husky/pre-commit +0 -6
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "bonkers-ui",
3
- "version": "1.0.18",
3
+ "version": "1.0.20",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "storybook": "start-storybook -p 6006",
@@ -11,8 +11,7 @@
11
11
  "test": "jest",
12
12
  "deploy": "gh-pages -d storybook-static",
13
13
  "typecheck": "tsc --noEmit && vue-tsc --noEmit",
14
- "i": "yarn install --frozen-lockfile",
15
- "postinstall": "husky install"
14
+ "i": "yarn install --frozen-lockfile"
16
15
  },
17
16
  "dependencies": {
18
17
  "@fortawesome/fontawesome-svg-core": "^6.2.0",
@@ -20,6 +19,7 @@
20
19
  "@fortawesome/free-regular-svg-icons": "^6.2.0",
21
20
  "@fortawesome/free-solid-svg-icons": "^6.2.0",
22
21
  "@fortawesome/vue-fontawesome": "^3.0.1",
22
+ "husky": "4.3.8",
23
23
  "vue": "^3.2.41"
24
24
  },
25
25
  "devDependencies": {
@@ -40,7 +40,6 @@
40
40
  "eslint": "8.26.0",
41
41
  "eslint-plugin-vue": "^9.6.0",
42
42
  "gh-pages": "^4.0.0",
43
- "husky": "^8.0.1",
44
43
  "jest": "27.3.1",
45
44
  "lint-staged": "^13.0.2",
46
45
  "postcss": "^8.4.18",
@@ -84,5 +83,10 @@
84
83
  ],
85
84
  "*.{css,vue,tsx}": "stylelint --fix"
86
85
  },
86
+ "husky": {
87
+ "hooks": {
88
+ "pre-commit": "yarn typecheck && yarn lint-staged && yarn test"
89
+ }
90
+ },
87
91
  "license": "MIT"
88
92
  }
package/src/components/ui-card-cta/ui-card-cta.vue CHANGED
@@ -19,6 +19,7 @@
19
19
  :kind="EColors.SECONDARY"
20
20
  :weight="ETextWeight.SEMI_BOLD"
21
21
  class="mb-xxs"
22
+ line-height
22
23
  >
23
24
  <slot name="title" />
24
25
  </ui-typography>
@@ -26,6 +27,7 @@
26
27
  <ui-typography
27
28
  :kind="EColors.SECONDARY_300"
28
29
  :size="ETypographySizes.SM"
30
+ line-height
29
31
  >
30
32
  <slot name="description" />
31
33
  </ui-typography>
package/src/components/ui-icon/index.ts CHANGED
@@ -1,2 +1,3 @@
1
1
  export { default } from "./ui-icon.vue";
2
+ export { ESize } from "../../_types/sizing";
2
3
  export type { TIconName }from "./_typings";
package/src/components/ui-list-item/_types.ts ADDED
@@ -0,0 +1,5 @@
1
+ export enum EListItemTypes {
2
+ DEFAULT = "DEFAULT",
3
+ COMPACT = "COMPACT",
4
+ PROGRESS = "PROGRESS"
5
+ }
package/src/components/ui-list-item/index.ts CHANGED
@@ -1 +1,2 @@
1
1
  export { default } from "./ui-list-item.vue";
2
+ export { EListItemTypes } from "./_types";
package/src/components/ui-list-item/ui-list-item.stories.ts CHANGED
@@ -1,19 +1,21 @@
1
1
  import UiListItem from "./ui-list-item.vue";
2
2
  import type { Story } from "@storybook/vue3";
3
+ import { EListItemTypes } from "./_types";
3
4
 
4
5
  export default {
5
6
  title: "Components/ui-list-item",
6
7
  component: UiListItem,
7
8
  argTypes: {
8
- description: {
9
- control: { type: "text" },
10
- title: "The Element title",
9
+ kind: {
10
+ control: { type: "select" },
11
+ options: Object.values(EListItemTypes),
12
+ description: "The Element title",
11
13
  }
12
14
  },
13
15
  args: {
14
- slot: "some description text: lorem",
15
16
  title: "default text",
16
- }
17
+ kind: EListItemTypes.DEFAULT
18
+ },
17
19
  };
18
20
 
19
21
  type TComponentProps = InstanceType<typeof UiListItem>["$props"];
@@ -23,17 +25,13 @@ const Template: Story<TComponentProps> = (args) => ({
23
25
  setup() {
24
26
  return { args };
25
27
  },
26
- template: `
27
- <ul class="grid gap-sm">
28
- <ui-list-item :icon="['far', 'face-smile']" :title="args.title">
29
- </ui-list-item>
30
- <ui-list-item :icon="['far', 'face-smile']" :title="args.title">
31
- {{args.slot}}
32
- </ui-list-item>
33
- <ui-list-item :icon="['far', 'face-smile']" :title="args.title">
34
- </ui-list-item>
35
- </ul>
36
- `
28
+ template:/*html*/`
29
+ <ul>
30
+ <ui-list-item v-for= "item in 5" :key="item" :icon="['far', 'face-smile']" :title="args.title" :kind="args.kind">
31
+ {{ args.title }}
32
+ </ui-list-item>
33
+ </ul>
34
+ `,
37
35
  });
38
36
 
39
37
  export const Default = Template.bind({});
package/src/components/ui-list-item/ui-list-item.vue CHANGED
@@ -1,36 +1,56 @@
1
+
1
2
  <template>
2
- <li class="ui-icon-list flex">
3
- <ui-icon
4
- v-if="icon"
5
- class="mr-xs"
6
- :size="ESize.SM"
7
- :icon-name="icon"
3
+ <li class="ui-list-item flex gap-xs relative group">
4
+ <div
5
+ v-if="kind===EListItemTypes.PROGRESS"
6
+ class="ui-list-item__line bg-primary-300 h-full absolute w-xxs left-xs -translate-x-2/4 top-sm group-last:hidden"
8
7
  />
8
+ <div
9
+ class="z-0"
10
+ :class="[kind === EListItemTypes.DEFAULT && 'pb-sm',
11
+ kind === EListItemTypes.COMPACT && 'pb-xs',
12
+ kind === EListItemTypes.PROGRESS &&'pb-md']"
13
+ >
14
+ <ui-icon
15
+ v-if="icon"
16
+ :kind="pickKind"
17
+ class="bg-white text-primary"
18
+ :icon-name="icon"
19
+ :size="ESize.SM"
20
+ />
21
+ </div>
9
22
 
10
- <div>
11
- <ui-typography
23
+ <slot>
24
+ <ui-typography
12
25
  :weight="ETextWeight.SEMI_BOLD"
13
26
  >
14
27
  {{ title }}
15
28
  </ui-typography>
16
- <p
17
- v-if="$slots.default"
18
- class="mt-xs"
19
- >
20
- <slot />
21
- </p>
22
- </div>
29
+ </slot>
23
30
  </li>
24
31
  </template>
25
32
 
26
33
  <script lang="ts" setup>
34
+ import { computed } from "vue";
27
35
  import UiIcon, { type TIconName } from "../ui-icon";
28
- import { ESize } from "../../_types/sizing";
29
36
  import UiTypography, { ETextWeight } from "../ui-typography";
37
+ import { ESize } from "../../_types/sizing";
38
+ import { EListItemTypes } from "./_types";
39
+
40
+ const props = withDefaults(defineProps<{
41
+ icon: TIconName;
42
+ title: string;
43
+ kind?:EListItemTypes;
44
+ }>(), {
45
+ kind: EListItemTypes.DEFAULT
46
+ });
30
47
 
31
- defineProps<{
32
- icon?: TIconName;
33
- title?: string;
34
- }>();
48
+ const pickKind = computed(()=>{
49
+ switch(props.kind){
50
+ case EListItemTypes.COMPACT: return EListItemTypes.COMPACT;
51
+ case EListItemTypes.PROGRESS: return EListItemTypes.PROGRESS;
52
+ default: return EListItemTypes.DEFAULT;
53
+ }
54
+ });
35
55
 
36
56
  </script>
package/src/components/ui-order-card/index.ts CHANGED
@@ -1 +1 @@
1
- export { default } from "./ui-order-cards.vue";
1
+ export { default } from "./ui-order-card.vue";
package/src/components/ui-order-card/ui-order-card.vue CHANGED
@@ -28,7 +28,7 @@
28
28
  >
29
29
  <slot name="title" />
30
30
  </ui-typography>
31
-
31
+
32
32
  <ui-typography
33
33
  v-if="$slots.textBody"
34
34
  class="mb-sm p-sm"
@@ -39,7 +39,7 @@
39
39
  :size="ETypographySizes.MD"
40
40
  :weight="ETextWeight.REGULAR"
41
41
  >
42
- <slot name="textBody" />
42
+ <slot name="textBody" />
43
43
  </ui-typography>
44
44
 
45
45
  <ui-typography
@@ -52,7 +52,7 @@
52
52
  :size="ETypographySizes.XXS"
53
53
  :weight="ETextWeight.REGULAR"
54
54
  >
55
- <slot name="footer" />
55
+ <slot name="footer" />
56
56
  </ui-typography>
57
57
  </div>
58
58
  </template>
package/src/components/ui-radio-fancy/index.ts CHANGED
@@ -1 +1 @@
1
- export { default } from "./ui-radio-list-fancy.vue";
1
+ export { default } from "./ui-radio-fancy.vue";
package/src/components/ui-typography/index.ts CHANGED
@@ -1,2 +1,3 @@
1
1
  export { default } from "./ui-typography.vue";
2
2
  export { ETypographySizes, ETextWeight, ETextAlign, ETextTransform } from "./_typings";
3
+ export { EColors } from "../../_types/colors";
package/src/components/ui-typography/ui-typography.vue CHANGED
@@ -73,7 +73,7 @@
73
73
  kind === EColors.SECONDARY_ALT_700 && 'text-secondary-alt-700',
74
74
 
75
75
  weight === ETextWeight.LIGHT && 'font-light',
76
- weight === ETextWeight.REGULAR && 'font-medium',
76
+ weight === ETextWeight.REGULAR && 'font-normal',
77
77
  weight === ETextWeight.SEMI_BOLD && 'font-bold',
78
78
  weight === ETextWeight.BOLD && 'font-black',
79
79
 
package/.husky/pre-commit DELETED
@@ -1,6 +0,0 @@
1
- #!/usr/bin/env sh
2
- . "$(dirname -- "$0")/_/husky.sh"
3
-
4
- yarn lint-staged
5
- yarn typecheck
6
- yarn test