@apexcura/ui-components 0.0.2 → 0.0.4

package/dist/index.d.mts

@@ -16,6 +16,7 @@ type ElementType = {
     name?: string;
     suffix?: React.ReactNode;
     maxLength?: number;
+    onChange?: (value: string | number | boolean) => void;
 };
 
 declare const TextElement: (props: ElementType) => React$1.JSX.Element;
@@ -32,6 +33,10 @@ interface PasswordProps {
 }
 declare const PasswordElement: React$1.FC<PasswordProps>;
 
-declare const NumberInput: (props: ElementType) => React$1.JSX.Element;
+declare const NumberElement: (props: ElementType) => React$1.JSX.Element;
 
-export { NumberInput, PasswordElement, TextElement };
+declare const TextareaElement: (props: ElementType) => React$1.JSX.Element;
+
+declare const SelectElement: (props: ElementType) => React$1.JSX.Element;
+
+export { NumberElement, PasswordElement, SelectElement, TextElement, TextareaElement };

package/dist/index.d.ts

@@ -16,6 +16,7 @@ type ElementType = {
     name?: string;
     suffix?: React.ReactNode;
     maxLength?: number;
+    onChange?: (value: string | number | boolean) => void;
 };
 
 declare const TextElement: (props: ElementType) => React$1.JSX.Element;
@@ -32,6 +33,10 @@ interface PasswordProps {
 }
 declare const PasswordElement: React$1.FC<PasswordProps>;
 
-declare const NumberInput: (props: ElementType) => React$1.JSX.Element;
+declare const NumberElement: (props: ElementType) => React$1.JSX.Element;
 
-export { NumberInput, PasswordElement, TextElement };
+declare const TextareaElement: (props: ElementType) => React$1.JSX.Element;
+
+declare const SelectElement: (props: ElementType) => React$1.JSX.Element;
+
+export { NumberElement, PasswordElement, SelectElement, TextElement, TextareaElement };

package/dist/index.js

@@ -30,19 +30,25 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 __export(src_exports, {
-  NumberInput: () => NumberInput,
+  NumberElement: () => NumberElement,
   PasswordElement: () => PasswordElement,
-  TextElement: () => TextElement
+  SelectElement: () => SelectElement,
+  TextElement: () => TextElement,
+  TextareaElement: () => TextareaElement
 });
 module.exports = __toCommonJS(src_exports);
 
 // src/Components/TextElement.tsx
 var import_react = __toESM(require("react"));
 var import_antd = require("antd");
-var onHandleChange = ($event) => {
-  console.log($event);
-};
 var TextElement = (props) => {
+  const [text, setText] = (0, import_react.useState)(props.value || "");
+  const onHandleChange = (e) => {
+    setText(e.target.value);
+    if (props.onChange) {
+      props.onChange(text);
+    }
+  };
   return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("label", { htmlFor: props.name }, props.label), /* @__PURE__ */ import_react.default.createElement(
     import_antd.Input,
     {
@@ -122,7 +128,7 @@ var NumericInput = (props) => {
     }
   ));
 };
-var NumberInput = (props) => {
+var NumberElement = (props) => {
   const [value, setValue] = (0, import_react3.useState)("");
   return /* @__PURE__ */ import_react3.default.createElement(
     NumericInput,
@@ -134,9 +140,82 @@ var NumberInput = (props) => {
     }
   );
 };
+
+// src/Components/TextareaElement.tsx
+var import_react4 = __toESM(require("react"));
+var import_antd4 = require("antd");
+var { TextArea } = import_antd4.Input;
+var TextareaElement = (props) => {
+  const [textarea, setTextarea] = (0, import_react4.useState)(props.value || "");
+  const onHandleChange = (e) => {
+    setTextarea(e.target.value);
+    if (props.onChange) {
+      props.onChange(textarea);
+    }
+  };
+  return /* @__PURE__ */ import_react4.default.createElement(import_antd4.Flex, { vertical: true, gap: 32 }, /* @__PURE__ */ import_react4.default.createElement(
+    TextArea,
+    {
+      placeholder: props.placeholder,
+      allowClear: true,
+      defaultValue: props.defaultValue,
+      disabled: props.disabled,
+      id: props.name,
+      value: props.value,
+      status: props.status,
+      style: props.styles,
+      className: props.classNames,
+      variant: props.variant,
+      name: props.name,
+      showCount: true,
+      maxLength: props.maxLength,
+      onChange: onHandleChange
+    }
+  ));
+};
+
+// src/Components/SelectElement.tsx
+var import_react5 = __toESM(require("react"));
+var import_antd5 = require("antd");
+var options = [
+  {
+    value: "male",
+    label: "male"
+  },
+  {
+    value: "female",
+    label: "female"
+  },
+  {
+    value: "other",
+    label: "other"
+  }
+];
+var SelectElement = (props) => /* @__PURE__ */ import_react5.default.createElement(
+  import_antd5.Select,
+  {
+    placeholder: props.placeholder,
+    allowClear: true,
+    defaultValue: props.defaultValue,
+    disabled: props.disabled,
+    id: props.name,
+    value: props.value,
+    status: props.status,
+    style: props.styles,
+    className: props.classNames,
+    variant: props.variant,
+    options
+  }
+);
+
+// src/Components/Button.tsx
+var import_react6 = __toESM(require("react"));
+var import_antd6 = require("antd");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  NumberInput,
+  NumberElement,
   PasswordElement,
-  TextElement
+  SelectElement,
+  TextElement,
+  TextareaElement
 });

