Bump deps

package.json

@@ -22,7 +22,7 @@
     "README.md"
   ],
   "engines": {
-    "node": ">=4.8.7"
+    "node": ">=10"
   },
   "keywords": [
     "liquid",
@@ -36,35 +36,35 @@
   },
   "homepage": "https://github.com/harttle/liquidjs-section-tags#readme",
   "devDependencies": {
-    "@semantic-release/changelog": "^3.0.2",
-    "@semantic-release/commit-analyzer": "^6.1.0",
-    "@semantic-release/git": "^7.0.8",
-    "@semantic-release/npm": "^5.1.8",
-    "@semantic-release/release-notes-generator": "^7.1.4",
+    "@semantic-release/changelog": "^5.0.1",
+    "@semantic-release/commit-analyzer": "^8.0.1",
+    "@semantic-release/git": "^9.0.0",
+    "@semantic-release/npm": "^7.0.8",
+    "@semantic-release/release-notes-generator": "^9.0.1",
     "@types/chai": "^4.1.7",
     "@types/chai-as-promised": "^7.1.0",
-    "@types/mocha": "^5.2.6",
-    "@typescript-eslint/eslint-plugin": "^1.11.0",
-    "@typescript-eslint/parser": "^1.11.0",
+    "@types/mocha": "^8.0.4",
+    "@typescript-eslint/eslint-plugin": "^4.8.1",
+    "@typescript-eslint/parser": "^4.8.1",
     "benchmark": "^2.1.4",
     "chai": "^4.2.0",
     "chai-as-promised": "^7.1.1",
     "coveralls": "^3.0.2",
-    "eslint": "^5.12.1",
-    "eslint-config-standard": "^12.0.0",
+    "eslint": "^7.14.0",
+    "eslint-config-standard": "^16.0.2",
     "eslint-plugin-import": "^2.15.0",
-    "eslint-plugin-mocha": "^5.3.0",
-    "eslint-plugin-node": "^8.0.1",
+    "eslint-plugin-mocha": "^8.0.0",
+    "eslint-plugin-node": "^11.1.0",
     "eslint-plugin-promise": "^4.0.1",
-    "eslint-plugin-standard": "^4.0.0",
-    "liquidjs": "^8.4.0",
-    "mocha": "^5.2.0",
-    "nyc": "^13.1.0",
-    "regenerator-runtime": "^0.12.1",
-    "semantic-release": "^15.13.14",
-    "ts-node": "^8.0.2",
-    "tslib": "^1.9.3",
-    "typescript": "^3.3.3"
+    "eslint-plugin-standard": "^4.1.0",
+    "liquidjs": "^9.16.1",
+    "mocha": "^8.2.1",
+    "nyc": "^15.1.0",
+    "regenerator-runtime": "^0.13.7",
+    "semantic-release": "^17.2.4",
+    "ts-node": "^9.0.0",
+    "tslib": "^2.0.3",
+    "typescript": "^4.1.2"
   },
   "release": {
     "branch": "master",
@@ -82,6 +82,10 @@
       ".ts"
     ]
   },
+  "mocha": {
+    "require": "ts-node/register/transpile-only",
+    "strict": "strict"
+  },
   "dependencies": {
     "sass": "^1.22.7"
   }

prettier.config.js

@@ -0,0 +1,5 @@
+module.exports = {
+  singleQuote: true,
+  semi: false,
+  trailingComma: 'none'
+}

src/index.ts

@@ -1,4 +1,4 @@
-import Liquid from 'liquidjs'
+import { Liquid } from 'liquidjs'
 import { sectionTag } from './section'
 import { Schema } from './schema'
 import { StyleSheet } from './stylesheet'
@@ -9,10 +9,11 @@ interface SectionOptions {
   root?: string;
 }
 
