Feat/bold-counter-icon

.changeset/forty-maps-attend.md

@@ -0,0 +1,8 @@
+---
+"@wizleap-inc/wiz-ui-react": minor
+"@wizleap-inc/wiz-ui-next": minor
+"@wizleap-inc/wiz-ui-constants": minor
+"@wizleap-inc/wiz-ui-icons": minor
+---
+
+Feat(icon): filled counter

packages/constants/component/icon-name.ts

@@ -38,14 +38,23 @@ export const IconComponentName = {
   IContactPageFilled: "WizIContactPageFilled",
   IContentCopy: "WizIContentCopy",
   IContract: "WizIContract",
+  ICounter1Filled: "WizICounter1Filled",
   ICounter1: "WizICounter1",
+  ICounter2Filled: "WizICounter2Filled",
   ICounter2: "WizICounter2",
+  ICounter3Filled: "WizICounter3Filled",
   ICounter3: "WizICounter3",
+  ICounter4Filled: "WizICounter4Filled",
   ICounter4: "WizICounter4",
+  ICounter5Filled: "WizICounter5Filled",
   ICounter5: "WizICounter5",
+  ICounter6Filled: "WizICounter6Filled",
   ICounter6: "WizICounter6",
+  ICounter7Filled: "WizICounter7Filled",
   ICounter7: "WizICounter7",
+  ICounter8Filled: "WizICounter8Filled",
   ICounter8: "WizICounter8",
+  ICounter9Filled: "WizICounter9Filled",
   ICounter9: "WizICounter9",
   IDashboard: "WizIDashboard",
   IDelete: "WizIDelete",

packages/wiz-ui-next/src/components/icons/counter-1-filled.vue

@@ -0,0 +1,20 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path
+      d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm-20-520v280q0 17 11.5 28.5T500-280q17 0 28.5-11.5T540-320v-320q0-17-11.5-28.5T500-680h-80q-17 0-28.5 11.5T380-640q0 17 11.5 28.5T420-600h40Z"
+    />
+  </svg>
+</template>
+
+<script setup lang="ts">
+import { ComponentName } from "@wizleap-inc/wiz-ui-constants";
+
+defineOptions({
+  name: ComponentName.ICounter1Filled,
+});
+</script>

packages/wiz-ui-next/src/components/icons/counter-2-filled.vue

@@ -0,0 +1,20 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path
+      d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm80-200q17 0 28.5-11.5T600-320q0-17-11.5-28.5T560-360H440v-80h80q33 0 56.5-23.5T600-520v-80q0-33-23.5-56.5T520-680H400q-17 0-28.5 11.5T360-640q0 17 11.5 28.5T400-600h120v80h-80q-33 0-56.5 23.5T360-440v120q0 17 11.5 28.5T400-280h160Z"
+    />
+  </svg>
+</template>
+
+<script setup lang="ts">
+import { ComponentName } from "@wizleap-inc/wiz-ui-constants";
+
+defineOptions({
+  name: ComponentName.ICounter2Filled,
+});
+</script>

packages/wiz-ui-next/src/components/icons/counter-3-filled.vue

@@ -0,0 +1,20 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path
+      d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm-80-200h120q33 0 56.5-23.5T600-360v-60q0-26-17-43t-43-17q26 0 43-17t17-43v-60q0-33-23.5-56.5T520-680H400q-17 0-28.5 11.5T360-640q0 17 11.5 28.5T400-600h120v80h-40q-17 0-28.5 11.5T440-480q0 17 11.5 28.5T480-440h40v80H400q-17 0-28.5 11.5T360-320q0 17 11.5 28.5T400-280Z"
+    />
+  </svg>
+</template>
+
+<script setup lang="ts">
+import { ComponentName } from "@wizleap-inc/wiz-ui-constants";
+
+defineOptions({
+  name: ComponentName.ICounter3Filled,
+});
+</script>

packages/wiz-ui-next/src/components/icons/counter-4-filled.vue

@@ -0,0 +1,20 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path
+      d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm40-360v120q0 17 11.5 28.5T560-280q17 0 28.5-11.5T600-320v-320q0-17-11.5-28.5T560-680q-17 0-28.5 11.5T520-640v120h-80v-120q0-17-11.5-28.5T400-680q-17 0-28.5 11.5T360-640v160q0 17 11.5 28.5T400-440h120Z"
+    />
+  </svg>
+</template>
+
+<script setup lang="ts">
+import { ComponentName } from "@wizleap-inc/wiz-ui-constants";
+
+defineOptions({
+  name: ComponentName.ICounter4Filled,
+});
+</script>

packages/wiz-ui-next/src/components/icons/counter-5-filled.vue

@@ -0,0 +1,20 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path
+      d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm-80-200h120q33 0 56.5-23.5T600-360v-80q0-33-23.5-56.5T520-520h-80v-80h120q17 0 28.5-11.5T600-640q0-17-11.5-28.5T560-680H400q-17 0-28.5 11.5T360-640v160q0 17 11.5 28.5T400-440h120v80H400q-17 0-28.5 11.5T360-320q0 17 11.5 28.5T400-280Z"
+    />
+  </svg>
+</template>
+
+<script setup lang="ts">
+import { ComponentName } from "@wizleap-inc/wiz-ui-constants";
+
+defineOptions({
+  name: ComponentName.ICounter5Filled,
+});
+</script>

packages/wiz-ui-next/src/components/icons/counter-6-filled.vue

@@ -0,0 +1,20 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path
+      d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm-40-200h80q33 0 56.5-23.5T600-360v-80q0-33-23.5-56.5T520-520h-80v-80h80q17 0 28.5-11.5T560-640q0-17-11.5-28.5T520-680h-80q-33 0-56.5 23.5T360-600v240q0 33 23.5 56.5T440-280Zm0-160h80v80h-80v-80Z"
+    />
+  </svg>
+</template>
+
+<script setup lang="ts">
+import { ComponentName } from "@wizleap-inc/wiz-ui-constants";
+
+defineOptions({
+  name: ComponentName.ICounter6Filled,
+});
+</script>

packages/wiz-ui-next/src/components/icons/counter-7-filled.vue

@@ -0,0 +1,20 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path
+      d="m520-600-68 272q-5 18 7 33t31 15q14 0 24-8t13-21l71-281q2-5 2-9v-9q0-29-20.5-50.5T530-680H400q-17 0-28.5 11.5T360-640q0 17 11.5 28.5T400-600h120ZM480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Z"
+    />
+  </svg>
+</template>
+
+<script setup lang="ts">
+import { ComponentName } from "@wizleap-inc/wiz-ui-constants";
+
+defineOptions({
+  name: ComponentName.ICounter7Filled,
+});
+</script>

packages/wiz-ui-next/src/components/icons/counter-8-filled.vue

@@ -0,0 +1,20 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path
+      d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm-40-200h80q33 0 56.5-23.5T600-360v-60q0-25-17.5-42.5T540-480q25 0 42.5-17.5T600-540v-60q0-33-23.5-56.5T520-680h-80q-33 0-56.5 23.5T360-600v60q0 25 17.5 42.5T420-480q-25 0-42.5 17.5T360-420v60q0 33 23.5 56.5T440-280Zm0-320h80v80h-80v-80Zm0 240v-80h80v80h-80Z"
+    />
+  </svg>
+</template>
+
+<script setup lang="ts">
+import { ComponentName } from "@wizleap-inc/wiz-ui-constants";
+
+defineOptions({
+  name: ComponentName.ICounter8Filled,
+});
+</script>

packages/wiz-ui-next/src/components/icons/counter-9-filled.vue

@@ -0,0 +1,20 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path
+      d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm-40-200h80q33 0 56.5-23.5T600-360v-240q0-33-23.5-56.5T520-680h-80q-33 0-56.5 23.5T360-600v80q0 33 23.5 56.5T440-440h80v80h-80q-17 0-28.5 11.5T400-320q0 17 11.5 28.5T440-280Zm80-240h-80v-80h80v80Z"
+    />
+  </svg>
+</template>
+
+<script setup lang="ts">
+import { ComponentName } from "@wizleap-inc/wiz-ui-constants";
+
+defineOptions({
+  name: ComponentName.ICounter9Filled,
+});
+</script>

packages/wiz-ui-next/src/components/icons/index.ts

@@ -37,14 +37,23 @@ import { default as WizICloudUpload } from "./cloud-upload.vue";
 import { default as WizIContactPageFilled } from "./contact-page-filled.vue";
 import { default as WizIContentCopy } from "./content-copy.vue";
 import { default as WizIContract } from "./contract.vue";
+import { default as WizICounter1Filled } from "./counter-1-filled.vue";
 import { default as WizICounter1 } from "./counter-1.vue";
+import { default as WizICounter2Filled } from "./counter-2-filled.vue";
 import { default as WizICounter2 } from "./counter-2.vue";
+import { default as WizICounter3Filled } from "./counter-3-filled.vue";
 import { default as WizICounter3 } from "./counter-3.vue";
+import { default as WizICounter4Filled } from "./counter-4-filled.vue";
 import { default as WizICounter4 } from "./counter-4.vue";
+import { default as WizICounter5Filled } from "./counter-5-filled.vue";
 import { default as WizICounter5 } from "./counter-5.vue";
+import { default as WizICounter6Filled } from "./counter-6-filled.vue";
 import { default as WizICounter6 } from "./counter-6.vue";
+import { default as WizICounter7Filled } from "./counter-7-filled.vue";
 import { default as WizICounter7 } from "./counter-7.vue";
+import { default as WizICounter8Filled } from "./counter-8-filled.vue";
 import { default as WizICounter8 } from "./counter-8.vue";
+import { default as WizICounter9Filled } from "./counter-9-filled.vue";
 import { default as WizICounter9 } from "./counter-9.vue";
 import { default as WizIDashboard } from "./dashboard.vue";
 import { default as WizIDelete } from "./delete.vue";
@@ -148,14 +157,23 @@ export type TIcon =
   | typeof WizIContactPageFilled
   | typeof WizIContentCopy
   | typeof WizIContract
+  | typeof WizICounter1Filled
   | typeof WizICounter1
+  | typeof WizICounter2Filled
   | typeof WizICounter2
+  | typeof WizICounter3Filled
   | typeof WizICounter3
+  | typeof WizICounter4Filled
   | typeof WizICounter4
+  | typeof WizICounter5Filled
   | typeof WizICounter5
+  | typeof WizICounter6Filled
   | typeof WizICounter6
+  | typeof WizICounter7Filled
   | typeof WizICounter7
+  | typeof WizICounter8Filled
   | typeof WizICounter8
+  | typeof WizICounter9Filled
   | typeof WizICounter9
   | typeof WizIDashboard
   | typeof WizIDelete
@@ -259,14 +277,23 @@ export {
   WizIContactPageFilled,
   WizIContentCopy,
   WizIContract,
+  WizICounter1Filled,
   WizICounter1,
+  WizICounter2Filled,
   WizICounter2,
+  WizICounter3Filled,
   WizICounter3,
+  WizICounter4Filled,
   WizICounter4,
+  WizICounter5Filled,
   WizICounter5,
+  WizICounter6Filled,
   WizICounter6,
+  WizICounter7Filled,
   WizICounter7,
+  WizICounter8Filled,
   WizICounter8,
+  WizICounter9Filled,
   WizICounter9,
   WizIDashboard,
   WizIDelete,

packages/wiz-ui-react/src/components/icons/counter-1-filled.tsx

@@ -0,0 +1,18 @@
+import { CSSProperties } from "react";
+type Props = {
+  className?: string;
+  style?: CSSProperties;
+};
+export const WizICounter1Filled = ({ className, style }: Props) => (
+  <svg
+    className={className}
+    style={style}
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm-20-520v280q0 17 11.5 28.5T500-280q17 0 28.5-11.5T540-320v-320q0-17-11.5-28.5T500-680h-80q-17 0-28.5 11.5T380-640q0 17 11.5 28.5T420-600h40Z" />
+  </svg>
+);
+WizICounter1Filled.displayName = "WizICounter1Filled";

packages/wiz-ui-react/src/components/icons/counter-2-filled.tsx

@@ -0,0 +1,18 @@
+import { CSSProperties } from "react";
+type Props = {
+  className?: string;
+  style?: CSSProperties;
+};
+export const WizICounter2Filled = ({ className, style }: Props) => (
+  <svg
+    className={className}
+    style={style}
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm80-200q17 0 28.5-11.5T600-320q0-17-11.5-28.5T560-360H440v-80h80q33 0 56.5-23.5T600-520v-80q0-33-23.5-56.5T520-680H400q-17 0-28.5 11.5T360-640q0 17 11.5 28.5T400-600h120v80h-80q-33 0-56.5 23.5T360-440v120q0 17 11.5 28.5T400-280h160Z" />
+  </svg>
+);
+WizICounter2Filled.displayName = "WizICounter2Filled";

packages/wiz-ui-react/src/components/icons/counter-3-filled.tsx

@@ -0,0 +1,18 @@
+import { CSSProperties } from "react";
+type Props = {
+  className?: string;
+  style?: CSSProperties;
+};
+export const WizICounter3Filled = ({ className, style }: Props) => (
+  <svg
+    className={className}
+    style={style}
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm-80-200h120q33 0 56.5-23.5T600-360v-60q0-26-17-43t-43-17q26 0 43-17t17-43v-60q0-33-23.5-56.5T520-680H400q-17 0-28.5 11.5T360-640q0 17 11.5 28.5T400-600h120v80h-40q-17 0-28.5 11.5T440-480q0 17 11.5 28.5T480-440h40v80H400q-17 0-28.5 11.5T360-320q0 17 11.5 28.5T400-280Z" />
+  </svg>
+);
+WizICounter3Filled.displayName = "WizICounter3Filled";

packages/wiz-ui-react/src/components/icons/counter-4-filled.tsx

@@ -0,0 +1,18 @@
+import { CSSProperties } from "react";
+type Props = {
+  className?: string;
+  style?: CSSProperties;
+};
+export const WizICounter4Filled = ({ className, style }: Props) => (
+  <svg
+    className={className}
+    style={style}
+    xmlns="http://www.w3.org/2000/svg"
+    height="1em"
+    viewBox="0 -960 960 960"
+    width="1em"
+  >
+    <path d="M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm40-360v120q0 17 11.5 28.5T560-280q17 0 28.5-11.5T600-320v-320q0-17-11.5-28.5T560-680q-17 0-28.5 11.5T520-640v120h-80v-120q0-17-11.5-28.5T400-680q-17 0-28.5 11.5T360-640v160q0 17 11.5 28.5T400-440h120Z" />
+  </svg>
+);
+WizICounter4Filled.displayName = "WizICounter4Filled";