infinity-ui-elements 1.8.28 → 1.8.30

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.
@@ -1 +1 @@
1
- {"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/DatePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,kCAAkC,CAAC;AAU1C,QAAA,MAAM,kBAAkB;;;;mFAyCvB,CAAC;AAEF,MAAM,WAAW,eACf,SAAQ,IAAI,CACV,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,UAAU,GAAG,cAAc,CAC5B;IACD;;OAEG;IACH,KAAK,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAC;IAC7B;;OAEG;IACH,YAAY,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACvC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,UAAU,CAAC;IACnD;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,OAAO,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,CAAC;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CAChE;AAqBD,eAAO,MAAM,UAAU,wFA6VtB,CAAC;AAIF,OAAO,EAAE,kBAAkB,EAAE,CAAC"}
1
+ {"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/DatePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,kCAAkC,CAAC;AAU1C,QAAA,MAAM,kBAAkB;;;;mFAyCvB,CAAC;AAEF,MAAM,WAAW,eACf,SAAQ,IAAI,CACV,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,UAAU,GAAG,cAAc,CAC5B;IACD;;OAEG;IACH,KAAK,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAC;IAC7B;;OAEG;IACH,YAAY,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,IAAI,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACvC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,UAAU,CAAC;IACnD;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,OAAO,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACxB;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,CAAC;IACpC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CAChE;AAqBD,eAAO,MAAM,UAAU,wFAiVtB,CAAC;AAIF,OAAO,EAAE,kBAAkB,EAAE,CAAC"}
@@ -0,0 +1,132 @@
1
+ import * as React from "react";
2
+ export interface RadioOption {
3
+ /**
4
+ * The value of the radio option
5
+ */
6
+ value: string;
7
+ /**
8
+ * The label text for the radio option
9
+ */
10
+ label: string;
11
+ /**
12
+ * Whether this option is disabled
13
+ */
14
+ isDisabled?: boolean;
15
+ /**
16
+ * Custom class name for the option container
17
+ */
18
+ containerClassName?: string;
19
+ /**
20
+ * Custom class name for the option label
21
+ */
22
+ labelClassName?: string;
23
+ }
24
+ export interface RadioGroupProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
25
+ /**
26
+ * Selected value (controlled)
27
+ */
28
+ value?: string;
29
+ /**
30
+ * Default selected value (uncontrolled)
31
+ */
32
+ defaultValue?: string;
33
+ /**
34
+ * Callback when selection changes
35
+ */
36
+ onChange?: (value: string) => void;
37
+ /**
38
+ * Array of radio options
39
+ */
40
+ options?: RadioOption[];
41
+ /**
42
+ * Custom radio buttons as children (alternative to options)
43
+ */
44
+ children?: React.ReactNode;
45
+ /**
46
+ * Label for the radio group
47
+ */
48
+ label?: string;
49
+ /**
50
+ * Helper text below the radio group
51
+ */
52
+ helperText?: string;
53
+ /**
54
+ * Error text (overrides helperText when present)
55
+ */
56
+ errorText?: string;
57
+ /**
58
+ * Success text (overrides helperText when present)
59
+ */
60
+ successText?: string;
61
+ /**
62
+ * Validation state for the radio group
63
+ */
64
+ validationState?: "none" | "error";
65
+ /**
66
+ * Whether the radio group is disabled
67
+ */
68
+ isDisabled?: boolean;
69
+ /**
70
+ * Whether the radio group is required
71
+ */
72
+ isRequired?: boolean;
73
+ /**
74
+ * Whether the radio group is optional
75
+ */
76
+ isOptional?: boolean;
77
+ /**
78
+ * Size of the radio buttons
79
+ */
80
+ size?: "small" | "medium" | "large";
81
+ /**
82
+ * Name attribute for the radio inputs (auto-generated if not provided)
83
+ */
84
+ name?: string;
85
+ /**
86
+ * Orientation of the radio group
87
+ */
88
+ orientation?: "horizontal" | "vertical";
89
+ /**
90
+ * Spacing between radio options
91
+ */
92
+ spacing?: "tight" | "normal" | "loose";
93
+ /**
94
+ * Custom class for the container
95
+ */
96
+ containerClassName?: string;
97
+ /**
98
+ * Custom class for the label
99
+ */
100
+ labelClassName?: string;
101
+ /**
102
+ * Custom class for the radio group wrapper
103
+ */
104
+ groupClassName?: string;
105
+ /**
106
+ * Info heading for tooltip
107
+ */
108
+ infoHeading?: string;
109
+ /**
110
+ * Info description for tooltip
111
+ */
112
+ infoDescription?: string;
113
+ /**
114
+ * Custom Link component to render on the right side
115
+ */
116
+ LinkComponent?: React.ReactNode;
117
+ /**
118
+ * Link text
119
+ */
120
+ linkText?: string;
121
+ /**
122
+ * Link href
123
+ */
124
+ linkHref?: string;
125
+ /**
126
+ * Link click handler
127
+ */
128
+ onLinkClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void;
129
+ }
130
+ declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLDivElement>>;
131
+ export { RadioGroup };
132
+ //# sourceMappingURL=RadioGroup.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["../../../src/components/Radio/RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,GAAG,cAAc,CAAC;IAC/E;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;OAEG;IACH,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IACnC;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACvC;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CAChE;AAED,QAAA,MAAM,UAAU,wFA4Pf,CAAC;AAIF,OAAO,EAAE,UAAU,EAAE,CAAC"}
@@ -0,0 +1,32 @@
1
+ import type { StoryObj } from "@storybook/react";
2
+ declare const meta: {
3
+ title: string;
4
+ component: import("react").ForwardRefExoticComponent<import("./RadioGroup").RadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;
5
+ parameters: {
6
+ layout: string;
7
+ };
8
+ tags: string[];
9
+ };
10
+ export default meta;
11
+ type Story = StoryObj<typeof meta>;
12
+ export declare const Default: Story;
13
+ export declare const WithDefaultValue: Story;
14
+ export declare const Controlled: Story;
15
+ export declare const WithHelperText: Story;
16
+ export declare const WithError: Story;
17
+ export declare const WithSuccess: Story;
18
+ export declare const Required: Story;
19
+ export declare const Optional: Story;
20
+ export declare const Disabled: Story;
21
+ export declare const WithDisabledOption: Story;
22
+ export declare const Horizontal: Story;
23
+ export declare const Vertical: Story;
24
+ export declare const Spacing: Story;
25
+ export declare const Sizes: Story;
26
+ export declare const WithChildren: Story;
27
+ export declare const WithInfoTooltip: Story;
28
+ export declare const WithLink: Story;
29
+ export declare const ManyOptions: Story;
30
+ export declare const HorizontalManyOptions: Story;
31
+ export declare const AllStates: Story;
32
+ //# sourceMappingURL=RadioGroup.stories.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"RadioGroup.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Radio/RadioGroup.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAKvD,QAAA,MAAM,IAAI;;;;;;;CAOyB,CAAC;AAEpC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAQnC,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAM9B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAgBxB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAM5B,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAOvB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAShC,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAMxB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAoBrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAoBnB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAgB1B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAQ7B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAQtB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAczB,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAcnC,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAkCvB,CAAC"}
@@ -1,3 +1,5 @@
1
1
  export { Radio, radioVariants } from "./Radio";
