Expose code raw

tikui · Aug 23, 2024 · 41aa67c · 41aa67c
1 parent 78f3137
commit 41aa67c
Show file tree

Hide file tree

Showing 10 changed files with 21 additions and 15 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@tikui/core",
- "version": "6.1.1",
+ "version": "6.2.0",
  "description": "Tikui core",
  "main": "src/tikui.js",
  "scripts": {

diff --git a/src/filters/Documentation.ts b/src/filters/Documentation.ts
@@ -1,4 +1,4 @@
-export type Code = (escaped: string, escapedPug: string) => string;
+export type Code = (escaped: string, escapedPug: string, htmlRaw: string, pugRaw: string) => string;
 export type Render = (src: string) => string;
 export type Markdown = () => string;
 

diff --git a/src/filters/component-doc.ts b/src/filters/component-doc.ts
@@ -2,9 +2,11 @@ import { docUtils } from './doc-utils';
 import { ComponentOptions, Render, Code } from './Documentation';
 import * as documentationTemplates from './documentation-templates';
 
-const templateCode: Code = (escaped, escapedPug): string => documentationTemplates.code({
+const templateCode: Code = (escaped, escapedPug, htmlRaw, pugRaw): string => documentationTemplates.code({
  htmlCode: escaped,
  pugCode: escapedPug,
+ htmlRaw,
+ pugRaw,
 });
 
 const render = (height: string): Render => (src) => documentationTemplates.componentRender({

diff --git a/src/filters/doc-utils.ts b/src/filters/doc-utils.ts
@@ -20,7 +20,7 @@ const getCode = (filename: string) => (code: Code): string => {
  const renderedPug = htmlToPug(rendered);
  const escapedPug = escapeHtml(renderedPug);
 
- return code(escaped, escapedPug);
+ return code(escaped, escapedPug, rendered, renderedPug);
 };
 
 const getRender = (filename: string) => (template: Render): string => {

diff --git a/src/filters/documentation-templates.ts b/src/filters/documentation-templates.ts
@@ -26,6 +26,8 @@ interface TemplateRenderVariables {
 interface CodeVariables {
  htmlCode: string;
  pugCode: string;
+ htmlRaw: string;
+ pugRaw: string;
 }
 
 type Component = (variables: ComponentVariables) => string;

diff --git a/src/filters/template-doc.ts b/src/filters/template-doc.ts
@@ -2,9 +2,11 @@ import { docUtils } from './doc-utils';
 import { Render, Code, TemplateOptions } from './Documentation';
 import * as documentationTemplates from './documentation-templates';
 
-const code: Code = (escaped, escapedPug) => documentationTemplates.code({
+const code: Code = (escaped, escapedPug, htmlRaw, pugRaw) => documentationTemplates.code({
  htmlCode: escaped,
  pugCode: escapedPug,
+ htmlRaw,
+ pugRaw,
 });
 
 const render: Render = (src) => documentationTemplates.templateRender({

diff --git a/test/CommandLine.spec.ts b/test/CommandLine.spec.ts
@@ -192,19 +192,19 @@ describe('Command line usage', () => {
  const expectExistsFile = expectExistingPath(faketikuiSelf.dist);
  const stringContent = stringContaining(faketikuiSelf.dist);
 
- const out = buildTikui(faketikuiSelf);
+ buildTikui(faketikuiSelf);
 
  expectExistsFile('index.html');
  expectExistsFile('tikui.css');
 
  const indexContent = stringContent('index.html');
- expect(indexContent).toMatch(/<div class="self-component--code">[^]*<div class="self-code">[^]*<div class="self-code--html">[^]*component-class[^]*<\/div>/);
- expect(indexContent).toMatch(/<div class="self-component--code">[^]*<div class="self-code">[^]*<div class="self-code--pug">[^]*\.component-class[^]*<\/div>/);
+ expect(indexContent).toMatch(/<div class="self-component--code">[^]*<div class="self-code">[^]*<div class="self-code--html" data-code-text="[^]*&quot;component-class&quot;&gt;Component code&lt;[^]*">[^]*component-class[^]*<\/div>/);
+ expect(indexContent).toMatch(/<div class="self-component--code">[^]*<div class="self-code">[^]*<div class="self-code--pug" data-code-text="[^]*\.component-class Component code[^]*">[^]*\.component-class[^]*<\/div>/);
  expect(indexContent).toMatch(/<div class="self-component--markdown">[^]*<h2.*>Component Markdown<\/h2>[^]*<\/div>/);
  expect(indexContent).toMatch(/<div class="self-component--render">[^]*<iframe class="self-component-iframe.*"><\/iframe>/);
 
- expect(indexContent).toMatch(/<div class="self-template--code">[^]*<div class="self-code">[^]*<div class="self-code--html">[^]*template-class[^]*<\/div>/);
- expect(indexContent).toMatch(/<div class="self-template--code">[^]*<div class="self-code">[^]*<div class="self-code--pug">[^]*\.template-class[^]*<\/div>/);
+ expect(indexContent).toMatch(/<div class="self-template--code">[^]*<div class="self-code">[^]*<div class="self-code--html" data-code-text="[^]*&quot;template-class&quot;&gt;Template code&lt;[^]*">[^]*template-class[^]*<\/div>/);
+ expect(indexContent).toMatch(/<div class="self-template--code">[^]*<div class="self-code">[^]*<div class="self-code--pug" data-code-text="[^]*\.template-class Template code[^]*">[^]*\.template-class[^]*<\/div>/);
  expect(indexContent).toMatch(/<div class="self-template--markdown">[^]*<h2.*>Template Markdown<\/h2>[^]*<\/div>/);
  expect(indexContent).toMatch(/<div class="self-template--render">[^]*<a class="self-button".*>Show<\/a>/);
  });

diff --git a/test/faketikui-self/part/code.pug b/test/faketikui-self/part/code.pug
@@ -1,3 +1,3 @@
 .self-code
- .self-code--html !{htmlCode}
- .self-code--pug !{pugCode}
+ .self-code--html(data-code-text=htmlRaw) !{htmlCode}
+ .self-code--pug(data-code-text=pugRaw) !{pugCode}
diff --git a/test/filters/DocumentationTemplates.spec.ts b/test/filters/DocumentationTemplates.spec.ts
@@ -23,7 +23,7 @@ describe('Documentation Templates', () => {
  expect(result).toContain('/path/to/template');
  });
  it('Should compile code', () => {
- const result = code({htmlCode: 'HTML example', pugCode: 'pug example'});
+ const result = code({htmlCode: 'HTML example', pugCode: 'pug example', htmlRaw: 'HTML raw example', pugRaw: 'pug raw example'});
  expect(result).toContain('HTML example');
  expect(result).toContain('pug example');
  });