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

Update new functions

Browse Source
This commit is contained in:
natxocc
2026-04-06 03:19:15 +02:00
parent f9095332eb
commit 294547fc56
139 changed files with 2249 additions and 2109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
docs/components_old/accordion.md
View File

@@ -57,7 +57,7 @@ const BasicDemo = () => {
])
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Group Accordion (Radio Style)
@@ -100,7 +100,7 @@ const GroupDemo = () => {
])
]);
};
$mount(GroupDemo, '#demo-group');
Mount(GroupDemo, '#demo-group');
```
### FAQ Accordion
@@ -134,7 +134,7 @@ const FaqDemo = () => {
])
));
};
$mount(FaqDemo, '#demo-faq');
Mount(FaqDemo, '#demo-faq');
```
### With Rich Content
@@ -206,7 +206,7 @@ const RichDemo = () => {
])
]);
};
$mount(RichDemo, '#demo-rich');
Mount(RichDemo, '#demo-rich');
```
### Form Accordion
@@ -334,7 +334,7 @@ const FormAccordion = () => {
])
]);
};
$mount(FormAccordion, '#demo-form');
Mount(FormAccordion, '#demo-form');
```
### All Variants
@@ -384,7 +384,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -423,7 +423,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Group Accordion (Radio Style)
@@ -459,7 +459,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(GroupDemo, groupTarget);
Mount(GroupDemo, groupTarget);
}
// 3. FAQ Accordion
@@ -486,7 +486,7 @@ $mount(VariantsDemo, '#demo-variants');
])
));
};
$mount(FaqDemo, faqTarget);
Mount(FaqDemo, faqTarget);
}
// 4. With Rich Content
@@ -551,7 +551,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(RichDemo, richTarget);
Mount(RichDemo, richTarget);
}
// 5. Form Accordion
@@ -672,7 +672,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(FormAccordion, formTarget);
Mount(FormAccordion, formTarget);
}
// 6. All Variants
@@ -715,7 +715,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

32
docs/components_old/alert.md
View File

@@ -37,7 +37,7 @@ const BasicDemo = () => {
Alert({ type: 'error', message: 'An error occurred while processing your request.' })
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Soft vs Solid Variants
@@ -58,7 +58,7 @@ const VariantsDemo = () => {
Alert({ type: 'success', soft: false, message: 'Solid success alert' })
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
### With Actions
@@ -107,7 +107,7 @@ const ActionsDemo = () => {
}) : null
]);
};
$mount(ActionsDemo, '#demo-actions');
Mount(ActionsDemo, '#demo-actions');
```
### Dismissible Alert
@@ -138,7 +138,7 @@ const DismissibleDemo = () => {
}, 'Show Alert') : null
]);
};
$mount(DismissibleDemo, '#demo-dismissible');
Mount(DismissibleDemo, '#demo-dismissible');
```
### Reactive Alert
@@ -178,7 +178,7 @@ const ReactiveDemo = () => {
}) : null
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### Form Validation
@@ -245,7 +245,7 @@ const FormDemo = () => {
}) : null
]);
};
$mount(FormDemo, '#demo-form');
Mount(FormDemo, '#demo-form');
```
### Icon Alerts
@@ -266,7 +266,7 @@ const IconsDemo = () => {
Alert({ type: 'error', message: 'Error alert with custom icon' })
]);
};
$mount(IconsDemo, '#demo-icons');
Mount(IconsDemo, '#demo-icons');
```
### All Types
@@ -287,7 +287,7 @@ const AllTypesDemo = () => {
Alert({ type: 'error', message: '❌ This is an error alert' })
]);
};
$mount(AllTypesDemo, '#demo-all');
Mount(AllTypesDemo, '#demo-all');
```
<script>
@@ -305,7 +305,7 @@ $mount(AllTypesDemo, '#demo-all');
Alert({ type: 'error', message: 'An error occurred while processing your request.' })
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Soft vs Solid Variants
@@ -319,7 +319,7 @@ $mount(AllTypesDemo, '#demo-all');
Alert({ type: 'success', soft: false, message: 'Solid success alert' })
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
// 3. With Actions
@@ -361,7 +361,7 @@ $mount(AllTypesDemo, '#demo-all');
}) : null
]);
};
$mount(ActionsDemo, actionsTarget);
Mount(ActionsDemo, actionsTarget);
}
// 4. Dismissible Alert
@@ -385,7 +385,7 @@ $mount(AllTypesDemo, '#demo-all');
}, 'Show Alert') : null
]);
};
$mount(DismissibleDemo, dismissibleTarget);
Mount(DismissibleDemo, dismissibleTarget);
}
// 5. Reactive Alert
@@ -418,7 +418,7 @@ $mount(AllTypesDemo, '#demo-all');
}) : null
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 6. Form Validation
@@ -478,7 +478,7 @@ $mount(AllTypesDemo, '#demo-all');
}) : null
]);
};
$mount(FormDemo, formTarget);
Mount(FormDemo, formTarget);
}
// 7. Icon Alerts
@@ -492,7 +492,7 @@ $mount(AllTypesDemo, '#demo-all');
Alert({ type: 'error', message: 'Error alert with custom icon' })
]);
};
$mount(IconsDemo, iconsTarget);
Mount(IconsDemo, iconsTarget);
}
// 8. All Types
@@ -506,7 +506,7 @@ $mount(AllTypesDemo, '#demo-all');
Alert({ type: 'error', message: '❌ This is an error alert' })
]);
};
$mount(AllTypesDemo, allTarget);
Mount(AllTypesDemo, allTarget);
}
};

20
docs/components_old/autocomplete.md
View File

@@ -40,7 +40,7 @@ const BasicDemo = () => {
onSelect: (value) => selected(value)
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Objects
@@ -84,7 +84,7 @@ const ObjectsDemo = () => {
])
]);
};
$mount(ObjectsDemo, '#demo-objects');
Mount(ObjectsDemo, '#demo-objects');
```
### With Reactive Display
@@ -116,7 +116,7 @@ const ReactiveDemo = () => {
]) : null
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### Dynamic Options
@@ -158,7 +158,7 @@ const DynamicDemo = () => {
})
]);
};
$mount(DynamicDemo, '#demo-dynamic');
Mount(DynamicDemo, '#demo-dynamic');
```
### All Variants
@@ -204,7 +204,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -225,7 +225,7 @@ $mount(VariantsDemo, '#demo-variants');
onSelect: (value) => selected(value)
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Objects
@@ -262,7 +262,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(ObjectsDemo, objectsTarget);
Mount(ObjectsDemo, objectsTarget);
}
// 3. Reactive Display
@@ -287,7 +287,7 @@ $mount(VariantsDemo, '#demo-variants');
]) : null
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 4. Dynamic Options
@@ -322,7 +322,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(DynamicDemo, dynamicTarget);
Mount(DynamicDemo, dynamicTarget);
}
// 5. All Variants
@@ -361,7 +361,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

40
docs/components_old/badge.md
View File

@@ -37,7 +37,7 @@ const BasicDemo = () => {
Badge({ class: 'badge-error' }, 'Error')
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Badge Sizes
@@ -59,7 +59,7 @@ const SizesDemo = () => {
Badge({ class: 'badge-lg' }, 'Large')
]);
};
$mount(SizesDemo, '#demo-sizes');
Mount(SizesDemo, '#demo-sizes');
```
### Outline Badges
@@ -84,7 +84,7 @@ const OutlineDemo = () => {
Badge({ class: 'badge-outline badge-error' }, 'Error')
]);
};
$mount(OutlineDemo, '#demo-outline');
Mount(OutlineDemo, '#demo-outline');
```
### Ghost Badges
@@ -109,7 +109,7 @@ const GhostDemo = () => {
Badge({ class: 'badge-ghost badge-error' }, 'Error')
]);
};
$mount(GhostDemo, '#demo-ghost');
Mount(GhostDemo, '#demo-ghost');
```
### With Icons
@@ -146,7 +146,7 @@ const IconsDemo = () => {
])
]);
};
$mount(IconsDemo, '#demo-icons');
Mount(IconsDemo, '#demo-icons');
```
### Status Badges
@@ -175,7 +175,7 @@ const StatusDemo = () => {
))
]);
};
$mount(StatusDemo, '#demo-status');
Mount(StatusDemo, '#demo-status');
```
### Count Badges
@@ -208,7 +208,7 @@ const CountDemo = () => {
])
]);
};
$mount(CountDemo, '#demo-count');
Mount(CountDemo, '#demo-count');
```
### Interactive Badge
@@ -236,7 +236,7 @@ const InteractiveDemo = () => {
}, 'Reset')
]);
};
$mount(InteractiveDemo, '#demo-interactive');
Mount(InteractiveDemo, '#demo-interactive');
```
### All Variants
@@ -268,7 +268,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
### Inline with Text
@@ -300,7 +300,7 @@ const InlineDemo = () => {
])
]);
};
$mount(InlineDemo, '#demo-inline');
Mount(InlineDemo, '#demo-inline');
```
<script>
@@ -322,7 +322,7 @@ $mount(InlineDemo, '#demo-inline');
Badge({ class: 'badge-error' }, 'Error')
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Badge Sizes
@@ -337,7 +337,7 @@ $mount(InlineDemo, '#demo-inline');
Badge({ class: 'badge-lg' }, 'Large')
]);
};
$mount(SizesDemo, sizesTarget);
Mount(SizesDemo, sizesTarget);
}
// 3. Outline Badges
@@ -355,7 +355,7 @@ $mount(InlineDemo, '#demo-inline');
Badge({ class: 'badge-outline badge-error' }, 'Error')
]);
};
$mount(OutlineDemo, outlineTarget);
Mount(OutlineDemo, outlineTarget);
}
// 4. Ghost Badges
@@ -373,7 +373,7 @@ $mount(InlineDemo, '#demo-inline');
Badge({ class: 'badge-ghost badge-error' }, 'Error')
]);
};
$mount(GhostDemo, ghostTarget);
Mount(GhostDemo, ghostTarget);
}
// 5. With Icons
@@ -403,7 +403,7 @@ $mount(InlineDemo, '#demo-inline');
])
]);
};
$mount(IconsDemo, iconsTarget);
Mount(IconsDemo, iconsTarget);
}
// 6. Status Badges
@@ -425,7 +425,7 @@ $mount(InlineDemo, '#demo-inline');
))
]);
};
$mount(StatusDemo, statusTarget);
Mount(StatusDemo, statusTarget);
}
// 7. Count Badges
@@ -451,7 +451,7 @@ $mount(InlineDemo, '#demo-inline');
])
]);
};
$mount(CountDemo, countTarget);
Mount(CountDemo, countTarget);
}
// 8. Interactive Badge
@@ -472,7 +472,7 @@ $mount(InlineDemo, '#demo-inline');
}, 'Reset')
]);
};
$mount(InteractiveDemo, interactiveTarget);
Mount(InteractiveDemo, interactiveTarget);
}
// 9. All Variants
@@ -497,7 +497,7 @@ $mount(InlineDemo, '#demo-inline');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
// 10. Inline with Text
@@ -522,7 +522,7 @@ $mount(InlineDemo, '#demo-inline');
])
]);
};
$mount(InlineDemo, inlineTarget);
Mount(InlineDemo, inlineTarget);
}
};

24
docs/components_old/button copy.md
View File

@@ -35,7 +35,7 @@ Styled button with full DaisyUI support and reactive states.
const BasicDemo = () => {
return Button({ class: "btn btn-primary" }, "Click Me");
};
$mount(BasicDemo, "#demo-basic");
Mount(BasicDemo, "#demo-basic");
```
### With Loading State
@@ -64,7 +64,7 @@ const LoadingDemo = () => {
"Save Changes",
);
};
$mount(LoadingDemo, "#demo-loading");
Mount(LoadingDemo, "#demo-loading");
```
### With Badge
@@ -87,7 +87,7 @@ const BadgeDemo = () => {
"Notifications",
);
};
$mount(BadgeDemo, "#demo-badge");
Mount(BadgeDemo, "#demo-badge");
```
### With Tooltip
@@ -109,7 +109,7 @@ const TooltipDemo = () => {
"Delete",
);
};
$mount(TooltipDemo, "#demo-tooltip");
Mount(TooltipDemo, "#demo-tooltip");
```
### Disabled State
@@ -133,7 +133,7 @@ const DisabledDemo = () => {
"Submit",
);
};
$mount(DisabledDemo, "#demo-disabled");
Mount(DisabledDemo, "#demo-disabled");
```
### All Variants
@@ -155,7 +155,7 @@ const VariantsDemo = () => {
Button({ class: "btn btn-outline" }, "Outline"),
]);
};
$mount(VariantsDemo, "#demo-variants");
Mount(VariantsDemo, "#demo-variants");
```
<script>
@@ -166,7 +166,7 @@ $mount(VariantsDemo, "#demo-variants");
const basicTarget = document.querySelector('#demo-basic');
if (basicTarget && !basicTarget.hasChildNodes()) {
const BasicDemo = () => Button({ class: "btn btn-primary" }, "Click Me");
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Loading State
@@ -184,7 +184,7 @@ $mount(VariantsDemo, "#demo-variants");
}
}, "Save Changes");
};
$mount(LoadingDemo, loadingTarget);
Mount(LoadingDemo, loadingTarget);
}
// 3. Badge
@@ -195,7 +195,7 @@ $mount(VariantsDemo, "#demo-variants");
badge: "3",
badgeClass: "badge-accent"
}, "Notifications");
$mount(BadgeDemo, badgeTarget);
Mount(BadgeDemo, badgeTarget);
}
// 4. Tooltip
@@ -205,7 +205,7 @@ $mount(VariantsDemo, "#demo-variants");
class: "btn btn-ghost",
tooltip: "Delete item"
}, "Delete");
$mount(TooltipDemo, tooltipTarget);
Mount(TooltipDemo, tooltipTarget);
}
// 5. Disabled State
@@ -218,7 +218,7 @@ $mount(VariantsDemo, "#demo-variants");
disabled: isDisabled
}, "Submit");
};
$mount(DisabledDemo, disabledTarget);
Mount(DisabledDemo, disabledTarget);
}
// 6. All Variants
@@ -231,7 +231,7 @@ $mount(VariantsDemo, "#demo-variants");
Button({ class: "btn btn-ghost" }, "Ghost"),
Button({ class: "btn btn-outline" }, "Outline")
]);
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

16
docs/components_old/button.md
View File

@@ -57,7 +57,7 @@ For more detailed information about the underlying styling system, visit the dai
const BasicDemo = () => {
return Button({ class: "btn-primary" }, "Click Me");
};
$mount(BasicDemo, "#demo-basic");
Mount(BasicDemo, "#demo-basic");
```
### With Loading State
@@ -81,7 +81,7 @@ const LoadingDemo = () => {
"Save Changes",
);
};
$mount(LoadingDemo, "#demo-loading");
Mount(LoadingDemo, "#demo-loading");
```
### With Badge
@@ -99,7 +99,7 @@ const BadgeDemo = () => {
"Notifications",
);
};
$mount(BadgeDemo, "#demo-badge");
Mount(BadgeDemo, "#demo-badge");
```
### With Tooltip
@@ -116,7 +116,7 @@ const TooltipDemo = () => {
"Delete",
);
};
$mount(TooltipDemo, "#demo-tooltip");
Mount(TooltipDemo, "#demo-tooltip");
```
### Disabled State
@@ -134,7 +134,7 @@ const DisabledDemo = () => {
"Submit",
);
};
$mount(DisabledDemo, "#demo-disabled");
Mount(DisabledDemo, "#demo-disabled");
```
### All Variants
@@ -151,7 +151,7 @@ const VariantsDemo = () => {
Button({ class: "btn-outline" }, "Outline"),
]);
};
$mount(VariantsDemo, "#demo-variants");
Mount(VariantsDemo, "#demo-variants");
```
<div id="demo-test" class="card bg-base-100 p-6 rounded-xl border border-base-300 flex items-center justify-center"></div>
@@ -159,10 +159,10 @@ $mount(VariantsDemo, "#demo-variants");
```javascript
const TestDemo = () => {
return Div({ class: "flex flex-wrap gap-2 justify-center" }, [
$html("span", {class: "indicator"},[
Tag("span", {class: "indicator"},[
5,
Button('Click')])
]);
};
$mount(TestDemo, "#demo-test");
Mount(TestDemo, "#demo-test");
```

28
docs/components_old/checkbox.md
View File

@@ -39,7 +39,7 @@ const BasicDemo = () => {
onclick: () => accepted(!accepted())
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Toggle Switch
@@ -67,7 +67,7 @@ const ToggleDemo = () => {
: Div({ class: 'alert alert-soft' }, 'Notifications are OFF')
]);
};
$mount(ToggleDemo, '#demo-toggle');
Mount(ToggleDemo, '#demo-toggle');
```
### With Tooltip
@@ -90,7 +90,7 @@ const TooltipDemo = () => {
onclick: () => darkMode(!darkMode())
});
};
$mount(TooltipDemo, '#demo-tooltip');
Mount(TooltipDemo, '#demo-tooltip');
```
### Disabled State
@@ -117,7 +117,7 @@ const DisabledDemo = () => {
})
]);
};
$mount(DisabledDemo, '#demo-disabled');
Mount(DisabledDemo, '#demo-disabled');
```
### Reactive Multiple Selection
@@ -170,7 +170,7 @@ const MultipleDemo = () => {
})
]);
};
$mount(MultipleDemo, '#demo-multiple');
Mount(MultipleDemo, '#demo-multiple');
```
### All Variants
@@ -219,7 +219,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
### Form Example
@@ -263,7 +263,7 @@ const FormDemo = () => {
: null
]);
};
$mount(FormDemo, '#demo-form');
Mount(FormDemo, '#demo-form');
```
<script>
@@ -282,7 +282,7 @@ $mount(FormDemo, '#demo-form');
onclick: () => accepted(!accepted())
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Toggle Switch
@@ -303,7 +303,7 @@ $mount(FormDemo, '#demo-form');
: Div({ class: 'alert alert-soft' }, 'Notifications are OFF')
]);
};
$mount(ToggleDemo, toggleTarget);
Mount(ToggleDemo, toggleTarget);
}
// 3. With Tooltip
@@ -319,7 +319,7 @@ $mount(FormDemo, '#demo-form');
onclick: () => darkMode(!darkMode())
});
};
$mount(TooltipDemo, tooltipTarget);
Mount(TooltipDemo, tooltipTarget);
}
// 4. Disabled State
@@ -339,7 +339,7 @@ $mount(FormDemo, '#demo-form');
})
]);
};
$mount(DisabledDemo, disabledTarget);
Mount(DisabledDemo, disabledTarget);
}
// 5. Reactive Multiple Selection
@@ -385,7 +385,7 @@ $mount(FormDemo, '#demo-form');
})
]);
};
$mount(MultipleDemo, multipleTarget);
Mount(MultipleDemo, multipleTarget);
}
// 6. All Variants
@@ -427,7 +427,7 @@ $mount(FormDemo, '#demo-form');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
// 7. Form Example
@@ -464,7 +464,7 @@ $mount(FormDemo, '#demo-form');
: null
]);
};
$mount(FormDemo, formTarget);
Mount(FormDemo, formTarget);
}
};

