@zimyo/ui 1.6.3 → 1.6.4

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.
@@ -0,0 +1,24 @@
1
+ import React from 'react';
2
+ import { SxProps } from '@mui/system';
3
+
4
+ interface RadioProps {
5
+ label?: string;
6
+ description?: string;
7
+ name?: string;
8
+ checked?: boolean;
9
+ defaultChecked?: boolean;
10
+ onChange?: (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => void;
11
+ disabled?: boolean;
12
+ required?: boolean;
13
+ error?: boolean;
14
+ helperText?: string;
15
+ size?: 'small' | 'medium';
16
+ color?: 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning';
17
+ sx?: SxProps;
18
+ radioSx?: SxProps;
19
+ labelSx?: SxProps;
20
+ }
21
+ declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<HTMLDivElement>>;
22
+
23
+ export { Radio as default };
24
+ export type { RadioProps };
@@ -0,0 +1 @@
1
+ import{jsxs as e,jsx as r}from"react/jsx-runtime";import t from"react";import{useTheme as o,FormControl as l,FormLabel as i,Typography as a,FormControlLabel as n,Radio as d,Box as c,FormHelperText as p}from"@mui/material";var s=function(){return s=Object.assign||function(e){for(var r,t=1,o=arguments.length;t<o;t++)for(var l in r=arguments[t])Object.prototype.hasOwnProperty.call(r,l)&&(e[l]=r[l]);return e},s.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var m=t.forwardRef(function(t,m){var f=t.label,x=t.description,u=t.name,h=t.checked,b=void 0!==h&&h,y=t.defaultChecked,v=void 0!==y&&y,g=t.onChange,O=t.disabled,S=void 0!==O&&O,j=t.required,k=void 0!==j&&j,C=t.error,z=void 0!==C&&C,w=t.helperText,P=t.size,q=void 0===P?"medium":P,E=t.color,M=void 0===E?"primary":E,R=t.sx,B=void 0===R?{}:R,H=t.radioSx,I=void 0===H?{}:H,T=t.labelSx,W=void 0===T?{}:T,D=function(e,r){var t={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var l=0;for(o=Object.getOwnPropertySymbols(e);l<o.length;l++)r.indexOf(o[l])<0&&Object.prototype.propertyIsEnumerable.call(e,o[l])&&(t[o[l]]=e[o[l]])}return t}(t,["label","description","name","checked","defaultChecked","onChange","disabled","required","error","helperText","size","color","sx","radioSx","labelSx"]),F=o();return e(l,s({ref:m,component:"fieldset",error:z,required:k,disabled:S,sx:s({borderRadius:"8px"},B)},D,{children:[f&&e(i,{sx:s({fontWeight:500,fontSize:"small"===q?"0.875rem":"1rem",color:S?F.palette.text.disabled:z?F.palette.error.main:F.palette.text.primary,mb:1},W),children:[f,k&&r(a,{component:"span",sx:{color:F.palette.error.main,ml:.5,fontSize:"inherit"},children:"*"})]}),r(n,{control:r(d,{name:u,checked:b,defaultChecked:v,onChange:g,size:q,color:M,sx:s({"&.Mui-checked":{color:z?F.palette.error.main:F.palette[M].main},mt:x?.25:0},I)}),label:e(c,{sx:{display:"flex",flexDirection:"column"},children:[r(a,{variant:"small"===q?"body2":"body1",sx:{fontWeight:400,color:S?F.palette.text.disabled:F.palette.text.primary,lineHeight:1.5},children:f}),x&&r(a,{variant:"caption",sx:{color:S?F.palette.text.disabled:F.palette.text.secondary,mt:.25,lineHeight:1.4},children:x})]}),sx:{alignItems:x?"flex-start":"center",margin:0,display:"flex","& .MuiFormControlLabel-label":{ml:1,flex:1},"& .MuiButtonBase-root":{p:"small"===q?.5:1}}}),w&&r(p,{sx:{mt:1,fontSize:"small"===q?"0.75rem":"0.875rem",color:z?F.palette.error.main:F.palette.text.secondary},children:w})]}))});export{m as default};
@@ -0,0 +1 @@
1
+ "use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material"),o=function(){return o=Object.assign||function(e){for(var r,t=1,o=arguments.length;t<o;t++)for(var l in r=arguments[t])Object.prototype.hasOwnProperty.call(r,l)&&(e[l]=r[l]);return e},o.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var l=r.forwardRef(function(r,l){var a=r.label,i=r.description,n=r.name,s=r.checked,d=void 0!==s&&s,c=r.defaultChecked,p=void 0!==c&&c,m=r.onChange,x=r.disabled,u=void 0!==x&&x,h=r.required,f=void 0!==h&&h,b=r.error,y=void 0!==b&&b,v=r.helperText,g=r.size,j=void 0===g?"medium":g,O=r.color,S=void 0===O?"primary":O,C=r.sx,k=void 0===C?{}:C,T=r.radioSx,q=void 0===T?{}:T,z=r.labelSx,w=void 0===z?{}:z,F=function(e,r){var t={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var l=0;for(o=Object.getOwnPropertySymbols(e);l<o.length;l++)r.indexOf(o[l])<0&&Object.prototype.propertyIsEnumerable.call(e,o[l])&&(t[o[l]]=e[o[l]])}return t}(r,["label","description","name","checked","defaultChecked","onChange","disabled","required","error","helperText","size","color","sx","radioSx","labelSx"]),P=t.useTheme();return e.jsxs(t.FormControl,o({ref:l,component:"fieldset",error:y,required:f,disabled:u,sx:o({borderRadius:"8px"},k)},F,{children:[a&&e.jsxs(t.FormLabel,{sx:o({fontWeight:500,fontSize:"small"===j?"0.875rem":"1rem",color:u?P.palette.text.disabled:y?P.palette.error.main:P.palette.text.primary,mb:1},w),children:[a,f&&e.jsx(t.Typography,{component:"span",sx:{color:P.palette.error.main,ml:.5,fontSize:"inherit"},children:"*"})]}),e.jsx(t.FormControlLabel,{control:e.jsx(t.Radio,{name:n,checked:d,defaultChecked:p,onChange:m,size:j,color:S,sx:o({"&.Mui-checked":{color:y?P.palette.error.main:P.palette[S].main},mt:i?.25:0},q)}),label:e.jsxs(t.Box,{sx:{display:"flex",flexDirection:"column"},children:[e.jsx(t.Typography,{variant:"small"===j?"body2":"body1",sx:{fontWeight:400,color:u?P.palette.text.disabled:P.palette.text.primary,lineHeight:1.5},children:a}),i&&e.jsx(t.Typography,{variant:"caption",sx:{color:u?P.palette.text.disabled:P.palette.text.secondary,mt:.25,lineHeight:1.4},children:i})]}),sx:{alignItems:i?"flex-start":"center",margin:0,display:"flex","& .MuiFormControlLabel-label":{ml:1,flex:1},"& .MuiButtonBase-root":{p:"small"===j?.5:1}}}),v&&e.jsx(t.FormHelperText,{sx:{mt:1,fontSize:"small"===j?"0.75rem":"0.875rem",color:y?P.palette.error.main:P.palette.text.secondary},children:v})]}))});module.exports=l;
package/dist/index.d.ts CHANGED
@@ -6,6 +6,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
6
6
  import { Props, GroupBase } from 'react-select';
7
7
  import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
8
8
  import { VariantProps } from 'class-variance-authority';
9
+ import { UseFormReturn } from 'react-hook-form';
9
10
  import { Theme } from '@mui/material/styles';
10
11
  import { ClassValue } from 'clsx';
11
12
 
@@ -178,9 +179,9 @@ interface BadgeProps extends VariantProps<typeof badgeVariants> {
178
179
  className?: string;
179
180
  }
180
181
  declare const badgeVariants: (props?: ({
181
- variant?: "text" | "outlined" | "contained" | null | undefined;
182
+ variant?: "text" | "contained" | "outlined" | null | undefined;
182
183
  size?: "sm" | "md" | "lg" | null | undefined;
183
- type?: "default" | "success" | "error" | "info" | "warning" | null | undefined;
184
+ type?: "default" | "error" | "info" | "success" | "warning" | null | undefined;
184
185
  } & class_variance_authority_dist_types.ClassProp) | undefined) => string;
185
186
  declare const Badge: ({ label, icon, iconPosition, dot, dotPosition, variant, size, type, color, className, }: BadgeProps) => react_jsx_runtime.JSX.Element;
186
187
 
@@ -277,6 +278,88 @@ interface DateRangePickerProps {
277
278
  }
278
279
  declare const DateRangePicker: React$1.FC<DateRangePickerProps>;
279
280
 
281
+ type FieldType = "text" | "number" | "textarea" | "select" | "radio" | "switch" | "checkbox" | "date" | "daterange" | "custom";
282
+ type FormField = {
283
+ name: string;
284
+ label: string;
285
+ type: FieldType;
286
+ placeholder?: string;
287
+ required?: boolean;
288
+ defaultValue?: any;
289
+ options?: {
290
+ label: string;
291
+ value: any;
292
+ }[];
293
+ validation?: any;
294
+ visibleIf?: (values: any) => boolean;
295
+ component?: React__default.ReactNode;
296
+ colSpan?: number;
297
+ };
298
+ type FormProps = {
299
+ schema: FormField[];
300
+ form: UseFormReturn;
301
+ layout?: "vertical" | "grid";
302
+ columns?: number;
303
+ className?: string;
304
+ showSubmitButton?: boolean;
305
+ onSubmit?: (data: any) => void;
306
+ };
307
+ declare const Form: React__default.FC<FormProps>;
308
+
309
+ type CheckboxSize = "sm" | "md" | "lg";
310
+ interface CheckboxProps extends React$1.InputHTMLAttributes<HTMLInputElement> {
311
+ label?: React$1.ReactNode;
312
+ description?: React$1.ReactNode;
313
+ size?: CheckboxSize;
314
+ indeterminate?: boolean;
315
+ error?: boolean;
316
+ }
317
+ declare const Checkbox: React$1.ForwardRefExoticComponent<CheckboxProps & React$1.RefAttributes<HTMLInputElement>>;
318
+
319
+ interface CheckboxGroupOption {
320
+ label: string;
321
+ value: string;
322
+ description?: string;
323
+ disabled?: boolean;
324
+ }
325
+ type Layout = "box" | "list";
326
+ type Direction = "vertical" | "horizontal";
327
+ interface CheckboxGroupProps {
328
+ name: string;
329
+ label?: string;
330
+ description?: string;
331
+ error?: boolean;
332
+ options: CheckboxGroupOption[];
333
+ value?: string[];
334
+ defaultValue?: string[];
335
+ onChange?: (selected: string[]) => void;
336
+ direction?: Direction;
337
+ layout?: Layout;
338
+ disabled?: boolean;
339
+ size?: CheckboxProps["size"];
340
+ className?: string;
341
+ columns?: number;
342
+ }
343
+ declare const CheckboxGroup: React$1.FC<CheckboxGroupProps>;
344
+
345
+ interface RadioProps {
346
+ label?: string;
347
+ description?: string;
348
+ name?: string;
349
+ checked?: boolean;
350
+ defaultChecked?: boolean;
351
+ onChange?: (event: React__default.ChangeEvent<HTMLInputElement>, checked: boolean) => void;
352
+ disabled?: boolean;
353
+ required?: boolean;
354
+ error?: boolean;
355
+ helperText?: string;
356
+ size?: 'small' | 'medium';
357
+ color?: 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning';
358
+ sx?: SxProps;
359
+ radioSx?: SxProps;
360
+ labelSx?: SxProps;
361
+ }
362
+
280
363
  interface UILibraryThemeProviderProps {
281
364
  children: React__default.ReactNode;
282
365
  primaryColor?: string;
@@ -371,5 +454,5 @@ declare const designTokens: {
371
454
  declare function cn(...inputs: ClassValue[]): string;
372
455
  declare function useStableId(prefix?: string): string;
373
456
 
374
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Badge, Blockquote, Button, Caption, Code, DatePicker, DateRangePicker, Drawer, Heading, Input, Lead, Modal, Muted, Notice, RadioGroup, Select, Strong, Switch, Text, UILibraryThemeProvider, cn, createCustomTheme, designTokens, theme, useStableId };
375
- export type { AccordionContentProps, AccordionItemProps, AccordionProps, AccordionTriggerProps, BadgeProps, ButtonProps, DatePickerProps, DateRangePickerProps, DrawerProps, InputProps, ModalProps, NoticeProps, RadioGroupProps, RadioOption, SelectProps, SwitchProps, ThemeConfig, UILibraryThemeProviderProps };
457
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Badge, Blockquote, Button, Caption, Checkbox, CheckboxGroup, Code, DatePicker, DateRangePicker, Drawer, Form, Heading, Input, Lead, Modal, Muted, Notice, RadioGroup, Select, Strong, Switch, Text, UILibraryThemeProvider, cn, createCustomTheme, designTokens, theme, useStableId };
458
+ export type { AccordionContentProps, AccordionItemProps, AccordionProps, AccordionTriggerProps, BadgeProps, ButtonProps, CheckboxGroupProps, CheckboxProps, DatePickerProps, DateRangePickerProps, DrawerProps, FormProps, InputProps, ModalProps, NoticeProps, RadioGroupProps, RadioOption, RadioProps, SelectProps, SwitchProps, ThemeConfig, UILibraryThemeProviderProps };