@conscience-technology/ctds 0.3.2 → 0.3.3

package/assets/components/_data.ts

@@ -488,7 +488,7 @@ export const shadows: [string, string, string][] = [
   ["shadow-sm", "var(--shadow-sm)", "Card 기본"],
   ["shadow-md", "var(--shadow-md)", "Dropdown, Popover"],
   ["shadow-lg", "var(--shadow-lg)", "Modal"],
-  ["shadow-xl", "var(--shadow-xl)", "Command Palette"],
+  ["shadow-xl", "var(--shadow-xl)",],
   ["shadow-inner", "var(--shadow-inner)", "눌린 상태"],
 ];
 
@@ -554,8 +554,6 @@ export const componentSlugs: Record<string, string> = {
   "App Frame": "layout/app-frame",
   Stepper: "nav/stepper",
   "Context Menu": "overlay/context-menu",
-  "Command Palette": "overlay/command-palette",
-  "Accordion": "overlay/accordion",
   Callout: "feedback/callout",
   Modal: "feedback/modal",
   Drawer: "feedback/drawer",
@@ -564,7 +562,6 @@ export const componentSlugs: Record<string, string> = {
   "Table Row": "data/table-row",
   "Table Row Select": "data/table-row-select",
   "Table Row Edit": "data/table-row-edit",
-  "Event Card": "data/event-card",
   "Event Chip": "data/event-chip",
   "List Item": "data/list-item",
   "Metric Card": "data/metric-card",
@@ -619,7 +616,7 @@ export const components: { id: string; title: string; items: string[] }[] = [
     title: "Data Display",
     items: [
       "Table Header", "Table Row", "Table Row Select", "Table Row Edit",
-      "List Item", "Metric Card", "Gallery Item", "File Icon", "Attachment Item", "Event Chip", "Event Card",
+      "List Item", "Metric Card", "Gallery Item", "File Icon", "Attachment Item", "Event Chip",
       "Empty State", "Description List", "Timeline",
     ],
   },
@@ -643,8 +640,7 @@ export const components: { id: string; title: string; items: string[] }[] = [
     id: "overlay",
     title: "Overlay / Menu",
     items: [
-      "Context Menu", "Command Palette",
-      "Accordion", "Collapsible", "Toggle Group",
+      "Context Menu", "Collapsible", "Toggle Group",
     ],
   },
   {

package/assets/components/index.ts

@@ -28,7 +28,6 @@ export * from "./Disclosure";
 export * from "./Drawer";
 export * from "./DropdownMenu";
 export * from "./EmptyState";
-export * from "./EventCard";
 export * from "./EventChip";
 export * from "./FileIcon";
 export * from "./FilterButton";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@conscience-technology/ctds",
-  "version": "0.3.2",
+  "version": "0.3.3",
   "description": "CTDS — 하이브리드 디자인 시스템 설치 · 온보딩 CLI (shadcn식 코드 생성기)",
   "type": "module",
   "sideEffects": [

package/assets/components/Accordion/Accordion.module.css

@@ -1,247 +0,0 @@
-/* Accordion ─────────────────────────────────────────────────────
-   여러 섹션 접힘/펴짐. Radix Accordion 위의 시각 레이어.
-   두 variant:
-   - plain: 테두리 없음, 아이템 사이 hairline만. 설정·FAQ 흐름.
-   - card: 각 아이템이 독립 블록(테두리 + radius). 콘텐츠 섹션 리스트.
-   아이템 레이아웃(leading·라벨·trailing·caret)은 trigger 내부에서 담당. */
-
-/* Root ─────────────────────────────────────────────────── */
-.root {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  color: var(--fg);
-  font-family: var(--font-sans);
-  --accordion-trigger-h: calc(var(--space-2) * 5); /* sm 기본 40 */
-  /* leading 아이콘 크기 — MenuItem과 동일 톤(sm 14 / md 16).
-     caret은 한 스텝 더 작게 — 상태 보조 신호라 라벨·아이콘보다 작아야 리듬이 잡힘. */
-  --accordion-icon-size: calc(var(--space-1) * 3.5); /* 14 */
-  --accordion-caret-size: var(--space-3); /* 12 */
-}
-
-.root[data-size="md"] {
-  --accordion-trigger-h: calc(var(--space-2) * 6); /* md 48 */
-  --accordion-icon-size: var(--space-4); /* 16 */
-  --accordion-caret-size: calc(var(--space-1) * 3.5); /* 14 */
-}
-
-.root[data-size="lg"] {
-  --accordion-trigger-h: calc(var(--space-2) * 7); /* lg 56 */
-  --accordion-icon-size: calc(var(--space-1) * 4.5); /* 18 */
-  --accordion-caret-size: var(--space-4); /* 16 */
-}
-
-.root[data-variant="card"] {
-  gap: var(--space-2);
-}
-
-/* Item ─────────────────────────────────────────────────── */
-/* bare: 선·여백 전부 없음. 본문 흐름에 녹아듦.
-   plain: 아이템 사이 hairline. 첫 아이템은 상단 선 없음.
-   card: 각 아이템이 테두리 + radius. 사이 gap은 Root에서 담당. */
-.item {
-  display: flex;
-  flex-direction: column;
-}
-
-.root[data-variant="plain"] .item + .item {
-  border-top: var(--hairline) solid var(--border);
-}
-
-.root[data-variant="card"] .item {
-  border: var(--hairline) solid var(--border);
-  border-radius: var(--radius-md);
-  background: var(--bg);
-  overflow: hidden;
-}
-
-/* bare — Trigger 좌우 padding 제거, content도 좌우 0.
-   세로 리듬은 그대로 유지(상/하 padding은 contentInner가 담당). */
-.root[data-variant="bare"] .trigger {
-  padding-left: 0;
-  padding-right: 0;
-}
-
-.root[data-variant="bare"] .contentInner {
-  padding-left: 0;
-  padding-right: 0;
-}
-
-/* bare에서는 hover 배경도 꺼야 "선 없는" 톤이 유지됨. 라벨 색만 상태 신호. */
-.root[data-variant="bare"] .trigger:hover:not([data-state="open"]):not([data-disabled]) {
-  background: transparent;
-}
-
-/* Header + Trigger ─────────────────────────────────────── */
-/* Radix의 Header는 <h3>로 렌더됨. 폰트/weight은 Trigger가 결정 — Header는 wrapper. */
-.header {
-  margin: 0;
-  font-size: inherit;
-  font-weight: inherit;
-}
-
-.trigger {
-  display: flex;
-  align-items: center;
-  gap: var(--space-2);
-  width: 100%;
-  min-height: var(--accordion-trigger-h);
-  padding: 0 var(--space-3);
-  border: 0;
-  background: transparent;
-  color: var(--fg);
-  font-family: inherit;
-  font-size: var(--text-sm);
-  line-height: var(--lh-sm);
-  font-weight: var(--font-weight-medium);
-  text-align: left;
-  cursor: pointer;
-  outline: none;
-  transition: var(--transition-colors);
-}
-
-.root[data-size="md"] .trigger {
-  font-size: var(--text-base);
-  line-height: var(--lh-base);
-}
-
-/* hover: closed일 때만 배경 변화. open에선 상태 signal(fg-strong)만 유지. */
-.trigger:hover:not([data-state="open"]):not([data-disabled]) {
-  background: var(--hover);
-  color: var(--fg-strong);
-}
-
-.trigger[data-state="open"] {
-  color: var(--fg-strong);
-}
-
-.trigger:focus-visible {
-  outline: none;
-  box-shadow: var(--ring-shadow);
-  border-radius: var(--radius-sm);
-}
-
-.trigger[data-disabled] {
-  color: var(--fg-disabled);
-  cursor: not-allowed;
-}
-
-/* Leading / Label / Trailing ──────────────────────────── */
-.leading {
-  display: inline-flex;
-  align-items: center;
-  gap: var(--space-1);
-  color: var(--fg-muted);
-  flex-shrink: 0;
-  /* MenuItem과 동일 — 슬롯에 들어온 svg/img는 정사각 아이콘 크기로 수렴. */
-  font-size: var(--accordion-icon-size);
-}
-
-.leading > *,
-.leading svg,
-.leading img {
-  width: var(--accordion-icon-size);
-  height: var(--accordion-icon-size);
-}
-
-.trigger[data-state="open"] .leading {
-  color: var(--fg-strong);
-}
-
-.leadingItem {
-  display: inline-flex;
-  align-items: center;
-}
-
-.label {
-  flex: 1 1 auto;
-  min-width: 0;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.trailing {
-  display: inline-flex;
-  align-items: center;
-  gap: var(--space-1);
-  color: var(--fg-muted);
-  flex-shrink: 0;
-}
-
-.trailingItem {
-  display: inline-flex;
-  align-items: center;
-}
-
-/* Caret — open이면 180도 회전.
-   라벨·leading 아이콘보다 한 스텝 작게. 상태 보조 신호라 작아야 리듬이 잡힘. */
-.caret {
-  display: inline-flex;
-  align-items: center;
-  color: var(--fg-muted);
-  flex-shrink: 0;
-  font-size: var(--accordion-caret-size);
-  transition: transform var(--duration-base) var(--ease-out);
-}
-
-.caret svg {
-  width: var(--accordion-caret-size);
-  height: var(--accordion-caret-size);
-}
-
-.trigger[data-state="open"] .caret {
-  transform: rotate(180deg);
-  color: var(--fg-strong);
-}
-
-/* Content ──────────────────────────────────────────────── */
-/* Radix가 측정한 --radix-accordion-content-height로 slide 애니메이션.
-   contentInner에 padding을 깔아 열림 애니메이션이 깔끔하게 흐르도록. */
-.content {
-  overflow: hidden;
-  font-size: var(--text-sm);
-  line-height: var(--lh-sm);
-  color: var(--fg);
-}
-
-.content[data-state="open"] {
-  animation: accordion-slide-down var(--duration-base) var(--ease-out);
-}
-
-.content[data-state="closed"] {
-  animation: accordion-slide-up var(--duration-fast) var(--ease-in);
-}
-
-.contentInner {
-  /* 상단은 Trigger와 리듬 유지(겹치지 않게 살짝), 하단은 다음 Trigger와 거리. */
-  padding: var(--space-1) var(--space-3) var(--space-4);
-  color: var(--fg);
-}
-
-.root[data-size="md"] .contentInner {
-  font-size: var(--text-base);
-  line-height: var(--lh-base);
-}
-
-/* Animations ───────────────────────────────────────────── */
-@keyframes accordion-slide-down {
-  from { height: 0; opacity: 0; }
-  to   { height: var(--radix-accordion-content-height); opacity: 1; }
-}
-
-@keyframes accordion-slide-up {
-  from { height: var(--radix-accordion-content-height); opacity: 1; }
-  to   { height: 0; opacity: 0; }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .content,
-  .content[data-state="open"],
-  .content[data-state="closed"] {
-    animation: none;
-  }
-  .caret {
-    transition: none;
-  }
-}

package/assets/components/Accordion/Accordion.tsx

@@ -1,207 +0,0 @@
-"use client";
-
-/**
- * Accordion ─ 여러 섹션을 접었다 폈다 하는 구조 컴포넌트.
- *
- * 스택: Radix `@radix-ui/react-accordion` 어댑터.
- * - 열림/닫힘 상태·키보드 네비(↑↓ Home End)·ARIA(aria-expanded/controls)·
- *   콘텐츠 높이 측정은 전부 Radix가 처리.
- * - 시각(Trigger 레이아웃·caret·divider·card variant)만 CTDS가 담당.
- *
- * variant
- * - plain (기본): 테두리 없음, 아이템 사이 hairline만. 설정 그룹·FAQ용.
- * - card: 각 아이템이 테두리 + radius로 독립 블록. 콘텐츠 사이트의 섹션 리스트용.
- *
- * 소비 표면
- *   <Accordion type="single" collapsible defaultValue="general">
- *     <Accordion.Item value="general">
- *       <Accordion.Trigger leadingIcon="gear">일반</Accordion.Trigger>
- *       <Accordion.Content>...</Accordion.Content>
- *     </Accordion.Item>
- *   </Accordion>
- */
-
-import * as RadixAccordion from "@radix-ui/react-accordion";
-import {
-  createContext,
-  forwardRef,
-  useContext,
-  type ComponentPropsWithoutRef,
-  type ReactNode,
-} from "react";
-
-import { Icon, type IconName } from "../Icon";
-import styles from "./Accordion.module.css";
-
-export type AccordionSize = "sm" | "md" | "lg";
-/**
- * - bare: 선·좌우 여백 전부 없음. 본문 흐름에 가장 투명하게 녹음(툴바·설명 블록 내부).
- * - plain: 테두리 없음, 아이템 사이 hairline, Trigger 좌우 padding 있음. 설정·FAQ 흐름.
- * - card: 각 아이템이 테두리 + radius로 독립 블록. 콘텐츠 섹션 리스트.
- */
-export type AccordionVariant = "bare" | "plain" | "card";
-
-export type AccordionAction =
-  | ReactNode
-  | { node: ReactNode; key?: string };
-
-/* Size·variant context — Trigger가 Root 설정 상속. */
-type AccordionContextValue = {
-  size: AccordionSize;
-  variant: AccordionVariant;
-};
-const AccordionContext = createContext<AccordionContextValue>({
-  size: "sm",
-  variant: "plain",
-});
-
-/* Root ─────────────────────────────────────────────────────── */
-
-type SingleRootProps = ComponentPropsWithoutRef<typeof RadixAccordion.Root> & {
-  type: "single";
-};
-type MultipleRootProps = ComponentPropsWithoutRef<typeof RadixAccordion.Root> & {
-  type: "multiple";
-};
-export type AccordionProps = (SingleRootProps | MultipleRootProps) & {
-  size?: AccordionSize;
-  variant?: AccordionVariant;
-};
-
-const Root = forwardRef<HTMLDivElement, AccordionProps>(function Accordion(
-  { className, size = "sm", variant = "plain", children, ...rest },
-  ref,
-) {
-  return (
-    <AccordionContext.Provider value={{ size, variant }}>
-      <RadixAccordion.Root
-        ref={ref}
-        data-size={size}
-        data-variant={variant}
-        className={[styles.root, className ?? ""].filter(Boolean).join(" ")}
-        {...(rest as ComponentPropsWithoutRef<typeof RadixAccordion.Root>)}
-      >
-        {children}
-      </RadixAccordion.Root>
-    </AccordionContext.Provider>
-  );
-});
-
-/* Item ─────────────────────────────────────────────────────── */
-
-const Item = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<typeof RadixAccordion.Item>>(
-  function AccordionItem({ className, children, ...rest }, ref) {
-    return (
-      <RadixAccordion.Item
-        ref={ref}
-        className={[styles.item, className ?? ""].filter(Boolean).join(" ")}
-        {...rest}
-      >
-        {children}
-      </RadixAccordion.Item>
-    );
-  },
-);
-
-/* Trigger ──────────────────────────────────────────────────── */
-
-export interface TriggerProps
-  extends Omit<ComponentPropsWithoutRef<typeof RadixAccordion.Trigger>, "children"> {
-  /** 좌측 아이콘 이름. leading 슬롯 간결 사용. */
-  leadingIcon?: IconName;
-  /** 커스텀 좌측 노드 배열. leadingIcon보다 우선. */
-  leadingActions?: AccordionAction[];
-  /** 우측 메타(배지·숫자 등). caret은 자동으로 가장 끝. */
-  trailingActions?: AccordionAction[];
-  children?: ReactNode;
-}
-
-const Trigger = forwardRef<HTMLButtonElement, TriggerProps>(function AccordionTrigger(
-  { className, leadingIcon, leadingActions, trailingActions, children, ...rest },
-  ref,
-) {
-  const leading =
-    leadingActions ?? (leadingIcon ? [<Icon key="icon" name={leadingIcon} />] : undefined);
-  return (
-    <RadixAccordion.Header className={styles.header}>
-      <RadixAccordion.Trigger
-        ref={ref}
-        className={[styles.trigger, className ?? ""].filter(Boolean).join(" ")}
-        {...rest}
-      >
-        {leading && leading.length > 0 && (
-          <span className={styles.leading} data-slot="leading" aria-hidden>
-            {leading.map((a, i) => {
-              const key =
-                typeof a === "object" && a !== null && "key" in a && a.key
-                  ? a.key
-                  : String(i);
-              const node = typeof a === "object" && a !== null && "node" in a ? a.node : a;
-              return (
-                <span key={key} className={styles.leadingItem}>
-                  {node as ReactNode}
-                </span>
-              );
-            })}
-          </span>
-        )}
-        <span className={styles.label}>{children}</span>
-        {trailingActions && trailingActions.length > 0 && (
-          <span className={styles.trailing} data-slot="trailing">
-            {trailingActions.map((a, i) => {
-              const key =
-                typeof a === "object" && a !== null && "key" in a && a.key
-                  ? a.key
-                  : String(i);
-              const node = typeof a === "object" && a !== null && "node" in a ? a.node : a;
-              return (
-                <span key={key} className={styles.trailingItem}>
-                  {node as ReactNode}
-                </span>
-              );
-            })}
-          </span>
-        )}
-        <span className={styles.caret} aria-hidden>
-          <Icon name="caret-down" />
-        </span>
-      </RadixAccordion.Trigger>
-    </RadixAccordion.Header>
-  );
-});
-
-/* Content ──────────────────────────────────────────────────── */
-
-const Content = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<typeof RadixAccordion.Content>>(
-  function AccordionContent({ className, children, ...rest }, ref) {
-    return (
-      <RadixAccordion.Content
-        ref={ref}
-        className={[styles.content, className ?? ""].filter(Boolean).join(" ")}
-        {...rest}
-      >
-        <div className={styles.contentInner}>{children}</div>
-      </RadixAccordion.Content>
-    );
-  },
-);
-
-/* Hook — 내부 Trigger가 size 참조할 때 (현재는 미사용, 향후 확장용) */
-export function useAccordionContext() {
-  return useContext(AccordionContext);
-}
-
-/* Compound export ─────────────────────────────────────────── */
-
-type AccordionComponent = typeof Root & {
-  Item: typeof Item;
-  Trigger: typeof Trigger;
-  Content: typeof Content;
-};
-
-const Accordion = Root as AccordionComponent;
-Accordion.Item = Item;
-Accordion.Trigger = Trigger;
-Accordion.Content = Content;
-
-export { Accordion };

package/assets/components/Accordion/index.ts

@@ -1,8 +0,0 @@
-export { Accordion, useAccordionContext } from "./Accordion";
-export type {
-  AccordionProps,
-  AccordionSize,
-  AccordionVariant,
-  AccordionAction,
-  TriggerProps as AccordionTriggerProps,
-} from "./Accordion";