24
docs/components_old/colorpicker.md
View File

@@ -34,7 +34,7 @@ const BasicDemo = () => {
value: color
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Reactive Preview
@@ -63,7 +63,7 @@ const PreviewDemo = () => {
])
]);
};
$mount(PreviewDemo, '#demo-preview');
Mount(PreviewDemo, '#demo-preview');
```
### Color Palette Grid
@@ -101,7 +101,7 @@ const PaletteDemo = () => {
Div({ class: 'mt-2 text-center text-sm font-mono' }, () => selectedColor())
]);
};
$mount(PaletteDemo, '#demo-palette');
Mount(PaletteDemo, '#demo-palette');
```
### With Text Color Preview
@@ -137,7 +137,7 @@ const TextDemo = () => {
])
]);
};
$mount(TextDemo, '#demo-text');
Mount(TextDemo, '#demo-text');
```
### All Variants
@@ -170,7 +170,7 @@ const VariantsDemo = () => {
})
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
### Dynamic Color Swatch
@@ -210,7 +210,7 @@ const DynamicDemo = () => {
])
]);
};
$mount(DynamicDemo, '#demo-dynamic');
Mount(DynamicDemo, '#demo-dynamic');
```
<script>
@@ -227,7 +227,7 @@ $mount(DynamicDemo, '#demo-dynamic');
value: color
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Reactive Preview
@@ -248,7 +248,7 @@ $mount(DynamicDemo, '#demo-dynamic');
])
]);
};
$mount(PreviewDemo, previewTarget);
Mount(PreviewDemo, previewTarget);
}
// 3. Color Palette Grid
@@ -279,7 +279,7 @@ $mount(DynamicDemo, '#demo-dynamic');
Div({ class: 'mt-2 text-center text-sm font-mono' }, () => selectedColor())
]);
};
$mount(PaletteDemo, paletteTarget);
Mount(PaletteDemo, paletteTarget);
}
// 4. With Text Color Preview
@@ -308,7 +308,7 @@ $mount(DynamicDemo, '#demo-dynamic');
])
]);
};
$mount(TextDemo, textTarget);
Mount(TextDemo, textTarget);
}
// 5. All Variants
@@ -334,7 +334,7 @@ $mount(DynamicDemo, '#demo-dynamic');
})
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
// 6. Dynamic Color Swatch
@@ -367,7 +367,7 @@ $mount(DynamicDemo, '#demo-dynamic');
])
]);
};
$mount(DynamicDemo, dynamicTarget);
Mount(DynamicDemo, dynamicTarget);
}
};

24
docs/components_old/datepicker.md
View File

