1
0
mirror of https://github.com/axzilla/templui.git synced 2025-02-21 00:32:58 +00:00

refactor: seperate embed code snippets

This commit is contained in:
axzilla 2024-11-26 13:29:53 +07:00
parent 90f2cd4fb1
commit 2f68e5d9b8
21 changed files with 85 additions and 10014 deletions

View File

@ -0,0 +1,20 @@
package modules
templ CodeSnippet(content, language string) {
<div class="relative" x-data="{ copied: false }">
<pre class="!overflow-hidden">
<code x-ref="code" class={ "language-" + language, "!max-h-[501px] !overflow-y-auto rounded-md block" }>
{ content }
</code>
</pre>
<button
class="absolute top-2 right-2 bg-gray-700 hover:bg-gray-600 text-white font-bold py-1 px-2 rounded text-xs"
x-on:click="
navigator.clipboard.writeText($refs.code.textContent);
copied = true;
setTimeout(() => copied = false, 2001);
"
x-text="copied ? 'Copied!' : 'Copy'"
></button>
</div>
}

View File

@ -0,0 +1,11 @@
package modules
import "embed"
templ CodeSnippetFromEmbedded(filename, language string, embed embed.FS) {
if content, err := embed.ReadFile(filename); err != nil {
<div class="error">Error reading file: { filename }: { err.Error() }</div>
} else {
@CodeSnippet(string(content), language)
}
}

View File

@ -3,6 +3,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -24,12 +25,12 @@ templ Accordion() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("accordion.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("accordion.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("accordion.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("accordion.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -23,12 +24,12 @@ templ Alert() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("alert.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("alert.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("alert.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("alert.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -23,12 +24,12 @@ templ Avatar() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("avatar.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("avatar.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("avatar.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("avatar.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -1,8 +1,8 @@
package pages
import (
"embed"
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -24,12 +24,12 @@ templ Button() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("button.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("button.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("button.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("button.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",
@ -38,30 +38,3 @@ templ Button() {
</div>
}
}
templ CodeSnippetFromEmbedded(filename, language string, embed embed.FS) {
if content, err := embed.ReadFile(filename); err != nil {
<div class="error">Error reading file: { filename }: { err.Error() }</div>
} else {
@CodeSnippet(string(content), language)
}
}
templ CodeSnippet(content, language string) {
<div class="relative" x-data="{ copied: false }">
<pre class="!overflow-hidden">
<code x-ref="code" class={ "language-" + language, "!max-h-[501px] !overflow-y-auto rounded-md block" }>
{ content }
</code>
</pre>
<button
class="absolute top-2 right-2 bg-gray-700 hover:bg-gray-600 text-white font-bold py-1 px-2 rounded text-xs"
x-on:click="
navigator.clipboard.writeText($refs.code.textContent);
copied = true;
setTimeout(() => copied = false, 2001);
"
x-text="copied ? 'Copied!' : 'Copy'"
></button>
</div>
}

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -23,12 +24,12 @@ templ Card() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("card.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("card.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("card.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("card.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -23,12 +24,12 @@ templ Checkbox() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("checkbox.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("checkbox.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("checkbox.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("checkbox.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -23,12 +24,12 @@ templ Datepicker() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("datepicker.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("datepicker.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("datepicker.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("datepicker.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -1,9 +1,10 @@
package pages
import (
"github.com/axzilla/goilerplate/pkg/components"
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
templ DropdownMenu() {
@ -23,12 +24,12 @@ templ DropdownMenu() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("dropdown_menu.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("dropdown_menu.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("dropdown_menu.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("dropdown_menu.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -25,7 +26,7 @@ templ Icon() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("icon.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("icon.templ", "go", showcase.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -22,12 +23,12 @@ templ Input() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("input.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("input.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("input.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("input.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -23,12 +24,12 @@ templ Modal() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("modal.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("modal.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("modal.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("modal.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -23,12 +24,12 @@ templ RadioGroup() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("radio_group.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("radio_group.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("radio_group.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("radio_group.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -25,12 +26,12 @@ templ Select() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("select.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("select.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("select.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("select.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -23,12 +24,12 @@ templ Sheet() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("sheet.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("sheet.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("sheet.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("sheet.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -23,12 +24,12 @@ templ Slider() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("slider.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("slider.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("slider.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("slider.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -23,12 +24,12 @@ templ Tabs() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("tabs.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("tabs.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("tabs.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("tabs.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -23,12 +24,12 @@ templ Textarea() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("textarea.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("textarea.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("textarea.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("textarea.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

View File

@ -2,6 +2,7 @@ package pages
import (
"github.com/axzilla/goilerplate/internals/ui/layouts"
"github.com/axzilla/goilerplate/internals/ui/modules"
"github.com/axzilla/goilerplate/internals/ui/showcase"
"github.com/axzilla/goilerplate/pkg/components"
)
@ -25,12 +26,12 @@ templ Toggle() {
{
ID: "code",
Title: "Code",
Content: CodeSnippetFromEmbedded("toggle.templ", "go", showcase.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("toggle.templ", "go", showcase.TemplFiles),
},
{
ID: "component",
Title: "Component",
Content: CodeSnippetFromEmbedded("toggle.templ", "go", components.TemplFiles),
Content: modules.CodeSnippetFromEmbedded("toggle.templ", "go", components.TemplFiles),
},
},
TabsContainerClass: "md:w-1/2",

File diff suppressed because it is too large Load Diff