@sunggang/ui-lib 0.2.96 → 0.2.97

package/index.esm3.js

@@ -17,6 +17,11 @@ import 'react-date-range';
 import 'react-date-range/dist/locale/index.js';
 import 'date-fns/addDays/index.js';
 import 'date-fns/format/index.js';
+import '@emotion/react';
+import '@mui/material/Checkbox';
+import '@mui/material/Radio';
+import '@mui/material/RadioGroup';
+import '@mui/material/FormControlLabel';
 import '@tanstack/react-table';
 import '@radix-ui/react-dropdown-menu';
 import '@radix-ui/react-icons';

package/package.json

@@ -1,7 +1,9 @@
 {
   "name": "@sunggang/ui-lib",
-  "version": "0.2.96",
+  "version": "0.2.97",
   "dependencies": {
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.0",
     "@iconify/react": "^4.1.1",
     "@material-ui/core": "^4.12.4",
     "@mdx-js/react": "^3.0.1",

package/src/lib/Form/demo.d.ts

@@ -1,7 +1,11 @@
+import { FormItem } from './types';
 export declare const Regex: {
     phone: RegExp;
 };
-export declare const config: (getValues: any) => (({
+export declare const checkboxConfig: FormItem;
+export declare const checkboxGroupConfig: FormItem;
+export declare const radioConfig: FormItem;
+export declare const config: (getValues: any) => (FormItem[] | ({
     type: string;
     name: string;
     label: string;
@@ -110,28 +114,4 @@ export declare const config: (getValues: any) => (({
     validateOption?: undefined;
     cityName?: undefined;
     districtName?: undefined;
-})[] | ({
-    type: string;
-    name: string;
-    label: string;
-    id: string;
-    placeholder: string;
-    errorText: string;
-    validateOption: {
-        required: boolean;
-        validate?: undefined;
-    };
-} | {
-    type: string;
-    name: string;
-    label: string;
-    id: string;
-    placeholder: string;
-    errorText: string;
-    validateOption: {
-        required: boolean;
-        validate: {
-            afterStart: (value: string) => true | "結束時間需大於起始時間" | undefined;
-        };
-    };
 })[])[];

package/src/lib/Form/index.d.ts

@@ -26,8 +26,7 @@ export declare const Form: {
     FieldLabel: ({ item }: {
         item: any;
     }) => import("react/jsx-runtime").JSX.Element;
-    RadioField: ({ direction, item }: {
-        direction?: string | undefined;
+    RadioField: ({ item }: {
         item: any;
     }) => import("react/jsx-runtime").JSX.Element;
     Time: import("react").FC<FormType>;
@@ -36,4 +35,5 @@ export declare const Form: {
     CityDistrict: ({ item }: {
         item: any;
     }) => import("react/jsx-runtime").JSX.Element;
+    CheckboxField: import("react").FC<FormType>;
 };

package/src/lib/Form/types.d.ts

@@ -6,32 +6,62 @@ interface OptionGroup {
     label: string;
     options: Option[];
 }
+interface RadioOption {
+    label?: string;
+    value?: string;
+    disabled?: boolean;
+}
 type Options = (Option | OptionGroup)[];
+interface Checkbox {
+    name: string;
+    checkboxLabel?: string;
+    checkboxLabelClass?: string;
+    errorText?: string;
+    validateOption?: {
+        required?: boolean;
+    };
+    muiProps?: {
+        disabled?: boolean;
+        size?: 'small' | 'medium' | 'large';
+        color?: 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning' | 'default';
+    };
+}
 export interface FormItem {
     type: string;
     name: string;
     disable?: boolean;
-    icon?: string;
     style?: any;
-    cityName?: string;
-    districtName?: string;
     label?: string;
     id?: string;
     placeholder?: string;
     className?: string;
     labelClass?: string;
     errorText?: string;
-    color?: 'blue' | 'red' | 'green' | 'yellow';
-    size?: 'small' | 'medium' | 'large';
     validateOption?: {
         pattern?: RegExp;
         validateMsg?: string;
         required?: boolean;
         validate?: any;
     };
+    defaultValue?: string;
+    icon?: string;
     option?: Options;
+    radioOptions?: RadioOption[];
+    direction?: 'horizontal' | 'vertical';
     step?: string;
+    cityName?: string;
+    districtName?: string;
     onlyHour?: boolean;
+    color?: 'blue' | 'red' | 'green' | 'yellow';
+    size?: 'small' | 'medium' | 'large';
+    checkboxLabel?: string;
+    checkboxLabelClass?: string;
+    muiProps?: {
+        disabled?: boolean;
+        size?: 'small' | 'medium' | 'large';
+        color?: 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning' | 'default';
+    };
+    checkboxes?: Checkbox[];
 }
 export interface FormType {
     item: FormItem;