@lerianstudio/sindarian-ui 1.0.0-beta.8 → 1.1.1-beta.1

package/dist/components/card/account-card/index.js

@@ -30,10 +30,10 @@ const AccountBalanceCardContext = react_1.default.createContext({
     open: false
 });
 function AccountBalanceCard({ className, open, onOpenChange, children, ...props }) {
-    return ((0, jsx_runtime_1.jsx)(react_collapsible_1.Collapsible, { open: open, onOpenChange: onOpenChange, "data-slot": "account-balance-card", className: (0, utils_1.cn)('w-full', className), ...props, children: (0, jsx_runtime_1.jsx)(AccountBalanceCardContext.Provider, { value: { open }, children: (0, jsx_runtime_1.jsx)(card_1.Card, { className: "relative gap-2 px-5 py-4 shadow-xs", children: children }) }) }));
+    return ((0, jsx_runtime_1.jsx)(react_collapsible_1.Collapsible, { open: open, onOpenChange: onOpenChange, "data-slot": "account-balance-card", className: (0, utils_1.cn)('w-full', className), ...props, children: (0, jsx_runtime_1.jsx)(AccountBalanceCardContext.Provider, { value: { open }, children: (0, jsx_runtime_1.jsx)(card_1.Card, { className: "shadow-xs relative gap-2 px-5 py-4", children: children }) }) }));
 }
 function AccountBalanceCardIcon({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)(lucide_react_1.User, { "data-slot": "account-balance-card-icon", strokeWidth: 1, className: (0, utils_1.cn)('mb-[14px] size-8 text-zinc-800 opacity-40', className), ...props }));
+    return ((0, jsx_runtime_1.jsx)(lucide_react_1.User, { "data-slot": "account-balance-card-icon", strokeWidth: 1, className: (0, utils_1.cn)('text-foreground mb-[14px] size-8 opacity-40', className), ...props }));
 }
 function AccountBalanceCardHeader({ className, ...props }) {
     return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "account-balance-card-header", className: (0, utils_1.cn)('flex flex-col', className), ...props }));
@@ -42,13 +42,13 @@ function AccountBalanceCardTitle({ className, ...props }) {
     return ((0, jsx_runtime_1.jsx)("p", { "data-slot": "account-balance-card-title", className: (0, utils_1.cn)('text-shadcn-600 text-lg font-bold', className), ...props }));
 }
 function AccountBalanceCardDeleteButton({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)(icon_button_1.IconButton, { variant: "outline", size: "small", rounded: true, "data-slot": "account-balance-card-delete-button", className: (0, utils_1.cn)('absolute top-3 right-3', className), ...props, children: (0, jsx_runtime_1.jsx)(lucide_react_1.Trash, { className: "h-4 w-4 text-zinc-600" }) }));
+    return ((0, jsx_runtime_1.jsx)(icon_button_1.IconButton, { variant: "outline", size: "small", rounded: true, "data-slot": "account-balance-card-delete-button", className: (0, utils_1.cn)('absolute right-3 top-3', className), ...props, children: (0, jsx_runtime_1.jsx)(lucide_react_1.Trash, { className: "text-muted-foreground h-4 w-4" }) }));
 }
 function AccountBalanceCardContent({ className, ...props }) {
     return ((0, jsx_runtime_1.jsx)(collapsible_1.CollapsibleContent, { "data-slot": "account-balance-card-content", className: (0, utils_1.cn)('data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden', className), ...props }));
 }
 function AccountBalanceCardLoading({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { "data-slot": "account-balance-card-loading", className: (0, utils_1.cn)('mt-3 h-3 w-full rounded-md bg-zinc-200', className), ...props }));
+    return ((0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { "data-slot": "account-balance-card-loading", className: (0, utils_1.cn)('bg-muted mt-3 h-3 w-full rounded-md', className), ...props }));
 }
 function AccountBalanceCardEmpty({ className, ...props }) {
     return ((0, jsx_runtime_1.jsx)("p", { "data-slot": "account-balance-card-empty", className: (0, utils_1.cn)('text-shadcn-500 mt-3 text-center text-sm font-normal', className), ...props }));

package/dist/components/card/basic-card/index.js

@@ -7,7 +7,7 @@ exports.BasicCardAction = BasicCardAction;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const utils_1 = require("../../../lib/utils");
 function BasicCard({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('flex flex-col rounded-lg bg-white p-6', className), ...props }));
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('bg-card flex flex-col rounded-lg p-6', className), ...props }));
 }
 function BasicCardTitle({ className, ...props }) {
     return ((0, jsx_runtime_1.jsx)("h2", { className: (0, utils_1.cn)('text-shadcn-600 mb-4 text-sm font-medium', className), ...props }));

package/dist/components/card/dashboard-card/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/card/dashboard-card/index.tsx"],"names":[],"mappings":"AAEA,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAU7B;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAU7B;AAED,wBAAgB,kBAAkB,CAAC,EACjC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAU5B;AAED,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAO7B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/card/dashboard-card/index.tsx"],"names":[],"mappings":"AAEA,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAU7B;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAU7B;AAED,wBAAgB,kBAAkB,CAAC,EACjC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAU5B;AAED,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAU7B"}

package/dist/components/card/dashboard-card/index.js

@@ -7,14 +7,14 @@ exports.DashboardCardContent = DashboardCardContent;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const utils_1 = require("../../../lib/utils");
 function DashboardCard({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('relative flex flex-col rounded-lg bg-white p-6 pt-4', className), ...props }));
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('bg-card relative flex flex-col rounded-lg p-6 pt-4', className), ...props }));
 }
 function DashboardCardIcon({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('text-shadcn-400 absolute top-4 right-6 flex size-6 items-center justify-center [&>svg]:size-6', className), ...props }));
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('text-muted-foreground absolute right-6 top-4 flex size-6 items-center justify-center [&>svg]:size-6', className), ...props }));
 }
 function DashboardCardTitle({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)("h2", { className: (0, utils_1.cn)('mb-4 text-sm font-medium text-zinc-600 uppercase', className), ...props }));
+    return ((0, jsx_runtime_1.jsx)("h2", { className: (0, utils_1.cn)('text-muted-foreground mb-4 text-sm font-medium uppercase', className), ...props }));
 }
 function DashboardCardContent({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('text-[32px] font-extrabold text-zinc-600', className), ...props }));
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('text-muted-foreground text-[32px] font-extrabold', className), ...props }));
 }

package/dist/components/card/entity-card/index.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import { Badge } from '../../../components/ui/badge';
 import { DropdownMenu, DropdownMenuItem } from '../../../components/ui/dropdown-menu';