2
2
  export type { RadioProps } from "./Radio";
3
+ export { RadioGroup } from "./RadioGroup";
4
+ export type { RadioGroupProps, RadioOption } from "./RadioGroup";
3
5
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Radio/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC/C,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Radio/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC/C,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC"}
@@ -90,6 +90,11 @@ export interface SelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
90
90
  * Callback when clear button is clicked
91
91
  */
92
92
  onClear?: () => void;
93
+ /**
94
+ * Show the selected option's leadingIcon in the input box
95
+ * Only shown when an option is selected and has a leadingIcon
96
+ */
97
+ showLeadingIcon?: boolean;
93
98
  /**
94
99
  * Custom class for the container
95
100
  */
@@ -1 +1 @@
1
- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"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"}
@@ -27,6 +27,7 @@ export declare const Loading: Story;
27
27
  export declare const Empty: Story;
28
28
  export declare const Controlled: Story;
29
29
  export declare const WithIcons: Story;
30
+ export declare const WithLeadingIcon: Story;
30
31
  export declare const InForm: Story;
31
32
  export declare const AllVariations: Story;
32
33
  //# sourceMappingURL=Select.stories.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Select.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAYlC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CA4B7B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAC;AAkFrC,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAOvB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAQ5B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAQ5B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAS9B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAQtB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAQtB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAQxB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAQxB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAS7B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAU7B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAStB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAK7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAa9B,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KASnB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KASpB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KASnB,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAShC,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KASjC,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAStB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KASnB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KA0BxB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAmCvB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KA8DpB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAwD3B,CAAC"}
