@g4rcez/components 0.0.23 → 0.0.25
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/README.md +7 -7
- package/dist/components/core/resizable.js +1 -1
- package/dist/components/core/tag.d.ts.map +1 -1
- package/dist/components/display/alert.d.ts +20 -0
- package/dist/components/display/alert.d.ts.map +1 -0
- package/dist/components/display/alert.js +33 -0
- package/dist/components/display/tabs.d.ts +6 -1
- package/dist/components/display/tabs.d.ts.map +1 -1
- package/dist/components/display/tabs.js +9 -4
- package/dist/components/floating/modal.d.ts.map +1 -1
- package/dist/components/floating/modal.js +2 -2
- package/dist/components/form/autocomplete.d.ts +1 -0
- package/dist/components/form/autocomplete.d.ts.map +1 -1
- package/dist/components/form/autocomplete.js +37 -21
- package/dist/components/form/checkbox.d.ts.map +1 -1
- package/dist/components/form/checkbox.js +1 -1
- package/dist/components/form/input-field.d.ts +4 -2
- package/dist/components/form/input-field.d.ts.map +1 -1
- package/dist/components/form/input-field.js +2 -2
- package/dist/components/form/input.d.ts.map +1 -1
- package/dist/components/form/radiobox.d.ts.map +1 -1
- package/dist/components/form/select.d.ts.map +1 -1
- package/dist/components/form/select.js +1 -1
- package/dist/components/form/switch.js +1 -1
- package/dist/components/index.d.ts +15 -14
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +15 -14
- package/dist/components/table/pagination.d.ts.map +1 -1
- package/dist/components/table/pagination.js +6 -10
- package/dist/components/table/table-lib.d.ts.map +1 -1
- package/dist/hooks/use-form.js +1 -1
- package/dist/index.css +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +20915 -20764
- package/dist/index.mjs.map +1 -1
- package/dist/index.umd.js +63 -58
- package/dist/index.umd.js.map +1 -1
- package/dist/lib/dom.d.ts +1 -1
- package/dist/lib/dom.d.ts.map +1 -1
- package/dist/lib/dom.js +12 -4
- package/dist/lib/fns.js +1 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +184 -184
package/README.md
CHANGED
|
@@ -27,10 +27,10 @@ The difference between then is:
|
|
|
27
27
|
|
|
28
28
|
# Tasks
|
|
29
29
|
|
|
30
|
-
-
|
|
31
|
-
-
|
|
32
|
-
-
|
|
33
|
-
-
|
|
34
|
-
-
|
|
35
|
-
-
|
|
36
|
-
-
|
|
30
|
+
- [x] TailwindCSS Plugin
|
|
31
|
+
- [x] Hook to work with forms
|
|
32
|
+
- [ ] Alerts
|
|
33
|
+
- [x] Notion Table
|
|
34
|
+
- [x] Dropdown
|
|
35
|
+
- [ ] Dark mode toggler
|
|
36
|
+
- [ ] Write docs
|
|
@@ -4,5 +4,5 @@ import { motion } from "framer-motion";
|
|
|
4
4
|
import useMeasure from "react-use-measure";
|
|
5
5
|
export const Resizable = ({ children }) => {
|
|
6
6
|
const [ref, bounds] = useMeasure();
|
|
7
|
-
return (_jsx(motion.div, { animate: { height: bounds.height > 0 ? bounds.height :
|
|
7
|
+
return (_jsx(motion.div, { animate: { height: bounds.height > 0 ? bounds.height : "auto" }, children: _jsx("div", { ref: ref, children: children }) }));
|
|
8
8
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../src/components/core/tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,WAAW;;;mFAwBhB,CAAC;AAEF,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,IAAI,gBAAgB,CACzE,YAAY,CAAC,OAAO,WAAW,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC,EAC7E,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,GAAG,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,
|
|
1
|
+
{"version":3,"file":"tag.d.ts","sourceRoot":"","sources":["../../../src/components/core/tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAa,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE1D,QAAA,MAAM,WAAW;;;mFAwBhB,CAAC;AAEF,MAAM,MAAM,QAAQ,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,IAAI,gBAAgB,CACzE,YAAY,CAAC,OAAO,WAAW,CAAC,GAAG,OAAO,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,OAAO,EAAE,OAAO,CAAA;CAAE,CAAC,EAC7E,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,GAAG,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,GAUrE,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { type VariantProps } from "class-variance-authority";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { PolymorphicProps } from "../core/polymorph";
|
|
4
|
+
import { HTMLMotionProps } from "framer-motion";
|
|
5
|
+
import { PropsWithChildren } from "react";
|
|
6
|
+
type CollapseProps = {
|
|
7
|
+
open: boolean;
|
|
8
|
+
} & HTMLMotionProps<"section">;
|
|
9
|
+
export declare const Collapse: (props: PropsWithChildren<CollapseProps>) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
declare const alertVariants: (props?: ({
|
|
11
|
+
theme?: "danger" | "success" | "neutral" | null | undefined;
|
|
12
|
+
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
13
|
+
export type AlertProps<T extends React.ElementType = "div"> = PolymorphicProps<VariantProps<typeof alertVariants> & Partial<{
|
|
14
|
+
container: string;
|
|
15
|
+
open?: boolean;
|
|
16
|
+
onClose: (nextState: boolean) => void;
|
|
17
|
+
}>, T>;
|
|
18
|
+
export declare const Alert: <T extends React.ElementType = "div">(props: AlertProps<T>) => any;
|
|
19
|
+
export {};
|
|
20
|
+
//# sourceMappingURL=alert.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["../../../src/components/display/alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAElE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAa,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAChE,OAAO,EAAE,eAAe,EAAU,MAAM,eAAe,CAAC;AACxD,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAc1C,KAAK,aAAa,GAAG;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,GAAG,eAAe,CAAC,SAAS,CAAC,CAAC;AAEpE,eAAO,MAAM,QAAQ,UAAW,iBAAiB,CAAC,aAAa,CAAC,4CAgB/D,CAAC;AAEF,QAAA,MAAM,aAAa;;mFASjB,CAAC;AAEH,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI,gBAAgB,CAC1E,YAAY,CAAC,OAAO,aAAa,CAAC,GAC9B,OAAO,CAAC;IACJ,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CACzC,CAAC,EACN,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,GAsCxE,CAAC"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { __rest } from "tslib";
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { cva } from "class-variance-authority";
|
|
4
|
+
import { CheckCircleIcon, CircleAlertIcon, XIcon } from "lucide-react";
|
|
5
|
+
import { forwardRef } from "react";
|
|
6
|
+
import { Polymorph } from "../core/polymorph";
|
|
7
|
+
import { motion } from "framer-motion";
|
|
8
|
+
import { css } from "../../lib/dom";
|
|
9
|
+
const variants = {
|
|
10
|
+
true: { opacity: 1, height: "auto" },
|
|
11
|
+
false: { opacity: [0.7, 0.3, 0], height: 0 },
|
|
12
|
+
};
|
|
13
|
+
const transition = {
|
|
14
|
+
type: "tween",
|
|
15
|
+
duration: 0.7,
|
|
16
|
+
ease: [0.04, 0.62, 0.23, 0.98],
|
|
17
|
+
};
|
|
18
|
+
export const Collapse = (props) => (_jsx(motion.section, Object.assign({}, props, { layout: true, layoutRoot: true, layoutScroll: true, initial: props.open, animate: props.open.toString(), "aria-hidden": !props.open, className: props.className, exit: variants.false, transition: transition, variants: variants, children: props.children })));
|
|
19
|
+
const alertVariants = cva("px-4 py-4 border relative rounded-lg text-sm", {
|
|
20
|
+
variants: {
|
|
21
|
+
theme: {
|
|
22
|
+
neutral: "border-border bg-background",
|
|
23
|
+
danger: "text-danger-contrast bg-danger/10 border-danger/50",
|
|
24
|
+
success: "text-success-contrast bg-success/10 border-success/50",
|
|
25
|
+
},
|
|
26
|
+
},
|
|
27
|
+
defaultVariants: { theme: "neutral" },
|
|
28
|
+
});
|
|
29
|
+
export const Alert = forwardRef(function Alert(_a, ref) {
|
|
30
|
+
var _b;
|
|
31
|
+
var { className, theme, onClose, open } = _a, props = __rest(_a, ["className", "theme", "onClose", "open"]);
|
|
32
|
+
return (_jsx("div", { "data-open": !!open, "aria-hidden": !open, className: "data-[open=true]:mb-4 isolate data-[open=true]:pointer-events-auto pointer-events-none", children: _jsx(Collapse, { "data-open": !!open, open: !!open, children: _jsxs(Polymorph, Object.assign({}, props, { className: css(alertVariants({ theme }), className), ref: ref, "data-theme": theme, role: "alert", as: (_b = props.as) !== null && _b !== void 0 ? _b : "div", children: [_jsxs("h4", { className: "mb-2 flex items-center gap-2", children: [theme === "success" ? _jsx(CheckCircleIcon, { size: 20 }) : null, theme === "danger" ? _jsx(CircleAlertIcon, { size: 20 }) : null, _jsx("span", { className: "tracking-3 text-balance text-lg font-semibold", children: props.title })] }), props.children, open !== undefined ? (_jsx("button", { type: "button", onClick: () => onClose === null || onClose === void 0 ? void 0 : onClose(false), className: "text-foreground hover:text-danger absolute right-3 top-3 transition-colors duration-300 ease-in-out", children: _jsx(XIcon, { size: 20 }) })) : null] })) }) }));
|
|
33
|
+
});
|
|
@@ -9,7 +9,12 @@ export type TabsProps = {
|
|
|
9
9
|
export declare const Tabs: (props: PropsWithChildren<TabsProps>) => import("react/jsx-runtime").JSX.Element;
|
|
10
10
|
export type TabProps = {
|
|
11
11
|
id: string;
|
|
12
|
-
title:
|
|
12
|
+
title: string;
|
|
13
|
+
label?: undefined;
|
|
14
|
+
} | {
|
|
15
|
+
id: string;
|
|
16
|
+
title: Omit<Label, string>;
|
|
17
|
+
label: string;
|
|
13
18
|
};
|
|
14
19
|
export declare const Tab: (props: PropsWithChildren<TabProps>) => import("react/jsx-runtime").JSX.Element;
|
|
15
20
|
//# sourceMappingURL=tabs.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../src/components/display/tabs.tsx"],"names":[],"mappings":"AAEA,OAAc,EAA2B,iBAAiB,EAAiC,MAAM,OAAO,CAAC;AAEzG,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../src/components/display/tabs.tsx"],"names":[],"mappings":"AAEA,OAAc,EAA2B,iBAAiB,EAAiC,MAAM,OAAO,CAAC;AAEzG,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAIpC,MAAM,MAAM,SAAS,GAAG;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAIF,eAAO,MAAM,IAAI,UAAW,iBAAiB,CAAC,SAAS,CAAC,4CA8GvD,CAAC;AAIF,MAAM,MAAM,QAAQ,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAE,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAEpI,eAAO,MAAM,GAAG,UAAW,iBAAiB,CAAC,QAAQ,CAAC,4CAGrD,CAAC"}
|
|
@@ -4,6 +4,7 @@ import { motion, useMotionValue } from "framer-motion";
|
|
|
4
4
|
import React, { createContext, Fragment, useContext, useEffect, useRef } from "react";
|
|
5
5
|
import { useReactive } from "../../hooks/use-reactive";
|
|
6
6
|
import { Card } from "./card";
|
|
7
|
+
import { Autocomplete } from "../form/autocomplete";
|
|
7
8
|
const Context = createContext("");
|
|
8
9
|
export const Tabs = (props) => {
|
|
9
10
|
const [active, setActive] = useReactive(props.active);
|
|
@@ -53,10 +54,14 @@ export const Tabs = (props) => {
|
|
|
53
54
|
left.set(anchor.offsetLeft);
|
|
54
55
|
setActive(anchor.dataset.id || "");
|
|
55
56
|
};
|
|
56
|
-
return (_jsx(Context.Provider, { value: active, children: _jsx(Card, { className: props.className, container: "pt-0", header: _jsxs("header", { ref: ref, className: "border-b border-card-border relative mb-2", children: [_jsx(motion.div, { layout: true, initial: false, "aria-hidden": "true", style: { left, width }, transition: { type: "tween", left, width }, className: "w-28 h-0.5 bg-primary absolute bottom-0 duration-300 transition-all hidden
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
57
|
+
return (_jsx(Context.Provider, { value: active, children: _jsx(Card, { className: props.className, container: "pt-0", header: _jsxs("header", { ref: ref, className: "border-b border-card-border relative mb-2", children: [_jsx(motion.div, { layout: true, initial: false, "aria-hidden": "true", style: { left, width }, transition: { type: "tween", left, width }, className: "w-28 h-0.5 bg-primary absolute bottom-0 duration-300 transition-all hidden lg:block" }), _jsxs("nav", { children: [_jsx(Autocomplete, { onChange: (e) => setActive(e.target.value), value: active, container: "container inline-flex px-6 w-full mx-auto", selectContainer: "mt-4 lg:mt-0 min-w-full inline-flex min-w-full lg:hidden", hideLeft: true, labelClassName: "border-transparent rounded-none", rightLabel: null, options: items.map((x) => {
|
|
58
|
+
var _a;
|
|
59
|
+
const inner = x.props;
|
|
60
|
+
return { value: inner.id, label: (_a = inner.label) !== null && _a !== void 0 ? _a : inner.title };
|
|
61
|
+
}) }), _jsx("ul", { className: "hidden lg:flex divide-x divide-card-border overflow-x-auto justify-between md:justify-start", children: items.map((x) => {
|
|
62
|
+
const inner = x.props;
|
|
63
|
+
return (_jsx("li", { "data-id": inner.id, "data-active": active === inner.id, className: "data-[active=true]:text-primary w-full md:w-auto", children: _jsx(Render, { "data-id": inner.id, onClick: onClick, "aria-current": "page", className: "px-10 py-4 block font-medium w-full whitespace-nowrap", href: props.useHash ? `#${inner.id}` : undefined, children: inner.title }) }, `tab-header-${inner.id}`));
|
|
64
|
+
}) })] })] }), children: props.children }) }));
|
|
60
65
|
};
|
|
61
66
|
const useTabs = () => useContext(Context);
|
|
62
67
|
export const Tab = (props) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/floating/modal.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAAS,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AA+CpC,MAAM,MAAM,WAAW,GAAG;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IAChC,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,CAAC;AAiCF,eAAO,MAAM,KAAK,gCAAmD,iBAAiB,CAAC,WAAW,CAAC,
|
|
1
|
+
{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/components/floating/modal.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAAS,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AA+CpC,MAAM,MAAM,WAAW,GAAG;IACtB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IAChC,QAAQ,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,CAAC;AAiCF,eAAO,MAAM,KAAK,gCAAmD,iBAAiB,CAAC,WAAW,CAAC,4CAgFlG,CAAC"}
|
|
@@ -7,7 +7,7 @@ import { cva } from "class-variance-authority";
|
|
|
7
7
|
import { AnimatePresence, motion, useMotionValue } from "framer-motion";
|
|
8
8
|
import { XIcon } from "lucide-react";
|
|
9
9
|
import { Fragment, useId } from "react";
|
|
10
|
-
const animationDuration =
|
|
10
|
+
const animationDuration = "600ms";
|
|
11
11
|
const createDrawerAnimation = (side) => ({
|
|
12
12
|
initial: { [side]: "-60%", opacity: 0.8, animationDuration },
|
|
13
13
|
enter: { [side]: 0, opacity: 1, animationDuration },
|
|
@@ -63,5 +63,5 @@ export const Modal = (_a) => {
|
|
|
63
63
|
const { getReferenceProps, getFloatingProps } = useInteractions([click, role, dismiss]);
|
|
64
64
|
const Trigger = props.trigger;
|
|
65
65
|
const value = useMotionValue(undefined);
|
|
66
|
-
return (_jsxs(Fragment, { children: [props.trigger ? _jsx(Fragment, { children: props.asChild ? (_jsx(Slot, Object.assign({ ref: refs.setReference }, getReferenceProps(), { children: Trigger }))) : (_jsx("button", Object.assign({ ref: refs.setReference }, getReferenceProps(), { type: "button", children: Trigger }))) }) : null, _jsx(FloatingPortal, { children: _jsx(AnimatePresence, { presenceAffectsLayout: true, children: props.open && (_jsx(FloatingOverlay, { lockScroll: true, className: `relative !overflow-clip h-[100dvh] z-floating bg-floating-overlay/70 ${type === "drawer" ? "" : "grid justify-center p-8"}`, children: _jsx(FloatingFocusManager, { modal: true, closeOnFocusOut: true, context: context, children: _jsxs(motion.div, Object.assign({ animate: "enter", "aria-describedby": descriptionId, "aria-labelledby": headingId, className: variants({ position, type }), exit: "exit", initial: "initial", ref: refs.setFloating, variants: animation, style: { width: value } }, getFloatingProps(), { children: [!isDialog && resizer ? _jsx(Draggable, { value: value, parent: refs.floating, type: position }) : null, props.title || props.closable ? (_jsxs("header", { className: "w-full relative", children: [props.title ? (_jsx("h2", { className: "px-8 pb-4 border-b border-floating-border text-3xl font-medium leading-relaxed", children: props.title })) : null, props.closable !== false ? (_jsx("nav", { className: "absolute -top-1 right-8", children: _jsx("button", { type: "button", onClick: () => { var _a; return (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, false); }, className: "p-1 transition-colors hover:text-danger focus:text-danger", children: _jsx(XIcon, {}) }) })) : null] })) : null, _jsx("div", { className: "flex-1 px-8 overflow-y-auto", children: props.children }), props.footer ? (_jsx("footer", { className: "px-8 border-t border-floating-border pt-4 w-full", children: props.footer })) : null] })) }) })) }) })] }));
|
|
66
|
+
return (_jsxs(Fragment, { children: [props.trigger ? (_jsx(Fragment, { children: props.asChild ? (_jsx(Slot, Object.assign({ ref: refs.setReference }, getReferenceProps(), { children: Trigger }))) : (_jsx("button", Object.assign({ ref: refs.setReference }, getReferenceProps(), { type: "button", children: Trigger }))) })) : null, _jsx(FloatingPortal, { children: _jsx(AnimatePresence, { presenceAffectsLayout: true, children: props.open && (_jsx(FloatingOverlay, { lockScroll: true, className: `relative !overflow-clip h-[100dvh] z-floating bg-floating-overlay/70 ${type === "drawer" ? "" : "grid justify-center p-8"}`, children: _jsx(FloatingFocusManager, { modal: true, closeOnFocusOut: true, context: context, children: _jsxs(motion.div, Object.assign({ animate: "enter", "aria-describedby": descriptionId, "aria-labelledby": headingId, className: variants({ position, type }), exit: "exit", initial: "initial", ref: refs.setFloating, variants: animation, style: { width: value } }, getFloatingProps(), { children: [!isDialog && resizer ? _jsx(Draggable, { value: value, parent: refs.floating, type: position }) : null, props.title || props.closable ? (_jsxs("header", { className: "w-full relative", children: [props.title ? (_jsx("h2", { className: "px-8 pb-4 border-b border-floating-border text-3xl font-medium leading-relaxed", children: props.title })) : null, props.closable !== false ? (_jsx("nav", { className: "absolute -top-1 right-8", children: _jsx("button", { type: "button", onClick: () => { var _a; return (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, false); }, className: "p-1 transition-colors hover:text-danger focus:text-danger", children: _jsx(XIcon, {}) }) })) : null] })) : null, _jsx("div", { className: "flex-1 px-8 overflow-y-auto", children: props.children }), props.footer ? (_jsx("footer", { className: "px-8 border-t border-floating-border pt-4 w-full", children: props.footer })) : null] })) }) })) }) })] }));
|
|
67
67
|
};
|
|
@@ -10,6 +10,7 @@ export declare const Option: React.ForwardRefExoticComponent<Omit<ItemProps, "re
|
|
|
10
10
|
type SelectProps = Omit<InputFieldProps<"input">, "value"> & {
|
|
11
11
|
value?: string;
|
|
12
12
|
options: OptionProps[];
|
|
13
|
+
selectContainer?: string;
|
|
13
14
|
};
|
|
14
15
|
export declare const Autocomplete: React.ForwardRefExoticComponent<Omit<SelectProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
|
|
15
16
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../src/components/form/autocomplete.tsx"],"names":[],"mappings":"AAgBA,OAAO,
|
|
1
|
+
{"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../src/components/form/autocomplete.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAuE,MAAM,OAAO,CAAC;AAG5F,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAE5C,KAAK,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,EAAE,UAAU,CAAC,GAAG;IAChE,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE,WAAW,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,MAAM,8FAWjB,CAAC;AAEH,KAAK,WAAW,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,GAAG;IACzD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC;AAaF,eAAO,MAAM,YAAY,mGA+LxB,CAAC"}
|
|
@@ -5,7 +5,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
5
5
|
import { autoUpdate, FloatingFocusManager, FloatingPortal, offset, size, useDismiss, useFloating, useInteractions, useListNavigation, useRole, useTransitionStyles, } from "@floating-ui/react";
|
|
6
6
|
import Fuzzy from "fuzzy-search";
|
|
7
7
|
import { ChevronDown } from "lucide-react";
|
|
8
|
-
import { forwardRef, useImperativeHandle, useRef, useState } from "react";
|
|
8
|
+
import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
|
|
9
9
|
import { usePrevious } from "../../hooks/use-previous";
|
|
10
10
|
import { css, dispatchInput } from "../../lib/dom";
|
|
11
11
|
import { InputField } from "./input-field";
|
|
@@ -23,15 +23,25 @@ const transitionStyles = {
|
|
|
23
23
|
const fuzzyOptions = { caseSensitive: false, sort: false };
|
|
24
24
|
const emptyRef = [];
|
|
25
25
|
export const Autocomplete = forwardRef((_a, externalRef) => {
|
|
26
|
-
var _b, _c;
|
|
27
|
-
var { options, required =
|
|
26
|
+
var _b, _c, _d, _e;
|
|
27
|
+
var { options, selectContainer, labelClassName, required = false } = _a, props = __rest(_a, ["options", "selectContainer", "labelClassName", "required"]);
|
|
28
|
+
const ref = useRef(null);
|
|
28
29
|
const [open, setOpen] = useState(false);
|
|
29
30
|
const [shadow, setShadow] = useState("");
|
|
30
31
|
const [value, setValue] = useState((_c = (_b = props.value) !== null && _b !== void 0 ? _b : props.defaultValue) !== null && _c !== void 0 ? _c : "");
|
|
32
|
+
const [label, setLabel] = useState((_e = (_d = props.value) !== null && _d !== void 0 ? _d : props.defaultValue) !== null && _e !== void 0 ? _e : "");
|
|
31
33
|
const [index, setIndex] = useState(null);
|
|
32
34
|
const listRef = useRef(emptyRef);
|
|
33
35
|
const previousIndex = usePrevious(index);
|
|
34
36
|
const list = new Fuzzy(options, ["value"], fuzzyOptions).search(shadow);
|
|
37
|
+
useEffect(() => {
|
|
38
|
+
var _a;
|
|
39
|
+
if (props.value) {
|
|
40
|
+
setValue(props.value);
|
|
41
|
+
const item = options.find((x) => x.value === props.value);
|
|
42
|
+
setValue((_a = item === null || item === void 0 ? void 0 : item.label) !== null && _a !== void 0 ? _a : props.value);
|
|
43
|
+
}
|
|
44
|
+
}, [props.value]);
|
|
35
45
|
const { x, y, strategy, refs, context } = useFloating({
|
|
36
46
|
open,
|
|
37
47
|
transform: true,
|
|
@@ -78,8 +88,12 @@ export const Autocomplete = forwardRef((_a, externalRef) => {
|
|
|
78
88
|
}),
|
|
79
89
|
]);
|
|
80
90
|
const onSelect = (opt) => {
|
|
91
|
+
var _a, _b;
|
|
81
92
|
setValue(opt.value);
|
|
82
|
-
|
|
93
|
+
setLabel((_a = opt.label) !== null && _a !== void 0 ? _a : "");
|
|
94
|
+
const fakeEvent = dispatchInput(ref.current, opt.value);
|
|
95
|
+
if (fakeEvent)
|
|
96
|
+
(_b = props.onChange) === null || _b === void 0 ? void 0 : _b.call(props, fakeEvent);
|
|
83
97
|
setOpen(false);
|
|
84
98
|
setShadow("");
|
|
85
99
|
};
|
|
@@ -89,6 +103,7 @@ export const Autocomplete = forwardRef((_a, externalRef) => {
|
|
|
89
103
|
setShadow(value);
|
|
90
104
|
if (!open && value === "")
|
|
91
105
|
return setOpen(true);
|
|
106
|
+
event.target.name = props.name || "";
|
|
92
107
|
return value ? setOpen(true) : (_a = props.onChange) === null || _a === void 0 ? void 0 : _a.call(props, event);
|
|
93
108
|
};
|
|
94
109
|
const onFocus = () => {
|
|
@@ -98,32 +113,33 @@ export const Autocomplete = forwardRef((_a, externalRef) => {
|
|
|
98
113
|
const onClose = () => {
|
|
99
114
|
setShadow("");
|
|
100
115
|
setValue("");
|
|
116
|
+
setLabel("");
|
|
101
117
|
dispatchInput(refs.reference.current, "");
|
|
102
118
|
setOpen(false);
|
|
103
119
|
};
|
|
104
|
-
return (_jsxs("fieldset", { className:
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
}
|
|
110
|
-
if (event.key === "Enter") {
|
|
111
|
-
if (index !== null && list[index]) {
|
|
112
|
-
event.preventDefault();
|
|
113
|
-
return onSelect(list[index]);
|
|
120
|
+
return (_jsxs("fieldset", { className: `relative w-full inline-block ${selectContainer}`, children: [_jsxs(InputField, Object.assign({}, props, { required: required, labelClassName: labelClassName, right: _jsxs("span", { className: "flex items-center gap-0.5", children: [_jsx("button", { type: "button", className: "link:text-primary transition-colors", children: _jsx(ChevronDown, { size: 20 }) }), value ? (_jsx("button", { type: "button", onClick: onClose, className: "link:text-danger transition-colors", children: _jsx("svg", { width: "15", height: "15", viewBox: "0 0 15 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z", fill: "currentColor", fillRule: "evenodd", clipRule: "evenodd" }) }) })) : null] }), children: [_jsx("input", { ref: ref, required: required, type: "hidden", name: props.name, defaultValue: props.value || value || undefined }), _jsx("input", Object.assign({}, getReferenceProps(Object.assign(Object.assign({}, props), { onChange,
|
|
121
|
+
onFocus, ref: refs.setReference, name: undefined, onClick: (e) => e.currentTarget.focus(), onKeyDown(event) {
|
|
122
|
+
if (event.key === "Escape") {
|
|
123
|
+
event.currentTarget.blur();
|
|
124
|
+
return setOpen(false);
|
|
114
125
|
}
|
|
115
|
-
if (
|
|
116
|
-
|
|
117
|
-
|
|
126
|
+
if (event.key === "Enter") {
|
|
127
|
+
if (index !== null && list[index]) {
|
|
128
|
+
event.preventDefault();
|
|
129
|
+
return onSelect(list[index]);
|
|
130
|
+
}
|
|
131
|
+
if (list.length === 1) {
|
|
132
|
+
event.preventDefault();
|
|
133
|
+
return onSelect(list[0]);
|
|
134
|
+
}
|
|
118
135
|
}
|
|
119
|
-
}
|
|
120
|
-
} })), { required: required, value: open ? shadow : value, "aria-autocomplete": "list", autoComplete: "off", className: css("input text-foreground group h-10 w-full flex-1 rounded-md bg-transparent p-2 placeholder-input-mask outline-none transition-colors group-error:text-danger group-error:placeholder-input-mask-error", !!props.right || shadow ? "pe-12" : "", !!props.left ? "ps-8" : "", props.className) })) })), _jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(FloatingFocusManager, { closeOnFocusOut: true, guards: true, returnFocus: true, context: context, initialFocus: -1, visuallyHiddenDismiss: true, children: _jsx("ul", Object.assign({}, getFloatingProps({
|
|
136
|
+
} })), { required: required, value: open ? shadow : label || value, "aria-autocomplete": "list", autoComplete: "off", className: css("input text-foreground text-base group h-10 w-full flex-1 rounded-md bg-transparent p-2 placeholder-input-mask outline-none transition-colors group-error:text-danger group-error:placeholder-input-mask-error", !!props.right || shadow ? "pe-12" : "", !!props.left ? "ps-8" : "", props.className) }))] })), _jsx(FloatingPortal, { preserveTabOrder: true, children: open ? (_jsx(FloatingFocusManager, { guards: true, returnFocus: false, context: context, initialFocus: -1, visuallyHiddenDismiss: true, children: _jsx("ul", Object.assign({}, getFloatingProps({
|
|
121
137
|
ref: refs.setFloating,
|
|
122
138
|
style: Object.assign({ position: strategy, left: x !== null && x !== void 0 ? x : 0, top: y !== null && y !== void 0 ? y : 0 }, transitions.styles),
|
|
123
139
|
}), { "data-floating": "true", className: "bg-floating-background shadow-floating text-foreground list-none p-0 m-0 rounded-b-lg overflow-auto origin-[top_center] overflow-y-auto z-floating", children: list.map((option, i) => (_createElement(Option, Object.assign({}, getItemProps({
|
|
124
140
|
onClick: () => onSelect(option),
|
|
125
141
|
ref: (node) => void (listRef.current[i] = node),
|
|
126
142
|
selected: index === i,
|
|
127
|
-
active: value === option.value
|
|
128
|
-
}), { key: `${option.value}-option`, option: option, selected: index === i, active: value === option.value })))) })) }) })] }));
|
|
143
|
+
active: value === option.value,
|
|
144
|
+
}), { key: `${option.value}-option`, option: option, selected: index === i, active: value === option.value })))) })) })) : null })] }));
|
|
129
145
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/form/checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,MAAM,MAAM,aAAa,GAAG,QAAQ,CAChC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,EACtD;IACI,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;CAC7B,CACJ,CAAC;AAEF,eAAO,MAAM,QAAQ,4CAAkD,aAAa,
|
|
1
|
+
{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/form/checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,MAAM,MAAM,aAAa,GAAG,QAAQ,CAChC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,EACtD;IACI,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;CAC7B,CACJ,CAAC;AAEF,eAAO,MAAM,QAAQ,4CAAkD,aAAa,4CAiBnF,CAAC"}
|
|
@@ -3,5 +3,5 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { css } from "../../lib/dom";
|
|
4
4
|
export const Checkbox = (_a) => {
|
|
5
5
|
var { children, className = "", size } = _a, props = __rest(_a, ["children", "className", "size"]);
|
|
6
|
-
return (_jsxs("label", { "data-disabled": props.disabled, "aria-disabled": props.disabled, className: "group font-normal flex items-center gap-2 data-[disabled=true]:cursor-not-allowed", children: [_jsx("input", Object.assign({}, props, { type: "checkbox", className: css("form-checkbox
|
|
6
|
+
return (_jsxs("label", { "data-disabled": props.disabled, "aria-disabled": props.disabled, className: "group font-normal flex items-center gap-2 data-[disabled=true]:cursor-not-allowed", children: [_jsx("input", Object.assign({}, props, { type: "checkbox", className: css("form-checkbox size-4 rounded border-card-border text-primary focus:ring-primary appearance-none inline-block bg-origin-border group-aria-disabled:cursor-not-allowed disabled:opacity-70", className) }, props)), children] }));
|
|
7
7
|
};
|
|
@@ -10,8 +10,10 @@ export type FeedbackProps = React.PropsWithChildren<Partial<{
|
|
|
10
10
|
}>>;
|
|
11
11
|
export declare const InputFeedback: ({ reportStatus, hideLeft, className, children, title }: FeedbackProps) => import("react/jsx-runtime").JSX.Element;
|
|
12
12
|
export type InputFieldProps<T extends "input" | "select"> = PolymorphicProps<Partial<{
|
|
13
|
-
|
|
13
|
+
labelClassName: string;
|
|
14
|
+
error: string;
|
|
14
15
|
hideLeft: boolean;
|
|
16
|
+
interactive: boolean;
|
|
15
17
|
container: string;
|
|
16
18
|
left: Label;
|
|
17
19
|
feedback: Label;
|
|
@@ -22,5 +24,5 @@ export type InputFieldProps<T extends "input" | "select"> = PolymorphicProps<Par
|
|
|
22
24
|
name: string;
|
|
23
25
|
placeholder: string;
|
|
24
26
|
}>, T>;
|
|
25
|
-
export declare const InputField: <T extends "input" | "select">({ optionalText, left, rightLabel, container, feedback, right, children, error, form, id, name, title, placeholder, hideLeft, required, }: PropsWithChildren<InputFieldProps<T>>) => import("react/jsx-runtime").JSX.Element;
|
|
27
|
+
export declare const InputField: <T extends "input" | "select">({ optionalText, left, rightLabel, container, feedback, interactive, right, children, error, form, id, labelClassName, name, title, placeholder, hideLeft, required, }: PropsWithChildren<InputFieldProps<T>>) => import("react/jsx-runtime").JSX.Element;
|
|
26
28
|
//# sourceMappingURL=input-field.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input-field.d.ts","sourceRoot":"","sources":["../../../src/components/form/input-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAErD,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,iBAAiB,CAC/C,OAAO,CAAC;IACJ,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,SAAS,CAAC;IACrD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;CACzB,CAAC,CACL,CAAC;AACF,eAAO,MAAM,aAAa,2DAAoE,aAAa,4CA2B1G,CAAC;AAEF,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,OAAO,GAAG,QAAQ,IAAI,gBAAgB,CACxE,OAAO,CAAC;IACJ,
|
|
1
|
+
{"version":3,"file":"input-field.d.ts","sourceRoot":"","sources":["../../../src/components/form/input-field.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAY,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAErD,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,iBAAiB,CAC/C,OAAO,CAAC;IACJ,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,SAAS,CAAC;IACrD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;CACzB,CAAC,CACL,CAAC;AACF,eAAO,MAAM,aAAa,2DAAoE,aAAa,4CA2B1G,CAAC;AAEF,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,OAAO,GAAG,QAAQ,IAAI,gBAAgB,CACxE,OAAO,CAAC;IACJ,cAAc,EAAE,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,KAAK,CAAC;IACZ,QAAQ,EAAE,KAAK,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,KAAK,CAAC;IACb,UAAU,EAAE,KAAK,CAAC;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;CACvB,CAAC,EACF,CAAC,CACJ,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,OAAO,GAAG,QAAQ,yKAkBpD,iBAAiB,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,4CAiCvC,CAAC"}
|
|
@@ -4,7 +4,7 @@ import { CheckCircle, XCircle } from "lucide-react";
|
|
|
4
4
|
import { Fragment } from "react";
|
|
5
5
|
import { css } from "../../lib/dom";
|
|
6
6
|
export const InputFeedback = ({ reportStatus, hideLeft = false, className, children, title }) => (_jsxs("div", { className: css("w-full justify-between", hideLeft && children === null ? "hidden" : "flex", className), children: [hideLeft ? null : (_jsxs("span", { className: "flex items-center gap-1 group-hover:text-primary group-focus-within:text-primary transition-colors group-error:text-danger", children: [title, reportStatus ? (_jsxs("span", { className: "flex aspect-square h-4 w-4 items-center justify-center", children: [_jsx(CheckCircle, { className: "hidden aspect-square h-3 w-3 opacity-0 transition-opacity group-assert:block group-assert:text-success group-assert:opacity-100", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: true }), _jsx(XCircle, { className: "hidden aspect-square h-3 w-3 opacity-0 transition-opacity group-error:block group-error:opacity-100", "aria-hidden": "true", size: 16, strokeWidth: 1, absoluteStrokeWidth: true })] })) : null] })), children] }));
|
|
7
|
-
export const InputField = ({ optionalText = "Optional", left, rightLabel, container, feedback, right, children, error, form, id, name, title, placeholder, hideLeft, required, }) => {
|
|
7
|
+
export const InputField = ({ optionalText = "Optional", left, rightLabel, container, feedback, interactive, right, children, error, form, id, labelClassName = "", name, title, placeholder, hideLeft, required, }) => {
|
|
8
8
|
const ID = id !== null && id !== void 0 ? id : name;
|
|
9
|
-
return (_jsxs("fieldset", { "data-error": !!error,
|
|
9
|
+
return (_jsxs("fieldset", { form: form, "data-error": !!error, "data-interactive": !!interactive, className: css("group inline-flex gap-1 w-full", container), children: [_jsxs("label", { form: form, htmlFor: ID, className: "inline-flex w-full cursor-text flex-row flex-wrap justify-between gap-1 text-sm transition-colors empty:hidden group-error:text-danger group-hover:border-primary", children: [!hideLeft && !rightLabel ? (_jsx(InputFeedback, { hideLeft: hideLeft, reportStatus: true, title: title, placeholder: placeholder, children: optionalText || rightLabel ? (_jsxs(Fragment, { children: [!required ? _jsx("span", { className: "text-opacity-70", children: optionalText }) : null, rightLabel ? _jsx(Fragment, { children: rightLabel }) : null] })) : null })) : null, _jsxs("div", { className: `relative group flex w-full flex-row flex-nowrap items-center gap-x-2 gap-y-1 rounded-md border border-input-border bg-transparent transition-colors group-focus-within:border-primary group-hover:border-primary group-error:border-danger ${labelClassName}`, children: [left ? _jsx("span", { className: "absolute left-0 flex flex-nowrap gap-1 whitespace-nowrap pl-2", children: left }) : null, children, right ? _jsx("span", { className: "absolute right-0 flex flex-nowrap gap-2 whitespace-nowrap pr-1", children: right }) : null] })] }), _jsx("p", { className: "group-error:block empty:hidden group-error:text-danger hidden text-xs group-has-[input:not(:focus):invalid[data-initialized=true]]:block", children: error }), _jsx("p", { className: "hidden text-xs empty:mt-0 empty:hidden group-has-[input:not(:focus):valid[data-initialized=true]]:block", children: feedback })] }));
|
|
10
10
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/components/form/input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAC7D,OAAkB,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAE3E,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,MAAM,MAAM,UAAU,GAAG,QAAQ,CAC7B,eAAe,CAAC,OAAO,CAAC,EACxB,YAAY,GACR,aAAa,GAAG;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB,CACR,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,
|
|
1
|
+
{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/components/form/input.tsx"],"names":[],"mappings":"AACA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAC7D,OAAkB,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAE3E,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,MAAM,MAAM,UAAU,GAAG,QAAQ,CAC7B,eAAe,CAAC,OAAO,CAAC,EACxB,YAAY,GACR,aAAa,GAAG;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB,CACR,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CA6D/B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radiobox.d.ts","sourceRoot":"","sources":["../../../src/components/form/radiobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,MAAM,MAAM,aAAa,GAAG,QAAQ,CAChC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,EACtD;IACI,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;CAC7B,CACJ,CAAC;AAEF,eAAO,MAAM,QAAQ,4CAAkD,aAAa,
|
|
1
|
+
{"version":3,"file":"radiobox.d.ts","sourceRoot":"","sources":["../../../src/components/form/radiobox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,MAAM,MAAM,aAAa,GAAG,QAAQ,CAChC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,EACtD;IACI,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;CAC7B,CACJ,CAAC;AAEF,eAAO,MAAM,QAAQ,4CAAkD,aAAa,4CAiBnF,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/components/form/select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAE5D,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAEtF,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC,eAAe,CAAC,QAAQ,CAAC,EAAE;IAAE,OAAO,EAAE,WAAW,EAAE,CAAA;CAAE,CAAC,CAAC;AAE1F,eAAO,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../src/components/form/select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAE5D,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAEtF,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC,eAAe,CAAC,QAAQ,CAAC,EAAE;IAAE,OAAO,EAAE,WAAW,EAAE,CAAA;CAAE,CAAC,CAAC;AAE1F,eAAO,MAAM,MAAM,oGAkDjB,CAAC"}
|
|
@@ -23,7 +23,7 @@ export const Select = forwardRef((_a, ref) => {
|
|
|
23
23
|
input.removeEventListener("change", change);
|
|
24
24
|
};
|
|
25
25
|
}, []);
|
|
26
|
-
return (_jsx(InputField, Object.assign({}, props, { required: required, container: css("group inline-block w-full", container), right: _jsx(ChevronDown, { size: 20 }), children: _jsxs("select", Object.assign({}, props, { ref: mergeRefs(ref, inputRef), id: id, name: id, required: required, "data-selected": !!props.value || false, className: css("input bg-transparent text-foreground select group h-10 w-full flex-1 rounded-md p-2 placeholder-input-placeholder outline-none transition-colors group-error:text-danger group-error:placeholder-input-mask-error", "data-[selected=false]:text-input-placeholder", props.className), children: [_jsx("option", { value: "", hidden: true, disabled: true, children: props.placeholder }), options.map((option) => {
|
|
26
|
+
return (_jsx(InputField, Object.assign({}, props, { required: required, container: css("group inline-block w-full", container), right: _jsx("button", { type: "button", className: "hover:text-primary transition-colors", children: _jsx(ChevronDown, { size: 20 }) }), children: _jsxs("select", Object.assign({}, props, { ref: mergeRefs(ref, inputRef), id: id, name: id, required: required, "data-selected": !!props.value || false, className: css("input bg-transparent text-foreground select group h-10 w-full flex-1 rounded-md p-2 placeholder-input-placeholder outline-none transition-colors group-error:text-danger group-error:placeholder-input-mask-error", "data-[selected=false]:text-input-placeholder", props.className), children: [_jsx("option", { value: "", hidden: true, disabled: true, children: props.placeholder }), options.map((option) => {
|
|
27
27
|
var _a;
|
|
28
28
|
return (_jsx("option", Object.assign({}, option, { children: (_a = option.label) !== null && _a !== void 0 ? _a : option.value }), `${id}-select-option-${option.value}`));
|
|
29
29
|
})] })) })));
|
|
@@ -15,5 +15,5 @@ export const Switch = (_a) => {
|
|
|
15
15
|
setInnerChecked(checked);
|
|
16
16
|
(_a = props === null || props === void 0 ? void 0 : props.onCheck) === null || _a === void 0 ? void 0 : _a.call(props, checked);
|
|
17
17
|
};
|
|
18
|
-
return (_jsxs("div", { className: "flex items-center", children: [_jsx("input", Object.assign({}, props, { hidden: true, type: "checkbox", checked: checked, onChange: (e) => setInnerChecked(e.target.checked) })), _jsx("button", { type: "button", role: "switch", onClick: onCheck, "aria-checked": checked, "data-checked": checked, "aria-labelledby": `${id}-label`, className: "relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent data-[checked=false]:bg-input-switch-bg data-[checked=true]:bg-primary transition-colors ease-in-out focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2", children: _jsx("span", { "aria-hidden": "true", "data-checked": checked, className: "data-[checked=false]:bg-disabled data-[checked=true]:bg-input-switch inline-block size-5 aspect-square data-[checked=false]translate-x-0 data-[checked=true]:translate-x-5 transform rounded-full shadow ring-0 transition ease-in-out" }) }), _jsx("span", { className: "ml-3 text-sm", id: `${id}-label`, children: _jsx("span", { className: "font-medium text-foreground", children: children }) })] }));
|
|
18
|
+
return (_jsxs("div", { className: "flex items-center", children: [_jsx("input", Object.assign({}, props, { hidden: true, type: "checkbox", checked: checked, onChange: (e) => setInnerChecked(e.target.checked) })), _jsx("button", { type: "button", role: "switch", onClick: onCheck, "aria-checked": checked, "data-checked": checked, "aria-labelledby": `${id}-label`, className: "relative duration-300 inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent data-[checked=false]:bg-input-switch-bg data-[checked=true]:bg-primary transition-colors ease-in-out focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2", children: _jsx("span", { "aria-hidden": "true", "data-checked": checked, className: "data-[checked=false]:bg-disabled duration-300 data-[checked=true]:bg-input-switch inline-block size-5 aspect-square data-[checked=false]:translate-x-0 data-[checked=true]:translate-x-5 transform rounded-full shadow ring-0 transition duration-300 ease-in-out" }) }), _jsx("span", { className: "ml-3 text-sm", id: `${id}-label`, children: _jsx("span", { className: "font-medium text-foreground", children: children }) })] }));
|
|
19
19
|
};
|
|
@@ -1,25 +1,26 @@
|
|
|
1
|
-
export * from "./form/autocomplete";
|
|
2
|
-
export * from "./form/input";
|
|
3
|
-
export * from "./form/select";
|
|
4
|
-
export * from "./form/file-upload";
|
|
5
|
-
export * from "./form/form";
|
|
6
|
-
export * from "./form/select";
|
|
7
|
-
export * from "./form/switch";
|
|
8
|
-
export * from "./form/input-field";
|
|
9
|
-
export * from "./form/transfer-list";
|
|
10
|
-
export * from "./form/checkbox";
|
|
11
|
-
export * from "./form/radiobox";
|
|
12
|
-
export * from "./form/date-picker";
|
|
13
1
|
export * from "./core/button";
|
|
14
2
|
export * from "./core/polymorph";
|
|
15
3
|
export * from "./core/tag";
|
|
4
|
+
export * from "./display/alert";
|
|
5
|
+
export * from "./display/calendar";
|
|
16
6
|
export * from "./display/card";
|
|
17
7
|
export * from "./display/stats";
|
|
18
8
|
export * from "./display/tabs";
|
|
19
|
-
export * from "./display/calendar";
|
|
20
9
|
export * from "./floating/dropdown";
|
|
21
|
-
export * from "./floating/tooltip";
|
|
22
10
|
export * from "./floating/modal";
|
|
11
|
+
export * from "./floating/tooltip";
|
|
12
|
+
export * from "./form/autocomplete";
|
|
13
|
+
export * from "./form/checkbox";
|
|
14
|
+
export * from "./form/date-picker";
|
|
15
|
+
export * from "./form/file-upload";
|
|
16
|
+
export * from "./form/form";
|
|
17
|
+
export * from "./form/input";
|
|
18
|
+
export * from "./form/input-field";
|
|
19
|
+
export * from "./form/radiobox";
|
|
20
|
+
export * from "./form/select";
|
|
21
|
+
export * from "./form/select";
|
|
22
|
+
export * from "./form/switch";
|
|
23
|
+
export * from "./form/transfer-list";
|
|
23
24
|
export * from "./table/index";
|
|
24
25
|
export { createColumns, createOptionCols, type ColType, useTablePreferences, type TablePagination } from "./table/table-lib";
|
|
25
26
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,KAAK,OAAO,EAAE,mBAAmB,EAAE,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC"}
|
package/dist/components/index.js
CHANGED
|
@@ -1,24 +1,25 @@
|
|
|
1
|
-
export * from "./form/autocomplete";
|
|
2
|
-
export * from "./form/input";
|
|
3
|
-
export * from "./form/select";
|
|
4
|
-
export * from "./form/file-upload";
|
|
5
|
-
export * from "./form/form";
|
|
6
|
-
export * from "./form/select";
|
|
7
|
-
export * from "./form/switch";
|
|
8
|
-
export * from "./form/input-field";
|
|
9
|
-
export * from "./form/transfer-list";
|
|
10
|
-
export * from "./form/checkbox";
|
|
11
|
-
export * from "./form/radiobox";
|
|
12
|
-
export * from "./form/date-picker";
|
|
13
1
|
export * from "./core/button";
|
|
14
2
|
export * from "./core/polymorph";
|
|
15
3
|
export * from "./core/tag";
|
|
4
|
+
export * from "./display/alert";
|
|
5
|
+
export * from "./display/calendar";
|
|
16
6
|
export * from "./display/card";
|
|
17
7
|
export * from "./display/stats";
|
|
18
8
|
export * from "./display/tabs";
|
|
19
|
-
export * from "./display/calendar";
|
|
20
9
|
export * from "./floating/dropdown";
|
|
21
|
-
export * from "./floating/tooltip";
|
|
22
10
|
export * from "./floating/modal";
|
|
11
|
+
export * from "./floating/tooltip";
|
|
12
|
+
export * from "./form/autocomplete";
|
|
13
|
+
export * from "./form/checkbox";
|
|
14
|
+
export * from "./form/date-picker";
|
|
15
|
+
export * from "./form/file-upload";
|
|
16
|
+
export * from "./form/form";
|
|
17
|
+
export * from "./form/input";
|
|
18
|
+
export * from "./form/input-field";
|
|
19
|
+
export * from "./form/radiobox";
|
|
20
|
+
export * from "./form/select";
|
|
21
|
+
export * from "./form/select";
|
|
22
|
+
export * from "./form/switch";
|
|
23
|
+
export * from "./form/transfer-list";
|
|
23
24
|
export * from "./table/index";
|
|
24
25
|
export { createColumns, createOptionCols, useTablePreferences } from "./table/table-lib";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../../src/components/table/pagination.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"pagination.d.ts","sourceRoot":"","sources":["../../../src/components/table/pagination.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAuB9C,eAAO,MAAM,UAAU,eAAgB,eAAe,4CAmErD,CAAC"}
|
|
@@ -29,16 +29,12 @@ export const Pagination = (pagination) => {
|
|
|
29
29
|
const Render = pagination.asLink || "button";
|
|
30
30
|
const pageNavigation = useMemo(() => createPaginationItems(pagination.current, pagination.pages), [pagination.current, pagination.pages]);
|
|
31
31
|
const hasNext = pagination.current < pagination.pages;
|
|
32
|
-
return _jsxs("footer", { className: "flex px-1 py-2 items-center justify-between flex-nowrap", children: [_jsxs("p", { children: [pagination.current, " to ", pagination.pages, " of ", pagination.totalItems, " items.", pagination.onChangeSize && Array.isArray(pagination.sizes) ?
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
}, children: pagination.sizes.map(value => _jsx("option", { value: value, children: value })) }), " per page"] })
|
|
37
|
-
: null] }), _jsx("nav", { children: _jsxs("ul", { className: "flex items-center gap-2", children: [pagination.current > 1 ? _jsx("li", { children: _jsx(Render, { href: "previous", className: "", children: "Previous" }) }) : null, pageNavigation.map(x => {
|
|
32
|
+
return (_jsxs("footer", { className: "flex px-1 py-2 items-center justify-center gap-4 lg:justify-between flex-wrap lg:flex-nowrap", children: [_jsxs("p", { children: [pagination.current, " to ", pagination.pages, " of ", pagination.totalItems, " items.", pagination.onChangeSize && Array.isArray(pagination.sizes) ? (_jsxs(Fragment, { children: [_jsx("select", { value: pagination.size, className: "cursor-pointer bg-transparent", onChange: (e) => {
|
|
33
|
+
var _a;
|
|
34
|
+
(_a = pagination.onChangeSize) === null || _a === void 0 ? void 0 : _a.call(pagination, Number(e.target.value));
|
|
35
|
+
}, children: pagination.sizes.map((value) => (_jsx("option", { value: value, children: value }, `pagination-opt-${value}`))) }), " ", "per page"] })) : null] }), _jsx("nav", { children: _jsxs("ul", { className: "flex items-center gap-2", children: [pagination.current > 1 ? (_jsx("li", { children: _jsx(Render, { href: "previous", className: "", children: "Previous" }) })) : null, pageNavigation.map((x) => {
|
|
38
36
|
if (x === null)
|
|
39
37
|
return null;
|
|
40
|
-
return _jsx(Fragment, { children: typeof x === "string" ?
|
|
41
|
-
|
|
42
|
-
_jsx("li", { children: _jsx(Render, { href: x, className: `cursor-pointer px-3 py-1 transition-colors border-b-2 hover:text-primary-subtle hover:border-primary-subtle proportional-nums ${x === pagination.current ? "text-primary border-primary" : "border-transparent"}`, children: x }) }, `pagination-${x}`) });
|
|
43
|
-
}), hasNext ? _jsx("li", { children: _jsx(Render, { href: "next", className: "", children: "Next" }) }) : null] }) })] });
|
|
38
|
+
return (_jsx(Fragment, { children: typeof x === "string" ? (_jsx("li", { children: "..." })) : (_jsx("li", { children: _jsx(Render, { href: x, className: `cursor-pointer px-3 py-1 transition-colors border-b-2 hover:text-primary-subtle hover:border-primary-subtle proportional-nums ${x === pagination.current ? "text-primary border-primary" : "border-transparent"}`, children: x }) })) }, `pagination-${x}`));
|
|
39
|
+
}), hasNext ? (_jsx("li", { children: _jsx(Render, { href: "next", className: "", children: "Next" }) })) : null] }) })] }));
|
|
44
40
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-lib.d.ts","sourceRoot":"","sources":["../../../src/components/table/table-lib.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"table-lib.d.ts","sourceRoot":"","sources":["../../../src/components/table/table-lib.ts"],"names":[],"mappings":"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"}
|
package/dist/hooks/use-form.js
CHANGED
|
@@ -51,7 +51,7 @@ export const useForm = (schema) => {
|
|
|
51
51
|
const input = (name, props) => {
|
|
52
52
|
var _a;
|
|
53
53
|
const validator = getSchemaShape(name, schema);
|
|
54
|
-
return Object.assign(Object.assign({}, props), { name, id: name, type: Is.instance(validator, ZodNumber) ? "number" : (_a = props === null || props === void 0 ? void 0 : props.type) !== null && _a !== void 0 ? _a : "text", error: errors === null || errors === void 0 ? void 0 : errors[name], ref: (e) => {
|
|
54
|
+
return Object.assign(Object.assign({}, props), { name, id: name, type: Is.instance(validator, ZodNumber) ? "number" : ((_a = props === null || props === void 0 ? void 0 : props.type) !== null && _a !== void 0 ? _a : "text"), error: errors === null || errors === void 0 ? void 0 : errors[name], ref: (e) => {
|
|
55
55
|
if (e === null)
|
|
56
56
|
return;
|
|
57
57
|
ref.current[name] = { element: e, schema: validator };
|