-export declare function EntityCardWrapper({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+export declare function EntityCardGrid({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+export declare function EntityCardGridFooter({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
 export type EntityCardProps = React.ComponentProps<'div'> & {
     value?: number;
     progress?: boolean;

package/dist/components/card/entity-card/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/card/entity-card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA;AAC7C,OAAO,EACL,YAAY,EAEZ,gBAAgB,EAEjB,MAAM,+BAA+B,CAAA;AAOtC,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAE7B;AAED,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC1D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,KAAK,EACL,QAAgB,EAChB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,2CAoBjB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,YAAY,CAAC,2CAW3C;AAED,eAAO,MAAM,oBAAoB,yBAAmB,CAAA;AAEpD,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAQ5B;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,2CAW9B;AAED,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,2CAQpC;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,wBAAgB,qBAAqB,CAAC,EACpC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,2CAQ3B;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAW5B;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAgB7B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/card/entity-card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA;AAC7C,OAAO,EACL,YAAY,EAEZ,gBAAgB,EAEjB,MAAM,+BAA+B,CAAA;AAOtC,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7B;AAED,wBAAgB,oBAAoB,CAAC,EACnC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAW7B;AAED,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC1D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,KAAK,EACL,QAAgB,EAChB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,2CAoBjB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,YAAY,CAAC,2CAW3C;AAED,eAAO,MAAM,oBAAoB,yBAAmB,CAAA;AAEpD,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAQ5B;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,2CAW9B;AAED,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,2CAQpC;AAED,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,wBAAgB,qBAAqB,CAAC,EACpC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,2CAQ3B;AAED,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,2CAW5B;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAgB7B"}

package/dist/components/card/entity-card/index.js

@@ -1,7 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EntityCardActionItem = void 0;
-exports.EntityCardWrapper = EntityCardWrapper;
+exports.EntityCardGrid = EntityCardGrid;
+exports.EntityCardGridFooter = EntityCardGridFooter;
 exports.EntityCard = EntityCard;
 exports.EntityCardAction = EntityCardAction;
 exports.EntityCardHeader = EntityCardHeader;
@@ -21,21 +22,24 @@ const progress_1 = require("../../../components/ui/progress");
 const separator_1 = require("../../../components/ui/separator");
 const utils_1 = require("../../../lib/utils");
 const lucide_react_1 = require("lucide-react");
-function EntityCardWrapper({ className, ...props }) {
-    return (0, jsx_runtime_1.jsx)("div", { "data-slot": "entity-card-wrapper", ...props });
+function EntityCardGrid({ className, ...props }) {
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3', className), "data-slot": "entity-card-grid", ...props }));
+}
+function EntityCardGridFooter({ className, ...props }) {
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)('flex items-center justify-between rounded-lg border border-zinc-200 bg-white px-6 py-4', className), "data-slot": "entity-card-grid-footer", ...props }));
 }
 function EntityCard({ className, value, progress = false, children, ...props }) {
-    return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "entity-card-wrapper", className: "transition-shadow hover:shadow-xl", children: [(0, jsx_runtime_1.jsx)("div", { "data-slot": "entity-card", className: (0, utils_1.cn)('relative flex flex-col gap-4 rounded-lg bg-white px-5 py-4', { 'rounded-b-none': progress }, className), ...props, children: children }), progress && (0, jsx_runtime_1.jsx)(progress_1.Progress, { className: "h-1.5 rounded-t-none", value: value })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "entity-card-wrapper", className: "transition-shadow hover:shadow-xl", children: [(0, jsx_runtime_1.jsx)("div", { "data-slot": "entity-card", className: (0, utils_1.cn)('bg-card relative flex flex-col gap-4 rounded-lg px-5 py-4', { 'rounded-b-none': progress }, className), ...props, children: children }), progress && (0, jsx_runtime_1.jsx)(progress_1.Progress, { className: "h-1.5 rounded-t-none", value: value })] }));
 }
 function EntityCardAction({ children, ...props }) {
-    return ((0, jsx_runtime_1.jsxs)(dropdown_menu_1.DropdownMenu, { ...props, children: [(0, jsx_runtime_1.jsx)(dropdown_menu_1.DropdownMenuTrigger, { className: "absolute top-2.5 right-2.5", children: (0, jsx_runtime_1.jsx)(icon_button_1.IconButton, { variant: "outline", size: "small", rounded: true, children: (0, jsx_runtime_1.jsx)(lucide_react_1.EllipsisVertical, {}) }) }), (0, jsx_runtime_1.jsx)(dropdown_menu_1.DropdownMenuContent, { children: children })] }));
+    return ((0, jsx_runtime_1.jsxs)(dropdown_menu_1.DropdownMenu, { ...props, children: [(0, jsx_runtime_1.jsx)(dropdown_menu_1.DropdownMenuTrigger, { className: "absolute right-2.5 top-2.5", children: (0, jsx_runtime_1.jsx)(icon_button_1.IconButton, { variant: "outline", size: "small", rounded: true, children: (0, jsx_runtime_1.jsx)(lucide_react_1.EllipsisVertical, {}) }) }), (0, jsx_runtime_1.jsx)(dropdown_menu_1.DropdownMenuContent, { children: children })] }));
 }
 exports.EntityCardActionItem = dropdown_menu_1.DropdownMenuItem;
 function EntityCardHeader({ className, ...props }) {
     return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "entity-card-header", className: (0, utils_1.cn)('flex flex-col gap-2', className), ...props }));
 }
 function EntityCardTitle({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)("h3", { "data-slot": "entity-card-title", className: (0, utils_1.cn)('text-sm font-semibold text-zinc-700', className), ...props }));
+    return ((0, jsx_runtime_1.jsx)("h3", { "data-slot": "entity-card-title", className: (0, utils_1.cn)('text-foreground text-sm font-semibold', className), ...props }));
 }
 function EntityCardIcon({ className, ...props }) {
     return ((0, jsx_runtime_1.jsx)("span", { "data-slot": "entity-card-icon", className: (0, utils_1.cn)('text-shadcn-400 size-8 [&>svg]:size-8 [&>svg]:stroke-[1.5]', className), ...props }));
@@ -56,5 +60,5 @@ function EntityCardList({ className, ...props }) {
     return ((0, jsx_runtime_1.jsx)("ul", { "data-slot": "entity-card-list", className: (0, utils_1.cn)('text-shadcn-500 mx-2 list-inside list-disc space-y-1 text-xs font-medium', className), ...props }));
 }
 function EntityCardFooter({ className, children, ...props }) {
-    return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "entity-card-footer", className: (0, utils_1.cn)('text-shadcn-400 flex flex-col gap-2 text-xs font-medium', className), ...props, children: [(0, jsx_runtime_1.jsx)(separator_1.Separator, {}), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-row items-center gap-2 [&>svg]:size-4 [&>svg]:stroke-[1.5] [&>svg]:text-zinc-600", children: children })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "entity-card-footer", className: (0, utils_1.cn)('text-shadcn-400 flex flex-col gap-2 text-xs font-medium', className), ...props, children: [(0, jsx_runtime_1.jsx)(separator_1.Separator, {}), (0, jsx_runtime_1.jsx)("div", { className: "[&>svg]:text-muted-foreground flex flex-row items-center gap-2 [&>svg]:size-4 [&>svg]:stroke-[1.5]", children: children })] }));
 }

package/dist/components/dialog/large-dialog/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/dialog/large-dialog/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAE3D,iBAAS,oBAAoB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAYxE;AAED,iBAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAClE,UAAU,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,iBAAS,kBAAkB,CAAC,EAC1B,UAAU,EACV,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAazB;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAU7B;AAED,OAAO,EACL,oBAAoB,EACpB,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EAClB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/dialog/large-dialog/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAE3D,iBAAS,oBAAoB,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,kBAAkB,2CAYxE;AAED,iBAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAQ7B;AAED,MAAM,MAAM,uBAAuB,GAAG,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAClE,UAAU,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,iBAAS,kBAAkB,CAAC,EAC1B,UAAU,EACV,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,2CAezB;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,2CAU7B;AAED,OAAO,EACL,oBAAoB,EACpB,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EAClB,CAAA"}

package/dist/components/dialog/large-dialog/index.js

@@ -14,7 +14,7 @@ function OnboardDialogHeader({ className, ...props }) {
     return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "onboard-dialog-header", className: (0, utils_1.cn)('flex flex-row justify-between', className), ...props }));
 }
 function OnboardDialogTitle({ upperTitle, title, className, ...props }) {
-    return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "onboard-dialog-title", className: (0, utils_1.cn)('flex flex-col gap-8', className), ...props, children: [(0, jsx_runtime_1.jsx)("p", { className: "text-base font-medium text-zinc-600", children: upperTitle }), (0, jsx_runtime_1.jsx)(dialog_1.DialogTitle, { className: "text-4xl font-bold text-zinc-600", children: title })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "onboard-dialog-title", className: (0, utils_1.cn)('flex flex-col gap-8', className), ...props, children: [(0, jsx_runtime_1.jsx)("p", { className: "text-muted-foreground text-base font-medium", children: upperTitle }), (0, jsx_runtime_1.jsx)(dialog_1.DialogTitle, { className: "text-muted-foreground text-4xl font-bold", children: title })] }));
 }
 function OnboardDialogIcon({ className, children, ...props }) {
     return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "onboard-dialog-icon", className: (0, utils_1.cn)('flex items-center px-12', className), ...props, children: (0, jsx_runtime_1.jsx)("div", { className: "shrink-0", children: children }) }));

