@dnotrever2/super-kit 0.1.18 → 0.1.20

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.
Files changed (13) hide show
  1. package/README.md +9 -0
  2. package/dist/Accordion/Accordion.d.ts +4 -4
  3. package/dist/DateTimeInput/DateTimeInput.d.ts +15 -11
  4. package/dist/Input/Input.d.ts +22 -12
  5. package/dist/Select/Select.d.ts +14 -6
  6. package/dist/Tabs/Tabs.d.ts +4 -4
  7. package/dist/Textarea/Textarea.d.ts +21 -13
  8. package/dist/super-kit.cjs +1 -1
  9. package/dist/super-kit.cjs.map +1 -1
  10. package/dist/super-kit.css +1 -1
  11. package/dist/super-kit.js +1786 -1622
  12. package/dist/super-kit.js.map +1 -1
  13. package/package.json +1 -1
package/README.md CHANGED
@@ -302,6 +302,12 @@ import { Input } from "@dnotrever2/super-kit";
302
302
 
303
303
  // Select all on focus, right-aligned text
304
304
  <Input selectOnFocus textAlign="right" defaultValue="127.0.0.1" />
305
+
306
+ // Number input — rendered as text, accepts digits only
307
+ <Input label="replicas" type="number" showNumberControls min="0" max="9" />
308
+
309
+ // Password input — includes a reveal button by default
310
+ <Input label="password" type="password" />
305
311
  ```
306
312
 
307
313
  **How masks work**
@@ -314,11 +320,14 @@ import { Input } from "@dnotrever2/super-kit";
314
320
  | Prop | Type | Default |
315
321
  | ------------------------ | --------------------------------------- | ------- |
316
322
  | `label` | `string` | — |
323
+ | `type` | `InputHTMLAttributes["type"]` | `"text"` |
317
324
  | `icon` | `ReactNode` | — |
318
325
  | `mask` | `string` | — |
319
326
  | `maskAllowedPattern` | `RegExp` | — |
320
327
  | `maskPlaceholder` | `string` | — |
321
328
  | `clearable` | `boolean` | `false` |
329
+ | `showNumberControls` | `boolean` | `false` |
330
+ | `showPasswordToggle` | `boolean` | `true` |
322
331
  | `rounded` | `boolean` | `false` |
323
332
  | `selectOnFocus` | `boolean` | `false` |
324
333
  | `textAlign` | `"left" \| "center" \| "right"` | — |
package/dist/Accordion/Accordion.d.ts CHANGED
@@ -16,9 +16,6 @@ export type AccordionItem = {
16
16
  };
17
17
  export type AccordionProps = Omit<HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> & {
18
18
  items: AccordionItem[];
19
- value?: AccordionValue;
20
- defaultValue?: AccordionValue;
21
- onValueChange?: (value: AccordionValue) => void;
22
19
  multiple?: boolean;
23
20
  hideIndicator?: boolean;
24
21
  indicator?: AccordionIndicator;
@@ -35,8 +32,11 @@ export type AccordionProps = Omit<HTMLAttributes<HTMLDivElement>, "defaultValue"
35
32
  bodyStyle?: CSSProperties;
36
33
  triggerClassName?: string;
37
34
  contentClassName?: string;
35
+ value?: AccordionValue;
36
+ defaultValue?: AccordionValue;
37
+ onValueChange?: (value: AccordionValue) => void;
38
38
  };
39
- export declare function Accordion({ items, value, defaultValue, onValueChange, multiple, hideIndicator, indicator, border, highlight, radius, hoverHighlight, spacing, disabled, itemClassName, headerClassName, headerStyle, bodyClassName, bodyStyle, triggerClassName, contentClassName, className, style, ...props }: AccordionProps): import("react/jsx-runtime").JSX.Element;
39
+ export declare function Accordion({ items, multiple, hideIndicator, indicator, border, highlight, radius, hoverHighlight, spacing, disabled, itemClassName, headerClassName, headerStyle, bodyClassName, bodyStyle, triggerClassName, contentClassName, value, defaultValue, onValueChange, className, style, ...props }: AccordionProps): import("react/jsx-runtime").JSX.Element;
40
40
  export declare namespace Accordion {
41
41
  var displayName: string;
42
42
  }
package/dist/DateTimeInput/DateTimeInput.d.ts CHANGED
@@ -1,34 +1,38 @@
1
- import { default as React, ButtonHTMLAttributes, ChangeEvent, HTMLAttributes, InputHTMLAttributes } from 'react';
1
+ import { default as React, ButtonHTMLAttributes, ChangeEvent, HTMLAttributes, InputHTMLAttributes, ReactNode } from 'react';
2
2
  export type DateTimeInputMode = "date" | "time" | "datetime" | "month";
3
3
  export type DateTimeInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "defaultValue" | "onChange" | "type" | "value"> & {
4
4
  mode?: DateTimeInputMode;
5
5
  label?: string;
6
- value?: string;
7
- defaultValue?: string;
6
+ helpText?: ReactNode;
8
7
  clearable?: boolean;
9
8
  clearLabel?: string;
10
9
  showIcon?: boolean;
11
10
  openPickerOnClick?: boolean;
12
- inputProps?: InputHTMLAttributes<HTMLInputElement>;
13
- wrapperProps?: HTMLAttributes<HTMLSpanElement>;
14
- fieldProps?: HTMLAttributes<HTMLDivElement>;
11
+ isInvalid?: boolean;
15
12
  clearButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
13
+ value?: string;
14
+ defaultValue?: string;
16
15
  onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
17
16
  onValueChange?: (value: string) => void;
17
+ fieldProps?: HTMLAttributes<HTMLDivElement>;
18
+ wrapperProps?: HTMLAttributes<HTMLSpanElement>;
19
+ inputProps?: InputHTMLAttributes<HTMLInputElement>;
18
20
  };
19
21
  export declare const DateTimeInput: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "defaultValue" | "onChange" | "value" | "type"> & {
20
22
  mode?: DateTimeInputMode;
21
23
  label?: string;
22
- value?: string;
23
- defaultValue?: string;
24
+ helpText?: ReactNode;
24
25
  clearable?: boolean;
25
26
  clearLabel?: string;
26
27
  showIcon?: boolean;
27
28
  openPickerOnClick?: boolean;
28
- inputProps?: InputHTMLAttributes<HTMLInputElement>;
29
- wrapperProps?: HTMLAttributes<HTMLSpanElement>;
30
- fieldProps?: HTMLAttributes<HTMLDivElement>;
29
+ isInvalid?: boolean;
31
30
  clearButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
31
+ value?: string;
32
+ defaultValue?: string;
32
33
  onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
33
34
  onValueChange?: (value: string) => void;
35
+ fieldProps?: HTMLAttributes<HTMLDivElement>;
36
+ wrapperProps?: HTMLAttributes<HTMLSpanElement>;
37
+ inputProps?: InputHTMLAttributes<HTMLInputElement>;
34
38
  } & React.RefAttributes<HTMLInputElement>>;
package/dist/Input/Input.d.ts CHANGED
@@ -3,45 +3,55 @@ export type InputValueChange = {
3
3
  value: string;
4
4
  rawValue: string;
5
5
  };
6
- export type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "defaultValue" | "onChange" | "value"> & {
6
+ export type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, "defaultValue" | "onChange" | "type" | "value"> & {
7
7
  label?: string;
8
+ helpText?: ReactNode;
8
9
  icon?: ReactNode;
9
10
  iconPosition?: "left" | "right";
10
- value?: string;
11
- defaultValue?: string;
11
+ type?: InputHTMLAttributes<HTMLInputElement>["type"];
12
12
  mask?: string;
13
13
  maskPlaceholder?: string;
14
14
  maskAllowedPattern?: RegExp;
15
15
  clearable?: boolean;
16
16
  clearLabel?: string;
17
+ showNumberControls?: boolean;
18
+ showPasswordToggle?: boolean;
17
19
  rounded?: boolean;
18
20
  selectOnFocus?: boolean;
19
21
  textAlign?: "left" | "center" | "right";
20
- inputProps?: InputHTMLAttributes<HTMLInputElement>;
21
- wrapperProps?: HTMLAttributes<HTMLSpanElement>;
22
- fieldProps?: HTMLAttributes<HTMLDivElement>;
22
+ isInvalid?: boolean;
23
23
  clearButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
24
+ value?: string;
25
+ defaultValue?: string;
24
26
  onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
25
27
  onValueChange?: (change: InputValueChange) => void;
28
+ fieldProps?: HTMLAttributes<HTMLDivElement>;
29
+ wrapperProps?: HTMLAttributes<HTMLSpanElement>;
30
+ inputProps?: InputHTMLAttributes<HTMLInputElement>;
26
31
  };
27
- export declare const Input: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "defaultValue" | "onChange" | "value"> & {
32
+ export declare const Input: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "defaultValue" | "onChange" | "value" | "type"> & {
28
33
  label?: string;
34
+ helpText?: ReactNode;
29
35
  icon?: ReactNode;
30
36
  iconPosition?: "left" | "right";
31
- value?: string;
32
- defaultValue?: string;
37
+ type?: InputHTMLAttributes<HTMLInputElement>["type"];
33
38
  mask?: string;
34
39
  maskPlaceholder?: string;
35
40
  maskAllowedPattern?: RegExp;
36
41
  clearable?: boolean;
37
42
  clearLabel?: string;
43
+ showNumberControls?: boolean;
44
+ showPasswordToggle?: boolean;
38
45
  rounded?: boolean;
39
46
  selectOnFocus?: boolean;
40
47
  textAlign?: "left" | "center" | "right";
41
- inputProps?: InputHTMLAttributes<HTMLInputElement>;
42
- wrapperProps?: HTMLAttributes<HTMLSpanElement>;
43
- fieldProps?: HTMLAttributes<HTMLDivElement>;
48
+ isInvalid?: boolean;
44
49
  clearButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
50
+ value?: string;
51
+ defaultValue?: string;
45
52
  onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
46
53
  onValueChange?: (change: InputValueChange) => void;
54
+ fieldProps?: HTMLAttributes<HTMLDivElement>;
55
+ wrapperProps?: HTMLAttributes<HTMLSpanElement>;
56
+ inputProps?: InputHTMLAttributes<HTMLInputElement>;
47
57
  } & React.RefAttributes<HTMLInputElement>>;
package/dist/Select/Select.d.ts CHANGED
@@ -10,9 +10,8 @@ export type SelectOptionsPosition = "bottom" | "top";
10
10
  export type SelectOptionsAlign = "left" | "center" | "right";
11
11
  export type SelectProps<Value extends string = string> = Omit<HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> & {
12
12
  label?: string;
13
+ helpText?: ReactNode;
13
14
  options: SelectOption<Value>[];
14
- value?: SelectValue<Value>;
15
- defaultValue?: SelectValue<Value>;
16
15
  multiple?: boolean;
17
16
  searchable?: boolean;
18
17
  clearable?: boolean;
@@ -28,16 +27,20 @@ export type SelectProps<Value extends string = string> = Omit<HTMLAttributes<HTM
28
27
  showClearAll?: boolean;
29
28
  showSelectedValues?: boolean;
30
29
  closeOnSelect?: boolean;
31
- selectProps?: ButtonHTMLAttributes<HTMLButtonElement>;
30
+ isInvalid?: boolean;
32
31
  filterOptions?: (options: SelectOption<Value>[], searchValue: string) => SelectOption<Value>[];
33
32
  onSearchChange?: (searchValue: string) => void;
33
+ value?: SelectValue<Value>;
34
+ defaultValue?: SelectValue<Value>;
34
35
  onValueChange?: (value: SelectValue<Value>, selectedOptions: SelectOption<Value>[]) => void;
36
+ fieldProps?: HTMLAttributes<HTMLDivElement>;
37
+ wrapperProps?: HTMLAttributes<HTMLDivElement>;
38
+ selectProps?: ButtonHTMLAttributes<HTMLButtonElement>;
35
39
  };
36
40
  export declare const Select: import('react').ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> & {
37
41
  label?: string;
42
+ helpText?: ReactNode;
38
43
  options: SelectOption<string>[];
39
- value?: SelectValue<string> | undefined;
40
- defaultValue?: SelectValue<string> | undefined;
41
44
  multiple?: boolean;
42
45
  searchable?: boolean;
43
46
  clearable?: boolean;
@@ -53,8 +56,13 @@ export declare const Select: import('react').ForwardRefExoticComponent<Omit<HTML
53
56
  showClearAll?: boolean;
54
57
  showSelectedValues?: boolean;
55
58
  closeOnSelect?: boolean;
56
- selectProps?: ButtonHTMLAttributes<HTMLButtonElement>;
59
+ isInvalid?: boolean;
57
60
  filterOptions?: ((options: SelectOption<string>[], searchValue: string) => SelectOption<string>[]) | undefined;
58
61
  onSearchChange?: (searchValue: string) => void;
62
+ value?: SelectValue<string> | undefined;
63
+ defaultValue?: SelectValue<string> | undefined;
59
64
  onValueChange?: ((value: SelectValue<string>, selectedOptions: SelectOption<string>[]) => void) | undefined;
65
+ fieldProps?: HTMLAttributes<HTMLDivElement>;
66
+ wrapperProps?: HTMLAttributes<HTMLDivElement>;
67
+ selectProps?: ButtonHTMLAttributes<HTMLButtonElement>;
60
68
  } & import('react').RefAttributes<HTMLDivElement>>;
package/dist/Tabs/Tabs.d.ts CHANGED
@@ -15,9 +15,6 @@ export type TabItem = {
15
15
  };
16
16
  export type TabsProps = HTMLAttributes<HTMLDivElement> & {
17
17
  items: TabItem[];
18
- value?: string;
19
- defaultValue?: string;
20
- onValueChange?: (value: string) => void;
21
18
  variant?: TabsVariant;
22
19
  ariaLabel?: string;
23
20
  disabled?: boolean;
@@ -28,8 +25,11 @@ export type TabsProps = HTMLAttributes<HTMLDivElement> & {
28
25
  tabItemClassName?: string;
29
26
  transparent?: boolean;
30
27
  inactiveTransparent?: boolean;
28
+ value?: string;
29
+ defaultValue?: string;
30
+ onValueChange?: (value: string) => void;
31
31
  };
32
- export declare function Tabs({ items, value, defaultValue, onValueChange, variant, ariaLabel, disabled, closable, closeLabel, onTabClose, tabClassName, tabItemClassName, transparent, inactiveTransparent, className, ...props }: TabsProps): import("react/jsx-runtime").JSX.Element;
32
+ export declare function Tabs({ items, variant, ariaLabel, disabled, closable, closeLabel, onTabClose, tabClassName, tabItemClassName, transparent, inactiveTransparent, value, defaultValue, onValueChange, className, ...props }: TabsProps): import("react/jsx-runtime").JSX.Element;
33
33
  export declare namespace Tabs {
34
34
  var displayName: string;
35
35
  }
package/dist/Textarea/Textarea.d.ts CHANGED
@@ -1,31 +1,39 @@
1
- import { ButtonHTMLAttributes, HTMLAttributes, TextareaHTMLAttributes } from 'react';
1
+ import { ReactNode, ButtonHTMLAttributes, HTMLAttributes, TextareaHTMLAttributes } from 'react';
2
2
  export type TextareaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "defaultValue" | "onChange" | "value"> & {
3
3
  label?: string;
4
- helpText?: string;
4
+ helpText?: ReactNode;
5
5
  maxLength?: number;
6
6
  clearable?: boolean;
7
- mono?: boolean;
7
+ minRows?: number;
8
+ maxRows?: number;
9
+ unlimitedRows?: boolean;
10
+ resize?: "horizontal" | "vertical" | "both";
11
+ isInvalid?: boolean;
12
+ clearButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
8
13
  value?: string;
9
14
  defaultValue?: string;
10
- textareaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;
11
- wrapperProps?: HTMLAttributes<HTMLDivElement>;
12
- fieldProps?: HTMLAttributes<HTMLDivElement>;
13
- clearButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
14
15
  onChange?: TextareaHTMLAttributes<HTMLTextAreaElement>["onChange"];
15
16
  onValueChange?: (value: string) => void;
17
+ fieldProps?: HTMLAttributes<HTMLDivElement>;
18
+ wrapperProps?: HTMLAttributes<HTMLDivElement>;
19
+ textareaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;
16
20
  };
17
21
  export declare const Textarea: import('react').ForwardRefExoticComponent<Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "defaultValue" | "onChange" | "value"> & {
18
22
  label?: string;
19
- helpText?: string;
23
+ helpText?: ReactNode;
20
24
  maxLength?: number;
21
25
  clearable?: boolean;
22
- mono?: boolean;
26
+ minRows?: number;
27
+ maxRows?: number;
28
+ unlimitedRows?: boolean;
29
+ resize?: "horizontal" | "vertical" | "both";
30
+ isInvalid?: boolean;
31
+ clearButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
23
32
  value?: string;
24
33
  defaultValue?: string;
25
- textareaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;
26
- wrapperProps?: HTMLAttributes<HTMLDivElement>;
27
- fieldProps?: HTMLAttributes<HTMLDivElement>;
28
- clearButtonProps?: ButtonHTMLAttributes<HTMLButtonElement>;
29
34
  onChange?: TextareaHTMLAttributes<HTMLTextAreaElement>["onChange"];
30
35
  onValueChange?: (value: string) => void;
36
+ fieldProps?: HTMLAttributes<HTMLDivElement>;
37
+ wrapperProps?: HTMLAttributes<HTMLDivElement>;
38
+ textareaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;
31
39
  } & import('react').RefAttributes<HTMLTextAreaElement>>;