feat: first monorepo implementation

add core module with plugins support
add plugin custom-events package
add utils package
add plugin scroll-snap-fallback
configure eslint, stylelint, commitlint & textlint
setup a test suite
init docs
remove jekyll config

.eslintignore

@@ -0,0 +1,3 @@
+node_modules
+dist
+coverage

.eslintrc.js

@@ -0,0 +1,46 @@
+module.exports = {
+  root: true,
+  plugins: [
+    '@typescript-eslint',
+    'eslint-comments',
+    'monorepo',
+  ],
+  env: {
+    es6: true,
+    node: true,
+  },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:jest/recommended',
+    'plugin:jest/style',
+    'plugin:eslint-comments/recommended'
+  ],
+  overrides: [
+    {
+      files: ['**.ts'],
+      parser: '@typescript-eslint/parser',
+      parserOptions: {
+        sourceType: 'module',
+        project: [
+          './tsconfig.json',
+          './packages/*/tsconfig.json',
+        ],
+        tsconfigRootDir: __dirname,
+        warnOnUnsupportedTypeScriptVersion: false,
+        EXPERIMENTAL_useSourceOfProjectReferenceRedirect: true,
+      },
+      rules: {
+        '@typescript-eslint/explicit-module-boundary-types': 'off'
+      }
+    },
+    {
+      files: ['**/*.spec.ts'],
+      plugins: ['jest'],
+      rules: {
+        // allow console logs in tools and tests
+        'no-console': 'off',
+      },
+    },
+  ],
+};

.gitignore

@@ -1,3 +1,8 @@
 node_modules
 .cache
-report.html
+report.html
+.nyc_output
+.vscode
+dist
+docs/.vuepress/public/packages
+coverage

.postcssrc

@@ -8,4 +8,4 @@
       "clearReportedMessages": true
     }
   }
-}
+}

.stylelintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "stylelint-config-sass-guidelines"
+}

.textlintrc

@@ -0,0 +1,38 @@
+{
+  "filters": {
+    "comments": true
+  },
+  "rules": {
+    "@textlint-rule/no-unmatched-pair": true,
+    "abbr-within-parentheses": true,
+    "alex": {
+        "allow": []
+    },
+    "apostrophe": true,
+    "common-misspellings": {
+        "ignore": []
+    },
+    "en-capitalization": true,
+    "no-dead-link": {
+      "checkRelative": true,
+      "baseURI": 'https://localhost:8080/tiny-carousel/',
+      "ignore": [],
+      "preferGET": [],
+      "ignoreRedirects": false,
+      "retry": 2
+    },
+    "no-empty-section": true,
+    "no-start-duplicated-conjunction": true,
+    "no-todo": true,
+    "period-in-list-item": true,
+    "spelling": {
+        "language": "en",
+        "skipPatterns": ["JavaScript", "CDN", "frsource", "vanillaJS", "polyfills", "performant", "customizable"]
+    },
+    "stop-words": true,
+    "terminology": true,
+    "unexpanded-acronym": {
+      "ignore_acronyms" : ["CSS"]
+    }
+  }
+}

README.md

@@ -1,2 +1,4 @@
-# FRS-tiny-carousel
-Mobile & desktop-friendly, tiny, efficient (vanilaJS) carousel which takes advantage of CSS snap points (or polyfills it)!
+![Tiny carousel library logo](src/logo.png)
+
+# @frsource/tiny-carousel
+Mobile & desktop-friendly, tiny, efficient (vanillaJS) carousel which takes advantage of CSS snap points (or polyfills it)!

commitlint.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+  extends: ["@commitlint/config-conventional"]
+};

docs/.vuepress/components/Footer.vue

@@ -0,0 +1,23 @@
+<template>
+  <footer class="footer">
+    {{ text }} <NavLink :item="item" />
+  </footer>
+</template>
+
+<script>
+import NavLink from '@vuepress/theme-default/components/NavLink.vue'
+
+export default {
+  name: 'Footer',
+  components: { NavLink },
+  props: ['text', 'link'],
+  computed: {
+    item() {
+      return {
+        link: this.link.href,
+        text: this.link.text,
+      };
+    }
+  }
+};
+</script>

docs/.vuepress/components/HeroSection.vue

