@atom-learning/components 2.9.0 → 2.9.2

package/CHANGELOG.md

@@ -1,9 +1,10 @@
-# [2.9.0](https://github.com/Atom-Learning/components/compare/v2.8.0...v2.9.0) (2022-10-19)
+## [2.9.2](https://github.com/Atom-Learning/components/compare/v2.9.1...v2.9.2) (2022-10-19)
 
 
-### Features
+### Bug Fixes
 
-* Add new theme to AccordianTrigger ([e280e0f](https://github.com/Atom-Learning/components/commit/e280e0fed25a3e7ca0dd9f0e3ebb69d3e26144da))
+* change size prop to optional ([04f5d0f](https://github.com/Atom-Learning/components/commit/04f5d0f9f55aa8812008895d16fda06437797b3b))
+* consolidate field element props ([b82f96d](https://github.com/Atom-Learning/components/commit/b82f96db924f58dca8829499653ee925b6e4500c))
 
 # [1.4.0](https://github.com/Atom-Learning/components/compare/v1.3.0...v1.4.0) (2022-04-11)
 

package/dist/components/checkbox-field/CheckboxField.d.ts

@@ -1,14 +1,6 @@
 import * as React from 'react';
 import { Checkbox } from '../../components/checkbox';
-import { ValidationOptions } from '../../components/form';
-import { CSS } from '../../stitches';
-declare type CheckboxFieldProps = {
-    css?: CSS;
-    defaultChecked?: boolean;
-    label: string;
-    description?: string;
-    name: string;
-    validation?: ValidationOptions;
-} & React.ComponentProps<typeof Checkbox>;
+import { FieldElementWrapperProps } from '../../components/field-wrapper';
+declare type CheckboxFieldProps = React.ComponentProps<typeof Checkbox> & FieldElementWrapperProps;
 export declare const CheckboxField: React.FC<CheckboxFieldProps>;
 export {};

package/dist/components/checkbox-field/CheckboxField.js

@@ -1 +1 @@
-import*as l from"react";import{useFormContext as s,Controller as h}from"react-hook-form";import{Checkbox as C}from"../checkbox/Checkbox.js";import"../field-wrapper/FieldWrapper.js";import{InlineFieldWrapper as k}from"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as F}from"../form/useFieldError.js";var b=(e=>(e.ON="on",e.OFF="off",e))(b||{});const i=({css:e,defaultChecked:r=!1,label:m,name:t,validation:o,description:d,...c})=>{const{control:f}=s(),{error:n}=F(t);return l.createElement(h,{control:f,name:t,defaultValue:r,rules:o,render:({onChange:u,value:a,name:p})=>l.createElement(k,{css:e,description:d,error:n,label:m,required:Boolean(o==null?void 0:o.required)},l.createElement(C,{defaultChecked:r,defaultValue:r?"on":"off",checked:a,name:p,onCheckedChange:u,value:a?"on":"off",...n&&{state:"error"},...c}))})};i.displayName="CheckboxField";export{i as CheckboxField};
+import*as n from"react";import{useFormContext as p,Controller as C}from"react-hook-form";import{Checkbox as h}from"../checkbox/Checkbox.js";import"../field-wrapper/FieldWrapper.js";import{InlineFieldWrapper as F}from"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as k}from"../form/useFieldError.js";var b=(e=>(e.ON="on",e.OFF="off",e))(b||{});const i=({css:e,defaultChecked:r=!1,label:m,name:t,validation:o,description:d,...c})=>{const{control:f}=p(),{error:a}=k(t);return n.createElement(C,{control:f,name:t,defaultValue:r,rules:o,render:({onChange:u,value:l,name:s})=>n.createElement(F,{css:e,description:d,error:a,label:m,required:Boolean(o==null?void 0:o.required)},n.createElement(h,{defaultChecked:r,defaultValue:r?"on":"off",checked:l,name:s,onCheckedChange:u,value:l?"on":"off",...a&&{state:"error"},...c}))})};i.displayName="CheckboxField";export{i as CheckboxField};

package/dist/components/date-field/DateField.d.ts

@@ -1,17 +1,6 @@
 import * as React from 'react';
 import { DateInputProps } from '../../components/date-input';
-import { ValidationOptions } from '../../components/form';
-import type { CSS } from '../../stitches';
-declare type DateFieldProps = DateInputProps & {
-    css?: CSS;
-    description?: string;
-    label: string;
-    name: string;
-    prompt?: {
-        link: string;
-        label: string;
-    };
-    validation?: ValidationOptions;
-};
+import { FieldElementWrapperProps } from '../../components/field-wrapper';
+declare type DateFieldProps = DateInputProps & FieldElementWrapperProps;
 export declare const DateField: React.FC<DateFieldProps>;
 export {};

package/dist/components/date-field/DateField.js

@@ -1 +1 @@
-import*as i from"react";import{useFormContext as f}from"react-hook-form";import{DateInput as u}from"../date-input/DateInput.js";import{FieldWrapper as F}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as g}from"../form/useFieldError.js";const a=({css:m,label:p,name:r,validation:e,prompt:l,description:d,...n})=>{const{register:t,trigger:s}=f(),{error:o}=g(r),c=e?t(e):t;return i.createElement(F,{css:m,description:d,error:o,fieldId:r,label:p,prompt:l,required:Boolean(e==null?void 0:e.required)},i.createElement(u,{id:r,name:r,ref:c,...o&&{state:"error"},...n,revalidate:s}))};a.displayName="DateField";export{a as DateField};
+import*as i from"react";import{useFormContext as f}from"react-hook-form";import{DateInput as u}from"../date-input/DateInput.js";import{FieldWrapper as F}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as g}from"../form/useFieldError.js";const m=({css:a,label:p,name:r,validation:e,prompt:l,description:d,...n})=>{const{register:t,trigger:s}=f(),{error:o}=g(r),c=e?t(e):t;return i.createElement(F,{css:a,description:d,error:o,fieldId:r,label:p,prompt:l,required:Boolean(e==null?void 0:e.required)},i.createElement(u,{id:r,name:r,ref:c,...o&&{state:"error"},...n,revalidate:s}))};m.displayName="DateField";export{m as DateField};

package/dist/components/field-wrapper/FieldWrapper.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { ValidationOptions } from '../../components/form';
 import type { CSS } from '../../stitches';
 export declare type FieldWrapperProps = {
     css?: CSS;
@@ -13,4 +14,8 @@ export declare type FieldWrapperProps = {
     required?: boolean;
     hideLabel?: boolean;
 };
+export declare type FieldElementWrapperProps = Omit<FieldWrapperProps, 'fieldId'> & {
+    name: string;
+    validation?: ValidationOptions;
+};
 export declare const FieldWrapper: React.FC<FieldWrapperProps>;

package/dist/components/field-wrapper/index.d.ts

@@ -1,3 +1,3 @@
-export type { FieldWrapperProps } from './FieldWrapper';
+export type { FieldWrapperProps, FieldElementWrapperProps } from './FieldWrapper';
 export { FieldWrapper } from './FieldWrapper';
 export { InlineFieldWrapper } from './InlineFieldWrapper';

package/dist/components/input-field/InputField.d.ts

@@ -1,17 +1,6 @@
 import * as React from 'react';
-import { ValidationOptions } from '../../components/form';
+import { FieldElementWrapperProps } from '../../components/field-wrapper';
 import { InputProps } from '../../components/input';
-import type { CSS } from '../../stitches';
-declare type InputFieldProps = InputProps & {
-    css?: CSS;
-    description?: string;
-    label: string;
-    name: string;
-    prompt?: {
-        link: string;
-        label: string;
-    };
-    validation?: ValidationOptions;
-};
+declare type InputFieldProps = InputProps & FieldElementWrapperProps;
 export declare const InputField: React.FC<InputFieldProps>;
 export {};

package/dist/components/input-field/InputField.js

@@ -1 +1 @@
-import*as i from"react";import{useFormContext as u}from"react-hook-form";import{FieldWrapper as c}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as f}from"../form/useFieldError.js";import{Input as F}from"../input/Input.js";const p=({css:m,label:l,name:r,validation:e,prompt:n,description:d,...a})=>{const{register:o}=u(),{error:t}=f(r),s=e?o(e):o;return i.createElement(c,{css:m,description:d,error:t,fieldId:r,label:l,prompt:n,required:Boolean(e==null?void 0:e.required)},i.createElement(F,{id:r,name:r,ref:s,...t&&{state:"error"},...a}))};p.displayName="InputField";export{p as InputField};
+import*as i from"react";import{useFormContext as u}from"react-hook-form";import{FieldWrapper as c}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as f}from"../form/useFieldError.js";import{Input as F}from"../input/Input.js";const p=({css:m,label:l,name:r,validation:e,prompt:n,description:a,...d})=>{const{register:o}=u(),{error:t}=f(r),s=e?o(e):o;return i.createElement(c,{css:m,description:a,error:t,fieldId:r,label:l,prompt:n,required:Boolean(e==null?void 0:e.required)},i.createElement(F,{id:r,name:r,ref:s,...t&&{state:"error"},...d}))};p.displayName="InputField";export{p as InputField};

package/dist/components/password-field/PasswordField.d.ts

@@ -1,17 +1,8 @@
 import * as React from 'react';
-import type { ValidationOptions } from '../../components/form';
-import { InputProps } from '../../components/input';
-declare type PasswordFieldProps = InputProps & {
-    description?: string;
-    hidePasswordText?: string;
+import { FieldElementWrapperProps } from '../../components/field-wrapper';
+import { PasswordInput } from '../../components/password-input';
+declare type PasswordFieldProps = React.ComponentProps<typeof PasswordInput> & Omit<FieldElementWrapperProps, 'label'> & {
     label?: string;
-    name: string;
-    prompt?: {
-        label: string;
-        link: string;
-    };
-    showPasswordText?: string;
-    validation?: ValidationOptions;
 };
 export declare const PasswordField: React.FC<PasswordFieldProps>;
 export {};

package/dist/components/password-field/PasswordField.js

@@ -1 +1 @@
-import*as t from"react";import{useFormContext as c}from"react-hook-form";import{FieldWrapper as u}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as f}from"../form/useFieldError.js";import{PasswordInput as w}from"../password-input/PasswordInput.js";const i=({css:s={},label:m="Password",name:r,prompt:p=void 0,description:a,validation:e,...d})=>{const{register:o}=c(),{error:l}=f(r),n=e?o(e):o;return t.createElement(u,{css:{...s,position:"relative"},description:a,error:l,fieldId:r,label:m,prompt:p,required:Boolean(e==null?void 0:e.required)},t.createElement(w,{autoComplete:"current-password",name:r,id:r,ref:n,...d}))};i.displayName="PasswordField";export{i as PasswordField};
+import*as t from"react";import{useFormContext as c}from"react-hook-form";import{FieldWrapper as u}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as f}from"../form/useFieldError.js";import{PasswordInput as w}from"../password-input/PasswordInput.js";const i=({css:s={},label:m="Password",name:r,prompt:p=void 0,description:a,validation:o,...d})=>{const{register:e}=c(),{error:l}=f(r),n=o?e(o):e;return t.createElement(u,{css:{...s,position:"relative"},description:a,error:l,fieldId:r,label:m,prompt:p,required:Boolean(o==null?void 0:o.required)},t.createElement(w,{autoComplete:"current-password",name:r,id:r,ref:n,...d}))};i.displayName="PasswordField";export{i as PasswordField};

package/dist/components/radio-button-field/RadioButtonField.d.ts

@@ -1,17 +1,8 @@
 import * as React from 'react';
-import { ValidationOptions } from '../../components/form';
-import { CSS } from '../../stitches';
+import { FieldElementWrapperProps } from '../../components/field-wrapper';
+import { RadioButtonGroup } from '../../components/radio-button';
 import { RadioField } from './RadioField';
-declare type RadioButtonFieldProps = {
-    css?: CSS;
-    defaultValue?: string;
-    label: string;
-    name: string;
-    direction?: 'row' | 'column';
-    description?: string;
-    validation?: ValidationOptions;
-    onValueChange?: (value: string) => void;
-};
+declare type RadioButtonFieldProps = React.ComponentProps<typeof RadioButtonGroup> & FieldElementWrapperProps;
 export declare const RadioButtonField: React.FC<RadioButtonFieldProps> & {
     Item: typeof RadioField;
 };

package/dist/components/radio-button-field/RadioButtonField.js

@@ -1 +1 @@
-import*as e from"react";import{useFormContext as g,Controller as C}from"react-hook-form";import{Description as F}from"../field-wrapper/FieldDescription.js";import"../form/Form.js";import{useFieldError as V}from"../form/useFieldError.js";import{Label as b}from"../label/Label.js";import"../radio-button/RadioButton.js";import{RadioButtonGroup as h}from"../radio-button/RadioButtonGroup.js";import{InlineMessage as v}from"../inline-message/InlineMessage.js";import{styled as B}from"../../stitches.js";import{RadioField as R}from"./RadioField.js";const $=B("fieldset",{all:"unset"}),r=({children:s,css:d,direction:u="column",defaultValue:t,description:l,label:c,name:n,validation:o,onValueChange:a})=>{const{control:p}=g(),{error:i}=V(n);return e.createElement($,{css:d},e.createElement(b,{as:"legend",css:{p:0,mb:"$3"},required:Boolean(o==null?void 0:o.required)},c),l&&e.createElement(F,{css:{mb:"$3"}},l),e.createElement(C,{control:p,name:n,rules:o,defaultValue:t,render:({onChange:f,value:E})=>e.createElement(h,{direction:u,defaultValue:t,onValueChange:m=>{f(m),a==null||a(m)},value:E},s)}),i&&e.createElement(v,{css:{mt:"$2"}},i))};r.Item=R,r.displayName="RadioButtonField";export{r as RadioButtonField};
+import*as e from"react";import{useFormContext as F,Controller as g}from"react-hook-form";import{Description as C}from"../field-wrapper/FieldDescription.js";import"../form/Form.js";import{useFieldError as V}from"../form/useFieldError.js";import{Label as b}from"../label/Label.js";import"../radio-button/RadioButton.js";import{RadioButtonGroup as h}from"../radio-button/RadioButtonGroup.js";import{InlineMessage as v}from"../inline-message/InlineMessage.js";import{styled as B}from"../../stitches.js";import{RadioField as R}from"./RadioField.js";const $=B("fieldset",{all:"unset"}),r=({children:s,css:d,direction:u="column",defaultValue:t,description:l,label:c,name:n,validation:o,onValueChange:a})=>{const{control:p}=F(),{error:m}=V(n);return e.createElement($,{css:d},e.createElement(b,{as:"legend",css:{p:0,mb:"$3"},required:Boolean(o==null?void 0:o.required)},c),l&&e.createElement(C,{css:{mb:"$3"}},l),e.createElement(g,{control:p,name:n,rules:o,defaultValue:t,render:({onChange:f,value:E})=>e.createElement(h,{direction:u,defaultValue:t,onValueChange:i=>{f(i),a==null||a(i)},value:E},s)}),m&&e.createElement(v,{css:{mt:"$2"}},m))};r.Item=R,r.displayName="RadioButtonField";export{r as RadioButtonField};

package/dist/components/search-field/SearchField.d.ts

@@ -1,15 +1,6 @@
 import * as React from 'react';
-import { ValidationOptions } from '../../components/form';
+import { FieldElementWrapperProps } from '../../components/field-wrapper';
 import { SearchInputProps } from '../../components/search-input';
-declare type SearchFieldProps = SearchInputProps & {
-    description?: string;
-    label: string;
-    name: string;
-    prompt?: {
-        link: string;
-        label: string;
-    };
-    validation?: ValidationOptions;
-};
+declare type SearchFieldProps = SearchInputProps & FieldElementWrapperProps;
 export declare const SearchField: React.FC<SearchFieldProps>;
 export {};

package/dist/components/search-input/SearchInput.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { Input } from '../../components/input';
 import { CSS } from '../../stitches';
 export declare type SearchInputProps = React.ComponentProps<typeof Input> & {
-    size: 'sm' | 'md';
+    size?: 'sm' | 'md';
     css?: CSS;
     value?: string;
     clearText?: string;

package/dist/components/select-field/SelectField.d.ts

@@ -1,15 +1,6 @@
 import * as React from 'react';
-import { FieldWrapperProps } from '../../components/field-wrapper';
-import { ValidationOptions } from '../../components/form';
+import { FieldElementWrapperProps } from '../../components/field-wrapper';
 import { SelectProps } from '../../components/select';
-declare type SelectFieldProps = SelectProps & FieldWrapperProps & {
-    description?: string;
-    name: string;
-    prompt?: {
-        link: string;
-        label: string;
-    };
-    validation?: ValidationOptions;
-};
+declare type SelectFieldProps = SelectProps & FieldElementWrapperProps;
 export declare const SelectField: React.FC<SelectFieldProps>;
 export {};

package/dist/components/select-field/SelectField.js

@@ -1 +1 @@
-import*as i from"react";import{useFormContext as u}from"react-hook-form";import{FieldWrapper as F}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as b}from"../form/useFieldError.js";import{Select as h}from"../select/Select.js";const l=({css:m=void 0,children:d,name:e,label:p,validation:r,prompt:a,description:n,hideLabel:s,...c})=>{const{register:o}=u(),{error:t}=b(e),f=r?o(r):o;return i.createElement(F,{css:m,description:n,error:t,fieldId:e,label:p,prompt:a,required:Boolean(r==null?void 0:r.required),hideLabel:s},i.createElement(h,{name:e,id:e,...c,ref:f,...t&&{state:"error"}},d))};l.displayName="SelectField";export{l as SelectField};
+import*as t from"react";import{useFormContext as u}from"react-hook-form";import{FieldWrapper as F}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as b}from"../form/useFieldError.js";import{Select as h}from"../select/Select.js";const l=({css:m=void 0,children:d,name:e,label:p,validation:r,prompt:a,description:n,hideLabel:s,...c})=>{const{register:o}=u(),{error:i}=b(e),f=r?o(r):o;return t.createElement(F,{css:m,description:n,error:i,fieldId:e,label:p,prompt:a,required:Boolean(r==null?void 0:r.required),hideLabel:s},t.createElement(h,{name:e,id:e,...c,ref:f,...i&&{state:"error"}},d))};l.displayName="SelectField";export{l as SelectField};

package/dist/components/slider-field/SliderField.d.ts

@@ -1,13 +1,8 @@
 import React from 'react';
+import { FieldElementWrapperProps } from '../../components/field-wrapper';
 import { SliderProps } from '../../components/slider';
 import { SliderStepsType } from '../../components/slider/SliderSteps';
-import type { CSS } from '../../stitches';
 import { SliderValueType } from '../slider/SliderValue';
-declare type SliderFieldProps = SliderProps & SliderStepsType & SliderValueType & {
-    css?: CSS;
-    label: string;
-    name: string;
-    defaultValue: number[];
-};
+declare type SliderFieldProps = SliderProps & SliderStepsType & SliderValueType & FieldElementWrapperProps;
 export declare const SliderField: React.FC<SliderFieldProps>;
 export {};

package/dist/components/slider-field/SliderField.js

@@ -1 +1 @@
-import e from"react";import{useFormContext as x,Controller as E}from"react-hook-form";import{FieldWrapper as V}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import{Slider as l}from"../slider/Slider.js";const n=({css:u,label:i,name:t,defaultValue:a,outputLabel:d,min:r=0,max:m=100,steps:p=[],...s})=>{const{control:c}=x();return e.createElement(V,{css:u,fieldId:t,label:i},e.createElement(E,{control:c,name:t,defaultValue:a,render:({onChange:f,value:o})=>e.createElement(l,{name:t,defaultValue:a,onValueChange:f,value:o,min:r,max:m,...s},e.createElement(l.Steps,{min:r,max:m,steps:p}),e.createElement(l.Value,{value:o||a,outputLabel:d}))}))};n.displayName="SliderField";export{n as SliderField};
+import e from"react";import{useFormContext as x,Controller as E}from"react-hook-form";import{FieldWrapper as V}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import{Slider as l}from"../slider/Slider.js";const n=({css:u,label:i,name:t,defaultValue:a,outputLabel:p,min:r=0,max:m=100,steps:d=[],...s})=>{const{control:c}=x();return e.createElement(V,{css:u,fieldId:t,label:i},e.createElement(E,{control:c,name:t,defaultValue:a,render:({onChange:f,value:o})=>e.createElement(l,{name:t,defaultValue:a,onValueChange:f,value:o,min:r,max:m,...s},e.createElement(l.Steps,{min:r,max:m,steps:d}),e.createElement(l.Value,{value:o||a,outputLabel:p}))}))};n.displayName="SliderField";export{n as SliderField};

package/dist/components/textarea-field/TextareaField.d.ts

@@ -1,10 +1,6 @@
 import * as React from 'react';
-import type { FieldWrapperProps } from '../../components/field-wrapper';
-import { ValidationOptions } from '../../components/form';
+import { FieldElementWrapperProps } from '../../components/field-wrapper';
 import { TextareaProps } from '../../components/textarea';
-declare type TextareaFieldProps = TextareaProps & FieldWrapperProps & {
-    name: string;
-    validation?: ValidationOptions;
-};
+declare type TextareaFieldProps = TextareaProps & FieldElementWrapperProps;
 export declare const TextareaField: React.FC<TextareaFieldProps>;
 export {};