feat/#101 Divider 태그에 따른 style 초기화 (#107)

* feat: hr 태그 style 초기화하는 로직 생성

* docs: Horizontal일 떄 args 추가

* test/#84 Divider vrt 테스트 추가 (#91)

* test: Divider 컴포넌트의 e2e 테스트 코드 작성

* chore: Button 관련 파일들 모두 삭제

* rename: 컴포넌트명 케밥케이스로 변경

* chore: 테스트 파일 내부 텍스트 변경

* chore: 캐시된 내용 삭제

* rename: e2e 테스트 폴더 구조 변경

* feat/#50 github action 워크플로우 최적화 (#90)

* chore: 크로마틱 배포 시 pnpm 캐시 사용하도록 변경

* chore: VRT 스냅샷 업데이트 시 pnpm, playwright 캐시 사용하도록 변경

* chore: PR VRT 테스트 시 pnpm, playwright 캐시 사용하도록 변경

* chore: chromatic_auto_deploy 코드 리뷰 반영

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

* chore: 코드 리뷰 반영

* chore: ${action} 캐시 형식으로 각 step name 변경

* chore: 각 action 최신 버전을 사용하도록 버전 수정

* chore: 의존성 설치 관련 스크립트 분리 후 재사용

* chore: playwright 설치 관련 스크립트 분리 후 재사용

* chore: 잘못된 경로 설정 수정

* chore: 잘못된 경로 설정 수정

* chore: pnpm, node 버전 환경 변수로 불러오도록 설정

* chore: 환경 변수 설정 별도 스크립트로 분리

* chore: pnpm/action-setup v4 버전으로 변경

* chore: eol 이슈 해결

* chore: 워크플로우 name 변경

---------

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

* feat/#85 codegen에 e2e 테스트 코드 템플릿 생성 및 적용 (#92)

* feat: e2e 테스트 코드 템플릿 파일 생성

* feat: e2e 테스트 코드 템플릿 파일 생성기 config 작성

* chore: e2e 테스트 파일 생성기 파일명 kebabCase로 수정

* chore: 예시 버튼 e2e 테스트 파일 삭제

* chore: 스토리북 템플릿 id ui로 시작되도록 수정

* fix: e2e 테스트 plob 템플릿 수정

---------

Co-authored-by: 홍서현 <[email protected]>
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

* chore/#93 husky 오류 해결 (#112)

* fix: pre-commit 오류 일으키는 코드 제거

* fix: jest testMatch 수정

* refactor: husky 구버전 관련 코드 pre push에서 제거

---------

Co-authored-by: 홍서현 <[email protected]>
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
Co-authored-by: ShinYoung-Kim <[email protected]>

packages/primitive/components/divider/src/divider.tsx

@@ -12,18 +12,39 @@ export type DividerProps = DivProps &
   };
 
 const Divider = forwardRef<HTMLDivElement | HTMLHRElement, DividerProps>((props, ref) => {
-  const { orientation: orientationProp = DEFAULT_ORIENTATION, ...restProps } = props;
+  const {
+    orientation: orientationProp = DEFAULT_ORIENTATION,
+    style: styleProp,
+    ...restProps
+  } = props;
   const isVertical = orientationProp === "vertical";
 
   const Component = isVertical ? "div" : "hr";
   const orientation = isVertical ? "vertical" : DEFAULT_ORIENTATION;
+  const style = isVertical
+    ? styleProp
+    : {
+        marginInline: 0,
+        marginBlock: 0,
+        border: "none",
+        height: 0,
+        color: "transparent",
+        backgroundColor: "transparent",
+        ...styleProp,
+      };
 
   const typedRef = ref as ForwardedRef<
     typeof orientation extends "vertical" ? HTMLDivElement : HTMLHRElement
   >;
 
   return (
-    <Component role="separator" aria-orientation={orientation} ref={typedRef} {...restProps} />
+    <Component
+      role="separator"
+      aria-orientation={orientation}
+      ref={typedRef}
+      style={style}
+      {...restProps}
+    />
   );
 });
 

packages/primitive/components/divider/stories/divider.stories.tsx

@@ -26,7 +26,15 @@ export default meta;
 
 type Story = StoryObj<typeof meta>;
 
-export const Horizontal: Story = {};
+export const Horizontal: Story = {
+  args: {
+    style: {
+      width: "100%",
+      height: "1px",
+      backgroundColor: "black",
+    },
+  },
+};
 
 export const Vertical: Story = {
   args: {