atomsystem 0.1.16 → 0.1.18

package/tailwind.config.ts

@@ -1,160 +0,0 @@
-import type { Config } from "tailwindcss";
-
-export default {
-  content: [
-    "./pages/**/*.{js,ts,jsx,tsx,mdx}",
-    "./components/**/*.{js,ts,jsx,tsx,mdx}",
-    "./app/**/*.{js,ts,jsx,tsx,mdx}",
-  ],
-
-  plugins: [],
-  theme: {
-    extend: {
-      colors: {
-        "primary": "var(--brand-primary)",
-        "danger": "var(--system-danger)",
-        "fill-wrapper": "var(--fill-wrapper)",
-        "fill-card": "var(--fill-card)",
-        "fill-group": "var(--fill-info)",
-        "fill-border": "var(--fill-border)",
-        "text-standard": "var(--text-standard)",
-        "text-sub": "var(--text-sub)",
-        "text-reverse": "var(--text-reverse)",
-        "text-sub-reverse": "var(--text-sub-reverse)",
-        "input-background-standard": "var(--input-background-standard)",
-        "input-background-disabled": "var(--input-background-disabled)",
-        "input-background-value": "var(--input-background-value)",
-        "input-background-success": "var(--input-background-success)",
-        "input-background-error": "var(--input-background-error)",
-        "input-border-standard": "var(--input-border-standard)",
-        "input-border-focus": "var(--input-border-focus)",
-        "input-border-success": "var(--input-border-success)",
-        "input-border-error": "var(--input-border-error)",
-        "input-text-value": "var(--input-text-value)",
-        "input-text-placeholder": "var(--input-text-placeholder)",
-        "input-text-success": "var(--input-text-success)",
-        "input-text-error": "var(--input-text-error)",
-        "button-text":"var(--button-text)",
-        "button-primary-standard":"var(--button-primary-standard-background)",
-        "button-primary-hover":"var(--button-primary-hover-background)",
-        "button-primary-disabled":"var(--button-primary-disabled-background)",
-        "button-secondary-standard":"var(--button-secondary-standard-background)",
-        "button-secondary-hover":"var(--button-secondary-hover-background)",
-        "button-secondary-disabled":"var(--button-secondary-disabled-background)",
-        "button-success-standard":"var(--button-success-standard-background)",
-        "button-success-hover":"var(--button-success-hover-background)",
-        "button-success-disabled":"var(--button-success-disabled-background)",
-        "button-danger-standard":"var(--button-danger-standard-background)",
-        "button-danger-hover":"var(--button-danger-hover-background)",
-        "button-danger-disabled":"var(--button-danger-disabled-background)",
-        "button-gray-standard":"var(--button-gray-standard-background)",
-        "button-gray-hover":"var(--button-gray-hover-background)",
-        "button-gray-disabled":"var(--button-gray-disabled-background)",
-      },
-      fontSize: {
-        // Desktop
-        h1: [
-          "var(--desktop-h1-font-size)",
-          {
-            lineHeight: "calc(var(--desktop-h1-line-height) * 1px)",
-            fontWeight: "var(--desktop-h1-font-weight)",
-          },
-        ],
-        h2: [
-          "var(--desktop-h2-font-size)",
-          {
-            lineHeight: "calc(var(--desktop-h2-line-height) * 1px)",
-            fontWeight: "var(--desktop-h2-font-weight)",
-          },
-        ],
-        h3: [
-          "var(--desktop-h3-font-size)",
-          {
-            lineHeight: "calc(var(--desktop-h3-line-height) * 1px)",
-            fontWeight: "var(--desktop-h3-font-weight)",
-          },
-        ],
-        h4: [
-          "var(--desktop-h4-font-size)",
-          {
-            lineHeight: "calc(var(--desktop-h4-line-height) * 1px)",
-            fontWeight: "var(--desktop-h4-font-weight)",
-          },
-        ],
-        h5: [
-          "var(--desktop-h5-font-size)",
-          {
-            lineHeight: "calc(var(--desktop-h5-line-height) * 1px)",
-            fontWeight: "var(--desktop-h5-font-weight)",
-          },
-        ],
-        h6: [
-          "var(--desktop-h6-font-size)",
-          {
-            lineHeight: "calc(var(--desktop-h6-line-height) * 1px)",
-            fontWeight: "var(--desktop-h6-font-weight)",
-          },
-        ],
-
-        // Mobile
-        mobileH1: [
-          "var(--mobile-h1-font-size)",
-          {
-            lineHeight: "calc(var(--mobile-h1-line-height) * 1px)",
-            fontWeight: "var(--mobile-h1-font-weight)",
-          },
-        ],
-        mobileH2: [
-          "var(--mobile-h2-font-size)",
-          {
-            lineHeight: "calc(var(--mobile-h2-line-height) * 1px)",
-            fontWeight: "var(--mobile-h2-font-weight)",
-          },
-        ],
-        mobileH3: [
-          "var(--mobile-h3-font-size)",
-          {
-            lineHeight: "calc(var(--mobile-h3-line-height) * 1px)",
-            fontWeight: "var(--mobile-h3-font-weight)",
-          },
-        ],
-        mobileH4: [
-          "var(--mobile-h4-font-size)",
-          {
-            lineHeight: "calc(var(--mobile-h4-line-height) * 1px)",
-            fontWeight: "var(--mobile-h4-font-weight)",
-          },
-        ],
-        mobileH5: [
-          "var(--mobile-h5-font-size)",
-          {
-            lineHeight: "calc(var(--mobile-h5-line-height) * 1px)",
-            fontWeight: "var(--mobile-h5-font-weight)",
-          },
-        ],
-        mobileH6: [
-          "var(--mobile-h6-font-size)",
-          {
-            lineHeight: "calc(var(--mobile-h6-line-height) * 1px)",
-            fontWeight: "var(--mobile-h6-font-weight)",
-          },
-        ],
-      },
-      borderRadius: {
-        "common": "var(--rounded-common)",
-        "none": "var(--rounded-none)",
-        "xs": "var(--rounded-xs)",
-        "sm": "var(--rounded-sm)",
-        "md": "var(--rounded-md)",
-        "lg": "var(--rounded-lg)",
-        "full": "var(--rounded-full)",
-        "input-rounded": "var(--input-rounded)"
-        
-      },
-      fontFamily: {
-        "main": ["var(--main-title)"],
-        "body": ["var(--desktop-body-base-font-family)"],
-      },
-    },
-  },
-} satisfies Config;

