@modlin/ui 0.0.244 → 0.0.245

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 (4) hide show
  1. package/package.json +1 -1
  2. package/src/checkbox.tsx +1 -1
  3. package/src/input.tsx +31 -31
  4. package/src/select.native.tsx +10 -2
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "$schema": "https://json.schemastore.org/package",
3
3
  "name": "@modlin/ui",
4
4
  "description": "A lightweight UI library built on the Suffix design system for consistent, fast, and elegant interfaces.",
5
- "version": "0.0.244",
5
+ "version": "0.0.245",
6
6
  "main": "src/index.ts",
7
7
  "type": "module",
8
8
  "exports": {
package/src/checkbox.tsx CHANGED
@@ -34,7 +34,7 @@ export interface CheckboxProps {
34
34
  }
35
35
  export default function Checkbox(props: Readonly<CheckboxProps>): ReactElement<CheckboxProps> {
36
36
  const input = useRef<HTMLInputElement>(null)
37
- const button = useRef<HTMLInputElement>(null)
37
+ const button = useRef<HTMLButtonElement>(null)
38
38
  let checked = props.checked || props.defaultChecked || false
39
39
 
40
40
  return (
package/src/input.tsx CHANGED
@@ -34,55 +34,55 @@ type InputMode = "search" | "text" | "email" | "tel" | "url" | "none" | "numeric
34
34
  type BlurEvent = FocusEvent<HTMLInputElement, Element>
35
35
 
36
36
  export interface InputProps {
37
- /** @android @ios @web */
37
+ /** @android @ios @web */
38
38
  placeholder?: string
39
- /** @android @ios @web */
39
+ /** @android @ios @web */
40
40
  defaultValue?: string
41
- /** @android @ios @web */
41
+ /** @android @ios @web */
42
42
  inputMode?: InputMode
43
- /** @android @ios @web */
43
+ /** @android @ios @web */
44
44
  value?: string
45
- /** @android @ios @web */
45
+ /** @android @ios @web */
46
46
  readOnly?: boolean
47
- /** @android @ios @web */
47
+ /** @android @ios @web */
48
48
  maxLength?: number
49
- /** @android @ios @web */
49
+ /** @android @ios @web */
50
50
  autoCapitalize?: "none" | "sentences" | "words" | "characters"
51
- /** @android @ios @web */
51
+ /** @android @ios @web */
52
52
  autoComplete?: HTMLInputAutoCompleteAttribute
53
- /** @android @ios @web */
53
+ /** @android @ios @web */
54
54
  autoCorrect?: boolean
55
- /** @android @ios @web */
55
+ /** @android @ios @web */
56
56
  variant?: Variant
57
- /** @web */
57
+ /** @web */
58
58
  id?: string
59
- /** @web */
59
+ /** @web */
60
60
  type?: InputType
61
- /** @web */
61
+ /** @web */
62
62
  name?: string
63
- /** @web */
63
+ /** @web */
64
64
  required?: boolean // validation
65
- /** @web */
65
+ /** @web */
66
66
  disabled?: boolean
67
- /** @web */
67
+ /** @web */
68
68
  pattern?: string // validation
69
- /** @web */
69
+ /** @web */
70
70
  min?: number | string // validation
71
- /** @web */
71
+ /** @web */
72
72
  max?: number | string // validation
73
- /** @web */
73
+ /** @web */
74
74
  minLength?: number // validation
75
- /** @web */
75
+ /** @web */
76
76
  invalid?: boolean
77
- /** @web */
77
+ /** @web */
78
78
  describedby?: string
79
- /** @web */
79
+ /** @web */
80
80
  className?: string
81
- /** @android @ios @web */
82
- onChange?(event: ChangeEvent): void
83
- /** @android @ios @web */
84
- onFocus?(event: FocusEvent): void
85
- /** @android @ios @web */
81
+ /** @android @ios @web */
82
+ onChange?(event: ChangeEvent<HTMLInputElement>): void
83
+ /** @android @ios @web */
84
+ onFocus?(event: FocusEvent<HTMLInputElement>): void
85
+ /** @android @ios @web */
86
86
  onBlur?(event: BlurEvent): void
87
87
  }
88
88
  const Input = forwardRef<HTMLInputElement, Readonly<InputProps>>((props, ref) => {
@@ -106,13 +106,13 @@ const Input = forwardRef<HTMLInputElement, Readonly<InputProps>>((props, ref) =>
106
106
  readOnly={props.readOnly}
107
107
  disabled={props.disabled}
108
108
  onChange={onChange}
109
- onFocus={props.onFocus}
110
- onBlur={props.onBlur}
109
+ onFocus={props.onFocus}
110
+ onBlur={props.onBlur}
111
111
  onInvalid={e => e.preventDefault()}
112
112
  id={props.id}
113
- autoCapitalize={props.autoCapitalize}
113
+ autoCapitalize={props.autoCapitalize}
114
114
  autoComplete={props.autoComplete}
115
- autoCorrect={props.autoCorrect ? "on" : "off"}
115
+ autoCorrect={props.autoCorrect ? "on" : "off"}
116
116
  aria-describedby={props.describedby}
117
117
  data-invalid={props.invalid}
118
118
  className={cn(
package/src/select.native.tsx CHANGED
@@ -1,15 +1,17 @@
1
- import type { ChangeEvent, ReactNode } from "react"
1
+ import { useRef, type ChangeEvent, type ReactNode } from "react"
2
2
  import { cn } from "./utils"
3
3
 
4
4
  export interface SelectProps {
5
- children?: ReactNode
5
+ defaultValue?: string
6
6
  name?: string
7
7
  id?: string
8
+ children?: ReactNode
8
9
  onChange?: (event: ChangeEvent<HTMLSelectElement>) => void
9
10
  }
10
11
  export function Select(props: SelectProps) {
11
12
  return (
12
13
  <select
14
+ defaultValue={props.defaultValue}
13
15
  name={props.name}
14
16
  id={props.id}
15
17
  onChange={props.onChange}
@@ -25,6 +27,9 @@ export function Select(props: SelectProps) {
25
27
  }
26
28
 
27
29
  export interface SelectItemProps {
30
+ disabled?: boolean
31
+ selected?: boolean
32
+ hidden?: boolean
28
33
  value: string
29
34
  children?: ReactNode
30
35
  className?: string
@@ -38,6 +43,9 @@ export function SelectItem(props: SelectItemProps) {
38
43
  props.className,
39
44
  )}
40
45
  value={props.value}
46
+ disabled={props.disabled}
47
+ selected={props.selected}
48
+ hidden={props.hidden}
41
49
  >
42
50
  {props.children}
43
51
  </option>