aboutsummaryrefslogtreecommitdiff
path: root/static/widgets/editable/index.js
diff options
context:
space:
mode:
authorNathan Reiner <nathan@nathanreiner.xyz>2026-05-20 10:16:50 +0200
committerNathan Reiner <nathan@nathanreiner.xyz>2026-05-20 10:16:50 +0200
commit44445734ba4a0f05564f808c2fd34a7f23c6fafb (patch)
tree3bd22add718620cbf931286f55137bcc666100be /static/widgets/editable/index.js
parent95ae9f15e1db335a7f8358d811ea37e2c89dd10f (diff)
Let's do a rewrite!
Created project structure and changed `build.zig` and added licence.
Diffstat (limited to 'static/widgets/editable/index.js')
-rw-r--r--static/widgets/editable/index.js77
1 files changed, 0 insertions, 77 deletions
diff --git a/static/widgets/editable/index.js b/static/widgets/editable/index.js
deleted file mode 100644
index b7e24de..0000000
--- a/static/widgets/editable/index.js
+++ /dev/null
@@ -1,77 +0,0 @@
-import icons from 'icons';
-import * as sfw from 'sfw';
-const { Div, Label, Input } = sfw.element.native;
-
-import stylesheet from './index.css';
-
-const css = await sfw.css.sheet(stylesheet);
-
-export default class Editable extends sfw.element.Container {
- #label
- #input
- #edit
-
- constructor() {
- super({ css });
-
- this.onupdate = () => {};
-
- this.body.append(
- Div.new({
- id: 'container',
- children: [
- this.#label = Label.new({ htmlFor: 'input' }),
- this.#input = Input.new({
- readOnly: true,
- onkeydown: (e) => {
- if (e.key === 'Enter') {
- this.#input.readOnly = true;
- this.#update()
- this.onupdate();
- }
- },
- }),
- this.#edit = Div.new({
- id: 'edit',
- children: [ icons.edit ],
- onclick: () => {
- this.#input.readOnly = !this.#input.readOnly;
- this.#update();
-
- if (this.#input.readOnly) {
- this.onupdate();
- }
- }
- }),
- ],
- })
- );
- }
-
- #update() {
- this.#edit.innerHTML = '';
- this.#edit.append(
- this.#input.readOnly ? icons.edit : icons.check
- );
-
- if (!this.#input.readOnly) {
- this.#input.select();
- }
- }
-
- set title(value) {
- this.#label.innerText = value;
- }
-
- set value(value) {
- this.#input.value = value;
- }
-
- get value() {
- return this.#input.value;
- }
-
- set type(type) {
- this.#input.type = type;
- }
-}