package/dist/components/entity-box/index.js

@@ -15,10 +15,10 @@ const collapsible_1 = require("../ui/collapsible");
 const button_1 = require("../ui/button");
 const separator_1 = require("../ui/separator");
 function EntityBox({ className, children, ...props }) {
-    return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "entity-box", className: (0, utils_1.cn)('shadow-entity-box mb-2 flex items-center justify-between rounded-lg bg-white p-6', className), ...props, children: children }));
+    return ((0, jsx_runtime_1.jsx)("div", { "data-slot": "entity-box", className: (0, utils_1.cn)('shadow-entity-box bg-card mb-2 flex items-center justify-between rounded-lg p-6', className), ...props, children: children }));
 }
 function EntityBoxCollapsible({ className, ...props }) {
-    return ((0, jsx_runtime_1.jsx)(collapsible_1.Collapsible, { className: (0, utils_1.cn)('shadow-entity-box mb-2 flex flex-col rounded-lg bg-white', className), ...props }));
+    return ((0, jsx_runtime_1.jsx)(collapsible_1.Collapsible, { className: (0, utils_1.cn)('shadow-entity-box bg-card mb-2 flex flex-col rounded-lg', className), ...props }));
 }
 function EntityBoxCollapsibleTrigger(props) {
     return ((0, jsx_runtime_1.jsx)(collapsible_1.CollapsibleTrigger, { ...props, asChild: true, children: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "secondary", className: "h-[34px] w-[34px] p-2", children: (0, jsx_runtime_1.jsx)(lucide_react_1.Settings2, { size: 16 }) }) }));
@@ -27,7 +27,7 @@ function EntityBoxCollapsibleContent({ children, ...props }) {
     return ((0, jsx_runtime_1.jsxs)(collapsible_1.CollapsibleContent, { ...props, children: [(0, jsx_runtime_1.jsx)(separator_1.Separator, { orientation: "horizontal" }), (0, jsx_runtime_1.jsx)("div", { className: "grid w-full grid-cols-3 p-6", children: children })] }));
 }
 function EntityBoxHeaderTitle({ title, subtitle, tooltip, tooltipWidth, className, ...props }) {
-    return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "entity-box-header", className: (0, utils_1.cn)('flex flex-col items-start', className), ...props, children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-[10px]", children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-lg font-medium text-zinc-600", children: title }), tooltip && ((0, jsx_runtime_1.jsx)(tooltip_1.TooltipProvider, { children: (0, jsx_runtime_1.jsxs)(tooltip_1.Tooltip, { children: [(0, jsx_runtime_1.jsx)(tooltip_1.TooltipTrigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(lucide_react_1.CircleHelp, { className: "pointer text-shadcn-400 h-5 w-5" }) }), (0, jsx_runtime_1.jsx)(tooltip_1.TooltipContent, { side: "right", style: tooltipWidth
+    return ((0, jsx_runtime_1.jsxs)("div", { "data-slot": "entity-box-header", className: (0, utils_1.cn)('flex flex-col items-start', className), ...props, children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-[10px]", children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-muted-foreground text-lg font-medium", children: title }), tooltip && ((0, jsx_runtime_1.jsx)(tooltip_1.TooltipProvider, { children: (0, jsx_runtime_1.jsxs)(tooltip_1.Tooltip, { children: [(0, jsx_runtime_1.jsx)(tooltip_1.TooltipTrigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(lucide_react_1.CircleHelp, { className: "pointer text-shadcn-400 h-5 w-5" }) }), (0, jsx_runtime_1.jsx)(tooltip_1.TooltipContent, { side: "right", style: tooltipWidth
                                         ? { width: tooltipWidth, maxWidth: tooltipWidth }
                                         : undefined, children: tooltip })] }) }))] }), subtitle && (0, jsx_runtime_1.jsx)("p", { className: "text-shadcn-400 text-sm", children: subtitle })] }));
 }

package/dist/components/form/combo-box-field/index.d.ts

@@ -1,14 +1,14 @@
 import React from 'react';