@@ -0,0 +1,42 @@
+<template>
+  <section class="hero footer">
+    <p class="hero-section">
+      <slot name="text" />
+    </p>
+    <NavLink
+      class="action-button"
+      :item="item"
+    />
+  </section>
+</template>
+
+<script>
+import NavLink from '@vuepress/theme-default/components/NavLink.vue'
+
+export default {
+  name: 'HeroSection',
+  components: { NavLink },
+  props: ['text', 'link'],
+  computed: {
+    item() {
+      return {
+        link: this.link.href,
+        text: this.link.text,
+      };
+    }
+  }
+};
+</script>
+
+<style scoped>
+.hero {
+  padding-left: 0;
+  display: flex;
+  align-items: center;
+  text-align: left;
+}
+
+.action-button {
+  margin-left: 2.5rem;
+}
+</style>

docs/.vuepress/components/NavLink.vue

@@ -0,0 +1,4 @@
+<script>
+import NavLink from '@vuepress/theme-default/components/NavLink.vue'
+export default NavLink;
+</script>

docs/.vuepress/config.js

@@ -0,0 +1,59 @@
+const getConfig = require("vuepress-bar");
+const { nav, sidebar } = getConfig();
+
+module.exports = {
+    title: 'Tiny carousel',
+    description: 'Plugin for i18next that paires well with Phrase In-Context Editor.',
+    base: '/tiny-carousel/',
+    themeConfig: {
+        logo: '/logo.svg',
+        nav: [
+            ...nav,
+            { text: 'Looking for Web wizards?', link: 'https://www.frsource.org/' }
+        ],
+        sidebar,
+        searchPlaceholder: 'Search in docs...',
+        repo: 'frsource/tiny-carousel',
+        docsDir: 'docs',
+        editLinks: true,
+        editLinkText: 'Help us improve this page on GitHub',
+        smoothScroll: true,
+        displayAllHeaders: true,
+        image: '/logo.jpg',
+        domain: 'https://www.frsource.org/tiny-carousel/'
+    },
+    head: [
+        ['link', { rel: 'preconnect', href: 'https://fonts.gstatic.com/' }],
+        ['link', { as: 'style', href: 'https://fonts.googleapis.com/css2?family=Titillium+Web&display=swap' }],
+        ['link', { rel: 'stylesheet', href: 'https://fonts.googleapis.com/css2?family=Titillium+Web&display=swap' }],
+    ],
+    plugins: [
+        '@vuepress/last-updated',
+        [
+            'vuepress-plugin-clean-urls',
+            {
+                normalSuffix: '/',
+                indexSuffix: '/',
+                notFoundPath: '/404.html',
+            },
+        ],
+        [
+            'seo',
+            {
+                title: ($page, $site) => $page.path === '/' ? $site.title : $page.title,
+                description: ($page, $site) => $page.frontmatter.description || $site.description,
+                type: $page => $page.path === '/' ? 'website' : 'article',
+                image: ($page, $site) => {
+                    const image = $page.frontmatter.image || $site.themeConfig.image;
+                    return image && ((!image.startsWith('http') && $site.themeConfig.domain || '') + image)
+                }
+            },
+        ],
+        [
+            () => ({
+                name: 'scroll-anchor-into-view-plugin',
+                clientRootMixin: require('path').resolve(__dirname, 'mixins', 'scrollAnchorIntoView.js')
+            })
+        ]
+    ],
+}

docs/.vuepress/mixins/scrollAnchorIntoView.js

@@ -0,0 +1,17 @@
+const scrollToHash = ($route, timeout) => {
+    setTimeout(() => {
+        if ($route.hash) {
+            const element = document.getElementById($route.hash.slice(1));
+
+            if (element && element.scrollIntoView) {
+                element.scrollIntoView();
+            }
+        }
+    }, timeout);
+};
+
+module.exports = {
+    mounted () {
+        scrollToHash(this.$route, 800);
+    }
+};

docs/.vuepress/styles/index.styl

@@ -0,0 +1,14 @@
+body
+    font-family 'Titillium Web', sans-serif
+
+input, textarea
+    font inherit
+
+.fw-normal
+    font-weight normal
+
+.badge 
+    font-weight 600
+
+.home h1
+    display none

docs/.vuepress/styles/palette.styl

@@ -0,0 +1,19 @@
+$accentColor = rgb(38, 166, 154)
+$textColor = #242A31
+$borderColor = rgb(230, 236, 241)
+$codeBgColor = #282c34
+$arrowBgColor = #ccc
+$badgeTipColor = rgb(38, 166, 154)
+$badgeWarningColor = darken(#ffe564, 35%)
+$badgeErrorColor = #DA5961
+
+// layout
+$navbarHeight = 3.6rem
+$sidebarWidth = 20rem
+$contentWidth = 740px
+$homePageWidth = 960px
+
+// responsive breakpoints
+$MQNarrow = 1151px
+$MQMobile = 919px
+$MQMobileNarrow = 419px