package/tokens/buildMergeCss.js

@@ -1,87 +0,0 @@
-import StyleDictionary from "style-dictionary";
-import { register } from "@tokens-studio/sd-transforms";
-
-import { readFileSync, writeFileSync } from "fs";
-
-import path from "path";
-
-register(StyleDictionary);
-
-// 원본 token.json 파일 읽기
-const tokenFile = readFileSync("token.json", "utf8");
-const tokenData = JSON.parse(tokenFile);
-// console.log(tokenData);
-
-// css 파일 빌드 후 통합하여 global.css에 제공하는 함수
-const processCss = async (tokenSetOrder) => {
-  let globalCSS = "";
-
-  let globalItems = readFileSync(
-    path.join(process.cwd(), "build", `global.variables.css`),
-    "utf8"
-  )
-    .replace(":root {", "")
-    .replace(/}\s*$/, "") // 마지막 } 제거;
-    .split(";") // 세미콜론 기준으로 나눔
-    .map((item) => item.trim()) // 양 끝 공백 제거
-    .filter(Boolean); //빈 값 제거
-
-  tokenSetOrder.forEach((tokenValue) => {
-    const filePath = path.join(
-      process.cwd(),
-      "build",
-      `${tokenValue}.variables.css`
-    );
-
-    try {
-      let items = readFileSync(filePath, "utf8")
-        .replace(":root {", "")
-        .replace(/}\s*$/, "") // 마지막 } 제거;
-        .split(";") // 세미콜론 기준으로 나눔
-        .map((item) => item.trim()) // 양 끝 공백 제거
-        .filter(Boolean); //빈 값 제거
-
-      const uniqueItems = items.filter((item) => !globalItems.includes(item));
-
-      // 각 토큰별 css를 구조에 맞게 추가
-      globalCSS += `
-      
-      .${tokenValue} {
-        ${uniqueItems.join(";")}
-      }
-      `;
-    } catch (error) {
-      console.log(`파일 읽기 실패:${filePath}`, error);
-    }
-  });
-
-  // tailwind 지시어와 통합
-
-  const combinedCSS = `
-    @tailwind base;
-    @tailwind components;
-    @tailwind utilities;
-    
-    @layer base{
-        :root{
-          ${globalItems.join(";")}
-        }
-      }
-
-    ${globalCSS}
-    `;
-
-  // 결과를 app/globals.css에 저장
-  writeFileSync(
-    path.join(process.cwd(), "app", "globals.css"),
-    combinedCSS,
-    "utf8"
-  );
-  console.log("global.css 파일이 성공적으로 생성되었습니다.");
-};
-
-try {
-  processCss(tokenData.$metadata.tokenSetOrder);
-} catch (error) {
-  console.error("css파일 통합 처리중 오류가 발생했습니다:", error);
-}