-import { Control } from 'react-hook-form';
-export type ComboBoxFieldProps = React.PropsWithChildren & {
-    name: string;
+import { Control, FieldValues, Path } from 'react-hook-form';
+export type ComboBoxFieldProps<T extends FieldValues = FieldValues> = React.PropsWithChildren & {
+    name: Path<T>;
     label?: string;
     placeholder?: string;
     emptyMessage?: string;
-    control: Control<any>;
+    control: Control<T>;
     disabled?: boolean;
     readOnly?: boolean;
     required?: boolean;
 };
-export declare const ComboBoxField: ({ name, label, placeholder, emptyMessage, required, children, readOnly, ...others }: ComboBoxFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ComboBoxField: <T extends FieldValues = FieldValues>({ name, label, placeholder, emptyMessage, required, children, readOnly, ...others }: ComboBoxFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/form/combo-box-field/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/combo-box-field/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AAiBzC,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,iBAAiB,GAAG;IACzD,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,OAAO,EAAE,OAAO,CAAC,GAAG,CAAC,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,aAAa,GAAI,qFAS3B,kBAAkB,4CA0FpB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/combo-box-field/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAOzB,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAA;AAiB5D,MAAM,MAAM,kBAAkB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAChE,KAAK,CAAC,iBAAiB,GAAG;IACxB,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAEH,eAAO,MAAM,aAAa,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,qFAShE,kBAAkB,CAAC,CAAC,CAAC,4CA0FvB,CAAA"}

package/dist/components/form/combo-box-field/index.js

@@ -22,7 +22,7 @@ const ComboBoxField = ({ name, label, placeholder, emptyMessage, required, child
     const getDisplayValue = react_1.default.useCallback((value) => {
         return options.find((option) => option.value === value)?.label ?? null;
     }, [options]);
-    return ((0, jsx_runtime_1.jsx)(form_1.FormField, { name: name, ...others, render: ({ field }) => ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [label && (0, jsx_runtime_1.jsx)(form_1.FormLabel, { children: label }), (0, jsx_runtime_1.jsxs)(popover_1.Popover, { open: readOnly ? false : open, onOpenChange: readOnly ? () => { } : setOpen, children: [(0, jsx_runtime_1.jsx)(popover_1.PopoverTrigger, { asChild: true, children: (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "outline", role: "combobox", "aria-expanded": readOnly ? false : open, readOnly: readOnly, tabIndex: 0, className: (0, utils_1.cn)('w-full justify-between', !field.value && 'text-muted-foreground'), children: [getDisplayValue(field.value) ?? placeholder, !readOnly && ((0, jsx_runtime_1.jsx)(lucide_react_1.ChevronsUpDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" }))] }) }), (0, jsx_runtime_1.jsx)(popover_1.PopoverContent, { className: "w-(--radix-popover-trigger-width) p-0", children: (0, jsx_runtime_1.jsxs)(command_1.Command, { children: [(0, jsx_runtime_1.jsx)(command_1.CommandInput, { placeholder: placeholder }), (0, jsx_runtime_1.jsxs)(command_1.CommandList, { children: [(0, jsx_runtime_1.jsx)(command_1.CommandEmpty, { children: emptyMessage }), (0, jsx_runtime_1.jsx)(command_1.CommandGroup, { children: react_1.default.Children.map(react_1.default.Children.toArray(children), (child) => react_1.default.isValidElement(child)
+    return ((0, jsx_runtime_1.jsx)(form_1.FormField, { name: name, ...others, render: ({ field }) => ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [label && (0, jsx_runtime_1.jsx)(form_1.FormLabel, { children: label }), (0, jsx_runtime_1.jsxs)(popover_1.Popover, { open: readOnly ? false : open, onOpenChange: readOnly ? () => { } : setOpen, children: [(0, jsx_runtime_1.jsx)(popover_1.PopoverTrigger, { asChild: true, children: (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "outline", role: "combobox", "aria-expanded": readOnly ? false : open, readOnly: readOnly, tabIndex: 0, className: (0, utils_1.cn)('border-border bg-input hover:bg-input h-10 w-full justify-between rounded-md border px-4 py-2 pl-6 text-left text-sm font-normal focus:outline-none focus:ring-2 focus:ring-offset-0', !field.value && 'text-muted-foreground'), children: [getDisplayValue(field.value) ?? placeholder, !readOnly && ((0, jsx_runtime_1.jsx)(lucide_react_1.ChevronsUpDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" }))] }) }), (0, jsx_runtime_1.jsx)(popover_1.PopoverContent, { className: "w-(--radix-popover-trigger-width) p-0", children: (0, jsx_runtime_1.jsxs)(command_1.Command, { children: [(0, jsx_runtime_1.jsx)(command_1.CommandInput, { placeholder: placeholder }), (0, jsx_runtime_1.jsxs)(command_1.CommandList, { children: [(0, jsx_runtime_1.jsx)(command_1.CommandEmpty, { children: emptyMessage }), (0, jsx_runtime_1.jsx)(command_1.CommandGroup, { children: react_1.default.Children.map(react_1.default.Children.toArray(children), (child) => react_1.default.isValidElement(child)
                                                     ? react_1.default.cloneElement(child, {
                                                         keywords: [child.props.children],
                                                         onSelect: (value) => {

package/dist/components/form/date-picker-field/index.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { Control, FieldValues, Path } from 'react-hook-form';
+export type DatePickerFieldProps<T extends FieldValues = FieldValues> = {
+    name: Path<T>;
+    label?: ReactNode;
+    tooltip?: string;
+    labelExtra?: ReactNode;
+    description?: ReactNode;
+    placeholder?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    control: Control<T>;
+    required?: boolean;
+    dateFormat?: string;
+    align?: 'start' | 'center' | 'end';
+    'data-testid'?: string;
+    valueAsString?: boolean;
+};
+export declare const DatePickerField: <T extends FieldValues = FieldValues>({ name, label, tooltip, labelExtra, description, placeholder, disabled, readOnly, control, required, dateFormat, align, valueAsString, ...others }: DatePickerFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/form/date-picker-field/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/date-picker-field/index.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAA;AAE5D,MAAM,MAAM,oBAAoB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI;IACtE,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAA;IACb,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IAClC,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAA;AAED,eAAO,MAAM,eAAe,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,oJAelE,oBAAoB,CAAC,CAAC,CAAC,4CAsFzB,CAAA"}

package/dist/components/form/date-picker-field/index.js

@@ -0,0 +1,43 @@
+'use client';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DatePickerField = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const button_1 = require("../../../components/ui/button");
+const calendar_1 = require("../../../components/ui/calendar");
+const form_1 = require("../../../components/ui/form");
+const popover_1 = require("../../../components/ui/popover");
+const utils_1 = require("../../../lib/utils");
+const dayjs_1 = __importDefault(require("dayjs"));
+const lucide_react_1 = require("lucide-react");
+const DatePickerField = ({ name, label, tooltip, labelExtra, description, placeholder, disabled, readOnly, control, required, dateFormat = 'MMM DD, YYYY', align = 'start', valueAsString, ...others }) => {
+    return ((0, jsx_runtime_1.jsx)(form_1.FormField, { name: name, control: control, render: ({ field }) => {
+            const convertFieldValueToDate = (fieldValue) => {
+                if (!fieldValue)
+                    return undefined;
+                if (valueAsString) {
+                    const parsed = (0, dayjs_1.default)(fieldValue);
+                    return parsed.isValid() ? parsed.toDate() : undefined;
+                }
+                return fieldValue;
+            };
+            const convertDateToOutputFormat = (date) => {
+                if (!date)
+                    return undefined;
+                if (valueAsString) {
+                    const parsed = (0, dayjs_1.default)(date);
+                    return parsed.isValid() ? parsed.format('YYYY-MM-DD') : undefined;
+                }
+                return date;
+            };
+            const value = convertFieldValueToDate(field.value);
+            const handleSelect = (date) => {
+                field.onChange(convertDateToOutputFormat(date));
+            };
+            return ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [label && ((0, jsx_runtime_1.jsx)(form_1.FormLabel, { extra: tooltip ? (0, jsx_runtime_1.jsx)(form_1.FormTooltip, { children: tooltip }) : labelExtra, children: label })), (0, jsx_runtime_1.jsxs)(popover_1.Popover, { children: [(0, jsx_runtime_1.jsx)(popover_1.PopoverTrigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(form_1.FormControl, { children: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outline", disabled: disabled, className: (0, utils_1.cn)('border-button-border w-full justify-start px-2.5 font-normal', !value && 'text-muted-foreground', readOnly && 'pointer-events-none'), "data-testid": others['data-testid'], icon: (0, jsx_runtime_1.jsx)(lucide_react_1.CalendarIcon, { className: "size-4" }), children: value ? ((0, dayjs_1.default)(value).format(dateFormat)) : ((0, jsx_runtime_1.jsx)("span", { children: placeholder })) }) }) }), (0, jsx_runtime_1.jsx)(popover_1.PopoverContent, { className: "w-auto p-0", align: align, children: (0, jsx_runtime_1.jsx)(calendar_1.Calendar, { mode: "single", defaultMonth: value, selected: value, onSelect: handleSelect, disabled: disabled || readOnly }) })] }), (0, jsx_runtime_1.jsx)(form_1.FormMessage, {}), description && (0, jsx_runtime_1.jsx)(form_1.FormDescription, { children: description })] }));
+        } }));
+};
+exports.DatePickerField = DatePickerField;

package/dist/components/form/date-range-field/index.d.ts

@@ -0,0 +1,20 @@
+import { ReactNode } from 'react';
+import { Control, FieldValues, Path } from 'react-hook-form';
+export type DateRangeFieldProps<T extends FieldValues = FieldValues> = {
+    name: Path<T>;
+    label?: ReactNode;
+    tooltip?: string;
+    labelExtra?: ReactNode;
+    description?: ReactNode;
+    placeholder?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    control: Control<T>;
+    required?: boolean;
+    numberOfMonths?: number;
+    dateFormat?: string;
+    align?: 'start' | 'center' | 'end';
+    'data-testid'?: string;
+};
+export declare const DateRangeField: <T extends FieldValues = FieldValues>({ name, label, tooltip, labelExtra, description, placeholder, disabled, readOnly, control, required, numberOfMonths, dateFormat, align, ...others }: DateRangeFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/form/date-range-field/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/date-range-field/index.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAA;AAE5D,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI;IACrE,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAA;IACb,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IAClC,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAED,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,qJAejE,mBAAmB,CAAC,CAAC,CAAC,4CAoExB,CAAA"}

package/dist/components/form/date-range-field/index.js

@@ -0,0 +1,22 @@
+'use client';
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DateRangeField = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const button_1 = require("../../../components/ui/button");
+const calendar_1 = require("../../../components/ui/calendar");
+const form_1 = require("../../../components/ui/form");
+const popover_1 = require("../../../components/ui/popover");
+const utils_1 = require("../../../lib/utils");
+const dayjs_1 = __importDefault(require("dayjs"));
+const lucide_react_1 = require("lucide-react");
+const DateRangeField = ({ name, label, tooltip, labelExtra, description, placeholder, disabled, readOnly, control, required, numberOfMonths = 2, dateFormat = 'MMM DD, YYYY', align = 'start', ...others }) => {
+    return ((0, jsx_runtime_1.jsx)(form_1.FormField, { name: name, control: control, render: ({ field }) => {
+            const value = field.value;
+            return ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [label && ((0, jsx_runtime_1.jsx)(form_1.FormLabel, { extra: tooltip ? (0, jsx_runtime_1.jsx)(form_1.FormTooltip, { children: tooltip }) : labelExtra, children: label })), (0, jsx_runtime_1.jsxs)(popover_1.Popover, { children: [(0, jsx_runtime_1.jsx)(popover_1.PopoverTrigger, { asChild: true, children: (0, jsx_runtime_1.jsx)(form_1.FormControl, { children: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outline", disabled: disabled, className: (0, utils_1.cn)('border-button-border w-full justify-start px-2.5 font-normal', !value && 'text-muted-foreground', readOnly && 'pointer-events-none'), "data-testid": others['data-testid'], icon: (0, jsx_runtime_1.jsx)(lucide_react_1.CalendarIcon, { className: "size-4" }), children: value?.from ? (value.to ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, dayjs_1.default)(value.from).format(dateFormat), " -", ' ', (0, dayjs_1.default)(value.to).format(dateFormat)] })) : ((0, dayjs_1.default)(value.from).format(dateFormat))) : ((0, jsx_runtime_1.jsx)("span", { children: placeholder })) }) }) }), (0, jsx_runtime_1.jsx)(popover_1.PopoverContent, { className: "w-auto p-0", align: align, children: (0, jsx_runtime_1.jsx)(calendar_1.Calendar, { mode: "range", defaultMonth: value?.from, selected: value, onSelect: field.onChange, numberOfMonths: numberOfMonths, disabled: disabled || readOnly }) })] }), (0, jsx_runtime_1.jsx)(form_1.FormMessage, {}), description && (0, jsx_runtime_1.jsx)(form_1.FormDescription, { children: description })] }));
+        } }));
+};
+exports.DateRangeField = DateRangeField;

package/dist/components/form/index.d.ts

@@ -5,4 +5,7 @@ export * from './pagination-limit-field';
 export * from './combo-box-field';
 export * from './country-field';
 export * from './state-field';
+export * from './date-range-field';
+export * from './date-picker-field';
+export * from './password-field';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/form/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/form/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,0BAA0B,CAAA;AACxC,cAAc,mBAAmB,CAAA;AACjC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,eAAe,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/form/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,0BAA0B,CAAA;AACxC,cAAc,mBAAmB,CAAA;AACjC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,eAAe,CAAA;AAC7B,cAAc,oBAAoB,CAAA;AAClC,cAAc,qBAAqB,CAAA;AACnC,cAAc,kBAAkB,CAAA"}

package/dist/components/form/index.js

@@ -21,3 +21,6 @@ __exportStar(require("./pagination-limit-field"), exports);
 __exportStar(require("./combo-box-field"), exports);
 __exportStar(require("./country-field"), exports);
 __exportStar(require("./state-field"), exports);
+__exportStar(require("./date-range-field"), exports);
+__exportStar(require("./date-picker-field"), exports);
+__exportStar(require("./password-field"), exports);

package/dist/components/form/input-field/index.d.ts

@@ -1,8 +1,8 @@
 import { HTMLInputTypeAttribute, ReactNode } from 'react';
-import { Control } from 'react-hook-form';
-export type InputFieldProps = {
+import { Control, FieldValues, Path } from 'react-hook-form';
+export type InputFieldProps<T extends FieldValues = FieldValues> = {
     className?: string;
-    name: string;
+    name: Path<T>;
     type?: HTMLInputTypeAttribute;
     label?: ReactNode;
     tooltip?: string;
@@ -11,7 +11,7 @@ export type InputFieldProps = {
     description?: ReactNode;
     startAdornment?: ReactNode;
     endAdornment?: ReactNode;
-    control: Control<any>;
+    control: Control<T>;
     disabled?: boolean;
     readOnly?: boolean;
     minHeight?: number;
@@ -19,7 +19,8 @@ export type InputFieldProps = {
     textArea?: boolean;
     required?: boolean;
     defaultValue?: string;
+    'data-testid'?: string;
     onChange?: (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
 };
-export declare const InputField: ({ className, type, label, tooltip, labelExtra, placeholder, description, startAdornment, endAdornment, required, readOnly, minHeight, maxHeight, textArea, defaultValue, onChange, ...others }: InputFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const InputField: <T extends FieldValues = FieldValues>({ className, type, label, tooltip, labelExtra, placeholder, description, startAdornment, endAdornment, required, readOnly, minHeight, maxHeight, textArea, defaultValue, onChange, ...others }: InputFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/form/input-field/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/input-field/index.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,sBAAsB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AAEzC,MAAM,MAAM,eAAe,GAAG;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,sBAAsB,CAAA;IAC7B,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,cAAc,CAAC,EAAE,SAAS,CAAA;IAC1B,YAAY,CAAC,EAAE,SAAS,CAAA;IACxB,OAAO,EAAE,OAAO,CAAC,GAAG,CAAC,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,CACT,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KACzD,IAAI,CAAA;CACV,CAAA;AACD,eAAO,MAAM,UAAU,GAAI,gMAkBxB,eAAe,4CAgDjB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/input-field/index.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,sBAAsB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAA;AAE5D,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI;IACjE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAA;IACb,IAAI,CAAC,EAAE,sBAAsB,CAAA;IAC7B,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,cAAc,CAAC,EAAE,SAAS,CAAA;IAC1B,YAAY,CAAC,EAAE,SAAS,CAAA;IACxB,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,CACT,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,GAAG,mBAAmB,CAAC,KACzD,IAAI,CAAA;CACV,CAAA;AACD,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,gMAkB7D,eAAe,CAAC,CAAC,CAAC,4CAkDpB,CAAA"}

package/dist/components/form/input-field/index.js

@@ -6,9 +6,9 @@ const autosize_textarea_1 = require("../../../components/ui/autosize-textarea");
 const form_1 = require("../../../components/ui/form");
 const input_1 = require("../../../components/ui/input");
 const InputField = ({ className, type, label, tooltip, labelExtra, placeholder, description, startAdornment, endAdornment, required, readOnly, minHeight, maxHeight, textArea, defaultValue, onChange, ...others }) => {
-    return ((0, jsx_runtime_1.jsx)(form_1.FormField, { ...others, render: ({ field }) => ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [label && ((0, jsx_runtime_1.jsx)(form_1.FormLabel, { extra: tooltip ? (0, jsx_runtime_1.jsx)(form_1.FormTooltip, { children: tooltip }) : labelExtra, children: label })), (0, jsx_runtime_1.jsx)(form_1.FormControl, { children: textArea ? ((0, jsx_runtime_1.jsx)(autosize_textarea_1.AutosizeTextarea, { className: className, placeholder: placeholder, readOnly: readOnly, minHeight: minHeight, maxHeight: maxHeight, defaultValue: defaultValue, ...field, onChange: (e) => {
+    return ((0, jsx_runtime_1.jsx)(form_1.FormField, { ...others, render: ({ field }) => ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [label && ((0, jsx_runtime_1.jsx)(form_1.FormLabel, { extra: tooltip ? (0, jsx_runtime_1.jsx)(form_1.FormTooltip, { children: tooltip }) : labelExtra, children: label })), (0, jsx_runtime_1.jsx)(form_1.FormControl, { children: textArea ? ((0, jsx_runtime_1.jsx)(autosize_textarea_1.AutosizeTextarea, { className: className, placeholder: placeholder, readOnly: readOnly, minHeight: minHeight, maxHeight: maxHeight, defaultValue: defaultValue, "data-testid": others['data-testid'], ...field, onChange: (e) => {
                             field.onChange(e);
                             onChange?.(e);
-                        } })) : ((0, jsx_runtime_1.jsx)(input_1.Input, { className: className, type: type, placeholder: placeholder, readOnly: readOnly, startAdornment: startAdornment, endAdornment: endAdornment, ...field })) }), (0, jsx_runtime_1.jsx)(form_1.FormMessage, {}), description && (0, jsx_runtime_1.jsx)(form_1.FormDescription, { children: description })] })) }));
+                        } })) : ((0, jsx_runtime_1.jsx)(input_1.Input, { className: className, type: type, placeholder: placeholder, readOnly: readOnly, startAdornment: startAdornment, endAdornment: endAdornment, "data-testid": others['data-testid'], ...field })) }), (0, jsx_runtime_1.jsx)(form_1.FormMessage, {}), description && (0, jsx_runtime_1.jsx)(form_1.FormDescription, { children: description })] })) }));
 };
 exports.InputField = InputField;

package/dist/components/form/pagination-limit-field/index.d.ts

@@ -1,8 +1,9 @@
-import { Control } from 'react-hook-form';
-export type PaginationLimitFieldProps = {
+import { Control, FieldValues } from 'react-hook-form';
+export type PaginationLimitFieldProps<T extends FieldValues = FieldValues> = {
     label?: string;
     options?: number[];
-    control: Control<any>;
+    control: Control<T>;
+    ['data-testid']?: string;
 };
-export declare const PaginationLimitField: ({ options, label, control }: PaginationLimitFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const PaginationLimitField: <T extends FieldValues = FieldValues>({ options, label, control, ["data-testid"]: dataTestId }: PaginationLimitFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/form/pagination-limit-field/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/pagination-limit-field/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AAIzC,MAAM,MAAM,yBAAyB,GAAG;IACtC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,OAAO,EAAE,OAAO,CAAC,GAAG,CAAC,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,oBAAoB,GAAI,6BAIlC,yBAAyB,4CAe3B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/pagination-limit-field/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,WAAW,EAAQ,MAAM,iBAAiB,CAAA;AAI5D,MAAM,MAAM,yBAAyB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAAI;IAC3E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;IACnB,CAAC,aAAa,CAAC,CAAC,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,oBAAoB,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,0DAKvE,yBAAyB,CAAC,CAAC,CAAC,4CAe9B,CAAA"}

package/dist/components/form/pagination-limit-field/index.js

@@ -4,7 +4,7 @@ exports.PaginationLimitField = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const select_field_1 = require("../select-field");
 const select_1 = require("../../../components/ui/select");
-const PaginationLimitField = ({ options = [10, 50, 100], label = 'Items per page', control }) => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-sm font-medium whitespace-nowrap text-gray-600", children: label }), (0, jsx_runtime_1.jsx)(select_field_1.SelectField, { name: "limit", control: control, children: options.map((pageSize) => ((0, jsx_runtime_1.jsx)(select_1.SelectItem, { value: String(pageSize), children: pageSize }, pageSize))) })] }));
+const PaginationLimitField = ({ options = [10, 50, 100], label = 'Items per page', control, ['data-testid']: dataTestId }) => {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-muted-foreground whitespace-nowrap text-sm font-medium", children: label }), (0, jsx_runtime_1.jsx)(select_field_1.SelectField, { name: "limit", control: control, "data-testid": dataTestId, children: options.map((pageSize) => ((0, jsx_runtime_1.jsx)(select_1.SelectItem, { value: String(pageSize), children: pageSize }, pageSize))) })] }));
 };
 exports.PaginationLimitField = PaginationLimitField;

package/dist/components/form/password-field/index.d.ts

@@ -7,6 +7,7 @@ export type PasswordFieldProps<TFieldValues extends FieldValues = FieldValues, T
     control: Control<TFieldValues>;
     required?: boolean;
     disabled?: boolean;
+    'data-testid'?: string;
 };
-export declare function PasswordField<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ name, label, tooltip, placeholder, control, required, disabled }: PasswordFieldProps<TFieldValues, TName>): import("react/jsx-runtime").JSX.Element;
+export declare function PasswordField<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ name, label, tooltip, placeholder, control, required, disabled, 'data-testid': dataTestId }: PasswordFieldProps<TFieldValues, TName>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/form/password-field/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/password-field/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAajE,MAAM,MAAM,kBAAkB,CAC5B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,IAC7D;IACF,IAAI,EAAE,KAAK,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,OAAO,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,wBAAgB,aAAa,CAC3B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAC/D,EACA,IAAI,EACJ,KAAK,EACL,OAAO,EACP,WAAW,EACX,OAAO,EACP,QAAgB,EAChB,QAAgB,EACjB,EAAE,kBAAkB,CAAC,YAAY,EAAE,KAAK,CAAC,2CAwCzC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/password-field/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAajE,MAAM,MAAM,kBAAkB,CAC5B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,IAC7D;IACF,IAAI,EAAE,KAAK,CAAA;IACX,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,OAAO,EAAE,OAAO,CAAC,YAAY,CAAC,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAED,wBAAgB,aAAa,CAC3B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,KAAK,SAAS,SAAS,CAAC,YAAY,CAAC,GAAG,SAAS,CAAC,YAAY,CAAC,EAC/D,EACA,IAAI,EACJ,KAAK,EACL,OAAO,EACP,WAAW,EACX,OAAO,EACP,QAAgB,EAChB,QAAgB,EAChB,aAAa,EAAE,UAAU,EAC1B,EAAE,kBAAkB,CAAC,YAAY,EAAE,KAAK,CAAC,2CA0CzC"}

package/dist/components/form/password-field/index.js

@@ -10,7 +10,7 @@ const form_1 = require("../../../components/ui/form");
 const input_1 = require("../../../components/ui/input");
 const lucide_react_1 = require("lucide-react");
 const icon_button_1 = require("../../../components/ui/icon-button");
-function PasswordField({ name, label, tooltip, placeholder, control, required = false, disabled = false }) {
+function PasswordField({ name, label, tooltip, placeholder, control, required = false, disabled = false, 'data-testid': dataTestId }) {
     const [show, setShow] = react_1.default.useState(false);
-    return ((0, jsx_runtime_1.jsx)(form_1.FormField, { control: control, name: name, render: ({ field }) => ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [(0, jsx_runtime_1.jsx)(form_1.FormLabel, { extra: tooltip ? (0, jsx_runtime_1.jsx)(form_1.FormTooltip, { children: tooltip }) : undefined, children: label }), (0, jsx_runtime_1.jsx)(form_1.FormControl, { children: (0, jsx_runtime_1.jsx)(input_1.Input, { ...field, type: show ? 'text' : 'password', placeholder: placeholder, endAdornment: (0, jsx_runtime_1.jsx)(input_1.InputAdornment, { position: "end", children: (0, jsx_runtime_1.jsx)(icon_button_1.IconButton, { variant: "outline", rounded: true, onClick: () => setShow(!show), children: show ? (0, jsx_runtime_1.jsx)(lucide_react_1.EyeOff, {}) : (0, jsx_runtime_1.jsx)(lucide_react_1.Eye, {}) }) }), disabled: disabled, className: "pr-10" }) }), (0, jsx_runtime_1.jsx)(form_1.FormMessage, {})] })) }));
+    return ((0, jsx_runtime_1.jsx)(form_1.FormField, { control: control, name: name, render: ({ field }) => ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [(0, jsx_runtime_1.jsx)(form_1.FormLabel, { extra: tooltip ? (0, jsx_runtime_1.jsx)(form_1.FormTooltip, { children: tooltip }) : undefined, children: label }), (0, jsx_runtime_1.jsx)(form_1.FormControl, { children: (0, jsx_runtime_1.jsx)(input_1.Input, { ...field, type: show ? 'text' : 'password', placeholder: placeholder, endAdornment: (0, jsx_runtime_1.jsx)(input_1.InputAdornment, { position: "end", children: (0, jsx_runtime_1.jsx)(icon_button_1.IconButton, { type: "button", variant: "outline", rounded: true, onClick: () => setShow(!show), children: show ? (0, jsx_runtime_1.jsx)(lucide_react_1.EyeOff, {}) : (0, jsx_runtime_1.jsx)(lucide_react_1.Eye, {}) }) }), disabled: disabled, className: "pr-10", "data-testid": dataTestId }) }), (0, jsx_runtime_1.jsx)(form_1.FormMessage, {})] })) }));
 }

package/dist/components/form/select-field/index.d.ts

@@ -1,7 +1,7 @@
 import React, { PropsWithChildren, ReactNode } from 'react';
-import { Control } from 'react-hook-form';
-export type SelectFieldProps = PropsWithChildren & {
-    name: string;
+import { Control, FieldValues, Path } from 'react-hook-form';
+export type SelectFieldProps<T extends FieldValues = FieldValues> = PropsWithChildren & {
+    name: Path<T>;
     label?: ReactNode;
     tooltip?: string;
     labelExtra?: React.ReactNode;
@@ -9,10 +9,12 @@ export type SelectFieldProps = PropsWithChildren & {
     placeholder?: string;
     disabled?: boolean;
     readOnly?: boolean;
-    control: Control<any>;
+    control: Control<T>;
     multi?: boolean;
     required?: boolean;
     emptyMessage?: string;
+    onChange?: (value: string | string[]) => void;
+    'data-testid'?: string;
 };
-export declare const SelectField: ({ name, label, tooltip, labelExtra, required, placeholder, description, disabled, readOnly, multi, control, children, emptyMessage, ...others }: SelectFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectField: <T extends FieldValues = FieldValues>({ name, label, tooltip, labelExtra, required, placeholder, description, disabled, readOnly, multi, control, children, emptyMessage, onChange, ...others }: SelectFieldProps<T>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/form/select-field/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/select-field/index.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAA;AAEzC,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,GAAG;IACjD,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,OAAO,CAAC,GAAG,CAAC,CAAA;IACrB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,WAAW,GAAI,iJAezB,gBAAgB,4CA4DlB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/select-field/index.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAC3D,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAA;AAE5D,MAAM,MAAM,gBAAgB,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,IAC9D,iBAAiB,GAAG;IAClB,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,CAAA;IACb,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC5B,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;IACnB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAA;IAC7C,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAEH,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,2JAgB9D,gBAAgB,CAAC,CAAC,CAAC,4CAmErB,CAAA"}

package/dist/components/form/select-field/index.js

@@ -6,9 +6,15 @@ const form_1 = require("../../../components/ui/form");
 const multiple_select_1 = require("../../../components/ui/multiple-select");
 const select_1 = require("../../../components/ui/select");
 const utils_1 = require("../../../lib/utils");
-const SelectField = ({ name, label, tooltip, labelExtra, required, placeholder, description, disabled, readOnly, multi, control, children, emptyMessage = 'No options found.', ...others }) => {
+const SelectField = ({ name, label, tooltip, labelExtra, required, placeholder, description, disabled, readOnly, multi, control, children, emptyMessage = 'No options found.', onChange, ...others }) => {
     return ((0, jsx_runtime_1.jsx)(form_1.FormField, { name: name, control: control, ...others, render: ({ field }) => {
-            return ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [label && ((0, jsx_runtime_1.jsx)(form_1.FormLabel, { extra: tooltip ? (0, jsx_runtime_1.jsx)(form_1.FormTooltip, { children: tooltip }) : labelExtra, children: label })), multi ? ((0, jsx_runtime_1.jsxs)(multiple_select_1.MultipleSelect, { onValueChange: field.onChange, disabled: disabled, ...field, children: [(0, jsx_runtime_1.jsx)(multiple_select_1.MultipleSelectTrigger, { readOnly: readOnly, children: (0, jsx_runtime_1.jsx)(multiple_select_1.MultipleSelectValue, { placeholder: placeholder }) }), (0, jsx_runtime_1.jsx)(multiple_select_1.MultipleSelectContent, { children: children })] })) : ((0, jsx_runtime_1.jsxs)(select_1.Select, { onValueChange: field.onChange, value: field.value, disabled: disabled, open: readOnly ? false : undefined, onOpenChange: readOnly ? () => { } : undefined, children: [(0, jsx_runtime_1.jsx)(form_1.FormControl, { children: (0, jsx_runtime_1.jsx)(select_1.SelectTrigger, { className: (0, utils_1.cn)(disabled && 'bg-shadcn-100'), readOnly: readOnly, children: (0, jsx_runtime_1.jsx)(select_1.SelectValue, { placeholder: placeholder }) }) }), (0, jsx_runtime_1.jsxs)(select_1.SelectContent, { children: [(0, jsx_runtime_1.jsx)(select_1.SelectEmpty, { children: emptyMessage }), children] })] })), (0, jsx_runtime_1.jsx)(form_1.FormMessage, {}), description && (0, jsx_runtime_1.jsx)(form_1.FormDescription, { children: description })] }));
+            return ((0, jsx_runtime_1.jsxs)(form_1.FormItem, { required: required, children: [label && ((0, jsx_runtime_1.jsx)(form_1.FormLabel, { extra: tooltip ? (0, jsx_runtime_1.jsx)(form_1.FormTooltip, { children: tooltip }) : labelExtra, children: label })), multi ? ((0, jsx_runtime_1.jsxs)(multiple_select_1.MultipleSelect, { onValueChange: (value) => {
+                            field.onChange(value);
+                            onChange?.(value);
+                        }, disabled: disabled, ...field, children: [(0, jsx_runtime_1.jsx)(multiple_select_1.MultipleSelectTrigger, { readOnly: readOnly, children: (0, jsx_runtime_1.jsx)(multiple_select_1.MultipleSelectValue, { placeholder: placeholder }) }), (0, jsx_runtime_1.jsx)(multiple_select_1.MultipleSelectContent, { children: children })] })) : ((0, jsx_runtime_1.jsxs)(select_1.Select, { onValueChange: (value) => {
+                            field.onChange(value);
+                            onChange?.(value);
+                        }, value: field.value, disabled: disabled, open: readOnly ? false : undefined, onOpenChange: readOnly ? () => { } : undefined, children: [(0, jsx_runtime_1.jsx)(form_1.FormControl, { children: (0, jsx_runtime_1.jsx)(select_1.SelectTrigger, { className: (0, utils_1.cn)(disabled && 'bg-shadcn-100'), readOnly: readOnly, "data-testid": others['data-testid'], children: (0, jsx_runtime_1.jsx)(select_1.SelectValue, { placeholder: placeholder }) }) }), (0, jsx_runtime_1.jsxs)(select_1.SelectContent, { children: [(0, jsx_runtime_1.jsx)(select_1.SelectEmpty, { children: emptyMessage }), children] })] })), (0, jsx_runtime_1.jsx)(form_1.FormMessage, {}), description && (0, jsx_runtime_1.jsx)(form_1.FormDescription, { children: description })] }));
         } }));
 };
 exports.SelectField = SelectField;

package/dist/components/form/state-field/index.js

@@ -31,7 +31,7 @@ function StateComboBox({ value, placeholder, onChange, countryName, emptyMessage
     const getDisplayValue = react_1.default.useCallback((value) => {
         return options.find((option) => option.value === value)?.label ?? null;
     }, [options]);
-    return ((0, jsx_runtime_1.jsxs)(popover_1.Popover, { open: readOnly ? false : open, onOpenChange: readOnly ? () => { } : setOpen, children: [(0, jsx_runtime_1.jsx)(popover_1.PopoverTrigger, { asChild: true, children: (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "outline", role: "combobox", "aria-expanded": readOnly ? false : open, readOnly: readOnly, tabIndex: 0, className: (0, utils_1.cn)('w-full justify-between', !value && 'text-muted-foreground'), children: [getDisplayValue(value) ?? placeholder, !readOnly && ((0, jsx_runtime_1.jsx)(lucide_react_1.ChevronsUpDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" }))] }) }), (0, jsx_runtime_1.jsx)(popover_1.PopoverContent, { className: "w-(--radix-popover-trigger-width) p-0", children: (0, jsx_runtime_1.jsxs)(command_1.Command, { children: [(0, jsx_runtime_1.jsx)(command_1.CommandInput, { placeholder: placeholder }), (0, jsx_runtime_1.jsxs)(command_1.CommandList, { children: [(0, jsx_runtime_1.jsx)(command_1.CommandEmpty, { children: emptyMessage }), (0, jsx_runtime_1.jsx)(command_1.CommandGroup, { children: options.map((option) => ((0, jsx_runtime_1.jsx)(command_1.CommandItem, { value: option.value, keywords: [option.label], onSelect: (currentValue) => {
+    return ((0, jsx_runtime_1.jsxs)(popover_1.Popover, { open: readOnly ? false : open, onOpenChange: readOnly ? () => { } : setOpen, children: [(0, jsx_runtime_1.jsx)(popover_1.PopoverTrigger, { asChild: true, children: (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "outline", role: "combobox", "aria-expanded": readOnly ? false : open, readOnly: readOnly, tabIndex: 0, className: (0, utils_1.cn)('border-border bg-input hover:bg-input h-10 w-full justify-between rounded-md border px-4 py-2 pl-6 text-left text-sm font-normal focus:outline-none focus:ring-2 focus:ring-offset-0', !value && 'text-muted-foreground'), children: [getDisplayValue(value) ?? placeholder, !readOnly && ((0, jsx_runtime_1.jsx)(lucide_react_1.ChevronsUpDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" }))] }) }), (0, jsx_runtime_1.jsx)(popover_1.PopoverContent, { className: "w-(--radix-popover-trigger-width) p-0", children: (0, jsx_runtime_1.jsxs)(command_1.Command, { children: [(0, jsx_runtime_1.jsx)(command_1.CommandInput, { placeholder: placeholder }), (0, jsx_runtime_1.jsxs)(command_1.CommandList, { children: [(0, jsx_runtime_1.jsx)(command_1.CommandEmpty, { children: emptyMessage }), (0, jsx_runtime_1.jsx)(command_1.CommandGroup, { children: options.map((option) => ((0, jsx_runtime_1.jsx)(command_1.CommandItem, { value: option.value, keywords: [option.label], onSelect: (currentValue) => {
                                             onChange?.(value !== currentValue ? currentValue : '');
                                             setOpen(false);
                                         }, children: option.label }, option.value))) })] })] }) })] }));