@@ -38,7 +38,7 @@ const BasicDemo = () => {
placeholder: 'Choose a date...'
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Date Range Picker
@@ -66,7 +66,7 @@ const RangeDemo = () => {
]) : null
]);
};
$mount(RangeDemo, '#demo-range');
Mount(RangeDemo, '#demo-range');
```
### With Time Selection
@@ -94,7 +94,7 @@ const TimeDemo = () => {
]) : null
]);
};
$mount(TimeDemo, '#demo-time');
Mount(TimeDemo, '#demo-time');
```
### Range with Time
@@ -123,7 +123,7 @@ const RangeTimeDemo = () => {
]) : null
]);
};
$mount(RangeTimeDemo, '#demo-range-time');
Mount(RangeTimeDemo, '#demo-range-time');
```
### Reactive Display
@@ -155,7 +155,7 @@ const ReactiveDemo = () => {
])
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### All Variants
@@ -189,7 +189,7 @@ const VariantsDemo = () => {
})
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -208,7 +208,7 @@ $mount(VariantsDemo, '#demo-variants');
placeholder: 'Choose a date...'
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Date Range Picker
@@ -229,7 +229,7 @@ $mount(VariantsDemo, '#demo-variants');
]) : null
]);
};
$mount(RangeDemo, rangeTarget);
Mount(RangeDemo, rangeTarget);
}
// 3. With Time Selection
@@ -250,7 +250,7 @@ $mount(VariantsDemo, '#demo-variants');
]) : null
]);
};
$mount(TimeDemo, timeTarget);
Mount(TimeDemo, timeTarget);
}
// 4. Range with Time
@@ -272,7 +272,7 @@ $mount(VariantsDemo, '#demo-variants');
]) : null
]);
};
$mount(RangeTimeDemo, rangeTimeTarget);
Mount(RangeTimeDemo, rangeTimeTarget);
}
// 5. Reactive Display
@@ -297,7 +297,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 6. All Variants
@@ -324,7 +324,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

28
docs/components_old/drawer.md
View File

@@ -50,7 +50,7 @@ const BasicDemo = () => {
])
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Navigation Drawer
@@ -127,7 +127,7 @@ const NavDrawer = () => {
])
});
};
$mount(NavDrawer, '#demo-nav');
Mount(NavDrawer, '#demo-nav');
```
### Settings Drawer
@@ -222,7 +222,7 @@ const SettingsDrawer = () => {
])
});
};
$mount(SettingsDrawer, '#demo-settings');
Mount(SettingsDrawer, '#demo-settings');
```
### Cart Drawer
@@ -325,7 +325,7 @@ const CartDrawer = () => {
])
});
};
$mount(CartDrawer, '#demo-cart');
Mount(CartDrawer, '#demo-cart');
```
### Responsive Drawer
@@ -393,7 +393,7 @@ const ResponsiveDrawer = () => {
])
});
};
$mount(ResponsiveDrawer, '#demo-responsive');
Mount(ResponsiveDrawer, '#demo-responsive');
```
### Form Drawer
@@ -451,7 +451,7 @@ const FormDrawer = () => {
}),
Div({ class: 'form-control' }, [
Span({ class: 'label-text mb-1' }, 'Message'),
$html('textarea', {
Tag('textarea', {
class: 'textarea textarea-bordered h-24',
placeholder: 'Your message',
value: message,
@@ -478,7 +478,7 @@ const FormDrawer = () => {
])
});
};
$mount(FormDrawer, '#demo-form');
Mount(FormDrawer, '#demo-form');
```
<script>
@@ -510,7 +510,7 @@ $mount(FormDrawer, '#demo-form');
])
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Navigation Drawer
@@ -580,7 +580,7 @@ $mount(FormDrawer, '#demo-form');
])
});
};
$mount(NavDrawer, navTarget);
Mount(NavDrawer, navTarget);
}
// 3. Settings Drawer
@@ -668,7 +668,7 @@ $mount(FormDrawer, '#demo-form');
])
});
};
$mount(SettingsDrawer, settingsTarget);
Mount(SettingsDrawer, settingsTarget);
}
// 4. Cart Drawer
@@ -764,7 +764,7 @@ $mount(FormDrawer, '#demo-form');
])
});
};
$mount(CartDrawer, cartTarget);
Mount(CartDrawer, cartTarget);
}
// 5. Responsive Drawer
@@ -825,7 +825,7 @@ $mount(FormDrawer, '#demo-form');
])
});
};
$mount(ResponsiveDrawer, responsiveTarget);
Mount(ResponsiveDrawer, responsiveTarget);
}
// 6. Form Drawer
@@ -876,7 +876,7 @@ $mount(FormDrawer, '#demo-form');
}),
Div({ class: 'form-control' }, [
Span({ class: 'label-text mb-1' }, 'Message'),
$html('textarea', {
Tag('textarea', {
class: 'textarea textarea-bordered h-24',
placeholder: 'Your message',
value: message,
@@ -903,7 +903,7 @@ $mount(FormDrawer, '#demo-form');
])
});
};
$mount(FormDrawer, formTarget);
Mount(FormDrawer, formTarget);
}
};

32
docs/components_old/dropdown.md
View File

@@ -47,7 +47,7 @@ const BasicDemo = () => {
]
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Icons (Items Array)
@@ -72,7 +72,7 @@ const IconsDemo = () => {
]
});
};
$mount(IconsDemo, '#demo-icons');
Mount(IconsDemo, '#demo-icons');
```
### Action Dropdown (Items Array)
@@ -100,7 +100,7 @@ const ActionsDemo = () => {
]
});
};
$mount(ActionsDemo, '#demo-actions');
Mount(ActionsDemo, '#demo-actions');
```
### User Dropdown (Items Array)
@@ -129,7 +129,7 @@ const UserDropdown = () => {
]
});
};
$mount(UserDropdown, '#demo-user');
Mount(UserDropdown, '#demo-user');
```
### Reactive Items
@@ -157,7 +157,7 @@ const ReactiveDropdown = () => {
items: items
});
};
$mount(ReactiveDropdown, '#demo-reactive');
Mount(ReactiveDropdown, '#demo-reactive');
```
### Notification Dropdown (Custom Children)
@@ -212,7 +212,7 @@ const NotificationsDropdown = () => {
])
});
};
$mount(NotificationsDropdown, '#demo-notifications');
Mount(NotificationsDropdown, '#demo-notifications');
```
### Custom Content Dropdown
@@ -249,7 +249,7 @@ const CustomDropdown = () => {
])
});
};
$mount(CustomDropdown, '#demo-custom');
Mount(CustomDropdown, '#demo-custom');
```
### All Variants
@@ -275,7 +275,7 @@ const VariantsDemo = () => {
Dropdown({ label: 'End Position', class: 'dropdown-end', items: commonItems })
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -295,7 +295,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Icons (Items Array)
@@ -313,7 +313,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(IconsDemo, iconsTarget);
Mount(IconsDemo, iconsTarget);
}
// 3. Action Dropdown (Items Array)
@@ -334,7 +334,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(ActionsDemo, actionsTarget);
Mount(ActionsDemo, actionsTarget);
}
// 4. User Dropdown (Items Array)
@@ -356,7 +356,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(UserDropdown, userTarget);
Mount(UserDropdown, userTarget);
}
// 5. Reactive Items
@@ -377,7 +377,7 @@ $mount(VariantsDemo, '#demo-variants');
items: items
});
};
$mount(ReactiveDropdown, reactiveTarget);
Mount(ReactiveDropdown, reactiveTarget);
}
// 6. Notification Dropdown (Custom Children)
@@ -425,7 +425,7 @@ $mount(VariantsDemo, '#demo-variants');
])
});
};
$mount(NotificationsDropdown, notifTarget);
Mount(NotificationsDropdown, notifTarget);
}
// 7. Custom Content Dropdown
@@ -455,7 +455,7 @@ $mount(VariantsDemo, '#demo-variants');
])
});
};
$mount(CustomDropdown, customTarget);
Mount(CustomDropdown, customTarget);
}
// 8. All Variants
@@ -474,7 +474,7 @@ $mount(VariantsDemo, '#demo-variants');
Dropdown({ label: 'End Position', class: 'dropdown-end', items: commonItems })
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

36
docs/components_old/fab.md
View File

