@yamada-ui/native-select 0.4.9 → 0.5.0

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 (10) hide show
  1. package/dist/{chunk-6KO77FUQ.mjs → chunk-UQC6YIIC.mjs} +11 -12
  2. package/dist/index.d.mts +1 -1
  3. package/dist/index.d.ts +1 -1
  4. package/dist/index.js +11 -11
  5. package/dist/index.mjs +1 -1
  6. package/dist/native-select.d.mts +17 -11
  7. package/dist/native-select.d.ts +17 -11
  8. package/dist/native-select.js +11 -11
  9. package/dist/native-select.mjs +1 -1
  10. package/package.json +1 -1
package/dist/{chunk-6KO77FUQ.mjs → chunk-UQC6YIIC.mjs} RENAMED
@@ -19,7 +19,6 @@ import {
19
19
  splitObject,
20
20
  getValidChildren,
21
21
  isValidElement,
22
- isArray,
23
22
  pickObject
24
23
  } from "@yamada-ui/utils";
25
24
  import {
@@ -42,7 +41,7 @@ var NativeSelect = forwardRef(
42
41
  height,
43
42
  minH,
44
43
  minHeight,
45
- options = [],
44
+ items = [],
46
45
  placeholder,
47
46
  containerProps,
48
47
  iconProps,
@@ -52,16 +51,16 @@ var NativeSelect = forwardRef(
52
51
  const formControlProps = pickObject(rest, formControlProperties);
53
52
  const [layoutProps, selectProps] = splitObject(rest, layoutStylesProperties);
54
53
  let computedChildren = [];
55
- if (!children && options.length) {
56
- computedChildren = options.map(({ label, value, ...props2 }, i) => {
57
- if (!isArray(value)) {
54
+ if (!children && items.length) {
55
+ computedChildren = items.map((item, i) => {
56
+ if ("value" in item) {
57
+ const { label, value, ...props2 } = item;
58
58
  return /* @__PURE__ */ jsx(NativeOption, { value, ...props2, children: label }, i);
59
- } else {
60
- return /* @__PURE__ */ jsx(NativeOptionGroup, { label, ...props2, children: value.map(
61
- ({ label: label2, value: value2, ...props3 }, i2) => !isArray(value2) ? /* @__PURE__ */ jsx(NativeOption, { value: value2, ...props3, children: label2 }, i2) : null
62
- ) }, i);
59
+ } else if ("items" in item) {
60
+ const { label, items: items2 = [], ...props2 } = item;
61
+ return /* @__PURE__ */ jsx(NativeOptionGroup, { label, ...props2, children: items2.map(({ label: label2, value, ...props3 }, i2) => /* @__PURE__ */ jsx(NativeOption, { value, ...props3, children: label2 }, i2)) }, i);
63
62
  }
64
- });
63
+ }).filter(Boolean);
65
64
  }
66
65
  return /* @__PURE__ */ jsx(NativeSelectProvider, { value: styles, children: /* @__PURE__ */ jsxs(
67
66
  ui.div,
@@ -82,7 +81,7 @@ var NativeSelect = forwardRef(
82
81
  ui.select,
83
82
  {
84
83
  ref,
85
- className: cx("ui-native-select-field", className),
84
+ className: cx("ui-native-select__field", className),
86
85
  __css: {
87
86
  paddingEnd: "2rem",
88
87
  h: h != null ? h : height,
@@ -133,7 +132,7 @@ var NativeSelectIcon = ({
133
132
  return /* @__PURE__ */ jsx(
134
133
  ui.div,
135
134
  {
136
- className: cx("ui-native-select-icon", className),
135
+ className: cx("ui-native-select__icon", className),
137
136
  __css: css,
138
137
  ...rest,
139
138
  children: isValidElement(children) ? cloneChildren : /* @__PURE__ */ jsx(ChevronIcon, {})
package/dist/index.d.mts CHANGED
@@ -1,4 +1,4 @@
1
- export { NativeOption, NativeOptionGroup, NativeOptionGroupProps, NativeOptionProps, NativeSelect, NativeSelectProps, UINativeOption } from './native-select.mjs';
1
+ export { NativeOption, NativeOptionGroup, NativeOptionGroupProps, NativeOptionProps, NativeSelect, NativeSelectItem, NativeSelectProps } from './native-select.mjs';
2
2
  import '@yamada-ui/core';
3
3
  import '@yamada-ui/form-control';
4
4
  import 'react';
package/dist/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- export { NativeOption, NativeOptionGroup, NativeOptionGroupProps, NativeOptionProps, NativeSelect, NativeSelectProps, UINativeOption } from './native-select.js';
1
+ export { NativeOption, NativeOptionGroup, NativeOptionGroupProps, NativeOptionProps, NativeSelect, NativeSelectItem, NativeSelectProps } from './native-select.js';
2
2
  import '@yamada-ui/core';
3
3
  import '@yamada-ui/form-control';
4
4
  import 'react';
package/dist/index.js CHANGED
@@ -50,7 +50,7 @@ var NativeSelect = (0, import_core.forwardRef)(
50
50
  height,
51
51
  minH,
52
52
  minHeight,
53
- options = [],
53
+ items = [],
54
54
  placeholder,
55
55
  containerProps,
56
56
  iconProps,
@@ -60,16 +60,16 @@ var NativeSelect = (0, import_core.forwardRef)(
60
60
  const formControlProps = (0, import_utils.pickObject)(rest, import_form_control.formControlProperties);
61
61
  const [layoutProps, selectProps] = (0, import_utils.splitObject)(rest, import_core.layoutStylesProperties);
62
62
  let computedChildren = [];
63
- if (!children && options.length) {
64
- computedChildren = options.map(({ label, value, ...props2 }, i) => {
65
- if (!(0, import_utils.isArray)(value)) {
63
+ if (!children && items.length) {
64
+ computedChildren = items.map((item, i) => {
65
+ if ("value" in item) {
66
+ const { label, value, ...props2 } = item;
66
67
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeOption, { value, ...props2, children: label }, i);
67
- } else {
68
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeOptionGroup, { label, ...props2, children: value.map(
69
- ({ label: label2, value: value2, ...props3 }, i2) => !(0, import_utils.isArray)(value2) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeOption, { value: value2, ...props3, children: label2 }, i2) : null
70
- ) }, i);
68
+ } else if ("items" in item) {
69
+ const { label, items: items2 = [], ...props2 } = item;
70
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeOptionGroup, { label, ...props2, children: items2.map(({ label: label2, value, ...props3 }, i2) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeOption, { value, ...props3, children: label2 }, i2)) }, i);
71
71
  }
72
- });
72
+ }).filter(Boolean);
73
73
  }
74
74
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeSelectProvider, { value: styles, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
75
75
  import_core.ui.div,
@@ -90,7 +90,7 @@ var NativeSelect = (0, import_core.forwardRef)(
90
90
  import_core.ui.select,
91
91
  {
92
92
  ref,
93
- className: (0, import_utils.cx)("ui-native-select-field", className),
93
+ className: (0, import_utils.cx)("ui-native-select__field", className),
94
94
  __css: {
95
95
  paddingEnd: "2rem",
96
96
  h: h != null ? h : height,
@@ -141,7 +141,7 @@ var NativeSelectIcon = ({
141
141
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
142
142
  import_core.ui.div,
143
143
  {
144
- className: (0, import_utils.cx)("ui-native-select-icon", className),
144
+ className: (0, import_utils.cx)("ui-native-select__icon", className),
145
145
  __css: css,
146
146
  ...rest,
147
147
  children: (0, import_utils.isValidElement)(children) ? cloneChildren : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, {})
package/dist/index.mjs CHANGED
@@ -3,7 +3,7 @@ import {
3
3
  NativeOption,
4
4
  NativeOptionGroup,
5
5
  NativeSelect
6
- } from "./chunk-6KO77FUQ.mjs";
6
+ } from "./chunk-UQC6YIIC.mjs";
7
7
  export {
8
8
  NativeOption,
9
9
  NativeOptionGroup,
package/dist/native-select.d.mts CHANGED
@@ -3,18 +3,24 @@ import { HTMLUIProps, ThemeProps } from '@yamada-ui/core';
3
3
  import { FormControlOptions } from '@yamada-ui/form-control';
4
4
  import { DetailedHTMLProps, OptionHTMLAttributes } from 'react';
5
5
 
6
- type Value = DetailedHTMLProps<OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>['value'];
7
- type UINativeOption = Omit<DetailedHTMLProps<OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>, 'label' | 'children' | 'value'> & {
6
+ type NativeSelectBaseItem = Omit<DetailedHTMLProps<OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>, "label" | "children" | "value"> & {
8
7
  label?: string;
9
- value?: Value | UINativeOption[];
10
8
  };
9
+ type Value = DetailedHTMLProps<OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>["value"];
10
+ type NativeSelectItemWithValue = NativeSelectBaseItem & {
11
+ value?: Value;
12
+ };
13
+ type NativeSelectItemWithItems = NativeSelectBaseItem & {
14
+ items?: NativeSelectItemWithValue[];
15
+ };
16
+ type NativeSelectItem = NativeSelectItemWithValue & NativeSelectItemWithItems;
11
17
  type NativeSelectOptions = {
12
18
  /**
13
- * If provided, generate options based on data.
19
+ * If provided, generate options based on items.
14
20
  *
15
21
  * @default '[]'
16
22
  */
17
- options?: UINativeOption[];
23
+ items?: NativeSelectItem[];
18
24
  /**
19
25
  * The placeholder for select.
20
26
  */
@@ -36,19 +42,19 @@ type NativeSelectOptions = {
36
42
  /**
37
43
  * Props for container element.
38
44
  */
39
- containerProps?: Omit<HTMLUIProps<'div'>, 'children'>;
45
+ containerProps?: Omit<HTMLUIProps<"div">, "children">;
40
46
  /**
41
47
  * Props for icon element.
42
48
  */
43
- iconProps?: HTMLUIProps<'div'>;
49
+ iconProps?: HTMLUIProps<"div">;
44
50
  };
45
- type NativeSelectProps = Omit<HTMLUIProps<'select'>, 'size'> & ThemeProps<'Select'> & NativeSelectOptions & FormControlOptions;
51
+ type NativeSelectProps = Omit<HTMLUIProps<"select">, "size"> & ThemeProps<"Select"> & NativeSelectOptions & FormControlOptions;
46
52
  declare const NativeSelect: _yamada_ui_core.Component<"select", NativeSelectProps>;
47
- type NativeOptionGroupProps = HTMLUIProps<'optgroup'>;
53
+ type NativeOptionGroupProps = HTMLUIProps<"optgroup">;
48
54
  declare const NativeOptionGroup: _yamada_ui_core.Component<"optgroup", NativeOptionGroupProps>;
49
- type NativeOptionProps = Omit<HTMLUIProps<'option'>, 'children'> & {
55
+ type NativeOptionProps = Omit<HTMLUIProps<"option">, "children"> & {
50
56
  children?: string;
51
57
  };
52
58
  declare const NativeOption: _yamada_ui_core.Component<"option", NativeOptionProps>;
53
59
 
54
- export { NativeOption, NativeOptionGroup, NativeOptionGroupProps, NativeOptionProps, NativeSelect, NativeSelectProps, UINativeOption };
60
+ export { NativeOption, NativeOptionGroup, NativeOptionGroupProps, NativeOptionProps, NativeSelect, NativeSelectItem, NativeSelectProps };
package/dist/native-select.d.ts CHANGED
@@ -3,18 +3,24 @@ import { HTMLUIProps, ThemeProps } from '@yamada-ui/core';
3
3
  import { FormControlOptions } from '@yamada-ui/form-control';
4
4
  import { DetailedHTMLProps, OptionHTMLAttributes } from 'react';
5
5
 
6
- type Value = DetailedHTMLProps<OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>['value'];
7
- type UINativeOption = Omit<DetailedHTMLProps<OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>, 'label' | 'children' | 'value'> & {
6
+ type NativeSelectBaseItem = Omit<DetailedHTMLProps<OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>, "label" | "children" | "value"> & {
8
7
  label?: string;
9
- value?: Value | UINativeOption[];
10
8
  };
9
+ type Value = DetailedHTMLProps<OptionHTMLAttributes<HTMLOptionElement>, HTMLOptionElement>["value"];
10
+ type NativeSelectItemWithValue = NativeSelectBaseItem & {
11
+ value?: Value;
12
+ };
13
+ type NativeSelectItemWithItems = NativeSelectBaseItem & {
14
+ items?: NativeSelectItemWithValue[];
15
+ };
16
+ type NativeSelectItem = NativeSelectItemWithValue & NativeSelectItemWithItems;
11
17
  type NativeSelectOptions = {
12
18
  /**
13
- * If provided, generate options based on data.
19
+ * If provided, generate options based on items.
14
20
  *
15
21
  * @default '[]'
16
22
  */
17
- options?: UINativeOption[];
23
+ items?: NativeSelectItem[];
18
24
  /**
19
25
  * The placeholder for select.
20
26
  */
@@ -36,19 +42,19 @@ type NativeSelectOptions = {
36
42
  /**
37
43
  * Props for container element.
38
44
  */
39
- containerProps?: Omit<HTMLUIProps<'div'>, 'children'>;
45
+ containerProps?: Omit<HTMLUIProps<"div">, "children">;
40
46
  /**
41
47
  * Props for icon element.
42
48
  */
43
- iconProps?: HTMLUIProps<'div'>;
49
+ iconProps?: HTMLUIProps<"div">;
44
50
  };
45
- type NativeSelectProps = Omit<HTMLUIProps<'select'>, 'size'> & ThemeProps<'Select'> & NativeSelectOptions & FormControlOptions;
51
+ type NativeSelectProps = Omit<HTMLUIProps<"select">, "size"> & ThemeProps<"Select"> & NativeSelectOptions & FormControlOptions;
46
52
  declare const NativeSelect: _yamada_ui_core.Component<"select", NativeSelectProps>;
47
- type NativeOptionGroupProps = HTMLUIProps<'optgroup'>;
53
+ type NativeOptionGroupProps = HTMLUIProps<"optgroup">;
48
54
  declare const NativeOptionGroup: _yamada_ui_core.Component<"optgroup", NativeOptionGroupProps>;
49
- type NativeOptionProps = Omit<HTMLUIProps<'option'>, 'children'> & {
55
+ type NativeOptionProps = Omit<HTMLUIProps<"option">, "children"> & {
50
56
  children?: string;
51
57
  };
52
58
  declare const NativeOption: _yamada_ui_core.Component<"option", NativeOptionProps>;
53
59
 
54
- export { NativeOption, NativeOptionGroup, NativeOptionGroupProps, NativeOptionProps, NativeSelect, NativeSelectProps, UINativeOption };
60
+ export { NativeOption, NativeOptionGroup, NativeOptionGroupProps, NativeOptionProps, NativeSelect, NativeSelectItem, NativeSelectProps };
package/dist/native-select.js CHANGED
@@ -48,7 +48,7 @@ var NativeSelect = (0, import_core.forwardRef)(
48
48
  height,
49
49
  minH,
50
50
  minHeight,
51
- options = [],
51
+ items = [],
52
52
  placeholder,
53
53
  containerProps,
54
54
  iconProps,
@@ -58,16 +58,16 @@ var NativeSelect = (0, import_core.forwardRef)(
58
58
  const formControlProps = (0, import_utils.pickObject)(rest, import_form_control.formControlProperties);
59
59
  const [layoutProps, selectProps] = (0, import_utils.splitObject)(rest, import_core.layoutStylesProperties);
60
60
  let computedChildren = [];
61
- if (!children && options.length) {
62
- computedChildren = options.map(({ label, value, ...props2 }, i) => {
63
- if (!(0, import_utils.isArray)(value)) {
61
+ if (!children && items.length) {
62
+ computedChildren = items.map((item, i) => {
63
+ if ("value" in item) {
64
+ const { label, value, ...props2 } = item;
64
65
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeOption, { value, ...props2, children: label }, i);
65
- } else {
66
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeOptionGroup, { label, ...props2, children: value.map(
67
- ({ label: label2, value: value2, ...props3 }, i2) => !(0, import_utils.isArray)(value2) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeOption, { value: value2, ...props3, children: label2 }, i2) : null
68
- ) }, i);
66
+ } else if ("items" in item) {
67
+ const { label, items: items2 = [], ...props2 } = item;
68
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeOptionGroup, { label, ...props2, children: items2.map(({ label: label2, value, ...props3 }, i2) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeOption, { value, ...props3, children: label2 }, i2)) }, i);
69
69
  }
70
- });
70
+ }).filter(Boolean);
71
71
  }
72
72
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeSelectProvider, { value: styles, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
73
73
  import_core.ui.div,
@@ -88,7 +88,7 @@ var NativeSelect = (0, import_core.forwardRef)(
88
88
  import_core.ui.select,
89
89
  {
90
90
  ref,
91
- className: (0, import_utils.cx)("ui-native-select-field", className),
91
+ className: (0, import_utils.cx)("ui-native-select__field", className),
92
92
  __css: {
93
93
  paddingEnd: "2rem",
94
94
  h: h != null ? h : height,
@@ -139,7 +139,7 @@ var NativeSelectIcon = ({
139
139
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
140
140
  import_core.ui.div,
141
141
  {
142
- className: (0, import_utils.cx)("ui-native-select-icon", className),
142
+ className: (0, import_utils.cx)("ui-native-select__icon", className),
143
143
  __css: css,
144
144
  ...rest,
145
145
  children: (0, import_utils.isValidElement)(children) ? cloneChildren : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, {})
package/dist/native-select.mjs CHANGED
@@ -3,7 +3,7 @@ import {
3
3
  NativeOption,
4
4
  NativeOptionGroup,
5
5
  NativeSelect
6
- } from "./chunk-6KO77FUQ.mjs";
6
+ } from "./chunk-UQC6YIIC.mjs";
7
7
  export {
8
8
  NativeOption,
9
9
  NativeOptionGroup,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yamada-ui/native-select",
3
- "version": "0.4.9",
3
+ "version": "0.5.0",
4
4
  "description": "Yamada UI native select component",
5
5
  "keywords": [
6
6
  "yamada",