maru_design2 0.0.3 → 0.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "maru_design2",
-  "version": "0.0.3",
+  "version": "0.1.0",
   "main": "./dist/index.js",
   "author": "zena-42maru",
   "license": "MIT",

package/.babelrc.json

@@ -1,18 +0,0 @@
-{
-  "sourceType": "unambiguous",
-  "presets": [
-    [
-      "@babel/preset-env",
-      {
-        "targets": {
-          "chrome": 100
-        }
-      }
-    ],
-    [
-      "@babel/preset-react",
-      { "runtime": "automatic" }
-    ],
-    ["@babel/preset-typescript"]
-  ],
-}

package/.eslintrc.json

@@ -1,110 +0,0 @@
-{
-  "extends": [
-    "airbnb",
-    "plugin:react/recommended",
-    "plugin:@typescript-eslint/recommended"
-  ],
-  "plugins": ["react", "@typescript-eslint", "prettier", "simple-import-sort"],
-  "rules": {
-    "no-tabs": [
-      "error",
-      {
-        "allowIndentationTabs": true
-      }
-    ],
-    "no-mixed-spaces-and-tabs": 0,
-    "simple-import-sort/imports": [
-      "warn",
-      {
-        "groups": [
-          ["^react", "^(?!src)(?=@?\\w)"],
-          [
-            "constants",
-            "hooks",
-            "reducers",
-            "routes",
-            "store",
-            "types",
-            "utils"
-          ],
-          [
-            "views",
-            "^\\.\\.(?!/?$)",
-            "^\\.\\./?$",
-            "^\\./(?=.*/)(?!/?$)",
-            "^\\.(?!/?$)",
-            "^\\./?$",
-            "components"
-          ],
-          ["assets", "^.+\\.s?css$"]
-        ]
-      }
-    ],
-    "import/order": "off",
-    "import/extensions": [
-      "off",
-      {
-        "ts": "always",
-        "tsx": "always",
-        "js": "always",
-        "jsx": "always"
-      }
-    ],
-    "import/no-unresolved": "off",
-    "react/jsx-filename-extension": [
-      "warn",
-      {
-        "extensions": [".ts", ".tsx"]
-      }
-    ],
-    "react/destructuring-assignment": 0,
-    "no-use-before-define": "off",
-    "@typescript-eslint/no-use-before-define": ["error"],
-    "import/no-extraneous-dependencies": [
-      "error",
-      {
-        "devDependencies": true,
-        "optionalDependencies": true,
-        "peerDependencies": true
-      }
-    ],
-    "linebreak-style": "off",
-    "object-curly-newline": "off",
-    "comma-dangle": "off",
-    "react/prop-types": "off",
-    "operator-linebreak": "off",
-    "import/prefer-default-export": "warn",
-    "no-console": "off",
-    "implicit-arrow-linebreak": "off",
-    "react/jsx-curly-newline": "off",
-    "no-param-reassign": [
-      "error",
-      {
-        "props": false
-      }
-    ],
-    "@typescript-eslint/ban-types": "warn",
-    "no-nested-ternary": "off",
-    "indent": "off",
-    "camelcase": "off",
-    "no-confusing-arrow": "off",
-    "function-paren-newline": "off",
-    "@typescript-eslint/no-empty-function": "warn",
-    "no-plusplus": "warn",
-    "react/jsx-wrap-multilines": "off",
-    "no-restricted-syntax": "off",
-    "no-await-in-loop": "off",
-    "react/require-default-props": [
-      1,
-      {
-        "functions": "ignore"
-      }
-    ],
-    "jsx-a11y/label-has-associated-control": [
-    2,
-    {
-      "labelAttributes": ["htmlFor"]
-    }
-    ]
-  }
-}

package/.github/workflows/chromatic.yml

@@ -1,19 +0,0 @@
-name: "Chromatic"
-
-on: push
-
-jobs:
-  chromatic-release:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v2
-        with:
-          fetch-depth: 0
-      - uses: actions/setup-node@v3
-        with:
-          node-version: 18
-      - run: yarn
-      - uses: chromaui/action@latest
-        with:
-          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
-          token: ${{ secrets.GITHUB_TOKEN }}

package/.prettierrc

@@ -1,8 +0,0 @@
-{
-  "singleQuote": true,
-  "semi": true,
-  "useTabs": false,
-  "tabWidth": 2,
-  "trailingComma": "all",
-  "printWidth": 80
-}

package/build-storybook.log