@@ -49,7 +49,7 @@ const BasicDemo = () => {
})
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Label
@@ -75,7 +75,7 @@ const LabelDemo = () => {
})
]);
};
$mount(LabelDemo, '#demo-label');
Mount(LabelDemo, '#demo-label');
```
### Different Positions
@@ -119,7 +119,7 @@ const PositionsDemo = () => {
})
]);
};
$mount(PositionsDemo, '#demo-positions');
Mount(PositionsDemo, '#demo-positions');
```
### Color Variants
@@ -164,7 +164,7 @@ const ColorsDemo = () => {
})
]);
};
$mount(ColorsDemo, '#demo-colors');
Mount(ColorsDemo, '#demo-colors');
```
### Reactive Actions
@@ -210,7 +210,7 @@ const ReactiveActions = () => {
})
]);
};
$mount(ReactiveActions, '#demo-reactive');
Mount(ReactiveActions, '#demo-reactive');
```
### Document Actions
@@ -249,7 +249,7 @@ const DocumentActions = () => {
})
]);
};
$mount(DocumentActions, '#demo-document');
Mount(DocumentActions, '#demo-document');
```
### Messaging FAB
@@ -307,7 +307,7 @@ const MessagingFAB = () => {
})
]);
};
$mount(MessagingFAB, '#demo-messaging');
Mount(MessagingFAB, '#demo-messaging');
```
### Flower Style FAB
@@ -337,7 +337,7 @@ const FlowerDemo = () => {
})
]);
};
$mount(FlowerDemo, '#demo-flower');
Mount(FlowerDemo, '#demo-flower');
```
### All Variants
@@ -378,7 +378,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -400,7 +400,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Label
@@ -419,7 +419,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(LabelDemo, labelTarget);
Mount(LabelDemo, labelTarget);
}
// 3. Different Positions
@@ -456,7 +456,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(PositionsDemo, positionsTarget);
Mount(PositionsDemo, positionsTarget);
}
// 4. Color Variants
@@ -494,7 +494,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(ColorsDemo, colorsTarget);
Mount(ColorsDemo, colorsTarget);
}
// 5. Reactive Actions
@@ -533,7 +533,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(ReactiveActions, reactiveTarget);
Mount(ReactiveActions, reactiveTarget);
}
// 6. Document Actions
@@ -565,7 +565,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(DocumentActions, documentTarget);
Mount(DocumentActions, documentTarget);
}
// 7. Messaging FAB
@@ -616,7 +616,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(MessagingFAB, messagingTarget);
Mount(MessagingFAB, messagingTarget);
}
// 8. Flower Style FAB
@@ -639,7 +639,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(FlowerDemo, flowerTarget);
Mount(FlowerDemo, flowerTarget);
}
// 9. All Variants
@@ -673,7 +673,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

28
docs/components_old/fieldset.md
View File

@@ -38,7 +38,7 @@ const BasicDemo = () => {
])
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Reactive Legend
@@ -80,7 +80,7 @@ const ReactiveDemo = () => {
])
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### Address Form
@@ -122,7 +122,7 @@ const AddressDemo = () => {
])
]);
};
$mount(AddressDemo, '#demo-address');
Mount(AddressDemo, '#demo-address');
```
### Payment Method
@@ -163,7 +163,7 @@ const PaymentDemo = () => {
])
]);
};
$mount(PaymentDemo, '#demo-payment');
Mount(PaymentDemo, '#demo-payment');
```
### Preferences Panel
@@ -212,7 +212,7 @@ const PreferencesDemo = () => {
])
]);
};
$mount(PreferencesDemo, '#demo-preferences');
Mount(PreferencesDemo, '#demo-preferences');
```
### Registration Form
@@ -270,7 +270,7 @@ const RegistrationDemo = () => {
])
]);
};
$mount(RegistrationDemo, '#demo-registration');
Mount(RegistrationDemo, '#demo-registration');
```
### All Variants
@@ -296,7 +296,7 @@ const VariantsDemo = () => {
Fieldset({ legend: 'With Background', class: 'w-full bg-base-100' }, [commonContent])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -318,7 +318,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Reactive Legend
@@ -353,7 +353,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 3. Address Form
@@ -388,7 +388,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(AddressDemo, addressTarget);
Mount(AddressDemo, addressTarget);
}
// 4. Payment Method
@@ -422,7 +422,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(PaymentDemo, paymentTarget);
Mount(PaymentDemo, paymentTarget);
}
// 5. Preferences Panel
@@ -464,7 +464,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(PreferencesDemo, preferencesTarget);
Mount(PreferencesDemo, preferencesTarget);
}
// 6. Registration Form
@@ -515,7 +515,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(RegistrationDemo, registrationTarget);
Mount(RegistrationDemo, registrationTarget);
}
// 7. All Variants
@@ -534,7 +534,7 @@ $mount(VariantsDemo, '#demo-variants');
Fieldset({ legend: 'With Background', class: 'w-full bg-base-100' }, [commonContent])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

28
docs/components_old/indicator.md
View File

@@ -40,7 +40,7 @@ const BasicDemo = () => {
])
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Online Status Indicator
@@ -72,7 +72,7 @@ const StatusDemo = () => {
])
]);
};
$mount(StatusDemo, '#demo-status');
Mount(StatusDemo, '#demo-status');
```
### Reactive Counter
@@ -110,7 +110,7 @@ const ReactiveDemo = () => {
])
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### Shopping Cart
@@ -168,7 +168,7 @@ const CartDemo = () => {
))
]);
};
$mount(CartDemo, '#demo-cart');
Mount(CartDemo, '#demo-cart');
```
### Email Inbox
@@ -228,7 +228,7 @@ const InboxDemo = () => {
))
]);
};
$mount(InboxDemo, '#demo-inbox');
Mount(InboxDemo, '#demo-inbox');
```
### Custom Position
@@ -269,7 +269,7 @@ const PositionsDemo = () => {
])
]);
};
$mount(PositionsDemo, '#demo-positions');
Mount(PositionsDemo, '#demo-positions');
```
### All Variants
@@ -300,7 +300,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -323,7 +323,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Online Status Indicator
@@ -348,7 +348,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(StatusDemo, statusTarget);
Mount(StatusDemo, statusTarget);
}
// 3. Reactive Counter
@@ -379,7 +379,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 4. Shopping Cart
@@ -430,7 +430,7 @@ $mount(VariantsDemo, '#demo-variants');
))
]);
};
$mount(CartDemo, cartTarget);
Mount(CartDemo, cartTarget);
}
// 5. Email Inbox
@@ -483,7 +483,7 @@ $mount(VariantsDemo, '#demo-variants');
))
]);
};
$mount(InboxDemo, inboxTarget);
Mount(InboxDemo, inboxTarget);
}
// 6. Custom Position
@@ -517,7 +517,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(PositionsDemo, positionsTarget);
Mount(PositionsDemo, positionsTarget);
}
// 7. All Variants
@@ -541,7 +541,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

28
docs/components_old/input.md
View File

@@ -43,7 +43,7 @@ const BasicDemo = () => {
oninput: (e) => name(e.target.value)
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Icon
@@ -67,7 +67,7 @@ const IconDemo = () => {
oninput: (e) => email(e.target.value)
});
};
$mount(IconDemo, '#demo-icon');
Mount(IconDemo, '#demo-icon');
```
### Password with Toggle
@@ -90,7 +90,7 @@ const PasswordDemo = () => {
oninput: (e) => password(e.target.value)
});
};
$mount(PasswordDemo, '#demo-password');
Mount(PasswordDemo, '#demo-password');
```
### With Tooltip
@@ -113,7 +113,7 @@ const TooltipDemo = () => {
oninput: (e) => username(e.target.value)
});
};
$mount(TooltipDemo, '#demo-tooltip');
Mount(TooltipDemo, '#demo-tooltip');
```
### Error State
@@ -144,7 +144,7 @@ const ErrorDemo = () => {
oninput: (e) => validate(e.target.value)
});
};
$mount(ErrorDemo, '#demo-error');
Mount(ErrorDemo, '#demo-error');
```
### Disabled State
@@ -164,7 +164,7 @@ const DisabledDemo = () => {
disabled: true
});
};
$mount(DisabledDemo, '#demo-disabled');
Mount(DisabledDemo, '#demo-disabled');
```
### All Variants
@@ -201,7 +201,7 @@ const VariantsDemo = () => {
})
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -220,7 +220,7 @@ $mount(VariantsDemo, '#demo-variants');
oninput: (e) => name(e.target.value)
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Icon
@@ -236,7 +236,7 @@ $mount(VariantsDemo, '#demo-variants');
oninput: (e) => email(e.target.value)
});
};
$mount(IconDemo, iconTarget);
Mount(IconDemo, iconTarget);
}
// 3. Password with Toggle
@@ -251,7 +251,7 @@ $mount(VariantsDemo, '#demo-variants');
oninput: (e) => password(e.target.value)
});
};
$mount(PasswordDemo, passwordTarget);
Mount(PasswordDemo, passwordTarget);
}
// 4. With Tooltip
@@ -266,7 +266,7 @@ $mount(VariantsDemo, '#demo-variants');
oninput: (e) => username(e.target.value)
});
};
$mount(TooltipDemo, tooltipTarget);
Mount(TooltipDemo, tooltipTarget);
}
// 5. Error State
@@ -290,7 +290,7 @@ $mount(VariantsDemo, '#demo-variants');
oninput: (e) => validate(e.target.value)
});
};
$mount(ErrorDemo, errorTarget);
Mount(ErrorDemo, errorTarget);
}
// 6. Disabled State
@@ -303,7 +303,7 @@ $mount(VariantsDemo, '#demo-variants');
disabled: true
});
};
$mount(DisabledDemo, disabledTarget);
Mount(DisabledDemo, disabledTarget);
}
// 7. All Variants
@@ -333,7 +333,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

32
docs/components_old/list.md
View File

