@pathscale/ui 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Accordion-nwuRbRRw.d.ts +27 -0
- package/dist/Checkbox-BjaweaOH.d.ts +40 -0
- package/dist/Pagination-BlrjElGg.d.ts +43 -0
- package/dist/Progress-a616LgE0.d.ts +5 -0
- package/dist/Select-CP-TUHJv.d.ts +44 -0
- package/dist/Switch-3IXS_68H.d.ts +72 -0
- package/dist/Tabs-BNR3p92D.d.ts +42 -0
- package/dist/Tag-BPrhn-Ne.d.ts +42 -0
- package/dist/Tooltip-BfPongoz.d.ts +53 -0
- package/dist/Upload-BrFuZ4JA.d.ts +39 -0
- package/dist/chunk/3IHANYRN.js +98 -0
- package/dist/chunk/4TWLQ3IA.js +103 -0
- package/dist/chunk/6SBH3KSM.jsx +96 -0
- package/dist/chunk/CJZGTNJZ.js +115 -0
- package/dist/chunk/DBQ7IOPU.js +189 -0
- package/dist/chunk/DNTGSCVF.jsx +100 -0
- package/dist/chunk/ELRAUORW.jsx +179 -0
- package/dist/chunk/FPUQ25SO.js +137 -0
- package/dist/chunk/GLEAR2TS.jsx +160 -0
- package/dist/chunk/KV6LTJHI.jsx +175 -0
- package/dist/chunk/LI3HCFL7.jsx +132 -0
- package/dist/chunk/MMTAND25.jsx +126 -0
- package/dist/chunk/MXG3MBEN.jsx +148 -0
- package/dist/chunk/NZKPDBTE.js +118 -0
- package/dist/chunk/P2L6LFLS.js +144 -0
- package/dist/chunk/QLESLIWS.jsx +110 -0
- package/dist/chunk/QNOJ6PCD.js +278 -0
- package/dist/chunk/QONDPQ2I.jsx +105 -0
- package/dist/chunk/S3ZDSQSV.js +98 -0
- package/dist/chunk/V6Y5E7BL.js +133 -0
- package/dist/chunk/WCBMW2TP.jsx +203 -0
- package/dist/chunk/WOT36Q7O.js +166 -0
- package/dist/components/Progress/index.d.ts +2 -3
- package/dist/components/Progress/index.js +1 -278
- package/dist/components/Progress/index.jsx +7 -194
- package/dist/components/accordion/index.d.ts +5 -24
- package/dist/components/accordion/index.js +1 -118
- package/dist/components/accordion/index.jsx +3 -100
- package/dist/components/breadcrumb/index.d.ts +2 -2
- package/dist/components/breadcrumb/index.js +1 -133
- package/dist/components/breadcrumb/index.jsx +4 -120
- package/dist/components/checkbox/index.d.ts +5 -37
- package/dist/components/checkbox/index.js +1 -137
- package/dist/components/checkbox/index.jsx +3 -143
- package/dist/components/pagination/index.d.ts +5 -40
- package/dist/components/pagination/index.js +1 -189
- package/dist/components/pagination/index.jsx +3 -174
- package/dist/components/select/index.d.ts +5 -41
- package/dist/components/select/index.js +1 -98
- package/dist/components/select/index.jsx +3 -91
- package/dist/components/switch/index.d.ts +5 -69
- package/dist/components/switch/index.js +1 -144
- package/dist/components/switch/index.jsx +3 -155
- package/dist/components/tabs/index.d.ts +5 -39
- package/dist/components/tabs/index.js +1 -166
- package/dist/components/tabs/index.jsx +3 -170
- package/dist/components/tag/index.d.ts +5 -39
- package/dist/components/tag/index.js +1 -115
- package/dist/components/tag/index.jsx +3 -127
- package/dist/components/tooltip/index.d.ts +5 -50
- package/dist/components/tooltip/index.js +1 -103
- package/dist/components/tooltip/index.jsx +3 -95
- package/dist/components/upload/index.d.ts +5 -36
- package/dist/components/upload/index.js +1 -98
- package/dist/components/upload/index.jsx +3 -105
- package/dist/index.d.ts +11 -0
- package/dist/index.js +12 -1
- package/dist/index.jsx +47 -1
- package/package.json +1 -1
|
@@ -1,124 +1,8 @@
|
|
|
1
1
|
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
import {
|
|
7
|
-
splitProps,
|
|
8
|
-
children,
|
|
9
|
-
createMemo,
|
|
10
|
-
untrack
|
|
11
|
-
} from "solid-js";
|
|
12
|
-
|
|
13
|
-
// src/components/breadcrumb/Breadcrumb.styles.ts
|
|
14
|
-
var breadcrumbContainerVariants = cva(
|
|
15
|
-
["flex", "items-center", "gap-2", "text-sm"],
|
|
16
|
-
{
|
|
17
|
-
variants: {
|
|
18
|
-
alignment: {
|
|
19
|
-
left: "justify-start",
|
|
20
|
-
center: "justify-center",
|
|
21
|
-
right: "justify-end"
|
|
22
|
-
},
|
|
23
|
-
size: {
|
|
24
|
-
sm: "text-xs gap-1",
|
|
25
|
-
md: "text-sm gap-2",
|
|
26
|
-
lg: "text-base gap-3"
|
|
27
|
-
},
|
|
28
|
-
separator: {
|
|
29
|
-
arrow: "breadcrumb-arrow",
|
|
30
|
-
dot: "breadcrumb-dot",
|
|
31
|
-
bullet: "breadcrumb-bullet",
|
|
32
|
-
succeeds: "breadcrumb-succeeds"
|
|
33
|
-
}
|
|
34
|
-
},
|
|
35
|
-
defaultVariants: {
|
|
36
|
-
alignment: "left",
|
|
37
|
-
size: "md"
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
);
|
|
41
|
-
var breadcrumbItemVariants = cva(
|
|
42
|
-
["text-gray-600", "dark:text-gray-300"],
|
|
43
|
-
{
|
|
44
|
-
variants: {
|
|
45
|
-
active: {
|
|
46
|
-
true: "text-blue-600 font-semibold cursor-default",
|
|
47
|
-
false: "hover:underline"
|
|
48
|
-
}
|
|
49
|
-
},
|
|
50
|
-
defaultVariants: {
|
|
51
|
-
active: false
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
);
|
|
55
|
-
|
|
56
|
-
// src/components/breadcrumb/Breadcrumb.tsx
|
|
57
|
-
var separatorMap = {
|
|
58
|
-
arrow: "\u2192",
|
|
59
|
-
dot: "\xB7",
|
|
60
|
-
bullet: "\u2022",
|
|
61
|
-
succeeds: "\xBB"
|
|
62
|
-
};
|
|
63
|
-
var Breadcrumb = (props) => {
|
|
64
|
-
const [local, variantProps, otherProps] = splitProps(
|
|
65
|
-
props,
|
|
66
|
-
["children"],
|
|
67
|
-
["alignment", "size", "separator"]
|
|
68
|
-
);
|
|
69
|
-
const resolvedChildren = children(() => local.children);
|
|
70
|
-
const items = createMemo(() => resolvedChildren.toArray());
|
|
71
|
-
const separator = createMemo(
|
|
72
|
-
() => untrack(() => {
|
|
73
|
-
const sep = variantProps.separator;
|
|
74
|
-
return sep && separatorMap[sep] ? separatorMap[sep] : "/";
|
|
75
|
-
})
|
|
76
|
-
);
|
|
77
|
-
const containerClasses = createMemo(
|
|
78
|
-
() => breadcrumbContainerVariants(variantProps)
|
|
79
|
-
);
|
|
80
|
-
const renderItems = createMemo(() => {
|
|
81
|
-
return items().reduce((acc, item, idx) => {
|
|
82
|
-
if (idx > 0) {
|
|
83
|
-
acc.push(
|
|
84
|
-
<li class="text-gray-400 select-none" aria-hidden="true">
|
|
85
|
-
{separator()}
|
|
86
|
-
</li>
|
|
87
|
-
);
|
|
88
|
-
}
|
|
89
|
-
acc.push(
|
|
90
|
-
<li>
|
|
91
|
-
<span aria-current={idx === items().length - 1 ? "page" : void 0}>
|
|
92
|
-
{item}
|
|
93
|
-
</span>
|
|
94
|
-
</li>
|
|
95
|
-
);
|
|
96
|
-
return acc;
|
|
97
|
-
}, []);
|
|
98
|
-
});
|
|
99
|
-
return <nav class={containerClasses()} aria-label="Breadcrumb" {...otherProps}>
|
|
100
|
-
<ol class="flex items-center flex-wrap gap-1">{renderItems()}</ol>
|
|
101
|
-
</nav>;
|
|
102
|
-
};
|
|
103
|
-
var Breadcrumb_default = Breadcrumb;
|
|
104
|
-
|
|
105
|
-
// src/components/breadcrumb/BreadcrumbItem.tsx
|
|
106
|
-
import { splitProps as splitProps2 } from "solid-js";
|
|
107
|
-
var BreadcrumbItem = (props) => {
|
|
108
|
-
const [local, variantProps] = splitProps2(
|
|
109
|
-
props,
|
|
110
|
-
["children", "href", "active"],
|
|
111
|
-
["active"]
|
|
112
|
-
);
|
|
113
|
-
return <li class="flex items-center gap-1">
|
|
114
|
-
{local.href && !local.active ? <a href={local.href} class={breadcrumbItemVariants(variantProps)}>
|
|
115
|
-
{local.children}
|
|
116
|
-
</a> : <span class={breadcrumbItemVariants({ active: true })}>
|
|
117
|
-
{local.children}
|
|
118
|
-
</span>}
|
|
119
|
-
</li>;
|
|
120
|
-
};
|
|
121
|
-
var BreadcrumbItem_default = BreadcrumbItem;
|
|
2
|
+
BreadcrumbItem_default,
|
|
3
|
+
Breadcrumb_default
|
|
4
|
+
} from "../../chunk/MMTAND25.jsx";
|
|
5
|
+
import "../../chunk/P7WPLZNA.jsx";
|
|
122
6
|
export {
|
|
123
7
|
Breadcrumb_default as Breadcrumb,
|
|
124
8
|
BreadcrumbItem_default as BreadcrumbItem
|
|
@@ -1,40 +1,8 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { C as Checkbox } from '../../Checkbox-BjaweaOH.js';
|
|
2
|
+
export { a as CheckboxProps } from '../../Checkbox-BjaweaOH.js';
|
|
3
|
+
import 'solid-js';
|
|
4
|
+
import '../../classes-B_S9K-9I.js';
|
|
3
5
|
|
|
4
|
-
declare const checkboxVariants: {
|
|
5
|
-
(props?: (ConfigVariants<{
|
|
6
|
-
size: {
|
|
7
|
-
sm: string;
|
|
8
|
-
md: string;
|
|
9
|
-
lg: string;
|
|
10
|
-
};
|
|
11
|
-
color: {
|
|
12
|
-
primary: string;
|
|
13
|
-
success: string;
|
|
14
|
-
warning: string;
|
|
15
|
-
danger: string;
|
|
16
|
-
};
|
|
17
|
-
checked: {
|
|
18
|
-
true: string;
|
|
19
|
-
false: string;
|
|
20
|
-
};
|
|
21
|
-
indeterminate: {
|
|
22
|
-
true: string;
|
|
23
|
-
false: string;
|
|
24
|
-
};
|
|
25
|
-
}> & ClassProps) | undefined): string;
|
|
26
|
-
variantKeys: ("size" | "color" | "checked" | "indeterminate")[];
|
|
27
|
-
};
|
|
28
6
|
|
|
29
|
-
type CheckboxProps = VariantProps<typeof checkboxVariants> & ClassProps & Omit<ComponentProps<"input">, "onChange" | "onFocus" | "onBlur"> & {
|
|
30
|
-
indeterminate?: boolean;
|
|
31
|
-
label?: JSX.Element;
|
|
32
|
-
onChange?: JSX.EventHandlerUnion<HTMLInputElement, Event>;
|
|
33
|
-
onFocus?: JSX.EventHandlerUnion<HTMLInputElement, FocusEvent>;
|
|
34
|
-
onBlur?: JSX.EventHandlerUnion<HTMLInputElement, FocusEvent>;
|
|
35
|
-
"aria-label"?: string;
|
|
36
|
-
"aria-describedby"?: string;
|
|
37
|
-
};
|
|
38
|
-
declare const Checkbox: Component<CheckboxProps>;
|
|
39
7
|
|
|
40
|
-
export {
|
|
8
|
+
export { Checkbox as default };
|
|
@@ -1,137 +1 @@
|
|
|
1
|
-
|
|
2
|
-
import { template, spread, mergeProps, insert, createComponent, effect, className, setAttribute, use } from 'solid-js/web';
|
|
3
|
-
import { splitProps, createMemo, createEffect, Show, untrack } from 'solid-js';
|
|
4
|
-
|
|
5
|
-
// src/components/checkbox/Checkbox.styles.ts
|
|
6
|
-
var checkboxVariants = cva(
|
|
7
|
-
[
|
|
8
|
-
"relative inline-flex items-center gap-2 cursor-pointer",
|
|
9
|
-
"select-none",
|
|
10
|
-
"disabled:cursor-not-allowed disabled:opacity-50"
|
|
11
|
-
],
|
|
12
|
-
{
|
|
13
|
-
variants: {
|
|
14
|
-
size: {
|
|
15
|
-
sm: "text-sm",
|
|
16
|
-
md: "text-base",
|
|
17
|
-
lg: "text-lg"
|
|
18
|
-
},
|
|
19
|
-
color: {
|
|
20
|
-
primary: "text-primary",
|
|
21
|
-
success: "text-green-600",
|
|
22
|
-
warning: "text-yellow-600",
|
|
23
|
-
danger: "text-red-600"
|
|
24
|
-
},
|
|
25
|
-
checked: {
|
|
26
|
-
true: "",
|
|
27
|
-
false: ""
|
|
28
|
-
},
|
|
29
|
-
indeterminate: {
|
|
30
|
-
true: "",
|
|
31
|
-
false: ""
|
|
32
|
-
}
|
|
33
|
-
},
|
|
34
|
-
defaultVariants: {
|
|
35
|
-
size: "md",
|
|
36
|
-
color: "primary",
|
|
37
|
-
checked: false,
|
|
38
|
-
indeterminate: false
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
|
-
);
|
|
42
|
-
|
|
43
|
-
// src/components/checkbox/Checkbox.tsx
|
|
44
|
-
var _tmpl$ = /* @__PURE__ */ template(`<span class="absolute top-1/2 left-1/2 w-2 h-0.5 bg-white -translate-x-1/2 -translate-y-1/2"aria-hidden=true>`);
|
|
45
|
-
var _tmpl$2 = /* @__PURE__ */ template(`<span class=ml-2>`);
|
|
46
|
-
var _tmpl$3 = /* @__PURE__ */ template(`<label role=checkbox><input type=checkbox class="peer absolute opacity-0 w-4 h-4"aria-hidden=true><span>`);
|
|
47
|
-
var Checkbox = (props) => {
|
|
48
|
-
const [localProps, variantProps, otherProps] = splitProps(props, ["label", "indeterminate", "type", "onChange", "onFocus", "onBlur", "checked", "disabled", "aria-label", "aria-describedby"], ["class", ...checkboxVariants.variantKeys]);
|
|
49
|
-
let inputRef;
|
|
50
|
-
const checkboxClasses = createMemo(() => checkboxVariants(variantProps));
|
|
51
|
-
const markerClasses = createMemo(() => classes("inline-block w-4 h-4 border border-gray-400 rounded-sm peer-checked:bg-current", localProps.indeterminate ? "bg-gray-400 relative" : ""));
|
|
52
|
-
const handleChange = (e) => {
|
|
53
|
-
untrack(() => {
|
|
54
|
-
if (typeof localProps.onChange === "function") {
|
|
55
|
-
localProps.onChange(e);
|
|
56
|
-
}
|
|
57
|
-
});
|
|
58
|
-
};
|
|
59
|
-
const handleFocus = (e) => {
|
|
60
|
-
untrack(() => {
|
|
61
|
-
if (typeof localProps.onFocus === "function") {
|
|
62
|
-
localProps.onFocus(e);
|
|
63
|
-
}
|
|
64
|
-
});
|
|
65
|
-
};
|
|
66
|
-
const handleBlur = (e) => {
|
|
67
|
-
untrack(() => {
|
|
68
|
-
if (typeof localProps.onBlur === "function") {
|
|
69
|
-
localProps.onBlur(e);
|
|
70
|
-
}
|
|
71
|
-
});
|
|
72
|
-
};
|
|
73
|
-
createEffect(() => {
|
|
74
|
-
if (inputRef) {
|
|
75
|
-
untrack(() => {
|
|
76
|
-
inputRef.indeterminate = !!localProps.indeterminate;
|
|
77
|
-
});
|
|
78
|
-
}
|
|
79
|
-
});
|
|
80
|
-
return (() => {
|
|
81
|
-
var _el$ = _tmpl$3(), _el$2 = _el$.firstChild, _el$3 = _el$2.nextSibling;
|
|
82
|
-
var _ref$ = inputRef;
|
|
83
|
-
typeof _ref$ === "function" ? use(_ref$, _el$2) : inputRef = _el$2;
|
|
84
|
-
spread(_el$2, mergeProps({
|
|
85
|
-
get checked() {
|
|
86
|
-
return localProps.checked;
|
|
87
|
-
},
|
|
88
|
-
get disabled() {
|
|
89
|
-
return localProps.disabled;
|
|
90
|
-
}
|
|
91
|
-
}, otherProps, {
|
|
92
|
-
"onChange": handleChange,
|
|
93
|
-
"onFocus": handleFocus,
|
|
94
|
-
"onBlur": handleBlur
|
|
95
|
-
}), false, false);
|
|
96
|
-
insert(_el$3, createComponent(Show, {
|
|
97
|
-
get when() {
|
|
98
|
-
return localProps.indeterminate;
|
|
99
|
-
},
|
|
100
|
-
get children() {
|
|
101
|
-
return _tmpl$();
|
|
102
|
-
}
|
|
103
|
-
}));
|
|
104
|
-
insert(_el$, createComponent(Show, {
|
|
105
|
-
get when() {
|
|
106
|
-
return localProps.label;
|
|
107
|
-
},
|
|
108
|
-
get children() {
|
|
109
|
-
var _el$5 = _tmpl$2();
|
|
110
|
-
insert(_el$5, () => localProps.label);
|
|
111
|
-
return _el$5;
|
|
112
|
-
}
|
|
113
|
-
}), null);
|
|
114
|
-
effect((_p$) => {
|
|
115
|
-
var _v$ = checkboxClasses(), _v$2 = localProps.indeterminate ? "mixed" : localProps.checked, _v$3 = localProps["aria-label"], _v$4 = localProps["aria-describedby"], _v$5 = markerClasses();
|
|
116
|
-
_v$ !== _p$.e && className(_el$, _p$.e = _v$);
|
|
117
|
-
_v$2 !== _p$.t && setAttribute(_el$, "aria-checked", _p$.t = _v$2);
|
|
118
|
-
_v$3 !== _p$.a && setAttribute(_el$, "aria-label", _p$.a = _v$3);
|
|
119
|
-
_v$4 !== _p$.o && setAttribute(_el$, "aria-describedby", _p$.o = _v$4);
|
|
120
|
-
_v$5 !== _p$.i && className(_el$3, _p$.i = _v$5);
|
|
121
|
-
return _p$;
|
|
122
|
-
}, {
|
|
123
|
-
e: void 0,
|
|
124
|
-
t: void 0,
|
|
125
|
-
a: void 0,
|
|
126
|
-
o: void 0,
|
|
127
|
-
i: void 0
|
|
128
|
-
});
|
|
129
|
-
return _el$;
|
|
130
|
-
})();
|
|
131
|
-
};
|
|
132
|
-
var Checkbox_default = Checkbox;
|
|
133
|
-
|
|
134
|
-
// src/components/checkbox/index.ts
|
|
135
|
-
var checkbox_default = Checkbox_default;
|
|
136
|
-
|
|
137
|
-
export { checkbox_default as default };
|
|
1
|
+
export { checkbox_default as default } from '../../chunk/FPUQ25SO.js';
|
|
@@ -1,147 +1,7 @@
|
|
|
1
1
|
import {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
// src/components/checkbox/Checkbox.tsx
|
|
7
|
-
import {
|
|
8
|
-
splitProps,
|
|
9
|
-
Show,
|
|
10
|
-
createEffect,
|
|
11
|
-
createMemo,
|
|
12
|
-
untrack
|
|
13
|
-
} from "solid-js";
|
|
14
|
-
|
|
15
|
-
// src/components/checkbox/Checkbox.styles.ts
|
|
16
|
-
var checkboxVariants = cva(
|
|
17
|
-
[
|
|
18
|
-
"relative inline-flex items-center gap-2 cursor-pointer",
|
|
19
|
-
"select-none",
|
|
20
|
-
"disabled:cursor-not-allowed disabled:opacity-50"
|
|
21
|
-
],
|
|
22
|
-
{
|
|
23
|
-
variants: {
|
|
24
|
-
size: {
|
|
25
|
-
sm: "text-sm",
|
|
26
|
-
md: "text-base",
|
|
27
|
-
lg: "text-lg"
|
|
28
|
-
},
|
|
29
|
-
color: {
|
|
30
|
-
primary: "text-primary",
|
|
31
|
-
success: "text-green-600",
|
|
32
|
-
warning: "text-yellow-600",
|
|
33
|
-
danger: "text-red-600"
|
|
34
|
-
},
|
|
35
|
-
checked: {
|
|
36
|
-
true: "",
|
|
37
|
-
false: ""
|
|
38
|
-
},
|
|
39
|
-
indeterminate: {
|
|
40
|
-
true: "",
|
|
41
|
-
false: ""
|
|
42
|
-
}
|
|
43
|
-
},
|
|
44
|
-
defaultVariants: {
|
|
45
|
-
size: "md",
|
|
46
|
-
color: "primary",
|
|
47
|
-
checked: false,
|
|
48
|
-
indeterminate: false
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
);
|
|
52
|
-
|
|
53
|
-
// src/components/checkbox/Checkbox.tsx
|
|
54
|
-
var Checkbox = (props) => {
|
|
55
|
-
const [localProps, variantProps, otherProps] = splitProps(
|
|
56
|
-
props,
|
|
57
|
-
[
|
|
58
|
-
"label",
|
|
59
|
-
"indeterminate",
|
|
60
|
-
"type",
|
|
61
|
-
"onChange",
|
|
62
|
-
"onFocus",
|
|
63
|
-
"onBlur",
|
|
64
|
-
"checked",
|
|
65
|
-
"disabled",
|
|
66
|
-
"aria-label",
|
|
67
|
-
"aria-describedby"
|
|
68
|
-
],
|
|
69
|
-
["class", ...checkboxVariants.variantKeys]
|
|
70
|
-
);
|
|
71
|
-
let inputRef;
|
|
72
|
-
const checkboxClasses = createMemo(() => checkboxVariants(variantProps));
|
|
73
|
-
const markerClasses = createMemo(
|
|
74
|
-
() => classes(
|
|
75
|
-
"inline-block w-4 h-4 border border-gray-400 rounded-sm peer-checked:bg-current",
|
|
76
|
-
localProps.indeterminate ? "bg-gray-400 relative" : ""
|
|
77
|
-
)
|
|
78
|
-
);
|
|
79
|
-
const handleChange = (e) => {
|
|
80
|
-
untrack(() => {
|
|
81
|
-
if (typeof localProps.onChange === "function") {
|
|
82
|
-
localProps.onChange(e);
|
|
83
|
-
}
|
|
84
|
-
});
|
|
85
|
-
};
|
|
86
|
-
const handleFocus = (e) => {
|
|
87
|
-
untrack(() => {
|
|
88
|
-
if (typeof localProps.onFocus === "function") {
|
|
89
|
-
localProps.onFocus(e);
|
|
90
|
-
}
|
|
91
|
-
});
|
|
92
|
-
};
|
|
93
|
-
const handleBlur = (e) => {
|
|
94
|
-
untrack(() => {
|
|
95
|
-
if (typeof localProps.onBlur === "function") {
|
|
96
|
-
localProps.onBlur(e);
|
|
97
|
-
}
|
|
98
|
-
});
|
|
99
|
-
};
|
|
100
|
-
createEffect(() => {
|
|
101
|
-
if (inputRef) {
|
|
102
|
-
untrack(() => {
|
|
103
|
-
inputRef.indeterminate = !!localProps.indeterminate;
|
|
104
|
-
});
|
|
105
|
-
}
|
|
106
|
-
});
|
|
107
|
-
return <label
|
|
108
|
-
class={checkboxClasses()}
|
|
109
|
-
role="checkbox"
|
|
110
|
-
aria-checked={localProps.indeterminate ? "mixed" : localProps.checked}
|
|
111
|
-
aria-label={localProps["aria-label"]}
|
|
112
|
-
aria-describedby={localProps["aria-describedby"]}
|
|
113
|
-
>
|
|
114
|
-
<input
|
|
115
|
-
ref={inputRef}
|
|
116
|
-
type="checkbox"
|
|
117
|
-
class="peer absolute opacity-0 w-4 h-4"
|
|
118
|
-
checked={localProps.checked}
|
|
119
|
-
disabled={localProps.disabled}
|
|
120
|
-
aria-hidden="true"
|
|
121
|
-
{...otherProps}
|
|
122
|
-
onChange={handleChange}
|
|
123
|
-
onFocus={handleFocus}
|
|
124
|
-
onBlur={handleBlur}
|
|
125
|
-
/>
|
|
126
|
-
|
|
127
|
-
<span class={markerClasses()}>
|
|
128
|
-
<Show when={localProps.indeterminate}>
|
|
129
|
-
<span
|
|
130
|
-
class="absolute top-1/2 left-1/2 w-2 h-0.5 bg-white -translate-x-1/2 -translate-y-1/2"
|
|
131
|
-
aria-hidden="true"
|
|
132
|
-
/>
|
|
133
|
-
</Show>
|
|
134
|
-
</span>
|
|
135
|
-
|
|
136
|
-
<Show when={localProps.label}>
|
|
137
|
-
<span class="ml-2">{localProps.label}</span>
|
|
138
|
-
</Show>
|
|
139
|
-
</label>;
|
|
140
|
-
};
|
|
141
|
-
var Checkbox_default = Checkbox;
|
|
142
|
-
|
|
143
|
-
// src/components/checkbox/index.ts
|
|
144
|
-
var checkbox_default = Checkbox_default;
|
|
2
|
+
checkbox_default
|
|
3
|
+
} from "../../chunk/MXG3MBEN.jsx";
|
|
4
|
+
import "../../chunk/P7WPLZNA.jsx";
|
|
145
5
|
export {
|
|
146
6
|
checkbox_default as default
|
|
147
7
|
};
|
|
@@ -1,43 +1,8 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { P as Pagination } from '../../Pagination-BlrjElGg.js';
|
|
2
|
+
export { a as PaginationProps } from '../../Pagination-BlrjElGg.js';
|
|
3
|
+
import 'solid-js';
|
|
4
|
+
import '../../classes-B_S9K-9I.js';
|
|
3
5
|
|
|
4
|
-
declare const paginationItemVariants: {
|
|
5
|
-
(props?: (ConfigVariants<{
|
|
6
|
-
active: {
|
|
7
|
-
true: string;
|
|
8
|
-
false: string;
|
|
9
|
-
};
|
|
10
|
-
rounded: {
|
|
11
|
-
true: string;
|
|
12
|
-
false: string;
|
|
13
|
-
};
|
|
14
|
-
simple: {
|
|
15
|
-
true: string;
|
|
16
|
-
false: string;
|
|
17
|
-
};
|
|
18
|
-
size: {
|
|
19
|
-
sm: string;
|
|
20
|
-
md: string;
|
|
21
|
-
lg: string;
|
|
22
|
-
};
|
|
23
|
-
disabled: {
|
|
24
|
-
true: string;
|
|
25
|
-
false: string;
|
|
26
|
-
};
|
|
27
|
-
}> & ClassProps) | undefined): string;
|
|
28
|
-
variantKeys: ("active" | "rounded" | "simple" | "size" | "disabled")[];
|
|
29
|
-
};
|
|
30
6
|
|
|
31
|
-
type PaginationProps = {
|
|
32
|
-
total: number;
|
|
33
|
-
perPage?: number;
|
|
34
|
-
current: number;
|
|
35
|
-
onChange: (page: number) => void;
|
|
36
|
-
rangeBefore?: number;
|
|
37
|
-
rangeAfter?: number;
|
|
38
|
-
simple?: boolean;
|
|
39
|
-
children?: JSX.Element;
|
|
40
|
-
} & VariantProps<typeof paginationItemVariants> & JSX.HTMLAttributes<HTMLElement>;
|
|
41
|
-
declare const Pagination: Component<PaginationProps>;
|
|
42
7
|
|
|
43
|
-
export {
|
|
8
|
+
export { Pagination as default };
|
|
@@ -1,189 +1 @@
|
|
|
1
|
-
|
|
2
|
-
import { delegateEvents, template, spread, mergeProps, insert, createComponent, memo, effect, className } from 'solid-js/web';
|
|
3
|
-
import { splitProps, createMemo, Show, For } from 'solid-js';
|
|
4
|
-
|
|
5
|
-
// src/components/pagination/Pagination.styles.ts
|
|
6
|
-
var paginationItemVariants = cva(
|
|
7
|
-
[
|
|
8
|
-
"inline-flex items-center justify-center font-medium transition-colors",
|
|
9
|
-
"select-none border border-transparent",
|
|
10
|
-
// border shown only when needed
|
|
11
|
-
"disabled:opacity-50 disabled:pointer-events-none"
|
|
12
|
-
],
|
|
13
|
-
{
|
|
14
|
-
variants: {
|
|
15
|
-
active: {
|
|
16
|
-
true: "bg-blue-500 text-white hover:bg-blue-600",
|
|
17
|
-
false: "bg-transparent text-gray-700 hover:bg-gray-200 dark:text-gray-200 dark:hover:bg-gray-700"
|
|
18
|
-
},
|
|
19
|
-
rounded: {
|
|
20
|
-
true: "rounded-full",
|
|
21
|
-
false: "rounded"
|
|
22
|
-
},
|
|
23
|
-
simple: {
|
|
24
|
-
true: "border-none bg-transparent hover:bg-transparent text-gray-700 dark:text-gray-300",
|
|
25
|
-
false: ""
|
|
26
|
-
},
|
|
27
|
-
size: {
|
|
28
|
-
sm: "text-xs px-2 py-1",
|
|
29
|
-
md: "text-sm px-3 py-1.5",
|
|
30
|
-
lg: "text-base px-4 py-2"
|
|
31
|
-
},
|
|
32
|
-
disabled: {
|
|
33
|
-
true: "opacity-50 pointer-events-none",
|
|
34
|
-
false: ""
|
|
35
|
-
}
|
|
36
|
-
},
|
|
37
|
-
defaultVariants: {
|
|
38
|
-
active: false,
|
|
39
|
-
rounded: false,
|
|
40
|
-
simple: false,
|
|
41
|
-
size: "md",
|
|
42
|
-
disabled: false
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
);
|
|
46
|
-
var paginationInfoVariants = cva(
|
|
47
|
-
"inline-block font-medium transition-colors",
|
|
48
|
-
{
|
|
49
|
-
variants: {
|
|
50
|
-
simple: {
|
|
51
|
-
true: "text-sm text-gray-600 dark:text-gray-300 px-2",
|
|
52
|
-
false: "text-sm text-gray-700 dark:text-gray-200 px-2"
|
|
53
|
-
}
|
|
54
|
-
},
|
|
55
|
-
defaultVariants: {
|
|
56
|
-
simple: false
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
);
|
|
60
|
-
var paginationContainerVariants = cva(
|
|
61
|
-
"flex items-center gap-1 flex-wrap",
|
|
62
|
-
{
|
|
63
|
-
variants: {
|
|
64
|
-
align: {
|
|
65
|
-
start: "justify-start",
|
|
66
|
-
center: "justify-center",
|
|
67
|
-
end: "justify-end"
|
|
68
|
-
},
|
|
69
|
-
wrap: {
|
|
70
|
-
true: "flex-wrap",
|
|
71
|
-
false: "flex-nowrap"
|
|
72
|
-
}
|
|
73
|
-
},
|
|
74
|
-
defaultVariants: {
|
|
75
|
-
align: "start",
|
|
76
|
-
wrap: true
|
|
77
|
-
}
|
|
78
|
-
}
|
|
79
|
-
);
|
|
80
|
-
|
|
81
|
-
// src/components/pagination/Pagination.tsx
|
|
82
|
-
var _tmpl$ = /* @__PURE__ */ template(`<span>`);
|
|
83
|
-
var _tmpl$2 = /* @__PURE__ */ template(`<nav><button>«</button><button>»`);
|
|
84
|
-
var _tmpl$3 = /* @__PURE__ */ template(`<button>`);
|
|
85
|
-
var Pagination = (props) => {
|
|
86
|
-
const [local, variantProps, otherProps] = splitProps(props, ["total", "perPage", "current", "onChange", "rangeBefore", "rangeAfter", "simple", "children"], ["rounded", "size", "disabled", "active", "simple"]);
|
|
87
|
-
const perPage = () => local.perPage ?? 20;
|
|
88
|
-
const pageCount = createMemo(() => Math.ceil(local.total / perPage()));
|
|
89
|
-
const hasPrev = createMemo(() => local.current > 1);
|
|
90
|
-
const hasNext = createMemo(() => local.current < pageCount());
|
|
91
|
-
const pagesInRange = createMemo(() => {
|
|
92
|
-
const before = local.rangeBefore ?? 1;
|
|
93
|
-
const after = local.rangeAfter ?? 1;
|
|
94
|
-
const start = Math.max(1, local.current - before);
|
|
95
|
-
const end = Math.min(local.current + after, pageCount());
|
|
96
|
-
return Array.from({
|
|
97
|
-
length: end - start + 1
|
|
98
|
-
}, (_, i) => start + i);
|
|
99
|
-
});
|
|
100
|
-
const changePage = (page) => {
|
|
101
|
-
if (page >= 1 && page <= pageCount() && page !== local.current) {
|
|
102
|
-
local.onChange(page);
|
|
103
|
-
}
|
|
104
|
-
};
|
|
105
|
-
return (() => {
|
|
106
|
-
var _el$ = _tmpl$2(), _el$2 = _el$.firstChild, _el$4 = _el$2.nextSibling;
|
|
107
|
-
spread(_el$, mergeProps({
|
|
108
|
-
get ["class"]() {
|
|
109
|
-
return paginationContainerVariants({
|
|
110
|
-
align: "start",
|
|
111
|
-
wrap: true
|
|
112
|
-
});
|
|
113
|
-
}
|
|
114
|
-
}, otherProps), false, true);
|
|
115
|
-
_el$2.$$click = () => changePage(local.current - 1);
|
|
116
|
-
insert(_el$, createComponent(Show, {
|
|
117
|
-
get when() {
|
|
118
|
-
return pageCount() > 1;
|
|
119
|
-
},
|
|
120
|
-
get children() {
|
|
121
|
-
return [createComponent(Show, {
|
|
122
|
-
get when() {
|
|
123
|
-
return local.simple;
|
|
124
|
-
},
|
|
125
|
-
get children() {
|
|
126
|
-
var _el$3 = _tmpl$();
|
|
127
|
-
insert(_el$3, (() => {
|
|
128
|
-
var _c$ = memo(() => perPage() === 1);
|
|
129
|
-
return () => _c$() ? `${(local.current - 1) * perPage() + 1} / ${local.total}` : `${(local.current - 1) * perPage() + 1}-${Math.min(local.current * perPage(), local.total)} / ${local.total}`;
|
|
130
|
-
})());
|
|
131
|
-
effect(() => className(_el$3, paginationInfoVariants({
|
|
132
|
-
simple: true
|
|
133
|
-
})));
|
|
134
|
-
return _el$3;
|
|
135
|
-
}
|
|
136
|
-
}), createComponent(Show, {
|
|
137
|
-
get when() {
|
|
138
|
-
return !local.simple;
|
|
139
|
-
},
|
|
140
|
-
get children() {
|
|
141
|
-
return createComponent(For, {
|
|
142
|
-
get each() {
|
|
143
|
-
return pagesInRange();
|
|
144
|
-
},
|
|
145
|
-
children: (page) => (() => {
|
|
146
|
-
var _el$5 = _tmpl$3();
|
|
147
|
-
_el$5.$$click = () => changePage(page);
|
|
148
|
-
insert(_el$5, page);
|
|
149
|
-
effect(() => className(_el$5, paginationItemVariants({
|
|
150
|
-
...variantProps,
|
|
151
|
-
active: page === local.current
|
|
152
|
-
})));
|
|
153
|
-
return _el$5;
|
|
154
|
-
})()
|
|
155
|
-
});
|
|
156
|
-
}
|
|
157
|
-
})];
|
|
158
|
-
}
|
|
159
|
-
}), _el$4);
|
|
160
|
-
_el$4.$$click = () => changePage(local.current + 1);
|
|
161
|
-
effect((_p$) => {
|
|
162
|
-
var _v$ = paginationItemVariants({
|
|
163
|
-
...variantProps,
|
|
164
|
-
disabled: !hasPrev()
|
|
165
|
-
}), _v$2 = !hasPrev(), _v$3 = paginationItemVariants({
|
|
166
|
-
...variantProps,
|
|
167
|
-
disabled: !hasNext()
|
|
168
|
-
}), _v$4 = !hasNext();
|
|
169
|
-
_v$ !== _p$.e && className(_el$2, _p$.e = _v$);
|
|
170
|
-
_v$2 !== _p$.t && (_el$2.disabled = _p$.t = _v$2);
|
|
171
|
-
_v$3 !== _p$.a && className(_el$4, _p$.a = _v$3);
|
|
172
|
-
_v$4 !== _p$.o && (_el$4.disabled = _p$.o = _v$4);
|
|
173
|
-
return _p$;
|
|
174
|
-
}, {
|
|
175
|
-
e: void 0,
|
|
176
|
-
t: void 0,
|
|
177
|
-
a: void 0,
|
|
178
|
-
o: void 0
|
|
179
|
-
});
|
|
180
|
-
return _el$;
|
|
181
|
-
})();
|
|
182
|
-
};
|
|
183
|
-
var Pagination_default = Pagination;
|
|
184
|
-
delegateEvents(["click"]);
|
|
185
|
-
|
|
186
|
-
// src/components/pagination/index.ts
|
|
187
|
-
var pagination_default = Pagination_default;
|
|
188
|
-
|
|
189
|
-
export { pagination_default as default };
|
|
1
|
+
export { pagination_default as default } from '../../chunk/DBQ7IOPU.js';
|