@@ -1,29 +0,0 @@
-yarn run v1.22.22
-$ storybook build --output-dir /var/folders/px/wfswfhnj2_96379m3pn48snm0000gn/T/chromatic--60662-3uZghrajfe3J
-@storybook/cli v8.0.6
-
-info => Cleaning outputDir: ../../../../../var/folders/px/wfswfhnj2_96379m3pn48snm0000gn/T/chromatic--60662-3uZghrajfe3J
-info => Loading presets
-info => Building manager..
-info => Manager built (106 ms)
-info => Building preview..
-WARN No story files found for the specified pattern: src/**/*.mdx
-info Addon-docs: using MDX3
-info => Using implicit CSS loaders
-info => Using default Webpack5 setup
-info Using tsconfig paths for react-docgen
-WARN asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
-WARN This can impact web performance.
-WARN Assets: 
-WARN   841.8b90d07c.iframe.bundle.js (1.51 MiB)
-WARN   589.80a80dfc.iframe.bundle.js (628 KiB)
-WARN entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
-WARN Entrypoints:
-WARN   main (1.53 MiB)
-WARN       runtime~main.fb7a63fd.iframe.bundle.js
-WARN       841.8b90d07c.iframe.bundle.js
-WARN       main.26a48fe5.iframe.bundle.js
-WARN 
-info => Preview built (5.97 s)
-info => Output directory: /var/folders/px/wfswfhnj2_96379m3pn48snm0000gn/T/chromatic--60662-3uZghrajfe3J
-Done in 8.54s.

package/scripts/svg-parser.js

