Fix showcase dependencies
- Add resolve.dedupe for solid-js to prevent duplicate context instances - Rewrite Pagination with correct page/totalPages/onPageChange API + children - Add Calendar inside DatePicker.Content so dates actually render
This commit is contained in:
parent
d8ac5e4cb6
commit
eea201cd12
@ -1,5 +1,6 @@
|
||||
import { Form } from "pettyui/form";
|
||||
import { DatePicker } from "pettyui/date-picker";
|
||||
import { Calendar } from "pettyui/calendar";
|
||||
import { ComponentDemo } from "../component-demo";
|
||||
|
||||
/** Form demo with validation and error display. */
|
||||
@ -42,7 +43,19 @@ function DatePickerDemo() {
|
||||
<DatePicker.Input placeholder="Pick a date" class="w-full px-3 py-1.5 text-sm rounded focus:outline-none" />
|
||||
<DatePicker.Trigger class="px-2 text-gray-400 hover:text-gray-600">📅</DatePicker.Trigger>
|
||||
</div>
|
||||
<DatePicker.Content class="absolute top-full mt-1 border border-gray-200 rounded bg-white shadow-lg z-10 p-2" />
|
||||
<DatePicker.Content class="absolute top-full mt-1 border border-gray-200 rounded bg-white shadow-lg z-10 p-2">
|
||||
<Calendar class="w-64">
|
||||
<Calendar.Header class="flex items-center justify-between mb-2">
|
||||
<Calendar.PrevButton class="w-7 h-7 flex items-center justify-center rounded hover:bg-gray-100 text-gray-600 text-sm">‹</Calendar.PrevButton>
|
||||
<Calendar.Heading class="text-sm font-semibold text-gray-800" />
|
||||
<Calendar.NextButton class="w-7 h-7 flex items-center justify-center rounded hover:bg-gray-100 text-gray-600 text-sm">›</Calendar.NextButton>
|
||||
</Calendar.Header>
|
||||
<Calendar.Grid class="w-full border-collapse">
|
||||
<Calendar.GridHead class="[&_th]:text-xs [&_th]:text-gray-400 [&_th]:font-medium [&_th]:pb-1 [&_th]:text-center" />
|
||||
<Calendar.GridBody class="[&_td]:text-center [&_td]:p-0.5 [&_td]:text-sm [&_td]:rounded [&_td]:cursor-pointer [&_td:hover]:bg-indigo-50 [&_td[data-selected]]:bg-indigo-600 [&_td[data-selected]]:text-white [&_td[data-today]]:font-bold [&_td[data-outside-month]]:text-gray-300" />
|
||||
</Calendar.Grid>
|
||||
</Calendar>
|
||||
</DatePicker.Content>
|
||||
</DatePicker>
|
||||
);
|
||||
return content;
|
||||
|
||||
@ -7,6 +7,7 @@ export default defineConfig({
|
||||
plugins: [solid(), tailwindcss()],
|
||||
resolve: {
|
||||
conditions: ["solid", "browser", "module", "import"],
|
||||
dedupe: ["solid-js"],
|
||||
alias: {
|
||||
"pettyui": path.resolve(__dirname, "../core/src/components"),
|
||||
},
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user