@clayui/form - npm Package Compare versions

Comparing version 3.160.0 to 3.161.0

lib/cjs/Select.js

@@ -50,17 +50,20 @@ "use strict";
 }
-function Select({ children, className, shrink, sizing, ...otherProps }) {
-  return /* @__PURE__ */ import_react.default.createElement(
-    "select",
-    {
-      ...otherProps,
-      className: (0, import_classnames.default)("form-control", className, {
-        "form-control-shrink": shrink,
-        [`form-control-${sizing}`]: sizing
-      })
-    },
-    children
-  );
-}
+const Select = (0, import_react.forwardRef)(
+  ({ children, className, shrink, sizing, ...otherProps }, ref) => {
+    return /* @__PURE__ */ import_react.default.createElement(
+      "select",
+      {
+        ref,
+        ...otherProps,
+        className: (0, import_classnames.default)("form-control", className, {
+          "form-control-shrink": shrink,
+          [`form-control-${sizing}`]: sizing
+        })
+      },
+      children
+    );
+  }
+);
 Select.OptGroup = OptGroup;
 Select.Option = Option;
 var Select_default = Select;

lib/cjs/SelectWithOption.js

@@ -36,10 +36,12 @@ "use strict";
 var import_Select = __toESM(require("./Select"));
-function ClaySelectWithOption({ options = [], ...otherProps }) {
-  return /* @__PURE__ */ import_react.default.createElement(import_Select.default, { ...otherProps }, options.map((option, index) => {
-    if (option.type === "group") {
-      return /* @__PURE__ */ import_react.default.createElement(import_Select.default.OptGroup, { key: index, label: option.label }, option.options && option.options.map((item, j) => /* @__PURE__ */ import_react.default.createElement(import_Select.default.Option, { ...item, key: j })));
-    }
-    return /* @__PURE__ */ import_react.default.createElement(import_Select.default.Option, { ...option, key: index });
-  }));
-}
+const ClaySelectWithOption = (0, import_react.forwardRef)(
+  ({ options = [], ...otherProps }, ref) => {
+    return /* @__PURE__ */ import_react.default.createElement(import_Select.default, { ref, ...otherProps }, options.map((option, index) => {
+      if (option.type === "group") {
+        return /* @__PURE__ */ import_react.default.createElement(import_Select.default.OptGroup, { key: index, label: option.label }, option.options?.map((item, j) => /* @__PURE__ */ import_react.default.createElement(import_Select.default.Option, { ...item, key: j })));
+      }
+      return /* @__PURE__ */ import_react.default.createElement(import_Select.default.Option, { ...option, key: index });
+    }));
+  }
+);
 var SelectWithOption_default = ClaySelectWithOption;

lib/esm/Select.js

 import classNames from "classnames";
-import React from "react";
+import React, { forwardRef } from "react";
 function OptGroup({
@@ -15,15 +15,18 @@ children,
 }
-function Select({ children, className, shrink, sizing, ...otherProps }) {
-  return /* @__PURE__ */ React.createElement(
-    "select",
-    {
-      ...otherProps,
-      className: classNames("form-control", className, {
-        "form-control-shrink": shrink,
-        [`form-control-${sizing}`]: sizing
-      })
-    },
-    children
-  );
-}
+const Select = forwardRef(
+  ({ children, className, shrink, sizing, ...otherProps }, ref) => {
+    return /* @__PURE__ */ React.createElement(
+      "select",
+      {
+        ref,
+        ...otherProps,
+        className: classNames("form-control", className, {
+          "form-control-shrink": shrink,
+          [`form-control-${sizing}`]: sizing
+        })
+      },
+      children
+    );
+  }
+);
 Select.OptGroup = OptGroup;
@@ -30,0 +33,0 @@ Select.Option = Option;

lib/esm/SelectWithOption.js

@@ -1,11 +0,13 @@
-import React from "react";
+import React, { forwardRef } from "react";
 import Select from "./Select";
-function ClaySelectWithOption({ options = [], ...otherProps }) {
-  return /* @__PURE__ */ React.createElement(Select, { ...otherProps }, options.map((option, index) => {
-    if (option.type === "group") {
-      return /* @__PURE__ */ React.createElement(Select.OptGroup, { key: index, label: option.label }, option.options && option.options.map((item, j) => /* @__PURE__ */ React.createElement(Select.Option, { ...item, key: j })));
-    }
-    return /* @__PURE__ */ React.createElement(Select.Option, { ...option, key: index });
-  }));
-}
+const ClaySelectWithOption = forwardRef(
+  ({ options = [], ...otherProps }, ref) => {
+    return /* @__PURE__ */ React.createElement(Select, { ref, ...otherProps }, options.map((option, index) => {
+      if (option.type === "group") {
+        return /* @__PURE__ */ React.createElement(Select.OptGroup, { key: index, label: option.label }, option.options?.map((item, j) => /* @__PURE__ */ React.createElement(Select.Option, { ...item, key: j })));
+      }
+      return /* @__PURE__ */ React.createElement(Select.Option, { ...option, key: index });
+    }));
+  }
+);
 var SelectWithOption_default = ClaySelectWithOption;
@@ -12,0 +14,0 @@ export {

lib/Select.d.ts

@@ -18,7 +18,7 @@ /**
 }
-declare function Select({ children, className, shrink, sizing, ...otherProps }: IProps): React.JSX.Element;
-declare namespace Select {
-    var OptGroup: typeof import("./Select").OptGroup;
-    var Option: typeof import("./Select").Option;
-}
+declare type SelectComponent = React.ForwardRefExoticComponent<IProps & React.RefAttributes<HTMLSelectElement>> & {
+    OptGroup: typeof OptGroup;
+    Option: typeof Option;
+};
+declare const Select: SelectComponent;
 export default Select;

lib/SelectWithOption.d.ts

@@ -16,3 +16,3 @@ /**
 }
-declare function ClaySelectWithOption({ options, ...otherProps }: IProps): React.JSX.Element;
+declare const ClaySelectWithOption: React.ForwardRefExoticComponent<Omit<IProps, "ref"> & React.RefAttributes<HTMLSelectElement>>;
 export default ClaySelectWithOption;

package.json

@@ -6,5 +6,5 @@ {
 	"dependencies": {
-		"@clayui/button": "^3.160.0",
-		"@clayui/icon": "^3.160.0",
-		"@clayui/shared": "^3.160.0",
+		"@clayui/button": "^3.161.0",
+		"@clayui/icon": "^3.161.0",
+		"@clayui/shared": "^3.161.0",
 		"classnames": "2.3.1"
@@ -24,3 +24,3 @@ },
 	"peerDependencies": {
-		"@clayui/css": "^3.160.0",
+		"@clayui/css": "^3.161.0",
 		"react": "^16.0.0 || ^17.0.0 || ^18.0.0",
@@ -37,3 +37,3 @@ "react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0"
 	},
-	"version": "3.160.0",
+	"version": "3.161.0",
 	"module": "lib/esm/index.js",
@@ -40,0 +40,0 @@ "exports": {

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

84847

0.31%

Lines of code

2425

0.37%

Number of medium supply chain risk alerts

0

-100%

Dependency changes

• Updated

  @clayui/button@^3.161.0

• Updated

  @clayui/icon@^3.161.0

• Updated

  @clayui/shared@^3.161.0