package/tokens/buildTokenSplit.js

@@ -1,81 +0,0 @@
-import StyleDictionary from "style-dictionary";
-import { register } from "@tokens-studio/sd-transforms";
-import { expandTypesMap } from "@tokens-studio/sd-transforms";
-
-import { readFileSync, writeFileSync, rmSync, mkdirSync } from "fs";
-import { existsSync } from "fs";
-
-register(StyleDictionary);
-
-// 원본 token.json 파일 읽기
-const tokenFile = readFileSync("token.json", "utf8");
-const tokenData = JSON.parse(tokenFile);
-// console.log(tokenData);
-
-// build 디렉토리가 없으면 생성
-const buildDir = "build/";
-if (existsSync(buildDir)) {
-  rmSync(buildDir, { recursive: true, force: true });
-}
-mkdirSync(buildDir);
-
-const buildTokens = async () => {
-  // tokenSetOrder 배열에서 각 항목에 대해 파일 생성
-  tokenData.$metadata.tokenSetOrder.forEach((tokenSet) => {
-    const fileName = `tokens/token/${tokenSet}.json`;
-
-    // 각 토큰셋의 데이터를 가져옴
-    const originalTokens = tokenData[tokenSet] || {};
-    const globalTokens = tokenData["global"] || {};
-    const cleanedTokens = { ...globalTokens }; // 초기값으로 globalTokens 추가
-
-    //   console.log(originalTokens);
-    // console.log(globalTokens);
-
-    // 최상위 그룹을 제외한 나머지 데이터 처리
-    Object.entries(originalTokens).forEach(([groupKey, groupValue]) => {
-      if (groupKey === tokenSet) {
-        return; // 최상위 그룹 스킵
-      }
-
-      if (groupValue && typeof groupValue === "object") {
-        cleanedTokens[groupKey] = groupValue;
-      }
-    });
-
-    // 각 토큰 파일 생성
-    writeFileSync(fileName, JSON.stringify(cleanedTokens, null, 2), "utf8");
-    console.log(`${fileName} 파일이 생성되었습니다.`);
-
-    // StyleDictionary 인스턴스 생성 및 빌드
-    const sdTransfer = new StyleDictionary({
-      source: [fileName],
-      preprocessors: ["tokens-studio"],
-      expand: {
-        typesMap: expandTypesMap,
-      },
-      platforms: {
-        css: {
-          transformGroup: "tokens-studio",
-          transforms: ["ts/size/px", "ts/opacity", "name/kebab"],
-          buildPath: buildDir,
-          files: [
-            {
-              destination: `${tokenSet}.variables.css`,
-              format: "css/variables",
-            },
-          ],
-        },
-      },
-    });
-
-    sdTransfer.cleanAllPlatforms(); // 기존 빌드 삭제
-    sdTransfer.buildAllPlatforms(); // 빌드 실행
-  });
-};
-
-try {
-  buildTokens();
-} catch (error) {
-  console.error("토크파일 처리중 오류가 발생했습니다:", error);
-}