@@ -39,7 +39,7 @@ const BasicDemo = () => {
])
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Header
@@ -69,7 +69,7 @@ const HeaderDemo = () => {
])
});
};
$mount(HeaderDemo, '#demo-header');
Mount(HeaderDemo, '#demo-header');
```
### With Icons
@@ -102,7 +102,7 @@ const IconsDemo = () => {
])
});
};
$mount(IconsDemo, '#demo-icons');
Mount(IconsDemo, '#demo-icons');
```
### With Badges
@@ -134,7 +134,7 @@ const BadgesDemo = () => {
])
});
};
$mount(BadgesDemo, '#demo-badges');
Mount(BadgesDemo, '#demo-badges');
```
### Interactive List
@@ -181,7 +181,7 @@ const InteractiveDemo = () => {
: Div({ class: 'alert alert-soft' }, 'Select a project to see details')
]);
};
$mount(InteractiveDemo, '#demo-interactive');
Mount(InteractiveDemo, '#demo-interactive');
```
### Reactive List
@@ -254,7 +254,7 @@ const ReactiveDemo = () => {
Div({ class: 'text-sm opacity-70 mt-2' }, () => `${pendingCount()} tasks remaining`)
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### Avatar List
@@ -289,7 +289,7 @@ const AvatarDemo = () => {
])
});
};
$mount(AvatarDemo, '#demo-avatar');
Mount(AvatarDemo, '#demo-avatar');
```
### All Variants
@@ -327,7 +327,7 @@ const VariantsDemo = () => {
})
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -347,7 +347,7 @@ $mount(VariantsDemo, '#demo-variants');
])
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Header
@@ -370,7 +370,7 @@ $mount(VariantsDemo, '#demo-variants');
])
});
};
$mount(HeaderDemo, headerTarget);
Mount(HeaderDemo, headerTarget);
}
// 3. With Icons
@@ -396,7 +396,7 @@ $mount(VariantsDemo, '#demo-variants');
])
});
};
$mount(IconsDemo, iconsTarget);
Mount(IconsDemo, iconsTarget);
}
// 4. With Badges
@@ -421,7 +421,7 @@ $mount(VariantsDemo, '#demo-variants');
])
});
};
$mount(BadgesDemo, badgesTarget);
Mount(BadgesDemo, badgesTarget);
}
// 5. Interactive List
@@ -461,7 +461,7 @@ $mount(VariantsDemo, '#demo-variants');
: Div({ class: 'alert alert-soft' }, 'Select a project to see details')
]);
};
$mount(InteractiveDemo, interactiveTarget);
Mount(InteractiveDemo, interactiveTarget);
}
// 6. Reactive List
@@ -527,7 +527,7 @@ $mount(VariantsDemo, '#demo-variants');
Div({ class: 'text-sm opacity-70 mt-2' }, () => `${pendingCount()} tasks remaining`)
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 7. Avatar List
@@ -555,7 +555,7 @@ $mount(VariantsDemo, '#demo-variants');
])
});
};
$mount(AvatarDemo, avatarTarget);
Mount(AvatarDemo, avatarTarget);
}
// 8. All Variants
@@ -586,7 +586,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

32
docs/components_old/loading.md
View File

@@ -35,7 +35,7 @@ const BasicDemo = () => {
Loading({ $show: true, class: 'loading-infinity' })
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Loading Sizes
@@ -68,7 +68,7 @@ const SizesDemo = () => {
])
]);
};
$mount(SizesDemo, '#demo-sizes');
Mount(SizesDemo, '#demo-sizes');
```
### Loading Colors
@@ -92,7 +92,7 @@ const ColorsDemo = () => {
Loading({ $show: true, class: 'loading-spinner text-error' })
]);
};
$mount(ColorsDemo, '#demo-colors');
Mount(ColorsDemo, '#demo-colors');
```
### Button Loading State
@@ -124,7 +124,7 @@ const ButtonDemo = () => {
Div({ class: 'text-sm opacity-70' }, 'Click the button to see loading state')
]);
};
$mount(ButtonDemo, '#demo-button');
Mount(ButtonDemo, '#demo-button');
```
### Async Data Loading
@@ -192,7 +192,7 @@ const AsyncDemo = () => {
])
]);
};
$mount(AsyncDemo, '#demo-async');
Mount(AsyncDemo, '#demo-async');
```
### Full Page Loading
@@ -226,7 +226,7 @@ const FullpageDemo = () => {
() => isLoading() ? Loading({ $show: true, class: 'loading-spinner loading-lg' }) : null
]);
};
$mount(FullpageDemo, '#demo-fullpage');
Mount(FullpageDemo, '#demo-fullpage');
```
### Conditional Loading
@@ -279,7 +279,7 @@ const ConditionalDemo = () => {
])
]);
};
$mount(ConditionalDemo, '#demo-conditional');
Mount(ConditionalDemo, '#demo-conditional');
```
### All Variants
@@ -323,7 +323,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -343,7 +343,7 @@ $mount(VariantsDemo, '#demo-variants');
Loading({ $show: true, class: 'loading-infinity' })
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Loading Sizes
@@ -369,7 +369,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(SizesDemo, sizesTarget);
Mount(SizesDemo, sizesTarget);
}
// 3. Loading Colors
@@ -386,7 +386,7 @@ $mount(VariantsDemo, '#demo-variants');
Loading({ $show: true, class: 'loading-spinner text-error' })
]);
};
$mount(ColorsDemo, colorsTarget);
Mount(ColorsDemo, colorsTarget);
}
// 4. Button Loading State
@@ -411,7 +411,7 @@ $mount(VariantsDemo, '#demo-variants');
Div({ class: 'text-sm opacity-70' }, 'Click the button to see loading state')
]);
};
$mount(ButtonDemo, buttonTarget);
Mount(ButtonDemo, buttonTarget);
}
// 5. Async Data Loading
@@ -472,7 +472,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(AsyncDemo, asyncTarget);
Mount(AsyncDemo, asyncTarget);
}
// 6. Full Page Loading
@@ -499,7 +499,7 @@ $mount(VariantsDemo, '#demo-variants');
() => isLoading() ? Loading({ $show: true, class: 'loading-spinner loading-lg' }) : null
]);
};
$mount(FullpageDemo, fullpageTarget);
Mount(FullpageDemo, fullpageTarget);
}
// 7. Conditional Loading
@@ -545,7 +545,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(ConditionalDemo, conditionalTarget);
Mount(ConditionalDemo, conditionalTarget);
}
// 8. All Variants
@@ -582,7 +582,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

32
docs/components_old/menu.md
View File

@@ -59,7 +59,7 @@ const BasicDemo = () => {
]
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Icons
@@ -104,7 +104,7 @@ const IconsDemo = () => {
]
});
};
$mount(IconsDemo, '#demo-icons');
Mount(IconsDemo, '#demo-icons');
```
### Nested Menu
@@ -174,7 +174,7 @@ const NestedDemo = () => {
]
});
};
$mount(NestedDemo, '#demo-nested');
Mount(NestedDemo, '#demo-nested');
```
### Horizontal Menu
@@ -219,7 +219,7 @@ const HorizontalDemo = () => {
]
});
};
$mount(HorizontalDemo, '#demo-horizontal');
Mount(HorizontalDemo, '#demo-horizontal');
```
### Sidebar Menu
@@ -282,7 +282,7 @@ const SidebarDemo = () => {
])
]);
};
$mount(SidebarDemo, '#demo-sidebar');
Mount(SidebarDemo, '#demo-sidebar');
```
### Account Menu
@@ -334,7 +334,7 @@ const AccountDemo = () => {
]
});
};
$mount(AccountDemo, '#demo-account');
Mount(AccountDemo, '#demo-account');
```
### Collapsible Sidebar
@@ -372,7 +372,7 @@ const CollapsibleDemo = () => {
])
]);
};
$mount(CollapsibleDemo, '#demo-collapsible');
Mount(CollapsibleDemo, '#demo-collapsible');
```
### All Variants
@@ -410,7 +410,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -443,7 +443,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Icons
@@ -481,7 +481,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(IconsDemo, iconsTarget);
Mount(IconsDemo, iconsTarget);
}
// 3. Nested Menu
@@ -544,7 +544,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(NestedDemo, nestedTarget);
Mount(NestedDemo, nestedTarget);
}
// 4. Horizontal Menu
@@ -582,7 +582,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(HorizontalDemo, horizontalTarget);
Mount(HorizontalDemo, horizontalTarget);
}
// 5. Sidebar Menu
@@ -638,7 +638,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(SidebarDemo, sidebarTarget);
Mount(SidebarDemo, sidebarTarget);
}
// 6. Account Menu
@@ -683,7 +683,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(AccountDemo, accountTarget);
Mount(AccountDemo, accountTarget);
}
// 7. Collapsible Sidebar
@@ -714,7 +714,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(CollapsibleDemo, collapsibleTarget);
Mount(CollapsibleDemo, collapsibleTarget);
}
// 8. All Variants
@@ -745,7 +745,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

28
docs/components_old/modal.md
View File

@@ -45,7 +45,7 @@ const BasicDemo = () => {
])
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Modal with Actions
@@ -95,7 +95,7 @@ const ActionsDemo = () => {
])
]);
};
$mount(ActionsDemo, '#demo-actions');
Mount(ActionsDemo, '#demo-actions');
```
### Form Modal
@@ -164,7 +164,7 @@ const FormModal = () => {
])
]);
};
$mount(FormModal, '#demo-form');
Mount(FormModal, '#demo-form');
```
### Confirmation Modal
@@ -225,7 +225,7 @@ const ConfirmDemo = () => {
])
]);
};
$mount(ConfirmDemo, '#demo-confirm');
Mount(ConfirmDemo, '#demo-confirm');
```
### Large Content Modal
@@ -277,7 +277,7 @@ const LargeDemo = () => {
])
]);
};
$mount(LargeDemo, '#demo-large');
Mount(LargeDemo, '#demo-large');
```
### Multiple Modals
@@ -319,7 +319,7 @@ const MultipleDemo = () => {
}, 'Please review your input before proceeding.')
]);
};
$mount(MultipleDemo, '#demo-multiple');
Mount(MultipleDemo, '#demo-multiple');
```
### Custom Styled Modal
@@ -356,7 +356,7 @@ const CustomDemo = () => {
])
]);
};
$mount(CustomDemo, '#demo-custom');
Mount(CustomDemo, '#demo-custom');
```
<script>
@@ -383,7 +383,7 @@ $mount(CustomDemo, '#demo-custom');
])
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Modal with Actions
@@ -426,7 +426,7 @@ $mount(CustomDemo, '#demo-custom');
])
]);
};
$mount(ActionsDemo, actionsTarget);
Mount(ActionsDemo, actionsTarget);
}
// 3. Form Modal
@@ -488,7 +488,7 @@ $mount(CustomDemo, '#demo-custom');
])
]);
};
$mount(FormModal, formTarget);
Mount(FormModal, formTarget);
}
// 4. Confirmation Modal
@@ -542,7 +542,7 @@ $mount(CustomDemo, '#demo-custom');
])
]);
};
$mount(ConfirmDemo, confirmTarget);
Mount(ConfirmDemo, confirmTarget);
}
// 5. Large Content Modal
@@ -587,7 +587,7 @@ $mount(CustomDemo, '#demo-custom');
])
]);
};
$mount(LargeDemo, largeTarget);
Mount(LargeDemo, largeTarget);
}
// 6. Multiple Modals
@@ -622,7 +622,7 @@ $mount(CustomDemo, '#demo-custom');
}, 'Please review your input before proceeding.')
]);
};
$mount(MultipleDemo, multipleTarget);
Mount(MultipleDemo, multipleTarget);
}
// 7. Custom Styled Modal
@@ -652,7 +652,7 @@ $mount(CustomDemo, '#demo-custom');
])
]);
};
$mount(CustomDemo, customTarget);
Mount(CustomDemo, customTarget);
}
};

32
docs/components_old/navbar.md
View File

@@ -38,7 +38,7 @@ const BasicDemo = () => {
])
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Navigation Links
@@ -79,7 +79,7 @@ const LinksDemo = () => {
])
]);
};
$mount(LinksDemo, '#demo-links');
Mount(LinksDemo, '#demo-links');
```
### With Dropdown Menu
@@ -120,7 +120,7 @@ const DropdownDemo = () => {
])
]);
};
$mount(DropdownDemo, '#demo-dropdown');
Mount(DropdownDemo, '#demo-dropdown');
```
### With Search
@@ -156,7 +156,7 @@ const SearchDemo = () => {
])
]);
};
$mount(SearchDemo, '#demo-search');
Mount(SearchDemo, '#demo-search');
```
### With Avatar and Dropdown
@@ -195,7 +195,7 @@ const AvatarDemo = () => {
])
]);
};
$mount(AvatarDemo, '#demo-avatar');
Mount(AvatarDemo, '#demo-avatar');
```
### Responsive Navbar
@@ -234,7 +234,7 @@ const ResponsiveDemo = () => {
]) : null
]);
};
$mount(ResponsiveDemo, '#demo-responsive');
Mount(ResponsiveDemo, '#demo-responsive');
```
### With Brand and Actions
@@ -265,7 +265,7 @@ const BrandDemo = () => {
])
]);
};
$mount(BrandDemo, '#demo-brand');
Mount(BrandDemo, '#demo-brand');
```
### All Variants
@@ -300,7 +300,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -323,7 +323,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Navigation Links
@@ -357,7 +357,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(LinksDemo, linksTarget);
Mount(LinksDemo, linksTarget);
}
// 3. With Dropdown Menu
@@ -391,7 +391,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(DropdownDemo, dropdownTarget);
Mount(DropdownDemo, dropdownTarget);
}
// 4. With Search
@@ -420,7 +420,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(SearchDemo, searchTarget);
Mount(SearchDemo, searchTarget);
}
// 5. With Avatar and Dropdown
@@ -452,7 +452,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(AvatarDemo, avatarTarget);
Mount(AvatarDemo, avatarTarget);
}
// 6. Responsive Navbar
@@ -484,7 +484,7 @@ $mount(VariantsDemo, '#demo-variants');
]) : null
]);
};
$mount(ResponsiveDemo, responsiveTarget);
Mount(ResponsiveDemo, responsiveTarget);
}
// 7. With Brand and Actions
@@ -508,7 +508,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(BrandDemo, brandTarget);
Mount(BrandDemo, brandTarget);
}
// 8. All Variants
@@ -536,7 +536,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

28
docs/components_old/radio.md
View File

@@ -59,7 +59,7 @@ const BasicDemo = () => {
Div({ class: 'mt-2 text-sm opacity-70' }, () => `Selected: ${selected()}`)
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Tooltip
@@ -94,7 +94,7 @@ const TooltipDemo = () => {
})
]);
};
$mount(TooltipDemo, '#demo-tooltip');
Mount(TooltipDemo, '#demo-tooltip');
```
### Disabled State
@@ -128,7 +128,7 @@ const DisabledDemo = () => {
})
]);
};
$mount(DisabledDemo, '#demo-disabled');
Mount(DisabledDemo, '#demo-disabled');
```
### Reactive Preview
@@ -188,7 +188,7 @@ const ReactiveDemo = () => {
}, () => `${size()} ${color()} preview`)
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### Payment Method Selection
@@ -239,7 +239,7 @@ const PaymentDemo = () => {
})
]);
};
$mount(PaymentDemo, '#demo-payment');
Mount(PaymentDemo, '#demo-payment');
```
### All Variants
@@ -323,7 +323,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
### Dynamic Options
@@ -394,7 +394,7 @@ const DynamicDemo = () => {
: null
]);
};
$mount(DynamicDemo, '#demo-dynamic');
Mount(DynamicDemo, '#demo-dynamic');
```
<script>
@@ -432,7 +432,7 @@ $mount(DynamicDemo, '#demo-dynamic');
Div({ class: 'mt-2 text-sm opacity-70' }, () => `Selected: ${selected()}`)
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Tooltip
@@ -460,7 +460,7 @@ $mount(DynamicDemo, '#demo-dynamic');
})
]);
};
$mount(TooltipDemo, tooltipTarget);
Mount(TooltipDemo, tooltipTarget);
}
// 3. Disabled State
@@ -487,7 +487,7 @@ $mount(DynamicDemo, '#demo-dynamic');
})
]);
};
$mount(DisabledDemo, disabledTarget);
Mount(DisabledDemo, disabledTarget);
}
// 4. Reactive Preview
@@ -540,7 +540,7 @@ $mount(DynamicDemo, '#demo-dynamic');
}, () => `${size()} ${color()} preview`)
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 5. Payment Method Selection
@@ -584,7 +584,7 @@ $mount(DynamicDemo, '#demo-dynamic');
})
]);
};
$mount(PaymentDemo, paymentTarget);
Mount(PaymentDemo, paymentTarget);
}
// 6. All Variants
@@ -661,7 +661,7 @@ $mount(DynamicDemo, '#demo-dynamic');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
// 7. Dynamic Options
@@ -725,7 +725,7 @@ $mount(DynamicDemo, '#demo-dynamic');
: null
]);
};
$mount(DynamicDemo, dynamicTarget);
Mount(DynamicDemo, dynamicTarget);
}
};

32
docs/components_old/rating.md
View File

@@ -40,7 +40,7 @@ const BasicDemo = () => {
Div({ class: 'text-sm opacity-70' }, () => `Rating: ${rating()} / 5`)
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Heart Rating
@@ -66,7 +66,7 @@ const HeartDemo = () => {
Div({ class: 'text-sm opacity-70' }, () => `${rating()} hearts`)
]);
};
$mount(HeartDemo, '#demo-heart');
Mount(HeartDemo, '#demo-heart');
```
### Star with Outline
@@ -92,7 +92,7 @@ const Star2Demo = () => {
Div({ class: 'text-sm opacity-70' }, () => `${rating()} stars`)
]);
};
$mount(Star2Demo, '#demo-star2');
Mount(Star2Demo, '#demo-star2');
```
### Read-only Rating
@@ -117,7 +117,7 @@ const ReadonlyDemo = () => {
Div({ class: 'text-sm opacity-70' }, 'Average rating: 4.5/5 (read-only)')
]);
};
$mount(ReadonlyDemo, '#demo-readonly');
Mount(ReadonlyDemo, '#demo-readonly');
```
### Custom Count
@@ -152,7 +152,7 @@ const CustomDemo = () => {
Div({ class: 'text-sm opacity-70' }, () => `Rating: ${rating()} / ${count()}`)
]);
};
$mount(CustomDemo, '#demo-custom');
Mount(CustomDemo, '#demo-custom');
```
### Product Review
@@ -210,7 +210,7 @@ const ReviewDemo = () => {
])
]);
};
$mount(ReviewDemo, '#demo-review');
Mount(ReviewDemo, '#demo-review');
```
### All Variants
@@ -243,7 +243,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
### Interactive Feedback
@@ -294,7 +294,7 @@ const FeedbackDemo = () => {
: null
]);
};
$mount(FeedbackDemo, '#demo-feedback');
Mount(FeedbackDemo, '#demo-feedback');
```
<script>
@@ -316,7 +316,7 @@ $mount(FeedbackDemo, '#demo-feedback');
Div({ class: 'text-sm opacity-70' }, () => `Rating: ${rating()} / 5`)
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Heart Rating
@@ -335,7 +335,7 @@ $mount(FeedbackDemo, '#demo-feedback');
Div({ class: 'text-sm opacity-70' }, () => `${rating()} hearts`)
]);
};
$mount(HeartDemo, heartTarget);
Mount(HeartDemo, heartTarget);
}
// 3. Star with Outline
@@ -354,7 +354,7 @@ $mount(FeedbackDemo, '#demo-feedback');
Div({ class: 'text-sm opacity-70' }, () => `${rating()} stars`)
]);
};
$mount(Star2Demo, star2Target);
Mount(Star2Demo, star2Target);
}
// 4. Read-only Rating
@@ -372,7 +372,7 @@ $mount(FeedbackDemo, '#demo-feedback');
Div({ class: 'text-sm opacity-70' }, 'Average rating: 4.5/5 (read-only)')
]);
};
$mount(ReadonlyDemo, readonlyTarget);
Mount(ReadonlyDemo, readonlyTarget);
}
// 5. Custom Count
@@ -400,7 +400,7 @@ $mount(FeedbackDemo, '#demo-feedback');
Div({ class: 'text-sm opacity-70' }, () => `Rating: ${rating()} / ${count()}`)
]);
};
$mount(CustomDemo, customTarget);
Mount(CustomDemo, customTarget);
}
// 6. Product Review
@@ -451,7 +451,7 @@ $mount(FeedbackDemo, '#demo-feedback');
])
]);
};
$mount(ReviewDemo, reviewTarget);
Mount(ReviewDemo, reviewTarget);
}
// 7. All Variants
@@ -477,7 +477,7 @@ $mount(FeedbackDemo, '#demo-feedback');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
// 8. Interactive Feedback
@@ -521,7 +521,7 @@ $mount(FeedbackDemo, '#demo-feedback');
: null
]);
};
$mount(FeedbackDemo, feedbackTarget);
Mount(FeedbackDemo, feedbackTarget);
}
};

20
docs/components_old/select.md
View File

@@ -44,7 +44,7 @@ const BasicDemo = () => {
onchange: (e) => selected(e.target.value)
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Reactive Display
@@ -76,7 +76,7 @@ const ReactiveDemo = () => {
])
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### Disabled State
@@ -101,7 +101,7 @@ const DisabledDemo = () => {
disabled: true
});
};
$mount(DisabledDemo, '#demo-disabled');
Mount(DisabledDemo, '#demo-disabled');
```
### Dynamic Options
@@ -146,7 +146,7 @@ const DynamicDemo = () => {
})
]);
};
$mount(DynamicDemo, '#demo-dynamic');
Mount(DynamicDemo, '#demo-dynamic');
```
### All Variants
@@ -199,7 +199,7 @@ const VariantsDemo = () => {
})
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -224,7 +224,7 @@ $mount(VariantsDemo, '#demo-variants');
onchange: (e) => selected(e.target.value)
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Reactive Display
@@ -249,7 +249,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 3. Disabled State
@@ -267,7 +267,7 @@ $mount(VariantsDemo, '#demo-variants');
disabled: true
});
};
$mount(DisabledDemo, disabledTarget);
Mount(DisabledDemo, disabledTarget);
}
// 4. Dynamic Options
@@ -305,7 +305,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(DynamicDemo, dynamicTarget);
Mount(DynamicDemo, dynamicTarget);
}
// 5. All Variants
@@ -351,7 +351,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

32
docs/components_old/stack.md
View File

@@ -32,7 +32,7 @@ const BasicDemo = () => {
Div({ class: 'bg-accent text-accent-content rounded-lg p-4 shadow-lg' }, 'Layer 3')
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Card Stack
@@ -61,7 +61,7 @@ const CardsDemo = () => {
])
]);
};
$mount(CardsDemo, '#demo-cards');
Mount(CardsDemo, '#demo-cards');
```
### Avatar Stack
@@ -93,7 +93,7 @@ const AvatarsDemo = () => {
])
]);
};
$mount(AvatarsDemo, '#demo-avatars');
Mount(AvatarsDemo, '#demo-avatars');
```
### Image Stack
@@ -119,7 +119,7 @@ const ImagesDemo = () => {
])
]);
};
$mount(ImagesDemo, '#demo-images');
Mount(ImagesDemo, '#demo-images');
```
### Photo Gallery Stack
@@ -151,7 +151,7 @@ const GalleryDemo = () => {
)
]);
};
$mount(GalleryDemo, '#demo-gallery');
Mount(GalleryDemo, '#demo-gallery');
```
### Interactive Stack
@@ -191,7 +191,7 @@ const InteractiveDemo = () => {
])
]);
};
$mount(InteractiveDemo, '#demo-interactive');
Mount(InteractiveDemo, '#demo-interactive');
```
### Notification Stack
@@ -243,7 +243,7 @@ const NotificationsDemo = () => {
}, 'Clear All')
]);
};
$mount(NotificationsDemo, '#demo-notifications');
Mount(NotificationsDemo, '#demo-notifications');
```
### All Variants
@@ -284,7 +284,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -301,7 +301,7 @@ $mount(VariantsDemo, '#demo-variants');
Div({ class: 'bg-accent text-accent-content rounded-lg p-4 shadow-lg' }, 'Layer 3')
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Card Stack
@@ -323,7 +323,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(CardsDemo, cardsTarget);
Mount(CardsDemo, cardsTarget);
}
// 3. Avatar Stack
@@ -348,7 +348,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(AvatarsDemo, avatarsTarget);
Mount(AvatarsDemo, avatarsTarget);
}
// 4. Image Stack
@@ -367,7 +367,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(ImagesDemo, imagesTarget);
Mount(ImagesDemo, imagesTarget);
}
// 5. Photo Gallery Stack
@@ -392,7 +392,7 @@ $mount(VariantsDemo, '#demo-variants');
)
]);
};
$mount(GalleryDemo, galleryTarget);
Mount(GalleryDemo, galleryTarget);
}
// 6. Interactive Stack
@@ -425,7 +425,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(InteractiveDemo, interactiveTarget);
Mount(InteractiveDemo, interactiveTarget);
}
// 7. Notification Stack
@@ -470,7 +470,7 @@ $mount(VariantsDemo, '#demo-variants');
}, 'Clear All')
]);
};
$mount(NotificationsDemo, notificationsTarget);
Mount(NotificationsDemo, notificationsTarget);
}
// 8. All Variants
@@ -504,7 +504,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

32
docs/components_old/stat.md
View File

@@ -47,7 +47,7 @@ const BasicDemo = () => {
})
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Icons
@@ -82,7 +82,7 @@ const IconsDemo = () => {
})
]);
};
$mount(IconsDemo, '#demo-icons');
Mount(IconsDemo, '#demo-icons');
```
### Reactive Values
@@ -125,7 +125,7 @@ const ReactiveDemo = () => {
])
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### With Trend Indicators
@@ -160,7 +160,7 @@ const TrendsDemo = () => {
})
]);
};
$mount(TrendsDemo, '#demo-trends');
Mount(TrendsDemo, '#demo-trends');
```
### Multiple Stats in Row
@@ -201,7 +201,7 @@ const MultipleDemo = () => {
})
]);
};
$mount(MultipleDemo, '#demo-multiple');
Mount(MultipleDemo, '#demo-multiple');
```
### Dashboard Example
@@ -266,7 +266,7 @@ const DashboardDemo = () => {
])
]);
};
$mount(DashboardDemo, '#demo-dashboard');
Mount(DashboardDemo, '#demo-dashboard');
```
### All Variants
@@ -311,7 +311,7 @@ const VariantsDemo = () => {
})
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
### Compact Stats
@@ -348,7 +348,7 @@ const CompactDemo = () => {
})
]);
};
$mount(CompactDemo, '#demo-compact');
Mount(CompactDemo, '#demo-compact');
```
<script>
@@ -377,7 +377,7 @@ $mount(CompactDemo, '#demo-compact');
})
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Icons
@@ -405,7 +405,7 @@ $mount(CompactDemo, '#demo-compact');
})
]);
};
$mount(IconsDemo, iconsTarget);
Mount(IconsDemo, iconsTarget);
}
// 3. Reactive Values
@@ -441,7 +441,7 @@ $mount(CompactDemo, '#demo-compact');
])
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 4. With Trend Indicators
@@ -469,7 +469,7 @@ $mount(CompactDemo, '#demo-compact');
})
]);
};
$mount(TrendsDemo, trendsTarget);
Mount(TrendsDemo, trendsTarget);
}
// 5. Multiple Stats in Row
@@ -503,7 +503,7 @@ $mount(CompactDemo, '#demo-compact');
})
]);
};
$mount(MultipleDemo, multipleTarget);
Mount(MultipleDemo, multipleTarget);
}
// 6. Dashboard Example
@@ -561,7 +561,7 @@ $mount(CompactDemo, '#demo-compact');
])
]);
};
$mount(DashboardDemo, dashboardTarget);
Mount(DashboardDemo, dashboardTarget);
}
// 7. All Variants
@@ -599,7 +599,7 @@ $mount(CompactDemo, '#demo-compact');
})
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
// 8. Compact Stats
@@ -629,7 +629,7 @@ $mount(CompactDemo, '#demo-compact');
})
]);
};
$mount(CompactDemo, compactTarget);
Mount(CompactDemo, compactTarget);
}
};

