kuba/strona-czynna
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Background wrapper JDD component. New jdd-editor with improved booleans.

Browse Source
This commit is contained in:
Kuba Orlik 2026-08-06 21:38:56 +02:00
parent 9475ec90a5
commit 5e5320e5a8
5 changed files with 90 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
package-lock.json generated
View File

@ -15,7 +15,7 @@
"@sealcode/add-to-head": "^1.0.0",
"@sealcode/file-manager": "^1.0.2",
"@sealcode/jdd": "^0.8.10",
"@sealcode/jdd-editor": "^0.2.32",
"@sealcode/jdd-editor": "^0.2.33",
"@sealcode/monaco-wrapper": "^0.0.12",
"@sealcode/sealgen": "^0.19.21",
"@sealcode/show-first-row": "^0.1.0",
@ -1380,9 +1380,9 @@
}
},
"node_modules/@sealcode/jdd-editor": {
"version": "0.2.32",
"resolved": "https://registry.npmjs.org/@sealcode/jdd-editor/-/jdd-editor-0.2.32.tgz",
"integrity": "sha512-m+Dz9KfIijR/7Z0I7VIhl6u4iY8vEyeK7Ske/odt6jrbVVrCZ00Kz8Ixs67TYsBeKN0pPIiX74l7TGV/m386xw==",
"version": "0.2.33",
"resolved": "https://registry.npmjs.org/@sealcode/jdd-editor/-/jdd-editor-0.2.33.tgz",
"integrity": "sha512-CrjeBbX6SvAZ9epd4jWf279FyktMKWg9yIY6RzH9eA3MGJLnwzJCjS5QTByhmE5PpO9UQTtTAaOr0U+FE4CTjQ==",
"dependencies": {
"@koa/router": "^13.1.0",
"@sealcode/jdd": "^0.8.10",
@ -16016,9 +16016,9 @@
}
},
"@sealcode/jdd-editor": {
"version": "0.2.32",
"resolved": "https://registry.npmjs.org/@sealcode/jdd-editor/-/jdd-editor-0.2.32.tgz",
"integrity": "sha512-m+Dz9KfIijR/7Z0I7VIhl6u4iY8vEyeK7Ske/odt6jrbVVrCZ00Kz8Ixs67TYsBeKN0pPIiX74l7TGV/m386xw==",
"version": "0.2.33",
"resolved": "https://registry.npmjs.org/@sealcode/jdd-editor/-/jdd-editor-0.2.33.tgz",
"integrity": "sha512-CrjeBbX6SvAZ9epd4jWf279FyktMKWg9yIY6RzH9eA3MGJLnwzJCjS5QTByhmE5PpO9UQTtTAaOr0U+FE4CTjQ==",
"requires": {
"@koa/router": "^13.1.0",
"@sealcode/jdd": "^0.8.10",

2
package.json
View File

@ -98,7 +98,7 @@
"@sealcode/add-to-head": "^1.0.0",
"@sealcode/file-manager": "^1.0.2",
"@sealcode/jdd": "^0.8.10",
"@sealcode/jdd-editor": "^0.2.32",
"@sealcode/jdd-editor": "^0.2.33",
"@sealcode/monaco-wrapper": "^0.0.12",
"@sealcode/sealgen": "^0.19.21",
"@sealcode/show-first-row": "^0.1.0",

31
src/back/jdd-components/background-wrapper/background-wrapper.css Normal file
View File

@ -0,0 +1,31 @@
.background-wrapper {
grid-column: screen;
display: grid;
grid-template-columns: subgrid;
--vertical-padding: 16px;
padding: var(--vertical-padding) 0;
& > * {
grid-column: content;
}
&.background-wrapper--grow-height {
min-height: 80vh;
align-content: center;
}
&.background-wrapper--variant1 {
background-color: var(--color-brand-accent);
--color-brand-text-bg: var(--color-brand-accent);
color: var(--color-brand-text-on-accent);
--color-brand-text-fg: var(--color-brand-text-on-accent);
}
&.background-wrapper--variant2 {
background-color: var(--color-brand-accent2);
--color-brand-text-bg: var(--color-brand-accent2);
color: var(--color-brand-text-on-accent2);
--color-brand-text-fg: var(--color-brand-text-on-accent2);
}
}

48
src/back/jdd-components/background-wrapper/background-wrapper.jdd.tsx Normal file
View File

@ -0,0 +1,48 @@
import { TempstreamJSX } from "tempstream";
import type {
ComponentToHTMLArgs,
ExtractStructuredComponentArgumentsParsed,
JDDContext,
} from "@sealcode/jdd";
import { Component, ComponentArguments } from "@sealcode/jdd";
export const background_variants = ["variant1", "variant2"];
const component_arguments = {
variant: new ComponentArguments.Enum(background_variants),
grow_to_screen_height: new ComponentArguments.Boolean(),
content: new ComponentArguments.NestedComponent(),
} as const;
export class BackgroundWrapper extends Component<typeof component_arguments> {
getArguments() {
return component_arguments;
}
getCSSClumps(
jdd_context: JDDContext,
args: ExtractStructuredComponentArgumentsParsed<typeof component_arguments>
) {
const result = [...(args?.content?.getCSSClumps(jdd_context) || [])];
return result;
}
async toHTML({
args: { variant, content, grow_to_screen_height },
classes,
jdd_context,
}: ComponentToHTMLArgs<typeof component_arguments>): Promise<string> {
return (
<div
class={[
"background-wrapper",
`background-wrapper--${variant}`,
{ "background-wrapper--grow-height": grow_to_screen_height },
...classes,
]}
>
{content.render(jdd_context)}
</div>
);
}
}

3
src/front/controllers.ts
View File

@ -19,6 +19,9 @@ application.register("horizontal-scroller", HorizontalScroller);
import { default as AutogrowTextarea } from "./../../node_modules/@sealcode/jdd-editor/src/controllers/autogrow-textarea.stimulus.js";
application.register("autogrow-textarea", AutogrowTextarea);
import { default as Autosubmit } from "./../../node_modules/@sealcode/jdd-editor/src/controllers/autosubmit.stimulus.js";
application.register("autosubmit", Autosubmit);
import { default as CodeSnippet } from "./../../node_modules/@sealcode/jdd-editor/src/controllers/code-snippet.stimulus.js";
application.register("code-snippet", CodeSnippet);