1
+ {"version":3,"file":"Select.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAYlC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CA4B7B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAC;AAkFrC,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAOvB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAQ5B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAQ5B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAS9B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAQtB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAQtB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAQxB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAQxB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAS7B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAU7B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAStB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAK7B,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAa9B,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KASnB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KASpB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KASnB,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAShC,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KASjC,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAStB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KASnB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KA0BxB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAmCvB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAmC7B,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KA8DpB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAwD3B,CAAC"}
package/dist/index.esm.js CHANGED
@@ -5,7 +5,7 @@ import { Slot } from '@radix-ui/react-slot';
5
5
  import { PulseLoader, ClipLoader } from 'react-spinners';
6
6
  import { clsx } from 'clsx';
7
7
  import { twMerge } from 'tailwind-merge';
8
- import { ExternalLink, Calendar, Loader2, Search, ChevronDown, ChevronLeft, ChevronRight } from 'lucide-react';
8
+ import { ExternalLink, Calendar, X, Loader2, Search, ChevronDown, ChevronLeft, ChevronRight } from 'lucide-react';
9
9
  import Calendar$1 from 'react-calendar';
10
10
  import 'react-calendar/dist/Calendar.css';
11
11
  import { createPortal } from 'react-dom';
@@ -2077,7 +2077,7 @@ const formatDateDefault = (date) => {
2077
2077
  day: "numeric",
2078
2078
  });
2079
2079
  };