@@ -1,224 +0,0 @@
-/* eslint-disable @typescript-eslint/no-var-requires */
-const fs = require('fs');
-const path = require('path');
-
-const inputDir = './src/assets/icons';
-const outputDir = './src/components/atoms/icon';
-const svgs = fs.readdirSync(inputDir);
-
-// 아이콘의 정보들을 모을 객체
-const icons = {};
-// 아이콘의 이름을 모을 객체
-const names = {};
-
-const toCamelCase = (pascalStr) =>
-  pascalStr
-    .split('-')
-    .map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
-    .join('');
-
-const readFile = (filePath, fileName, fileExtension) =>
-  new Promise((resolve, reject) => {
-    fs.readFile(filePath, 'utf8', (err, data) => {
-      if (err) {
-        reject(err);
-        return;
-      }
-
-      console.log('---------- parsing start ----------');
-
-      console.log('((data))', data);
-
-      // svg args 추출
-      const svgStartRegex = /<svg/g;
-      const svgEndRegex = />/;
-      const svgArgs = data.split(svgStartRegex)[1].split(svgEndRegex)[0];
-
-      console.log('**svgArgs', svgArgs);
-
-      // width 추출
-      const widthRegex = /width=".{1,9}"/g;
-      const width = svgArgs.match(widthRegex)?.[0]?.split('"')?.[1];
-      console.log('*width', width);
-
-      // height 추출
-      const heightRegex = /height=".{1,9}"/g;
-      const height = svgArgs.match(heightRegex)?.[0]?.split('"')?.[1];
-      console.log('*height', height);
-
-      // viewBox 추출
-      const viewBoxRegex = /viewBox="[0-9\s-.]*"/;
-      const viewBox = svgArgs.match(viewBoxRegex)?.[0]?.split('"')?.[1];
-      console.log('*viewBox', viewBox);
-
-      // svgFill 추출
-      const fillRegex = /fill=".{1,9}"/g;
-      const svgFill = svgArgs.match(fillRegex)?.[0]?.split('"')?.[1];
-      console.log('*svgFill', svgFill);
-
-      // path args 추출
-      const pathStartRegex = /<path/g;
-      const paths = data
-        .split(pathStartRegex)
-        .filter((_, idx) => idx > 0)
-        .map((pathArgs) => {
-          // d 추출
-          const dRegex = /d=".*"/g;
-          const d = pathArgs.match(dRegex)?.[0]?.split('"')?.[1];
-          console.log('*d', d);
-
-          // pathFill 추출
-          const pathFill = pathArgs.match(fillRegex)?.[0]?.split('"')?.[1];
-          console.log('*pathFill', pathFill);
-
-          // fillRule 추출
-          const fillRuleRegex = /fill-rule=".{1,9}"/g;
-          const fillRule = pathArgs.match(fillRuleRegex)?.[0]?.split('"')?.[1];
-          console.log('*fillRule', fillRule);
-
-          // clipRule 추출
-          const clipRuleRegex = /clip-rule=".{1,9}"/g;
-          const clipRule = pathArgs.match(clipRuleRegex)?.[0]?.split('"')?.[1];
-          console.log('*clipRule', clipRule);
-
-          // stroke 추출
-          const strokeRegex = /stroke=".{1,9}"/g;
-          const stroke = pathArgs.match(strokeRegex)?.[0]?.split('"')?.[1];
-          console.log('*stroke', stroke);
-
-          // strokeWidth 추출
-          const strokeWidthRegex = /stroke-width=".{1,9}"/g;
-          const strokeWidth = pathArgs
-            .match(strokeWidthRegex)?.[0]
-            ?.split('"')?.[1];
-          console.log('*strokeWidth', strokeWidth);
-
-          // strokeLinecap 추출
-          const strokeLinecapRegex = /stroke-linecap=".{1,9}"/g;
-          const strokeLinecap = pathArgs
-            .match(strokeLinecapRegex)?.[0]
-            ?.split('"')?.[1];
-          console.log('*strokeLinecap', strokeLinecap);
-
-          // strokeLinejoin 추출
-          const strokeLinejoinRegex = /stroke-linejoin=".{1,9}"/g;
-          const strokeLinejoin = pathArgs
-            .match(strokeLinejoinRegex)?.[0]
-            ?.split('"')?.[1];
-          console.log('*strokeLinejoin', strokeLinejoin);
-
-          return {
-            d,
-            fill: pathFill,
-            fillRule,
-            clipRule,
-            stroke,
-            strokeWidth,
-            strokeLinecap,
-            strokeLinejoin,
-          };
-        });
-
-      // circle args 추출
-      const circleStartRegex = /<circle/g;
-      const circles = data
-        .split(circleStartRegex)
-        .filter((_, idx) => idx > 0)
-        .map((circleArgs) => {
-          // cx 추출
-          const cxRegex = /cx=".{1,9}"/g;
-          const cx = circleArgs.match(cxRegex)?.[0]?.split('"')?.[1];
-          console.log('*cx', cx);
-
-          // cy 추출
-          const cyRegex = /cy=".{1,9}"/g;
-          const cy = circleArgs.match(cyRegex)?.[0]?.split('"')?.[1];
-          console.log('*cy', cy);
-
-          // r 추출
-          const rRegex = /r=".{1,9}"/g;
-          const r = circleArgs.match(rRegex)?.[0]?.split('"')?.[1];
-          console.log('*r', r);
-
-          // circleFill 추출
-          const circleFill = circleArgs.match(fillRegex)?.[0]?.split('"')?.[1];
-          console.log('*circleFill', circleFill);
-
-          return { cx, cy, r, fill: circleFill };
-        });
-
-      const fileNameWithoutExtension = toCamelCase(
-        fileName.split(fileExtension)[0],
-      );
-      console.log('fileNameWithoutExtension', fileNameWithoutExtension);
-
-      icons[fileNameWithoutExtension] = {
-        width,
-        height,
-        viewBox,
-        fill: svgFill,
-        paths,
-        circles,
-      };
-      names[fileNameWithoutExtension] = fileNameWithoutExtension;
-
-      resolve();
-    });
-  });
-
-async function main() {
-  for (const svg of svgs) {
-    const extension = path.extname(svg);
-    if (extension === '.svg' && !svg.includes('NoConvert')) {
-      await readFile(`${inputDir}/${svg}`, svg, extension);
-    }
-  }
-
-  console.log('### icons', icons);
-  console.log('### names', names);
-
-  fs.writeFileSync(
-    `${outputDir}/iconmap.ts`,
-    `/* eslint-disable no-multiple-empty-lines */
-    /* eslint-disable no-trailing-spaces */
-    /* eslint-disable eol-last */
-    /* eslint-disable object-curly-spacing */
-    /* eslint-disable comma-spacing */
-    /* eslint-disable key-spacing */
-    /* eslint-disable quotes */
-    /* eslint-disable quote-props */
-    export const iconmap: {
-      [key: string]: {
-        width: string;
-        height: string;
-        viewBox: string;
-        fill: string;
-        paths: {
-          d: string;
-          fill?: string;
-          fillRule?: string;
-          clipRule?: string;
-          stroke?: string;
-          strokeWidth?: string;
-          strokeLinecap?: string;
-          strokeLinejoin?: string;
-        }[];
-        circles: {
-          cx: string;
-          cy: string;
-          r: string;
-          fill: string;
-        }[];
-      };
-    } = ${JSON.stringify(icons)};
-    export const ICONS = ${JSON.stringify(names)} as const;
-    export type TIcons = (typeof ICONS)[keyof typeof ICONS];
-    `,
-    'utf8',
-    (error) => {
-      if (error) throw error;
-    },
-  );
-}
-
-main();