Merge branch 'main' into feat/table

GDSC-Hongik · Oct 16, 2024 · 27be507 · 27be507
2 parents e38e0b1 + 4e38910
commit 27be507
Show file tree

Hide file tree

Showing 63 changed files with 2,634 additions and 87 deletions.
diff --git a/apps/wow-docs/app/page.tsx b/apps/wow-docs/app/page.tsx
@@ -10,6 +10,10 @@ import RadioButton from "wowds-ui/RadioButton";
 import RadioGroup from "wowds-ui/RadioGroup";
 import SearchBar from "wowds-ui/SearchBar";
 import Switch from "wowds-ui/Switch";
+import Tabs from "wowds-ui/Tabs";
+import TabsContent from "wowds-ui/TabsContent";
+import TabsItem from "wowds-ui/TabsItem";
+import TabsList from "wowds-ui/TabsList";
 
 const Home = () => {
   return (
@@ -43,6 +47,22 @@ const Home = () => {
         <Switch label="switch4" value="switch4" />
       </MultiGroup>
       <SearchBar />
+      <Tabs>
+        <TabsList>
+          <TabsItem value="1">첫번째첫번째첫번째첫번째</TabsItem>
+          <TabsItem value="2">두 번째</TabsItem>
+          <TabsItem value="3">세 번쨰</TabsItem>
+        </TabsList>
+        <TabsContent value="1">
+          <span>첫번째 탭</span>
+        </TabsContent>
+        <TabsContent value="2">
+          <span>두번째 탭</span>
+        </TabsContent>
+        <TabsContent value="3">
+          <span>세번째 탭</span>
+        </TabsContent>
+      </Tabs>
     </>
   );
 };

diff --git a/apps/wow-docs/styled-system/tokens/index.js b/apps/wow-docs/styled-system/tokens/index.js
@@ -343,6 +343,10 @@ const tokens = {
     value: 10,
     variable: "var(--z-index-dropdown)",
   },
+  "zIndex.overlay": {
+    value: 9999,
+    variable: "var(--z-index-overlay)",
+  },
   "shadows.blue": {
     value: "0px 4px 8px 0px rgba(16, 43, 74, 0.2)",
     variable: "var(--shadows-blue)",

diff --git a/apps/wow-docs/styled-system/tokens/tokens.d.ts b/apps/wow-docs/styled-system/tokens/tokens.d.ts
@@ -86,6 +86,7 @@ export type Token =
   | "borderWidths.button"
   | "borderWidths.arrow"
   | "zIndex.dropdown"
+  | "zIndex.overlay"
   | "shadows.blue"
   | "shadows.mono"
   | "breakpoints.xs"
@@ -323,7 +324,7 @@ export type RadiusToken = "sm" | "md" | "full";
 
 export type BorderWidthToken = "button" | "arrow";
 
-export type ZIndexToken = "dropdown";
+export type ZIndexToken = "dropdown" | "overlay";
 
 export type ShadowToken = "blue" | "mono";
 

diff --git a/apps/wow-docs/styled-system/types/prop-type.d.ts b/apps/wow-docs/styled-system/types/prop-type.d.ts
@@ -679,7 +679,9 @@ export interface UtilityValues {
     | "body3"
     | "label1"
     | "label2"
-    | "label3";
+    | "label3"
+    | "header1"
+    | "header2";
 }
 
 type WithColorOpacityModifier<T> = T extends string ? `${T}/${string}` : T;

diff --git a/packages/scripts/generateBuildConfig.ts b/packages/scripts/generateBuildConfig.ts
@@ -26,17 +26,22 @@ const excludedComponents = [
   "CollectionContext",
   "DropDownOptionList",
   "pickerComponents",
+  "ToastContext",
 ];
 
+// 추가할 컴포넌트 목록
+const includedComponents = ["useToast"];
+
 const getFilteredComponentFiles = async (directoryPath: string) => {
   const files = await fs.readdir(directoryPath, { recursive: true });
 
   return files.filter(
     (file) =>
-      file.endsWith(".tsx") &&
-      !file.includes("test") &&
-      !file.includes("stories") &&
-      !excludedComponents.some((excluded) => file.includes(excluded))
+      (file.endsWith(".tsx") &&
+        !file.includes("test") &&
+        !file.includes("stories") &&
+        !excludedComponents.some((excluded) => file.includes(excluded))) ||
+      includedComponents.some((included) => file.includes(included))
   );
 };
 

diff --git a/packages/scripts/generateReactComponentFromSvg.ts b/packages/scripts/generateReactComponentFromSvg.ts
@@ -138,7 +138,9 @@ const generateExportFile = async (components: string[]) => {
     )
     .join("\n");
 
-  await fs.writeFile(EXPORT_FILE_PATH, exportFileContent);
+  const resolvedExportFileContent = `export * from "../types/Icon.ts";\n${exportFileContent}`;
+
+  await fs.writeFile(EXPORT_FILE_PATH, resolvedExportFileContent);
 };
 
 (async () => {

diff --git a/packages/wow-icons/CHANGELOG.md b/packages/wow-icons/CHANGELOG.md
@@ -1,5 +1,13 @@
 # wowds-icons
 
+## 0.1.5
+
+### Patch Changes
+
+- 3682ddd: Avatar 컴포넌트를 추가합니다.
+- 185475a: Icon 공통 타입을 내보내기합니다.
+- b7f51d2: Header 컴포넌트를 추가합니다.
+
 ## 0.1.4
 
 ### Patch Changes

diff --git a/packages/wow-icons/package.json b/packages/wow-icons/package.json
@@ -1,6 +1,6 @@
 {
   "name": "wowds-icons",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "",
   "repository": {
     "type": "git",
@@ -16,7 +16,6 @@
     "package.json"
   ],
   "type": "module",
-  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
       "types": "./dist/component/index.d.ts",

diff --git a/packages/wow-icons/src/component/BlueAvatar.tsx b/packages/wow-icons/src/component/BlueAvatar.tsx
@@ -0,0 +1,83 @@
+import { forwardRef } from "react";
+
+import type { IconProps } from "@/types/Icon.ts";
+
+const BlueAvatar = forwardRef<SVGSVGElement, IconProps>(
+  (
+    {
+      className,
+      width = "100",
+      height = "100",
+      viewBox = "0 0 100 100",
+      ...rest
+    },
+    ref
+  ) => {
+    return (
+      <svg
+        aria-label="blue-avatar icon"
+        className={className}
+        fill="none"
+        height={height}
+        ref={ref}
+        viewBox={viewBox}
+        width={width}
+        xmlns="http://www.w3.org/2000/svg"
+        {...rest}
+      >
+        <rect
+          fill="url(#paint0_linear_2077_1337)"
+          height={height}
+          rx="50"
+          width={width}
+        />
+        <circle cx="50" cy="38" fill="#FDE6B2" r="16.25" />
+        <path
+          clipRule="evenodd"
+          d="M51.7811 38.5623C54.4138 38.5623 56.9005 37.9374 59.101 36.8279C60.5332 39.5608 62.719 41.8366 65.3824 43.3794C65.9647 41.7042 66.2812 39.9046 66.2812 38.0311C66.2812 29.0393 58.9919 21.75 50 21.75C44.5407 21.75 39.7089 24.437 36.7551 28.5607C39.213 34.435 45.015 38.5623 51.7811 38.5623Z"
+          fill="#333333"
+          fillRule="evenodd"
+        />
+        <path
+          d="M80.75 85.3481C80.75 93.7773 66.9828 100 50 100C33.0172 100 19.25 93.7773 19.25 85.3481C19.25 76.9189 19.25 58.75 50 58.75C80.75 58.75 80.75 76.9189 80.75 85.3481Z"
+          fill="url(#paint1_linear_2077_1337)"
+        />
+        <path
+          d="M83.713 45.4844C84.5605 45.6642 85.196 46.3693 85.2869 47.231L85.7765 51.8725C85.8674 52.7342 85.3931 53.5564 84.6017 53.9091L80.3387 55.8091C79.5473 56.1619 78.6188 55.9649 78.0387 55.3212L74.9144 51.8539C74.3344 51.2103 74.2348 50.2663 74.6677 49.5158L76.9998 45.4729C77.4327 44.7223 78.2997 44.3359 79.1473 44.5158L83.713 45.4844Z"
+          fill="#FDDD99"
+        />
+        <path
+          d="M22.4841 24.9364L21.6965 31.3307L27.8889 29.8728L22.8833 33.8833L28.2253 37.2844L21.9338 36.5616L23.2961 42.8293L19.4043 37.7968L15.9889 43.2596L16.7765 36.8653L10.584 38.3231L15.5897 34.3127L10.2477 30.9116L16.5392 31.6344L15.1769 25.3666L19.0686 30.3992L22.4841 24.9364Z"
+          fill="#FBBC04"
+        />
+        <defs>
+          <linearGradient
+            gradientUnits="userSpaceOnUse"
+            id="paint0_linear_2077_1337"
+            x1="50"
+            x2="50"
+            y1="0"
+            y2="100"
+          >
+            <stop stopColor="#368FF7" />
+            <stop offset="1" stopColor="#205694" />
+          </linearGradient>
+          <linearGradient
+            gradientUnits="userSpaceOnUse"
+            id="paint1_linear_2077_1337"
+            x1="50"
+            x2="50"
+            y1="58.75"
+            y2="100"
+          >
+            <stop stopColor="#AFD2FC" />
+            <stop offset="1" stopColor="#4792EE" />
+          </linearGradient>
+        </defs>
+      </svg>
+    );
+  }
+);
+
+BlueAvatar.displayName = "BlueAvatar";
+export default BlueAvatar;
diff --git a/packages/wow-icons/src/component/GdscLogo.tsx b/packages/wow-icons/src/component/GdscLogo.tsx
@@ -0,0 +1,51 @@
+import { forwardRef } from "react";
+
+import type { IconProps } from "@/types/Icon.ts";
+
+const GdscLogo = forwardRef<SVGSVGElement, IconProps>(
+  (
+    { className, width = "49", height = "24", viewBox = "0 0 49 24", ...rest },
+    ref
+  ) => {
+    return (
+      <svg
+        aria-label="gdsc-logo icon"
+        className={className}
+        fill="none"
+        height={height}
+        ref={ref}
+        viewBox={viewBox}
+        width={width}
+        xmlns="http://www.w3.org/2000/svg"
+        {...rest}
+      >
+        <g clipPath="url(#clip0_2093_1197)">
+          <path
+            d="M11.6948 12.0594L19.6432 7.40217C21.5086 6.3148 22.1575 3.89388 21.0828 1.98586C20.0082 0.0778397 17.6155 0.558167 15.7298 0.529199L1.98242 8.55108L11.6948 12.0594Z"
+            fill="#EA4335"
+          />
+          <path
+            d="M17.6764 23.9997C19.0349 23.9997 20.3529 23.2816 21.0625 22.0096C22.1372 20.1221 21.5086 17.7012 19.6229 16.5933L5.87549 8.57144C4.01006 7.48407 1.61744 8.12008 0.522517 10.0281C0.552134 11.9156 0.0764355 14.3365 1.96214 15.4444L15.7096 23.4663C16.3381 23.8151 17.0275 23.9997 17.6764 23.9997Z"
+            fill="#4285F4"
+          />
+          <path
+            d="M31.3633 23.9999C32.0324 23.9999 32.7015 23.8358 33.3098 23.4665L47.0572 15.4446L37.4867 11.8953L29.4167 16.614C27.5513 17.7014 26.9024 20.1223 27.9771 22.0303C28.6868 23.2818 30.0047 23.9999 31.3633 23.9999Z"
+            fill="#FBBC04"
+          />
+          <path
+            d="M45.0897 15.9572C46.4482 15.9572 47.7662 15.2392 48.4758 13.9877C49.5505 12.1002 48.9219 9.67923 47.0362 8.57135L33.3091 0.549463C31.4437 0.537903 29.051 0.0981031 27.9561 2.00612C26.8815 3.89362 27.51 6.31455 29.3957 7.42243L43.1431 15.4443C43.7514 15.7931 44.4206 15.9572 45.0897 15.9572Z"
+            fill="#0F9D58"
+          />
+        </g>
+        <defs>
+          <clipPath id="clip0_2093_1197">
+            <rect fill="white" height={height} width={width} />
+          </clipPath>
+        </defs>
+      </svg>
+    );
+  }
+);
+
+GdscLogo.displayName = "GdscLogo";
+export default GdscLogo;
diff --git a/packages/wow-icons/src/component/GreenAvatar.tsx b/packages/wow-icons/src/component/GreenAvatar.tsx
@@ -0,0 +1,87 @@
+import { forwardRef } from "react";
+
+import type { IconProps } from "@/types/Icon.ts";
+
+const GreenAvatar = forwardRef<SVGSVGElement, IconProps>(
+  (
+    {
+      className,
+      width = "100",
+      height = "100",
+      viewBox = "0 0 100 100",
+      ...rest
+    },
+    ref
+  ) => {
+    return (
+      <svg
+        aria-label="green-avatar icon"
+        className={className}
+        fill="none"
+        height={height}
+        ref={ref}
+        viewBox={viewBox}
+        width={width}
+        xmlns="http://www.w3.org/2000/svg"
+        {...rest}
+      >
+        <rect
+          fill="url(#paint0_linear_2077_1371)"
+          height={height}
+          rx="50"
+          width={width}
+        />
+        <circle cx="50" cy="38" fill="#FBD9D7" r="16.25" />
+        <path
+          clipRule="evenodd"
+          d="M52.2938 37.6293C53.6522 35.3743 54.4002 32.9218 54.5853 30.4644C57.5936 30.6435 60.5993 29.9819 63.2495 28.567C60.2961 24.4398 55.4622 21.75 50.0001 21.75C41.0083 21.75 33.719 29.0393 33.719 38.0311C33.719 40.6215 34.3239 43.0705 35.4002 45.2447C41.874 46.4349 48.6964 43.6009 52.2938 37.6293Z"
+          fill="#333333"
+          fillRule="evenodd"
+        />
+        <path
+          d="M80.75 85.3481C80.75 93.7773 66.9828 100 50 100C33.0172 100 19.25 93.7773 19.25 85.3481C19.25 76.9189 19.25 58.75 50 58.75C80.75 58.75 80.75 76.9189 80.75 85.3481Z"
+          fill="url(#paint1_linear_2077_1371)"
+        />
+        <path
+          clipRule="evenodd"
+          d="M32.0455 22.6619C31.8224 18.3739 34.9923 14.6123 39.3133 14.1527C42.3354 13.8313 45.1467 15.2073 46.7978 17.5138C47.7723 16.6429 49.0193 16.0585 50.4181 15.9097C53.9686 15.5321 57.1529 18.1042 57.5305 21.6547C57.9082 25.2052 55.336 28.3895 51.7856 28.7672C49.8575 28.9722 48.0374 28.3074 46.7161 27.0884C45.8876 28.2071 44.7754 29.1123 43.4722 29.6894C43.6953 33.9774 40.5253 37.7391 36.2043 38.1987C31.7344 38.674 27.7255 35.4359 27.2501 30.966C26.8667 27.3606 28.8993 24.0551 32.0455 22.6619Z"
+          fill="#333333"
+          fillRule="evenodd"
+        />
+        <path
+          d="M35.5136 77.6081C36.7352 79.7082 41.4661 84.2361 50.6169 85.5459C62.0554 87.1831 68.9184 79.3259 64.4424 72.2613C59.9664 65.1968 49.934 69.4345 49.9928 75.8325C50.0516 82.2304 57.973 90.4744 71.9175 83.2493C83.0731 77.4693 85.1063 64.9172 84.7285 59.3637"
+          stroke="#EA4335"
+          strokeLinecap="round"
+          strokeWidth="2.1"
+        />
+        <defs>
+          <linearGradient
+            gradientUnits="userSpaceOnUse"
+            id="paint0_linear_2077_1371"
+            x1="50"
+            x2="50"
+            y1="0"
+            y2="100"
+          >
+            <stop stopColor="#34A853" />
+            <stop offset="1" stopColor="#1F6532" />
+          </linearGradient>
+          <linearGradient
+            gradientUnits="userSpaceOnUse"
+            id="paint1_linear_2077_1371"
+            x1="50"
+            x2="50"
+            y1="58.75"
+            y2="100"
+          >
+            <stop stopColor="#C2E5CB" />
+            <stop offset="1" stopColor="#5DB975" />
+          </linearGradient>
+        </defs>
+      </svg>
+    );
+  }
+);
+
+GreenAvatar.displayName = "GreenAvatar";
+export default GreenAvatar;