@yuno-payments/dashboard-design-system 0.0.166 → 0.0.170
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/atoms/access-denied-alert/access-denied-alert.d.ts +0 -16
- package/dist/components/atoms/accordion/accordion.d.ts +0 -66
- package/dist/components/atoms/alert/alert.d.ts +1 -26
- package/dist/components/atoms/alert/alert.js +8 -9
- package/dist/components/atoms/avatar/avatar-group.d.ts +0 -28
- package/dist/components/atoms/avatar/avatar.d.ts +0 -25
- package/dist/components/atoms/avatar/avatar.js +9 -9
- package/dist/components/atoms/badge/badge.d.ts +2 -30
- package/dist/components/atoms/badge/badge.js +11 -27
- package/dist/components/atoms/button/button.d.ts +0 -44
- package/dist/components/atoms/card/card.d.ts +3 -137
- package/dist/components/atoms/card/card.js +28 -56
- package/dist/components/atoms/checkbox/checkbox.d.ts +2 -38
- package/dist/components/atoms/checkbox/checkbox.js +27 -61
- package/dist/components/atoms/combobox/combobox.d.ts +0 -18
- package/dist/components/atoms/combobox/combobox.js +41 -41
- package/dist/components/atoms/combobox/types.d.ts +1 -90
- package/dist/components/atoms/currency-field/currency-field.d.ts +0 -38
- package/dist/components/atoms/currency-field/currency-field.js +19 -22
- package/dist/components/atoms/date-picker/date-picker.d.ts +0 -15
- package/dist/components/atoms/date-range-picker/date-range-picker.d.ts +0 -15
- package/dist/components/atoms/dots-menu/dots-menu.d.ts +0 -16
- package/dist/components/atoms/dots-menu/dots-menu.js +8 -8
- package/dist/components/atoms/dots-menu/dots-menu.types.d.ts +0 -52
- package/dist/components/atoms/dropdown-menu/dropdown-menu.d.ts +0 -50
- package/dist/components/atoms/field/field.d.ts +0 -55
- package/dist/components/atoms/field/field.js +46 -53
- package/dist/components/atoms/filter/filter-date-range.d.ts +2 -12
- package/dist/components/atoms/filter/filter-date-range.js +168 -203
- package/dist/components/atoms/filter/filter.d.ts +0 -6
- package/dist/components/atoms/filter/filter.js +76 -91
- package/dist/components/atoms/filter/index.d.ts +1 -1
- package/dist/components/atoms/filter-dropdown/filter-dropdown.d.ts +2 -208
- package/dist/components/atoms/filter-dropdown/filter-dropdown.js +160 -214
- package/dist/components/atoms/icon/icon-list.d.ts +0 -5
- package/dist/components/atoms/icon/icon-list.js +384 -394
- package/dist/components/atoms/icon/icon.d.ts +0 -29
- package/dist/components/atoms/index.d.ts +2 -3
- package/dist/components/atoms/label/index.d.ts +1 -1
- package/dist/components/atoms/link/link.d.ts +0 -20
- package/dist/components/atoms/multi-select/multi-select.d.ts +1 -1
- package/dist/components/atoms/multi-select/multi-select.js +6 -6
- package/dist/components/atoms/multi-values-field/multi-values-field.d.ts +0 -16
- package/dist/components/atoms/multi-values-field/multi-values-field.js +87 -109
- package/dist/components/atoms/multi-values-field/multi-values-field.types.d.ts +0 -81
- package/dist/components/atoms/otp-field/otp-field.d.ts +0 -32
- package/dist/components/atoms/password-field/password-field.d.ts +0 -23
- package/dist/components/atoms/password-field/password-field.js +1 -1
- package/dist/components/atoms/progress/progress.d.ts +0 -15
- package/dist/components/atoms/protected-field/protected-field.d.ts +0 -10
- package/dist/components/atoms/protected-field/protected-field.types.d.ts +0 -14
- package/dist/components/atoms/radio-group/radio-group-option.js +11 -11
- package/dist/components/atoms/radio-group/radio-group.d.ts +1 -50
- package/dist/components/atoms/radio-group/radio-group.js +12 -13
- package/dist/components/atoms/search-field/search-field.d.ts +0 -14
- package/dist/components/atoms/search-field/search-field.js +17 -17
- package/dist/components/atoms/search-field/search-field.types.d.ts +0 -57
- package/dist/components/atoms/select/index.d.ts +0 -2
- package/dist/components/atoms/select/select.d.ts +1 -83
- package/dist/components/atoms/select/select.js +21 -21
- package/dist/components/atoms/separator/separator.d.ts +0 -17
- package/dist/components/atoms/skeleton/index.d.ts +0 -9
- package/dist/components/atoms/switch/switch.d.ts +2 -56
- package/dist/components/atoms/switch/switch.js +32 -64
- package/dist/components/atoms/tabs/index.d.ts +0 -16
- package/dist/components/atoms/textarea/textarea.d.ts +0 -32
- package/dist/components/atoms/textarea/textarea.js +1 -1
- package/dist/components/atoms/time-picker/time-picker.d.ts +2 -73
- package/dist/components/atoms/time-picker/time-picker.js +3 -218
- package/dist/components/atoms/toaster/index.d.ts +0 -15
- package/dist/components/atoms/toggle-group/toggle-group.d.ts +1 -26
- package/dist/components/atoms/toggle-group/toggle-group.js +14 -15
- package/dist/components/atoms/tooltip/tooltip.d.ts +2 -53
- package/dist/components/atoms/typography/typography.d.ts +0 -18
- package/dist/components/molecules/breadcrumb/breadcrumb.d.ts +0 -50
- package/dist/components/molecules/breadcrumb/breadcrumb.js +17 -17
- package/dist/components/molecules/dialog-content/dialog-content.d.ts +0 -16
- package/dist/components/molecules/dialog-footer/dialog-footer.d.ts +0 -20
- package/dist/components/molecules/dialog-header/dialog-header.d.ts +0 -31
- package/dist/components/molecules/empty/empty-icon.js +6 -6
- package/dist/components/molecules/empty/empty.d.ts +1 -16
- package/dist/components/molecules/empty/empty.js +34 -37
- package/dist/components/molecules/highlight-banner/highlight-banner.d.ts +0 -17
- package/dist/components/molecules/pagination/pagination.d.ts +0 -49
- package/dist/components/organisms/data-table/components/cells/data-table-list-cell.d.ts +0 -41
- package/dist/components/organisms/data-table/components/column-header/data-table-column-header-content.js +1 -1
- package/dist/components/organisms/data-table/components/column-header/data-table-column-header-menu.js +18 -18
- package/dist/components/organisms/data-table/components/column-header/data-table-column-header.d.ts +0 -18
- package/dist/components/organisms/data-table/components/column-header/data-table-column-header.js +10 -10
- package/dist/components/organisms/data-table/components/data-table-body.d.ts +0 -18
- package/dist/components/organisms/data-table/components/data-table-header.d.ts +0 -12
- package/dist/components/organisms/data-table/components/data-table-header.js +7 -7
- package/dist/components/organisms/data-table/components/states/data-table-loading.d.ts +0 -24
- package/dist/components/organisms/data-table/components/states/data-table-loading.js +6 -6
- package/dist/components/organisms/data-table/data-table.d.ts +3 -115
- package/dist/components/organisms/data-table/data-table.js +104 -131
- package/dist/components/organisms/data-table/data-table.types.d.ts +24 -23
- package/dist/components/organisms/data-table/hooks/use-data-table-columns.js +41 -57
- package/dist/components/organisms/data-table/hooks/use-data-table-state.d.ts +2 -7
- package/dist/components/organisms/data-table/hooks/use-data-table-state.js +46 -80
- package/dist/components/organisms/data-table/utils/data-table-constants.d.ts +2 -8
- package/dist/components/organisms/data-table/utils/data-table-constants.js +10 -16
- package/dist/components/organisms/data-table/utils/data-table-styles.d.ts +0 -1652
- package/dist/components/organisms/data-table/utils/data-table-styles.js +14 -29
- package/dist/components/organisms/dialog/dialog.d.ts +1 -67
- package/dist/components/organisms/dialog/dialog.js +61 -78
- package/dist/components/organisms/index.d.ts +0 -2
- package/dist/components/organisms/sheet/sheet.d.ts +0 -69
- package/dist/components/organisms/sheet/sheet.js +33 -34
- package/dist/index.css +1 -1
- package/dist/index.d.ts +0 -2
- package/dist/index.js +162 -173
- package/dist/vendor/shadcn/avatar.js +19 -19
- package/dist/vendor/shadcn/badge.js +15 -15
- package/dist/vendor/shadcn/card.js +7 -7
- package/dist/vendor/shadcn/date-picker.d.ts +2 -2
- package/dist/vendor/shadcn/date-picker.js +1 -1
- package/dist/vendor/shadcn/date-range-picker.d.ts +2 -2
- package/dist/vendor/shadcn/date-range-picker.js +1 -1
- package/dist/vendor/shadcn/dialog.js +2 -2
- package/dist/vendor/shadcn/input-group.js +17 -17
- package/dist/vendor/shadcn/input.js +7 -7
- package/dist/vendor/shadcn/popover.js +1 -1
- package/dist/vendor/shadcn/select.js +2 -2
- package/dist/vendor/shadcn/sonner.d.ts +1 -26
- package/dist/vendor/shadcn/sonner.js +8 -12
- package/dist/vendor/shadcn/table.js +30 -30
- package/dist/vendor/shadcn/textarea.js +9 -9
- package/dist/vendor/shadcn/time-picker.d.ts +2 -1
- package/dist/vendor/shadcn/time-picker.js +23 -17
- package/dist/vendor/shadcn/toggle.js +13 -13
- package/dist/vendor/shadcn/tooltip.js +15 -25
- package/package.json +1 -1
- package/dist/components/atoms/icon/aida-logo.d.ts +0 -3
- package/dist/components/atoms/icon/aida-logo.js +0 -64
- package/dist/components/atoms/label/label.d.ts +0 -11
- package/dist/components/atoms/label/label.js +0 -28
- package/dist/components/atoms/loading/index.d.ts +0 -1
- package/dist/components/atoms/loading/loading.d.ts +0 -39
- package/dist/components/atoms/loading/loading.js +0 -37
- package/dist/components/atoms/select/search-select.d.ts +0 -22
- package/dist/components/atoms/select/search-select.js +0 -201
- package/dist/components/organisms/tutorial/index.d.ts +0 -2
- package/dist/components/organisms/tutorial/tutorial.d.ts +0 -16
- package/dist/components/organisms/tutorial/tutorial.js +0 -114
- package/dist/components/organisms/tutorial/tutorial.types.d.ts +0 -15
- package/dist/hooks/index.d.ts +0 -3
- package/dist/hooks/use-body-scroll-lock.d.ts +0 -13
- package/dist/hooks/use-escape-key.d.ts +0 -14
- package/dist/hooks/use-media-query.d.ts +0 -20
- package/dist/hooks/use-media-query.js +0 -21
- package/dist/lib/notification-alert.d.ts +0 -42
- package/dist/lib/notification-alert.js +0 -75
- package/dist/node_modules/@phosphor-icons/react/dist/csr/File.es.js +0 -8
- package/dist/node_modules/@phosphor-icons/react/dist/csr/Microphone.es.js +0 -8
- package/dist/node_modules/@phosphor-icons/react/dist/csr/Stop.es.js +0 -8
- package/dist/node_modules/@phosphor-icons/react/dist/csr/Table.es.js +0 -8
- package/dist/node_modules/@phosphor-icons/react/dist/defs/File.es.js +0 -30
- package/dist/node_modules/@phosphor-icons/react/dist/defs/Microphone.es.js +0 -36
- package/dist/node_modules/@phosphor-icons/react/dist/defs/Stop.es.js +0 -36
- package/dist/node_modules/@phosphor-icons/react/dist/defs/Table.es.js +0 -30
|
@@ -5,41 +5,12 @@ import { TooltipProps } from '../tooltip/tooltip';
|
|
|
5
5
|
declare const iconVariants: (props?: ({
|
|
6
6
|
size?: "xs" | "sm" | "md" | "lg" | "xl" | null | undefined;
|
|
7
7
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
8
|
-
/**
|
|
9
|
-
* Props for the Icon component
|
|
10
|
-
*/
|
|
11
8
|
interface IconProps extends Omit<PhosphorIconProps, "size">, VariantProps<typeof iconVariants> {
|
|
12
|
-
/**
|
|
13
|
-
* Name of the Phosphor icon to render
|
|
14
|
-
*/
|
|
15
9
|
name: IconName;
|
|
16
|
-
/**
|
|
17
|
-
* Icon weight/style
|
|
18
|
-
* @default "light"
|
|
19
|
-
*/
|
|
20
10
|
weight?: PhosphorIconWeight;
|
|
21
|
-
/**
|
|
22
|
-
* Additional CSS classes
|
|
23
|
-
*/
|
|
24
11
|
className?: string;
|
|
25
|
-
/**
|
|
26
|
-
* Optional tooltip text to display on hover
|
|
27
|
-
*/
|
|
28
12
|
tooltip?: string;
|
|
29
|
-
/**
|
|
30
|
-
* Additional props to pass to the Tooltip component
|
|
31
|
-
*/
|
|
32
13
|
tooltipProps?: Partial<TooltipProps>;
|
|
33
14
|
}
|
|
34
|
-
/**
|
|
35
|
-
* Icon component using Phosphor Icons with size variants and optional tooltip.
|
|
36
|
-
*
|
|
37
|
-
* @example
|
|
38
|
-
* ```tsx
|
|
39
|
-
* <Icon name="User" size="md" />
|
|
40
|
-
* <Icon name="CheckCircle" size="lg" weight="fill" color="green" />
|
|
41
|
-
* <Icon name="Info" tooltip="More information" />
|
|
42
|
-
* ```
|
|
43
|
-
*/
|
|
44
15
|
declare const Icon: import('react').ForwardRefExoticComponent<Omit<IconProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
|
|
45
16
|
export { Icon, type IconProps };
|
|
@@ -10,7 +10,7 @@ export { CurrencyField, type CurrencyFieldProps } from './currency-field';
|
|
|
10
10
|
export { DatePicker, type DatePickerProps } from './date-picker';
|
|
11
11
|
export { DateRangePicker, type DateRangePickerProps, } from './date-range-picker';
|
|
12
12
|
export { TimePicker, type TimePickerProps } from './time-picker';
|
|
13
|
-
export { FilterButton, FilterTag, FilterSection, FilterCheckboxOption, FilterRadioOption, FilterContent, FilterDateRange, FilterDateRangeOption,
|
|
13
|
+
export { FilterButton, FilterTag, FilterSection, FilterCheckboxOption, FilterRadioOption, FilterContent, FilterDateRange, FilterDateRangeOption, type FilterButtonProps, type FilterTagProps, type FilterSectionProps, type FilterCheckboxOptionProps, type FilterRadioOptionProps, type FilterContentProps, type FilterDateRangeProps, type FilterDateRangeOptionProps, } from './filter';
|
|
14
14
|
export { FilterDropdown, FilterMenu, FilterMenuItem, type FilterDropdownProps, type FilterConfig, type FilterMenuProps, type FilterMenuItemProps, } from './filter-dropdown';
|
|
15
15
|
export { DropdownMenu, DropdownMenuPortal, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuSubContent, type DropdownMenuProps, type DropdownMenuPortalProps, type DropdownMenuTriggerProps, type DropdownMenuContentProps, type DropdownMenuGroupProps, type DropdownMenuLabelProps, type DropdownMenuItemProps, type DropdownMenuCheckboxItemProps, type DropdownMenuRadioGroupProps, type DropdownMenuRadioItemProps, type DropdownMenuSeparatorProps, type DropdownMenuShortcutProps, type DropdownMenuSubProps, type DropdownMenuSubTriggerProps, type DropdownMenuSubContentProps, } from './dropdown-menu';
|
|
16
16
|
export { DotsMenu, type DotsMenuProps, type DotsMenuAction, type DotsMenuOptions, } from './dots-menu';
|
|
@@ -18,7 +18,7 @@ export { ToggleGroup, ToggleGroupItem, type ToggleGroupProps, type ToggleGroupIt
|
|
|
18
18
|
export { Tooltip, TooltipProvider, type TooltipProps, type TooltipProviderProps, } from './tooltip';
|
|
19
19
|
export { Field, type FieldProps } from './field';
|
|
20
20
|
export { NavLink, type NavLinkProps } from './nav-link';
|
|
21
|
-
export { Select,
|
|
21
|
+
export { Select, type SelectProps, type SelectOption, type SelectOptionGroup, } from './select';
|
|
22
22
|
export { Combobox, type ComboboxProps, type ComboboxOption } from './combobox';
|
|
23
23
|
export { Link, type LinkProps } from './link';
|
|
24
24
|
export { MultiValuesField, type MultiValuesFieldProps, type TriggerKey, } from './multi-values-field';
|
|
@@ -32,7 +32,6 @@ export { Switch, type SwitchProps } from './switch';
|
|
|
32
32
|
export { Textarea, type TextareaProps } from './textarea';
|
|
33
33
|
export { Typography, type TypographyProps } from './typography';
|
|
34
34
|
export { Icon, type IconProps, type IconName } from './icon';
|
|
35
|
-
export { Loading, type LoadingProps } from './loading';
|
|
36
35
|
export { OTPField, type OTPFieldProps } from './otp-field';
|
|
37
36
|
export { PasswordField, type PasswordFieldProps } from './password-field';
|
|
38
37
|
export { ProtectedField, type ProtectedFieldProps } from './protected-field';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { Label } from '
|
|
1
|
+
export { Label } from '../../../vendor/shadcn/label';
|
|
@@ -1,27 +1,7 @@
|
|
|
1
1
|
import { ComponentProps } from 'react';
|
|
2
|
-
/**
|
|
3
|
-
* Props for the Link component
|
|
4
|
-
*/
|
|
5
2
|
interface LinkProps extends ComponentProps<"a"> {
|
|
6
|
-
/**
|
|
7
|
-
* Whether to show underline decoration
|
|
8
|
-
* @default true
|
|
9
|
-
*/
|
|
10
3
|
underline?: boolean;
|
|
11
|
-
/**
|
|
12
|
-
* When true, renders as Slot to merge props with child element
|
|
13
|
-
* @default false
|
|
14
|
-
*/
|
|
15
4
|
asChild?: boolean;
|
|
16
5
|
}
|
|
17
|
-
/**
|
|
18
|
-
* Styled anchor link component with optional underline.
|
|
19
|
-
*
|
|
20
|
-
* @example
|
|
21
|
-
* ```tsx
|
|
22
|
-
* <Link href="/about">About Us</Link>
|
|
23
|
-
* <Link href="/terms" underline={false}>Terms</Link>
|
|
24
|
-
* ```
|
|
25
|
-
*/
|
|
26
6
|
declare const Link: import('react').ForwardRefExoticComponent<Omit<LinkProps, "ref"> & import('react').RefAttributes<HTMLAnchorElement>>;
|
|
27
7
|
export { Link, type LinkProps };
|
|
@@ -10,7 +10,7 @@ const D = c.forwardRef(
|
|
|
10
10
|
({
|
|
11
11
|
options: m,
|
|
12
12
|
value: s = [],
|
|
13
|
-
|
|
13
|
+
onValueChange: l,
|
|
14
14
|
placeholder: b = "Select items...",
|
|
15
15
|
searchPlaceholder: w = "Search...",
|
|
16
16
|
emptyMessage: N = "No results found.",
|
|
@@ -23,10 +23,10 @@ const D = c.forwardRef(
|
|
|
23
23
|
showBadges: x = !0,
|
|
24
24
|
allowClear: y = !0
|
|
25
25
|
}, k) => {
|
|
26
|
-
const [h, S] = c.useState(!1), [p,
|
|
26
|
+
const [h, S] = c.useState(!1), [p, L] = c.useState(""), P = (t) => {
|
|
27
27
|
const r = s.includes(t) ? s.filter((d) => d !== t) : [...s, t];
|
|
28
28
|
l?.(r);
|
|
29
|
-
},
|
|
29
|
+
}, V = (t, r) => {
|
|
30
30
|
r?.preventDefault(), r?.stopPropagation();
|
|
31
31
|
const d = s.filter((R) => R !== t);
|
|
32
32
|
l?.(d);
|
|
@@ -64,7 +64,7 @@ const D = c.forwardRef(
|
|
|
64
64
|
{
|
|
65
65
|
type: "button",
|
|
66
66
|
className: "ml-1 rounded-full outline-hidden hover:bg-muted-foreground/20",
|
|
67
|
-
onClick: (r) =>
|
|
67
|
+
onClick: (r) => V(t.value, r),
|
|
68
68
|
children: /* @__PURE__ */ e.jsx(g, { className: "h-3 w-3" })
|
|
69
69
|
}
|
|
70
70
|
)
|
|
@@ -120,7 +120,7 @@ const D = c.forwardRef(
|
|
|
120
120
|
{
|
|
121
121
|
placeholder: w,
|
|
122
122
|
value: p,
|
|
123
|
-
onValueChange:
|
|
123
|
+
onValueChange: L
|
|
124
124
|
}
|
|
125
125
|
),
|
|
126
126
|
/* @__PURE__ */ e.jsx(I, { children: N }),
|
|
@@ -131,7 +131,7 @@ const D = c.forwardRef(
|
|
|
131
131
|
{
|
|
132
132
|
value: t.value,
|
|
133
133
|
onSelect: () => {
|
|
134
|
-
|
|
134
|
+
P(t.value);
|
|
135
135
|
},
|
|
136
136
|
children: [
|
|
137
137
|
/* @__PURE__ */ e.jsx(
|
|
@@ -1,19 +1,3 @@
|
|
|
1
1
|
import { MultiValuesFieldProps } from './multi-values-field.types';
|
|
2
|
-
/**
|
|
3
|
-
* Multi-value input field for adding/removing multiple string values as badges.
|
|
4
|
-
* Features keyboard shortcuts, validation, duplicate detection, and max items limit.
|
|
5
|
-
*
|
|
6
|
-
* @example
|
|
7
|
-
* ```tsx
|
|
8
|
-
* <MultiValuesField
|
|
9
|
-
* label="Email addresses"
|
|
10
|
-
* value={emails}
|
|
11
|
-
* onChange={setEmails}
|
|
12
|
-
* validate={(value) => /^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/.test(value) || "Invalid email"}
|
|
13
|
-
* maxItems={5}
|
|
14
|
-
* allowDuplicates={false}
|
|
15
|
-
* />
|
|
16
|
-
* ```
|
|
17
|
-
*/
|
|
18
2
|
declare const MultiValuesField: import('react').ForwardRefExoticComponent<MultiValuesFieldProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
19
3
|
export { MultiValuesField };
|
|
@@ -1,158 +1,136 @@
|
|
|
1
|
-
import { j as
|
|
2
|
-
import { forwardRef as
|
|
3
|
-
import { cn as
|
|
4
|
-
import { Field as
|
|
5
|
-
import { Badge as
|
|
6
|
-
|
|
7
|
-
const A = O(
|
|
1
|
+
import { j as n } from "../../../_virtual/jsx-runtime.js";
|
|
2
|
+
import { forwardRef as q, useId as z, useState as g } from "react";
|
|
3
|
+
import { cn as b } from "../../../lib/utils.js";
|
|
4
|
+
import { Field as G, FieldLabel as H, FieldDescription as J, FieldError as K } from "../../../vendor/shadcn/field.js";
|
|
5
|
+
import { Badge as O } from "../badge/badge.js";
|
|
6
|
+
const Q = q(
|
|
8
7
|
({
|
|
9
8
|
value: t = [],
|
|
10
|
-
onChange:
|
|
9
|
+
onChange: d,
|
|
11
10
|
label: w,
|
|
12
|
-
description:
|
|
13
|
-
error:
|
|
14
|
-
placeholder:
|
|
15
|
-
disabled:
|
|
16
|
-
id:
|
|
11
|
+
description: c,
|
|
12
|
+
error: y,
|
|
13
|
+
placeholder: j = "Type and press Enter...",
|
|
14
|
+
disabled: u = !1,
|
|
15
|
+
id: v,
|
|
17
16
|
name: V,
|
|
18
|
-
triggerKeys:
|
|
17
|
+
triggerKeys: p = ["Enter", "Tab", "Comma"],
|
|
19
18
|
addOnBlur: B = !0,
|
|
20
|
-
allowDuplicates:
|
|
21
|
-
maxItems:
|
|
22
|
-
validate:
|
|
23
|
-
badgeVariant:
|
|
24
|
-
orientation:
|
|
25
|
-
className:
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
i(`Maximum ${m} items allowed`);
|
|
19
|
+
allowDuplicates: D = !1,
|
|
20
|
+
maxItems: f,
|
|
21
|
+
validate: k,
|
|
22
|
+
badgeVariant: I = "outline",
|
|
23
|
+
orientation: N = "vertical",
|
|
24
|
+
className: $
|
|
25
|
+
}, C) => {
|
|
26
|
+
const T = z(), o = v || T, m = !!y, [h, E] = g(""), [R, F] = g(!1), [x, i] = g(""), s = (e) => {
|
|
27
|
+
const r = e.trim();
|
|
28
|
+
if (r !== "") {
|
|
29
|
+
if (f && t.length >= f) {
|
|
30
|
+
i(`Maximum ${f} items allowed`);
|
|
33
31
|
return;
|
|
34
32
|
}
|
|
35
|
-
if (!
|
|
33
|
+
if (!D && t.includes(r)) {
|
|
36
34
|
i("Duplicate values are not allowed");
|
|
37
35
|
return;
|
|
38
36
|
}
|
|
39
|
-
if (
|
|
40
|
-
const
|
|
41
|
-
if (
|
|
37
|
+
if (k) {
|
|
38
|
+
const l = k(r);
|
|
39
|
+
if (l !== !0) {
|
|
42
40
|
i(
|
|
43
|
-
typeof
|
|
41
|
+
typeof l == "string" ? l : "Invalid value"
|
|
44
42
|
);
|
|
45
43
|
return;
|
|
46
44
|
}
|
|
47
45
|
}
|
|
48
|
-
i(""),
|
|
46
|
+
i(""), d([...t, r]), E("");
|
|
49
47
|
}
|
|
48
|
+
}, M = (e) => {
|
|
49
|
+
d(t.filter((r) => r !== e)), i("");
|
|
50
50
|
}, P = (e) => {
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
},
|
|
56
|
-
D(e.target.value), i("");
|
|
57
|
-
}, q = () => {
|
|
51
|
+
const r = e.currentTarget.value;
|
|
52
|
+
e.key === "Enter" && p.includes("Enter") ? (e.preventDefault(), s(r)) : e.key === "Tab" && p.includes("Tab") ? r.trim() !== "" && (e.preventDefault(), s(r)) : (e.key === "," || e.key === ",") && p.includes("Comma") ? (e.preventDefault(), s(r)) : e.key === "Backspace" && r === "" && t.length > 0 && d(t.slice(0, -1));
|
|
53
|
+
}, A = (e) => {
|
|
54
|
+
E(e.target.value), i("");
|
|
55
|
+
}, L = () => {
|
|
58
56
|
F(!0);
|
|
59
|
-
},
|
|
60
|
-
F(!1), B &&
|
|
61
|
-
},
|
|
62
|
-
e.preventDefault(), e.stopPropagation(),
|
|
63
|
-
},
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
return /* @__PURE__ */ r.jsxs(
|
|
67
|
-
U,
|
|
57
|
+
}, S = () => {
|
|
58
|
+
F(!1), B && h.trim() !== "" && s(h);
|
|
59
|
+
}, X = (e, r) => {
|
|
60
|
+
e.preventDefault(), e.stopPropagation(), M(r);
|
|
61
|
+
}, a = y || x;
|
|
62
|
+
return /* @__PURE__ */ n.jsxs(
|
|
63
|
+
G,
|
|
68
64
|
{
|
|
69
|
-
orientation:
|
|
70
|
-
"data-invalid":
|
|
71
|
-
className:
|
|
65
|
+
orientation: N,
|
|
66
|
+
"data-invalid": m,
|
|
67
|
+
className: b("w-full", $),
|
|
72
68
|
children: [
|
|
73
|
-
w && /* @__PURE__ */
|
|
74
|
-
/* @__PURE__ */
|
|
75
|
-
/* @__PURE__ */
|
|
69
|
+
w && /* @__PURE__ */ n.jsx(H, { htmlFor: o, children: w }),
|
|
70
|
+
/* @__PURE__ */ n.jsxs("div", { className: "flex flex-col gap-2 flex-1", children: [
|
|
71
|
+
/* @__PURE__ */ n.jsxs(
|
|
76
72
|
"div",
|
|
77
73
|
{
|
|
78
|
-
className:
|
|
79
|
-
"font-normal file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex min-h-9 w-full min-w-0 rounded-md border bg-
|
|
74
|
+
className: b(
|
|
75
|
+
"font-normal file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex min-h-9 w-full min-w-0 rounded-md border bg-white px-3 py-1.5 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 text-sm",
|
|
80
76
|
"flex-wrap gap-1.5 items-center",
|
|
81
|
-
|
|
82
|
-
(
|
|
83
|
-
|
|
77
|
+
R && "border-ring ring-ring/50 ring-[3px]",
|
|
78
|
+
(m || x) && "border-destructive ring-destructive/20 dark:ring-destructive/40",
|
|
79
|
+
u && "opacity-50 cursor-not-allowed"
|
|
84
80
|
),
|
|
85
81
|
onClick: () => {
|
|
86
|
-
|
|
82
|
+
u || document.getElementById(o)?.focus();
|
|
87
83
|
},
|
|
88
84
|
children: [
|
|
89
|
-
(() =>
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
}
|
|
105
|
-
)
|
|
106
|
-
}
|
|
107
|
-
),
|
|
108
|
-
t.map((n, d) => /* @__PURE__ */ r.jsxs(E, { variant: N, children: [
|
|
109
|
-
n,
|
|
110
|
-
/* @__PURE__ */ r.jsx(
|
|
111
|
-
"button",
|
|
112
|
-
{
|
|
113
|
-
type: "button",
|
|
114
|
-
onClick: (J) => G(J, n),
|
|
115
|
-
children: /* @__PURE__ */ r.jsx(_, { name: "X", className: "h-3 w-3" })
|
|
116
|
-
}
|
|
117
|
-
)
|
|
118
|
-
] }, `${n}-${d}`))
|
|
119
|
-
] });
|
|
120
|
-
})(),
|
|
121
|
-
/* @__PURE__ */ r.jsx(
|
|
85
|
+
t.map((e, r) => /* @__PURE__ */ n.jsx(
|
|
86
|
+
O,
|
|
87
|
+
{
|
|
88
|
+
variant: I,
|
|
89
|
+
endIcon: "X",
|
|
90
|
+
className: "m-0 cursor-pointer",
|
|
91
|
+
onClick: (l) => X(l, e),
|
|
92
|
+
endIconProps: {
|
|
93
|
+
className: "cursor-pointer hover:text-destructive transition-colors"
|
|
94
|
+
},
|
|
95
|
+
children: e
|
|
96
|
+
},
|
|
97
|
+
`${e}-${r}`
|
|
98
|
+
)),
|
|
99
|
+
/* @__PURE__ */ n.jsx(
|
|
122
100
|
"input",
|
|
123
101
|
{
|
|
124
|
-
ref:
|
|
102
|
+
ref: C,
|
|
125
103
|
id: o,
|
|
126
104
|
name: V,
|
|
127
105
|
type: "text",
|
|
128
|
-
value:
|
|
129
|
-
onChange:
|
|
130
|
-
onKeyDown:
|
|
131
|
-
onFocus:
|
|
132
|
-
onBlur:
|
|
133
|
-
placeholder: t.length === 0 ?
|
|
134
|
-
disabled:
|
|
135
|
-
className:
|
|
106
|
+
value: h,
|
|
107
|
+
onChange: A,
|
|
108
|
+
onKeyDown: P,
|
|
109
|
+
onFocus: L,
|
|
110
|
+
onBlur: S,
|
|
111
|
+
placeholder: t.length === 0 ? j : "",
|
|
112
|
+
disabled: u,
|
|
113
|
+
className: b(
|
|
136
114
|
"flex-1 min-w-[120px] outline-none bg-transparent border-none shadow-none p-0 h-6",
|
|
137
115
|
"placeholder:text-muted-foreground",
|
|
138
116
|
"disabled:cursor-not-allowed"
|
|
139
117
|
),
|
|
140
|
-
"aria-invalid":
|
|
141
|
-
"aria-describedby":
|
|
118
|
+
"aria-invalid": m || !!x,
|
|
119
|
+
"aria-describedby": c || a ? `${o}-description` : void 0
|
|
142
120
|
}
|
|
143
121
|
)
|
|
144
122
|
]
|
|
145
123
|
}
|
|
146
124
|
),
|
|
147
|
-
|
|
148
|
-
|
|
125
|
+
c && !a && /* @__PURE__ */ n.jsx(J, { id: `${o}-description`, children: c }),
|
|
126
|
+
a && /* @__PURE__ */ n.jsx(K, { id: `${o}-description`, children: a })
|
|
149
127
|
] })
|
|
150
128
|
]
|
|
151
129
|
}
|
|
152
130
|
);
|
|
153
131
|
}
|
|
154
132
|
);
|
|
155
|
-
|
|
133
|
+
Q.displayName = "MultiValuesField";
|
|
156
134
|
export {
|
|
157
|
-
|
|
135
|
+
Q as MultiValuesField
|
|
158
136
|
};
|
|
@@ -1,101 +1,20 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Keyboard keys that trigger adding a value
|
|
3
|
-
*/
|
|
4
1
|
export type TriggerKey = "Enter" | "Tab" | "Comma";
|
|
5
|
-
/**
|
|
6
|
-
* Props for the MultiValuesField component
|
|
7
|
-
*/
|
|
8
2
|
export interface MultiValuesFieldProps {
|
|
9
|
-
/**
|
|
10
|
-
* Current array of values
|
|
11
|
-
*/
|
|
12
3
|
value: string[];
|
|
13
|
-
/**
|
|
14
|
-
* Callback fired when the values array changes
|
|
15
|
-
*/
|
|
16
4
|
onChange: (values: string[]) => void;
|
|
17
|
-
/**
|
|
18
|
-
* Label text displayed above the input
|
|
19
|
-
*/
|
|
20
5
|
label?: string;
|
|
21
|
-
/**
|
|
22
|
-
* Helper text displayed below the input
|
|
23
|
-
*/
|
|
24
6
|
description?: string;
|
|
25
|
-
/**
|
|
26
|
-
* Error message displayed below the input
|
|
27
|
-
*/
|
|
28
7
|
error?: string;
|
|
29
|
-
/**
|
|
30
|
-
* Placeholder text for the input
|
|
31
|
-
* @default "Type and press Enter..."
|
|
32
|
-
*/
|
|
33
8
|
placeholder?: string;
|
|
34
|
-
/**
|
|
35
|
-
* Whether the field is disabled
|
|
36
|
-
* @default false
|
|
37
|
-
*/
|
|
38
9
|
disabled?: boolean;
|
|
39
|
-
/**
|
|
40
|
-
* HTML id attribute
|
|
41
|
-
*/
|
|
42
10
|
id?: string;
|
|
43
|
-
/**
|
|
44
|
-
* HTML name attribute
|
|
45
|
-
*/
|
|
46
11
|
name?: string;
|
|
47
|
-
/**
|
|
48
|
-
* Keys that trigger adding a new value
|
|
49
|
-
* @default ["Enter", "Tab", "Comma"]
|
|
50
|
-
*/
|
|
51
12
|
triggerKeys?: TriggerKey[];
|
|
52
|
-
/**
|
|
53
|
-
* Whether to add value when input loses focus
|
|
54
|
-
* @default true
|
|
55
|
-
*/
|
|
56
13
|
addOnBlur?: boolean;
|
|
57
|
-
/**
|
|
58
|
-
* Whether to allow duplicate values
|
|
59
|
-
* @default false
|
|
60
|
-
*/
|
|
61
14
|
allowDuplicates?: boolean;
|
|
62
|
-
/**
|
|
63
|
-
* Maximum number of values allowed
|
|
64
|
-
*/
|
|
65
15
|
maxItems?: number;
|
|
66
|
-
/**
|
|
67
|
-
* Validation function that returns true or an error message
|
|
68
|
-
*/
|
|
69
16
|
validate?: (value: string) => boolean | string;
|
|
70
|
-
/**
|
|
71
|
-
* Visual variant for the value badges
|
|
72
|
-
* @default "outline"
|
|
73
|
-
*/
|
|
74
17
|
badgeVariant?: "default" | "secondary" | "destructive" | "outline";
|
|
75
|
-
/**
|
|
76
|
-
* Layout orientation
|
|
77
|
-
* @default "vertical"
|
|
78
|
-
*/
|
|
79
18
|
orientation?: "vertical" | "horizontal";
|
|
80
|
-
/**
|
|
81
|
-
* Additional CSS classes
|
|
82
|
-
*/
|
|
83
19
|
className?: string;
|
|
84
|
-
/**
|
|
85
|
-
* Configuration for "Delete All" chip functionality
|
|
86
|
-
*/
|
|
87
|
-
deleteAll?: {
|
|
88
|
-
/**
|
|
89
|
-
* Label for the delete all chip
|
|
90
|
-
*/
|
|
91
|
-
label?: string;
|
|
92
|
-
/**
|
|
93
|
-
* Minimum number of selected items to show delete all
|
|
94
|
-
*/
|
|
95
|
-
length: number;
|
|
96
|
-
/**
|
|
97
|
-
* Callback fired when delete all is clicked
|
|
98
|
-
*/
|
|
99
|
-
onClick: () => void;
|
|
100
|
-
};
|
|
101
20
|
}
|
|
@@ -1,44 +1,12 @@
|
|
|
1
1
|
import { ComponentProps } from 'react';
|
|
2
2
|
import { InputOTP } from '../../../vendor/shadcn/input-otp';
|
|
3
3
|
import * as React from "react";
|
|
4
|
-
/**
|
|
5
|
-
* Props for the OTPField component
|
|
6
|
-
*/
|
|
7
4
|
export interface OTPFieldProps extends Omit<ComponentProps<typeof InputOTP>, "maxLength" | "render"> {
|
|
8
|
-
/**
|
|
9
|
-
* Number of OTP input slots
|
|
10
|
-
* @default 6
|
|
11
|
-
*/
|
|
12
5
|
maxLength?: number;
|
|
13
|
-
/**
|
|
14
|
-
* Label text displayed above the input
|
|
15
|
-
*/
|
|
16
6
|
label?: string;
|
|
17
|
-
/**
|
|
18
|
-
* Error message displayed below the input
|
|
19
|
-
*/
|
|
20
7
|
error?: string;
|
|
21
|
-
/**
|
|
22
|
-
* Additional CSS classes for the field wrapper
|
|
23
|
-
*/
|
|
24
8
|
className?: string;
|
|
25
|
-
/**
|
|
26
|
-
* Additional CSS classes for the OTP input container
|
|
27
|
-
*/
|
|
28
9
|
containerClassName?: string;
|
|
29
10
|
}
|
|
30
|
-
/**
|
|
31
|
-
* One-Time Password input field with individual digit slots.
|
|
32
|
-
*
|
|
33
|
-
* @example
|
|
34
|
-
* ```tsx
|
|
35
|
-
* <OTPField
|
|
36
|
-
* label="Enter verification code"
|
|
37
|
-
* maxLength={6}
|
|
38
|
-
* value={otp}
|
|
39
|
-
* onChange={(value) => setOtp(value)}
|
|
40
|
-
* />
|
|
41
|
-
* ```
|
|
42
|
-
*/
|
|
43
11
|
declare const OTPField: React.ForwardRefExoticComponent<Omit<OTPFieldProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
|
|
44
12
|
export { OTPField };
|
|
@@ -1,32 +1,9 @@
|
|
|
1
1
|
import { InputHTMLAttributes } from 'react';
|
|
2
2
|
import { FieldProps } from '../field';
|
|
3
3
|
import { LinkProps } from '../link';
|
|
4
|
-
/**
|
|
5
|
-
* Props for the PasswordField component
|
|
6
|
-
*/
|
|
7
4
|
export interface PasswordFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type">, Omit<FieldProps, "type" | "endIcon" | "endIconProps"> {
|
|
8
|
-
/**
|
|
9
|
-
* Whether password is visible by default
|
|
10
|
-
* @default false
|
|
11
|
-
*/
|
|
12
5
|
defaultVisible?: boolean;
|
|
13
|
-
/**
|
|
14
|
-
* Props for the "Forgot password?" link
|
|
15
|
-
*/
|
|
16
6
|
forgotPasswordLinkProps?: LinkProps;
|
|
17
7
|
}
|
|
18
|
-
/**
|
|
19
|
-
* Password input field with toggle visibility button and optional "Forgot password?" link.
|
|
20
|
-
*
|
|
21
|
-
* @example
|
|
22
|
-
* ```tsx
|
|
23
|
-
* <PasswordField
|
|
24
|
-
* label="Password"
|
|
25
|
-
* forgotPasswordLinkProps={{ href: '/forgot-password' }}
|
|
26
|
-
* value={password}
|
|
27
|
-
* onChange={(e) => setPassword(e.target.value)}
|
|
28
|
-
* />
|
|
29
|
-
* ```
|
|
30
|
-
*/
|
|
31
8
|
declare const PasswordField: import('react').ForwardRefExoticComponent<PasswordFieldProps & import('react').RefAttributes<HTMLInputElement>>;
|
|
32
9
|
export { PasswordField };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { j as s } from "../../../_virtual/jsx-runtime.js";
|
|
2
2
|
import { forwardRef as m, useState as p } from "react";
|
|
3
3
|
import { cn as x } from "../../../lib/utils.js";
|
|
4
|
-
import { Label as f } from "
|
|
4
|
+
import { Label as f } from "../../../vendor/shadcn/label.js";
|
|
5
5
|
import { Link as w } from "../link/link.js";
|
|
6
6
|
import { Field as d } from "../field/field.js";
|
|
7
7
|
const u = m(
|
|
@@ -1,23 +1,8 @@
|
|
|
1
1
|
import { ComponentProps } from 'react';
|
|
2
2
|
import { Progress as ShadcnProgress } from '../../../vendor/shadcn/progress';
|
|
3
|
-
/**
|
|
4
|
-
* Props for the Progress component
|
|
5
|
-
*/
|
|
6
3
|
interface ProgressProps extends ComponentProps<typeof ShadcnProgress> {
|
|
7
|
-
/**
|
|
8
|
-
* Current progress value (0-100)
|
|
9
|
-
*/
|
|
10
4
|
value?: number;
|
|
11
5
|
}
|
|
12
|
-
/**
|
|
13
|
-
* Progress bar component for showing task completion or loading status.
|
|
14
|
-
*
|
|
15
|
-
* @example
|
|
16
|
-
* ```tsx
|
|
17
|
-
* <Progress value={75} />
|
|
18
|
-
* <Progress value={progressPercent} className="w-full" />
|
|
19
|
-
* ```
|
|
20
|
-
*/
|
|
21
6
|
declare const Progress: {
|
|
22
7
|
({ value, ...props }: ProgressProps): import("react/jsx-runtime").JSX.Element;
|
|
23
8
|
displayName: string;
|
|
@@ -1,12 +1,2 @@
|
|
|
1
1
|
import { ProtectedFieldProps } from './protected-field.types';
|
|
2
|
-
/**
|
|
3
|
-
* Display-only field that can mask sensitive information with asterisks.
|
|
4
|
-
* Automatically truncates long text and provides protected view.
|
|
5
|
-
*
|
|
6
|
-
* @example
|
|
7
|
-
* ```tsx
|
|
8
|
-
* <ProtectedField text="secret-api-key-12345" protect={true} />
|
|
9
|
-
* <ProtectedField text="user@email.com" protect={false} />
|
|
10
|
-
* ```
|
|
11
|
-
*/
|
|
12
2
|
export declare const ProtectedField: ({ protect, text, className, }: ProtectedFieldProps) => import("react/jsx-runtime").JSX.Element;
|