2080
- const DatePicker = React.forwardRef(({ className, value: controlledValue, defaultValue, onChange, placeholder = "Select a date", label, helperText, errorText, successText, validationState = "none", isDisabled = false, isRequired = false, isOptional = false, size = "medium", showClearButton = false, onClear, containerClassName, labelClassName, triggerClassName, calendarClassName, minDate, maxDate, formatDate = formatDateDefault, infoHeading, infoDescription, LinkComponent, linkText, linkHref, onLinkClick, ...props }, ref) => {
2080
+ const DatePicker = React.forwardRef(({ className, value: controlledValue, defaultValue, onChange, placeholder = "Select a date", label, helperText, errorText, successText, validationState = "none", isDisabled = false, isRequired = false, isOptional = false, size = "medium", showClearButton = true, onClear, containerClassName, labelClassName, triggerClassName, calendarClassName, minDate, maxDate, formatDate = formatDateDefault, infoHeading, infoDescription, LinkComponent, linkText, linkHref, onLinkClick, ...props }, ref) => {
2081
2081
  const [uncontrolledValue, setUncontrolledValue] = React.useState(parseDate(defaultValue));
2082
2082
  const [isOpen, setIsOpen] = React.useState(false);
2083
2083
  const datePickerRef = React.useRef(null);
@@ -2230,7 +2230,7 @@ const DatePicker = React.forwardRef(({ className, value: controlledValue, defaul
2230
2230
  ? "text-feedback-ink-positive-intense"
2231
2231
  : currentValidationState === "negative"
2232
2232
  ? "text-feedback-ink-negative-subtle"
2233
- : "text-surface-ink-neutral-muted") }), jsx("span", { className: cn("flex-1 text-left truncate", !hasValue && "text-surface-ink-neutral-muted", isDisabled && "text-surface-ink-neutral-disabled"), children: hasValue && value ? formatDate(value) : placeholder }), showClearButton && hasValue && !isDisabled && (jsx("button", { type: "button", onClick: handleClear, className: "shrink-0 flex items-center justify-center text-surface-ink-neutral-muted hover:text-surface-ink-neutral-normal transition-colors", tabIndex: -1, children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M12 4L4 12M4 4L12 12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }) })), isOpen && !isDisabled && (jsx("div", { ref: calendarRef, className: cn("absolute z-50 left-0 bg-surface-fill-neutral-intense rounded-large shadow-lg p-4", dropdownPlacement === "bottom"
2233
+ : "text-surface-ink-neutral-muted") }), jsx("span", { className: cn("flex-1 text-left truncate", !hasValue && "text-surface-ink-neutral-muted", isDisabled && "text-surface-ink-neutral-disabled"), children: hasValue && value ? formatDate(value) : placeholder }), showClearButton && hasValue && !isDisabled && (jsx("button", { type: "button", onClick: handleClear, className: "shrink-0 flex items-center justify-center text-surface-ink-neutral-muted hover:text-surface-ink-neutral-normal transition-colors", tabIndex: -1, "aria-label": "Clear date", children: jsx(X, { className: "w-4 h-4" }) })), isOpen && !isDisabled && (jsx("div", { ref: calendarRef, className: cn("absolute z-50 left-0 bg-surface-fill-neutral-intense rounded-large shadow-lg p-4", dropdownPlacement === "bottom"
2234
2234
  ? "top-full mt-1"
2235
2235
  : "bottom-full mb-1", calendarClassName), onClick: (e) => e.stopPropagation(), children: jsx("div", { className: "react-calendar-wrapper w-fit", children: jsx(Calendar$1, { onChange: handleCalendarChange, value: value ?? null, minDate: minDateParsed ?? undefined, maxDate: maxDateParsed ?? undefined, locale: "en-US", formatShortWeekday: (locale, date) => {
2236
2236
  const weekdayNames = [
@@ -2597,7 +2597,7 @@ const selectVariants = cva("relative flex items-center gap-2 border rounded-larg
2597
2597
  isDisabled: false,
2598
2598
  },
2599
2599
  });
2600
- const Select = React.forwardRef(({ className, options = [], value: controlledValue, defaultValue, onChange, placeholder = "Select an option", label, helperText, errorText, successText, validationState = "none", isDisabled = false, isRequired = false, isOptional = false, isLoading = false, size = "medium", prefix, suffix, showClearButton = false, onClear, containerClassName, labelClassName, triggerClassName, menuClassName, menuWidth = "full", sectionHeading, emptyTitle = "No options available", emptyDescription = "There are no options to select from.", emptyIcon, infoHeading, infoDescription, LinkComponent, linkText, linkHref, onLinkClick, ...props }, ref) => {
2600
+ const Select = React.forwardRef(({ className, options = [], value: controlledValue, defaultValue, onChange, placeholder = "Select an option", label, helperText, errorText, successText, validationState = "none", isDisabled = false, isRequired = false, isOptional = false, isLoading = false, size = "medium", prefix, suffix, showClearButton = false, onClear, showLeadingIcon = false, containerClassName, labelClassName, triggerClassName, menuClassName, menuWidth = "full", sectionHeading, emptyTitle = "No options available", emptyDescription = "There are no options to select from.", emptyIcon, infoHeading, infoDescription, LinkComponent, linkText, linkHref, onLinkClick, ...props }, ref) => {
2601
2601
  const [uncontrolledValue, setUncontrolledValue] = React.useState(defaultValue);
2602
2602
  const [isOpen, setIsOpen] = React.useState(false);
2603
2603
  const [dropdownPlacement, setDropdownPlacement] = React.useState("bottom");
@@ -2776,13 +2776,19 @@ const Select = React.forwardRef(({ className, options = [], value: controlledVal
2776
2776
  size,
2777
2777
  validationState: currentValidationState,
2778
2778
  isDisabled,
2779
- }), "relative w-full cursor-pointer", className), onClick: !isDisabled && !isLoading ? toggleOpen : undefined, role: "combobox", "aria-haspopup": "listbox", "aria-expanded": isOpen, "aria-disabled": isDisabled, ...props, children: [prefix && (jsx("span", { className: cn("shrink-0 flex items-center", isDisabled
2779
+ }), "relative w-full cursor-pointer", className), onClick: !isDisabled && !isLoading ? toggleOpen : undefined, role: "combobox", "aria-haspopup": "listbox", "aria-expanded": isOpen, "aria-disabled": isDisabled, ...props, children: [prefix ? (jsx("span", { className: cn("shrink-0 flex items-center", isDisabled
2780
2780
  ? "text-surface-ink-neutral-disabled"
2781
2781
  : currentValidationState === "positive"
2782
2782
  ? "text-feedback-ink-positive-intense"
2783
2783
  : currentValidationState === "negative"
2784
2784
  ? "text-feedback-ink-negative-subtle"
2785
- : "text-surface-ink-neutral-muted"), children: prefix })), jsx("span", { className: cn("flex-1 text-left truncate", !selectedOption && "text-surface-ink-neutral-muted", isDisabled && "text-surface-ink-neutral-disabled"), children: isLoading ? "Loading..." : selectedOption?.label || placeholder }), showClearButton && hasValue && !isDisabled && !isLoading && (jsx("button", { type: "button", onClick: handleClear, className: "shrink-0 flex items-center justify-center text-surface-ink-neutral-muted hover:text-surface-ink-neutral-normal transition-colors", tabIndex: -1, children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M12 4L4 12M4 4L12 12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }) })), suffix && !showClearButton && (jsx("span", { className: cn("shrink-0 flex items-center", isDisabled
2785
+ : "text-surface-ink-neutral-muted"), children: prefix })) : showLeadingIcon && selectedOption?.leadingIcon ? (jsx("span", { className: cn("shrink-0 flex items-center", isDisabled
2786
+ ? "text-surface-ink-neutral-disabled"
2787
+ : currentValidationState === "positive"
2788
+ ? "text-feedback-ink-positive-intense"
2789
+ : currentValidationState === "negative"
2790
+ ? "text-feedback-ink-negative-subtle"
2791
+ : "text-surface-ink-neutral-muted"), children: selectedOption.leadingIcon })) : null, jsx("span", { className: cn("flex-1 text-left truncate", !selectedOption && "text-surface-ink-neutral-muted", isDisabled && "text-surface-ink-neutral-disabled"), children: isLoading ? "Loading..." : selectedOption?.label || placeholder }), showClearButton && hasValue && !isDisabled && !isLoading && (jsx("button", { type: "button", onClick: handleClear, className: "shrink-0 flex items-center justify-center text-surface-ink-neutral-muted hover:text-surface-ink-neutral-normal transition-colors", tabIndex: -1, children: jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M12 4L4 12M4 4L12 12", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }) })), suffix && !showClearButton && (jsx("span", { className: cn("shrink-0 flex items-center", isDisabled
2786
2792
  ? "text-surface-ink-neutral-disabled"
2787
2793
  : currentValidationState === "positive"
2788
2794
  ? "text-feedback-ink-positive-intense"
@@ -3092,6 +3098,132 @@ const Radio = React.forwardRef(({ label, errorText, size = "medium", validationS
3092
3098
  });
3093
3099
  Radio.displayName = "Radio";
3094
3100
 
3101
+ const RadioGroup = React.forwardRef(({ value: controlledValue, defaultValue, onChange, options, children, label, helperText, errorText, successText, validationState = "none", isDisabled = false, isRequired = false, isOptional = false, size = "medium", name: nameProp, orientation = "vertical", spacing = "normal", containerClassName, labelClassName, groupClassName, infoHeading, infoDescription, LinkComponent, linkText, linkHref, onLinkClick, className, id, ...props }, ref) => {
3102
+ const [uncontrolledValue, setUncontrolledValue] = React.useState(defaultValue);
3103
+ const groupId = React.useId();
3104
+ const name = nameProp || `radio-group-${groupId}`;
3105
+ const groupRef = React.useRef(null);
3106
+ const radioRefs = React.useRef([]);
3107
+ const value = controlledValue !== undefined ? controlledValue : uncontrolledValue;
3108
+ // Determine which helper text to show
3109
+ const displayHelperText = errorText || successText || helperText;
3110
+ const currentValidationState = errorText ? "error" : validationState;
3111
+ const handleChange = (optionValue) => {
3112
+ if (onChange) {
3113
+ onChange(optionValue);
3114
+ }
3115
+ else {
3116
+ setUncontrolledValue(optionValue);
3117
+ }
3118
+ };
3119
+ // Keyboard navigation
3120
+ const handleKeyDown = (e) => {
3121
+ if (isDisabled)
3122
+ return;
3123
+ const currentIndex = radioRefs.current.findIndex((ref) => ref === document.activeElement);
3124
+ if (currentIndex === -1)
3125
+ return;
3126
+ const direction = orientation === "horizontal"
3127
+ ? (e.key === "ArrowRight" ? 1 : e.key === "ArrowLeft" ? -1 : 0)
3128
+ : (e.key === "ArrowDown" ? 1 : e.key === "ArrowUp" ? -1 : 0);
3129
+ if (direction === 0)
3130
+ return;
3131
+ e.preventDefault();
3132
+ // Find next enabled radio
3133
+ let nextIndex = currentIndex;
3134
+ const total = radioRefs.current.length;
3135
+ let attempts = 0;
3136
+ while (attempts < total) {
3137
+ nextIndex = (nextIndex + direction + total) % total;
3138
+ const nextRadio = radioRefs.current[nextIndex];
3139
+ if (nextRadio && !nextRadio.disabled) {
3140
+ nextRadio.focus();
3141
+ nextRadio.click();
3142
+ return;
3143
+ }
3144
+ attempts++;
3145
+ }
3146
+ };
3147
+ // Spacing configuration
3148
+ const spacingConfig = {
3149
+ tight: orientation === "horizontal" ? "gap-3" : "gap-2",
3150
+ normal: orientation === "horizontal" ? "gap-4" : "gap-3",
3151
+ loose: orientation === "horizontal" ? "gap-6" : "gap-4",
3152
+ };
3153
+ // Size configuration
3154
+ const sizeConfig = {
3155
+ small: {
3156
+ gap: "gap-2",
3157
+ },
3158
+ medium: {
3159
+ gap: "gap-2",
3160
+ },
3161
+ large: {
3162
+ gap: "gap-3",
3163
+ },
3164
+ };
3165
+ // Render options from array
3166
+ const renderOptions = () => {
3167
+ if (!options)
3168
+ return null;
3169
+ return options.map((option, index) => {
3170
+ const isChecked = value === option.value;
3171
+ const optionDisabled = isDisabled || option.isDisabled;
3172
+ return (jsx(Radio, { ref: (el) => {
3173
+ radioRefs.current[index] = el;
3174
+ }, name: name, value: option.value, label: option.label, checked: isChecked, onChange: (e) => {
3175
+ if (e.target.checked) {
3176
+ handleChange(option.value);
3177
+ }
3178
+ }, size: size, validationState: currentValidationState, isDisabled: optionDisabled, showErrorText: false, containerClassName: option.containerClassName, labelClassName: option.labelClassName }, option.value));
3179
+ });
3180
+ };
3181
+ // Clone children and inject props
3182
+ const renderChildren = () => {
3183
+ if (!children)
3184
+ return null;
3185
+ return React.Children.map(children, (child, index) => {
3186
+ if (!React.isValidElement(child)) {
3187
+ return child;
3188
+ }
3189
+ const childValue = child.props.value;
3190
+ const isChecked = value === childValue;
3191
+ const childDisabled = isDisabled || child.props.isDisabled;
3192
+ return React.cloneElement(child, {
3193
+ ...child.props,
3194
+ ref: (el) => {
3195
+ radioRefs.current[index] = el;
3196
+ // Preserve original ref if it exists
3197
+ const originalRef = child.ref;
3198
+ if (typeof originalRef === "function") {
3199
+ originalRef(el);
3200
+ }
3201
+ else if (originalRef && "current" in originalRef) {
3202
+ originalRef.current = el;
3203
+ }
3204
+ },
3205
+ name,
3206
+ checked: isChecked,
3207
+ onChange: (e) => {
3208
+ if (e.target.checked) {
3209
+ handleChange(childValue || "");
3210
+ }
3211
+ // Call original onChange if it exists
3212
+ if (child.props.onChange) {
3213
+ child.props.onChange(e);
3214
+ }
3215
+ },
3216
+ size: child.props.size || size,
3217
+ validationState: child.props.validationState || currentValidationState,
3218
+ isDisabled: childDisabled,
3219
+ showErrorText: false,
3220
+ });
3221
+ });
3222
+ };
3223
+ return (jsxs("div", { ref: ref, className: cn("w-full flex flex-col", sizeConfig[size].gap, containerClassName), ...props, children: [label && (jsx(FormHeader, { label: label, size: size, isRequired: isRequired, isOptional: isOptional, infoHeading: infoHeading, infoDescription: infoDescription, LinkComponent: LinkComponent, linkText: linkText, linkHref: linkHref, onLinkClick: onLinkClick, htmlFor: id, className: "mb-2", labelClassName: labelClassName })), jsx("div", { ref: groupRef, role: "radiogroup", "aria-label": label, "aria-required": isRequired, "aria-invalid": currentValidationState === "error", "aria-disabled": isDisabled, className: cn("flex", orientation === "horizontal" ? "flex-row items-center" : "flex-col items-start", spacingConfig[spacing], groupClassName, className), onKeyDown: handleKeyDown, id: id, children: options ? renderOptions() : renderChildren() }), jsx(FormFooter, { helperText: displayHelperText, validationState: currentValidationState === "none" ? "default" : currentValidationState, size: size, isDisabled: isDisabled, className: "mt-1" })] }));
3224
+ });
3225
+ RadioGroup.displayName = "RadioGroup";
3226
+
3095
3227
  const textFieldVariants = cva("relative flex items-center gap-2 border rounded-large transition-all font-functional font-size-100 leading-100", {
3096
3228
  variants: {
3097
3229
  size: {
@@ -4686,5 +4818,5 @@ const UploadBox = React.forwardRef(({ label, helperText, errorText, successText,
4686
4818
  });
4687
4819
  UploadBox.displayName = "UploadBox";
4688
4820
 
4689
- export { Alert, Amount, Avatar, AvatarCell, Badge, Button, ButtonGroup, Checkbox, Counter, DatePicker, Divider, Dropdown, DropdownMenu, FormFooter, FormHeader, Icon, IconButton, IconCell, Link, ListItem, Modal, NumberCell, Pagination, Radio, SearchableDropdown, Select, SelectTextField, Skeleton, SlotCell, SpacerCell, Switch, TabItem, Table, TableDetailPanel, Tabs, Text, TextArea, TextField, Tooltip, UploadBox, alertVariants, avatarVariants, badgeVariants, buttonGroupVariants, buttonVariants, checkboxVariants, cn, counterVariants, datePickerVariants, dropdownVariants, getAvailableIcons, hasIcon, iconButtonVariants, iconRegistry, linkVariants, listItemVariants, paginationVariants, radioVariants, selectTriggerVariants, selectVariants, switchVariants, tableCellVariants, tableHeaderVariants, tableVariants, textAreaVariants, textFieldVariants, tooltipVariants, uploadBoxVariants };
4821
+ export { Alert, Amount, Avatar, AvatarCell, Badge, Button, ButtonGroup, Checkbox, Counter, DatePicker, Divider, Dropdown, DropdownMenu, FormFooter, FormHeader, Icon, IconButton, IconCell, Link, ListItem, Modal, NumberCell, Pagination, Radio, RadioGroup, SearchableDropdown, Select, SelectTextField, Skeleton, SlotCell, SpacerCell, Switch, TabItem, Table, TableDetailPanel, Tabs, Text, TextArea, TextField, Tooltip, UploadBox, alertVariants, avatarVariants, badgeVariants, buttonGroupVariants, buttonVariants, checkboxVariants, cn, counterVariants, datePickerVariants, dropdownVariants, getAvailableIcons, hasIcon, iconButtonVariants, iconRegistry, linkVariants, listItemVariants, paginationVariants, radioVariants, selectTriggerVariants, selectVariants, switchVariants, tableCellVariants, tableHeaderVariants, tableVariants, textAreaVariants, textFieldVariants, tooltipVariants, uploadBoxVariants };
4690
4822
  //# sourceMappingURL=index.esm.js.map