32
docs/components_old/swap.md
View File

@@ -38,7 +38,7 @@ const BasicDemo = () => {
onclick: () => isOn(!isOn())
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Icon Swap
@@ -61,7 +61,7 @@ const IconsDemo = () => {
onclick: () => isOn(!isOn())
});
};
$mount(IconsDemo, '#demo-icons');
Mount(IconsDemo, '#demo-icons');
```
### Emoji Swap
@@ -84,7 +84,7 @@ const EmojiDemo = () => {
onclick: () => isOn(!isOn())
});
};
$mount(EmojiDemo, '#demo-emoji');
Mount(EmojiDemo, '#demo-emoji');
```
### Custom Content Swap
@@ -107,7 +107,7 @@ const CustomDemo = () => {
onclick: () => isOn(!isOn())
});
};
$mount(CustomDemo, '#demo-custom');
Mount(CustomDemo, '#demo-custom');
```
### With Reactive State
@@ -137,7 +137,7 @@ const ReactiveDemo = () => {
)
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### Toggle Mode Swap
@@ -188,7 +188,7 @@ const ModeDemo = () => {
])
]);
};
$mount(ModeDemo, '#demo-mode');
Mount(ModeDemo, '#demo-mode');
```
### All Variants
@@ -237,7 +237,7 @@ const VariantsDemo = () => {
])
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
### Simple Todo Toggle
@@ -276,7 +276,7 @@ const TodoDemo = () => {
})
]);
};
$mount(TodoDemo, '#demo-todo');
Mount(TodoDemo, '#demo-todo');
```
<script>
@@ -296,7 +296,7 @@ $mount(TodoDemo, '#demo-todo');
onclick: () => isOn(!isOn())
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Icon Swap
@@ -312,7 +312,7 @@ $mount(TodoDemo, '#demo-todo');
onclick: () => isOn(!isOn())
});
};
$mount(IconsDemo, iconsTarget);
Mount(IconsDemo, iconsTarget);
}
// 3. Emoji Swap
@@ -328,7 +328,7 @@ $mount(TodoDemo, '#demo-todo');
onclick: () => isOn(!isOn())
});
};
$mount(EmojiDemo, emojiTarget);
Mount(EmojiDemo, emojiTarget);
}
// 4. Custom Content Swap
@@ -344,7 +344,7 @@ $mount(TodoDemo, '#demo-todo');
onclick: () => isOn(!isOn())
});
};
$mount(CustomDemo, customTarget);
Mount(CustomDemo, customTarget);
}
// 5. Reactive State
@@ -367,7 +367,7 @@ $mount(TodoDemo, '#demo-todo');
)
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 6. Toggle Mode Swap
@@ -411,7 +411,7 @@ $mount(TodoDemo, '#demo-todo');
])
]);
};
$mount(ModeDemo, modeTarget);
Mount(ModeDemo, modeTarget);
}
// 7. All Variants
@@ -453,7 +453,7 @@ $mount(TodoDemo, '#demo-todo');
])
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
// 8. Simple Todo Toggle
@@ -485,7 +485,7 @@ $mount(TodoDemo, '#demo-todo');
})
]);
};
$mount(TodoDemo, todoTarget);
Mount(TodoDemo, todoTarget);
}
};

32
docs/components_old/table.md
View File

@@ -47,7 +47,7 @@ const BasicDemo = () => {
]
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Zebra Stripes
@@ -78,7 +78,7 @@ const ZebraDemo = () => {
zebra: true
});
};
$mount(ZebraDemo, '#demo-zebra');
Mount(ZebraDemo, '#demo-zebra');
```
### With Custom Cell Rendering
@@ -124,7 +124,7 @@ const CustomDemo = () => {
zebra: true
});
};
$mount(CustomDemo, '#demo-custom');
Mount(CustomDemo, '#demo-custom');
```
### With Footers
@@ -172,7 +172,7 @@ const FooterDemo = () => {
zebra: true
});
};
$mount(FooterDemo, '#demo-footer');
Mount(FooterDemo, '#demo-footer');
```
### Empty State
@@ -200,7 +200,7 @@ const EmptyDemo = () => {
])
});
};
$mount(EmptyDemo, '#demo-empty');
Mount(EmptyDemo, '#demo-empty');
```
### Reactive Data
@@ -271,7 +271,7 @@ const ReactiveDemo = () => {
})
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### With Actions
@@ -331,7 +331,7 @@ const ActionsDemo = () => {
zebra: true
});
};
$mount(ActionsDemo, '#demo-actions');
Mount(ActionsDemo, '#demo-actions');
```
### All Variants
@@ -385,7 +385,7 @@ const VariantsDemo = () => {
})
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -412,7 +412,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Zebra Stripes
@@ -436,7 +436,7 @@ $mount(VariantsDemo, '#demo-variants');
zebra: true
});
};
$mount(ZebraDemo, zebraTarget);
Mount(ZebraDemo, zebraTarget);
}
// 3. With Custom Cell Rendering
@@ -475,7 +475,7 @@ $mount(VariantsDemo, '#demo-variants');
zebra: true
});
};
$mount(CustomDemo, customTarget);
Mount(CustomDemo, customTarget);
}
// 4. With Footers
@@ -516,7 +516,7 @@ $mount(VariantsDemo, '#demo-variants');
zebra: true
});
};
$mount(FooterDemo, footerTarget);
Mount(FooterDemo, footerTarget);
}
// 5. Empty State
@@ -537,7 +537,7 @@ $mount(VariantsDemo, '#demo-variants');
])
});
};
$mount(EmptyDemo, emptyTarget);
Mount(EmptyDemo, emptyTarget);
}
// 6. Reactive Data
@@ -601,7 +601,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 7. With Actions
@@ -654,7 +654,7 @@ $mount(VariantsDemo, '#demo-variants');
zebra: true
});
};
$mount(ActionsDemo, actionsTarget);
Mount(ActionsDemo, actionsTarget);
}
// 8. All Variants
@@ -701,7 +701,7 @@ $mount(VariantsDemo, '#demo-variants');
})
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

