chore: change repository to monorepo

.editorconfig

@@ -2,7 +2,7 @@
 
 root = true
 
-[*.{md,json,html,css,scss,js}]
+[*.{json,md,html,css,scss,js,ts}]
 charset = utf-8
 indent_style = space
 indent_size = 2

.npmignore

@@ -0,0 +1,19 @@
+**.log
+
+.*-tmp
+.*-cache
+.DS_Store
+.git
+.idea
+.jekyll-metadata
+.tmp
+.vscode
+.editorconfig
+
+bower_components
+node_modules
+
+/test
+
+bower.json
+gulpfile.js

.prettierrc.json

@@ -0,0 +1,6 @@
+{
+  "printWidth": 120,
+  "singleQuote": true,
+  "semi": true,
+  "trailingComma": "all"
+}

README.md

@@ -1,13 +1,13 @@
 <p align="center">
-  <a href="https://oss.ourai.ws/petals/">
+  <a href="https://petals.fxxk.design/">
     <img src="https://avatars3.githubusercontent.com/u/73979619?s=200&v=4" alt="Petals logo" width="200">
   </a>
 </p>
 <h3 align="center">Petals</h3>
 <p align="center">
   Born for component-based front-end development, and provides atomic components for <a href="https://github.com/ourai/buds">Buds</a>.
   <br>
-  <a href="https://oss.ourai.ws/petals/docs/"><strong>Explore Petals docs »</strong></a>
+  <a href="https://petals.fxxk.design/"><strong>Explore Petals docs »</strong></a>
 </p>
 
 ## Composition

bower.json

@@ -0,0 +1,34 @@
+{
+  "name": "petals-basic",
+  "homepage": "https://github.com/petals/basic",
+  "authors": [
+    "Ourai Lin <[email protected]>"
+  ],
+  "description": "CSS framework following SUIT CSS naming conventions",
+  "main": [
+    "scss/_all.scss",
+    "css/all.css"
+  ],
+  "keywords": [
+    "css",
+    "sass",
+    "scss",
+    "helper"
+  ],
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "*.json",
+    "*.log",
+    "*.md",
+    "gulpfile.js",
+    "bower_components",
+    "node_modules",
+    "test",
+    "tests"
+  ],
+  "devDependencies": {
+    "suitcss-sass-0.1.0": "suitcss-sass#0.1.0",
+    "trick-1.0.3": "packagent/trick#1.0.3"
+  }
+}

build/tasks/compile.js

@@ -0,0 +1,94 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+const gulp = require('gulp');
+const concat = require('gulp-concat');
+const rename = require('gulp-rename');
+const sass = require('gulp-sass');
+const scssimport = require('gulp-shopify-sass');
+const cssmin = require('gulp-cssmin');
+const stripCssComments = require('gulp-strip-css-comments');
+const sourcemaps = require('gulp-sourcemaps');
+const { exec } = require('child_process');
+
+const { DIST_DIR, ENTRY_POINTS } = require('./helper');
+
+const tasks = [];
+const ALL_FILE_NAME = '_all.scss';
+
+ENTRY_POINTS.forEach(name => {
+  const taskName = `compile-scss-${name}`;
+
+  tasks.push(taskName);
+
+  gulp.task(taskName, () => {
+    return gulp
+      .src(`src/style/_${name}.scss`)
+      .pipe(concat(`${name}.scss`))
+      .pipe(
+        sass({ outputStyle: 'expanded', noLineComments: true, keepSpecialComments: 0 }).on(
+          'error',
+          sass.logError,
+        ),
+      )
+      .pipe(stripCssComments({ preserve: false }))
+      .pipe(gulp.dest(DIST_DIR));
+  });
+});
+
+gulp.task('concat-entry-points', () =>
+  gulp
+    .src(ENTRY_POINTS.map(entry => `src/style/_${entry}.scss`))
+    .pipe(concat(ALL_FILE_NAME))
+    .pipe(scssimport())
+    .pipe(
+      rename(p => {
+        p.basename = p.basename.replace('.cat.scss', '');
+        p.extname = '.scss';
+      }),
+    )
+    .pipe(gulp.dest(DIST_DIR)),
+);
+
+gulp.task(
+  'compile-scss-all',
+  gulp.series('concat-entry-points', () =>
+    gulp
+      .src(`${DIST_DIR}/${ALL_FILE_NAME}`)
+      .pipe(concat(ALL_FILE_NAME.replace('_', '')))
+      .pipe(
+        sass({ outputStyle: 'expanded', noLineComments: true, keepSpecialComments: 0 }).on(
+          'error',
+          sass.logError,
+        ),
+      )
+      .pipe(stripCssComments({ preserve: false }))
+      .pipe(gulp.dest(DIST_DIR)),
+  ),
+);
+
+tasks.push('compile-scss-all');
+
+gulp.task(
+  'compress',
+  gulp.series(gulp.parallel(...tasks), () =>
+    gulp
+      .src(`${DIST_DIR}/**/*.css`, { base: DIST_DIR })
+      .pipe(sourcemaps.init({ largeFile: true, loadMaps: true }))
+      .pipe(cssmin())
+      .pipe(rename({ suffix: '.min' }))
+      .pipe(sourcemaps.write(''))
+      .pipe(gulp.dest(DIST_DIR)),
+  ),
+);
+
+gulp.task(
+  'compile',
+  gulp.series('compress', () => {
+    const paths = [...ENTRY_POINTS, 'all'].map(entry => `${DIST_DIR}/${entry}.css`);
+
+    return exec(`rm -rf ${paths.join(' ')}`);
+  }),
+);
+
+module.exports = {
+  COMPILE_TASKS: ['compile'],
+};

build/tasks/extract.js

@@ -0,0 +1,23 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+const gulp = require('gulp');
+const scssimport = require('gulp-shopify-sass');
+const rename = require('gulp-rename');
+
+const { DIST_DIR } = require('./helper');
+
+gulp.task('extract-scss', () => {
+  return gulp
+    .src('src/style/*.scss')
+    .pipe(scssimport())
+    .pipe(
+      rename(p => {
+        p.basename = p.basename.replace('.cat.scss', '');
+        p.extname = '.scss';
+      }),
+    )
+    .pipe(gulp.dest(DIST_DIR));
+});
+
+module.exports = {
+  EXTRACT_TASKS: ['extract-scss'],
+};

build/tasks/helper.js

@@ -0,0 +1,7 @@
+const DIST_DIR = 'dist/style';
+const ENTRY_POINTS = ['base', 'utils'];
+
+module.exports = {
+  DIST_DIR,
+  ENTRY_POINTS,
+};

build/tasks/index.js

@@ -0,0 +1,8 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+const { COMPILE_TASKS } = require('./compile');
+const { EXTRACT_TASKS } = require('./extract');
+
+module.exports = {
+  COMPILE_TASKS,
+  EXTRACT_TASKS,
+};

gulpfile.js

@@ -0,0 +1,6 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+const gulp = require('gulp');
+
+const { COMPILE_TASKS, EXTRACT_TASKS } = require('./build/tasks');
+
+gulp.task('default', gulp.parallel(...EXTRACT_TASKS, ...COMPILE_TASKS));