package/dist/index.mjs

@@ -1,10 +1,14 @@
 // src/Components/TextElement.tsx
-import React from "react";
+import React, { useState } from "react";
 import { Input as AntInput } from "antd";
-var onHandleChange = ($event) => {
-  console.log($event);
-};
 var TextElement = (props) => {
+  const [text, setText] = useState(props.value || "");
+  const onHandleChange = (e) => {
+    setText(e.target.value);
+    if (props.onChange) {
+      props.onChange(text);
+    }
+  };
   return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("label", { htmlFor: props.name }, props.label), /* @__PURE__ */ React.createElement(
     AntInput,
     {
@@ -28,11 +32,11 @@ var TextElement = (props) => {
 };
 
 // src/Components/PasswordElement.tsx
-import React2, { useState } from "react";
+import React2, { useState as useState2 } from "react";
 import { EyeInvisibleOutlined, EyeTwoTone } from "@ant-design/icons";
 import { Button, Input, Space } from "antd";
 var PasswordElement = ({ inputData }) => {
-  const [passwordVisible, setPasswordVisible] = useState(false);
+  const [passwordVisible, setPasswordVisible] = useState2(false);
   const handleVisibilityToggle = () => {
     setPasswordVisible((prev) => !prev);
   };
@@ -53,7 +57,7 @@ var PasswordElement = ({ inputData }) => {
 };
 
 // src/Components/NumberElement.tsx
-import React3, { useState as useState2 } from "react";
+import React3, { useState as useState3 } from "react";
 import { Input as Input2, Tooltip } from "antd";
 var formatNumber = (value) => new Intl.NumberFormat().format(value);
 var NumericInput = (props) => {
@@ -84,8 +88,8 @@ var NumericInput = (props) => {
     }
   ));
 };
-var NumberInput = (props) => {
-  const [value, setValue] = useState2("");
+var NumberElement = (props) => {
+  const [value, setValue] = useState3("");
   return /* @__PURE__ */ React3.createElement(
     NumericInput,
     {
@@ -96,8 +100,81 @@ var NumberInput = (props) => {
     }
   );
 };
+
+// src/Components/TextareaElement.tsx
+import React4, { useState as useState4 } from "react";
+import { Flex, Input as Input3 } from "antd";
+var { TextArea } = Input3;
+var TextareaElement = (props) => {
+  const [textarea, setTextarea] = useState4(props.value || "");
+  const onHandleChange = (e) => {
+    setTextarea(e.target.value);
+    if (props.onChange) {
+      props.onChange(textarea);
+    }
+  };
+  return /* @__PURE__ */ React4.createElement(Flex, { vertical: true, gap: 32 }, /* @__PURE__ */ React4.createElement(
+    TextArea,
+    {
+      placeholder: props.placeholder,
+      allowClear: true,
+      defaultValue: props.defaultValue,
+      disabled: props.disabled,
+      id: props.name,
+      value: props.value,
+      status: props.status,
+      style: props.styles,
+      className: props.classNames,
+      variant: props.variant,
+      name: props.name,
+      showCount: true,
+      maxLength: props.maxLength,
+      onChange: onHandleChange
+    }
+  ));
+};
+
+// src/Components/SelectElement.tsx
+import React5 from "react";
+import { Select as AntSelect } from "antd";
+var options = [
+  {
+    value: "male",
+    label: "male"
+  },
+  {
+    value: "female",
+    label: "female"
+  },
+  {
+    value: "other",
+    label: "other"
+  }
+];
+var SelectElement = (props) => /* @__PURE__ */ React5.createElement(
+  AntSelect,
+  {
+    placeholder: props.placeholder,
+    allowClear: true,
+    defaultValue: props.defaultValue,
+    disabled: props.disabled,
+    id: props.name,
+    value: props.value,
+    status: props.status,
+    style: props.styles,
+    className: props.classNames,
+    variant: props.variant,
+    options
+  }
+);
+
+// src/Components/Button.tsx
+import React6 from "react";
+import { Button as Button2, Flex as Flex2 } from "antd";
 export {
-  NumberInput,
+  NumberElement,
   PasswordElement,
-  TextElement
+  SelectElement,
+  TextElement,
+  TextareaElement
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@apexcura/ui-components",
-  "version": "0.0.2",
+  "version": "0.0.4",
   "description": "Apex cura React components library",
   "keywords" : ["apex cura", "input", "ui", "react", "react-component"],
   "homepage": "https://www.apexcura.com/",