28
docs/components_old/tabs.md
View File

@@ -62,7 +62,7 @@ const BasicDemo = () => {
]
});
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### With Icons
@@ -101,7 +101,7 @@ const IconsDemo = () => {
]
});
};
$mount(IconsDemo, '#demo-icons');
Mount(IconsDemo, '#demo-icons');
```
### With Tooltips
@@ -143,7 +143,7 @@ const TooltipsDemo = () => {
]
});
};
$mount(TooltipsDemo, '#demo-tooltips');
Mount(TooltipsDemo, '#demo-tooltips');
```
### Disabled Tab
@@ -182,7 +182,7 @@ const DisabledDemo = () => {
]
});
};
$mount(DisabledDemo, '#demo-disabled');
Mount(DisabledDemo, '#demo-disabled');
```
### Reactive Content
@@ -228,7 +228,7 @@ const ReactiveDemo = () => {
]
});
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### Form Tabs
@@ -330,7 +330,7 @@ const FormTabs = () => {
])
]);
};
$mount(FormTabs, '#demo-form');
Mount(FormTabs, '#demo-form');
```
### All Variants
@@ -365,7 +365,7 @@ const VariantsDemo = () => {
Tabs({ items, class: 'tabs-lifted' })
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -401,7 +401,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. With Icons
@@ -433,7 +433,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(IconsDemo, iconsTarget);
Mount(IconsDemo, iconsTarget);
}
// 3. With Tooltips
@@ -468,7 +468,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(TooltipsDemo, tooltipsTarget);
Mount(TooltipsDemo, tooltipsTarget);
}
// 4. Disabled Tab
@@ -500,7 +500,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(DisabledDemo, disabledTarget);
Mount(DisabledDemo, disabledTarget);
}
// 5. Reactive Content
@@ -539,7 +539,7 @@ $mount(VariantsDemo, '#demo-variants');
]
});
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 6. Form Tabs
@@ -634,7 +634,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(FormTabs, formTarget);
Mount(FormTabs, formTarget);
}
// 7. All Variants
@@ -662,7 +662,7 @@ $mount(VariantsDemo, '#demo-variants');
Tabs({ items, class: 'tabs-lifted' })
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

32
docs/components_old/timeline.md
View File

