natxocc/sigpro-ui
1
1
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

changed to new functions
All checks were successful
Deploy Docs to Synology / deploy (push) Successful in 3s
Details

Browse Source
This commit is contained in:
Natxo
2026-04-22 12:06:34 +02:00
parent 5a5f593025
commit 59e6d972a8
125 changed files with 1934 additions and 2015 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/Tabs.js
View File

@@ -1,5 +1,5 @@
// components/Tabs.js
import { $, Tag, Watch } from "sigpro";
import { $, h, watch } from "sigpro";
import { val, ui, getIcon } from "../utils.js";
/**
@@ -15,7 +15,7 @@ export const Tabs = (props) => {
const itemsSignal = typeof items === "function" ? items : () => items || [];
const activeIndex = $(0);
Watch(() => {
watch(() => {
const list = itemsSignal();
const idx = list.findIndex(it => val(it.active) === true);
if (idx !== -1 && activeIndex() !== idx) {
@@ -42,7 +42,7 @@ export const Tabs = (props) => {
activeIndex(newActive);
};
return Tag("div", { ...rest, class: ui('tabs', className) }, () => {
return h("div", { ...rest, class: ui('tabs', className) }, () => {
const list = itemsSignal();
const elements = [];
@@ -60,13 +60,13 @@ export const Tabs = (props) => {
e.stopPropagation();
removeTab(i, item);
};
const wrapper = Tag("span", { class: "flex items-center" }, [labelNode, closeIcon]);
const wrapper = h("span", { class: "flex items-center" }, [labelNode, closeIcon]);
buttonChildren.push(wrapper);
} else {
buttonChildren.push(labelNode);
}
const buttonBase = Tag("button", {
const buttonBase = h("button", {
class: () => ui("tab", activeIndex() === i ? "tab-active" : ""),
onclick: (e) => {
e.preventDefault();
@@ -78,7 +78,7 @@ export const Tabs = (props) => {
}, buttonChildren);
const button = item.tip
? Tag("div", { class: "tooltip", "data-tip": item.tip }, buttonBase)
? h("div", { class: "tooltip", "data-tip": item.tip }, buttonBase)
: buttonBase;
elements.push(button);
@@ -93,8 +93,8 @@ export const Tabs = (props) => {
contentNode = document.createTextNode(String(rawContent));
}
const inner = Tag("div", { class: "tab-content-inner" }, contentNode);
const panel = Tag("div", {
const inner = h("div", { class: "tab-content-inner" }, contentNode);
const panel = h("div", {
class: "tab-content bg-base-100 border-base-300 p-6",
style: () => activeIndex() === i ? "display: block" : "display: none"
}, inner);