-export function liquidSectionTags (options: Partial<SectionOptions> = {}) {
+export function liquidSectionTags (options: Partial<SectionOptions> = {}): (this: Liquid) => void {
   const opts = Object.assign({
     root: 'sections'
   }, options)
+
   return function (this: Liquid) {
     this.registerTag('section', sectionTag(opts.root))
     this.registerTag('schema', Schema)

src/javascript.ts

@@ -1,19 +1,23 @@
-export const JavaScript = {
-  parse: function (token, remainTokens) {
+import { TagToken, TopLevelToken } from 'liquidjs'
+import { TagImplOptions } from 'liquidjs/dist/template/tag/tag-impl-options'
+
+export const JavaScript: TagImplOptions = {
+  parse: function (tagToken: TagToken, remainTokens: TopLevelToken[]): void {
     this.tokens = []
     const stream = this.liquid.parser.parseStream(remainTokens)
     stream
-      .on('token', (token) => {
+      .on('token', (token: TagToken) => {
         if (token.name === 'endjavascript') stream.stop()
         else this.tokens.push(token)
       })
       .on('end', () => {
-        throw new Error(`tag ${token.raw} not closed`)
+        throw new Error(`tag ${tagToken.getText()} not closed`)
       })
     stream.start()
   },
-  render: async function (ctx, hash) {
-    const text = this.tokens.map((token) => token.raw).join('')
+  render: function (): string {
+    const text = this.tokens.map((token) => token.getText()).join('')
+
     return `<script>${text}</script>`
   }
 }

src/schema.ts

@@ -1,19 +1,23 @@
-export const Schema = {
-  parse: function (tagToken, remainTokens) {
+import { TagToken, TopLevelToken } from 'liquidjs'
+import { TagImplOptions } from 'liquidjs/dist/template/tag/tag-impl-options'
+
+export const Schema: TagImplOptions = {
+  parse: function (tagToken: TagToken, remainTokens: TopLevelToken[]) {
     this.tokens = []
     const stream = this.liquid.parser.parseStream(remainTokens)
     stream
-      .on('token', (token) => {
-        if (token.name === 'endschema') stream.stop()
-        else this.tokens.push(token)
+      .on('token', (token: TagToken) => {
+        if (token.name === 'endschema') {
+          stream.stop()
+        } else this.tokens.push(token)
       })
       .on('end', () => {
-        throw new Error(`tag ${tagToken.raw} not closed`)
+        throw new Error(`tag ${tagToken.getText()} not closed`)
       })
     stream.start()
   },
   render: function () {
-    const json = this.tokens.map((token) => token.raw).join('')
+    const json = this.tokens.map((token) => token.getText()).join('')
     const schema = JSON.parse(json)
     console.log('schema:', schema)
     return ''

src/section.ts

@@ -1,23 +1,27 @@
+import { TagImplOptions } from 'liquidjs'
 import { join } from 'path'
 
 const quoted = /^'[^']*'|"[^"]*"$/
 
-export function sectionTag (root: string) {
+export function sectionTag (root: string): TagImplOptions {
   return {
     parse: function (token) {
       this.namestr = token.args
     },
-    render: async function (ctx, hash) {
+    render: async function (ctx) {
       let name
       if (quoted.exec(this.namestr)) {
         const template = this.namestr.slice(1, -1)
-        name = await this.liquid.parseAndRender(template, ctx.getAll(), ctx.opts)
+        name = await this.liquid.parseAndRender(
+          template,
+          ctx.getAll(),
+          ctx.opts
+        )
       }
-      if (!name) throw new Error(`cannot include with empty filename`)
+      if (!name) throw new Error('cannot include with empty filename')
 
       const filepath = join(root, name)
-      const templates = await this.liquid.getTemplate(filepath)
-      return this.liquid.render(templates)
+      return await this.liquid.renderFile(filepath)
     }
   }
 }

src/stylesheet.ts

@@ -1,37 +1,42 @@
+import { TagImplOptions, TagToken, TopLevelToken } from 'liquidjs'
 import { render } from 'sass'
 
 const quoted = /^'[^']*'|"[^"]*"$/
 
 const processors = {
-  '': x => x,
-  'sass': sassProcessor,
-  'scss': sassProcessor
+  '': (x) => x,
+  sass: sassProcessor,
+  scss: sassProcessor
 }
 
-export const StyleSheet = {
-  parse: function (token, remainTokens) {
+export const StyleSheet: TagImplOptions = {
+  parse: function (token: TagToken, remainTokens: TopLevelToken[]) {
     this.processor = token.args
 
     this.tokens = []
     const stream = this.liquid.parser.parseStream(remainTokens)
     stream
-      .on('token', (token) => {
+      .on('token', (token: TagToken) => {
         if (token.name === 'endstylesheet') stream.stop()
         else this.tokens.push(token)
       })
       .on('end', () => {
-        throw new Error(`tag ${token.raw} not closed`)
+        throw new Error(`tag ${token.getText()} not closed`)
       })
     stream.start()
   },
-  render: async function (ctx, hash) {
+  render: async function (ctx) {
     let processor = ''
     if (quoted.exec(this.processor)) {
       const template = this.processor.slice(1, -1)
-      processor = await this.liquid.parseAndRender(template, ctx.getAll(), ctx.opts)
+      processor = await this.liquid.parseAndRender(
+        template,
+        ctx.getAll(),
+        ctx.opts
+      )
     }
 
-    const text = this.tokens.map((token) => token.raw).join('')
+    const text = this.tokens.map((token) => token.getText()).join('')
 
     const p = processors[processor]
     if (!p) throw new Error(`processor for ${processor} not found`)
@@ -41,8 +46,9 @@ export const StyleSheet = {
 }
 
 function sassProcessor (data: string) {
-  return new Promise((resolve, reject) => render(
-    { data },
-    (err, result) => err ? reject(err) : resolve('' + result.css))
+  return new Promise((resolve, reject) =>
+    render({ data }, (err, result) =>
+      err ? reject(err) : resolve('' + result.css)
+    )
   )
 }

test/javascript.ts

@@ -1,16 +1,19 @@
-import Liquid from 'liquidjs'
 import { expect } from 'chai'
-import { liquidSectionTags } from '../src/index'
+import { Liquid } from 'liquidjs'
 import { resolve } from 'path'
+import { liquidSectionTags } from '../src/index'
 
 describe('javascript', function () {
   let liquid: Liquid
   before(function () {
     liquid = new Liquid({ extname: '.liquid' })
-    liquid.plugin(liquidSectionTags({
-      root: resolve(__dirname, './stub/sections')
-    }))
+    liquid.plugin(
+      liquidSectionTags({
+        root: resolve(__dirname, './stub/sections')
+      })
+    )
   })
+
   it('should load javascript', async () => {
     const html = await liquid.parseAndRender('{% section "js" %}')
     expect(html).to.equal('<script>\nconsole.log("foo")\n</script>')

test/schema.ts

@@ -1,16 +1,18 @@
-import Liquid from 'liquidjs'
+import { Liquid } from 'liquidjs'
 import { expect } from 'chai'
 import { liquidSectionTags } from '../src/index'
 import { resolve } from 'path'
 
 describe('schema', function () {
   let liquid: Liquid
+
   before(function () {
     liquid = new Liquid({ extname: '.liquid' })
     liquid.plugin(liquidSectionTags({
       root: resolve(__dirname, './stub/sections')
     }))
   })
+
   it('should allow empty schema', async () => {
     const html = await liquid.parseAndRender('{% section "empty-schema" %}')
     expect(html).to.equal('BA')

test/section.ts

@@ -1,16 +1,18 @@
-import Liquid from 'liquidjs'
+import { Liquid } from 'liquidjs'
 import { expect } from 'chai'
 import { liquidSectionTags } from '../src/index'
 import { resolve } from 'path'
 
 describe('section', function () {
   let liquid: Liquid
+
   before(function () {
     liquid = new Liquid({ extname: '.liquid' })
     liquid.plugin(liquidSectionTags({
       root: resolve(__dirname, './stub/sections')
     }))
   })
+
   it('should render section', async () => {
     const html = await liquid.parseAndRender('B{% section "foo" %}A')
     expect(html).to.equal('BFOOA')

test/stub/sections/schema-settings.liquid

@@ -0,0 +1,25 @@
+{{ section.settings.first_title }}
+
+{% schema %}
+  {
+    "name": "Footer",
+    "settings": [
+      {
+        "type": "header",
+        "content": "First Menu"
+      },
+      {
+        "type": "checkbox",
+        "id": "first_menu_enable",
+        "label": "Enable Menu",
+        "default": true
+      },
+      {
+        "type": "text",
+        "id": "first_title",
+        "label": "Menu Title",
+        "default": "Menu 1"
+      }
+    ]
+  }
+{% endschema %}

test/stylesheet.ts

@@ -1,20 +1,24 @@
-import Liquid from 'liquidjs'
 import { expect } from 'chai'
-import { liquidSectionTags } from '../src/index'
+import { Liquid } from 'liquidjs'
 import { resolve } from 'path'
+import { liquidSectionTags } from '../src/index'
 
 describe('stylesheet', function () {
   let liquid: Liquid
   before(function () {
     liquid = new Liquid({ extname: '.liquid' })
-    liquid.plugin(liquidSectionTags({
-      root: resolve(__dirname, './stub/sections')
-    }))
+    liquid.plugin(
+      liquidSectionTags({
+        root: resolve(__dirname, './stub/sections')
+      })
+    )
   })
+
   it('should load plain css', async () => {
     const html = await liquid.parseAndRender('{% section "css" %}')
     expect(html).to.equal('<style>\n.foo .bar {\n  text: center;\n}\n</style>')
   })
+
   it('should compile scss', async () => {
     const html = await liquid.parseAndRender('{% section "scss" %}')
     expect(html).to.equal('<style>.foo .bar {\n  text: center;\n}</style>')

tsconfig.json

@@ -1,9 +1,9 @@
 {
   "compilerOptions": {
-    "target": "es6",
-    "module":"CommonJS",
-    "lib": ["es2015", "es2016", "es2017"],
-    "moduleResolution": "Node",
+    "target": "es2018",
+    "module":"commonjs",
+    "lib": ["es2015", "es2016", "es2017", "es2018"],
+    "moduleResolution": "node",
     "outDir": "dist",
     "declaration": true,
     "allowSyntheticDefaultImports": true,