@@ -48,7 +48,7 @@ const BasicDemo = () => {
return Timeline({ items: events });
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Horizontal Timeline
@@ -76,7 +76,7 @@ const HorizontalDemo = () => {
class: 'min-w-[600px]'
});
};
$mount(HorizontalDemo, '#demo-horizontal');
Mount(HorizontalDemo, '#demo-horizontal');
```
### Compact Timeline
@@ -102,7 +102,7 @@ const CompactDemo = () => {
compact: true
});
};
$mount(CompactDemo, '#demo-compact');
Mount(CompactDemo, '#demo-compact');
```
### Custom Icons
@@ -125,7 +125,7 @@ const IconsDemo = () => {
return Timeline({ items: milestones });
};
$mount(IconsDemo, '#demo-icons');
Mount(IconsDemo, '#demo-icons');
```
### Reactive Timeline
@@ -179,7 +179,7 @@ const ReactiveDemo = () => {
])
]);
};
$mount(ReactiveDemo, '#demo-reactive');
Mount(ReactiveDemo, '#demo-reactive');
```
### Order Status Tracker
@@ -221,7 +221,7 @@ const OrderDemo = () => {
))
]);
};
$mount(OrderDemo, '#demo-order');
Mount(OrderDemo, '#demo-order');
```
### Company History
@@ -276,7 +276,7 @@ const HistoryDemo = () => {
return Timeline({ items: milestones });
};
$mount(HistoryDemo, '#demo-history');
Mount(HistoryDemo, '#demo-history');
```
### All Variants
@@ -307,7 +307,7 @@ const VariantsDemo = () => {
Timeline({ items: sampleItems, compact: true })
]);
};
$mount(VariantsDemo, '#demo-variants');
Mount(VariantsDemo, '#demo-variants');
```
<script>
@@ -328,7 +328,7 @@ $mount(VariantsDemo, '#demo-variants');
return Timeline({ items: events });
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Horizontal Timeline
@@ -349,7 +349,7 @@ $mount(VariantsDemo, '#demo-variants');
class: 'min-w-[600px]'
});
};
$mount(HorizontalDemo, horizontalTarget);
Mount(HorizontalDemo, horizontalTarget);
}
// 3. Compact Timeline
@@ -368,7 +368,7 @@ $mount(VariantsDemo, '#demo-variants');
compact: true
});
};
$mount(CompactDemo, compactTarget);
Mount(CompactDemo, compactTarget);
}
// 4. Custom Icons
@@ -384,7 +384,7 @@ $mount(VariantsDemo, '#demo-variants');
return Timeline({ items: milestones });
};
$mount(IconsDemo, iconsTarget);
Mount(IconsDemo, iconsTarget);
}
// 5. Reactive Timeline
@@ -431,7 +431,7 @@ $mount(VariantsDemo, '#demo-variants');
])
]);
};
$mount(ReactiveDemo, reactiveTarget);
Mount(ReactiveDemo, reactiveTarget);
}
// 6. Order Status Tracker
@@ -466,7 +466,7 @@ $mount(VariantsDemo, '#demo-variants');
))
]);
};
$mount(OrderDemo, orderTarget);
Mount(OrderDemo, orderTarget);
}
// 7. Company History
@@ -514,7 +514,7 @@ $mount(VariantsDemo, '#demo-variants');
return Timeline({ items: milestones });
};
$mount(HistoryDemo, historyTarget);
Mount(HistoryDemo, historyTarget);
}
// 8. All Variants
@@ -538,7 +538,7 @@ $mount(VariantsDemo, '#demo-variants');
Timeline({ items: sampleItems, compact: true })
]);
};
$mount(VariantsDemo, variantsTarget);
Mount(VariantsDemo, variantsTarget);
}
};

32
docs/components_old/toast.md
View File

@@ -44,7 +44,7 @@ const BasicDemo = () => {
}, 'Error Toast')
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Different Durations
@@ -77,7 +77,7 @@ const DurationDemo = () => {
}, '8 Seconds')
]);
};
$mount(DurationDemo, '#demo-duration');
Mount(DurationDemo, '#demo-duration');
```
### Interactive Toast
@@ -115,7 +115,7 @@ const InteractiveDemo = () => {
Div({ class: 'text-sm opacity-70' }, () => `Toasts shown: ${count()}`)
]);
};
$mount(InteractiveDemo, '#demo-interactive');
Mount(InteractiveDemo, '#demo-interactive');
```
### Form Validation Toast
@@ -174,7 +174,7 @@ const FormToastDemo = () => {
}, 'Login')
]);
};
$mount(FormToastDemo, '#demo-form');
Mount(FormToastDemo, '#demo-form');
```
### Success Feedback
@@ -227,7 +227,7 @@ const FeedbackDemo = () => {
))
]);
};
$mount(FeedbackDemo, '#demo-feedback');
Mount(FeedbackDemo, '#demo-feedback');
```
### Error Handling
@@ -274,7 +274,7 @@ const ErrorDemo = () => {
}, 'Timeout')
]);
};
$mount(ErrorDemo, '#demo-error');
Mount(ErrorDemo, '#demo-error');
```
### Custom Messages
@@ -311,7 +311,7 @@ const CustomDemo = () => {
}, 'Security Alert')
]);
};
$mount(CustomDemo, '#demo-custom');
Mount(CustomDemo, '#demo-custom');
```
### Multiple Toasts
@@ -339,7 +339,7 @@ const MultipleDemo = () => {
}, 'Show Multiple Toasts')
]);
};
$mount(MultipleDemo, '#demo-multiple');
Mount(MultipleDemo, '#demo-multiple');
```
<script>
@@ -369,7 +369,7 @@ $mount(MultipleDemo, '#demo-multiple');
}, 'Error Toast')
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Different Durations
@@ -395,7 +395,7 @@ $mount(MultipleDemo, '#demo-multiple');
}, '8 Seconds')
]);
};
$mount(DurationDemo, durationTarget);
Mount(DurationDemo, durationTarget);
}
// 3. Interactive Toast
@@ -426,7 +426,7 @@ $mount(MultipleDemo, '#demo-multiple');
Div({ class: 'text-sm opacity-70' }, () => `Toasts shown: ${count()}`)
]);
};
$mount(InteractiveDemo, interactiveTarget);
Mount(InteractiveDemo, interactiveTarget);
}
// 4. Form Validation Toast
@@ -478,7 +478,7 @@ $mount(MultipleDemo, '#demo-multiple');
}, 'Login')
]);
};
$mount(FormToastDemo, formTarget);
Mount(FormToastDemo, formTarget);
}
// 5. Success Feedback
@@ -524,7 +524,7 @@ $mount(MultipleDemo, '#demo-multiple');
))
]);
};
$mount(FeedbackDemo, feedbackTarget);
Mount(FeedbackDemo, feedbackTarget);
}
// 6. Error Handling
@@ -564,7 +564,7 @@ $mount(MultipleDemo, '#demo-multiple');
}, 'Timeout')
]);
};
$mount(ErrorDemo, errorTarget);
Mount(ErrorDemo, errorTarget);
}
// 7. Custom Messages
@@ -594,7 +594,7 @@ $mount(MultipleDemo, '#demo-multiple');
}, 'Security Alert')
]);
};
$mount(CustomDemo, customTarget);
Mount(CustomDemo, customTarget);
}
// 8. Multiple Toasts
@@ -615,7 +615,7 @@ $mount(MultipleDemo, '#demo-multiple');
}, 'Show Multiple Toasts')
]);
};
$mount(MultipleDemo, multipleTarget);
Mount(MultipleDemo, multipleTarget);
}
};

32
docs/components_old/tooltip.md
View File

@@ -39,7 +39,7 @@ const BasicDemo = () => {
])
]);
};
$mount(BasicDemo, '#demo-basic');
Mount(BasicDemo, '#demo-basic');
```
### Tooltip Positions
@@ -68,7 +68,7 @@ const PositionsDemo = () => {
])
]);
};
$mount(PositionsDemo, '#demo-positions');
Mount(PositionsDemo, '#demo-positions');
```
### Tooltip with Icons
@@ -97,7 +97,7 @@ const IconsDemo = () => {
])
]);
};
$mount(IconsDemo, '#demo-icons');
Mount(IconsDemo, '#demo-icons');
```
### Form Field Tooltips
@@ -140,7 +140,7 @@ const FormDemo = () => {
])
]);
};
$mount(FormDemo, '#demo-form');
Mount(FormDemo, '#demo-form');
```
### Interactive Tooltip
@@ -183,7 +183,7 @@ const InteractiveDemo = () => {
])
]);
};
$mount(InteractiveDemo, '#demo-interactive');
Mount(InteractiveDemo, '#demo-interactive');
```
### Rich Tooltip Content
@@ -222,7 +222,7 @@ const RichDemo = () => {
])
]);
};
$mount(RichDemo, '#demo-rich');
Mount(RichDemo, '#demo-rich');
```
### Color Variants
@@ -260,7 +260,7 @@ const ColorsDemo = () => {
])
]);
};
$mount(ColorsDemo, '#demo-colors');
Mount(ColorsDemo, '#demo-colors');
```
### All Tooltip Positions
@@ -302,7 +302,7 @@ const AllPositionsDemo = () => {
])
]);
};
$mount(AllPositionsDemo, '#demo-all-positions');
Mount(AllPositionsDemo, '#demo-all-positions');
```
<script>
@@ -325,7 +325,7 @@ $mount(AllPositionsDemo, '#demo-all-positions');
])
]);
};
$mount(BasicDemo, basicTarget);
Mount(BasicDemo, basicTarget);
}
// 2. Tooltip Positions
@@ -347,7 +347,7 @@ $mount(AllPositionsDemo, '#demo-all-positions');
])
]);
};
$mount(PositionsDemo, positionsTarget);
Mount(PositionsDemo, positionsTarget);
}
// 3. Tooltip with Icons
@@ -369,7 +369,7 @@ $mount(AllPositionsDemo, '#demo-all-positions');
])
]);
};
$mount(IconsDemo, iconsTarget);
Mount(IconsDemo, iconsTarget);
}
// 4. Form Field Tooltips
@@ -405,7 +405,7 @@ $mount(AllPositionsDemo, '#demo-all-positions');
])
]);
};
$mount(FormDemo, formTarget);
Mount(FormDemo, formTarget);
}
// 5. Interactive Tooltip
@@ -441,7 +441,7 @@ $mount(AllPositionsDemo, '#demo-all-positions');
])
]);
};
$mount(InteractiveDemo, interactiveTarget);
Mount(InteractiveDemo, interactiveTarget);
}
// 6. Rich Tooltip Content
@@ -473,7 +473,7 @@ $mount(AllPositionsDemo, '#demo-all-positions');
])
]);
};
$mount(RichDemo, richTarget);
Mount(RichDemo, richTarget);
}
// 7. Color Variants
@@ -504,7 +504,7 @@ $mount(AllPositionsDemo, '#demo-all-positions');
])
]);
};
$mount(ColorsDemo, colorsTarget);
Mount(ColorsDemo, colorsTarget);
}
// 8. All Tooltip Positions
@@ -539,7 +539,7 @@ $mount(AllPositionsDemo, '#demo-all-positions');
])
]);
};
$mount(AllPositionsDemo, allPositionsTarget);
Mount(AllPositionsDemo, allPositionsTarget);
}
};