release: 지원 버튼 변경 및 일부 문구 수정

.changeset/README.md

@@ -0,0 +1,8 @@
+# Changesets
+
+Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works
+with multi-package repos, or single-package repos to help you version and publish your code. You can
+find the full documentation for it [in our repository](https://github.com/changesets/changesets)
+
+We have a quick list of common questions to get you started engaging with this project in
+[our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md)

.changeset/config.json

@@ -0,0 +1,11 @@
+{
+  "$schema": "https://unpkg.com/@changesets/config@3.1.2/schema.json",
+  "changelog": "@changesets/cli/changelog",
+  "commit": false,
+  "fixed": [],
+  "linked": [],
+  "access": "restricted",
+  "baseBranch": "dev",
+  "updateInternalDependencies": "patch",
+  "ignore": []
+}

.github/workflows/jds.yml

@@ -0,0 +1,47 @@
+name: Release JDS Package
+
+on:
+  push:
+    branches:
+      - dev
+      - 'refactor/jds'
+    paths:
+      - 'packages/jds/**'
+      - '.changeset/**'
+
+concurrency: ${{ github.workflow }}-${{ github.ref }}
+
+jobs:
+  release:
+    name: Release JDS
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      pull-requests: write
+
+    steps:
+      - name: Checkout Repository
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+          cache: 'npm'
+
+      - name: Install Dependencies
+        run: npm ci
+
+      - name: Build JDS Only
+        run: npm run build --workspace=@jects/jds
+
+      - name: Publish to NPM
+        id: changesets
+        uses: changesets/action@v1
+        with:
+          publish: npx changeset publish
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

apps/web/CHANGELOG.md

@@ -0,0 +1,15 @@
+# ject-official-website-client
+
+## 0.0.1
+
+### Patch Changes
+
+- Updated dependencies [050b727]
+  - @jects/jds@0.0.1
+
+## 0.0.1-next.0
+
+### Patch Changes
+
+- Updated dependencies [050b727]
+  - @ject/jds@1.0.0-next.0

apps/web/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ject-official-website-client",
   "private": true,
-  "version": "0.0.0",
+  "version": "0.0.1",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -20,7 +20,7 @@
     "@emotion/react": "^11",
     "@emotion/styled": "^11",
     "@hookform/resolvers": "^4.1.3",
-    "@ject/jds": "*",
+    "@jects/jds": "0.0.1",
     "@sentry/react": "^9.12.0",
     "@sentry/vite-plugin": "^3.3.1",
     "@tailwindcss/vite": "^4.0.0",
@@ -35,7 +35,7 @@
     "react": "^18.3.1",
     "react-device-detect": "^2.2.3",
     "react-dom": "^18.3.1",
-    "react-error-boundary": "^6.0.0",
+    "react-error-boundary": "6.0.0",
     "react-hook-form": "^7.54.2",
     "react-router-dom": "^7.1.5",
     "tailwindcss": "^4.0.0",

apps/web/src/App.tsx

@@ -1,7 +1,7 @@
 import "./instrument";
 
-import { ToastProvider } from "@ject/jds";
-import { JDSThemeProvider } from "@ject/jds/theme";
+import { ToastProvider } from "@jects/jds";
+import { JDSThemeProvider } from "@jects/jds/theme";
 import { MutationCache, QueryCache, QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
 import { Suspense, useState } from "react";

apps/web/src/apis/apply/schemas.ts

@@ -85,6 +85,7 @@ export const questionSchema = z.object({
   inputType: questionInputTypeSchema,
   isRequired: z.boolean(),
   title: z.string(),
+  subtitle: z.string().nullable(),
   label: z.string(),
   selectOptions: z.array(z.string()).nullable(),
   inputHint: z.string(),

apps/web/src/components/common/footer/Footer.tsx

@@ -1,4 +1,4 @@
-import { Footer as FooterJds, Logo } from "@ject/jds";
+import { Footer as FooterJds, Logo } from "@jects/jds";
 
 function Footer() {
   return (

apps/web/src/components/gnb/GlobalNavigationBar.tsx

@@ -5,8 +5,8 @@ import {
   Logo,
   SegmentedControl,
   useGlobalNavigationVariant,
-} from "@ject/jds";
-import { useMediaQueryFlags } from "@ject/jds/hooks";
+} from "@jects/jds";
+import { useMediaQueryFlags } from "@jects/jds/hooks";
 import type { MouseEvent } from "react";
 import { useState } from "react";
 import { useNavigate, useLocation } from "react-router-dom";

apps/web/src/components/gnb/Menus.tsx

@@ -1,4 +1,4 @@
-import { MegaMenu, MenuItem } from "@ject/jds";
+import { MegaMenu, MenuItem } from "@jects/jds";
 import type { MouseEvent } from "react";
 import { useNavigate } from "react-router-dom";
 

apps/web/src/components/gnb/Sidebar.tsx

@@ -1,4 +1,4 @@
-import { Divider, IconButton, Label, MenuItem } from "@ject/jds";
+import { Divider, IconButton, Label, MenuItem } from "@jects/jds";
 import type { Dispatch, MouseEvent, SetStateAction } from "react";
 import { useEffect } from "react";
 import { createPortal } from "react-dom";

apps/web/src/components/layout/ApplyLayout.tsx

@@ -1,4 +1,4 @@
-import { BlockButton, LabelButton } from "@ject/jds";
+import { BlockButton, LabelButton } from "@jects/jds";
 import type { FallbackProps } from "react-error-boundary";
 import { Outlet, useNavigate } from "react-router-dom";
 

apps/web/src/components/main/sections/CycleSection.tsx

@@ -1,4 +1,4 @@
-import { Banner } from "@ject/jds";
+import { Banner } from "@jects/jds";
 
 import cycleVisionBannerImage from "@/assets/images/cycle-vision-banner.png";
 
@@ -9,7 +9,9 @@ const CycleSection = () => {
         src={cycleVisionBannerImage}
         isReadonly
         title={"IT 생태계의\n선순환을 목표로 하는 젝트"}
-        subtitle={"사적인 이윤을 추구하지 않고,\n발생한 수익은 운영과 구성원을 위한 인프라에 재투자합니다."}
+        subtitle={
+          "사적인 이윤을 추구하지 않고,\n발생한 수익은 운영과 구성원을 위한 인프라에 재투자합니다."
+        }
       />
     </section>
   );

apps/web/src/components/main/sections/HeroSection.tsx

@@ -1,4 +1,4 @@
-import { Hero, Icon, Label } from "@ject/jds";
+import { Hero, Icon, Label } from "@jects/jds";
 import { useEffect, useState } from "react";
 
 import heroBackground from "@/assets/images/hero-background.png";
@@ -23,7 +23,7 @@ const RotatingText = () => {
 
   useEffect(() => {
     const interval = setInterval(() => {
-      setCurrentIndex((prev) => prev + 1);
+      setCurrentIndex(prev => prev + 1);
     }, ANIMATION_CYCLE_MS);
     return () => clearInterval(interval);
   }, []);
@@ -49,17 +49,17 @@ const RotatingText = () => {
   }, [currentIndex, isTransitioning]);
 
   return (
-    <span className="inline-flex h-[1.2em] overflow-hidden align-middle">
+    <span className='inline-flex h-[1.2em] overflow-hidden align-middle'>
       <span
-        className="flex flex-col ease-(--semantic-motion-bouncy)"
+        className='flex flex-col ease-(--semantic-motion-bouncy)'
         style={{
           transform: `translateY(-${currentIndex * 100}%)`,
           transition: isTransitioning ? `transform ${ANIMATION_DURATION_MS}ms` : "none",
         }}
       >
         {extendedItems.map((item, index) => (
-          <span key={index} className="flex h-[1.2em] items-center justify-center gap-2">
-            <Icon name={item.icon} size="4xl" color="currentColor" />
+          <span key={index} className='flex h-[1.2em] items-center justify-center gap-2'>
+            <Icon name={item.icon} size='4xl' color='currentColor' />
             <span>{item.text}</span>
           </span>
         ))}
@@ -89,19 +89,19 @@ const HeroSection = () => {
       <div
         className='absolute inset-0 z-2'
         style={{
-          background: "linear-gradient(180deg, transparent 0%, transparent 50%, var(--semantic-surface-static-inverse-standard) 100%)",
+          background:
+            "linear-gradient(180deg, transparent 0%, transparent 50%, var(--semantic-surface-static-inverse-standard) 100%)",
         }}
       />
 
       <div className='relative z-10 flex h-full flex-col items-center justify-center'>
         <div
           style={{
-            background:
-              "radial-gradient(33.77% 43.9% at 50% 50%, #191B2480 0%, #191B2400 100%)",
+            background: "radial-gradient(33.77% 43.9% at 50% 50%, #191B2480 0%, #191B2400 100%)",
           }}
         >
           <Hero size='xs' textAlign='center' color='white'>
-            <span className="flex flex-col items-center">
+            <span className='flex flex-col items-center'>
               <span>젝트에서</span>
               <RotatingText />
               <span>경험해보세요.</span>

apps/web/src/components/main/sections/IntroSection.tsx

@@ -1,16 +1,30 @@
-import { Callout, ContentBadge, EmptyState, Hero, Icon, Image, Label, LabelButton, Title as JdsTitle } from "@ject/jds";
+import {
+  Callout,
+  ContentBadge,
+  EmptyState,
+  Hero,
+  Icon,
+  Image,
+  Label,
+  LabelButton,
+  Title as JdsTitle,
+} from "@jects/jds";
 import { useNavigate } from "react-router-dom";
 
 import introTeamMeetingImage from "@/assets/images/intro-team-meeting.png";
 import { positionData, programData, statData } from "@/constants/mainPageData";
 
-const wrapperClassName = "gap-(--semantic-spacing-48) flex w-full max-w-[922px] flex-col items-start";
+const wrapperClassName =
+  "gap-(--semantic-spacing-48) flex w-full max-w-[922px] flex-col items-start";
 
 const positionCardStyles = {
-  green: "bg-[var(--semantic-theme-green-alpha-subtlest)] border-[var(--semantic-theme-green-alpha-subtler)]",
+  green:
+    "bg-[var(--semantic-theme-green-alpha-subtlest)] border-[var(--semantic-theme-green-alpha-subtler)]",
   sky: "bg-[var(--semantic-theme-sky-alpha-subtlest)] border-[var(--semantic-theme-sky-alpha-subtler)]",
-  orange: "bg-[var(--semantic-theme-orange-alpha-subtlest)] border-[var(--semantic-theme-orange-alpha-subtler)]",
-  purple: "bg-[var(--semantic-theme-purple-alpha-subtlest)] border-[var(--semantic-theme-purple-alpha-subtler)]",
+  orange:
+    "bg-[var(--semantic-theme-orange-alpha-subtlest)] border-[var(--semantic-theme-orange-alpha-subtler)]",
+  purple:
+    "bg-[var(--semantic-theme-purple-alpha-subtlest)] border-[var(--semantic-theme-purple-alpha-subtler)]",
 } as const;
 
 const IntroSection = () => {
@@ -33,7 +47,9 @@ const IntroSection = () => {
 
           <div className='flex flex-col items-start gap-(--semantic-spacing-40)'>
             <div className='flex flex-col items-start gap-(--semantic-spacing-24)'>
-              <Hero size='xs' textAlign='left'>IT 동아리 젝트</Hero>
+              <Hero size='xs' textAlign='left'>
+                IT 동아리 젝트
+              </Hero>
               <div className='flex flex-col gap-(--semantic-spacing-8)'>
                 <p className='body-lg font-(--primitive-font-weight-body-bold) text-(--semantic-object-normal)'>
                   젝트는 개발, 기획(매니지먼트), 디자인 관련 포지션의 팀원들이 한 팀이 되어 실제
@@ -47,22 +63,22 @@ const IntroSection = () => {
             </div>
 
             <div className='flex w-full flex-col gap-(--semantic-spacing-10)'>
-              <div className='grid w-full grid-cols-1 gap-(--semantic-spacing-16) tablet:grid-cols-2 desktop:grid-cols-3'>
+              <div className='tablet:grid-cols-2 desktop:grid-cols-3 grid w-full grid-cols-1 gap-(--semantic-spacing-16)'>
                 {statData.map(({ id, title, description, isFullWidth }) => (
                   <Callout.Basic
                     key={id}
                     hierarchy='primary'
                     variant='hint'
                     size='lg'
                     title={title}
-                    className={isFullWidth ? 'tablet:col-span-2 desktop:col-span-1' : undefined}
+                    className={isFullWidth ? "tablet:col-span-2 desktop:col-span-1" : undefined}
                   >
                     {description}
                   </Callout.Basic>
                 ))}
               </div>
               <Label as='span' size='sm' weight='normal' color='var(--semantic-object-assistive)'>
-                *현 3기 기준, 진행 완료 및 진행중 프로젝트 포함.
+                *현 4기 기준, 진행 완료 및 진행중 프로젝트 포함.
               </Label>
             </div>
 
@@ -79,13 +95,15 @@ const IntroSection = () => {
 
         {/* 다양한 포지션들이 젝트와 함께합니다 */}
         <div className={wrapperClassName}>
-          <Hero size='xs' textAlign='left'>다양한 포지션들이 젝트와 함께합니다</Hero>
+          <Hero size='xs' textAlign='left'>
+            다양한 포지션들이 젝트와 함께합니다
+          </Hero>
 
-          <div className='grid w-full grid-cols-1 gap-(--semantic-spacing-16) tablet:grid-cols-2'>
+          <div className='tablet:grid-cols-2 grid w-full grid-cols-1 gap-(--semantic-spacing-16)'>
             {positionData.map(({ id, title, icon, description, tags, themeColor }) => (
               <div
                 key={id}
-                className={`flex flex-col gap-(--semantic-spacing-16) rounded-(--semantic-radius-6) px-(--semantic-spacing-24) py-(--semantic-spacing-20) border ${positionCardStyles[themeColor]}`}
+                className={`flex flex-col gap-(--semantic-spacing-16) rounded-(--semantic-radius-6) border px-(--semantic-spacing-24) py-(--semantic-spacing-20) ${positionCardStyles[themeColor]}`}
               >
                 <div className='flex items-center gap-(--semantic-spacing-8)'>
                   <Icon name={icon} size='2xl' />
@@ -97,7 +115,7 @@ const IntroSection = () => {
                   {description}
                 </p>
                 <div className='flex flex-wrap gap-(--semantic-spacing-8)'>
-                  {tags.map((tag) => (
+                  {tags.map(tag => (
                     <ContentBadge.Theme
                       key={tag}
                       variant={themeColor}
@@ -116,21 +134,23 @@ const IntroSection = () => {
 
         {/* 프로그램들 */}
         <div className={wrapperClassName}>
-          <Hero size='xs' textAlign='left'>구성원들의 성장을 돕는 프로그램들을 운영합니다</Hero>
+          <Hero size='xs' textAlign='left'>
+            구성원들의 성장을 돕는 프로그램들을 운영합니다
+          </Hero>
 
-          <div className='grid w-full grid-cols-1 gap-(--semantic-spacing-16) tablet:grid-cols-2'>
+          <div className='tablet:grid-cols-2 grid w-full grid-cols-1 gap-(--semantic-spacing-16)'>
             {programData.map(({ id, title, description }) => (
               <Callout.Basic
                 key={id}
-                hierarchy={id === 1 ? 'accent' : 'secondary'}
+                hierarchy={id === 1 ? "accent" : "secondary"}
                 variant='hint'
                 size='md'
                 title={`${id}. ${title}`}
               >
                 {description}
               </Callout.Basic>
             ))}
-            <div className='col-span-full tablet:col-span-1 [&>div]:max-w-full! [&>div]:w-full [&>div]:h-full'>
+            <div className='tablet:col-span-1 col-span-full [&>div]:h-full [&>div]:w-full [&>div]:max-w-full!'>
               <EmptyState
                 variant='outlined'
                 header='그 밖에 더 많은 활동들이 기다리고 있어요...'